/* ==========================================================
   Classic theme (2026-10-26): formal, understated, certificate-inspired.
   Loaded after styles.css on both the public site and the private course.
   White / off-white, near-black text, EB Garamond headings, DM Sans body,
   hairline rules, teal (#007F8E) only for buttons, links and small accents.
   ========================================================== */
@font-face{font-family:"EB Garamond";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/eb-garamond-500.woff2) format("woff2")}
@font-face{font-family:"EB Garamond";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/eb-garamond-600.woff2) format("woff2")}
@font-face{font-family:"EB Garamond";font-style:italic;font-weight:400 600;font-display:swap;src:url(fonts/eb-garamond-italic.woff2) format("woff2")}
:root{
  --primary:#007F8E; --primary-strong:#007F8E; --primary-deep:#00636F;
  --tint:#FBFAF7; --sky:#F5F4F0; --sky-2:#E7E4DD; --sky-3:#DCD8CF;
  --ink:#1D2227; --ink-2:#2A3036; --text:#2B3137; --muted:#585F66; --line:#E2DFD8; --rule:#CFCAC0;
  --accent:#007F8E; --accent-dark:#00636F; --accent-soft:#F5F4F0;
  --blue:#2A3036; --blue-soft:#F5F4F0; --amber:#007F8E; --amber-soft:#FBFAF7; --peach:#FBFAF7; --sand:#FBFAF7;
  --bg:#FBFAF7; --card:#FFFFFF;
  --ok:#1F6A4F; --ok-soft:#FFFFFF; --bad:#9B2C2C; --bad-soft:#FFFFFF;
  --radius:6px;
  --shadow-sm:none; --shadow:0 1px 0 rgba(29,34,39,.03); --shadow-lg:0 18px 40px -24px rgba(29,34,39,.25);
  --font-display:"EB Garamond","Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  --serif:var(--font-display);
  --orn:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='10' viewBox='0 0 120 10'%3E%3Cpath d='M0 5H52M68 5H120' stroke='%23B9B3A7' stroke-width='1'/%3E%3Cpath d='M60 1.5L63.5 5L60 8.5L56.5 5Z' fill='%23007F8E'/%3E%3C/svg%3E");
}
html,body{background:var(--bg)!important}
body{color:var(--text)}
body::before{display:none!important}
h1,h2,h3,h4{font-family:var(--serif);color:var(--ink);letter-spacing:0;font-weight:600}
h1{font-weight:500;line-height:1.08}
h2{font-weight:500;line-height:1.12;font-size:clamp(1.75rem,3vw,2.5rem)}
h3{font-weight:600;font-size:1.3rem;line-height:1.25}
a{color:var(--primary-strong)}
a:hover{color:var(--primary-deep)}
:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
code{background:#F3F1EC;color:var(--ink);border:1px solid var(--line)}

/* eyebrows: letter-spaced small caps, no pill */
.eyebrow,.home-hero .eyebrow,.enroll-card .eyebrow,.mod-head .eyebrow,.fin-hero .eyebrow{background:none!important;border:0!important;padding:0!important;border-radius:0!important;color:var(--muted)!important;font-family:var(--font);font-weight:600;font-size:max(12px,.72rem);letter-spacing:.22em;text-transform:uppercase}
.eyebrow::before,.home-hero .eyebrow::before,.enroll-card .eyebrow::before,.mod-head .eyebrow::before{display:none!important}

/* section heads: centred, formal, with the certificate's ornament */
.section>.section-head,.section-head.center{text-align:center;max-width:760px;margin-left:auto;margin-right:auto}
.section-head h2{margin-bottom:.35em}
.section-head h2::after{content:"";display:block;width:120px;height:10px;margin:14px auto 0;background:var(--orn) center/contain no-repeat}
.split .section-head h2::after{margin-left:0}
.section-head p{color:var(--muted)}

/* header, sidebar, bottom bar */
.topbar{background:rgba(251,250,247,.97)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border-bottom:1px solid var(--line)!important;box-shadow:none!important}
.brand .seal-mark{width:42px;height:42px;flex:none;display:block}
.brand img{display:none}
.brand .wm b,.brand .wm-short{font-family:var(--serif);font-weight:600;font-size:1.18rem;letter-spacing:.01em;color:var(--ink)}
.brand .wm i{letter-spacing:.24em;color:var(--muted)}
.wm-short span{color:var(--ink)!important}
.sidebar{background:var(--bg)!important;border-right:1px solid var(--line)!important}
.sidebar .ico{background:#fff!important;color:var(--ink)!important;border:1px solid var(--line);box-shadow:none!important;font-family:var(--serif)}
.side-progress,.side-fin{background:#fff!important;border:1px solid var(--line)!important;border-radius:6px!important;box-shadow:none!important}
.nav-label,.nav-sub{letter-spacing:.16em}
.bottom-nav{background:rgba(255,255,255,.98)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border:1px solid var(--line)!important;border-radius:10px!important;box-shadow:0 6px 24px -14px rgba(29,34,39,.35)!important}
.bottom-nav a{border-radius:6px!important}
.bottom-nav a.active{background:var(--ink)!important;color:#fff!important}

/* buttons: square-ish, teal primary, hairline secondary */
.btn{border-radius:4px!important;box-shadow:none!important;background:#fff;border:1px solid var(--rule);color:var(--ink);font-weight:600;letter-spacing:.01em}
.btn:hover{border-color:var(--ink);color:var(--ink)}
.btn-primary,.btn-accent,.home-hero .btn-primary,.enroll-card .btn-accent,.cert-actions .btn-primary{background:var(--primary-strong)!important;border-color:var(--primary-strong)!important;color:#fff!important}
.btn-primary:hover,.btn-accent:hover,.enroll-card .btn-accent:hover{background:var(--primary-deep)!important;border-color:var(--primary-deep)!important;color:#fff!important}
.btn-ghost{background:transparent}

/* framed panels (the certificate's double hairline) */
.home-hero,.welcome-hero,.mod-head,.page-head,.fin-hero,.enroll-card,.contact-card,.cta{background:#fff!important;color:var(--text)!important;border:1px solid var(--rule)!important;outline:1px solid var(--line);outline-offset:-9px;box-shadow:none!important;border-radius:2px!important}
.home-hero::before,.home-hero::after,.page-head::after,.page-head::before,.mod-head::before,.fin-hero::before,.fin-hero::after,.tile .blob{display:none!important}
.mod-head::after{color:rgba(29,34,39,.045)!important;font-family:var(--serif)!important;font-weight:500!important}
.home-hero h1,.mod-head h1,.page-head h1,.welcome-hero h1,.fin-hero h1{color:var(--ink)!important}
.home-hero h1 em{background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important;color:var(--primary-strong)!important;-webkit-text-fill-color:currentColor;font-style:italic;font-weight:500}
.home-hero .lead,.home-hero p,.mod-head p,.page-head p{color:var(--muted)}
.home-hero .price-line .price,.enroll-card .price,.price-box .price{font-family:var(--serif)!important;font-weight:500!important;color:var(--ink)!important;letter-spacing:0!important}
.money-back{font-family:var(--serif)!important;font-weight:600!important;color:var(--ink)!important;font-size:1.2rem!important}
.hero-points li{background:#fff!important;border:1px solid var(--line)!important;border-radius:3px!important;color:var(--text)!important}
.hero-points li::before{color:var(--primary-strong)!important}

/* cards and panels: white with hairlines */
.card,.panel,.panel.warm,.glance,.stat,.cg,.price-box,.faq details,.mod-card,.test-card,.key-card,.tile,.t-a,.t-b,.t-c,.t-d,.t-e,.t-f,.diagram,.obj,.summary-card,.lesson,.fin-stats>div,.result-hero,.test-bar,.fact,.flash,.q-flip,.fin-cta,.locked-key,.cm,.akey-sec{background:#fff!important;border:1px solid var(--line)!important;box-shadow:none!important;border-radius:4px!important}
.stats{gap:0!important}
.stat{border-radius:0!important}
.stat .n,.fin-stats .v,.result-hero .big,.cg-t,.glance-head b,.footer-brand strong{font-family:var(--serif)!important;font-weight:500!important;letter-spacing:0!important;color:var(--ink)!important}
.stat .n{font-size:2.4rem!important}
.glance-head span,.tag,.tag-on,.tag-soon,.cg-c{background:none!important;border:1px solid var(--line)!important;color:var(--muted)!important;border-radius:2px!important;letter-spacing:.06em}
.glance .gi,.mod-card .badge,.mod-card:nth-child(3n+2) .badge,.mod-card:nth-child(3n+3) .badge,.syl .num,.syl .num-test,.test-card .badge,.syl .num-key,.key-card .badge,ul.keys .kb,.cn,ol.steps li::before,.map a span,.panel .pc .ti{background:#fff!important;color:var(--ink)!important;border:1px solid var(--rule)!important;box-shadow:none!important;border-radius:3px!important;font-family:var(--serif)!important;font-weight:600!important}
.checks li::before,.ticks li::before{color:var(--primary-strong)!important;background:none!important}
.callout{background:#fff!important;border:1px solid var(--line)!important;border-left:3px solid var(--primary-strong)!important;border-radius:2px!important;box-shadow:none!important}
.mistakes{background:#fff!important;border:1px solid var(--line)!important;border-left:3px solid #8C3B32!important;border-radius:2px!important;box-shadow:none!important}
.ex-card .scn{background:#F7F6F2!important;border:1px solid var(--line)!important}
.bar{background:#ECE9E3!important}
.bar > span{background:var(--primary-strong)!important}
.opt{border-radius:4px!important;box-shadow:none!important}
.opt.selected{background:#F2F8F9!important;border-color:var(--primary-strong)!important}
.qmap button{border-radius:3px!important}
.qmap button.a{background:var(--ink)!important;color:#fff!important;border-color:var(--ink)!important}
.result-hero.pass{border-left:3px solid var(--ok)!important}
.result-hero.fail{border-left:3px solid var(--bad)!important}
.notes textarea{border-radius:3px!important;background:#fff!important}
.notes textarea:focus,.gate-card input:focus,.cm-input:focus{border-color:var(--primary-strong)!important;box-shadow:0 0 0 3px rgba(0,127,142,.12)!important}
.toc{background:#fff!important;border:1px solid var(--line)!important;box-shadow:none!important;border-radius:4px!important}
.toc a{border-radius:3px!important}
.syl-part span,.grid-part span{background:none!important;color:var(--muted)!important;border:0!important;letter-spacing:.2em}
.fin-seal{filter:grayscale(.15)}
.cm-plain,.cm-preview{background:#FBFAF7!important;border:1px solid var(--line)!important;border-radius:3px!important}
table th{background:#F6F5F1!important;color:var(--ink)!important}
.faq details summary{font-family:var(--serif);font-weight:600;font-size:1.15rem;color:var(--ink)}

/* footer */
.footer{background:#fff!important;color:var(--muted)!important;border-top:1px solid var(--line)}
.footer *{color:inherit}
.footer-brand strong{color:var(--ink)!important}
.footer-h{letter-spacing:.22em;color:var(--ink)!important}

/* certificate overlay: quiet neutral backdrop */
.cert-ov{background:#E9E7E2!important}
.cert-top{background:#FBFAF7!important;border-bottom:1px solid var(--rule)!important;color:var(--ink)!important}
.cert-congrats b{color:var(--ink)!important}.cc-more{color:var(--muted)!important}
.cc-mark{background:#fff!important;color:var(--primary-strong)!important;border:1px solid var(--primary-strong)!important}
.cert-close{background:#fff!important;color:var(--ink)!important;border:1px solid var(--rule)!important}
.cert-fit{box-shadow:0 2px 4px rgba(29,34,39,.08),0 18px 44px -18px rgba(29,34,39,.35)!important}

/* public: Certificate of Completion section */
.cert-promo .cert-figure{margin:0 auto;max-width:1040px;display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:40px;align-items:center}
.cert-zoom{position:relative;display:block;background:#fff;border:1px solid var(--rule);padding:10px;box-shadow:0 2px 4px rgba(29,34,39,.05),0 22px 50px -28px rgba(29,34,39,.35);text-decoration:none;cursor:zoom-in}
.cert-zoom img{display:block;width:100%;height:auto}
.cert-zoom-hint{position:absolute;right:18px;bottom:18px;background:rgba(255,255,255,.95);border:1px solid var(--line);color:var(--ink);font-size:.78rem;font-weight:600;letter-spacing:.04em;padding:6px 10px;border-radius:3px}
.cert-zoom:hover .cert-zoom-hint,.cert-zoom:focus-visible .cert-zoom-hint{border-color:var(--primary-strong);color:var(--primary-strong)}
.cert-figure figcaption{margin:0}
ul.cert-points{list-style:none;margin:0 0 18px;padding:0}
ul.cert-points li{position:relative;padding:12px 0 12px 30px;border-bottom:1px solid var(--line);color:var(--text)}
ul.cert-points li:first-child{border-top:1px solid var(--line)}
ul.cert-points li::before{content:"";position:absolute;left:4px;top:19px;width:9px;height:9px;transform:rotate(45deg);border:1.5px solid var(--primary-strong)}
.cert-note{font-size:.85rem;color:var(--muted);margin:0}
.cert-zoom-dlg{border:0;padding:0;background:transparent;max-width:min(96vw,1400px);width:96vw;max-height:96dvh;overflow:visible}
.cert-zoom-dlg::backdrop{background:rgba(29,34,39,.78)}
.cert-zoom-dlg img{display:block;width:auto;max-width:100%;height:auto;max-height:calc(96dvh - 64px);margin:0 auto;object-fit:contain;background:#fff}
.cert-zoom-close{display:block;margin:0 0 10px auto;min-height:44px}
@media (max-width:860px){.cert-promo .cert-figure{grid-template-columns:1fr;gap:22px;max-width:640px}}
@media (max-width:600px){.cert-zoom{padding:6px}.cert-zoom-hint{right:10px;bottom:10px;font-size:.72rem}}
@media (max-width:600px){.brand .wm-short{font-size:1.05rem;white-space:nowrap}.brand .seal-mark{width:36px;height:36px}.brand{gap:8px}}
@media (max-width:360px){.brand .wm-short span{display:none}}
.chip,.glass{background:#fff!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border:1px solid var(--line)!important;box-shadow:0 10px 24px -18px rgba(29,34,39,.35)!important;border-radius:4px!important}

/* ---- legal footer + legal pages (2026-10-26) ---- */
.footer-links{display:flex;flex-wrap:wrap;gap:6px 22px;margin:0 0 18px;padding:0 0 14px;border-bottom:1px solid var(--line)}
.footer .footer-links a{color:var(--primary-strong)!important;font-weight:500;text-decoration:underline;text-underline-offset:3px}
.footer-who{margin:14px 0 0;font-size:.84rem;overflow-wrap:anywhere}
.footer .footer-who a{color:var(--primary-strong)!important}
.legal{max-width:780px;margin:36px auto 0;padding:44px 48px;background:#fff;border:1px solid var(--rule);outline:1px solid var(--line);outline-offset:-9px;border-radius:2px}
.legal h1{font-size:clamp(2rem,4.5vw,2.8rem);margin:6px 0 4px}
.legal h2{font-size:1.35rem;margin:30px 0 8px}
.legal p,.legal li{line-height:1.7;color:var(--text)}
.legal ul{padding-left:1.25em}.legal li{margin:6px 0}
.legal a{color:var(--primary-strong)}
.legal-updated{color:var(--muted)!important;font-size:.9rem;margin:0 0 18px}
.legal-lead{font-size:1.1rem}
.legal-back{margin-top:32px}
@media (max-width:640px){.legal{margin:18px 12px 0;padding:28px 20px}}
.money-back{font-size:1.05rem!important;line-height:1.35!important;align-items:flex-start!important}
.money-back::before{margin-top:1px}