.diy-landing-banner{position:relative;isolation:isolate;width:100%;overflow:hidden;background:#243c2c}
.diy-landing-banner__image{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:65% 60%;display:block}
.diy-landing-banner__shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(23,43,31,.92) 0%,rgba(23,43,31,.82) 60%,rgba(23,43,31,.35) 82%,rgba(23,43,31,.08) 100%)}
.diy-landing-banner__content{position:relative;display:flex;align-items:center;min-height:var(--diy-banner-height,260px);padding-top:24px;padding-bottom:24px;box-sizing:border-box;color:#fff}
.diy-landing-banner__copy{width:100%;max-width:610px}
.diy-landing-banner__copy:before{content:"";display:block;width:48px;height:4px;background:#e97725;margin-bottom:16px}
.diy-landing-banner__title{color:inherit;font-size:clamp(30px,3.5vw,46px);line-height:1.15;letter-spacing:-.02em;margin:0;font-weight:700}
.diy-landing-banner__slogan{color:inherit;font-size:clamp(18px,1.8vw,23px);line-height:1.4;margin:10px 0 0;max-width:570px}
.diy-landing-banner__button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 22px;box-sizing:border-box;margin-top:18px;background:#f5f6f2;color:#243c2c;text-decoration:none;border-radius:5px;font-weight:700}
.diy-landing-banner__button:hover{background:#fff}
.diy-landing-banner__button:focus-visible{outline:3px solid #e97725;outline-offset:3px}
@media(max-width:749px){
.diy-landing-banner{background:#f5f6f2}
.diy-landing-banner__image{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:4/1;object-fit:cover;object-position:70% 60%}
.diy-landing-banner__shade{display:none}
.diy-landing-banner__content{min-height:0;padding:16px 20px 20px;color:#243c2c}
.diy-landing-banner__copy{max-width:none}
.diy-landing-banner__copy:before{width:36px;height:3px;margin-bottom:10px}
.diy-landing-banner__title{font-size:28px;line-height:1.15}
.diy-landing-banner__slogan{font-size:17px;line-height:1.4;margin-top:8px}
.diy-landing-banner__button{margin-top:14px;background:#243c2c;color:#fff}
.diy-landing-banner__button:hover{background:#385640}
}
.diy-landing-banner__logo-wrap{display:inline-block;line-height:0;background:rgba(255,255,255,.97);padding:8px 12px;border-radius:6px;margin:0 0 12px;max-width:100%;box-sizing:border-box}
.diy-landing-banner__logo{display:block;width:210px;height:auto;max-width:100%;object-fit:contain}
@media(max-width:749px){
.diy-landing-banner__copy{display:grid;grid-template-columns:minmax(0,1fr) clamp(120px,38vw,150px);column-gap:12px;align-items:center}
.diy-landing-banner__copy:before{display:none}
.diy-landing-banner__logo-wrap{grid-column:2;grid-row:1;margin:0;padding:0;background:transparent;border-radius:0}
.diy-landing-banner__logo{width:100%;height:auto}
.diy-landing-banner__title{grid-column:1;grid-row:1;font-size:25px}
.diy-landing-banner__slogan{grid-column:1/-1;grid-row:2;margin-top:10px}
}

.diy-landing-banner--collection .diy-landing-banner__copy{max-width:52%}
.diy-landing-banner--collection .diy-landing-banner__title{font-size:clamp(26px,2.8vw,36px);overflow-wrap:anywhere}
.diy-collection-banner__art{position:absolute;inset:0 0 0 53%;overflow:hidden}
.diy-collection-banner__art:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#243c2c 0%,rgba(36,60,44,.25) 12%,transparent 32%);pointer-events:none}
.diy-collection-banner__image{display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center 60%}
@media(max-width:749px){
.diy-collection-banner__art{position:relative;inset:auto;width:100%;height:128px}
.diy-collection-banner__art:after{display:none}
.diy-landing-banner--collection .diy-landing-banner__copy{max-width:none}
.diy-landing-banner--collection .diy-landing-banner__title{font-size:22px;line-height:1.2}
}
