/* MES Public Design System v11.00 — 2026-08-17
   Scope: public/main pages only. Functional layout and JS untouched. */
:root{
  --mes-public-navy:#15264c;
  --mes-public-navy-deep:#0f1d3a;
  --mes-public-navy-soft:#eef3f9;
  --mes-public-gold:#c8a35f;
  --mes-public-text:#19243b;
  --mes-public-sub:#4b5870;
  --mes-public-line:#c7d2e1;
  --mes-public-line-strong:#aebdce;
  --mes-public-bg:#f6f8fb;
  --mes-public-white:#fff;
  --mes-public-green:#24785c;
  --mes-public-red:#b74747;
}

html,body{background:var(--mes-public-bg);color:var(--mes-public-text)}
body{font-weight:500}

/* Header / navigation */
.site-header{
  background:rgba(255,255,255,.97)!important;
  border-bottom:1px solid var(--mes-public-line)!important;
  box-shadow:0 2px 10px rgba(21,38,76,.055)!important;
}
.header-inner{max-width:1180px!important;padding-top:10px!important;padding-bottom:10px!important}
.brand{min-width:0}
.brand-text{color:var(--mes-public-navy)!important;font-weight:800!important;letter-spacing:-.02em}
.mes-header-logo{filter:none!important}
.nav{gap:4px!important;align-items:center}
.nav a{
  color:#334159!important;
  font-weight:700!important;
  border-radius:6px!important;
  padding:8px 10px!important;
  transition:background .15s ease,color .15s ease!important;
}
.nav a:hover,.nav a:focus-visible{background:var(--mes-public-navy-soft)!important;color:var(--mes-public-navy)!important}

/* Page heading */
.page-hero{
  background:var(--mes-public-white)!important;
  border-bottom:1px solid var(--mes-public-line)!important;
  box-shadow:none!important;
}
.page-hero .inner{max-width:1100px!important;padding-top:32px!important;padding-bottom:28px!important}
.page-hero h1{color:var(--mes-public-navy)!important;font-weight:900!important;letter-spacing:-.035em!important}
.page-hero p{color:var(--mes-public-sub)!important;font-weight:600!important}
.crumb,.eyebrow,.kicker,.hero-kicker{
  color:#876b36!important;
  font-weight:800!important;
  letter-spacing:.04em!important;
}

/* Main content rhythm */
.content{max-width:1100px!important}
.content>section,.content>.panel{margin-top:18px;margin-bottom:18px}
h1,h2,h3{color:var(--mes-public-navy)}
h2{letter-spacing:-.025em}
p,li{color:var(--mes-public-text)}
.page-note,.sample-note,.sample-disclaimer{color:var(--mes-public-sub)!important}

/* Panels and cards — clearer lines, less decorative shadow */
.panel,.card,.section-card,.lead-card,.image-panel,.roadmap-panel,
.text-feature-card,.philosophy-card,.feature,.link-card,
.admission-copy-card,.admission-form-panel,.notice-box,
.flow-step,.journey-card,.score-box,.after-feature,.result-stat{
  background:var(--mes-public-white)!important;
  border-color:var(--mes-public-line-strong)!important;
  box-shadow:0 2px 8px rgba(21,38,76,.045)!important;
}
.panel,.card,.section-card,.lead-card,.roadmap-panel,.admission-copy-card,.admission-form-panel{border-radius:10px!important}
.text-feature-card,.philosophy-card,.feature,.link-card,.flow-step,.journey-card,.score-box,.after-feature,.result-stat{border-radius:8px!important}

/* Buttons */
.btn{
  background:var(--mes-public-navy)!important;
  border:1px solid var(--mes-public-navy)!important;
  color:#fff!important;
  border-radius:7px!important;
  box-shadow:none!important;
  font-weight:800!important;
}
.btn:hover,.btn:focus-visible{background:var(--mes-public-navy-deep)!important;border-color:var(--mes-public-navy-deep)!important}
.btn.secondary{
  background:#fff!important;
  color:var(--mes-public-navy)!important;
  border-color:var(--mes-public-line-strong)!important;
}
.btn.secondary:hover,.btn.secondary:focus-visible{background:var(--mes-public-navy-soft)!important}
.btn.gold{background:#a98545!important;border-color:#a98545!important;color:#fff!important}

/* Public forms */
.admission-form-panel input,.admission-form-panel select,.admission-form-panel textarea,
.content input,.content select,.content textarea{
  border-color:var(--mes-public-line-strong)!important;
  color:var(--mes-public-text)!important;
  background:#fff!important;
  box-shadow:none!important;
}
.admission-form-panel label,.form-field label{color:#334159!important;font-weight:800!important}
.check-card{border-color:var(--mes-public-line)!important;background:#fff!important}
.check-card:has(input:checked){border-color:var(--mes-public-navy)!important;background:var(--mes-public-navy-soft)!important}

/* Main page */
.hero.home-compact-hero{background:linear-gradient(180deg,#fff 0%,#f4f7fb 100%)!important;border-bottom:1px solid var(--mes-public-line)!important}
.home-hero-copy h1{color:var(--mes-public-navy)!important;text-shadow:none!important}
.home-hero-copy p,.home-philosophy-list{color:var(--mes-public-text)!important}
.home-menu-panel{background:#fff!important;border:1px solid var(--mes-public-line-strong)!important;box-shadow:0 3px 12px rgba(21,38,76,.05)!important}
.home-menu-head{color:var(--mes-public-navy)!important}
.home-quick-card{background:#fff!important;border:1px solid var(--mes-public-line)!important;box-shadow:none!important;color:var(--mes-public-text)!important}
.home-quick-card:hover{border-color:var(--mes-public-navy)!important;background:var(--mes-public-navy-soft)!important;transform:none!important}
.home-quick-card.important{border-color:#bda26b!important;background:#fffdf8!important}

/* Writing / Level Test public system pages: preserve semantic accents, calm overall shell */
.system-hero,.hero2{background:linear-gradient(135deg,var(--mes-public-navy-deep),var(--mes-public-navy))!important}
.system-hero h1,.system-hero p,.hero2 h1,.hero2 p{color:#fff!important}
.system-hero .eyebrow,.hero2 .eyebrow{color:#e4c681!important}
.flow-step,.journey-card{border-color:var(--mes-public-line-strong)!important}
.grade-tabs,.mock-tabs,.q-tabs{border-color:var(--mes-public-line)!important}
.grade-tabs .active,.mock-tab.active,.q-tabs .active{background:var(--mes-public-navy)!important;color:#fff!important}

/* Management / information pages */
.management-top-note,.page-note{background:#f8fafc!important;border-color:var(--mes-public-line)!important}
.text-feature-card h3,.philosophy-card h3,.link-card h3{color:var(--mes-public-navy)!important}
.location-row{border-color:var(--mes-public-line)!important}

/* Tables */
table{border-color:var(--mes-public-line-strong)!important}
th{background:#eef2f7!important;color:var(--mes-public-navy)!important;border-color:var(--mes-public-line-strong)!important;font-weight:800!important}
td{border-color:var(--mes-public-line)!important;color:var(--mes-public-text)!important}

/* Footer */
.site-footer{background:var(--mes-public-navy-deep)!important;color:#e7edf7!important;border-top:1px solid #263a61!important}
.site-footer *{color:inherit}

/* Prevent accidental horizontal overflow */
img,video,iframe{max-width:100%}
.content,.inner,.header-inner{min-width:0}
.content *{box-sizing:border-box}

@media(max-width:900px){
  .header-inner{padding-left:14px!important;padding-right:14px!important}
  .nav{gap:2px!important;overflow-x:auto!important;white-space:nowrap!important;scrollbar-width:none}
  .nav::-webkit-scrollbar{display:none}
  .nav a{padding:7px 9px!important;font-size:13px!important}
  .content{padding-left:14px!important;padding-right:14px!important}
  .page-hero .inner{padding:24px 14px 22px!important}
}

@media(max-width:640px){
  .brand-text{font-size:14px!important}
  .mes-header-logo{max-width:94px!important}
  .page-hero h1{font-size:28px!important}
  .btn-row{gap:7px!important}
  .btn{min-height:40px}
}
