/* =========================================================
   TopEduPrep — Design System
   Navy / Gold, Fraunces + Pretendard + DM Mono
   ========================================================= */

:root{
  --navy-900:#0B1220;
  --navy-800:#0B1F3A;
  --navy-700:#0B2545;
  --navy-600:#122C55;
  --gold-500:#C9A84C;
  --gold-400:#C9A961;
  --gold-soft:#E7D9A6;
  --paper:#F7F4EC;
  --paper-dim:#EFEAdd;
  --ink:#141A22;
  --ink-soft:#4B5563;
  --line:rgba(11,31,58,0.12);
  --line-on-navy:rgba(201,168,76,0.28);
  --white:#FFFFFF;

  --serif:'Fraunces', Georgia, serif;
  --sans:'Pretendard', -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', sans-serif;
  --mono:'DM Mono', 'JetBrains Mono', monospace;

  --radius-sm:6px;
  --radius-md:12px;
  --radius-lg:20px;
  --shadow-1: 0 1px 2px rgba(11,18,32,0.06), 0 8px 24px rgba(11,18,32,0.06);
  --shadow-2: 0 4px 10px rgba(11,18,32,0.10), 0 20px 48px rgba(11,18,32,0.14);
  --maxw: 1160px;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:var(--sans);
  color:var(--ink);
  background:var(--paper);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  font-feature-settings:"tnum" 1;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{ font-family:var(--serif); margin:0 0 .5em; letter-spacing:-0.01em; font-weight:600; color:var(--navy-800); }
p{ margin:0 0 1em; }
ul{ margin:0; padding:0; list-style:none; }
button{ font-family:inherit; cursor:pointer; }
.container{ max-width:var(--maxw); margin:0 auto; padding:0 24px; }
.eyebrow{
  font-family:var(--mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--gold-500); display:inline-flex; align-items:center; gap:8px; margin-bottom:14px;
}
.eyebrow::before{ content:""; width:22px; height:1px; background:var(--gold-500); display:inline-block; }
.section{ padding:88px 0; }
.section--tight{ padding:56px 0; }
.section--navy{ background:var(--navy-800); color:var(--paper); }
.section--navy h2, .section--navy h3{ color:var(--paper); }
.section--paperdim{ background:var(--paper-dim); }
.section-head{ max-width:640px; margin-bottom:48px; }
.section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }
h2{ font-size:clamp(28px,3.4vw,40px); }
h3{ font-size:clamp(19px,2vw,23px); }
.lede{ font-size:17px; color:var(--ink-soft); }
.section--navy .lede{ color:rgba(247,244,236,0.72); }

/* Buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:14px 26px; border-radius:999px; font-weight:600; font-size:15px;
  border:1px solid transparent; transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
  white-space:nowrap;
}
.btn:hover{ transform:translateY(-1px); }
.btn-gold{ background:var(--gold-500); color:var(--navy-900); box-shadow:var(--shadow-1); }
.btn-gold:hover{ background:var(--gold-400); box-shadow:var(--shadow-2); }
.btn-outline{ background:transparent; border-color:var(--line-on-navy); color:var(--paper); }
.btn-outline:hover{ background:rgba(247,244,236,0.08); }
.btn-outline-dark{ background:transparent; border-color:var(--navy-800); color:var(--navy-800); }
.btn-outline-dark:hover{ background:var(--navy-800); color:var(--paper); }
.btn-block{ width:100%; }
.btn-sm{ padding:10px 18px; font-size:13px; }

/* Header / Nav */
.site-header{
  position:sticky; top:0; z-index:80;
  background:rgba(11,31,58,0.94); backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line-on-navy);
}
.nav{ display:flex; align-items:center; justify-content:space-between; padding:14px 0; }
.brand{ display:flex; align-items:center; gap:10px; color:var(--paper); }
.brand-mark{ width:32px; height:32px; border-radius:8px; background:linear-gradient(155deg,var(--gold-400),var(--gold-500)); display:flex; align-items:center; justify-content:center; font-family:var(--serif); font-weight:700; color:var(--navy-900); font-size:15px; }
.brand-name{ font-family:var(--serif); font-size:18px; font-weight:600; letter-spacing:.01em; }
.brand-name em{ font-style:normal; color:var(--gold-400); }
.nav-links{ display:flex; align-items:center; gap:28px; }
.nav-links a{ color:rgba(247,244,236,0.78); font-size:14.5px; font-weight:500; transition:color .15s; }
.nav-links a:hover, .nav-links a.active{ color:var(--gold-400); }
.nav-cta{ display:flex; gap:10px; }
.nav-toggle{ display:none; background:none; border:1px solid var(--line-on-navy); color:var(--paper); border-radius:8px; padding:8px 10px; }
@media (max-width: 920px){
  .nav-links{ position:absolute; top:100%; left:0; right:0; background:var(--navy-800); flex-direction:column; align-items:flex-start; padding:18px 24px; gap:16px; border-bottom:1px solid var(--line-on-navy); display:none; }
  .nav-links.open{ display:flex; }
  .nav-cta{ display:none; }
  .nav-toggle{ display:inline-flex; }
}

/* Footer */
.site-footer{ background:var(--navy-900); color:rgba(247,244,236,0.65); padding:56px 0 28px; font-size:14px; }
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:32px; margin-bottom:36px; }
.footer-grid h4{ color:var(--paper); font-family:var(--sans); font-size:13px; text-transform:uppercase; letter-spacing:.1em; margin-bottom:14px; }
.footer-grid li{ margin-bottom:8px; }
.footer-grid a:hover{ color:var(--gold-400); }
.footer-bottom{ border-top:1px solid rgba(247,244,236,0.12); padding-top:22px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-family:var(--mono); font-size:12px; }
@media (max-width:760px){ .footer-grid{ grid-template-columns:1fr 1fr; } }

/* Hero */
.hero{
  position:relative; overflow:hidden;
  background:
    radial-gradient(1100px 520px at 82% -10%, rgba(201,168,76,0.16), transparent 60%),
    radial-gradient(900px 500px at -10% 110%, rgba(201,168,76,0.10), transparent 60%),
    linear-gradient(180deg, var(--navy-900), var(--navy-800) 60%, var(--navy-700));
  color:var(--paper);
  padding:96px 0 70px;
}
.hero-grid{ display:grid; grid-template-columns:1.15fr .85fr; gap:56px; align-items:center; }
.hero h1{ color:var(--paper); font-size:clamp(32px,4.4vw,52px); line-height:1.16; }
.hero h1 .accent{ color:var(--gold-400); font-style:italic; }
.hero-sub{ font-size:17px; color:rgba(247,244,236,0.75); max-width:520px; margin-bottom:30px; }
.hero-regions{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:34px; }
.region-chip{ font-family:var(--mono); font-size:12.5px; padding:6px 12px; border:1px solid var(--line-on-navy); border-radius:999px; color:var(--gold-soft); }
.hero-actions{ display:flex; gap:12px; flex-wrap:wrap; }
.hero-stats{ display:flex; gap:28px; margin-top:44px; flex-wrap:wrap; }
.hero-stat b{ display:block; font-family:var(--serif); font-size:26px; color:var(--gold-400); }
.hero-stat span{ font-size:12.5px; color:rgba(247,244,236,0.6); }

/* Globe / world-band signature graphic */
.world-band{
  position:relative; border-radius:var(--radius-lg); overflow:hidden;
  background:linear-gradient(180deg,#0E1B33,#0B1425);
  border:1px solid var(--line-on-navy);
  aspect-ratio:1/1;
  box-shadow:var(--shadow-2);
}
.world-band svg{ width:100%; height:100%; display:block; }
.world-band .caption{ position:absolute; bottom:14px; left:14px; right:14px; font-family:var(--mono); font-size:11.5px; color:rgba(247,244,236,0.65); display:flex; justify-content:space-between; }

/* Timezone widget */
.tz-widget{ background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-lg); padding:32px; box-shadow:var(--shadow-1); }
.tz-tabs{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:26px; }
.tz-tab{ font-family:var(--mono); font-size:13px; padding:9px 16px; border-radius:999px; border:1px solid var(--line); background:var(--white); color:var(--ink-soft); }
.tz-tab.active{ background:var(--navy-800); color:var(--paper); border-color:var(--navy-800); }
.tz-panel{ display:grid; grid-template-columns:1fr 1fr; gap:24px; align-items:center; }
.tz-detect{ background:var(--navy-800); color:var(--paper); border-radius:var(--radius-md); padding:22px 24px; }
.tz-detect .label{ font-family:var(--mono); font-size:11.5px; color:var(--gold-soft); text-transform:uppercase; letter-spacing:.08em; margin-bottom:8px; }
.tz-detect .time{ font-family:var(--serif); font-size:30px; color:var(--paper); }
.tz-detect .sub{ font-size:13.5px; color:rgba(247,244,236,0.7); margin-top:6px; }
.tz-schedule-table{ width:100%; border-collapse:collapse; font-size:14px; }
.tz-schedule-table th{ text-align:left; font-family:var(--mono); font-size:11.5px; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-soft); padding:8px 6px; border-bottom:1px solid var(--line); }
.tz-schedule-table td{ padding:10px 6px; border-bottom:1px solid var(--line); }
.tz-schedule-table td.local{ font-family:var(--mono); color:var(--navy-800); font-weight:600; }
.tz-fallback-note{ font-size:12.5px; color:var(--ink-soft); margin-top:14px; }
@media (max-width:760px){ .tz-panel{ grid-template-columns:1fr; } }

/* Zoom mockup */
.zoom-mock{ background:#12151C; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-2); border:1px solid #262B36; }
.zoom-mock .bar{ display:flex; align-items:center; gap:8px; padding:11px 14px; background:#1B1F29; }
.zoom-mock .dot{ width:10px; height:10px; border-radius:50%; }
.zoom-mock .dot.r{ background:#EE6A5F; } .zoom-mock .dot.y{ background:#F4BE4F; } .zoom-mock .dot.g{ background:#61C454; }
.zoom-mock .titlebar{ margin-left:10px; font-family:var(--mono); font-size:11.5px; color:#9AA3B2; }
.zoom-mock .stage{ display:grid; grid-template-columns:2fr 1fr; gap:1px; background:#262B36; }
.zoom-mock .tile{ background:#1A2434; aspect-ratio:16/10; display:flex; align-items:center; justify-content:center; position:relative; }
.zoom-mock .tile .avatar{ width:56px; height:56px; border-radius:50%; background:linear-gradient(155deg,var(--gold-400),var(--gold-500)); display:flex;align-items:center;justify-content:center; font-family:var(--serif); color:var(--navy-900); font-weight:700; }
.zoom-mock .tile .tag{ position:absolute; bottom:10px; left:10px; font-family:var(--mono); font-size:10.5px; background:rgba(0,0,0,0.5); color:#E7E9EE; padding:3px 8px; border-radius:5px; }
.zoom-mock .side{ display:flex; flex-direction:column; gap:1px; }
.zoom-mock .side .tile{ aspect-ratio:16/10; }
.zoom-mock .side .tile .avatar{ width:36px; height:36px; font-size:13px; }
.zoom-mock .controls{ display:flex; justify-content:center; gap:14px; padding:14px; background:#1B1F29; }
.zoom-mock .controls .ctl{ width:38px; height:38px; border-radius:10px; background:#2A303C; }

/* Trust points */
.trust-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:40px; }
.trust-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius-md); padding:24px; }
.trust-card .ic{ width:38px;height:38px;border-radius:9px; background:var(--paper-dim); display:flex;align-items:center;justify-content:center; margin-bottom:14px; color:var(--gold-500); }
.trust-card h4{ font-family:var(--sans); font-size:15px; font-weight:700; color:var(--navy-800); margin-bottom:6px; }
.trust-card p{ font-size:13.8px; color:var(--ink-soft); margin:0; }
@media (max-width:920px){ .trust-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .trust-grid{ grid-template-columns:1fr; } }

/* Journey / cycle */
.journey{ display:grid; grid-template-columns:repeat(3,1fr); gap:0; position:relative; margin-top:20px;}
.journey-step{ position:relative; padding:28px 26px; border:1px solid var(--line); background:var(--white); }
.journey-step:not(:last-child){ border-right:none; }
.journey-step .num{ font-family:var(--mono); font-size:12px; color:var(--gold-500); margin-bottom:10px; display:block; }
.journey-step h4{ font-family:var(--sans); color:var(--navy-800); font-size:16px; margin-bottom:8px; }
.journey-step p{ font-size:13.8px; color:var(--ink-soft); margin:0; }
.journey-arrow{ position:absolute; top:50%; right:-11px; transform:translateY(-50%); width:22px; height:22px; border-radius:50%; background:var(--gold-500); color:var(--navy-900); display:flex; align-items:center; justify-content:center; font-size:12px; z-index:2; }
@media (max-width:820px){ .journey{ grid-template-columns:1fr; } .journey-step:not(:last-child){ border-right:1px solid var(--line); border-bottom:none; } .journey-arrow{ top:auto; bottom:-11px; right:50%; transform:translate(50%,0) rotate(90deg); } }

/* Campus cards */
.campus-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:36px; }
.campus-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius-md); overflow:hidden; }
.campus-card .top{ padding:26px 24px 20px; background:linear-gradient(160deg,var(--navy-800),var(--navy-700)); color:var(--paper); }
.campus-card .top .tag{ font-family:var(--mono); font-size:11px; color:var(--gold-soft); text-transform:uppercase; letter-spacing:.08em; }
.campus-card .top h4{ color:var(--paper); font-family:var(--serif); font-size:21px; margin:8px 0 4px; }
.campus-card .top .loc{ font-size:13px; color:rgba(247,244,236,0.7); }
.campus-card .body{ padding:22px 24px; }
.campus-card .body li{ font-size:13.6px; color:var(--ink-soft); padding-left:16px; position:relative; margin-bottom:8px; }
.campus-card .body li::before{ content:"—"; position:absolute; left:0; color:var(--gold-500); }
@media (max-width:920px){ .campus-grid{ grid-template-columns:1fr; } }

/* Stats / placeholder */
.stat-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:36px; }
.stat-card{ border:1px dashed var(--line-on-navy); border-radius:var(--radius-md); padding:26px 20px; text-align:center; background:rgba(247,244,236,0.03); }
.stat-card .num{ font-family:var(--serif); font-size:34px; color:var(--gold-400); }
.stat-card .lab{ font-size:12.8px; color:rgba(247,244,236,0.65); margin-top:6px; }
.stat-note{ font-family:var(--mono); font-size:11.5px; text-align:center; margin-top:18px; color:rgba(247,244,236,0.5); }
@media (max-width:920px){ .stat-grid{ grid-template-columns:1fr 1fr; } }

/* FAQ */
.faq-list{ border-top:1px solid var(--line); }
.faq-item{ border-bottom:1px solid var(--line); }
.faq-q{ width:100%; text-align:left; background:none; border:none; padding:20px 4px; display:flex; justify-content:space-between; align-items:center; font-family:var(--sans); font-weight:600; font-size:15.5px; color:var(--navy-800); }
.faq-q .plus{ font-family:var(--mono); color:var(--gold-500); font-size:18px; transition:transform .2s; }
.faq-item.open .faq-q .plus{ transform:rotate(45deg); }
.faq-a{ max-height:0; overflow:hidden; transition:max-height .25s ease; }
.faq-item.open .faq-a{ max-height:220px; }
.faq-a p{ padding:0 4px 20px; font-size:14.5px; color:var(--ink-soft); }

/* Conversion */
.conv-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:40px; }
.conv-form{ background:var(--white); border-radius:var(--radius-lg); padding:32px; box-shadow:var(--shadow-1); }
.f-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px; }
.f-field{ display:flex; flex-direction:column; gap:6px; }
.f-field label{ font-size:12.5px; color:var(--ink-soft); font-weight:600; }
.f-field input, .f-field select, .f-field textarea{
  padding:12px 14px; border:1px solid var(--line); border-radius:8px; font-family:inherit; font-size:14.5px; background:var(--paper);
}
.conv-channels{ display:flex; flex-direction:column; gap:14px; }
.channel-card{ display:flex; align-items:center; gap:16px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius-md); padding:20px; }
.channel-card .ic{ width:46px;height:46px;border-radius:12px; display:flex;align-items:center;justify-content:center; font-weight:700; color:var(--navy-900); flex-shrink:0; }
.channel-card.kakao .ic{ background:#FEE500; }
.channel-card.naver .ic{ background:#03C75A; color:var(--white); }
.channel-card.phone .ic{ background:var(--gold-500); }
.channel-card h4{ font-family:var(--sans); font-size:14.5px; margin-bottom:2px; }
.channel-card p{ font-size:12.8px; color:var(--ink-soft); margin:0; }
.channel-card .go{ margin-left:auto; }
.note-callout{ background:var(--paper-dim); border-left:3px solid var(--gold-500); padding:16px 18px; border-radius:8px; font-size:13.8px; color:var(--ink-soft); margin-top:6px; }

/* Reviews */
.review-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.review-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius-md); padding:24px; display:flex; flex-direction:column; gap:14px; }
.review-card .stars{ color:var(--gold-500); font-size:14px; letter-spacing:2px; }
.review-card .quote{ font-size:14.5px; color:var(--ink); }
.review-card .who{ display:flex; align-items:center; gap:10px; margin-top:auto; padding-top:12px; border-top:1px solid var(--line); }
.review-card .who .av{ width:34px;height:34px;border-radius:50%; background:var(--paper-dim); display:flex;align-items:center;justify-content:center; font-family:var(--mono); font-size:12px; color:var(--navy-800); }
.review-card .who .meta{ font-size:12.3px; color:var(--ink-soft); }
.review-card .who .meta b{ display:block; color:var(--navy-800); font-size:13.3px; }
@media (max-width:920px){ .review-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:600px){ .review-grid{ grid-template-columns:1fr; } }

/* Curriculum page */
.subject-tabs{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:32px; }
.subject-tab{ font-family:var(--mono); font-size:13px; padding:10px 18px; border-radius:999px; border:1px solid var(--line); background:var(--white); color:var(--ink-soft); }
.subject-tab.active{ background:var(--navy-800); border-color:var(--navy-800); color:var(--paper); }
.subject-panel{ display:none; }
.subject-panel.active{ display:block; }
.curr-table{ width:100%; border-collapse:collapse; margin-bottom:28px; }
.curr-table th{ text-align:left; background:var(--navy-800); color:var(--paper); font-size:12.5px; text-transform:uppercase; letter-spacing:.06em; padding:12px 14px; }
.curr-table td{ padding:12px 14px; border-bottom:1px solid var(--line); font-size:14px; vertical-align:top; }
.curr-table tr:nth-child(even) td{ background:var(--paper-dim); }
.weekly-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:8px; margin:20px 0 32px; }
.weekly-day{ background:var(--white); border:1px solid var(--line); border-radius:10px; padding:14px 10px; text-align:center; }
.weekly-day .d{ font-family:var(--mono); font-size:11px; color:var(--gold-500); text-transform:uppercase; margin-bottom:6px; }
.weekly-day .t{ font-size:12.6px; color:var(--ink-soft); line-height:1.5; }
@media (max-width:900px){ .weekly-grid{ grid-template-columns:repeat(4,1fr); } }
@media (max-width:560px){ .weekly-grid{ grid-template-columns:repeat(2,1fr); } }

/* Exam schedule page */
.exam-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.exam-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius-md); overflow:hidden; }
.exam-card .head{ padding:20px 22px; background:var(--navy-800); color:var(--paper); }
.exam-card .head h4{ color:var(--paper); font-family:var(--serif); margin:0; font-size:20px; }
.exam-card .body{ padding:20px 22px; }
.exam-card table{ width:100%; border-collapse:collapse; font-size:13.4px; }
.exam-card td{ padding:8px 4px; border-bottom:1px dashed var(--line); }
.exam-card td.dt{ font-family:var(--mono); font-weight:700; color:var(--navy-800); white-space:nowrap; }
.exam-note{ font-size:12px; color:var(--ink-soft); margin-top:10px; }
@media (max-width:920px){ .exam-grid{ grid-template-columns:1fr; } }

/* Mock test page */
.mock-shell{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius-lg); box-shadow:var(--shadow-1); overflow:hidden; }
.mock-top{ display:flex; align-items:center; justify-content:space-between; padding:16px 24px; background:var(--navy-800); color:var(--paper); }
.mock-top .mt-left{ display:flex; align-items:center; gap:14px; }
.mock-top .timer{ font-family:var(--mono); font-size:15px; background:rgba(247,244,236,0.08); padding:6px 14px; border-radius:8px; }
.mock-progress{ height:4px; background:var(--paper-dim); }
.mock-progress-bar{ height:100%; background:var(--gold-500); width:0%; transition:width .3s; }
.mock-body{ padding:36px; }
.mock-qnum{ font-family:var(--mono); font-size:12.5px; color:var(--gold-500); text-transform:uppercase; letter-spacing:.08em; margin-bottom:10px; }
.mock-question{ font-size:18px; color:var(--navy-800); margin-bottom:26px; font-family:var(--serif); font-weight:500; }
.mock-choices{ display:flex; flex-direction:column; gap:10px; }
.mock-choice{ display:flex; align-items:center; gap:14px; padding:14px 16px; border:1px solid var(--line); border-radius:10px; cursor:pointer; transition:all .15s; }
.mock-choice:hover{ border-color:var(--gold-500); }
.mock-choice.selected{ border-color:var(--navy-800); background:var(--paper-dim); }
.mock-choice.correct{ border-color:#3E8A5B; background:#EAF6EE; }
.mock-choice.incorrect{ border-color:#C64D4D; background:#FBEAEA; }
.mock-choice .letter{ width:28px; height:28px; border-radius:50%; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; font-family:var(--mono); font-size:12.5px; flex-shrink:0; }
.mock-choice.selected .letter{ background:var(--navy-800); color:var(--paper); border-color:var(--navy-800); }
.mock-nav{ display:flex; justify-content:space-between; padding:20px 36px 32px; border-top:1px solid var(--line); }
.mock-dots{ display:flex; gap:6px; flex-wrap:wrap; padding:0 36px 24px; }
.mock-dot{ width:26px; height:26px; border-radius:50%; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; font-family:var(--mono); font-size:11px; color:var(--ink-soft); background:var(--white); }
.mock-dot.answered{ background:var(--gold-soft); border-color:var(--gold-500); color:var(--navy-800); }
.mock-dot.current{ border-color:var(--navy-800); border-width:2px; }
.mock-result{ text-align:center; padding:56px 36px; }
.mock-result .score{ font-family:var(--serif); font-size:56px; color:var(--navy-800); }
.mock-result .score span{ color:var(--gold-500); }

/* Editor toolbar (lock & download pattern) */
.editor-bar{ position:fixed; bottom:18px; right:18px; z-index:200; display:flex; gap:8px; background:var(--navy-900); border:1px solid var(--line-on-navy); border-radius:999px; padding:8px; box-shadow:var(--shadow-2); }
.editor-bar button{ font-family:var(--mono); font-size:12px; color:var(--paper); background:transparent; border:none; padding:8px 14px; border-radius:999px; }
.editor-bar button.active{ background:var(--gold-500); color:var(--navy-900); }
[contenteditable="true"]{ outline:1px dashed rgba(201,168,76,0.6); outline-offset:2px; }

/* Misc */
.divider{ height:1px; background:var(--line); margin:56px 0; }
.tag-pill{ display:inline-block; font-family:var(--mono); font-size:11px; padding:4px 10px; border-radius:999px; background:var(--paper-dim); color:var(--navy-800); margin-right:6px; }
.reveal{ opacity:0; transform:translateY(14px); transition:opacity .6s ease, transform .6s ease; }
.reveal.in{ opacity:1; transform:none; }
.skip-link{ position:absolute; left:-999px; top:0; background:var(--gold-500); color:var(--navy-900); padding:10px 16px; z-index:999; }
.skip-link:focus{ left:12px; top:12px; }
:focus-visible{ outline:2px solid var(--gold-500); outline-offset:2px; }
@media (prefers-reduced-motion: reduce){ *{ animation:none !important; transition:none !important; } }

/* Page hero (inner pages) */
.page-hero{ background:linear-gradient(180deg,var(--navy-900),var(--navy-800)); color:var(--paper); padding:64px 0 48px; }
.page-hero h1{ color:var(--paper); font-size:clamp(28px,3.6vw,40px); }
.breadcrumb{ font-family:var(--mono); font-size:12px; color:rgba(247,244,236,0.55); margin-bottom:16px; }
.breadcrumb a:hover{ color:var(--gold-400); }