/* Sunday Tech Club: D1 Club Merch (v10). Navy #14213D, off-white #F5F1E8, sky #3FA9F5 (accent only; navy text on it), muted navy #3A4766 */
:root{--navy:#14213D;--paper:#F5F1E8;--sky:#3FA9F5;--muted:#3A4766;--card:#FFFDF8;--line:#14213D;--soft:#E8E2D3;--r:14px;
--display:"Anton",Impact,"Arial Narrow Bold",sans-serif;--label:"Archivo Black","Arial Black",system-ui,sans-serif;--body:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
*{box-sizing:border-box}
html{font-size:20px;scroll-behavior:smooth;scroll-padding-top:7rem;overflow-x:clip}
@media(min-width:900px){html{font-size:21px}}
body{margin:0;background:var(--paper);color:var(--navy);font:500 1rem/1.65 var(--body);overflow-x:clip}
h1,h2{font-family:var(--display);font-weight:400;text-transform:uppercase;letter-spacing:.01em;line-height:1.05;color:var(--navy)}
h1{font-size:clamp(2.6rem,6.4vw,4.6rem);margin:.15em 0 .4em}
h2{font-size:clamp(1.7rem,3.4vw,2.4rem);margin:0 0 .5em}
h3{font:1.1rem/1.3 var(--label);margin:.2em 0 .4em;color:var(--navy)}
p{margin:0 0 1em}
.lead{font-size:1.15rem;color:var(--muted);max-width:44rem}
.note,.fine,.fine-print{color:var(--muted)}
.fine,.fine-print{font-size:.9rem}
a{color:var(--navy);text-decoration:underline;text-decoration-color:var(--sky);text-decoration-thickness:3px;text-underline-offset:4px;font-weight:600}
a:hover{text-decoration-color:var(--navy)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:4px solid var(--sky);outline-offset:3px;border-radius:6px}
.skip{position:absolute;left:-999px;top:0;background:var(--navy);color:var(--paper);padding:.6em 1em;z-index:50}.skip:focus{left:1em}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.ic{width:1.1em;height:1.1em;vertical-align:-.15em;flex:none}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
/* header */
header.site{position:sticky;top:0;z-index:20;background:var(--navy);color:var(--paper);border-bottom:6px solid var(--sky)}
.bar{max-width:1180px;margin:auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:.5rem 1.25rem;gap:.5rem}
.logo{display:inline-flex;align-items:center;gap:.6rem;text-decoration:none;color:inherit}
.logo-img{width:3.1rem;height:3.1rem;flex:none}
.wm{font:1.25rem/1 var(--display);text-transform:uppercase;letter-spacing:.03em}
header .logo,header .wm{color:var(--paper)}
nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:.25rem;margin:0;padding:0}
nav a{display:block;padding:.5em .85em;border-radius:999px;text-decoration:none;color:var(--paper);font:.85rem var(--label);text-transform:uppercase;letter-spacing:.06em}
nav a:hover{background:rgba(245,241,232,.12)}
nav a[aria-current=page]{background:var(--sky);color:var(--navy)}
.menu-btn{font:.9rem var(--label);text-transform:uppercase;letter-spacing:.06em;padding:.55em 1.1em;border-radius:999px;border:2px solid var(--paper);background:none;color:var(--paper);cursor:pointer;min-height:48px}
.menu-btn[hidden]{display:none}
@media(min-width:1000px){.menu-btn{display:none}}
@media(max-width:999px){.js nav{display:none;width:100%}.js nav.open{display:block;border-top:2px solid rgba(245,241,232,.25);margin-top:.4rem}.js nav ul{flex-direction:column;padding:.4rem 0}.js nav a{font-size:1rem;padding:.8em 1em;border-radius:10px}}
/* layout */
main{max-width:1180px;margin:auto;padding:1rem 1.25rem 3rem}
.section{margin:3rem 0}
.section-head{margin-bottom:1.4rem}
.hero{padding:2.4rem 0 1.6rem;border-bottom:3px solid var(--navy);margin-bottom:2rem}
.hero-split,.pricing{display:grid;gap:2rem;align-items:start}
@media(min-width:900px){.hero-split,.pricing{grid-template-columns:1.4fr 1fr}}
.grid{display:grid;gap:1.2rem}
@media(min-width:720px){.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.grid-3{grid-template-columns:repeat(3,1fr)}}
/* labels */
.eyebrow,.kicker,.est-pill,.pill,.best,.panel-label{display:inline-flex;align-items:center;gap:.4em;font:.78rem var(--label);text-transform:uppercase;letter-spacing:.12em;color:var(--navy);background:var(--sky);padding:.4em .9em;border-radius:999px;margin:0 0 .8rem}
.eyebrow a{color:var(--navy)}
.pill{font-size:.7rem}
.est{font:.8rem var(--label);letter-spacing:.2em;text-transform:uppercase;color:var(--sky);margin:0}
/* buttons: blue always with navy text */
.btn,.copy-btn,.chip{display:inline-flex;align-items:center;justify-content:center;gap:.5em;font:1rem var(--label);text-transform:uppercase;letter-spacing:.05em;text-decoration:none;border-radius:999px;cursor:pointer;min-height:52px;padding:.7em 1.4em;border:3px solid var(--navy);transition:transform .15s,box-shadow .15s}
.btn,.btn-hero,.btn-gold{background:var(--sky);color:var(--navy);box-shadow:4px 4px 0 var(--navy)}
.btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--navy);color:var(--navy)}
.btn-alt{background:var(--paper);color:var(--navy)}
.btn-big{font-size:1.05rem;padding:.85em 1.6em;min-height:58px}
.btn[aria-disabled=true]{opacity:.6;pointer-events:none}
.cta-row{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;margin:1.2rem 0}
.more{font:.95rem var(--label);text-transform:uppercase;letter-spacing:.04em}
.price-line{font:1rem var(--label);color:var(--navy);margin:.2rem 0 .8rem}
/* home */
.hero-home{display:grid;gap:2rem;align-items:center;padding:2.6rem 0 2.4rem;border-bottom:3px solid var(--navy)}
@media(min-width:900px){.hero-home{grid-template-columns:1.5fr 1fr}}
.hero-home h1{font-size:clamp(2.9rem,7vw,5.2rem)}
.hero-art{text-align:center}.hero-art img{width:min(100%,22rem);height:auto}
@media(max-width:699px){.hero-art{display:none}}
.hero-sublink{font-size:1rem}
.navy-panel{background:var(--navy);color:var(--paper);border-radius:22px;padding:2.2rem 1.6rem;border-bottom:8px solid var(--sky)}
.navy-panel h2,.navy-panel h3,.navy-panel strong{color:var(--paper)}
.navy-panel a:not(.btn){color:var(--paper)}
.navy-panel .price-line{color:var(--paper)}
.navy-panel p,.navy-panel li{color:var(--paper)}
.inside-list{list-style:none;padding:0;margin:0;display:grid;gap:.7rem}
@media(min-width:800px){.inside-list{grid-template-columns:1fr 1fr}}
.inside-list li{padding:.8rem 1rem .8rem 1.2rem;border-left:6px solid var(--sky);background:rgba(245,241,232,.06);border-radius:6px}
.closing{text-align:center}.closing .cta-row{justify-content:center}
.who-brief{border-top:3px solid var(--navy);padding-top:2rem}
/* cards */
.card,.prompt-card,.tip-box,.toc,.faq-item,.myth,.price-card,.cat-tile,.pop,.wn,.tool{background:var(--card);border:3px solid var(--navy);border-radius:var(--r);padding:1.4rem;box-shadow:5px 5px 0 var(--navy)}
.card p:last-child{margin-bottom:0}
.badge{width:2.6rem;height:2.6rem;padding:.55rem;background:var(--sky);color:var(--navy);border-radius:50%;border:2px solid var(--navy);margin-bottom:.5rem;display:block}
.badge-lg{width:3.2rem;height:3.2rem}
.tint{background:var(--soft);border-radius:22px;padding:2rem 1.6rem}
.band{margin:3rem 0}
.callout{background:var(--card);border-left:8px solid var(--sky);padding:1rem 1.3rem;border-radius:8px;margin:1.5rem 0}
.checklist{padding-left:1.3rem}.checklist li{margin:.5rem 0}
.steps{list-style:none;padding:0;display:grid;gap:1.2rem}
@media(min-width:900px){.steps-3{grid-template-columns:repeat(3,1fr)}}
.steps li{background:var(--card);border:3px solid var(--navy);border-radius:var(--r);padding:1.4rem;box-shadow:5px 5px 0 var(--navy)}
.step-n{display:inline-grid;place-items:center;width:3.4rem;height:3.4rem;border-radius:50%;background:var(--navy);color:var(--sky);font:1.9rem/1 var(--display);margin-bottom:.6rem}
/* prompts */
.prompt-grid{display:grid;gap:1.2rem}
@media(min-width:800px){.prompt-grid{grid-template-columns:repeat(2,1fr)}}
.prompt-text{white-space:pre-wrap;font:500 .95rem/1.6 var(--body);background:var(--paper);border:2px dashed var(--muted);border-radius:10px;padding:1rem;color:var(--navy);overflow-x:auto}
.bracket{background:var(--sky);color:var(--navy);border-radius:4px;padding:0 .2em;font-weight:700}
.copy-btn{background:var(--paper);color:var(--navy);font-size:.9rem;min-height:48px;padding:.5em 1.1em}
.copy-btn:hover,.copy-btn.copied{background:var(--sky);color:var(--navy)}
.when{font-size:.95rem;color:var(--muted)}
.subnav{position:sticky;top:5.2rem;z-index:10;background:var(--paper);padding:.8rem 0;border-bottom:3px solid var(--navy);margin-bottom:1.5rem}
.subnav-inner,.mm-chips{display:flex;flex-wrap:wrap;gap:.5rem}
.chip{background:var(--paper);color:var(--navy);font-size:.82rem;min-height:46px;padding:.45em 1em;border-width:2px}
.chip[aria-pressed=true]{background:var(--sky);color:var(--navy)}
.chip-ic{width:1em;height:1em}
.search-row{position:relative;margin-bottom:.8rem;max-width:36rem}.search-ic{position:absolute;left:.9rem;top:50%;transform:translateY(-50%)}
input,select{font:500 1rem var(--body);color:var(--navy);background:#fff;border:3px solid var(--navy);border-radius:10px;padding:.75em 1em;width:100%;min-height:52px}
#psearch{padding-left:2.6rem}
.su-l{display:block;font:.85rem var(--label);text-transform:uppercase;letter-spacing:.06em;margin:.8rem 0 .3rem}
.cat{margin:2.5rem 0}.cat-head{display:flex;gap:1rem;align-items:center;margin-bottom:1rem}.cat-head h2{margin:0}
.toast{position:fixed;left:50%;bottom:1.5rem;transform:translate(-50%,150%);background:var(--navy);color:var(--paper);padding:.8em 1.3em;border-radius:12px;border:3px solid var(--sky);font:.95rem var(--label);transition:transform .25s,opacity .25s;opacity:0;visibility:hidden;z-index:60;max-width:90vw}
.toast.show{transform:translate(-50%,0);opacity:1;visibility:visible}
.recent,.empty,.filter-status{margin:1rem 0}
/* signup */
.signup-box,.signup-compact{background:var(--card);border:3px solid var(--navy);border-radius:22px;padding:1.8rem;box-shadow:6px 6px 0 var(--sky)}
@media(min-width:900px){.signup-box,.signup-compact{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center}}
.su-inline{display:flex;flex-wrap:wrap;gap:.6rem}.su-inline input{flex:1 1 14rem;width:auto}
.su-status{font-weight:700;margin-top:.6rem}
.signup .btn{margin-top:.8rem}.su-inline .btn{margin-top:0}
/* pricing */
.price-card{position:relative}
.amt{font:3.4rem/1 var(--display);color:var(--navy);margin:.3rem 0}.amt small{font:1rem var(--label);margin-left:.4rem;color:var(--muted)}
.price-card ul,.pay-trust,.trust,.paysec-list{list-style:none;padding:0}
.price-card li,.paysec-list li{display:flex;gap:.6rem;margin:.5rem 0}
.trust,.pay-trust{display:flex;flex-wrap:wrap;gap:.6rem 1.4rem;font-weight:600}
.secure-badge,.secure-line{font-weight:600;color:var(--navy)}
.home-secure{border:3px solid var(--navy);border-radius:12px;padding:1rem 1.2rem;background:var(--card)}
.on-dark{color:var(--paper)!important}
.bundle-strip{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center;background:var(--navy);color:var(--paper);border-radius:var(--r);padding:1.2rem 1.4rem;margin-bottom:1.4rem}
.bundle-strip span{display:block;color:var(--paper)}
.topic-buy{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.8rem}
.tp-price{font:1.6rem var(--display)}.tp-price small{font:.8rem var(--body);color:var(--muted)}
.pack-promo{background:var(--navy);color:var(--paper);border-radius:22px;padding:2.2rem 1.6rem;text-align:center;border-bottom:8px solid var(--sky)}
.pack-promo h2,.pack-promo p{color:var(--paper)}.pack-promo .cta-row{justify-content:center}
.paysec{display:flex;gap:1.2rem;align-items:flex-start;background:var(--card);border:3px solid var(--navy);border-radius:22px;padding:1.8rem}
.ty-upsell{margin:2rem 0}
/* faq */
.faq{display:grid;gap:.8rem;max-width:52rem}.faq-tools{margin-bottom:1rem}
.faq-item{padding:0}
.faq-q{margin:0;font-size:1rem}.faq-q button{width:100%;display:flex;justify-content:space-between;align-items:center;gap:1rem;text-align:left;font:1rem/1.4 var(--label);color:var(--navy);background:none;border:0;padding:1.1rem 1.3rem;cursor:pointer;min-height:56px}
.faq-sign{flex:none;width:1.8rem;height:1.8rem;border-radius:50%;background:var(--sky);border:2px solid var(--navy);position:relative}
.faq-sign::before,.faq-sign::after{content:"";position:absolute;left:50%;top:50%;width:.7rem;height:3px;background:var(--navy);transform:translate(-50%,-50%)}
.faq-sign::after{transform:translate(-50%,-50%) rotate(90deg)}
[aria-expanded=true] .faq-sign::after{transform:translate(-50%,-50%) rotate(0)}
.faq-a{padding:0 1.3rem 1.1rem}.faq-a p{margin:0}
details.card summary{cursor:pointer;font-family:var(--label)}details.card p{margin-top:.8rem}
/* misc */
.myth-q{font:1.05rem var(--label)}
.fit-good{border-top:10px solid var(--sky)}.fit-poor{border-top:10px solid var(--muted)}
.maker{color:var(--muted);margin-top:-.4rem}
dl dt{font:.85rem var(--label);text-transform:uppercase;letter-spacing:.05em;margin-top:.7rem}dl dd{margin:0}
.cheat{display:grid;gap:1.2rem}@media(min-width:900px){.cheat{grid-template-columns:1fr 1fr}}
.cs-prompt{display:block;color:var(--muted)}
.mm-form fieldset{border:0;padding:0;margin:0}.mm-form legend h2{margin:0}
.mm-privacy{font-size:.95rem;color:var(--muted);margin-top:1rem}
.mm-packs,.mm-signup{margin-top:1.5rem}
.mm-pack-list{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.6rem}
.guide{max-width:48rem}.guide h2{margin-top:2rem}
.wia{max-width:52rem}
.contact-line{font-weight:600}
/* footer */
footer{background:var(--navy);color:var(--paper);border-top:8px solid var(--sky);padding:2.6rem 1.25rem 1.6rem}
.foot{max-width:1180px;margin:auto;display:grid;gap:2rem}
@media(min-width:900px){.foot{grid-template-columns:1fr 1.6fr}}
footer p,footer .fine{color:var(--paper)}
footer a{color:var(--paper);text-decoration-color:var(--sky)}
.foot-tag{font-size:1.05rem;margin-top:.8rem}
.foot-links{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(12rem,1fr));gap:.5rem 1rem}
.foot-links a{font-weight:600;display:inline-block;padding:.25em 0}
footer>.fine{max-width:1180px;margin:2rem auto 0;border-top:1px solid rgba(245,241,232,.25);padding-top:1rem}
/* reveal */
.js .rv{opacity:0;transform:translateY(18px);transition:opacity .6s,transform .6s}.js .rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.js .rv{opacity:1;transform:none}*{animation:none!important;transition:none!important}}
@media print{header.site,footer,.skip,.no-print,.toast{display:none!important}body{background:#fff;font-size:11pt}html{font-size:12px}main{padding:0;max-width:none}.card{box-shadow:none;break-inside:avoid}.js .rv{opacity:1;transform:none}}
/* v11 polish */
.h-sub{font:1.15rem/1.35 var(--label);text-transform:none;letter-spacing:0;margin:1.2rem 0 .3rem}
.price-card .btn{width:100%}
@media(max-width:600px){main{padding:.6rem 1rem 2.4rem}.card,.prompt-card,.price-card,.steps li{padding:1.15rem;box-shadow:4px 4px 0 var(--navy)}.navy-panel,.pack-promo,.tint,.signup-box,.signup-compact{padding:1.5rem 1.1rem;border-radius:16px}.btn{width:100%}.cta-row{flex-direction:column;align-items:stretch}.topic-buy .btn{width:auto}.subnav{top:4.4rem}.bundle-strip .btn{width:100%}.wm{font-size:1.1rem}.logo-img{width:2.6rem;height:2.6rem}}
/* v12 services */
.svc{display:flex;flex-direction:column}.svc .h-sub{font-size:1.3rem}.svc-btns{margin-top:auto;display:grid;gap:.7rem;padding-top:.6rem}.svc-btns .btn{width:100%}
.promo-line{background:var(--sky);color:var(--navy);border:2px solid var(--navy);border-radius:10px;padding:.5em .8em}
@media(min-width:1000px) and (max-width:1100px){nav a{padding:.5em .6em}}
/* v13 plans */
.plans{display:grid;gap:1rem;margin:1.2rem 0}@media(min-width:800px){.plans{grid-template-columns:repeat(3,1fr)}}
.plan{background:var(--card);color:var(--navy);border:3px solid var(--navy);border-radius:var(--r);padding:1.3rem;box-shadow:5px 5px 0 var(--sky);display:flex;flex-direction:column;text-align:left}
.plan h3,.plan .amt,.plan p{color:var(--navy)!important}.plan .best{align-self:flex-start}.plan .btn{margin-top:auto;width:100%}
.plan-best{border-width:4px;box-shadow:7px 7px 0 var(--sky);transform:translateY(-4px)}
.plan-free{font:1rem var(--label);margin:.2rem 0 1rem}
.navy-panel .plans-note{color:var(--paper)}
.mini-plans{list-style:none;padding:0;margin:.4rem 0}.mini-plans li{margin:.3rem 0;padding-left:.8rem;border-left:4px solid var(--sky)}
/* v14 free section */
.free-sec{background:var(--navy);color:var(--paper);border-radius:22px;padding:2rem 1.4rem;border-bottom:8px solid var(--sky)}
.free-sec h2,.free-sec .lead{color:var(--paper)}
.free-label{display:inline-block;background:var(--sky);color:var(--navy);font:1rem var(--label);letter-spacing:.14em;text-transform:uppercase;padding:.35em 1em;border-radius:999px;margin:0 0 .6rem}
.free-grid{display:grid;gap:1rem}@media(min-width:700px){.free-grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:1000px){.free-grid{grid-template-columns:repeat(3,1fr)}}
.free-card{display:flex;flex-direction:column;gap:.3rem;background:var(--paper);color:var(--navy);text-decoration:none;border:3px solid var(--sky);border-radius:var(--r);padding:1.2rem;min-height:9rem;transition:transform .15s}
.free-card:hover,.free-card:focus-visible{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--sky)}
.free-t{font:1.1rem var(--label);color:var(--navy)}.free-d{color:var(--navy);font-weight:500}.free-go{margin-top:auto;font:.9rem var(--label);text-transform:uppercase;letter-spacing:.06em;color:var(--navy)}
.navy-panel .kicker,.navy-panel .best,.navy-panel .eyebrow,.free-sec .kicker{color:var(--navy)}
.toc a,main nav a{color:var(--navy);background:none;text-transform:none;letter-spacing:0;font:600 1rem var(--body);padding:.25em 0;border-radius:0}.toc a:hover{text-decoration-color:var(--navy)}
.price-card .mini-plans li{display:block}
