:root { --ink:#071416; --ink-2:#0d2527; --teal:#13b8ad; --teal-soft:#8ee4dc; --amber:#efa84b; --cream:#f5f0e5; --paper:#eef1eb; --white:#fffdf8; --muted:#9eb0ae; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--ink); color:var(--white); font-family:"Manrope",sans-serif; font-size:16px; line-height:1.65; }
a { color:inherit; }
.site-header { height:80px; padding:0 clamp(22px,5vw,82px); display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:32px; position:absolute; inset:0 0 auto; z-index:5; border-bottom:1px solid rgba(255,255,255,.13); }
.brand { text-decoration:none; font:800 clamp(1.45rem,2.2vw,1.9rem)/1 "Barlow Condensed",sans-serif; letter-spacing:.06em; }
.brand span { color:var(--teal); font-size:.58em; vertical-align:top; }
nav { display:flex; gap:28px; }
nav a { text-decoration:none; color:#d7e1df; font-size:.86rem; font-weight:600; }
nav a:hover { color:var(--teal-soft); }
.header-cta { justify-self:end; color:var(--ink); background:var(--cream); padding:10px 17px; text-decoration:none; font-weight:800; font-size:.82rem; border-radius:2px; }
.hero { min-height:760px; height:min(880px,92vh); position:relative; display:flex; align-items:center; overflow:hidden; }
.hero-image,.hero-shade { position:absolute; inset:0; width:100%; height:100%; }
.hero-image { object-fit:cover; object-position:52% center; }
.hero-shade { background:linear-gradient(90deg,rgba(3,11,12,.98) 0%,rgba(3,11,12,.89) 34%,rgba(3,11,12,.28) 65%,rgba(3,11,12,.1) 100%),linear-gradient(0deg,rgba(3,11,12,.45),transparent 35%); }
.hero-copy { position:relative; z-index:2; width:min(690px,51vw); margin-left:clamp(22px,8vw,132px); padding-top:72px; }
.eyebrow,.section-kicker { font-size:.76rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:var(--teal-soft); }
.eyebrow { display:flex; align-items:center; gap:12px; }
.eyebrow span { width:36px; height:2px; background:var(--teal); }
h1,h2,h3 { margin-top:0; }
h1 { font:700 clamp(3.9rem,7.2vw,7.6rem)/.84 "Barlow Condensed",sans-serif; letter-spacing:-.035em; text-transform:uppercase; margin:25px 0 28px; }
h1 em { color:var(--teal); font-style:normal; }
.hero-intro { max-width:610px; color:#d3dcda; font-size:clamp(1rem,1.25vw,1.17rem); line-height:1.7; }
.hero-actions { display:flex; align-items:center; gap:28px; margin-top:35px; }
.primary-button { display:inline-flex; align-items:center; gap:32px; background:var(--teal); color:var(--ink); padding:15px 20px; min-width:235px; justify-content:space-between; text-decoration:none; font-weight:800; border-radius:2px; transition:transform .2s,background .2s; }
.primary-button:hover { background:var(--teal-soft); transform:translateY(-2px); }
.text-link { color:var(--white); font-weight:700; text-underline-offset:5px; }
.proof-row { display:flex; margin-top:45px; color:#aab9b6; font-size:.78rem; font-weight:700; }
.proof-row span { padding:0 18px; border-right:1px solid rgba(255,255,255,.2); }
.proof-row span:first-child { padding-left:0; }
.proof-row span:last-child { border:0; }
.identity-note { background:var(--amber); color:#1a1710; padding:22px clamp(22px,8vw,132px); }
.identity-note p { max-width:1150px; margin:0; font-size:.92rem; }
.problem { background:var(--paper); color:var(--ink); padding:clamp(70px,9vw,132px) clamp(22px,8vw,132px); }
.section-kicker { color:#137b75; margin-bottom:25px; }
.problem-grid { display:grid; grid-template-columns:1.08fr .92fr; gap:clamp(40px,9vw,145px); align-items:start; }
.problem h2,.timing h2,.method h2,.products h2,.expansion h2 { font:700 clamp(2.9rem,5vw,5.3rem)/.95 "Barlow Condensed",sans-serif; text-transform:uppercase; letter-spacing:-.02em; }
.lead-copy p { margin-top:0; color:#415250; font-size:1.05rem; }
.mechanism { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:70px; background:#bcc7c2; border:1px solid #bcc7c2; }
.mechanism article { background:#f9faf5; padding:30px; min-height:230px; }
.mechanism b { color:#228b84; font:700 1rem "Barlow Condensed"; }
.mechanism h3 { margin:35px 0 7px; font:700 2rem "Barlow Condensed"; text-transform:uppercase; }
.mechanism p { color:#566562; margin:0; font-size:.92rem; }
.science-note { margin-top:28px; border-left:5px solid var(--teal); background:#dfe7e1; padding:22px 26px; display:grid; grid-template-columns:180px 1fr; gap:22px; align-items:start; }
.science-note span { font:800 1.05rem "Barlow Condensed"; text-transform:uppercase; color:#137b75; }
.science-note p { margin:0; color:#415250; }
.timing { background:var(--ink); padding:clamp(70px,9vw,132px) clamp(22px,8vw,132px); }
.section-kicker.light { color:var(--teal-soft); }
.timing-copy { display:grid; grid-template-columns:1fr 1fr; column-gap:clamp(45px,8vw,120px); align-items:end; }
.timing-copy .section-kicker { grid-column:1/-1; }
.timing-copy h2 { margin-bottom:0; }
.timing-copy>p { color:#b7c5c2; margin:0 0 6px; font-size:1.02rem; }
.time-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:55px; }
.time-grid article { border:1px solid rgba(255,255,255,.17); padding:30px; min-height:240px; }
.time-grid span { font:800 2.2rem "Barlow Condensed"; color:var(--amber); }
.time-grid h3 { margin:45px 0 8px; font:700 1.45rem "Barlow Condensed"; text-transform:uppercase; }
.time-grid p { color:#a8b8b5; font-size:.9rem; margin:0; }
.truth-strip { margin-top:14px; background:var(--teal); color:var(--ink); padding:20px 24px; }
.method { background:#0a1b1d; display:grid; grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr); gap:clamp(40px,7vw,110px); padding:clamp(70px,9vw,132px) clamp(22px,8vw,132px); align-items:center; border-top:1px solid rgba(255,255,255,.1); }
.method h2 { max-width:760px; }
.method ol { padding:0; margin:50px 0 35px; list-style:none; display:grid; grid-template-columns:1fr 1fr; gap:30px 45px; }
.method li { display:flex; gap:18px; }
.method li>span { flex:0 0 32px; width:32px; height:32px; display:grid; place-items:center; background:var(--teal); color:var(--ink); font-weight:800; border-radius:50%; }
.method li h3 { margin:1px 0 5px; font:700 1.35rem "Barlow Condensed"; text-transform:uppercase; }
.method li p { margin:0; color:#a8b8b5; font-size:.9rem; }
.safety-note { color:#98aaa7; font-size:.79rem; border-top:1px solid rgba(255,255,255,.13); padding-top:22px; }
.quick-card { background:var(--amber); color:#1a1710; padding:clamp(30px,4vw,50px); transform:rotate(1.25deg); box-shadow:18px 22px 0 rgba(0,0,0,.22); }
.quick-card>* { transform:rotate(-1.25deg); }
.mini-label,.product-type { text-transform:uppercase; font-weight:800; font-size:.72rem; letter-spacing:.16em; }
.quick-card h3 { font:800 2.5rem/1 "Barlow Condensed"; text-transform:uppercase; margin:32px 0 18px; }
.quick-card a { font-weight:800; text-underline-offset:6px; }
.products { background:var(--cream); color:var(--ink); padding:clamp(70px,9vw,132px) clamp(22px,8vw,132px); }
.products-heading { display:grid; grid-template-columns:1.25fr .75fr; gap:clamp(40px,8vw,120px); align-items:end; }
.products-heading h2 { margin-bottom:0; }
.products-heading>p { color:#53605e; margin-bottom:8px; }
.product-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:55px; }
.product-card { border:1px solid #c7cfca; padding:28px; display:flex; flex-direction:column; min-height:520px; background:#faf8f0; }
.product-card.featured-product { background:var(--ink-2); color:var(--white); border-color:var(--ink-2); transform:translateY(-10px); }
.product-number { font:700 1rem "Barlow Condensed"; color:#228b84; }
.product-type { color:#5f7773; margin:42px 0 9px; }
.featured-product .product-type { color:var(--teal-soft); }
.product-card h3,.finder-card h3 { font:700 2rem/1.05 "Barlow Condensed"; text-transform:uppercase; margin-bottom:16px; }
.product-card>p:not(.product-type) { color:#586865; font-size:.9rem; }
.featured-product>p:not(.product-type) { color:#b7c7c4; }
.product-card dl { margin:auto 0 26px; border-top:1px solid #ccd4cf; }
.featured-product dl { border-color:rgba(255,255,255,.18); }
.product-card dl div { padding:13px 0; border-bottom:1px solid #d7ddd8; }
.featured-product dl div { border-color:rgba(255,255,255,.14); }
.product-card dt { font-size:.68rem; text-transform:uppercase; letter-spacing:.12em; font-weight:800; color:#60706d; }
.featured-product dt { color:#91aaa6; }
.product-card dd { margin:3px 0 0; font-size:.85rem; font-weight:700; }
.amazon-link { display:flex; justify-content:space-between; align-items:center; background:var(--amber); color:var(--ink); padding:13px 15px; text-decoration:none; font-weight:800; font-size:.84rem; }
.amazon-link:hover { background:#ffc477; }
.finder-card { margin-top:28px; border:1px solid #c7cfca; display:grid; grid-template-columns:1fr auto; align-items:center; gap:35px; padding:25px 28px; }
.finder-card .product-type { margin:0 0 6px; }
.finder-card h3 { margin:0 0 6px; }
.finder-card p:last-child { margin:0; color:#586865; }
.secondary-amazon { min-width:285px; }
.affiliate-disclosure { margin:24px 0 0; font-size:.76rem; color:#66736f; }
.source-note { margin:10px 0 0; font-size:.76rem; color:#66736f; }
.source-note a { text-underline-offset:3px; }
.expansion { background:var(--paper); color:var(--ink); padding:clamp(70px,9vw,132px) clamp(22px,8vw,132px); display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(55px,8vw,120px); }
.expansion-copy p { color:#53605e; max-width:560px; }
.category-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.category-grid article { border:1px solid #c7cfca; padding:25px; min-height:195px; }
.category-grid article.featured { background:var(--ink-2); color:var(--white); border-color:var(--ink-2); }
.category-grid span { font-size:.68rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:#5f7773; }
.category-grid .featured span { color:var(--teal-soft); }
.category-grid h3 { font:700 1.7rem/1.08 "Barlow Condensed"; text-transform:uppercase; margin:30px 0 5px; }
.category-grid p { margin:0; color:#60706d; font-size:.88rem; }
.category-grid .featured p { color:#b7c7c4; }
footer { padding:52px clamp(22px,8vw,132px); display:grid; grid-template-columns:auto 1fr auto; gap:35px; align-items:center; color:#a4b3b1; }
footer>p { margin:0; }
.legal { font-size:.7rem; max-width:520px; text-align:right; }
.mobile-buy { display:none; }
@media (max-width:1050px) { nav{gap:17px} nav a{font-size:.78rem} .header-cta{display:none} .site-header{grid-template-columns:1fr auto} }
@media (max-width:900px) {
  .site-header{height:68px} nav{display:none} .hero{min-height:830px;height:92svh;align-items:flex-end} .hero-image{object-position:64% top} .hero-shade{background:linear-gradient(0deg,rgba(3,11,12,.99) 12%,rgba(3,11,12,.8) 58%,rgba(3,11,12,.12) 100%)} .hero-copy{width:auto;margin:0;padding:120px 24px 65px} h1{font-size:clamp(3.6rem,15vw,6rem)} .hero-intro{max-width:660px} .problem-grid,.timing-copy,.method,.products-heading,.expansion{grid-template-columns:1fr} .timing-copy .section-kicker{grid-column:auto} .timing-copy h2{margin-bottom:25px} .quick-card{max-width:620px} .product-grid{grid-template-columns:1fr} .product-card{min-height:0} .product-card.featured-product{transform:none} .product-card dl{margin-top:20px} footer{grid-template-columns:1fr;text-align:center} .legal{text-align:center;margin:0 auto}
}
@media (max-width:700px) {
  body{padding-bottom:62px} .site-header{padding:0 18px} .hero{min-height:790px} .hero-copy{padding-left:20px;padding-right:20px} .hero-actions{align-items:stretch;flex-direction:column;gap:16px} .primary-button{width:100%} .text-link{padding-left:3px} .proof-row{flex-direction:column;gap:6px;margin-top:30px} .proof-row span{padding:0;border:0} .mechanism,.time-grid,.category-grid,.method ol{grid-template-columns:1fr} .mechanism article,.time-grid article{min-height:0} .science-note{grid-template-columns:1fr;gap:8px} .method{gap:60px} .quick-card{transform:none;box-shadow:10px 12px 0 rgba(0,0,0,.22)} .quick-card>*{transform:none} .finder-card{grid-template-columns:1fr} .secondary-amazon{min-width:0} .mobile-buy{display:flex;position:fixed;inset:auto 0 0;z-index:20;min-height:62px;align-items:center;justify-content:center;gap:15px;background:var(--amber);color:var(--ink);text-decoration:none;font-weight:800;box-shadow:0 -5px 22px rgba(0,0,0,.25)}
}
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto} *,*::before,*::after{transition:none!important} }