/*!
 * Thryve Health Tools — shared design system (navy/gold editorial).
 * Tokens + components lifted from the locked platform spec (THRYVE_TOOLS_PLATFORM.md §3).
 * Loaded once per page; every front door reuses it, so the NEXT tool is nearly free.
 */
:root{
  --navy-deep:#0B1624; --navy:#101F31; --navy-light:#1A2F47; --card:#16283D;
  --gold:#C8A24E; --gold-soft:#B08E46; --cream:#F4EEE1; --cream-dim:#CBC5B7;
  --silver:#96A2B0; --hair:#2E425A;
}
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0; color:var(--cream);
  background:linear-gradient(180deg,var(--navy-deep) 0%,var(--navy) 45%,var(--navy-light) 100%);
  background-attachment:fixed;
  font-family:system-ui,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:18px; line-height:1.6; -webkit-font-smoothing:antialiased;
}
a{color:var(--gold);}
.wrap{max-width:720px; margin:0 auto; padding:40px 20px 72px;}
.kicker{font-size:13px; letter-spacing:.18em; text-transform:uppercase; color:var(--gold); margin:0 0 14px; font-weight:600;}
.kicker .diamond{display:inline-block; transform:rotate(45deg); width:7px; height:7px; background:var(--gold); margin-right:10px; vertical-align:middle;}
.rule{width:64px; height:3px; background:var(--gold); border:0; margin:0 0 26px;}
h1{font-family:"Fraunces",Georgia,serif; font-weight:600; font-size:clamp(32px,7vw,50px); line-height:1.06; margin:0 0 14px; letter-spacing:-.01em; color:var(--cream);}
.sub{color:var(--cream-dim); margin:0; font-size:17px; max-width:56ch;}
h2{font-family:"Fraunces",Georgia,serif; font-weight:600; font-size:24px; margin:0 0 6px; color:var(--cream);}

/* hero result */
.hero{border:1px solid var(--hair); background:rgba(22,40,61,.55); border-radius:10px; margin:30px 0; overflow:hidden;}
.hero-grid{display:grid; grid-template-columns:1fr;}
@media(min-width:560px){.hero-grid{grid-template-columns:1fr 1fr;}}
.hero-cell{padding:26px 24px;}
.hero-cell + .hero-cell{border-top:1px solid var(--hair);}
@media(min-width:560px){.hero-cell + .hero-cell{border-top:none; border-left:1px solid var(--hair);}}
.hero-label{font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--silver); margin:0 0 8px;}
.hero-num{font-family:"Fraunces",Georgia,serif; font-weight:600; font-size:clamp(40px,11vw,60px); line-height:1; color:var(--gold);}
.hero-unit{font-family:"Fraunces",Georgia,serif; font-size:17px; color:var(--cream); margin-left:6px;}
.hero-note{font-size:14px; color:var(--cream-dim); margin:10px 0 0;}
.verdict{font-family:"Fraunces",Georgia,serif; font-weight:600; font-size:clamp(19px,5vw,26px); line-height:1.1;}
.verdict.yes{color:var(--gold);} .verdict.no{color:var(--cream);}

/* form */
.panel{border:1px solid var(--hair); background:rgba(16,31,49,.6); border-radius:10px; padding:24px; margin:28px 0;}
.panel .hint{color:var(--silver); font-size:14px; margin:0 0 18px;}
.field{margin:0 0 18px;} .field:last-child{margin-bottom:0;}
label.flabel{display:block; font-size:14px; font-weight:600; margin:0 0 6px; color:var(--cream); letter-spacing:.01em;}
label.flabel .meta{color:var(--silver); font-weight:400;}
.row{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
input[type="number"], select{
  -webkit-appearance:none; -moz-appearance:none; appearance:none; width:100%;
  font-family:inherit; font-size:17px; color:var(--cream); background:var(--navy-deep);
  border:1px solid var(--hair); border-radius:6px; padding:12px 14px; line-height:1.3;
}
input[type="number"]:focus, select:focus{outline:none; border-color:var(--gold);}
select{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23C8A24E' stroke-width='1.5' d='M1 1l5 5 5-5'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; padding-right:38px;}
.seg{display:flex; flex-wrap:wrap; gap:8px;}
.seg button{font-family:inherit; font-size:15px; color:var(--cream); background:var(--navy-deep); border:1px solid var(--hair); padding:9px 14px; cursor:pointer; border-radius:6px;}
.seg button[aria-pressed="true"]{background:var(--gold); color:var(--navy-deep); border-color:var(--gold); font-weight:600;}
fieldset.toggles{border:1px solid var(--hair); border-radius:8px; padding:18px; margin:6px 0 0;}
fieldset.toggles legend{font-family:"Fraunces",Georgia,serif; font-weight:600; font-size:15px; padding:0 8px; color:var(--gold);}
.toggle{display:flex; align-items:flex-start; gap:12px; padding:11px 0; border-top:1px solid var(--hair); cursor:pointer;}
.toggle:first-of-type{border-top:none;}
.toggle input{margin:3px 0 0; width:18px; height:18px; accent-color:var(--gold); flex:0 0 auto;}
.toggle .tlabel{font-size:15px; line-height:1.4;}
.toggle .tlabel .meta{display:block; color:var(--silver); font-size:13px;}

/* outcome blocks */
.outcome{border:1px solid var(--hair); border-radius:10px; padding:24px; margin:22px 0; background:rgba(22,40,61,.5);}
.outcome .tag{font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); font-weight:700; margin:0 0 10px;}
.outcome h2{font-size:21px; margin:0 0 12px;}
.outcome p{margin:0 0 12px; color:var(--cream-dim);} .outcome p:last-child{margin-bottom:0;}
.outcome ul{margin:0; padding:0; list-style:none;}
.outcome li{padding:12px 0; border-top:1px solid var(--hair);}
.outcome li:first-child{border-top:none; padding-top:0;}
.outcome li b{color:var(--cream); display:block; margin-bottom:2px;}
.safety{border:1px solid var(--gold); background:rgba(200,162,78,.10); border-radius:8px; padding:14px 16px; margin:0 0 16px; color:var(--cream); font-size:15px;}
.safety .stag{font-weight:700; color:var(--gold); letter-spacing:.08em; text-transform:uppercase; font-size:12px; display:block; margin-bottom:4px;}

/* CTA / resource cards */
.cta-card{border:1px solid var(--gold-soft); border-radius:10px; padding:22px; margin:14px 0; background:rgba(200,162,78,.08);}
.cta-card.gear{border-color:var(--hair); background:rgba(16,31,49,.5);}
.cta-card .why{color:var(--cream-dim); font-size:15px; margin:0 0 16px;}
.cta-card .res-label{font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--silver); margin:0 0 8px;}
.btn{font-family:"Fraunces",Georgia,serif; font-weight:600; font-size:16px; border:1px solid var(--gold); padding:13px 22px; cursor:pointer; border-radius:6px; text-decoration:none; display:inline-block; text-align:center;}
.btn.solid{background:var(--gold); color:var(--navy-deep);}
.btn.ghost{background:transparent; color:var(--gold);}
.disclosure{font-size:12.5px; color:var(--silver); margin:12px 0 0; line-height:1.45;}
.actions{display:flex; flex-wrap:wrap; gap:12px; margin:24px 0;}
#shareStatus{font-size:13px; color:var(--silver); align-self:center;}

/* email capture */
.capture{border:1px solid var(--hair); border-radius:10px; background:rgba(16,31,49,.6); padding:24px; margin:28px 0;}
.capture h2{font-size:20px; margin:0 0 4px;}
.capture p{font-size:14px; color:var(--silver); margin:0 0 16px;}
.capture .emailrow{display:flex; flex-wrap:wrap; gap:10px;}
.capture input[type="email"]{flex:1 1 220px; font-family:inherit; font-size:16px; color:var(--cream); background:var(--navy-deep); border:1px solid var(--hair); border-radius:6px; padding:12px 14px;}
.capture input[type="email"]:focus{outline:none; border-color:var(--gold);}
.hp{position:absolute; left:-9999px;}

.disclaimer{font-size:13px; color:var(--silver); border-top:1px solid var(--hair); padding-top:18px; margin-top:36px;}
.fda{font-size:12px; color:var(--silver); margin-top:10px;}
footer.site{border-top:1px solid var(--hair); margin-top:24px; padding-top:18px; font-size:13px; color:var(--silver); display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px;}
footer.site .brand{font-family:"Fraunces",Georgia,serif; font-weight:600; color:var(--cream); letter-spacing:.08em;}
footer.site .brand .diamond{display:inline-block; transform:rotate(45deg); width:7px; height:7px; background:var(--gold); margin-right:8px;}
footer.site a{color:var(--silver);}

/* hub */
.tiles{display:grid; grid-template-columns:1fr; gap:16px; margin:30px 0;}
@media(min-width:560px){.tiles{grid-template-columns:1fr 1fr;}}
.tile{display:block; border:1px solid var(--hair); border-radius:10px; padding:22px; background:rgba(22,40,61,.5); text-decoration:none; color:var(--cream);}
.tile:hover{border-color:var(--gold-soft); background:rgba(200,162,78,.06);}
.tile .q{font-family:"Fraunces",Georgia,serif; font-weight:600; font-size:20px; margin:0 0 6px; color:var(--cream);}
.tile .d{font-size:14px; color:var(--cream-dim); margin:0;}
.tile .pillar{font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--gold); margin:0 0 10px;}