/* theconsent.app Explore — design system v3 (generated by generators/gen.py; edit there) */
:root{
  --ink:#202429;--bg:#F5F6F7;--card:#fff;--line:#DDE0E3;--muted:#6F7780;
  --brand:#3D7A99;--brand-soft:#E8F0F4;--deep:#23282E;--accent:#9FC0D0;
  --ok:#2F7E68;--ok-bg:#E9F2EE;--warn:#96543C;--warn-bg:#F4ECE7;--warn-line:#E2CFC4;
  --shadow:0 1px 2px rgba(32,36,41,.05),0 12px 32px rgba(32,36,41,.08);
  --r:20px;--font-d:'Space Grotesk',sans-serif;--font-t:'Inter',system-ui,sans-serif;
}
[data-brand="smileon"]{
  --ink:#3a434c;--bg:#F5F7F9;--card:#fff;--line:#e8ecf0;--muted:#717b86;
  --warn:#A05B3F;--warn-bg:#FBF0EA;--warn-line:#EBCDBE;
  --brand:#8F7F55;--brand-soft:#F0EDE2;--deep:#333F48;--accent:#CF826A;
  --shadow:0 1px 2px rgba(51,63,72,.04),0 8px 28px rgba(51,63,72,.06);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font-t);background:var(--bg);color:var(--ink);line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%}
a{color:var(--brand)}
:focus-visible{outline:2.5px solid var(--brand);outline-offset:2px;border-radius:6px}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto}}
@view-transition{navigation:auto}
::view-transition-old(sidenav){animation:tab-out .32s cubic-bezier(.5,0,.8,.4) both}
::view-transition-new(mast){animation:head-in .46s cubic-bezier(.34,1.3,.44,1) both}
@keyframes tab-out{to{transform:translateX(-104%)}}
@keyframes head-in{from{transform:translateY(-104%)}}
::view-transition-old(root){animation:vt-out .18s ease both}
::view-transition-new(root){animation:vt-in .26s ease both}
@keyframes vt-out{to{opacity:0;transform:translateY(-6px)}}
@keyframes vt-in{from{opacity:0;transform:translateY(10px)}}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.mast-in>*{animation:rise .5s ease both}
.mast-in>*:nth-child(2){animation-delay:.06s}.mast-in>*:nth-child(3){animation-delay:.12s}
.mast-in>*:nth-child(4){animation-delay:.18s}.mast-in>*:nth-child(6){animation-delay:.26s}
.featured,.browse{animation:rise .55s .2s ease both}
.ecard,.fcard,.pcard{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.ecard:hover{transform:translateY(-3px)}
.fcard:hover{transform:translateY(-3px)}
.pcard:hover{transform:translateY(-2px)}
.pathway.show{animation:rise .3s ease both}
.results.show{animation:rise .22s ease both}
.art-head,.glance,.sec,.warnpanel,.jcta,.related{animation:rise .5s ease both}
.glance{animation-delay:.06s}
.wrap{max-width:960px;margin:0 auto;padding:0 22px}
.wrap.narrow{max-width:840px}

/* top nav */
.topnav{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:18px 0}
.wm{font-family:var(--font-d);font-weight:700;font-size:1.08rem;color:var(--deep);letter-spacing:-.02em;view-transition-name:brand}
.wm i{font-style:normal;color:var(--brand)}
.wm-img{height:40px;display:block}
.topnav{justify-content:flex-start}
.navbtn{display:inline-flex;align-items:center;justify-content:center;padding:9px 18px;border-radius:999px;border:1.5px solid var(--line);background:#fff;color:var(--deep);font-family:var(--font-d);font-weight:600;font-size:.85rem;letter-spacing:.01em;text-decoration:none;line-height:1;flex:0 0 auto;transition:transform .2s cubic-bezier(.34,1.3,.44,1),border-color .15s,box-shadow .15s,color .15s}
.navbtn:hover{border-color:var(--brand);color:var(--brand);transform:translateY(-1px);box-shadow:0 4px 14px rgba(32,36,41,.1)}
.navbtn.on{background:var(--deep);border-color:var(--deep);color:#fff;pointer-events:none}
.crumb{font-size:.84rem;color:var(--muted);padding:2px 0 14px}
.crumb a{color:var(--muted);text-decoration:none;font-weight:600}
.crumb a:hover{color:var(--brand)}

/* hub masthead */
html,body{overflow-x:hidden}
.mast{background:var(--deep);margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding:26px calc(50vw - 50%) 30px;border-radius:0 0 28px 28px;view-transition-name:mast}
.mast-in{max-width:916px;margin:0 auto}
.mast .topnav{padding:0 0 6px}
.wm-dark{color:#fff}
.mast .navbtn{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.28);color:#fff}
.mast .navbtn:hover{border-color:#fff;color:#fff;background:rgba(255,255,255,.16);transform:translateY(-1px)}
.mast h1{font-family:var(--font-d);font-weight:600;font-size:clamp(1.9rem,4.5vw,2.7rem);color:#fff;letter-spacing:-.01em;margin-top:18px}
.cred{font-size:.86rem;color:rgba(255,255,255,.62);margin-top:6px}
.cred b{color:var(--accent);font-weight:600}
.searchbox{position:relative;max-width:640px;margin:18px 0 0}
.searchbox input{width:100%;font:inherit;font-size:1.02rem;padding:15px 20px 15px 50px;border-radius:14px;border:none;background:#fff;box-shadow:var(--shadow);outline:none;color:var(--ink)}
.searchbox input:focus{box-shadow:0 0 0 3px rgba(159,192,208,.45),var(--shadow)}
.searchbox>svg{position:absolute;left:18px;top:50%;transform:translateY(-50%);opacity:.5}
.results{max-width:640px;margin:8px 0 0;background:var(--card);border-radius:14px;box-shadow:var(--shadow);overflow:hidden;display:none;text-align:left;position:relative;z-index:30}
.results.show{display:block}
.results a{display:flex;justify-content:space-between;gap:10px;padding:13px 20px;text-decoration:none;color:var(--ink);border-bottom:1px solid var(--line);align-items:center}
.results a:last-child{border-bottom:none}
.results a:hover,.results a.sel{background:var(--brand-soft)}
.results .t{font-weight:700;font-size:.94rem}
.results .why{font-size:.77rem;color:var(--muted)}
.results .cat{font-size:.68rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--brand);white-space:nowrap}
.results .none{padding:16px 20px;color:var(--muted);font-size:.9rem}
/* intent pills (in masthead) + pathway */
.pills-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.intent{display:inline-flex;align-items:center;gap:7px;font:inherit;font-size:.84rem;font-weight:600;color:rgba(255,255,255,.88);background:transparent;border:1px solid rgba(255,255,255,.28);border-radius:999px;padding:8px 15px;cursor:pointer;transition:.15s}
.intent svg{width:14px;height:14px;flex:0 0 14px}
.intent:hover{border-color:var(--accent);color:#fff}
.intent.on{background:rgba(255,255,255,.12);border-color:var(--accent);color:#fff}
.intent.urgent{color:#F3CFC1;border-color:rgba(226,160,130,.5)}
.intent.urgent:hover,.intent.urgent.on{border-color:#E2A082}
.pathway{display:none;background:var(--card);border-radius:var(--r);box-shadow:var(--shadow);padding:24px;margin-top:18px}
.pathway.show{display:block}
.pathway h3{font-family:var(--font-d);font-weight:600;font-size:1.08rem;color:var(--deep)}
.pcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:12px;margin-top:14px}
.pcard{border:1px solid var(--line);border-radius:16px;padding:13px 14px;text-decoration:none;color:var(--ink);background:var(--bg);transition:.15s}
.pcard:hover{border-color:var(--brand);background:var(--brand-soft)}
.pcard .t{font-weight:700;font-size:.91rem;color:var(--deep)}
.pcard .s{font-size:.79rem;color:var(--muted);margin-top:3px}
.urgent-note{margin-top:14px;background:var(--warn-bg);border:1px solid var(--warn-line);color:var(--warn);border-radius:14px;padding:12px 16px;font-size:.86rem}
.urgent-note b{font-weight:800}
/* featured row */
.featured{margin-top:26px}
.fhead{display:flex;justify-content:space-between;align-items:baseline}
.fhead h2{font-family:var(--font-d);font-weight:600;font-size:1.3rem;color:var(--deep)}
.fhead a{font-size:.85rem;font-weight:600;text-decoration:none}
.frow{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:12px;margin-top:12px}
@media(max-width:700px){.frow{grid-template-columns:1fr}}
.fcard{background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden;text-decoration:none;color:var(--ink);transition:.15s;box-shadow:0 1px 2px rgba(32,36,41,.04)}
.fcard:hover{border-color:var(--brand);box-shadow:var(--shadow);transform:translateY(-2px)}
.fcard .fpic{height:180px;background:#fff;padding:14px 16px 6px}
.fcard .fpic img{width:100%;height:100%;object-fit:contain}
.fcard .fbd{padding:8px 16px 15px}
.fcard .ft{font-weight:700;font-size:.98rem;color:var(--deep);line-height:1.3}
.fcard .fs{font-size:.78rem;color:var(--muted);margin-top:5px}
/* browse */
.browse{margin-top:44px}
.browse-head{display:flex;flex-direction:column;align-items:center;gap:2px;text-align:center}
.browse h2{font-family:var(--font-d);font-weight:600;font-size:1.45rem;color:var(--deep)}
.count-line{color:var(--muted);font-size:.84rem}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;justify-content:center}
.chip{font:inherit;font-size:.8rem;font-weight:600;padding:7px 13px;border-radius:999px;border:1.5px solid var(--line);background:var(--card);color:var(--ink);cursor:pointer;transition:.14s;white-space:nowrap}
.chip:hover{border-color:var(--brand)}
.chip.active{background:var(--deep);border-color:var(--deep);color:#fff}
.drow{margin-top:26px}
.drow>h3{font-family:var(--font-d);font-weight:600;font-size:1.02rem;color:var(--deep);padding-bottom:4px}
.drow>h3{padding-left:2px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(178px,1fr));gap:12px;padding:10px 0 14px;margin-top:2px}
.browse{width:min(1340px,calc(100vw - 44px));margin-left:calc((100% - min(1340px,calc(100vw - 44px)))/2)}
.related .grid{flex-wrap:wrap;overflow:visible}
.related .grid .ecard{flex:1 1 220px}
.ecard{display:block;background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;text-decoration:none;color:var(--ink);transition:transform .22s cubic-bezier(.34,1.3,.44,1),box-shadow .22s ease,border-color .22s ease;box-shadow:0 1px 2px rgba(32,36,41,.04)}
.ecard:hover{border-color:var(--brand);box-shadow:0 14px 34px rgba(32,36,41,.14);transform:translateY(-4px)}
.ecard .pic{width:100%;height:128px;background:#fff;display:flex;align-items:center;justify-content:center;padding:11px 12px 3px;color:var(--brand)}
.ecard .pic img{width:100%;height:100%;object-fit:contain;background:#fff}
.ecard .pic svg{width:54px;height:54px}
.ecard .bd{padding:7px 14px 13px}
.ecard .nm{font-weight:700;font-size:.85rem;color:var(--deep);line-height:1.3}
.ecard .bl{font-size:.72rem;color:var(--muted);margin-top:2px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hide{display:none!important}
.noresult{color:var(--muted);padding:26px 0;text-align:center}

/* trust + footer */
.trust{margin:46px 0 0;background:var(--card);border-radius:var(--r);box-shadow:var(--shadow);padding:20px 24px;display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.trust .dr{flex:0 0 44px;width:44px;height:44px;border-radius:50%;background:var(--brand);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center}
.trust .t{font-weight:700;color:var(--deep);font-size:.94rem}
.trust .s{font-size:.8rem;color:var(--muted)}
.trust .chipok{margin-left:auto;background:var(--ok-bg);color:var(--ok);font-size:.74rem;font-weight:800;border-radius:999px;padding:6px 14px;white-space:nowrap}
.foot{text-align:center;color:var(--muted);font-size:.76rem;padding:26px 0 40px}
.foot .disc{max-width:70ch;margin:0 auto 8px}

/* ---------- article ---------- */
.art-head{display:grid;grid-template-columns:1.15fr .85fr;gap:26px;align-items:center;margin-top:14px}
.art-head .eyebrow{display:inline-block;font-size:.74rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--brand);text-decoration:none}
a.eyebrow:hover{text-decoration:underline;text-underline-offset:3px}
.art-head h1{font-family:var(--font-d);font-weight:600;font-size:clamp(1.7rem,3.6vw,2.35rem);color:var(--deep);letter-spacing:-.01em;line-height:1.18;margin-top:8px}
.art-head .lead{color:var(--muted);font-size:1.05rem;margin-top:10px;max-width:52ch}
.metarow{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.mchip{font-size:.73rem;font-weight:700;border-radius:999px;padding:5px 12px;background:var(--ok-bg);color:var(--ok)}
.mchip.plain{background:var(--card);color:var(--muted);border:1px solid var(--line)}
.art-fig{border-radius:var(--r);overflow:hidden;background:#fff;box-shadow:var(--shadow);border:1px solid var(--line)}
.art-fig img{display:block;width:100%}
.art-fig.icon{aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;background:var(--brand-soft);color:var(--brand)}
.art-fig.icon svg{width:84px;height:84px}
@media(max-width:760px){.art-head{grid-template-columns:1fr}.art-fig{order:-1;max-width:420px}}
.glance{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin:28px 0 0;box-shadow:0 1px 2px rgba(14,42,38,.04)}
.gfact{background:var(--card);padding:14px 16px}
.gfact .l{font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.gfact .v{font-weight:700;color:var(--deep);font-size:.92rem;margin-top:3px;line-height:1.35}
.sec{margin-top:36px}
.sec>h2{font-family:var(--font-d);font-weight:600;font-size:1.35rem;color:var(--deep);margin-bottom:12px}
.prose p{margin-bottom:14px;max-width:72ch}
.kps{list-style:none;display:grid;gap:10px}
.kps li{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 16px 12px 44px;position:relative;font-size:.95rem;max-width:72ch}
.kps li::before{content:"";position:absolute;left:16px;top:16px;width:16px;height:16px;border-radius:50%;background:var(--brand-soft)}
.kps li::after{content:"";position:absolute;left:20px;top:19.5px;width:8px;height:5px;border-left:2.2px solid var(--brand);border-bottom:2.2px solid var(--brand);transform:rotate(-45deg)}
.warnpanel{background:var(--warn-bg);border:1px solid var(--warn-line);border-radius:var(--r);padding:18px 22px;margin-top:36px}
.warnpanel h2{font-family:var(--font-d);font-weight:600;font-size:1.15rem;color:var(--warn);margin-bottom:8px}
.warnpanel ul{margin-left:18px;color:var(--warn)}
.warnpanel li{margin:5px 0;font-size:.93rem}
.faq{background:var(--card);border:1px solid var(--line);border-radius:14px;margin-bottom:10px;overflow:hidden}
.faq summary{cursor:pointer;font-weight:700;font-size:.95rem;color:var(--deep);padding:14px 44px 14px 18px;list-style:none;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:16px;top:50%;transform:translateY(-52%);font-size:1.25rem;color:var(--brand);font-weight:600;transition:.15s}
.faq[open] summary::after{content:"–"}
.faq .a{padding:0 18px 15px;color:var(--ink);font-size:.93rem;max-width:70ch}
.jcta{display:block;margin-top:36px;background:var(--deep);color:#fff;border-radius:var(--r);padding:20px 24px;text-decoration:none;box-shadow:var(--shadow)}
.jcta .h{font-size:.74rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.jcta .t{font-family:var(--font-d);font-weight:600;font-size:1.15rem;margin-top:4px}
.jcta .t span{transition:.15s;display:inline-block}
.jcta:hover .t span{transform:translateX(4px)}
.related{margin-top:40px}
.related h2{font-family:var(--font-d);font-weight:600;font-size:1.2rem;color:var(--deep);margin-bottom:12px}
.printbtn{display:inline-flex;align-items:center;gap:8px;font:inherit;font-size:.85rem;font-weight:700;color:var(--muted);background:var(--card);border:1.5px solid var(--line);border-radius:999px;padding:9px 18px;cursor:pointer;margin-top:34px}
.printbtn:hover{border-color:var(--brand);color:var(--brand)}
.reviewed{color:var(--muted);font-size:.8rem;margin-top:14px}
@media print{
  .topnav,.crumb,.searchbox,.related,.jcta,.printbtn,.trust,.faq summary::after{display:none!important}
  body{background:#fff;color:#000}.faq{page-break-inside:avoid}.faq[open],.faq{border:none}
  .art-head{grid-template-columns:1fr}.art-fig{max-width:300px}
}
