/* Complete photographs share one grid cell with the live content. */
.scene-picture { display: block; width: 100%; position: relative; inset: auto; height: auto; aspect-ratio: auto; grid-area: 1 / 1; }
.scene-picture img { display: block; position: static; width: 100%; max-width: 100%; height: auto; object-fit: contain; transform: none; }
.header--outdoor { display: grid; grid-template-columns: minmax(0, 1fr); background: #243746 url('../img/scene-terrain.webp') center bottom / 100% auto no-repeat; }
.header--outdoor .header__scene { display: block; grid-area: 1 / 1; position: relative; inset: auto; width: 100%; max-width: none; aspect-ratio: auto; z-index: -2; }
.header--outdoor .header__scene img { width: 100%; height: auto; aspect-ratio: auto; object-fit: contain; object-position: center; }
.header--outdoor .header__container { display: block; grid-area: 1 / 1; width: 100%; min-height: 620px; }
.header--outdoor::before { content: ''; background: linear-gradient(90deg, rgba(9,18,24,.65), rgba(9,18,24,.28) 30%, transparent 60%); }
.header--outdoor::after { content: ''; inset: auto 0 0; height: 70px; background: linear-gradient(transparent, rgba(12,28,38,.42)); }
.materials { position: relative; background: #faf7f0; padding-top: 12px; }
.materials__top { display: block; max-width: 1440px; margin-inline: auto; }
.materials__heading { position: static; max-width: none; padding: 48px 4.7% 34px; }
.materials__heading h2 { font-size: clamp(32px, 4.2vw, 66px); }
.material-grid { max-width: 1440px; margin-inline: auto; padding-bottom: 60px; }
.video-section { isolation: isolate; overflow: hidden; background: #2b3d48 url('../img/scene-terrain.webp') center / cover no-repeat; }
.video-section::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(90deg, rgba(9,23,33,.22), rgba(9,23,33,.64) 66%, rgba(9,23,33,.75)); }
.video-section::after { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(rgba(15,33,44,.3), transparent 16%, transparent 84%, rgba(15,33,44,.4)); }
.video-layout { max-width: 1600px; margin-inline: auto; gap: 4vw; padding: 5% 4.7%; }
.video-frame { border: 1px solid rgba(255,255,255,.45); border-radius: 4px; box-shadow: 0 16px 40px rgba(6,18,25,.22); }
.video-copy { position: relative; padding: 0; text-shadow: 0 2px 15px rgba(7,22,31,.3); }
.features { display: grid; grid-template-columns: minmax(0,1fr); isolation: isolate; position: relative; background: #31424a url('../img/scene-terrain.webp') center bottom / cover no-repeat; }
.features__scene { z-index: -2; align-self: start; }
.features::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(10,27,36,.52), transparent 58%), linear-gradient(transparent 52%, rgba(10,27,36,.65) 74%, rgba(10,27,36,.68)); pointer-events: none; }
.features__content { display: flex; flex-direction: column; grid-area: 1 / 1; position: relative; min-height: 50vw; }
.features__top { min-height: 34vw; }
.features__heading { position: static; max-width: 50%; padding: 4.2vw 0 0 4.7%; text-shadow: 0 2px 15px rgba(7,22,31,.35); }
.features__heading h2 { font-size: clamp(38px,5.3vw,92px); }
.feature-grid { background: transparent; margin-top: auto; padding: 24px 4.7% 34px; gap: 2.5%; }
.feature-grid article { gap: 16px; }
.feature-grid article + article { border-color: rgba(231,239,240,.45); padding-left: 20px; }
.feature-grid p { color: #eef3f4; }
.order-card { --order-gutter: clamp(24px, 3.85vw, 72px); position: relative; isolation: isolate; padding-inline: var(--order-gutter); background: #2d4352 url('../img/scene-terrain.webp') center / cover no-repeat; }
.order-card::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(rgba(12,30,42,.59), rgba(12,30,42,.61)); }
.product-specs dt { color: #d0dbe0; }
.order-product-scene { width: auto; max-width: none; margin: 0 calc(-1 * var(--order-gutter)) 18px; }
.order-product-scene img { display: block; position: static; width: 100%; max-width: 100%; height: auto; object-fit: contain; -webkit-mask-image: linear-gradient(to bottom, transparent, #000 28px, #000 calc(100% - 16px), transparent); mask-image: linear-gradient(to bottom, transparent, #000 28px, #000 calc(100% - 16px), transparent); }
.delivery, .final { display: grid; grid-template-columns: minmax(0,1fr); position: relative; isolation: isolate; min-height: 0; }
.delivery__scene, .final__scene { z-index: -2; align-self: start; }
.delivery-content, .final-content { grid-area: 1 / 1; align-self: start; position: relative; }
.delivery { background: #263b48 url('../img/scene-terrain.webp') center bottom / cover no-repeat; }
.delivery::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(rgba(12,28,40,.48), rgba(12,28,40,.2) 42%, transparent 65%), linear-gradient(transparent 90%, rgba(21,41,53,.5)); pointer-events: none; }
.delivery-content { padding: 4.4% 4.7% 15%; }
.final { background: #263b48 url('../img/scene-terrain.webp') center bottom / cover no-repeat; }
.final::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(9,24,35,.57), rgba(9,24,35,.22) 44%, transparent 67%), linear-gradient(rgba(21,41,53,.48), transparent 12%); pointer-events: none; }
.final-content { padding-bottom: 34px; }
.final .price__old, .header--outdoor .price__old { color: #e4ebef; text-shadow: 0 1px 6px rgba(8,25,35,.8); }
.final-note, .delivery-grid h3, .delivery-grid p { color: #f3f6f8; text-shadow: 0 1px 7px rgba(8,25,35,.8); }
.delivery::after { content: ''; position: absolute; inset: auto 0 0; height: 70px; z-index: -1; background: linear-gradient(transparent, #233b4c); pointer-events: none; }
.final::after { content: ''; position: absolute; inset: 0 0 auto; height: 70px; z-index: -1; background: linear-gradient(#233b4c, transparent); pointer-events: none; }

@media (min-width: 901px) and (max-width: 1100px) {
    .header--outdoor .header__container { display: block; padding: 28px 32px 32px; min-height: 610px; }
    .header--outdoor .header__logo { justify-content: space-between; padding: 0; }
    .header--outdoor .header__season { display: block; }
    .header--outdoor .header__intro { max-width: 420px; padding: 35px 0 0; text-align: left; }
    .header--outdoor .header__intro, .header--outdoor .header__wrap { justify-self: start; align-self: start; }
    .header--outdoor h1 { text-align: left; font-size: clamp(48px,6.1vw,64px); }
    .header--outdoor .header__subtitle { font-size: 16px; }
    .header--outdoor .header__wrap { max-width: 350px; padding: 0; margin-top: 24px; text-align: left; }
    .header--outdoor .price, .header--outdoor .header__perks { justify-content: flex-start; }
    .header--outdoor .header__text { text-align: left; }
    .header--outdoor::before { background: linear-gradient(90deg, rgba(9,23,32,.72), rgba(9,23,32,.25) 43%, transparent 67%); }
    .features__top { min-height: 50vw; }
    .features__heading { max-width: 49%; padding-top: 4vw; }
    .features__heading h2 { font-size: clamp(33px,5vw,53px); }
    .features__heading > p:last-child { font-size: 16px; }
    .features::before { background: linear-gradient(90deg, rgba(10,27,36,.53), transparent 58%), linear-gradient(transparent 40%, rgba(10,27,36,.65) 69%, rgba(10,27,36,.62)); }
    .feature-grid { padding: 28px 4.7% 38px; }
    .feature-grid article { display: block; }
    .feature-number { display: block; margin-bottom: 14px; }
    .feature-grid svg { width: 28px; }
    .feature-grid h3 { font-size: 15px; }
    .feature-grid p { font-size: 12px; }
    .delivery-content { padding-bottom: 20%; }
    .delivery-heading h2 { font-size: 5.2vw; }
    .delivery-grid { gap: 18px; }
    .delivery-grid h3 { font-size: 16px; }
    .delivery-grid p { font-size: 12px; }
    .final-content { width: 50%; padding-top: 28px; }
    .final h2 { font-size: 4.8vw; }
    .final-logo { width: 170px; }
}

@media (max-width: 900px) {
    .header--outdoor .header__scene { grid-area: 1 / 1; align-self: stretch; }
    .header--outdoor .header__container { display: flex; flex-direction: column; align-items: center; grid-area: 1 / 1; padding: 26px 24px 24px; min-height: 0; max-width: none; }
    .header--outdoor::before { content: ''; background: linear-gradient(rgba(12,30,42,.42), rgba(12,30,42,.08) 22%, transparent 38%, transparent 65%, rgba(12,30,42,.55) 81%, rgba(12,30,42,.7)); }
    .header--outdoor::after { content: none; }
    .header--outdoor .header__logo { padding: 0; height: auto; justify-content: center; }
    .header--outdoor .header__logo img { height: 29px; }
    .header--outdoor .header__intro { padding: 25px 0 0; }
    .header--outdoor h1 { font-size: clamp(42px,12vw,64px); }
    .header--outdoor .header__wrap { margin-top: auto; padding: 0; max-width: 400px; }
    .header--outdoor .price { flex-wrap: wrap; }
    .header--outdoor .header__text { color: #e1e8ec; }
    .materials__heading { padding: 34px 24px 16px; }
    .materials__heading h2 { font-size: clamp(28px,8.2vw,48px); }
    .material-grid { padding: 14px 24px 38px; }
    .video-section { background-position: 45% center; }
    .video-section::before { background: linear-gradient(rgba(10,27,38,.2), rgba(10,27,38,.35) 30%, rgba(10,27,38,.65) 52%, rgba(10,27,38,.62)); }
    .video-layout { padding: 30px 20px 38px; gap: 30px; }
    .video-copy h2 { font-size: clamp(36px,10vw,56px); }
    .video-lead { font-size: 16px; margin: 24px 0; }
    .features__content { min-height: 0; padding: 34px 24px 34px; }
    .features__top { min-height: 0; }
    .features__heading { padding: 0; max-width: none; }
    .features__heading h2 { font-size: clamp(31px,8.5vw,50px); }
    .features__heading > p:last-child { margin-top: 20px; font-size: 16px; }
    .features::before { background: linear-gradient(rgba(12,30,40,.48), rgba(12,30,40,.12) 20%, transparent 32%, transparent 48%, rgba(12,30,40,.35) 54%, rgba(12,30,40,.62) 61%, rgba(12,30,40,.74)); }
    .feature-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 26px 22px; padding: 0; margin-top: auto; text-shadow: 0 1px 6px rgba(8,25,35,.8); }
    .feature-grid article, .feature-grid article + article { display: block; border: 0; padding: 0; }
    .feature-number { font-size: 25px; margin-bottom: 10px; }
    .feature-grid svg { width: 28px; margin-bottom: 10px; }
    .feature-grid h3 { font-size: 15px; margin-bottom: 8px; }
    .feature-grid p { font-size: 12px; line-height: 1.65; }
    .order-card { background-image: url('../img/scene-terrain.webp'); background-position: 44% center; }
    .order-card::before { background: linear-gradient(rgba(12,30,42,.58), rgba(12,30,42,.66)); }
    .delivery-content { padding: 34px 24px 0; }
    .delivery::before { background: linear-gradient(rgba(12,30,42,.34), rgba(12,30,42,.25) 43%, transparent 65%, transparent 88%, rgba(24,47,60,.45)); }
    .delivery-heading { display: block; margin-bottom: 20px; }
    .delivery-heading h2 { font-size: clamp(28px,8vw,48px); }
    .delivery-heading > p { margin-top: 14px; font-size: 9px; }
    .delivery-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px 22px; }
    .delivery-step { font-size: 30px; margin-bottom: 14px; }
    .delivery-grid h3 { font-size: 16px; margin-bottom: 9px; }
    .delivery-grid p { font-size: 12px; }
    .final::before { background: linear-gradient(rgba(24,47,60,.62), rgba(12,30,42,.22) 36%, transparent 58%, transparent 88%, rgba(12,30,42,.28)); }
    .final-content { width: 100%; padding: 30px 24px 0; }
    .final-logo { width: 170px; margin-bottom: 20px; }
    .final .eyebrow { margin-bottom: 18px; }
    .final h2 { font-size: clamp(34px,10.4vw,54px); margin-bottom: 22px; }
    .final .price { margin-bottom: 18px; }
    .final .price__new { font-size: 21px; }
    .final .price__new span { font-size: 48px; }
    .final .price__old { font-size: 18px; margin-top: 3px; }
    .final .button { min-height: 58px; font-size: 15px; }
    .final-note { font-size: 12px; margin-top: 12px; }
}
@media (max-width: 350px) {
    .header--outdoor .header__container { padding: 24px 18px 20px; }
    .materials__heading, .material-grid, .features__content, .delivery-content, .final-content { padding-left: 18px; padding-right: 18px; }
    .features__content { padding-block: 28px; }
    .feature-grid { gap: 18px 18px; }
    .feature-grid h3 { font-size: 14px; margin-bottom: 6px; }
    .feature-grid p { font-size: 11px; line-height: 1.55; }
    .feature-number { font-size: 23px; margin-bottom: 6px; }
    .feature-grid svg { width: 22px; margin-bottom: 6px; }
    .delivery-content { padding-top: 28px; }
    .delivery-grid h3 { font-size: 14px; }
    .delivery-grid p { font-size: 11px; }
    .delivery-step { font-size: 27px; }
    .final-content { padding-top: 20px; }
    .final-logo { width: 150px; margin-bottom: 16px; }
    .final .eyebrow { margin-bottom: 14px; }
    .final h2 { font-size: 34px; margin-bottom: 14px; }
    .final .price__new span { font-size: 44px; }
}
@media (min-width: 901px) {
    .delivery-content { padding: clamp(24px,2.2vw,40px) 4.7% 14%; }
    .delivery-heading { margin-bottom: clamp(20px,1.7vw,30px); }
    .delivery-heading h2 { font-size: clamp(38px,4.1vw,70px); }
    .delivery-step { font-size: clamp(26px,2.1vw,38px); margin-bottom: 14px; }
    .delivery-grid h3 { font-size: clamp(15px,1.2vw,22px); margin-bottom: 9px; }
    .delivery-grid p { font-size: clamp(12px,1vw,18px); line-height: 1.5; }
}
@media (min-width: 901px) and (max-width: 1100px) {
    .header--outdoor .header__scene, .final__scene { mask-image: linear-gradient(#000 calc(100% - 40px), transparent); }
}

@media (min-width: 901px) and (max-width: 1200px) {
    .order-card { --order-gutter: 2.994vw; }
}
@media (max-width: 900px) {
    .order-card { --order-gutter: max(24px, 8vw); padding-inline: var(--order-gutter); }
}
@media (max-width: 760px) {
    .order-card { --order-gutter: 24px; }
}
@media (max-width: 350px) {
    .order-card { --order-gutter: 18px; }
}