/* ==========================================================================
   AI Guru Institute — design system
   CSP-safe: system fonts, no external assets. Inline styles/SVG allowed.
   ========================================================================== */
:root {
  --brand: #14543b;          /* pine green (primary) — examination authority */
  --brand-700: #0f3f2c;
  --brand-800: #0b2e20;
  --brand-600: #1f6e4d;      /* readable green for links / hover */
  --brand-50: #e9f1ec;       /* pale green surface */
  --accent: #b08a3e;         /* gold — credential seals only */
  --accent-50: #f3ead6;
  --fg: #13241d;             /* legacy alias */
  --ink: #13241d;            /* near-black green ink */
  --ink-2: #2a3a33;          /* slate-green text */
  --muted: #5e6b62;          /* AA on parchment + white */
  --bg: #ffffff;
  --bg-soft: #faf8f3;        /* warm parchment */
  --line: #e4e6df;
  --ok: #15803d;
  --ok-bg: #e7f6ec;
  --warn: #b06a12;
  --warn-bg: #fbf0df;
  --err: #b3402f;
  --err-bg: #f8ece9;
  --radius: 10px;
  --radius-sm: 7px;
  --shadow-sm: 0 1px 2px rgba(19,36,29,.06);
  --shadow: 0 1px 3px rgba(19,36,29,.07), 0 8px 24px rgba(19,36,29,.07);
  --shadow-lg: 0 18px 48px rgba(19,36,29,.15);
  --grad: linear-gradient(160deg, #1c6447 0%, #103f2c 100%);
  --grad-ink: linear-gradient(165deg, #15402e 0%, #0b241a 100%);
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --display: Georgia, "Times New Roman", "Noto Serif", serif;
  --maxw: 74rem;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { font-family: var(--font); color: var(--ink); margin: 0; background: var(--bg);
  line-height: 1.6; font-size: 16px; -webkit-font-smoothing: antialiased; }
h1, h2, h3 { color: var(--ink); line-height: 1.18; }
h1 { font-family: var(--display); font-weight: 700; font-size: clamp(2rem, 4.2vw, 3.05rem); letter-spacing: -.01em; margin: 0 0 1rem; }
h2 { font-family: var(--display); font-weight: 700; font-size: clamp(1.4rem, 2.6vw, 2rem); letter-spacing: -.005em; margin: 0 0 .75rem; }
h3 { font-weight: 700; font-size: 1.12rem; letter-spacing: -.01em; margin: 0 0 .4rem; }
p { margin: 0 0 1rem; }
a { color: var(--brand-600); text-decoration: none; }
a:hover { text-decoration: underline; }
img { max-width: 100%; }

/* app-page container */
.container { max-width: 34rem; margin: 3.5rem auto; padding: 2.25rem 2rem; background: #fff;
  border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.container h1 { font-size: 1.6rem; color: var(--ink); }
main.detail, main.exam-shell { max-width: var(--maxw); margin: 0 auto; padding: 2rem 1.25rem 4rem; }

/* buttons */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  background: var(--brand); color: #fff; text-decoration: none; padding: .72rem 1.4rem;
  border: 0; border-radius: var(--radius-sm); font-weight: 600; cursor: pointer; font: inherit;
  box-shadow: var(--shadow-sm);
  transition: background .12s ease; }
.btn:hover { background: var(--brand-700); text-decoration: none; }
.btn:active { transform: translateY(0); }
.btn-ghost { background: #fff; color: var(--brand-700); border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.btn-ghost:hover { background: var(--bg-soft); border-color: #cbd2e0; }
.btn-lg { padding: .95rem 1.8rem; font-size: 1.05rem; border-radius: 12px; }
.btn-small { padding: .42rem 1rem; font-size: .85rem; border-radius: 8px; }
.btn[disabled] { opacity: .5; cursor: not-allowed; box-shadow: none; }
button[type="submit"]:not(.btn):not(.link-btn) { background: var(--brand); color: #fff; border: 0;
  border-radius: 10px; padding: .72rem 1.4rem; font-weight: 650; margin-top: 1rem; cursor: pointer; font: inherit; }
.link-btn { background: none; border: 0; color: var(--brand-700); text-decoration: underline; padding: 0; font-size: .92rem; cursor: pointer; }

/* forms */
label { display: block; margin: .9rem 0; font-weight: 600; color: var(--ink-2); }
input, select, textarea { display: block; width: 100%; max-width: 32rem; margin-top: .35rem;
  padding: .65rem .75rem; border: 1px solid #cbd2e0; border-radius: var(--radius-sm); font: inherit; background: #fff; color: var(--ink); }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--brand); outline-offset: 1px; border-color: var(--brand); }
textarea { min-height: 84px; }
.hint { font-weight: 400; color: var(--muted); font-size: .85rem; }
.err { color: var(--err); font-size: .85rem; font-weight: 500; }
.error { color: var(--err); font-weight: 600; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.ref-row { display: flex; gap: .5rem; margin: .4rem 0; flex-wrap: wrap; }
.ref-row input { margin-top: 0; }
.inline, form.inline { display: inline; }
.inline-form { display: flex; gap: .5rem; margin: 1rem 0; align-items: flex-start; }

/* helpers */
.muted { color: var(--muted); }
.warn { color: var(--warn); }
.ok { color: var(--ok); font-weight: 600; }
.crumbs { font-size: .85rem; color: var(--muted); margin: 0 0 1.25rem; }
.crumbs a { color: var(--muted); }
.eyebrow { letter-spacing: .14em; text-transform: uppercase; color: var(--brand-600); font-weight: 700; font-size: .76rem; margin: 0 0 .65rem; }
.panel { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 1.5rem 1.75rem; margin: 1.25rem 0; box-shadow: var(--shadow-sm); }
.panel h2 { color: var(--ink); margin-top: 0; font-size: 1.2rem; }
.panel ul { margin: 0; padding-left: 1.2rem; }
.panel blockquote { border-left: 3px solid var(--brand); margin: .75rem 0; padding: .4rem 0 .4rem 1rem; color: var(--ink-2); }
.center { text-align: center; }

/* status pills */
.status { display: inline-block; font-size: .72rem; font-weight: 650; text-transform: capitalize;
  letter-spacing: .02em; padding: .2rem .6rem; border-radius: 99px; background: #eef1f6; color: var(--ink-2); }
.status-active, .status-passed, .status-paid, .status-issued, .status-pass { background: var(--ok-bg); color: var(--ok); }
.status-registered, .status-scheduled, .status-in_progress, .status-processing, .status-assigned { background: var(--brand-50); color: var(--brand-700); }
.status-failed, .status-overdue, .status-canceled, .status-suspended, .status-fail { background: var(--err-bg); color: var(--err); }
.status-past_due, .status-pending_onboarding, .status-pending_contract, .status-pending_payment, .status-underperforming { background: var(--warn-bg); color: var(--warn); }

/* ============================ marketing chrome ============================ */
.site-header { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.85);
  backdrop-filter: saturate(180%) blur(12px); border-bottom: 1px solid var(--line); }
.site-header .wrap { max-width: var(--maxw); margin: 0 auto; padding: .7rem 1.25rem; display: flex; align-items: center; gap: 1.5rem; }
.brand { display: inline-flex; align-items: center; gap: .6rem; font-family: var(--display); font-weight: 700; font-size: 1.18rem; color: var(--ink); letter-spacing: -.01em; text-decoration: none; }
.brand:hover { text-decoration: none; }
.brand .mark { width: 34px; height: 34px; border-radius: 50%; background: var(--brand); display: inline-grid; place-items: center; color: #fff; flex: none; box-shadow: inset 0 0 0 1.5px var(--accent); }
.brand-tag { font-size: .6rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--brand-700); background: var(--brand-50); padding: .14rem .42rem; border-radius: 5px; vertical-align: middle; }
.site-footer .brand-tag { color: #c7d2fe; background: rgba(255,255,255,.12); }
.site-nav { display: flex; align-items: center; gap: 1.3rem; margin-left: auto; }
.site-nav a:not(.btn) { color: var(--ink-2); font-weight: 550; font-size: .94rem; }
.site-nav a:not(.btn):hover { color: var(--brand-700); text-decoration: none; }
.nav-links { display: flex; gap: 1.3rem; align-items: center; }
@media (max-width: 860px) { .nav-links { display: none; } }
.endorse { font-size: .72rem; color: var(--muted); border-left: 1px solid var(--line); padding-left: .7rem; margin-left: .25rem; align-self: center; letter-spacing: .02em; }
@media (max-width: 680px) { .endorse { display: none; } }

/* founder / heritage (endorsed-brand attach to AI Guru) */
.founder { display: grid; grid-template-columns: auto 1fr; gap: 1.6rem; align-items: start; max-width: 54rem; margin: 0 auto; }
.founder-photo { margin: 0; text-align: center; }
.founder-photo img { width: 110px; height: 110px; border-radius: 50%; object-fit: cover; display: block; box-shadow: 0 0 0 3px var(--bg-soft), 0 0 0 4px rgba(176,138,62,.65); }
.founder-photo figcaption { margin-top: .6rem; font-weight: 700; font-size: .9rem; color: var(--ink); }
.founder-photo figcaption span { display: block; font-weight: 400; font-size: .8rem; color: var(--muted); }
.founder-body h2 { margin-top: .2rem; }
.founder-cred { margin: 1.1rem 0 0; padding-top: .9rem; border-top: 1px solid var(--line); font-size: .78rem; color: var(--muted); letter-spacing: .05em; text-transform: uppercase; }
.founder-stats { display: flex; gap: 2.2rem; flex-wrap: wrap; margin-top: 1.1rem; }
.founder-stats .n { display: block; font-family: var(--display); font-weight: 700; font-size: 1.5rem; color: var(--brand); }
.founder-stats .l { color: var(--muted); font-size: .85rem; }
@media (max-width: 640px) { .founder { grid-template-columns: 1fr; } }

.site-footer { background: var(--grad-ink); color: #cbd5e1; }
.site-footer .wrap { max-width: var(--maxw); margin: 0 auto; padding: 3rem 1.25rem 2rem; display: grid; grid-template-columns: 1.5fr repeat(3, 1fr); gap: 2rem; }
.site-footer h4 { color: #fff; font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; margin: 0 0 .9rem; }
.site-footer a { color: #cbd5e1; display: block; padding: .25rem 0; font-size: .92rem; }
.site-footer a:hover { color: #fff; text-decoration: none; }
.site-footer .brand { color: #fff; }
.site-footer .blurb { color: #94a3b8; font-size: .9rem; max-width: 22rem; margin-top: .9rem; }
.tm-note { display: block; font-size: .8rem; opacity: .8; margin-top: .25rem; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.1); }
.footer-bottom .wrap { max-width: var(--maxw); margin: 0 auto; padding: 1.25rem; display: flex; justify-content: space-between; color: #94a3b8; font-size: .85rem; flex-wrap: wrap; gap: .5rem; }
@media (max-width: 720px) { .site-footer .wrap { grid-template-columns: 1fr 1fr; } }

/* ============================ landing sections ============================ */
main.landing, .landing { max-width: none; margin: 0; padding: 0; }
.section { max-width: var(--maxw); margin: 0 auto; padding: 4.5rem 1.25rem; }
.section-dark { background: var(--grad-ink); color: #e2e8f0; }
.section-dark h2, .section-dark h3 { color: #fff; }
.section-dark p, .section-dark .muted { color: #cbd5e1; }
.section-soft { background: var(--bg-soft); border-block: 1px solid var(--line); }
.section-head { max-width: 42rem; margin: 0 auto 2.5rem; text-align: center; }
.section-head p { color: var(--muted); font-size: 1.08rem; }

.hero { position: relative; overflow: hidden; background: var(--bg-soft); border-bottom: 1px solid var(--line); }
.hero::before { content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(46rem 32rem at 84% -20%, rgba(33,74,115,.10), transparent 62%),
              linear-gradient(180deg, rgba(27,58,91,.04), transparent 40%); }
.hero .wrap { position: relative; max-width: var(--maxw); margin: 0 auto; padding: 4.5rem 1.25rem 4rem;
  display: grid; grid-template-columns: 1.15fr .85fr; gap: 3rem; align-items: center; }
.hero h1 { margin: .6rem 0 1.1rem; }
.hero .lede { font-size: 1.2rem; color: var(--ink-2); max-width: 34rem; margin: 0 0 1.75rem; }
.hero .cta-row { display: flex; gap: .8rem; flex-wrap: wrap; margin: 0 0 1.1rem; }
.hero .trust { color: var(--muted); font-size: .9rem; display: flex; gap: 1.1rem; flex-wrap: wrap; }
.hero .trust b { color: var(--ink-2); }
@media (max-width: 880px) { .hero .wrap { grid-template-columns: 1fr; } .hero-visual { order: -1; } }

.cred-card { background: #fff; border: 1px solid var(--line); border-top: 4px solid var(--brand); border-radius: var(--radius); box-shadow: var(--shadow); padding: 1.6rem; }
.cred-card .row { display: flex; align-items: center; justify-content: space-between; }
.cred-card .ribbon { display: inline-flex; align-items: center; gap: .4rem; background: var(--accent-50); color: #735400; font-weight: 700; font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; padding: .3rem .7rem; border-radius: 4px; }
.cred-card .seal { width: 52px; height: 52px; border-radius: 50%; background: var(--accent); display: grid; place-items: center; color: #fff; font-weight: 700; font-size: .78rem; box-shadow: inset 0 0 0 3px rgba(255,255,255,.35); }
.cred-card h3 { font-family: var(--display); font-size: 1.35rem; margin: 1.1rem 0 .25rem; }
.cred-card .meta { color: var(--muted); font-size: .85rem; }
.cred-card .verify { margin-top: 1.1rem; border-top: 1px dashed var(--line); padding-top: .85rem; font-size: .78rem; color: var(--muted); display: flex; justify-content: space-between; }

.stat-bar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; text-align: center; }
.stat-bar .n { font-size: 2rem; font-weight: 800; color: var(--brand-700); letter-spacing: -.02em; display: block; }
.stat-bar .l { color: var(--muted); font-size: .9rem; }
@media (max-width: 720px) { .stat-bar { grid-template-columns: 1fr 1fr; gap: 1.5rem; } }

.cert-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: 1.25rem; }
.cert-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 1.6rem; box-shadow: var(--shadow-sm); transition: transform .15s ease, box-shadow .15s ease; display: flex; flex-direction: column; }
.cert-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.cert-card .level { display: inline-block; align-self: flex-start; font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: var(--brand-700); background: var(--brand-50); padding: .22rem .6rem; border-radius: 99px; margin: 0 0 .8rem; }
.cert-card h2, .cert-card h3 { font-size: 1.2rem; margin: 0 0 .4rem; }
.cert-card p { color: var(--ink-2); }
.cert-card .price { font-size: 1.5rem; font-weight: 800; margin: .6rem 0 1rem; color: var(--ink); }
.cert-card .price span { font-size: .85rem; font-weight: 500; color: var(--muted); }
.cert-card .langs { font-size: .85rem; color: var(--muted); }
.cert-card .spacer { flex: 1; }

.steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.25rem; }
.step { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 1.4rem; }
.step .num { width: 38px; height: 38px; border-radius: 10px; background: var(--brand-50); color: var(--brand-700); display: grid; place-items: center; font-weight: 800; margin-bottom: .8rem; }
@media (max-width: 820px) { .steps { grid-template-columns: 1fr 1fr; } }

.audience { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.aud-card { border: 1px solid var(--line); border-radius: var(--radius); padding: 1.75rem; background: #fff; box-shadow: var(--shadow-sm); }
.aud-card { border-top: 3px solid var(--brand); }
.aud-card .ico { width: 46px; height: 46px; border-radius: 9px; background: var(--brand-50); display: grid; place-items: center; color: var(--brand); margin-bottom: 1rem; }
.aud-card .ico svg { width: 24px; height: 24px; }
.aud-card h3 { font-size: 1.25rem; }
.aud-card ul { padding-left: 1.1rem; color: var(--ink-2); margin: .5rem 0 1.1rem; }
.aud-card li { margin: .3rem 0; }
@media (max-width: 820px) { .audience { grid-template-columns: 1fr; } }

.feature-list, .benefit-list { list-style: none; padding: 0; margin: 1rem 0; }
.feature-list li, .benefit-list li { position: relative; padding: .45rem 0 .45rem 1.8rem; }
.feature-list li::before, .benefit-list li::before { content: "✓"; position: absolute; left: 0; top: .45rem; color: var(--ok); font-weight: 800; }
.section-dark .feature-list li::before { color: #cdb06a; }
.compliance-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.compliance-grid .c { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1); border-radius: var(--radius); padding: 1.5rem; }
@media (max-width: 820px) { .compliance-grid { grid-template-columns: 1fr; } }

.quote-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.quote { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 1.6rem; box-shadow: var(--shadow-sm); }
.quote p { font-size: 1.02rem; color: var(--ink); }
.quote .who { display: flex; align-items: center; gap: .7rem; margin-top: 1rem; }
.quote { border-left: 3px solid var(--brand); }
.quote .av { width: 40px; height: 40px; border-radius: 50%; background: var(--brand); color: #fff; display: grid; place-items: center; font-weight: 700; font-size: .85rem; }
.quote .who b { display: block; font-size: .92rem; }
.quote .who span { color: var(--muted); font-size: .82rem; }
@media (max-width: 820px) { .quote-grid { grid-template-columns: 1fr; } }

.faq { max-width: 46rem; margin: 0 auto; }
.faq details { border-bottom: 1px solid var(--line); padding: 1.1rem .25rem; }
.faq summary { font-weight: 650; cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; color: var(--brand-700); font-size: 1.3rem; font-weight: 400; }
.faq details[open] summary::after { content: "\2013"; }
.faq p { margin: .8rem 0 0; color: var(--ink-2); }

.cta-band { background: var(--grad); color: #fff; border-radius: 22px; padding: 3rem; text-align: center; box-shadow: var(--shadow-lg); }
.cta-band h2 { color: #fff; }
.cta-band p { color: rgba(255,255,255,.92); max-width: 34rem; margin: 0 auto 1.5rem; }
.cta-band .btn { background: #fff; color: var(--brand-700); }
.cta-band .btn:hover { background: #f1f5f9; }
.cta-row { display: flex; gap: .8rem; flex-wrap: wrap; justify-content: center; }

/* ============================ app components ============================ */
.empty-state { text-align: center; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 3rem 1.5rem; box-shadow: var(--shadow-sm); margin: 2rem 0; }
.detail-hero h1 { font-size: clamp(1.7rem, 3.5vw, 2.6rem); margin: .25rem 0 .75rem; }
.detail-hero .audience { color: var(--ink-2); }
.enroll-bar { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; margin: 1.5rem 0; padding: 1.1rem 1.3rem; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-sm); }
.enroll-bar .price { font-size: 1.6rem; font-weight: 800; }
.enroll-bar.bottom { justify-content: center; margin-top: 2.5rem; }
.enroll-form { display: inline; margin: 0; }
.enrolled-hint { margin-top: .75rem; font-size: .9rem; }
.facts { list-style: none; padding: 0; }
.facts li { display: flex; justify-content: space-between; border-bottom: 1px solid var(--line); padding: .5rem 0; }
.facts li span { color: var(--muted); }

.cart-list { list-style: none; padding: 0; }
.cart-row { display: flex; align-items: center; gap: 1rem; padding: .75rem 0; border-bottom: 1px solid var(--line); }
.cart-row .name { flex: 1; font-weight: 600; }
.cart-row .price { font-weight: 700; }
.cart-total { font-size: 1.2rem; margin: 1rem 0; }

.dash-head h1 { margin-bottom: .25rem; }
.dash-logout { margin-top: 1.5rem; }
.dash-nav { display: flex; flex-wrap: wrap; gap: .75rem; margin: 1rem 0 1.5rem; }
.dash-nav .card { display: block; padding: .9rem 1.2rem; border: 1px solid var(--line); border-radius: var(--radius-sm); font-weight: 650; background: #fff; box-shadow: var(--shadow-sm); }
.dash-nav .card:hover { background: var(--bg-soft); text-decoration: none; transform: translateY(-1px); }
.enroll-list, .cred-list, .rec-list, .prep-list, .checklist, .meta-list, .results, .opts { list-style: none; padding: 0; margin: 0; }
.enroll-row { display: flex; align-items: center; gap: 1rem; padding: .7rem 0; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.enroll-row .name, .cred-list .name { flex: 1; font-weight: 600; }
.rec-list li, .prep-list li { padding: .55rem 0; border-bottom: 1px solid var(--line); }
.prep-list a { font-weight: 600; }

.stat-row { display: flex; flex-wrap: wrap; gap: 1.25rem; margin: 1rem 0 1.5rem; }
.stat { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 1.1rem 1.4rem; min-width: 150px; box-shadow: var(--shadow-sm); }
.stat-num { display: block; font-size: 1.7rem; font-weight: 800; color: var(--ink); letter-spacing: -.02em; }
.stat-label { color: var(--muted); font-size: .85rem; }

.codes { border-collapse: collapse; width: 100%; }
.codes th, .codes td { text-align: left; padding: .65rem .6rem; border-bottom: 1px solid var(--line); font-size: .94rem; }
.codes th { color: var(--muted); font-weight: 650; font-size: .78rem; text-transform: uppercase; letter-spacing: .05em; }
.codes code { background: var(--bg-soft); padding: .12rem .4rem; border-radius: 5px; font-size: .85rem; }

.tier-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: 1.25rem; margin: 1.5rem 0; }
.tier-card { border: 1px solid var(--line); border-radius: var(--radius); padding: 1.5rem 1.6rem; background: #fff; box-shadow: var(--shadow-sm); }
.tier-card .price { font-size: 2rem; font-weight: 800; }
.tier-card .price span { font-size: .85rem; color: var(--muted); font-weight: 500; }
.quote-result .price { font-size: 2.2rem; font-weight: 800; }
.quote-result .price span { font-size: 1rem; color: var(--muted); font-weight: 500; }
.cta { background: var(--grad-ink); color: #fff; border-radius: var(--radius); }
.cta a { color: #93c5fd; }

.wm-banner { background: var(--warn-bg); border: 1px solid #fcd9a3; color: #7a5b00; padding: .55rem .9rem; border-radius: var(--radius-sm); font-size: .85rem; margin: 0 0 1rem; }
.task { display: flex; align-items: center; gap: .7rem; padding: .55rem 0; border-bottom: 1px solid var(--line); }
.task-complete .label { color: var(--ok); }
.task .mark { font-weight: 800; }

.guide { max-width: 48rem; }
.toc { background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--radius); padding: 1rem 1.25rem; margin: 1rem 0 1.5rem; }
.toc ul { list-style: none; padding: 0; margin: .5rem 0 0; }
.toc-l3 { padding-left: 1rem; }
.guide-body { line-height: 1.75; }
.guide-body h2 { margin-top: 2rem; }
.guide-body pre { background: #0f172a; color: #e2e8f0; padding: 1rem; border-radius: 8px; overflow: auto; }
.guide-body code { background: var(--bg-soft); padding: .12rem .35rem; border-radius: 4px; }
.prep-video { width: 100%; max-width: 860px; border-radius: var(--radius); background: #000; }
.complete-form { margin-top: 2rem; }

.q, .practice-form .q { border: 1px solid var(--line); border-radius: var(--radius); padding: 1.1rem 1.3rem; margin: 0 0 1rem; }
.practice-form legend { font-weight: 600; padding: 0 .4rem; }
.opt { display: block; padding: .4rem 0; cursor: pointer; }
.opt input { display: inline; width: auto; margin: 0 .55rem 0 0; }
.result { border-left: 4px solid var(--line); padding: .5rem 0 .5rem 1rem; margin: 0 0 1.25rem; }
.result.correct { border-color: var(--ok); }
.result.incorrect { border-color: var(--err); }
.result .stem { font-weight: 600; }
.opts li { padding: .2rem 0; }
.opts .is-correct { color: var(--ok); font-weight: 600; }
.opts .is-wrong { color: var(--err); text-decoration: line-through; }
.tag { font-size: .68rem; text-transform: uppercase; background: var(--bg-soft); border-radius: 99px; padding: .12rem .5rem; margin-left: .45rem; color: var(--muted); }
.rationale { background: var(--bg-soft); border-radius: var(--radius-sm); padding: .65rem .9rem; font-size: .95rem; }

.schedule-form label, .meta-list li { margin: 1rem 0; }
.schedule-form input, .schedule-form select { min-width: 280px; }
.booked-when { font-size: 1.1rem; }
.cancel-form { margin-top: 1rem; }

.exam-bar { display: flex; justify-content: space-between; align-items: center; padding: .85rem 1.1rem; background: var(--grad-ink); color: #fff; border-radius: var(--radius); margin-bottom: 1.5rem; }
.exam-timer { font-variant-numeric: tabular-nums; font-size: 1.3rem; font-weight: 800; }
.exam-item { border: 1px solid var(--line); border-radius: var(--radius); padding: 1.4rem; margin: 0 0 1rem; }
.exam-item legend { font-weight: 600; color: var(--muted); }
.exam-stem { font-size: 1.12rem; font-weight: 600; margin: .5rem 0 1.1rem; }
.exam-opt { display: block; padding: .6rem .8rem; border: 1px solid var(--line); border-radius: var(--radius-sm); margin: .45rem 0; cursor: pointer; transition: border-color .12s; }
.exam-opt:hover { border-color: var(--brand); }
.exam-opt input { display: inline; width: auto; margin-right: .6rem; }
.exam-flag { display: inline-block; margin-top: .75rem; font-size: .9rem; color: var(--warn); }
.exam-nav { display: flex; align-items: center; gap: 1rem; margin-top: 1rem; flex-wrap: wrap; }
.exam-progress { font-variant-numeric: tabular-nums; color: var(--muted); }
#exam-submit { margin-left: auto; }

.result-card { text-align: center; }
.result-verdict { font-size: 1.6rem; font-weight: 800; }
.result-pass .result-verdict { color: var(--ok); }
.result-fail .result-verdict { color: var(--err); }
.result-score { font-size: 1.1rem; }
.verify-card { text-align: center; }
.verify-badge { display: inline-block; font-weight: 800; color: var(--ok); background: var(--ok-bg); padding: .4rem 1rem; border-radius: 99px; }
.verify-badge.invalid { color: var(--err); background: var(--err-bg); }
.verify-meta { display: inline-grid; grid-template-columns: auto auto; gap: .3rem 1rem; text-align: left; margin: 1rem auto; }
.verify-meta dt { color: var(--muted); }
.badge { max-width: 150px; }

.sub-price { font-size: 1.5rem; }
.atp-form fieldset { border: 1px solid var(--line); border-radius: var(--radius); padding: 1.2rem 1.4rem; margin: 0 0 1.25rem; }
.atp-form legend { font-weight: 700; padding: 0 .4rem; }
.invoice .price { font-size: 1.8rem; font-weight: 800; }

/* ============================ app shell (logged-in) ============================ */
/* gold institutional hairline across the top of all chrome */
.site-header { border-top: 3px solid var(--accent); }
.page { max-width: 64rem; margin: 0 auto; padding: 2rem 1.25rem 3rem; }
.page > h1:first-child { margin-top: .5rem; }
.app-bar .nav-links a { font-size: .9rem; }
.app-bar .signout { display: inline; margin: 0; }
.app-foot { border-top: 1px solid var(--line); background: var(--bg-soft); }
.app-foot .wrap { max-width: var(--maxw); margin: 0 auto; padding: 1.1rem 1.25rem; color: var(--muted); font-size: .85rem; text-align: center; }
.app-foot .foot-legal { display: block; margin-top: .35rem; }

/* ============================ legal pages ============================ */
.legal { max-width: 48rem; margin: 0 auto; padding: 2.5rem 1.25rem 4rem; }
.legal h1 { margin-bottom: .25rem; }
.legal .updated { color: var(--muted); font-size: .9rem; margin-bottom: 2rem; }
.legal h2 { font-size: 1.22rem; margin: 2rem 0 .5rem; }
.legal p, .legal li { color: var(--ink-2); }
.legal ul { padding-left: 1.2rem; }
.legal li { margin: .35rem 0; }

/* ============================ printable certificate ============================ */
.cert-page { max-width: 60rem; margin: 0 auto; padding: 1.5rem 1.25rem 3rem; }
.cert-toolbar { display: flex; gap: .6rem; justify-content: flex-end; margin-bottom: 1rem; }
.certificate { position: relative; background: var(--bg-soft); border: 1px solid var(--accent);
  box-shadow: var(--shadow-lg); padding: 3rem 2.5rem 2.5rem; text-align: center; }
.certificate::before { content: ""; position: absolute; inset: 12px; border: 1px solid rgba(176,138,62,.45); pointer-events: none; }
.cert-seal { margin: 0 auto .4rem; line-height: 0; }
.cert-org { font-family: var(--display); font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--brand); font-size: .95rem; margin: 0 0 1rem; }
.cert-kicker { color: var(--muted); margin: .55rem 0 .15rem; }
.cert-name { font-family: var(--display); font-size: clamp(1.8rem, 4vw, 2.7rem); color: var(--ink); margin: .1rem 0; border: 0; }
.cert-title { font-family: var(--display); color: var(--brand); margin: .1rem 0 .35rem; }
.cert-tag { color: var(--muted); font-size: .9rem; }
.cert-meta { display: flex; justify-content: center; gap: 2.5rem; flex-wrap: wrap; margin: 1.8rem 0 1.2rem; font-size: .9rem; }
.cert-meta span { display: block; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; font-size: .68rem; margin-bottom: .15rem; }
.cert-sign { margin-top: 1.4rem; }
.cert-sign .sig { display: inline-block; border-top: 1px solid var(--ink-2); padding-top: .4rem; min-width: 18rem; }
.cert-sign .sig span { color: var(--muted); font-size: .82rem; }
@media print {
  body { background: #fff; }
  .site-header, .app-bar, .site-footer, .app-foot, .cert-toolbar { display: none !important; }
  .cert-page { max-width: none; padding: 0; }
  .certificate { box-shadow: none; }
  @page { size: landscape; margin: 1.2cm; }
}