:root{
  --bg:#f7f6f4;--surface:#ffffff;--surface2:#faf9f7;
  --border:#e2ddd7;--muted:#635e57;--body:#222018;--head:#0e0d0a;
  --acc:#c8420a;--acc-h:#a83508;--acc-m:#fdf0eb;
  --tag-bg:#faeae2;--tag:#b33b09;
  --r1:3px;--r2:7px;--r3:12px;
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:64px;
  --serif:'Merriweather',Georgia,'Times New Roman',serif;
  --sans:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --sh1:0 1px 3px rgba(0,0,0,.07),0 1px 2px rgba(0,0,0,.04);
  --sh2:0 4px 20px rgba(0,0,0,.10);
}
@media(prefers-color-scheme:dark){
  :root{
    --bg:#111008;--surface:#181710;--surface2:#1d1c14;
    --border:#302e24;--muted:#9c9588;--body:#e0dcd4;--head:#f5f2ec;
    --acc:#f07040;--acc-h:#f58860;--acc-m:#2a1a10;
    --tag-bg:#281808;--tag:#f4855a;
  }
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;scroll-behavior:smooth}
body{background:var(--bg);color:var(--body);font-family:var(--sans);line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--acc);text-decoration:none}
a:hover{color:var(--acc-h);text-decoration:underline}

.hdr{background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:100}
.hdr-in{max-width:940px;margin:0 auto;padding:var(--s3) var(--s5);display:flex;align-items:center;justify-content:space-between;gap:var(--s4)}
.logo{font-family:var(--serif);font-weight:700;font-size:1.15rem;color:var(--head);letter-spacing:-.03em;text-decoration:none;display:block}
.logo span{color:var(--acc)}
.logo-tag{font-size:.68rem;color:var(--muted);letter-spacing:.06em;text-transform:uppercase}
.nav{display:flex;gap:var(--s5);list-style:none}
.nav a{font-size:.84rem;color:var(--muted)}
.nav a:hover{color:var(--body);text-decoration:none}
.nav a[aria-current=page]{color:var(--acc);font-weight:600}
@media(max-width:700px){.nav{display:none}}

.wrap{max-width:940px;margin:0 auto;padding:var(--s7) var(--s5);display:grid;grid-template-columns:1fr 300px;gap:var(--s7);align-items:start}
@media(max-width:840px){.wrap{grid-template-columns:1fr}.sidebar{order:-1}}
.wrap-narrow{max-width:760px;margin:0 auto;padding:var(--s7) var(--s5) var(--s8)}

.bc{font-size:.77rem;color:var(--muted);margin-bottom:var(--s5);display:flex;gap:var(--s2);flex-wrap:wrap;align-items:center}
.bc a{color:var(--muted)}.bc a:hover{color:var(--body)}
.bc .sep{opacity:.4}

.cat{display:inline-block;background:var(--tag-bg);color:var(--tag);font-size:.68rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;padding:3px 10px;border-radius:var(--r1);margin-bottom:var(--s4)}
.title{font-family:var(--serif);font-size:clamp(1.55rem,3.5vw,2.1rem);line-height:1.24;color:var(--head);letter-spacing:-.025em;margin-bottom:var(--s4)}
.deck{font-size:1.05rem;color:var(--muted);line-height:1.7;margin-bottom:var(--s5);border-left:3px solid var(--acc);padding-left:var(--s4)}
.lead{font-size:1rem;color:var(--muted);line-height:1.75;margin-bottom:var(--s6)}
.meta{display:flex;align-items:center;gap:var(--s3);margin-bottom:var(--s6);padding-bottom:var(--s5);border-bottom:1px solid var(--border);flex-wrap:wrap}
.avatar{width:36px;height:36px;border-radius:50%;background:var(--acc-m);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.85rem;color:var(--acc);flex-shrink:0}
.author-name{font-size:.85rem;font-weight:600;color:var(--body);display:block}
.art-date{font-size:.77rem;color:var(--muted)}
.read-time{font-size:.77rem;color:var(--muted);margin-left:auto}

.hero{width:100%;aspect-ratio:16/7;background:var(--acc-m);border-radius:var(--r2);margin-bottom:var(--s6);display:flex;align-items:center;justify-content:center}
.hero-in{text-align:center;padding:var(--s5)}
.hero-num{font-family:var(--serif);font-size:clamp(2.6rem,7vw,4.4rem);font-weight:700;color:var(--acc);line-height:1}
.hero-lbl{font-size:.88rem;color:var(--muted);margin-top:var(--s2);max-width:300px;margin-left:auto;margin-right:auto;line-height:1.5}

.prose{font-family:var(--serif);font-size:1rem;line-height:1.85;color:var(--body)}
.prose p{margin-bottom:var(--s5)}
.prose h2{font-family:var(--serif);font-size:1.28rem;color:var(--head);margin:var(--s7) 0 var(--s4);line-height:1.3}
.prose ul{padding-left:var(--s5);margin-bottom:var(--s5)}
.prose li{line-height:1.75;margin-bottom:var(--s2)}
.prose strong{font-weight:700;color:var(--head)}
.pq{font-family:var(--serif);font-size:1.1rem;font-style:italic;color:var(--head);border-left:4px solid var(--acc);padding:var(--s4) var(--s5);margin:var(--s6) 0;background:var(--acc-m);border-radius:0 var(--r2) var(--r2) 0;line-height:1.7}

.dbox{background:var(--surface);border:1px solid var(--border);border-radius:var(--r3);padding:var(--s5) var(--s6);margin:var(--s6) 0;box-shadow:var(--sh1)}
.dbox-ttl{font-size:.68rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:var(--s5)}
.dgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4);text-align:center}
@media(max-width:480px){.dgrid{grid-template-columns:1fr 1fr}}
.dnum{font-size:1.8rem;font-weight:700;color:var(--acc);line-height:1}
.dlbl{font-size:.75rem;color:var(--muted);margin-top:var(--s2);line-height:1.4}

.list{display:flex;flex-direction:column;gap:var(--s4)}
.acard{display:block;background:var(--surface);border:1px solid var(--border);border-radius:var(--r3);padding:var(--s5);box-shadow:var(--sh1);transition:border-color .15s,transform .12s}
.acard:hover{border-color:var(--acc);text-decoration:none;transform:translateY(-2px)}
.acard-cat{font-size:.65rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--tag);background:var(--tag-bg);padding:2px 8px;border-radius:var(--r1);display:inline-block;margin-bottom:var(--s3)}
.acard h3{font-family:var(--serif);font-size:1.04rem;line-height:1.35;color:var(--head);margin-bottom:var(--s3);font-weight:700}
.acard p{font-size:.86rem;color:var(--muted);line-height:1.6;margin-bottom:var(--s3)}
.acard-meta{font-size:.73rem;color:var(--muted);display:flex;gap:var(--s3);align-items:center;flex-wrap:wrap}
.acard-meta .dot{opacity:.4}

.sidebar{display:flex;flex-direction:column;gap:var(--s5)}
.scard{background:var(--surface);border:1px solid var(--border);border-radius:var(--r3);padding:var(--s5);box-shadow:var(--sh1)}
.scard h4{font-size:.68rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:var(--s4)}
.scard p{font-size:.83rem;color:var(--muted);line-height:1.55}
.scard p+p{margin-top:var(--s2)}
.rel-item{display:flex;flex-direction:column;gap:2px;padding:var(--s3) 0;border-bottom:1px solid var(--border)}
.rel-item:last-child{border-bottom:none;padding-bottom:0}
.rel-item a{font-size:.86rem;font-weight:500;color:var(--body);line-height:1.35}
.rel-item a:hover{color:var(--acc);text-decoration:none}
.rel-date{font-size:.71rem;color:var(--muted)}
.scta{background:var(--acc);border-radius:var(--r3);padding:var(--s5)}
.scta h4{font-size:1rem;font-weight:700;color:#fff;letter-spacing:0;text-transform:none;margin-bottom:var(--s3);line-height:1.3}
.scta p{font-size:.83rem;color:rgba(255,255,255,.88);margin-bottom:var(--s4)}
.btn-white{display:flex;align-items:center;justify-content:center;min-height:44px;width:100%;padding:10px;background:#fff;color:var(--acc);border-radius:var(--r2);font-size:.88rem;font-weight:700;transition:opacity .15s}
.btn-white:hover{opacity:.9;text-decoration:none;color:var(--acc)}

.cta-box{background:var(--surface);border:1px solid var(--border);border-top:3px solid var(--acc);border-radius:var(--r3);padding:var(--s6);margin:var(--s7) 0 var(--s5);box-shadow:var(--sh1)}
.cta-box>h3{font-family:var(--serif);font-size:1.22rem;color:var(--head);margin-bottom:var(--s3);line-height:1.3}
.cta-box>.sub{font-size:.9rem;color:var(--muted);margin-bottom:var(--s5);line-height:1.6}

.disc{background:var(--surface);border:1px solid var(--border);border-radius:var(--r2);padding:var(--s4) var(--s5);margin-top:var(--s5);font-size:.73rem;color:var(--muted);line-height:1.55}
.disc strong{color:var(--body)}
.info-box{background:var(--surface);border:1px solid var(--border);border-radius:var(--r3);padding:var(--s5) var(--s6);margin-top:var(--s7)}
.info-box h3{font-family:var(--serif);font-size:1rem;color:var(--head);margin-bottom:var(--s3)}
.info-box p{font-size:.87rem;color:var(--muted);line-height:1.6;margin-bottom:var(--s3)}
.info-box p:last-child{margin-bottom:0}

.team-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s5);margin:var(--s6) 0}
@media(max-width:520px){.team-grid{grid-template-columns:1fr}}
.team-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r3);padding:var(--s5);box-shadow:var(--sh1)}
.team-avatar{width:52px;height:52px;border-radius:50%;background:var(--acc-m);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1rem;color:var(--acc);margin-bottom:var(--s3)}
.team-card h3{font-size:.95rem;color:var(--head);margin-bottom:2px}
.team-role{font-size:.76rem;color:var(--acc);font-weight:600;margin-bottom:var(--s3)}
.team-card p{font-size:.84rem;color:var(--muted);line-height:1.6}

.ftr{border-top:1px solid var(--border);margin-top:var(--s8);padding:var(--s6) var(--s5)}
.ftr-in{max-width:940px;margin:0 auto;display:flex;flex-direction:column;gap:var(--s4)}
.ftr-links{display:flex;gap:var(--s4) var(--s5);flex-wrap:wrap}
.ftr-links a{font-size:.81rem;color:var(--muted)}.ftr-links a:hover{color:var(--body)}
.ftr-copy{font-size:.77rem;color:var(--muted)}

.ck{position:fixed;bottom:0;left:0;right:0;background:var(--surface);border-top:1px solid var(--border);box-shadow:var(--sh2);padding:var(--s4) var(--s5);z-index:999;display:none}
.ck.on{display:block}
.ck-in{max-width:940px;margin:0 auto;display:flex;align-items:center;gap:var(--s4);flex-wrap:wrap}
.ck-txt{flex:1;font-size:.81rem;color:var(--muted);line-height:1.5;min-width:220px}
.ck-txt a{color:var(--acc)}
.ck-btns{display:flex;gap:var(--s2);flex-shrink:0}
.ck-yes{padding:8px var(--s4);min-height:44px;background:var(--acc);color:#fff;border:none;border-radius:var(--r2);font-size:.81rem;font-weight:600;cursor:pointer;font-family:var(--sans)}
.ck-yes:hover{background:var(--acc-h)}
.ck-no{padding:8px var(--s4);min-height:44px;background:transparent;color:var(--muted);border:1px solid var(--border);border-radius:var(--r2);font-size:.81rem;cursor:pointer;font-family:var(--sans)}
.ck-no:hover{border-color:var(--body);color:var(--body)}

/* ---- QUIZ / FORM ---- */
.qstep{display:none}.qstep.on{display:block}
.qresult{display:none}.qresult.on{display:block}
.qprog-wrap{margin-bottom:var(--s4)}
.qprog-label{font-size:.73rem;color:var(--muted);margin-bottom:var(--s2);display:flex;justify-content:space-between}
.qprog-bar{height:4px;background:var(--border);border-radius:2px;overflow:hidden}
.qprog-fill{height:100%;background:var(--acc);border-radius:2px;transition:width .3s ease}
.qquestion{font-weight:600;font-size:.95rem;color:var(--head);margin-bottom:var(--s4)}
.qopts{display:flex;flex-direction:column;gap:var(--s2)}
.qopt{display:flex;align-items:center;gap:var(--s3);padding:13px var(--s4);border:1px solid var(--border);border-radius:var(--r2);cursor:pointer;background:var(--bg);font-size:.88rem;color:var(--body);transition:border-color .15s,background .15s;min-height:48px}
.qopt:hover{border-color:var(--acc);background:var(--acc-m)}
.qopt.sel{border-color:var(--acc);background:var(--acc-m);font-weight:500}
.qopt input[type=radio]{accent-color:var(--acc);width:17px;height:17px;flex-shrink:0;cursor:pointer}
.qopt-icon{width:22px;height:22px;border-radius:50%;background:var(--acc-m);border:1px solid var(--acc);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:.65rem;color:var(--acc);font-weight:700}
.btn-next{margin-top:var(--s4);width:100%;padding:13px;min-height:48px;background:var(--acc);color:#fff;border:none;border-radius:var(--r2);font-size:.92rem;font-weight:600;cursor:pointer;font-family:var(--sans);transition:background .15s}
.btn-next:hover{background:var(--acc-h)}
.qwarn{display:none;font-size:.79rem;color:#c0392b;margin-top:var(--s3)}
.qwarn.on{display:block}
.res-hl{background:var(--acc-m);border-radius:var(--r2);padding:var(--s4) var(--s5);margin-bottom:var(--s5);border-left:3px solid var(--acc)}
.res-hl p{font-size:.92rem;color:var(--body)}.res-hl p+p{margin-top:var(--s2)}
.res-hl strong{color:var(--acc)}
.lead-form{background:var(--surface2);border:1px solid var(--border);border-radius:var(--r3);padding:var(--s5) var(--s6)}
.lead-form h4{font-family:var(--serif);font-size:1rem;color:var(--head);margin-bottom:var(--s2)}
.lead-form>p{font-size:.83rem;color:var(--muted);margin-bottom:var(--s4);line-height:1.5}
.frow{display:flex;flex-direction:column;gap:var(--s3)}
.frow-inline{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}
@media(max-width:520px){.frow-inline{grid-template-columns:1fr}}
.fgroup{display:flex;flex-direction:column;gap:6px}
.fgroup label{font-size:.82rem;font-weight:600;color:var(--body)}
.finput{padding:12px var(--s4);border:1px solid var(--border);border-radius:var(--r2);font-size:.9rem;background:var(--bg);color:var(--body);outline:none;font-family:var(--sans);min-height:48px;transition:border-color .15s}
.finput:focus{border-color:var(--acc)}.finput.err{border-color:#c0392b;background:#fdf3f2}
.ferr{display:none;font-size:.73rem;color:#c0392b}.ferr.on{display:block}
.btn-submit{width:100%;padding:14px;min-height:48px;background:var(--acc);color:#fff;border:none;border-radius:var(--r2);font-size:.95rem;font-weight:600;cursor:pointer;font-family:var(--sans);margin-top:var(--s2);transition:background .15s}
.btn-submit:hover{background:var(--acc-h)}
.form-note{font-size:.71rem;color:var(--muted);margin-top:var(--s3);text-align:center;line-height:1.5}
.fdone{display:none;text-align:center;padding:var(--s5) 0}
.fdone.on{display:block}
.fdone-icon{width:52px;height:52px;border-radius:50%;background:var(--acc-m);color:var(--acc);display:flex;align-items:center;justify-content:center;font-size:1.5rem;font-weight:700;margin:0 auto var(--s4)}
.fdone h4{font-family:var(--serif);font-size:1.05rem;color:var(--head);margin-bottom:var(--s2)}
.fdone p{font-size:.87rem;color:var(--muted);line-height:1.6}

/* THANK-YOU */
.ty-wrap{max-width:640px;margin:0 auto;padding:var(--s8) var(--s5);text-align:center;display:flex;flex-direction:column;align-items:center;gap:var(--s5)}
.ty-icon{width:80px;height:80px;border-radius:50%;background:var(--acc-m);display:flex;align-items:center;justify-content:center;font-size:2rem;color:var(--acc);flex-shrink:0;box-shadow:0 0 0 8px var(--surface2)}
.ty-title{font-family:var(--serif);font-size:clamp(1.7rem,4vw,2.4rem);line-height:1.2;color:var(--head);letter-spacing:-.02em}
.ty-sub{font-size:1.05rem;color:var(--muted);line-height:1.7;max-width:480px}
.ty-divider{width:48px;height:3px;background:var(--acc);border-radius:2px;opacity:.5}
.ty-steps{background:var(--surface);border:1px solid var(--border);border-radius:var(--r3);padding:var(--s5) var(--s6);text-align:left;width:100%;box-shadow:var(--sh1)}
.ty-steps-title{font-size:.68rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:var(--s4)}
.ty-step{display:flex;align-items:flex-start;gap:var(--s3);padding:var(--s3) 0;border-bottom:1px solid var(--border)}
.ty-step:last-child{border-bottom:none;padding-bottom:0}
.ty-step-num{width:24px;height:24px;border-radius:50%;background:var(--acc-m);color:var(--acc);font-size:.74rem;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:2px}
.ty-step-text{font-size:.88rem;color:var(--body);line-height:1.55}.ty-step-text strong{color:var(--head);font-weight:600}
.ty-actions{display:flex;gap:var(--s3);flex-wrap:wrap;justify-content:center;width:100%}
.btn-primary{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px var(--s6);background:var(--acc);color:#fff;border:none;border-radius:var(--r2);font-size:.92rem;font-weight:600;cursor:pointer;font-family:var(--sans);text-decoration:none;transition:background .15s}
.btn-primary:hover{background:var(--acc-h);text-decoration:none;color:#fff}
.btn-secondary{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px var(--s6);background:transparent;color:var(--muted);border:1px solid var(--border);border-radius:var(--r2);font-size:.92rem;font-weight:500;text-decoration:none;transition:border-color .15s,color .15s}
.btn-secondary:hover{border-color:var(--body);color:var(--body);text-decoration:none}
.ty-recs{width:100%;text-align:left}
.ty-recs-title{font-size:.68rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:var(--s4);text-align:center}
.ty-recs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s3)}
@media(max-width:540px){.ty-recs-grid{grid-template-columns:1fr}}
.ty-rec-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r3);padding:var(--s4);box-shadow:var(--sh1);transition:border-color .15s,transform .12s;text-decoration:none;display:block}
.ty-rec-card:hover{border-color:var(--acc);transform:translateY(-2px);text-decoration:none}
.ty-rec-genre{font-size:.64rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--tag);background:var(--tag-bg);padding:2px 8px;border-radius:var(--r1);display:inline-block;margin-bottom:var(--s2)}
.ty-rec-card h3{font-family:var(--serif);font-size:.9rem;line-height:1.35;color:var(--head);margin-bottom:var(--s2);font-weight:700}
.ty-rec-card p{font-size:.77rem;color:var(--muted);line-height:1.5}
.ty-note{font-size:.77rem;color:var(--muted);line-height:1.6;max-width:420px}.ty-note a{color:var(--acc)}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important}}