/* ==================================================================
   AISL — American International School of Limbe
   Stylesheet — Design tokens: deep navy / royal blue / brass gold /
   deep crimson, on a cool paper background. Display face Fraunces
   (crest / heritage character), body face Inter.
   ================================================================== */

:root{
  /* ---- Color tokens ---- */
  --navy:        #0B1E3C;   /* primary dark blue — headers, ink */
  --navy-700:    #122B52;
  --royal:       #1B4F9C;   /* royal blue accent */
  --royal-600:   #2E67C4;
  --crimson:     #7E1B24;   /* deep red — crest banner, scarcity CTAs */
  --crimson-600: #9C2530;
  --gold:        #B9924F;   /* brass / laurel gold */
  --gold-200:    #E4CE9B;
  --paper:       #F4F6FA;   /* cool paper background */
  --paper-raised:#FFFFFF;
  --ink:         #14213D;   /* body text */
  --ink-soft:    #51607D;   /* muted text */
  --line:        #DCE2EE;   /* hairline borders */

  /* ---- Type ---- */
  --font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* ---- Layout ---- */
  --max-w: 1240px;
  --radius: 10px;
  --radius-sm: 6px;
  --shadow-sm: 0 1px 3px rgba(11,30,60,0.08);
  --shadow-md: 0 8px 28px rgba(11,30,60,0.12);
  --shadow-lg: 0 20px 50px rgba(11,30,60,0.18);
}

/* ---------------------------------------------------------------
   Reset
   --------------------------------------------------------------- */
*, *::before, *::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
html, body{ max-width: 100%; overflow-x: hidden; }
body{
  margin:0;
  font-family: var(--font-body);
  color: var(--ink);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  line-height: 1.6;
}
img, svg{ max-width:100%; display:block; }
a{ color: inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
button{ font-family: inherit; cursor:pointer; }
h1,h2,h3,h4{
  font-family: var(--font-display);
  color: var(--navy);
  line-height:1.15;
  margin: 0 0 .5em;
  font-weight: 600;
  overflow-wrap: break-word;
}
p{ margin: 0 0 1em; }
.container{
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 clamp(16px, 4vw, 24px);
}

@media (prefers-reduced-motion: reduce){
  *{ animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior:auto !important; }
}

:focus-visible{
  outline: 3px solid var(--gold);
  outline-offset: 2px;
}

/* ---------------------------------------------------------------
   Eyebrow / labels
   --------------------------------------------------------------- */
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-family: var(--font-body);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--crimson);
}
.eyebrow::before{
  content:"";
  width: 18px; height: 1px;
  background: var(--crimson);
  display:inline-block;
}
.eyebrow.on-dark{ color: var(--gold-200); }
.eyebrow.on-dark::before{ background: var(--gold-200); }

/* ---------------------------------------------------------------
   Buttons
   --------------------------------------------------------------- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding: 13px 26px;
  border-radius: 999px;
  font-weight: 600;
  font-size: 15px;
  border: 1.5px solid transparent;
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, color .18s ease;
  white-space: nowrap;
}
.btn:hover{ transform: translateY(-2px); }
.btn-crimson{ background: var(--crimson); color:#fff; box-shadow: var(--shadow-sm); }
.btn-crimson:hover{ background: var(--crimson-600); box-shadow: var(--shadow-md); }
.btn-gold{ background: var(--gold); color: var(--navy); box-shadow: var(--shadow-sm);}
.btn-gold:hover{ background: var(--gold-200); }
.btn-outline-light{ border-color: rgba(255,255,255,.45); color:#fff; }
.btn-outline-light:hover{ border-color:#fff; background: rgba(255,255,255,.08); }
.btn-outline-navy{ border-color: var(--navy); color: var(--navy); }
.btn-outline-navy:hover{ background: var(--navy); color:#fff; }
.btn-ghost{ color: var(--royal); padding: 8px 4px; }
.btn-ghost::after{ content:"→"; margin-left:6px; transition: margin-left .18s ease; }
.btn-ghost:hover::after{ margin-left:10px; }
.btn-sm{ padding: 9px 18px; font-size: 13.5px; }
.btn-block{ width:100%; }

/* ==================================================================
   GLOBAL UTILITY HEADER (top strip)
   ================================================================== */
.utility-bar{
  background: var(--navy);
  color: rgba(255,255,255,.82);
  font-size: 13px;
  border-bottom: 1px solid rgba(185,146,79,.35);
}
.utility-bar .container{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 16px;
  min-height: 40px;
  flex-wrap: wrap;
  padding-top:6px; padding-bottom:6px;
}
.utility-left{
  display:flex; align-items:center; gap:18px; flex-wrap:wrap;
}
.utility-left a{
  display:inline-flex; align-items:center; gap:6px;
  color: rgba(255,255,255,.82);
  transition: color .15s ease;
}
.utility-left a:hover{ color: var(--gold-200); }
.utility-right{
  display:flex; align-items:center; gap:14px;
}
.pioneer-cta{
  display:inline-flex; align-items:center; gap:6px;
  background: var(--crimson);
  color:#fff;
  padding: 6px 14px;
  border-radius: 999px;
  font-weight:700;
  font-size:12.5px;
  letter-spacing:.02em;
}
.pioneer-cta:hover{ background: var(--crimson-600); color:#fff; }
.pioneer-cta .star{ color: var(--gold-200); }
.icon-link{
  color: rgba(255,255,255,.75);
  display:inline-flex; align-items:center;
}
.icon-link:hover{ color:#fff; }
.lang-switch{
  display:flex; align-items:center; gap:4px;
  color: rgba(255,255,255,.75);
  font-size:12.5px;
}

/* ==================================================================
   MAIN NAVIGATION
   ================================================================== */
.main-nav{
  background: var(--paper-raised);
  border-bottom: 1px solid var(--line);
  position: sticky;
  top:0;
  z-index: 500;
}
.main-nav .container{
  display:flex;
  align-items:center;
  justify-content: space-between;
  min-height: 82px;
  gap: 20px;
}
.brand{
  display:flex; align-items:center; gap:12px;
  flex-shrink:0;
}
.brand img{ height: 54px; width:54px; }
.brand-text{ display:flex; flex-direction:column; line-height:1.15; }
.brand-text .brand-name{
  font-family: var(--font-display);
  font-weight:700;
  font-size: 18px;
  color: var(--navy);
}
.brand-text .brand-sub{
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ink-soft);
}

.nav-links{
  display:flex;
  align-items:center;
  gap: 4px;
  flex:1;
  justify-content:center;
}
.nav-item{ position: relative; }
.nav-item > a, .nav-item > button.nav-top-link{
  display:flex; align-items:center; gap:5px;
  padding: 14px 14px;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--navy);
  background:none; border:none;
  border-bottom: 2px solid transparent;
}
.nav-item > a:hover,
.nav-item.open > a,
.nav-item > button.nav-top-link:hover,
.nav-item.open > button.nav-top-link{
  color: var(--royal);
  border-bottom-color: var(--gold);
}
.nav-caret{ font-size:10px; margin-top:1px; transition: transform .18s ease; }
.nav-item.open .nav-caret{ transform: rotate(180deg); }

.nav-actions{
  display:flex; align-items:center; gap:10px; flex-shrink:0;
}

/* Dropdown panel */
.dropdown{
  position:absolute;
  top: calc(100% + 0px);
  left: 50%;
  transform: translateX(-50%) translateY(8px);
  width: 480px;
  max-width: calc(100vw - 40px);
  background: #fff;
  border: 1px solid var(--line);
  border-top: 3px solid var(--gold);
  border-radius: var(--radius);
  box-shadow: var(--shadow-lg);
  padding: 20px;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition: opacity .16s ease, transform .16s ease;
  z-index: 400;
}
.nav-item.open .dropdown{
  opacity:1; visibility:visible; pointer-events:auto;
  transform: translateX(-50%) translateY(0);
}
.dropdown-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px 18px;
}
.dropdown-link{
  display:flex; gap:12px; align-items:flex-start;
  padding: 10px 10px;
  border-radius: var(--radius-sm);
}
.dropdown-link:hover{ background: var(--paper); }
.dropdown-link .dot{
  width:8px; height:8px; border-radius:50%;
  background: var(--gold);
  margin-top:7px; flex-shrink:0;
}
.dropdown-link .dlink-title{ font-weight:700; color: var(--navy); font-size:14px; }
.dropdown-link .dlink-desc{ font-size:12.5px; color: var(--ink-soft); margin-top:2px; }
.dropdown-footer{
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  display:flex; justify-content:space-between; align-items:center;
}
.badge-soon{
  font-size:10.5px; font-weight:700; letter-spacing:.05em; text-transform:uppercase;
  color: var(--ink-soft); background: var(--paper); border:1px solid var(--line);
  padding:2px 8px; border-radius:999px;
}

/* Mobile toggle */
.nav-toggle{
  display:none;
  flex-direction:column; gap:5px;
  background:none; border:none; padding:8px;
}
.nav-toggle span{ width:24px; height:2px; background: var(--navy); border-radius:2px; }

/* ==================================================================
   SECTION SUB-NAV (contextual pill tabs, e.g. within "Why AISL")
   ================================================================== */
.subnav-wrap{
  background: var(--navy-700);
  border-bottom: 3px solid var(--gold);
  position: sticky;
  top: 83px; /* sits directly below the 82px main nav bar */
  z-index: 490;
}
.subnav{
  display:flex;
  align-items:center;
  gap: 6px;
  overflow-x:auto;
  padding: 12px 0;
  scrollbar-width: none;
}
.subnav::-webkit-scrollbar{ display:none; }
.subnav a{
  flex-shrink:0;
  padding: 8px 16px;
  border-radius: 999px;
  font-size: 13.5px;
  font-weight:600;
  color: rgba(255,255,255,.72);
  border: 1px solid transparent;
  transition: all .15s ease;
}
.subnav a:hover{ color:#fff; border-color: rgba(255,255,255,.25); }
.subnav a.active{
  background: var(--gold);
  color: var(--navy);
}
.subnav-label{
  color: rgba(255,255,255,.5);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing:.1em;
  padding-right: 12px;
  margin-right: 6px;
  border-right: 1px solid rgba(255,255,255,.2);
  flex-shrink:0;
}

/* ==================================================================
   HERO (homepage)
   ================================================================== */
.hero{
  position:relative;
  background: radial-gradient(1100px 520px at 85% -10%, rgba(185,146,79,.18), transparent 60%), linear-gradient(160deg, var(--navy) 0%, var(--navy-700) 55%, #0E2547 100%);
  color:#fff;
  overflow:hidden;
}
.hero-crest-wm{
  position:absolute;
  right: -80px; top: 50%; transform: translateY(-50%);
  width: 560px; height:560px;
  opacity: .07;
  pointer-events:none;
}
.hero .container{
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap: clamp(32px, 5vw, 56px);
  align-items:center;
  padding-top: clamp(44px, 8vw, 76px);
  padding-bottom: clamp(44px, 8vw, 76px);
  position:relative;
}
.hero h1{
  color:#fff;
  font-size: clamp(34px, 4.2vw, 54px);
  margin: 14px 0 18px;
}
.hero h1 em{
  font-style: normal;
  color: var(--gold-200);
}
.hero-lede{
  color: rgba(255,255,255,.82);
  font-size: 17.5px;
  max-width: 46ch;
  margin-bottom: 28px;
}
.hero-actions{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom: 34px; }

.hero-grades{
  display:flex; flex-wrap:wrap; gap:10px;
}
.grade-chip{
  border: 1px solid rgba(255,255,255,.28);
  color: rgba(255,255,255,.85);
  padding: 6px 14px;
  border-radius: 999px;
  font-size: 12.5px;
  font-weight:600;
  letter-spacing:.02em;
}

/* Founding families card in hero */
.pioneer-card{
  background: #fff;
  color: var(--ink);
  border-radius: 16px;
  padding: clamp(20px, 4vw, 28px);
  box-shadow: var(--shadow-lg);
  border-top: 4px solid var(--crimson);
}
.pioneer-card h3{ font-size:20px; margin-bottom:4px; }
.pioneer-card .pioneer-sub{ color: var(--ink-soft); font-size:13.5px; margin-bottom:18px;}
.pioneer-list{ display:flex; flex-direction:column; gap:10px; margin-bottom:20px; }
.pioneer-list li{
  display:flex; align-items:flex-start; gap:10px;
  font-size: 14px;
}
.pioneer-list .check{
  flex-shrink:0;
  width:20px; height:20px;
  border-radius:50%;
  background: rgba(30,79,156,.1);
  color: var(--royal);
  display:flex; align-items:center; justify-content:center;
  font-size:11px; margin-top:1px;
}

/* Torch scarcity meter — signature element */
.torch-meter{
  margin-top: 6px;
  padding-top: 18px;
  border-top: 1px dashed var(--line);
}
.torch-meter-head{
  display:flex; justify-content:space-between; align-items:baseline;
  font-size:12.5px; color: var(--ink-soft);
  margin-bottom:8px;
}
.torch-meter-head strong{ color: var(--navy); font-family: var(--font-display); font-size:15px; }
.torch-track{
  position:relative;
  height: 10px;
  border-radius: 999px;
  background: var(--paper);
  border: 1px solid var(--line);
  overflow:hidden;
}
.torch-fill{
  position:absolute; left:0; top:0; bottom:0;
  width: 0%;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--crimson), var(--gold));
  transition: width 1.1s cubic-bezier(.2,.8,.2,1);
}
.torch-caption{ font-size:12px; color: var(--ink-soft); margin-top:8px; }

/* ==================================================================
   PAGE / SUBPAGE HERO BANNER
   ================================================================== */
.page-hero{
  background: linear-gradient(160deg, var(--navy) 0%, var(--navy-700) 100%);
  color:#fff;
  padding: clamp(36px, 7vw, 54px) 0 clamp(30px, 6vw, 44px);
  position:relative;
  overflow:hidden;
}
.page-hero .container{ position:relative; }
.page-hero h1{ color:#fff; font-size: clamp(28px,3.6vw,42px); margin: 10px 0 10px; }
.page-hero .lede{ color: rgba(255,255,255,.8); max-width: 62ch; font-size:16px; }
.breadcrumb{
  font-size:12.5px; color: rgba(255,255,255,.6); margin-bottom:8px;
}
.breadcrumb a{ color: rgba(255,255,255,.75); }
.breadcrumb a:hover{ color: var(--gold-200); }

/* ==================================================================
   SECTION SCAFFOLDING
   ================================================================== */
.section{ padding: clamp(40px, 8vw, 74px) 0; }
.section.tight{ padding: clamp(30px, 6vw, 52px) 0; }
.section-head{ max-width: 720px; margin-bottom: 42px; }
.section-head h2{ font-size: clamp(26px,3vw,36px); }
.section.on-navy{ background: var(--navy); color: rgba(255,255,255,.88); }
.section.on-navy h2, .section.on-navy h3{ color:#fff; }
.section.on-paper-raised{ background: var(--paper-raised); }
.divider{
  display:flex; align-items:center; justify-content:center; gap:14px;
  margin: 0 0 42px;
  color: var(--gold);
}
.divider::before, .divider::after{
  content:""; height:1px; width: 120px; background: var(--line);
}

/* ==================================================================
   CREST / PILLAR CARDS  (Why Choose AISL)
   ================================================================== */
.pillar-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.pillar-card{
  background:#fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 28px 24px;
  position:relative;
  transition: transform .2s ease, box-shadow .2s ease;
}
.pillar-card:hover{ transform: translateY(-4px); box-shadow: var(--shadow-md); }
.pillar-shield{
  width:48px; height:48px;
  border-radius: 10px;
  background: var(--navy);
  color: var(--gold-200);
  display:flex; align-items:center; justify-content:center;
  margin-bottom: 16px;
  font-size:20px;
}
.pillar-card h3{ font-size:18px; margin-bottom:8px; }
.pillar-card p{ font-size: 14.5px; color: var(--ink-soft); margin-bottom:0; }
.pillar-card .num{
  position:absolute; top:22px; right:22px;
  font-family: var(--font-display);
  font-size: 13px; color: var(--line); font-weight:700;
}

/* Stat strip */
.stat-strip{
  display:grid;
  grid-template-columns: repeat(4,1fr);
  gap: 20px;
  border-top: 1px solid rgba(255,255,255,.14);
  border-bottom: 1px solid rgba(255,255,255,.14);
  padding: 30px 0;
}
.stat{ text-align:center; }
.stat .num{ font-family: var(--font-display); font-size: 34px; color: var(--gold-200); }
.stat .label{ font-size:12.5px; color: rgba(255,255,255,.68); letter-spacing:.04em; text-transform:uppercase; margin-top:4px;}

/* ==================================================================
   PROMISE / QUOTE BLOCK
   ================================================================== */
.promise-block{
  background: var(--paper-raised);
  border: 1px solid var(--line);
  border-left: 5px solid var(--crimson);
  padding: clamp(22px, 5vw, 40px);
  border-radius: 14px;
  display:grid;
  grid-template-columns: auto 1fr;
  gap: 26px;
  align-items:flex-start;
}
.promise-mark{
  font-family: var(--font-display);
  font-size: 64px;
  color: var(--gold);
  line-height:1;
}
.promise-block p{
  font-family: var(--font-display);
  font-size: 21px;
  color: var(--navy);
  line-height:1.5;
  margin-bottom:10px;
}
.promise-block .attrib{ font-family: var(--font-body); font-size:13px; color: var(--ink-soft); }

/* ==================================================================
   TWO-COL FEATURE (leadership, foundation content blocks)
   ================================================================== */
.feature-row{
  display:grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 52px;
  align-items:center;
}
.feature-row.reverse{ grid-template-columns: 1.1fr .9fr; }
.feature-row.reverse .feature-media{ order:2; }
.feature-media{
  background: linear-gradient(145deg, var(--navy), var(--royal));
  border-radius: 16px;
  aspect-ratio: 4/3.1;
  display:flex; align-items:center; justify-content:center;
  color: rgba(255,255,255,.85);
  position:relative;
  overflow:hidden;
}
.feature-media .ph-icon{ font-size:54px; opacity:.85; }
.feature-media .ph-label{
  position:absolute; bottom:16px; left:16px; right:16px;
  font-size:11px; letter-spacing:.08em; text-transform:uppercase;
  color: rgba(255,255,255,.6);
}
.feature-copy h2{ font-size: clamp(24px,2.8vw,32px); }
.feature-list{ display:flex; flex-direction:column; gap:12px; margin: 18px 0 24px; }
.feature-list li{ display:flex; gap:12px; align-items:flex-start; font-size:15px; }
.feature-list .ico{
  width:26px; height:26px; border-radius:50%;
  background: rgba(27,79,156,.1); color: var(--royal);
  display:flex; align-items:center; justify-content:center;
  font-size:12px; flex-shrink:0; margin-top:1px;
}

/* Advisory / leadership people */
.people-grid{
  display:grid; grid-template-columns: repeat(3,1fr); gap:24px;
}
.person-card{ text-align:center; }
.person-avatar{
  width: 128px; height:128px; border-radius:50%;
  margin: 0 auto 16px;
  background: linear-gradient(150deg, var(--royal), var(--navy));
  display:flex; align-items:center; justify-content:center;
  color: var(--gold-200); font-family: var(--font-display); font-size:34px;
  border: 4px solid #fff; box-shadow: var(--shadow-sm);
}
.person-card h4{ font-family: var(--font-display); color:var(--navy); font-size:17px; margin-bottom:2px;}
.person-role{ font-size:13px; color: var(--crimson); font-weight:600; margin-bottom:8px; }
.person-bio{ font-size:13.5px; color: var(--ink-soft); }

/* Values grid (Our Foundation) */
.value-grid{ display:grid; grid-template-columns: repeat(2,1fr); gap:18px; }
.value-card{
  border: 1px solid var(--line); border-radius:12px; padding:22px 24px; background:#fff;
  display:flex; gap:16px;
}
.value-card .mono{
  font-family: var(--font-display); font-weight:700; color: var(--gold);
  font-size: 22px; flex-shrink:0;
}

/* Facility / campus tour grid */
.facility-grid{
  display:grid; grid-template-columns: repeat(3,1fr); gap:20px;
}
.facility-card{
  border-radius:14px; overflow:hidden; background:#fff; border:1px solid var(--line);
}
.facility-thumb{
  aspect-ratio: 16/11;
  background: linear-gradient(150deg, var(--royal-600), var(--navy));
  display:flex; align-items:center; justify-content:center;
  color: rgba(255,255,255,.85); font-size:34px;
}
.facility-body{ padding:18px 20px; }
.facility-body h4{ font-family: var(--font-display); color:var(--navy); font-size:16px; margin-bottom:6px;}
.facility-body p{ font-size:13.5px; color: var(--ink-soft); margin-bottom:0; }

/* Map placeholder */
.map-placeholder{
  border-radius:16px;
  border: 1.5px dashed var(--line);
  background:
    linear-gradient(var(--paper-raised), var(--paper-raised)) padding-box;
  aspect-ratio: 16/7;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:8px; color: var(--ink-soft); text-align:center; padding: 20px;
}
.map-placeholder .big{ font-size:32px; }

/* ==================================================================
   FORM (Founding Families)
   ================================================================== */
.form-card{
  background:#fff; border-radius:18px; border:1px solid var(--line);
  box-shadow: var(--shadow-md);
  padding: clamp(20px, 4vw, 36px);
}
.form-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.form-field{ display:flex; flex-direction:column; gap:6px; margin-bottom:18px; }
.form-field.full{ grid-column: 1 / -1; }
.form-field label{ font-size:13px; font-weight:700; color: var(--navy); }
.form-field .req{ color: var(--crimson); }
.form-field input,
.form-field select,
.form-field textarea{
  border: 1.5px solid var(--line);
  border-radius: 8px;
  padding: 12px 14px;
  font-family: var(--font-body);
  font-size: 16px; /* 16px prevents iOS Safari from auto-zooming on focus */
  color: var(--ink);
  background: var(--paper);
  width: 100%;
  transition: border-color .15s ease, background .15s ease;
}
.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus{
  border-color: var(--royal);
  background:#fff;
  outline:none;
}
.form-field .hint{ font-size:12px; color: var(--ink-soft); }
.form-note{ font-size:12.5px; color: var(--ink-soft); margin-top:14px; }

.alert{
  padding: 14px 18px;
  border-radius: 10px;
  font-size: 14px;
  margin-bottom: 24px;
  display:flex; gap:10px; align-items:flex-start;
}
.alert-success{ background: #E9F3EA; color:#1E5B27; border:1px solid #BFE1C3; }
.alert-error{ background: #FBEAEA; color: var(--crimson-600); border:1px solid #F3C7C9; }

.benefit-strip{
  display:grid; grid-template-columns: repeat(3,1fr); gap:16px;
  margin-bottom: 42px;
}
.benefit-pill{
  background: var(--paper-raised);
  border:1px solid var(--line);
  border-radius: 12px;
  padding: 16px 18px;
  font-size: 14px;
  font-weight:600;
  color: var(--navy);
  display:flex; align-items:center; gap:10px;
}
.benefit-pill .em{ color: var(--crimson); }

/* ==================================================================
   FOUNDATIONAL FRAMEWORK — GAIEH badge, founding statement,
   motto band, core values, graduate profile
   ================================================================== */
.gaieh-badge{
  display:inline-flex; align-items:center; gap:8px;
  background: rgba(185,146,79,.12);
  border: 1px solid rgba(185,146,79,.4);
  color: var(--navy);
  font-size: 12.5px;
  font-weight:700;
  letter-spacing:.03em;
  padding: 7px 16px;
  border-radius: 999px;
  margin-bottom: 16px;
}
.gaieh-badge .dot{ width:6px; height:6px; border-radius:50%; background: var(--gold); }

.founding-copy{ max-width: 760px; }
.founding-copy p{ font-size: 16px; color: var(--ink-soft); }
.founding-copy p strong{ color: var(--navy); }

/* Motto band — full-width statement banner */
.motto-band{
  background: linear-gradient(160deg, var(--navy) 0%, var(--navy-700) 100%);
  border-radius: 20px;
  padding: clamp(36px, 6vw, 60px) clamp(24px, 6vw, 60px);
  text-align:center;
  position:relative;
  overflow:hidden;
}
.motto-band::before{
  content:"";
  position:absolute; inset:0;
  background: radial-gradient(700px 260px at 50% 0%, rgba(185,146,79,.18), transparent 65%);
  pointer-events:none;
}
.motto-eyebrow{
  color: var(--gold-200);
  font-size:12.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  margin-bottom:14px; position:relative;
}
.motto-text{
  font-family: var(--font-display);
  color:#fff;
  font-size: clamp(24px, 3.4vw, 38px);
  line-height:1.3;
  max-width: 18ch;
  margin: 0 auto;
  position:relative;
}
.motto-text .accent{ color: var(--gold-200); }

/* Core values — compact badge grid */
.values-grid{
  display:grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 14px;
}
.value-badge{
  background:#fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 18px 14px;
  text-align:center;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.value-badge:hover{ transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: var(--gold); }
.value-badge .vb-icon{
  width:38px; height:38px; border-radius:50%;
  background: var(--navy); color: var(--gold-200);
  display:flex; align-items:center; justify-content:center;
  margin: 0 auto 10px; font-family: var(--font-display); font-weight:700; font-size:15px;
}
.value-badge h4{ font-size:13.5px; color: var(--navy); font-family: var(--font-body); font-weight:700; margin-bottom:4px; }
.value-badge p{ font-size:11.5px; color: var(--ink-soft); margin:0; line-height:1.45; }

/* Graduate profile grid */
.profile-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.profile-item{
  display:flex; align-items:flex-start; gap:12px;
  background: var(--paper-raised);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 16px 18px;
}
.profile-item .pi-check{
  flex-shrink:0;
  width:26px; height:26px; border-radius:50%;
  background: rgba(126,27,36,.09);
  color: var(--crimson);
  display:flex; align-items:center; justify-content:center;
  font-size:12px; margin-top:1px;
}
.profile-item h4{ font-size:14px; color: var(--navy); font-family: var(--font-body); font-weight:700; margin-bottom:2px; }
.profile-item p{ font-size:12.5px; color: var(--ink-soft); margin:0; }

/* Identity statement — closing highlighted block */
.identity-block{
  background: var(--navy);
  border-radius: 18px;
  padding: clamp(28px, 5vw, 44px);
  display:grid;
  grid-template-columns: auto 1fr;
  gap: 24px;
  align-items:flex-start;
}
.identity-block .promise-mark{ color: var(--gold); }
.identity-block p{
  font-family: var(--font-display);
  color:#fff;
  font-size: 18px;
  line-height:1.6;
  margin-bottom: 10px;
}
.identity-block .attrib{ font-family: var(--font-body); font-size:13px; color: rgba(255,255,255,.6); }

/* ==================================================================
   CTA BAND
   ================================================================== */
.cta-band{
  background: linear-gradient(120deg, var(--crimson) 0%, #5E141C 100%);
  color:#fff;
  border-radius: 18px;
  padding: clamp(24px, 5vw, 44px);
  display:flex; align-items:center; justify-content:space-between; gap:26px;
  flex-wrap:wrap;
}
.cta-band h3{ color:#fff; font-size:24px; margin-bottom:6px; }
.cta-band p{ color: rgba(255,255,255,.85); margin-bottom:0; max-width:48ch; }
.cta-band .btn-gold{ flex-shrink:0; }

/* ==================================================================
   FOOTER
   ================================================================== */
.site-footer{
  background: var(--navy);
  color: rgba(255,255,255,.72);
  padding-top: 64px;
}
.footer-grid{
  display:grid;
  grid-template-columns: 1.3fr .9fr .9fr .9fr 1fr;
  gap: 30px;
  padding-bottom: 44px;
  border-bottom: 1px solid rgba(255,255,255,.12);
}
.footer-brand{ display:flex; gap:12px; align-items:flex-start; margin-bottom:16px; }
.footer-brand img{ height:46px; width:46px; }
.footer-brand .fname{ font-family: var(--font-display); color:#fff; font-size:16.5px; line-height:1.3;}
.footer-brand .fsub{ font-size:11.5px; color: var(--gold-200); letter-spacing:.06em; text-transform:uppercase; margin-top:2px;}
.footer-desc{ font-size:13.5px; line-height:1.7; max-width:32ch; }
.footer-col h5{
  color:#fff; font-family: var(--font-body); font-weight:700; font-size:13px;
  letter-spacing:.06em; text-transform:uppercase; margin-bottom:16px;
}
.footer-col ul{ display:flex; flex-direction:column; gap:10px; }
.footer-col a{ font-size:13.5px; color: rgba(255,255,255,.68); }
.footer-col a:hover{ color: var(--gold-200); }
.footer-contact li{ display:flex; gap:10px; align-items:flex-start; font-size:13.5px; margin-bottom:12px; }
.footer-contact .ico{ color: var(--gold-200); flex-shrink:0; margin-top:2px; }
.footer-social{ display:flex; gap:10px; margin-top:18px; }
.footer-social a{
  width:36px; height:36px; border-radius:50%;
  border:1px solid rgba(255,255,255,.22);
  display:flex; align-items:center; justify-content:center;
  transition: all .15s ease;
}
.footer-social a:hover{ background: var(--gold); border-color: var(--gold); color: var(--navy); }

.footer-bottom{
  display:flex; justify-content:space-between; align-items:center;
  padding: 22px 0; flex-wrap:wrap; gap:12px;
  font-size:12.5px; color: rgba(255,255,255,.55);
}
.footer-bottom-links{ display:flex; gap:20px; flex-wrap:wrap; }
.footer-bottom-links a{ color: rgba(255,255,255,.55); }
.footer-bottom-links a:hover{ color:#fff; }

/* ==================================================================
   COMING SOON
   ================================================================== */
.coming-soon-box{
  text-align:center;
  max-width: 560px;
  margin: 0 auto;
  padding: 60px 20px;
}
.coming-soon-box .icon{
  width:72px; height:72px; border-radius:50%;
  background: var(--paper-raised); border:1.5px dashed var(--line);
  display:flex; align-items:center; justify-content:center;
  margin: 0 auto 20px; font-size:28px; color: var(--gold);
}

/* ==================================================================
   RESPONSIVE
   Tiers: >1080 desktop · 1080 tablet (nav collapses to menu) ·
   740 large phone/small tablet · 480 phone
   ================================================================== */

/* ---- 1080px — tablets: collapse nav to the mobile menu (avoids
   dropdown-overflow issues on touch/tablet widths), stack big grids ---- */
@media (max-width: 1080px){
  .nav-links, .nav-actions .btn-outline-navy{ display:none; }
  .nav-toggle{ display:flex; }

  .values-grid{ grid-template-columns: repeat(3, 1fr); }
  .profile-grid{ grid-template-columns: repeat(2, 1fr); }
  .identity-block{ grid-template-columns: 1fr; }

  .hero .container{ grid-template-columns: 1fr; }
  .hero-crest-wm{ display:none; }
  .hero-actions{ gap:12px; }

  .pillar-grid{ grid-template-columns: repeat(2,1fr); }
  .feature-row, .feature-row.reverse{ grid-template-columns: 1fr; gap:32px; }
  .feature-row.reverse .feature-media{ order:0; }
  .feature-media{ aspect-ratio: 16/9; }

  .footer-grid{ grid-template-columns: 1fr 1fr; }
  .people-grid{ grid-template-columns: repeat(2,1fr); }
  .stat-strip{ grid-template-columns: repeat(2,1fr); row-gap:24px; }
  .facility-grid{ grid-template-columns: repeat(2,1fr); }
  .benefit-strip{ grid-template-columns: repeat(2,1fr); }
}

/* ---- 740px — large phones / small tablets ---- */
@media (max-width: 740px){
  .utility-left span.sep{ display:none; }
  .utility-bar .container{ gap:10px; }

  .values-grid{ grid-template-columns: repeat(2, 1fr); }
  .profile-grid{ grid-template-columns: 1fr; }

  .form-grid{ grid-template-columns: 1fr; }
  .value-grid{ grid-template-columns: 1fr; }
  .pillar-grid{ grid-template-columns: 1fr; }
  .promise-block{ grid-template-columns: 1fr; gap:14px; }
  .promise-mark{ font-size:48px; }
  .promise-block p{ font-size:19px; }

  .cta-band{ flex-direction:column; align-items:flex-start; }
  .cta-band .btn-gold{ width:100%; text-align:center; }

  .main-nav .container{ min-height:70px; }
  .subnav-wrap{ top: 71px; }
  .brand img{ height:44px; width:44px; }
  .brand-text .brand-name{ font-size:16px; }

  .dropdown-grid{ grid-template-columns: 1fr; }
}

/* ---- 480px — phones ---- */
@media (max-width: 480px){
  .utility-bar .utility-left{ display:none; }
  .utility-bar .container{ justify-content:center; }
  .lang-switch{ display:none; }
  .pioneer-cta{ font-size:11.5px; padding:6px 11px; }

  .footer-grid{ grid-template-columns: 1fr; }
  .footer-bottom{ flex-direction:column; align-items:flex-start; }

  .people-grid{ grid-template-columns: 1fr; }
  .stat-strip{ grid-template-columns: 1fr 1fr; }
  .facility-grid{ grid-template-columns: 1fr; }
  .benefit-strip{ grid-template-columns: 1fr; }

  .hero-actions{ flex-direction:column; align-items:stretch; }
  .hero-actions .btn{ width:100%; }
  .hero-grades{ gap:8px; }
  .grade-chip{ font-size:11.5px; padding:5px 11px; }

  .form-card{ padding: 18px; }
  .pioneer-card{ padding: 18px; }
  .promise-block{ padding: 18px; }
  .cta-band{ padding: 22px; }

  .person-avatar{ width:96px; height:96px; font-size:26px; }

  .brand-text .brand-sub{ display:none; }
  .nav-actions .btn-crimson{ display:none; }
  .brand-text .brand-name{ font-size:15px; }

  .btn{ padding: 12px 20px; font-size:14px; }

  .breadcrumb{ font-size:11.5px; }
}


/* Mobile nav panel */
.mobile-nav{
  display:none;
  position:fixed; inset:0 0 0 auto;
  width: min(340px, 86vw);
  height: 100vh;
  background: var(--navy);
  z-index: 900;
  padding: 24px;
  transform: translateX(100%);
  transition: transform .25s ease;
  overflow-y:auto;
}
.mobile-nav.open{ transform: translateX(0); display:block; }
.mobile-nav-head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:20px; }
.mobile-nav-close{ background:none; border:none; color:#fff; font-size:22px; }
.mobile-nav a, .mobile-nav button.m-toggle{
  display:flex; justify-content:space-between; align-items:center;
  width:100%; text-align:left;
  color: rgba(255,255,255,.9);
  padding: 14px 0;
  border-bottom: 1px solid rgba(255,255,255,.1);
  font-size:15px; font-weight:600;
  background:none; border-top:none; border-left:none; border-right:none;
}
.mobile-sub{ display:none; padding-left:14px; }
.mobile-sub.open{ display:block; }
.mobile-sub a{ font-size:13.5px; font-weight:500; color: rgba(255,255,255,.72); padding:10px 0; border-bottom:1px dashed rgba(255,255,255,.08);}
.mobile-scrim{
  display:none;
  position:fixed; inset:0; background: rgba(11,30,60,.5); z-index:850;
}
.mobile-scrim.open{ display:block; }

/* Homepage image slider */
.top-slider{ position:relative; height:clamp(320px,46vw,520px); overflow:hidden; background:var(--navy); }
.top-slides{ position:absolute; inset:0; }
.top-slide{ position:absolute; inset:0; background-size:cover; background-position:center; opacity:0; transition:opacity 1.4s ease; }
.top-slide.active{ opacity:1; }
.top-slide::before{ content:''; position:absolute; inset:0; background:linear-gradient(0deg,rgba(11,30,60,.88) 0%,rgba(11,30,60,.45) 45%,rgba(11,30,60,.15) 100%); }
.top-slide-copy{ position:absolute; left:0; right:0; bottom:0; padding:clamp(24px,5vw,52px) clamp(20px,6vw,64px) clamp(56px,8vw,76px); max-width:760px; color:#fff; }
.top-slide-copy .eyebrow.on-dark{ display:inline-block; margin-bottom:10px; }
.top-slide-copy h2{ color:#fff; font-size:clamp(24px,3.4vw,40px); margin:0 0 10px; line-height:1.15; }
.top-slide-copy h2 em{ font-style:normal; color:var(--gold-200); }
.top-slide-copy p{ color:rgba(255,255,255,.85); font-size:15.5px; max-width:56ch; margin:0; }
.top-slider-arrow{ position:absolute; top:50%; transform:translateY(-50%); width:44px; height:44px; border-radius:50%; border:1px solid rgba(255,255,255,.35); background:rgba(11,30,60,.4); color:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:3; }
.top-slider-arrow:hover,.top-slider-arrow:focus-visible{ background:rgba(185,146,79,.4); border-color:rgba(255,255,255,.6); }
.top-slider-arrow-prev{ left:18px; }.top-slider-arrow-next{ right:18px; }
.top-slider-dots{ position:absolute; right:clamp(20px,6vw,64px); bottom:22px; display:flex; gap:9px; z-index:3; }
.top-slider-dot{ width:10px; height:10px; border-radius:50%; border:1px solid rgba(255,255,255,.6); background:transparent; padding:0; cursor:pointer; transition:background .2s ease,width .2s ease; }
.top-slider-dot.active{ background:var(--gold-200); border-color:var(--gold-200); width:26px; border-radius:999px; }
@media (max-width:700px){ .top-slider-arrow{ width:36px; height:36px; }.top-slider-arrow-prev{ left:8px; }.top-slider-arrow-next{ right:8px; }.top-slider-dots{ display:none; } }

/* =========================================================
   FLOATING COMMUNICATION WIDGET
   Shared WhatsApp + Email contact controls.
   ========================================================= */
.communication-widget{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:1200;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:12px;
  font-family:Inter, sans-serif;
}
.communication-actions{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
}
.communication-button{
  width:54px;
  height:54px;
  border-radius:50%;
  border:0;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  text-decoration:none;
  box-shadow:0 8px 24px rgba(11,30,60,.22);
  transition:transform .2s ease, box-shadow .2s ease;
}
.communication-button:hover,
.communication-button:focus-visible{
  transform:translateY(-3px);
  box-shadow:0 12px 28px rgba(11,30,60,.28);
  outline:none;
}
.communication-button svg{ width:27px; height:27px; }
.communication-whatsapp{
  background:#25D366;
  color:#fff;
}
.communication-email{
  background:var(--crimson, #9C2530);
  color:#fff;
}
.communication-panel{
  width:min(370px, calc(100vw - 32px));
  background:#fff;
  border:1px solid rgba(11,30,60,.10);
  border-radius:18px;
  box-shadow:0 20px 55px rgba(11,30,60,.22);
  overflow:hidden;
  opacity:0;
  visibility:hidden;
  transform:translateY(12px) scale(.98);
  transform-origin:bottom right;
  transition:opacity .2s ease, visibility .2s ease, transform .2s ease;
}
.communication-panel.open{
  opacity:1;
  visibility:visible;
  transform:translateY(0) scale(1);
}
.communication-panel-head{
  position:relative;
  padding:20px 48px 16px 20px;
  background:var(--navy, #0B1E3C);
  color:#fff;
}
.communication-kicker{
  display:block;
  margin-bottom:5px;
  font-size:10px;
  font-weight:800;
  letter-spacing:.15em;
  opacity:.72;
}
.communication-panel-head h3{
  margin:0 0 5px;
  font-family:Fraunces, Georgia, serif;
  font-size:22px;
  line-height:1.2;
}
.communication-panel-head p{
  margin:0;
  font-size:12.5px;
  line-height:1.55;
  color:rgba(255,255,255,.78);
}
.communication-close{
  position:absolute;
  top:14px;
  right:14px;
  width:32px;
  height:32px;
  border:0;
  border-radius:50%;
  background:rgba(255,255,255,.10);
  color:#fff;
  font-size:22px;
  line-height:1;
  cursor:pointer;
}
.communication-form{
  padding:18px 20px 20px;
}
.communication-form label{
  display:block;
  margin:0 0 6px;
  color:var(--navy, #0B1E3C);
  font-size:12px;
  font-weight:700;
}
.communication-form input,
.communication-form textarea{
  width:100%;
  box-sizing:border-box;
  margin:0 0 13px;
  padding:11px 12px;
  border:1px solid #d9dee7;
  border-radius:9px;
  background:#fff;
  color:#1d2939;
  font:inherit;
  font-size:13px;
  transition:border-color .18s ease, box-shadow .18s ease;
}
.communication-form textarea{ resize:vertical; min-height:92px; }
.communication-form input:focus,
.communication-form textarea:focus{
  outline:none;
  border-color:var(--navy, #0B1E3C);
  box-shadow:0 0 0 3px rgba(11,30,60,.08);
}
.communication-submit{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border:0;
  border-radius:9px;
  padding:12px 15px;
  background:var(--crimson, #9C2530);
  color:#fff;
  font:700 13px Inter, sans-serif;
  cursor:pointer;
  transition:opacity .18s ease, transform .18s ease;
}
.communication-submit:hover{ opacity:.92; transform:translateY(-1px); }
.communication-submit:disabled{ opacity:.6; cursor:wait; transform:none; }
.communication-status{
  display:none;
  margin:10px 0 0;
  font-size:12px;
  line-height:1.45;
  font-weight:600;
}
.communication-status.show{ display:block; }
.communication-status.success{ color:#217346; }
.communication-status.error{ color:#9C2530; }
.communication-honeypot{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}

@media (max-width:600px){
  .communication-widget{ right:15px; bottom:15px; }
  .communication-button{ width:50px; height:50px; }
  .communication-button svg{ width:25px; height:25px; }
  .communication-panel{ width:min(370px, calc(100vw - 30px)); }
}


/* =========================================================
   AISL POLICIES & HANDBOOKS
   ========================================================= */
.policy-hero {
    padding: 72px 0 58px;
}
.policy-hero .container {
    max-width: 1180px;
    margin: 0 auto;
}
.policy-breadcrumb {
    font-size: 0.9rem;
    margin-bottom: 22px;
    opacity: .78;
}
.policy-breadcrumb a {
    text-decoration: none;
}
.policy-eyebrow {
    display: inline-block;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .12em;
    margin-bottom: 10px;
}
.policy-hero h1 {
    margin: 0 0 16px;
}
.policy-hero p {
    max-width: 760px;
    line-height: 1.75;
}
.policy-directory {
    padding: 30px 0 90px;
}
.policy-directory .container,
.policy-content-section .container {
    max-width: 1180px;
    margin: 0 auto;
}
.policy-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
}
.policy-group {
    padding: 28px;
    border: 1px solid rgba(0,0,0,.09);
    border-radius: 14px;
}
.policy-group h2 {
    margin-top: 0;
}
.policy-group p {
    line-height: 1.7;
}
.policy-group ul {
    margin: 18px 0 0;
    padding-left: 20px;
}
.policy-group li {
    margin: 10px 0;
}
.policy-group a {
    font-weight: 600;
    text-decoration: none;
}
.policy-layout {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 42px;
    padding-bottom: 90px;
}
.policy-info-card {
    align-self: start;
    position: sticky;
    top: 100px;
    padding: 24px;
    border: 1px solid rgba(0,0,0,.09);
    border-radius: 14px;
}
.policy-info-card h2 {
    margin-top: 0;
    font-size: 1.15rem;
}
.policy-info-card dl {
    margin: 18px 0;
}
.policy-info-card dt {
    font-size: .78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    margin-top: 14px;
}
.policy-info-card dd {
    margin: 4px 0 0;
}
.policy-download,
.policy-back {
    display: block;
    margin-top: 14px;
    text-decoration: none;
    font-weight: 700;
}
.policy-document {
    line-height: 1.8;
    overflow-wrap: anywhere;
}
.policy-document p {
    margin: 0 0 18px;
}
@media (max-width: 800px) {
    .policy-grid,
    .policy-layout {
        grid-template-columns: 1fr;
    }
    .policy-info-card {
        position: static;
    }
    .policy-hero {
        padding: 48px 0 36px;
    }
}

.policy-context-link {
    padding: 24px 0;
    border-top: 1px solid rgba(0,0,0,.08);
}
.policy-context-link .container {
    max-width: 1180px;
    margin: 0 auto;
}
.policy-context-link p {
    margin: 0 0 10px;
    line-height: 1.6;
}
.policy-context-link a {
    font-weight: 700;
    text-decoration: none;
}

/* Policy directory and detail pages */
.policy-category { margin-bottom: 46px; }
.policy-category:last-child { margin-bottom: 0; }
.policy-category-head { display:flex; justify-content:space-between; align-items:baseline; gap:16px; margin-bottom:16px; padding-bottom:10px; border-bottom:1px solid var(--line); }
.policy-category-head h3 { font-size:19px; margin:0; }
.policy-category-head span { font-size:12.5px; color:var(--ink-soft); }
.policy-card { background:#fff; border:1px solid var(--line); border-radius:10px; padding:24px; display:flex; flex-direction:column; gap:16px; box-shadow:var(--shadow-sm); transition:box-shadow .2s, transform .2s; }
.policy-card:hover { box-shadow:var(--shadow-md); transform:translateY(-2px); }
.policy-card-top { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.policy-card h4 { font-size:16.5px; margin:0; }
.policy-card h4 a { color:var(--navy); }
.policy-card h4 a:hover { color:var(--royal); }
.policy-num { background:var(--paper-raised); border-radius:20px; color:var(--ink-soft); font-size:11px; font-weight:700; letter-spacing:.04em; padding:5px 8px; white-space:nowrap; }
.policy-card p { font-size:13.5px; color:var(--ink-soft); margin:0; }
.policy-card-actions { display:flex; gap:10px; margin-top:6px; flex-wrap:wrap; }
.policy-card-actions a { font-size:13px; font-weight:700; }
.policy-card-actions .btn-ghost { padding:0; }
.policy-pdf-link { color:var(--royal); display:inline-flex; align-items:center; gap:5px; }
.policy-pdf-link:hover { color:var(--crimson); }
.policy-meta-bar { display:grid; grid-template-columns:repeat(4,1fr); gap:0; background:var(--paper-raised); border:1px solid var(--line); border-radius:10px; margin-bottom:40px; overflow:hidden; }
.policy-meta-item { font-size:13px; padding:18px; border-right:1px solid var(--line); }
.policy-meta-item:last-child { border-right:0; }
.policy-meta-item strong { color:var(--navy); display:block; font-size:10.5px; letter-spacing:.08em; margin-bottom:5px; text-transform:uppercase; }
.policy-meta-item span { color:var(--ink-soft); }
.policy-highlights { display:flex; flex-direction:column; gap:12px; margin:18px 0 0; }
.policy-highlights li { display:flex; gap:12px; align-items:flex-start; font-size:15px; }
.policy-highlights .ico { color:var(--crimson); font-weight:800; }
.policy-download-card { align-items:center; background:var(--navy); border-radius:10px; display:flex; gap:24px; justify-content:space-between; padding:28px 30px; }
.policy-download-card h3 { color:#fff; font-size:19px; margin-bottom:6px; }
.policy-download-card p { color:rgba(255,255,255,.78); font-size:13.5px; margin:0; max-width:46ch; }
.related-policy-box { align-items:center; background:var(--paper-raised); border:1px solid var(--line); border-radius:10px; display:flex; gap:24px; justify-content:space-between; margin-top:40px; padding:24px 28px; }
.related-policy-box h5 { color:var(--navy); font-size:15px; margin:0 0 3px; }
.related-policy-box p { color:var(--ink-soft); font-size:13px; margin:0; }
@media (max-width:700px) { .policy-meta-bar { grid-template-columns:repeat(2,1fr); } .policy-meta-item:nth-child(2) { border-right:0; } .policy-meta-item:nth-child(-n+2) { border-bottom:1px solid var(--line); } .policy-download-card,.related-policy-box { align-items:flex-start; flex-direction:column; } }
