/* Inner pages: re-theme legacy components (style.css) onto the Drafting Table system (home.css). Loaded last. */
main{padding-top:68px}
.container{max-width:var(--max);margin:0 auto;padding:0 24px}
body{background:var(--canvas);color:var(--chalk);font-family:var(--font-body)}
a{color:var(--chalk)}
a:hover{color:var(--accent-hover)}
p,li{color:var(--chalk-2)}
strong{color:var(--chalk)}
h1,h2,h3,h4{color:var(--chalk)}
.lede{color:var(--chalk-2);max-width:60ch}
/* heroes */
.page-hero,.template-hero,.choice-hero,.hero,.hero.hero-templates,.article-header{background:transparent;color:var(--chalk);border-bottom:1px solid var(--line);padding:clamp(48px,7vw,96px) 0 clamp(36px,5vw,64px)}
.page-hero h1,.template-hero h1,.choice-hero h1,.article-header h1,.hero h1{color:var(--chalk);font-size:clamp(2.1rem,4.6vw,3.4rem);max-width:20ch}
.page-hero p,.template-hero p,.choice-hero p,.hero p{color:var(--chalk-2)}
.page-hero .eyebrow,.template-hero .eyebrow,.eyebrow-dark,.eyebrow-light,.hub-tag{display:inline-block;font-family:var(--font-mono);font-weight:400;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--chalk-2);background:none;padding:0 0 0 26px;margin-bottom:18px;position:relative;border:0}
.page-hero .eyebrow::before,.template-hero .eyebrow::before,.eyebrow-dark::before,.eyebrow-light::before,.hub-tag::before{content:"";position:absolute;left:0;top:50%;width:18px;height:1px;background:var(--accent)}
.breadcrumbs,.breadcrumbs a{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.08em;color:var(--chalk-2);text-decoration:none}
.breadcrumbs{margin-bottom:22px}
.article-meta-row{display:flex;flex-wrap:wrap;gap:6px 22px;font-family:var(--font-mono);font-size:.76rem;letter-spacing:.08em;text-transform:uppercase;color:var(--chalk-2);margin-top:18px}
/* sections */
.section{padding:clamp(48px,7vw,96px) 0}
.section-alt,.intro-band{background:rgba(10,26,40,.55);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section-head h2,.section-head p{color:inherit}
.section-head p{color:var(--chalk-2)}
/* cards and panels */
.card,.product-card,.problem-item,.path-item,.pl-card,.side-box,.hero-panel,.principle-grid>div,.kit-grid>div,.guide-step,.process-step,.accent-box,.feature-panel,.light-panel,.author-box{background:rgba(21,48,74,.45);border:1px solid var(--line);border-radius:14px;box-shadow:none;color:var(--chalk-2)}
.card:hover,.problem-item:hover,.path-item:hover{border-color:var(--line-strong);box-shadow:none;transform:translateY(-2px)}
.card h3,.card h3 a,.path-item strong,.principle-grid strong,.kit-grid strong,.side-box h4,.pl-card h4,.guide-step h2,.author-box strong{color:var(--chalk)}
.card h3 a:hover{color:var(--accent-hover)}
.card p,.principle-grid p,.kit-grid p,.path-item small{color:var(--chalk-2)}
.card .card-link,.card-link{color:var(--accent);font-weight:600;text-decoration:none}
.featured-product{border-color:var(--line-strong);background:rgba(27,58,87,.7)}
.product-price,.checkout-price{color:var(--chalk);font-family:var(--font-display)}
.badge,.badge-live,.badge-soon,.article-meta{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--chalk-2)}
.badge,.badge-live,.badge-soon{background:rgba(232,111,81,.14);border:1px solid rgba(232,111,81,.4);color:var(--accent-hover);border-radius:999px;padding:3px 10px}
.hub-icon{background:rgba(110,149,176,.14);color:var(--chalk)}
.coral-panel,.ink-panel,.product-offer,.signup-panel,.optin,.optin-inline{background:linear-gradient(135deg,#15304A,#0E2031);border:1px solid var(--line-strong);color:var(--chalk);border-radius:20px}
.coral-panel h2,.coral-panel p,.ink-panel h2,.ink-panel p,.optin h2,.optin h3,.optin p,.optin li{color:var(--chalk)}
.optin p,.optin li{color:var(--chalk-2)}
/* article body */
.article-body{max-width:760px;margin:0 auto;padding:clamp(40px,6vw,72px) 24px}
.article-body h2{font-size:clamp(1.5rem,2.6vw,2rem);margin:2.2em 0 .6em;padding-top:.2em}
.article-body h3{margin:1.6em 0 .5em}
.article-body p,.article-body li{color:var(--chalk-2);font-size:1.0625rem;line-height:1.7}
.article-body a,.text-block a,.faq-item a{color:var(--chalk);text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:3px}
.article-body .quick-answer,.quick-answer{background:rgba(27,58,87,.7);border:1px solid var(--line-strong);border-left:4px solid var(--accent);border-radius:12px;padding:22px 24px;color:var(--chalk)}
.quick-answer p{color:var(--chalk)}
.quick-answer .label,.article-body .quick-answer .label{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.research-basis,.disclosure,.ai-disclosure,.callout,.callout.warn,.form-note{background:rgba(10,26,40,.6);border:1px solid var(--line);border-left:3px solid var(--line-strong);border-radius:10px;color:var(--chalk-2);padding:16px 20px;font-size:.95rem}
.disclosure strong,.ai-disclosure strong,.research-basis strong,.callout strong{color:var(--chalk)}
.criteria-list li,.steps li,.text-block li{color:var(--chalk-2)}
.criteria-list li{border-top:1px solid rgba(44,79,110,.6)}
.faq-item{border-top:1px solid var(--line)}
.faq-item h4{color:var(--chalk);font-size:1.1rem}
.faq-item p{color:var(--chalk-2)}
.reviewed-line{font-family:var(--font-mono);font-size:.78rem;letter-spacing:.06em;color:var(--chalk-2);border-top:1px solid var(--line);margin-top:2.4em;padding-top:1.4em}
.related-guides{margin-top:12px;font-family:var(--font-body);letter-spacing:0;font-size:.95rem}
.related-guides a{color:var(--chalk)}
.author-box{padding:22px 24px;margin-top:2em}
/* tables */
.table-wrap{border:1px solid var(--line);border-radius:12px;background:rgba(10,26,40,.5)}
table{color:var(--chalk-2);background:transparent;border-collapse:collapse;width:100%}
table caption{color:var(--chalk)}
thead th{background:var(--panel-2);color:var(--chalk);font-family:var(--font-mono);font-weight:400;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;border-bottom:1px solid var(--line-strong)}
tbody td,tbody th{border-top:1px solid var(--line);color:var(--chalk-2);background:transparent}
tbody th{color:var(--chalk)}
tbody tr:nth-child(even) td,tbody tr:nth-child(even) th{background:rgba(21,48,74,.35)}
/* forms and buttons */
.btn-primary,.btn-light{background:var(--chalk);color:var(--ink)}
.btn-secondary,.btn-outline{background:rgba(21,48,74,.45);color:var(--chalk);border-color:var(--line-strong)}
.btn-secondary:hover,.btn-outline:hover{background:rgba(110,149,176,.2);color:var(--chalk)}
.btn-accent{color:var(--ink)}
.btn.btn-sm{min-height:38px;padding:0 16px;font-size:.92rem}
.optin-form input[type=text],.optin-form input[type=email],input[type=text],input[type=email],textarea{background:#0A1A28;color:var(--chalk);border:1px solid var(--line-strong);border-radius:10px}
.optin-fine,.small,.form-note{color:var(--chalk-2)}
hr.rule{border-color:var(--line)}
/* footer sits on the same system; legacy rules should not leak */
.site-footer{background:transparent}
@media (max-width:860px){main{padding-top:64px}}
.article-header .container{max-width:820px}
.article-body{max-width:820px}
tbody th{white-space:normal}
thead th{letter-spacing:.06em;font-size:.7rem}
.table-wrap table{min-width:560px}
.optin .optin-form{background:rgba(10,26,40,.72)}
/* legacy navy/ink text that must flip on dark */
.text-block p,.text-block li,.problem-item,.steps li,.sample-prompts li,.hero-panel li,.intro-grid p,.optin ul,.product-offer p,.light-copy,.checkout-note,.checkout-terms{color:var(--chalk-2)}
.text-block strong,.steps strong,.intro-grid h2,.problem-item strong,.process-step .step-num{color:var(--chalk)}
.steps li::before{color:var(--ink);background:var(--accent)}
.hero-badge,.hero-templates .hero-badge,.product-note,.hero-note,.product-preview figcaption{color:var(--chalk-2)}
.checkout-panel{background:rgba(10,26,40,.72);border:1px solid var(--line-strong);color:var(--chalk)}
.disclosure a,.optin-form a,.checkout-terms a{color:var(--chalk)}
.optin-form label{color:var(--chalk-2)}
.optin-form input::placeholder{color:#6E8294}
.hero-templates h1,.hero-templates p.lede{color:var(--chalk)}
.text-block h2,.article-body h2.small-h{font-size:clamp(1.35rem,2.2vw,1.7rem);margin:2em 0 .5em}
.text-block h3{font-size:1.15rem;margin:1.5em 0 .4em}
.steps li{background:rgba(21,48,74,.45);border:1px solid var(--line);color:var(--chalk-2);box-shadow:none}
.steps li strong{color:var(--chalk)}
.process-step .step-num,.process-step span.step-num{background:var(--accent);color:var(--ink);font-family:var(--font-mono)}
.process-step{background:rgba(21,48,74,.45)}
.process-step strong,.process-step h3,.process-step h4{color:var(--chalk)}
.process-step p{color:var(--chalk-2)}
form input:not([type=hidden]):not([type=checkbox]):not([type=radio]),form textarea,form select{background:#0A1A28;color:var(--chalk);border:1px solid var(--line-strong);border-radius:10px}
form input::placeholder,form textarea::placeholder{color:#6E8294}
/* legacy variables used by inline styles in some pages */
:root{--navy:#EAF2F6;--navy-2:#A9BDCA;--ink-soft:#A9BDCA;--border:#2C4F6E;--steel:#A9BDCA;--gold:#E86F51;--gold-dark:#F58A6E}
.btn-primary{background:#EAF2F6;color:#0E2031}
.optin-form input:not([type=hidden]),.optin-form textarea,.optin-form select{background:#0A1A28!important;color:var(--chalk)!important;border:1px solid var(--line-strong)!important;border-radius:10px;padding:13px 16px;width:100%;margin-bottom:16px;font-family:inherit}
.optin-form label.small{display:block;margin-bottom:8px}
.article-card h3,.article-card h3 a{color:var(--chalk)}