/* boxspringqueen.com — tokens pulled from _ref-dna.json (warbyparker.com) */
@font-face{font-family:"Figtree";src:url(fonts/figtree.woff2) format("woff2");font-weight:400 700;font-style:normal;font-display:swap}
@font-face{font-family:"Source Serif 4";src:url(fonts/source-serif-4.woff2) format("woff2");font-weight:300 500;font-style:normal;font-display:swap}

:root{
  --white:#ffffff;
  --cream:#faf8f5;          /* ref bg #2 */
  --fog:#f6f7f5;            /* ref bg */
  --line:#e1e5e6;           /* ref border/bg */
  --ink:#121212;            /* ref text */
  --ink-2:#3a434c;          /* ref secondary text */
  --navy:#041540;           /* ref ink-500, dark band */
  --navy-2:#072369;         /* ref ink-300 */
  --blue:#1050d0;           /* ref blueprint-300 = accent */
  --blue-d:#0b3892;         /* ref blueprint-400 */
  --blue-50:#e7eefa;        /* ref blueprint-50 */
  --green:#09624d;          /* ref promo text */
  --mint:#e4efea;
  --line-warm:#e3ddd3;
  --ph-a:#efe9e0; --ph-b:#e6ded2;

  --f-display:"Source Serif 4", "Iowan Old Style", Georgia, serif;
  --f-text:"Figtree", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;

  --r-pill:100px; --r-card:16px; --r-sm:12px; --r-xs:4px;
  --sh-1:0 1px 4px rgba(0,0,0,.04), 0 4px 12px rgba(0,0,0,.02);
  --sh-2:0 2px 8px rgba(18,18,18,.08);
  --sh-3:0 8px 12px rgba(18,18,18,.12), 0 1px 4px rgba(18,18,18,.12);
  --ease:cubic-bezier(.4,0,.2,1);
  --ease-out:cubic-bezier(.16,1,.3,1);

  --wrap:1240px;
  --gut:clamp(20px,4vw,48px);
  --sec:clamp(72px,9vw,128px);
  --header-h:72px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--header-h) + 12px)}
body{margin:0;background:var(--white);color:var(--ink);font-family:var(--f-text);font-size:1.0625rem;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;display:block}
a{color:inherit}
p{margin:0 0 1em}
h1,h2,h3,h4{margin:0}
ul,ol{margin:0;padding:0}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--navy);color:#fff;padding:10px 16px;border-radius:var(--r-pill);text-decoration:none}
.skip:focus{top:12px}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:6px}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}

/* ---------- type ---------- */
.display{font-family:var(--f-display);font-weight:300;font-size:clamp(2.5rem,5.2vw,4.375rem);line-height:1.02;letter-spacing:-.025em;font-variation-settings:"opsz" 60;text-wrap:balance;color:var(--ink)}
.display__soft{display:block;color:var(--ink-2)}
.h2{font-family:var(--f-display);font-weight:350;font-size:clamp(2rem,3.4vw,3rem);line-height:1.08;letter-spacing:-.02em;font-variation-settings:"opsz" 60;text-wrap:balance}
.h3{font-family:var(--f-text);font-weight:700;font-size:1.25rem;line-height:1.4;letter-spacing:-.01em;margin:0 0 .5em}
.prose .h3{margin-top:1.8em}
.lede{font-size:1.1875rem;line-height:1.55;color:var(--ink)}
.section-head{max-width:760px;margin-bottom:clamp(36px,5vw,64px)}
.section-head--wide{max-width:880px}
.section-head .h2{margin-bottom:.45em}
.section-head__sub{font-size:1.125rem;color:var(--ink-2);max-width:62ch;margin:0}
.microcopy{font-size:.9375rem;color:var(--ink-2);margin:.9em 0 0}
.prose p{max-width:68ch;color:var(--ink-2)}
.prose .lede{color:var(--ink)}
strong{font-weight:650;color:var(--ink)}

/* ---------- buttons ---------- */
.btn{--bg:var(--blue);--fg:#fff;position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:.55em;min-height:48px;padding:0 26px;border-radius:var(--r-pill);border:1.5px solid transparent;background:var(--bg);color:var(--fg);font:600 1rem/1 var(--f-text);letter-spacing:.005em;text-decoration:none;cursor:pointer;white-space:nowrap;transition:background-color .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease),box-shadow .3s var(--ease),transform .2s var(--ease)}
.btn--primary{box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 1px 2px rgba(4,21,64,.18),0 6px 16px -6px rgba(16,80,208,.55)}
.btn--primary::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.28) 48%,transparent 66%);transform:translateX(-120%);transition:transform .7s var(--ease-out)}
.btn--primary:hover{--bg:var(--blue-d);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 2px 4px rgba(4,21,64,.2),0 10px 22px -8px rgba(16,80,208,.6)}
.btn--primary:hover::after{transform:translateX(120%)}
.btn:active{transform:translateY(1px) scale(.985)}
.btn__arrow{flex:none;transition:transform .35s var(--ease-out)}
.btn:hover .btn__arrow{transform:translateX(4px)}
.btn--ghost{--bg:transparent;--fg:var(--navy);border-color:rgba(4,21,64,.28)}
.btn--ghost:hover{--bg:var(--navy);--fg:#fff;border-color:var(--navy)}
.btn--sm{min-height:44px;padding:0 20px;font-size:.9375rem}
.btn--lg{min-height:56px;padding:0 34px;font-size:1.0625rem}
.btn--block{width:100%}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.cta-inline{margin-top:28px}
.cta-inline--center{text-align:center;margin-top:44px}
.cta-inline__lead{font-weight:600;color:var(--ink);margin-bottom:14px}

/* ---------- header ---------- */
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);border-bottom:1px solid transparent;transition:border-color .3s var(--ease),box-shadow .3s var(--ease)}
@supports (backdrop-filter:blur(8px)){.site-header{background:rgba(255,255,255,.96);backdrop-filter:saturate(1.4) blur(12px)}}
.site-header.is-scrolled{border-bottom-color:var(--line);box-shadow:0 1px 0 rgba(0,0,0,.02)}
.site-header__inner{max-width:1440px;margin:0 auto;height:var(--header-h);padding:0 var(--gut);display:flex;align-items:center;gap:32px}
.wordmark{display:inline-flex;align-items:center;min-height:44px;gap:10px;text-decoration:none;color:var(--navy);flex:none}
.wordmark__mark{display:inline-flex;color:var(--navy)}
.wordmark__text{font:500 .9375rem/1 var(--f-text);text-transform:uppercase;letter-spacing:.22em}
.primary-nav{margin-right:auto}
.primary-nav ul{list-style:none;display:flex;gap:4px}
.primary-nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;font-weight:600;font-size:.9375rem;color:var(--ink);text-decoration:none;border-radius:var(--r-pill);transition:background-color .2s var(--ease),color .2s var(--ease)}
.primary-nav a:hover{background:var(--fog);color:var(--blue)}
.site-header__actions{display:flex;align-items:center;gap:10px;margin-left:auto}
.burger{display:none;width:44px;height:44px;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--white);cursor:pointer;position:relative;transition:border-color .25s var(--ease),background-color .25s var(--ease)}
.burger span{position:absolute;left:12px;right:12px;height:1.5px;border-radius:2px;background:var(--navy);transition:transform .35s var(--ease-out),opacity .2s var(--ease),background-color .25s var(--ease)}
.burger span:nth-child(1){top:15px}.burger span:nth-child(2){top:21px}.burger span:nth-child(3){top:27px;right:18px}
.burger:hover{border-color:var(--blue)}
.burger:hover span{background:var(--blue)}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){right:12px;transform:translateY(-6px) rotate(-45deg)}
.mobile-nav{border-top:1px solid var(--line);background:var(--white);box-shadow:var(--sh-3)}
.mobile-nav ul{list-style:none;padding:8px var(--gut) 16px}
.mobile-nav a{display:flex;align-items:center;min-height:52px;border-bottom:1px solid var(--line);text-decoration:none;font-weight:600;font-size:1.0625rem}
.mobile-nav li:last-child a{border-bottom:0}
.mobile-nav a:hover{color:var(--blue)}

/* ---------- hero ---------- */
.hero{position:relative;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);grid-template-rows:1fr auto;background:var(--cream);min-height:min(800px,calc(100svh - var(--header-h)))}
.hero__copy{grid-column:1;grid-row:1;align-self:center;padding:clamp(40px,5vw,72px) clamp(24px,4vw,64px) clamp(28px,3vw,48px) max(var(--gut),calc((100vw - 1440px)/2 + var(--gut)));position:relative;z-index:2}
.hero__copy .display{margin-right:-18%}
.hero__lead{margin-top:28px;max-width:46ch;color:var(--ink-2);font-size:1.0625rem}
.hero__media{grid-column:2;grid-row:1 / span 2;position:relative}
.hero__media .media{position:absolute;inset:0;border-radius:0}
.hero__media::after{content:"";position:absolute;left:0;right:0;bottom:0;height:42%;z-index:1;background:linear-gradient(to top,rgba(4,21,64,.62),rgba(4,21,64,0));pointer-events:none}
.hero__facts{grid-column:1 / -1;grid-row:2;position:relative;z-index:2;list-style:none;display:grid;grid-template-columns:minmax(0,5fr) repeat(3,minmax(0,2.33fr));gap:0;color:#fff;padding:0 max(var(--gut),calc((100vw - 1440px)/2 + var(--gut))) 24px;pointer-events:none}
.hero__facts li:not(:first-child){padding-left:32px}
.hero__facts li{font-size:1rem;line-height:1.3;text-shadow:0 1px 8px rgba(4,21,64,.35)}
.hero__facts strong{color:#fff;display:block;font-family:var(--f-display);font-weight:400;font-size:1.5rem;letter-spacing:-.01em;font-variation-settings:"opsz" 40}
.hero__facts li:first-child{color:var(--ink-2);text-shadow:none}
.hero__facts li:first-child strong{color:var(--ink)}

/* heads-up: WP promo strip signature */
.headsup{background:var(--mint);color:var(--green)}
.headsup p{max-width:980px;margin:0 auto;padding:16px var(--gut);text-align:center;font-size:.9375rem;line-height:1.5}
.headsup strong{color:var(--green)}

/* ---------- sections ---------- */
.section{padding:var(--sec) 0}
.section--cream{background:var(--cream)}
.section--fog{background:var(--fog)}
.section--navy{background:var(--navy);color:#fff}
.split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,96px);align-items:start}
.split__head{position:sticky;top:calc(var(--header-h) + 40px)}

/* media placeholders */
.media{margin:0;position:relative;overflow:hidden;border-radius:var(--r-card);background:var(--ph-a)}
.media--wide{aspect-ratio:3/2}
.media--square{aspect-ratio:1/1}
.media--banner{aspect-ratio:21/8;margin-bottom:40px}
.media--hero{aspect-ratio:auto}
.media img,.ph{position:absolute;inset:0;width:100%;height:100%}
.media img{object-fit:cover}
.ph{display:flex;align-items:flex-end;justify-content:flex-start;padding:16px;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 60'%3E%3Cg fill='none' stroke='%23b9ab96' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 44h104M8 44V20M112 44v-9M14 52v-8M106 52v-8M16 36h92a4 4 0 0 1 4 4v4H16zM16 36V28a4 4 0 0 1 4-4h18a4 4 0 0 1 4 4v8'/%3E%3C/g%3E%3C/svg%3E") center / clamp(72px,22%,150px) auto no-repeat,
    repeating-linear-gradient(90deg,rgba(255,255,255,.18) 0 1px,transparent 1px 7px),
    linear-gradient(160deg,var(--ph-a),var(--ph-b))}
.ph--dark{background-color:#0c2150}
.ph__tag{font:600 .6875rem/1 var(--f-text);letter-spacing:.08em;text-transform:uppercase;color:#6b5f4f;background:rgba(255,255,255,.72);padding:7px 10px;border-radius:var(--r-pill)}

/* decision */
.verdict{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2vw,24px);margin-bottom:36px}
.verdict__col{background:var(--white);border-radius:var(--r-card);padding:clamp(24px,3vw,40px);box-shadow:var(--sh-1)}
.verdict__col--no{background:transparent;box-shadow:none;border:1px solid var(--line);border-color:var(--line-warm)}
.verdict__title{display:flex;align-items:center;gap:10px;font-weight:700;font-size:1.1875rem;margin-bottom:18px;color:var(--ink)}
.verdict__col--yes .verdict__title svg{color:var(--blue)}
.verdict__col--no .verdict__title svg{color:var(--ink-2)}
.verdict ul{list-style:none;display:grid;gap:14px}
.verdict li{position:relative;padding-left:22px;color:var(--ink-2)}
.verdict li::before{content:"";position:absolute;left:2px;top:.72em;width:8px;height:1.5px;background:currentColor;opacity:.6}
.note-para{max-width:74ch;color:var(--ink-2);margin-bottom:clamp(48px,6vw,80px)}
.feature{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,5vw,72px);align-items:center}
.feature__text{display:grid;gap:26px}
.feature__text p{color:var(--ink-2);margin:0}
.feature__text .cta-inline{margin-top:4px}

/* buying guide */
.guide{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(32px,5vw,80px);align-items:start}
.guide__main .h3:first-child{margin-top:0}
.guide__side{display:grid;gap:20px;position:sticky;top:calc(var(--header-h) + 32px)}
.panel{background:var(--cream);border-radius:var(--r-card);padding:clamp(24px,3vw,36px)}
.panel p{color:var(--ink-2)}
.panel .btn{margin-top:6px}

.table-wrap{margin:24px 0 28px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.table{width:100%;border-collapse:collapse;font-size:.9875rem}
.table th,.table td{text-align:left;padding:14px 16px;border-bottom:1px solid var(--line);vertical-align:middle}
.table thead th{font-size:.8125rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2);border-bottom:1.5px solid var(--ink)}
.table--simple td:last-child{font-weight:600;color:var(--ink)}
.table--simple td:first-child{color:var(--ink-2)}
.table tbody tr{transition:background-color .2s var(--ease)}
.table tbody tr:hover{background:var(--cream)}

/* picks */
.group-title{font-family:var(--f-display);font-weight:400;font-size:1.625rem;letter-spacing:-.01em;margin:0 0 24px;font-variation-settings:"opsz" 40}
.picks{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,2vw,24px);margin-bottom:clamp(56px,7vw,88px)}
.pick{display:flex;flex-direction:column;background:var(--white);border-radius:var(--r-card);box-shadow:var(--sh-1);overflow:hidden;transition:box-shadow .3s var(--ease),transform .3s var(--ease)}
.pick:hover{box-shadow:var(--sh-3);transform:translateY(-2px)}
.pick .media{border-radius:0}
.pick__body{display:flex;flex-direction:column;flex:1;padding:22px 22px 24px}
.pick__num{font-family:var(--f-display);font-size:.9375rem;color:var(--blue);margin:0 0 6px;font-weight:500}
.pick__num::before{content:"No. "}
.pick__title{font-family:var(--f-text);font-weight:700;font-size:1.125rem;line-height:1.3;margin:0 0 10px;text-wrap:balance}
.pick__body > p:not(.pick__num){color:var(--ink-2);font-size:.9875rem}
.specs{list-style:none;margin:2px 0 22px;border-top:1px solid var(--line)}
.specs li{font-size:.875rem;padding:9px 0;border-bottom:1px solid var(--line);color:var(--ink)}
.pick .btn{margin-top:auto}
.picks--wide{grid-template-columns:repeat(2,minmax(0,1fr))}
.pick--row{flex-direction:row}
.pick--row .media{flex:0 0 44%;aspect-ratio:auto;min-height:100%}
.pick--row .pick__body{padding:28px}
.pick--row .btn{align-self:flex-start}
.aside-note{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(20px,4vw,64px);padding-top:clamp(32px,4vw,48px);border-top:1px solid var(--line-warm)}
.aside-note .h3{font-family:var(--f-display);font-weight:400;font-size:1.625rem;letter-spacing:-.01em}
.aside-note p{color:var(--ink-2);max-width:68ch;margin:0}

/* comparison */
.table--compare{min-width:960px;font-size:.9375rem}
.table--compare tbody th{font-weight:700;color:var(--ink)}
.table--compare td{color:var(--ink-2)}
.td-cta{text-align:right}
.table--compare tbody tr:nth-child(5) td[data-label="Storage space"],.table--compare tbody tr:nth-child(6) td[data-label="Storage space"]{color:var(--green);font-weight:600}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,72px);margin-top:clamp(36px,5vw,56px)}
.two-col p{color:var(--ink-2);margin:0}

/* materials (navy band) */
.section--navy .h2{color:#fff}
.section--navy .section-head__sub{color:#c7cee0;margin:16px 0 36px}
.materials{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,96px);align-items:start}
.materials__intro{position:sticky;top:calc(var(--header-h) + 32px)}
.materials__intro .media{max-width:440px}
.materials__body{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,36px)}
.material{border-top:1px solid rgba(255,255,255,.2);padding-top:22px}
.material p{color:#d3d9e8;margin:0}
.material strong{color:#fff}
.material p.material__name{font-family:var(--f-display);font-size:2.5rem;line-height:1;font-weight:300;color:#fff;margin:0 0 18px;letter-spacing:-.02em}
.material--plain .h3{color:#fff}
.material--plain{grid-column:span 1}

/* sizing */
.sizing{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,5vw,64px);align-items:center}
.sizing .table-wrap{margin:0}
.table--sizes th[scope="row"]{font-weight:600}
.table--sizes td{color:var(--ink-2)}
.table--sizes tr.is-queen{background:var(--blue-50)}
.table--sizes tr.is-queen th,.table--sizes tr.is-queen td{color:var(--navy);font-weight:700}
.table--sizes tr.is-queen:hover{background:var(--blue-50)}
.cta-band{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-top:clamp(40px,5vw,64px);padding:clamp(24px,3vw,32px) clamp(24px,3vw,40px);background:var(--cream);border-radius:var(--r-card)}
.cta-band p{margin:0;font-family:var(--f-display);font-size:1.5rem;line-height:1.25;font-weight:400;max-width:34ch;letter-spacing:-.01em}

/* assembly */
.assembly{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(32px,6vw,96px);align-items:start}
.assembly .h2{margin-bottom:.6em}
.assembly__media{display:grid;gap:16px}
.video{position:relative;aspect-ratio:16/9;border-radius:var(--r-card);overflow:hidden;background:linear-gradient(135deg,var(--navy),var(--navy-2))}
.video img,.video iframe{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0}
.video__play{position:absolute;inset:0;margin:auto;width:72px;height:72px;border:0;padding:0;background:transparent;cursor:pointer;display:grid;place-items:center;border-radius:50%;z-index:2;transition:transform .3s var(--ease-out)}
.video__play svg{width:64px;height:64px;filter:drop-shadow(0 4px 12px rgba(0,0,0,.25))}
.video__play:hover{transform:scale(1.06)}
.video__cap{position:absolute;left:16px;bottom:12px;margin:0;color:#fff;font-size:.875rem;font-weight:600;z-index:2}
.cta-strip{display:flex;align-items:center;justify-content:center;gap:20px;flex-wrap:wrap;margin-top:clamp(48px,6vw,72px);padding-top:32px;border-top:1px solid var(--line-warm)}
.cta-strip p{margin:0;font-weight:600}

/* trust */
.trust{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,96px);align-items:start}
.trust__head .h2{margin-bottom:.45em}
.trust__media{margin-top:36px;max-width:420px}
.factors{margin:8px 0 32px;display:grid;gap:0}
.factors div{display:grid;grid-template-columns:130px 1fr;gap:20px;padding:18px 0;border-bottom:1px solid var(--line)}
.factors div:first-child{border-top:1px solid var(--line)}
.factors dt{font-weight:700}
.factors dd{margin:0;color:var(--ink-2)}
.trust__body > p{color:var(--ink-2);max-width:66ch}

/* faq */
.faq{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,96px);align-items:start}
.faq__head{position:sticky;top:calc(var(--header-h) + 32px)}
.faq__head .h2{margin-bottom:32px}
.qa{border-bottom:1px solid var(--line);background:transparent}
.qa:first-child{border-top:1px solid var(--line)}
.qa summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:64px;padding:18px 0;cursor:pointer}
.qa summary::-webkit-details-marker{display:none}
.qa summary h3{font:600 1.0625rem/1.4 var(--f-text);transition:color .2s var(--ease)}
.qa summary:hover h3{color:var(--blue)}
.qa__icon{flex:none;width:32px;height:32px;border-radius:50%;border:1px solid var(--line);background:var(--white);position:relative;transition:transform .35s var(--ease-out),background-color .25s var(--ease),border-color .25s var(--ease)}
.qa__icon::before,.qa__icon::after{content:"";position:absolute;left:50%;top:50%;width:11px;height:1.5px;background:var(--navy);transform:translate(-50%,-50%)}
.qa__icon::after{transform:translate(-50%,-50%) rotate(90deg);transition:opacity .2s var(--ease)}
.qa[open] .qa__icon{background:var(--navy);border-color:var(--navy)}
.qa[open] .qa__icon::before{background:#fff}
.qa[open] .qa__icon::after{opacity:0}
.qa p{color:var(--ink-2);margin:0;padding:0 48px 22px 0;max-width:66ch}
.faq__list .cta-inline{margin-top:40px}

/* final */
.final{position:relative;display:grid;grid-template-columns:minmax(0,1fr);min-height:640px;background:var(--navy)}
.final .media--final{position:absolute;inset:0;border-radius:0}
.final__card{position:relative;z-index:2;align-self:center;margin:clamp(48px,7vw,112px) max(var(--gut),calc((100vw - var(--wrap))/2 + var(--gut)));max-width:620px;background:var(--white);border-radius:var(--r-card);padding:clamp(28px,4vw,52px);box-shadow:var(--sh-3)}
.final__card .h2{margin-bottom:.55em;font-size:clamp(1.875rem,3vw,2.625rem)}
.final__card > p{color:var(--ink-2)}
.final__card .btn{margin-top:8px}
.disclosure{margin-top:32px;padding-top:24px;border-top:1px solid var(--line)}
.disclosure .h3{font-size:1rem}
.disclosure p{font-size:.875rem;line-height:1.6;color:var(--ink-2);margin:0}

/* footer */
.site-footer{background:var(--navy);color:#c7cee0;padding:clamp(56px,7vw,88px) 0 calc(40px + env(safe-area-inset-bottom))}
.site-footer__inner{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:36px 64px}
.wordmark--light,.wordmark--light .wordmark__text{color:#fff}
.site-footer__brand p{margin:16px 0 0;max-width:36ch;font-size:.9375rem}
.site-footer__nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:4px 28px}
.site-footer__nav a{display:inline-flex;min-height:44px;align-items:center;color:#fff;text-decoration:none;font-weight:600;font-size:.9375rem}
.site-footer__nav a:hover{text-decoration:underline;text-underline-offset:4px}
.site-footer__legal{grid-column:1 / -1;border-top:1px solid rgba(255,255,255,.16);padding-top:28px;margin:0;font-size:.875rem;line-height:1.6;max-width:110ch}
.site-footer__legal-links{grid-column:1 / -1;display:flex;flex-wrap:wrap;justify-content:center;gap:6px 24px;margin:0;max-width:var(--wrap)}
.site-footer__legal-links a{display:inline-flex;min-height:32px;align-items:center;color:#99a5c2;text-decoration:none;font-size:.8125rem}
.site-footer__legal-links a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.site-footer__copy{grid-column:1 / -1;margin:0;font-size:.8125rem;color:#99a5c2}

/* legal / utility pages */
.legal{padding:clamp(56px,9vw,96px) 0 clamp(72px,9vw,120px)}
.legal__inner{max-width:760px;margin:0 auto}
.legal__updated{color:var(--ink-2);font-size:.9375rem;margin:12px 0 2.4em}
.legal h2{font-family:var(--f-text);font-weight:700;font-size:1.1875rem;letter-spacing:-.01em;margin:2em 0 .6em}
.legal section:first-of-type h2{margin-top:0}
.legal p{color:var(--ink-2);font-size:1rem;line-height:1.7}
.legal ul,.legal ol{margin:0 0 1.2em 1.3em;padding:0}
.legal li{color:var(--ink-2);font-size:1rem;line-height:1.7;margin-bottom:.5em}
.legal a{color:var(--blue);text-decoration:underline;text-underline-offset:3px}
.legal a:hover{color:var(--blue-d)}

/* sticky mobile CTA */
.stickycta{display:none}

/* ---------- responsive ---------- */
@media (max-width:1180px){
  .primary-nav{display:none}
  .burger{display:inline-block}
  .picks{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:960px){
  :root{--header-h:64px}
  .hero{grid-template-columns:1fr;grid-template-rows:auto auto auto;min-height:0}
  .hero__media{grid-column:1;grid-row:1;aspect-ratio:4/3}
  .hero__copy{grid-row:2;padding:36px var(--gut) 28px}
  .hero__copy .display{margin-right:0}
  .hero__facts{grid-row:3;grid-template-columns:repeat(2,1fr);gap:16px 20px;background:none;color:var(--ink-2);padding:0 var(--gut) 36px}
  .hero__facts li:not(:first-child){padding-left:0}
  .hero__facts li,.hero__facts li:first-child{color:var(--ink-2);text-shadow:none;border-top:1px solid var(--line-warm);padding-top:12px}
  .hero__facts strong,.hero__facts li:first-child strong{color:var(--ink);font-size:1.3125rem}
  .split,.feature,.guide,.materials,.sizing,.assembly,.trust,.faq,.aside-note{grid-template-columns:1fr}
  .split__head,.guide__side,.materials__intro,.faq__head{position:static}
  .materials__intro .media,.trust__media{max-width:none;aspect-ratio:3/2}
  .faq__head .media{display:none}
  .faq__head .h2{margin-bottom:8px}
  .picks--wide{grid-template-columns:1fr}
  .table--compare{min-width:0}
  .table--compare thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
  .table--compare,.table--compare tbody,.table--compare tr,.table--compare th,.table--compare td{display:block}
  .table--compare tbody{display:grid;gap:14px}
  .table--compare tr{background:var(--white);border:1px solid var(--line);border-radius:var(--r-card);padding:18px 18px 16px;box-shadow:var(--sh-1);display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
  .table--compare tr:hover{background:var(--white)}
  .table--compare th[scope="row"]{grid-column:1 / -1;padding:0 0 10px;border:0;font-size:1.0625rem}
  .table--compare td{padding:8px 0;border-bottom:1px solid var(--line);font-size:.9375rem;color:var(--ink)}
  .table--compare td::before{content:attr(data-label);display:block;font-size:.75rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2);margin-bottom:2px}
  .table--compare td.td-cta{grid-column:1 / -1;border:0;padding:14px 0 0;text-align:left}
  .table--compare td.td-cta .btn{width:100%}
  .table-wrap--compare{overflow:visible}
  .media--banner{aspect-ratio:16/9}
  .final{min-height:0;grid-template-rows:auto auto;background:var(--cream)}
  .final .media--final{position:relative;aspect-ratio:4/3}
  .final__card{margin:-64px var(--gut) 56px;max-width:none}
  .site-footer__inner{grid-template-columns:1fr}
}
@media (max-width:720px){
  .site-header .site-header__actions .btn--sm{padding:0 16px;min-height:44px}
  .site-header .btn__arrow{display:none}
  .wordmark__text{font-size:.8125rem;letter-spacing:.18em}
  .verdict,.two-col,.materials__body{grid-template-columns:1fr}
  .picks{grid-template-columns:1fr}
  .pick{flex-direction:row}
  .pick .media{flex:0 0 38%;aspect-ratio:auto}
  .pick__body{padding:18px}
  .pick--row .media{flex-basis:38%}
  .pick--row .pick__body{padding:18px}
  .pick .btn{width:100%;align-self:stretch}
  .cta-band p{font-size:1.25rem}
  .factors div{grid-template-columns:1fr;gap:4px}
  .stickycta{display:block;position:fixed;left:0;right:0;bottom:0;z-index:40;padding:12px var(--gut) calc(12px + env(safe-area-inset-bottom));background:rgba(255,255,255,.95);border-top:1px solid var(--line);transform:translateY(110%);transition:transform .4s var(--ease-out)}
  .stickycta.is-visible{transform:none}
  .site-footer{padding-bottom:calc(96px + env(safe-area-inset-bottom))}
  .qa p{padding-right:0}
}
@media (max-width:420px){
  .pick,.pick--row{flex-direction:column}
  .pick .media,.pick--row .media{flex:none;aspect-ratio:4/3}
  .wordmark__mark{display:none}
}

/* motion prefs */
@media (prefers-reduced-motion:reduce){
  /* keep color/opacity feedback, drop movement */
  .btn:active,.pick:hover,.video__play:hover{transform:none}
  .btn:hover .btn__arrow{transform:none}
  .btn--primary::after{display:none}
  .burger span,.qa__icon,.stickycta{transition-property:opacity,background-color,border-color}
  .stickycta{transition-duration:.15s}
}