:root{
  --navy:#113F3D;
  --navy-deep:#0B2E2C;
  --sky:#2E6E77;
  --sky-deep:#1E555C;
  --orange:#C9AD7F;
  --coral:#B5602E;
  --paper:#FFFFFF;
  --offwhite:#F6F2E8;
  --fog:#5B6B62;
  --display:'Bitter', serif;
  --body:'Inter', sans-serif;
  --mono:'IBM Plex Mono', monospace;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{font-family:var(--body); color:#1C2B29; background:var(--paper); line-height:1.65; -webkit-font-smoothing:antialiased;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
.wrap{max-width:1180px; margin:0 auto; padding:0 32px;}
h1,h2,h3{font-family:var(--display); font-weight:700; letter-spacing:-0.01em; color:var(--navy);}
:focus-visible{outline:2px solid var(--sky-deep); outline-offset:3px;}

.arc-divider{position:relative; width:100%; height:110px; overflow:hidden; background:var(--offwhite);}
.arc-divider svg{width:100%; height:100%; display:block;}

header{position:sticky; top:0; z-index:50; background:var(--paper); border-bottom:1px solid rgba(17,63,61,0.08);}
header .wrap{display:flex; align-items:center; justify-content:space-between; padding:16px 32px;}
.brand{display:flex; align-items:center; gap:9px; font-family:var(--display); font-size:21px; font-weight:700; color:var(--navy);}
.brand .dot{width:9px; height:9px; border-radius:50%; background:var(--coral);}
nav ul{display:flex; gap:34px; list-style:none;}
nav a{color:var(--fog); font-size:14px; font-weight:600;}
nav a:hover{color:var(--sky-deep);}
.hdr-cta{background:var(--sky); color:var(--paper); font-weight:700; font-size:14px; padding:11px 24px; border-radius:6px; white-space:nowrap;}
.hdr-cta:hover{background:var(--sky-deep);}

.hero{background:linear-gradient(180deg, var(--offwhite) 0%, var(--paper) 100%); padding:76px 0 0; position:relative; overflow:hidden;}
.hero::before{content:''; position:absolute; top:-120px; right:-120px; width:480px; height:480px; border-radius:50%;
  background:radial-gradient(circle, rgba(46,110,119,0.14) 0%, rgba(46,110,119,0) 70%);}
.hero .wrap{display:grid; grid-template-columns:1.05fr 0.95fr; gap:40px; align-items:center; position:relative;}
.eyebrow{font-family:var(--mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--sky-deep); margin-bottom:20px; display:flex; align-items:center; gap:10px; font-weight:500;}
.eyebrow::before{content:''; width:26px; height:2px; background:var(--coral);}
.hero h1{font-size:clamp(32px,4vw,50px); line-height:1.12; margin-bottom:20px;}
.hero h1 em{color:var(--sky-deep); font-style:normal;}
.hero p.lead{font-size:17px; color:var(--fog); max-width:480px; margin-bottom:30px;}
.btn-primary{display:inline-block; background:var(--sky); color:var(--paper); font-weight:700; padding:15px 32px; border-radius:6px; font-size:15px; box-shadow:0 10px 24px rgba(46,110,119,0.3); transition:transform .15s ease, background .15s ease;}
.btn-primary:hover{background:var(--sky-deep); transform:translateY(-2px);}
.btn-ghost{display:inline-block; border:1.5px solid rgba(17,63,61,0.2); color:var(--navy); padding:13.5px 28px; border-radius:6px; font-size:15px; margin-left:12px; font-weight:600;}
.btn-ghost:hover{border-color:var(--sky); color:var(--sky-deep);}
.hero-cta-row{display:flex; align-items:center; flex-wrap:wrap; margin-bottom:34px;}
.hero-img img{width:100%; max-width:420px; margin:0 auto; filter:drop-shadow(0 24px 40px rgba(17,63,61,0.18));}
.fact-strip{background:var(--navy); margin-top:44px; padding:20px 0;}
.fact-strip .wrap{display:flex; justify-content:space-between; flex-wrap:wrap; gap:16px;}
.fact-strip span{font-family:var(--mono); font-size:12px; color:rgba(255,255,255,0.65);}
.fact-strip strong{color:var(--paper); font-weight:500;}

.science{padding:96px 0; background:var(--paper);}
.science .grid{display:grid; grid-template-columns:1fr 1fr; gap:66px; align-items:center;}
.kicker{font-family:var(--mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--coral); margin-bottom:14px; font-weight:500;}
.science h2{font-size:clamp(25px,3vw,34px); margin-bottom:20px; line-height:1.2;}
.science p{color:var(--fog); margin-bottom:15px; font-size:16px;}
.science p strong{color:var(--navy);}
.diagram{background:var(--offwhite); border:1px solid rgba(17,63,61,0.08); border-radius:10px; padding:24px 24px 28px; overflow:hidden;}
.diagram svg{width:100%; height:auto; display:block;}
.diagram-label{font-family:var(--display); font-weight:700; font-size:14px; color:var(--navy); text-align:center; margin-top:16px;}
.diagram-sublabel{font-family:var(--mono); font-size:11px; color:var(--fog); text-align:center; margin-top:4px;}
.note-box{background:rgba(46,110,119,0.1); border-left:3px solid var(--sky); padding:15px 20px; font-size:14px; color:var(--navy); margin-top:22px; border-radius:0 8px 8px 0;}

.ingredients{padding:96px 0; background:var(--navy); color:var(--paper);}
.ingredients-head{max-width:640px; margin-bottom:56px;}
.ingredients-head .kicker{color:var(--orange);}
.ingredients-head h2{font-size:clamp(25px,3vw,36px); color:var(--paper); line-height:1.22;}
.ing-grid{display:grid; grid-template-columns:repeat(4, 1fr); gap:1px; background:rgba(255,255,255,0.1);}
.ing-card{background:var(--navy); padding:32px 24px;}
.ing-num{font-family:var(--mono); font-size:12px; color:var(--orange); margin-bottom:16px;}
.ing-card h3{font-size:17px; margin-bottom:9px; font-weight:700; color:var(--paper);}
.ing-card p{font-size:13.5px; color:rgba(255,255,255,0.65);}

.trust{background:var(--sky); padding:30px 0;}
.trust .wrap{display:flex; justify-content:space-between; flex-wrap:wrap; gap:18px;}
.trust-item{display:flex; align-items:center; gap:9px; color:var(--paper); font-size:13px; font-weight:600;}
.trust-item .chk{width:16px; height:16px; border-radius:50%; background:rgba(255,255,255,0.25); display:flex; align-items:center; justify-content:center; font-size:10px; color:var(--paper); flex-shrink:0;}

.bonus-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.bonus-card{background:var(--offwhite); border:1px solid rgba(17,63,61,0.08); border-radius:10px; padding:22px; text-align:center;}
.bonus-card img{width:110px; margin:0 auto 18px; border-radius:4px;}
.bonus-card h3{font-size:16px; margin-bottom:10px;}
.bonus-card p{color:var(--fog); font-size:13.5px;}
.bonus-card--text{display:flex; flex-direction:column; justify-content:center;}
.bonus-icon{font-size:38px; margin-bottom:14px;}

.pricing{padding:96px 0; background:var(--offwhite);}
.pricing-head{text-align:center; max-width:600px; margin:0 auto 54px;}
.pricing-head .kicker{color:var(--coral); justify-content:center; display:flex;}
.pricing-head h2{font-size:clamp(25px,3vw,34px);}
.price-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:22px;}
.price-card{background:var(--paper); border:1px solid rgba(17,63,61,0.1); border-radius:12px; padding:34px 26px; text-align:center; position:relative;}
.price-card.featured{border-color:var(--coral); border-width:2px; transform:translateY(-10px); box-shadow:0 20px 40px rgba(181,96,46,0.15);}
.badge-top{position:absolute; top:-13px; left:50%; transform:translateX(-50%); background:var(--coral); color:var(--paper); font-family:var(--mono); font-size:11px; letter-spacing:.06em; padding:5px 14px; border-radius:20px; font-weight:600;}
.price-card h3{font-family:var(--mono); font-size:12.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--fog); margin-bottom:6px; font-weight:500;}
.supply-txt{font-size:13px; color:var(--fog); margin-bottom:22px;}
.price-card img{width:110px; margin:0 auto 22px;}
.price-num{font-family:var(--display); font-size:38px; font-weight:700; margin-bottom:2px; color:var(--navy);}
.price-num span{font-size:13px; color:var(--fog); font-family:var(--body); font-weight:400;}
.price-strike{color:var(--fog); text-decoration:line-through; font-size:14px; margin-bottom:18px;}
.price-total{font-size:13px; color:var(--fog); margin-top:14px;}
.btn-outline{display:block; border:1.5px solid var(--navy); color:var(--navy); font-weight:700; padding:12.5px 0; border-radius:6px; font-size:14px; width:100%; margin-top:4px;}
.btn-outline:hover{background:var(--navy); color:var(--paper);}
.btn-fill{display:block; background:var(--coral); color:var(--paper); font-weight:700; padding:12.5px 0; border-radius:6px; font-size:14px; width:100%; margin-top:4px;}
.btn-fill:hover{background:#9c4e24;}

.guarantee{padding:88px 0; background:var(--navy); color:var(--paper);}
.guarantee .wrap{display:grid; grid-template-columns:0.32fr 0.68fr; gap:52px; align-items:center;}
.guarantee img{width:170px; margin:0 auto;}
.guarantee h2{font-size:clamp(23px,3vw,31px); margin-bottom:16px; color:var(--paper);}
.guarantee p{color:rgba(255,255,255,0.7); font-size:15px;}

.faq{padding:96px 0; background:var(--paper);}
.faq-head{text-align:center; margin-bottom:48px;}
.faq-head .kicker{color:var(--coral); justify-content:center; display:flex;}
.faq-head h2{font-size:clamp(25px,3vw,34px);}
.faq-list{max-width:760px; margin:0 auto;}
.faq-item{border-bottom:1px solid rgba(17,63,61,0.1);}
.faq-q{display:flex; justify-content:space-between; align-items:center; gap:20px; padding:21px 4px; cursor:pointer; font-weight:700; font-size:16px;}
.faq-q .plus{font-family:var(--mono); font-size:20px; color:var(--sky-deep); transition:transform .2s ease; flex-shrink:0;}
.faq-item.open .plus{transform:rotate(45deg);}
.faq-a{max-height:0; overflow:hidden; transition:max-height .25s ease;}
.faq-a p{padding:0 4px 21px; color:var(--fog); font-size:15px; max-width:640px;}
.faq-item.open .faq-a{max-height:300px;}

.disclaimer{background:var(--navy-deep); color:rgba(255,255,255,0.6); padding:28px 0; font-size:12.5px; line-height:1.7;}

footer{background:var(--navy-deep); color:rgba(255,255,255,0.5); padding:46px 0 28px; text-align:center; font-size:13px;}
footer .brand{justify-content:center; margin-bottom:14px; color:var(--paper);}
.foot-links{display:flex; justify-content:center; gap:22px; margin-top:14px; flex-wrap:wrap;}
.foot-links a:hover{color:var(--sky);}

/* benefits list */
.benefits{padding:96px 0; background:var(--paper);}
.benefit-list{display:grid; grid-template-columns:1fr 1fr; gap:36px 48px; max-width:980px; margin:0 auto;}
.benefit-item{display:flex; gap:18px; align-items:flex-start;}
.benefit-num{font-family:var(--mono); font-size:13px; color:var(--coral); font-weight:600; padding-top:3px; flex-shrink:0; width:28px;}
.benefit-item h3{font-size:17px; margin-bottom:6px;}
.benefit-item p{color:var(--fog); font-size:14.5px;}

/* pros & cons */
.proscons{padding:80px 0; background:var(--offwhite);}
.proscons-grid{display:grid; grid-template-columns:1fr 1fr; gap:24px; max-width:940px; margin:0 auto;}
.proscons-col{background:var(--paper); border-radius:12px; padding:32px 30px; border:1px solid rgba(17,63,61,0.08);}
.proscons-col h3{font-size:20px; margin-bottom:18px;}
.proscons-pro h3{color:var(--sky-deep);}
.proscons-con h3{color:var(--coral);}
.proscons-col ul{list-style:none; margin:0;}
.proscons-col li{padding-left:24px; position:relative; margin-bottom:12px; color:var(--fog); font-size:14.5px;}
.proscons-pro li::before{content:'+'; position:absolute; left:0; color:var(--sky-deep); font-weight:700;}
.proscons-con li::before{content:'–'; position:absolute; left:0; color:var(--coral); font-weight:700;}

/* who it's for */
.who-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px; max-width:980px; margin:0 auto;}
.who-item{background:var(--paper); border:1px solid rgba(17,63,61,0.08); border-radius:10px; padding:22px;}
.who-item strong{display:block; font-family:var(--display); font-size:15.5px; color:var(--navy); margin-bottom:8px;}
.who-item p{color:var(--fog); font-size:13.5px;}

/* how to use */
.how-to-use{padding:90px 0; background:var(--navy);}
.how-steps{display:grid; grid-template-columns:repeat(4,1fr); gap:24px; max-width:1040px; margin:0 auto;}
.how-step{text-align:center;}
.how-step span{display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; border-radius:50%; background:var(--coral); color:var(--paper); font-family:var(--display); font-weight:700; margin-bottom:16px;}
.how-step p{color:rgba(255,255,255,0.75); font-size:14px;}

/* final cta */
.final-cta{padding:90px 0; background:var(--navy-deep);}
.final-cta .wrap{display:grid; grid-template-columns:0.4fr 0.6fr; gap:50px; align-items:center;}
.final-cta img{width:100%; max-width:360px; margin:0 auto;}
.final-cta h2{font-size:clamp(24px,3vw,32px); margin-bottom:10px;}

/* legal pages */
.legal-hero{background:var(--offwhite); padding:64px 0 48px; border-bottom:1px solid rgba(17,63,61,0.08);}
.legal-hero .kicker{color:var(--coral);}
.legal-hero h1{font-size:clamp(28px,3.4vw,40px); margin-bottom:10px;}
.legal-hero .updated{font-family:var(--mono); font-size:12.5px; color:var(--fog);}
.legal-body{padding:64px 0 90px;}
.legal-body .wrap{max-width:760px;}
.legal-body h2{font-size:20px; margin:40px 0 14px;}
.legal-body h2:first-child{margin-top:0;}
.legal-body p{color:var(--fog); font-size:15.5px; margin-bottom:14px;}
.legal-body ul{margin:0 0 14px 22px; color:var(--fog); font-size:15.5px;}
.legal-body li{margin-bottom:6px;}
.legal-body a.inline-link{color:var(--sky-deep); font-weight:600; text-decoration:underline;}
.legal-body strong{color:var(--navy);}
.legal-toc{background:var(--offwhite); border:1px solid rgba(17,63,61,0.08); border-radius:10px; padding:22px 26px; margin-bottom:36px;}
.legal-toc p{font-family:var(--mono); font-size:11.5px; text-transform:uppercase; letter-spacing:.08em; color:var(--fog); margin-bottom:10px;}
.legal-toc ol{margin-left:18px; font-size:14.5px;}
.legal-toc li{margin-bottom:4px;}
.legal-toc a{color:var(--navy); font-weight:600;}
.legal-toc a:hover{color:var(--sky-deep);}

@media(max-width:900px){
  .hero .wrap, .science .grid, .guarantee .wrap, .final-cta .wrap{grid-template-columns:1fr; text-align:left;}
  .hero-img{order:-1; max-width:280px; margin:0 auto 16px;}
  .ing-grid{grid-template-columns:repeat(2,1fr);}
  .ing-card[style]{grid-column:span 2 !important;}
  .bonus-grid{grid-template-columns:1fr;}
  .price-grid{grid-template-columns:1fr !important;}
  .price-card.featured{transform:none;}
  nav ul{display:none;}
  .fact-strip .wrap{flex-direction:column; gap:10px;}
  .guarantee img{width:120px;}
  .benefit-list{grid-template-columns:1fr;}
  .proscons-grid{grid-template-columns:1fr;}
  .who-grid{grid-template-columns:1fr;}
  .how-steps{grid-template-columns:1fr 1fr;}
  .final-cta img{max-width:220px;}
}
