/* ===== THEME CORE v2 (site-wide) ===== */
:root{
    --brand-primary:#f46f5d; --brand-primary-500:#f46f5d; --brand-primary-600:#ef6755; --brand-primary-700:#e65c49;
    --brand-primary-light:#ff9b8f;
    --brand-dark:#0a1334; --brand-ink:#0f172a; --brand-muted:#64748b; --brand-surface:#ffffff;
    --brand-border:rgba(2,6,23,.08); --brand-ring:rgba(244,111,93,.35);
    --grad-brand:linear-gradient(90deg,var(--brand-primary) 0%,var(--brand-primary-light) 100%);
    --grad-brand-dark:linear-gradient(90deg,var(--brand-dark) 0%,var(--brand-primary) 60%,var(--brand-dark) 100%);
    --shadow-soft:0 16px 48px rgba(2,6,23,.08); --shadow-med:0 22px 64px rgba(2,6,23,.12); --shadow-strong:0 40px 110px rgba(2,6,23,.4);
    /* legacy aliases */
    --coral:var(--brand-primary); --navy:var(--brand-dark); --ink:var(--brand-ink); --muted:var(--brand-muted); --bg:var(--brand-surface); --ring:var(--brand-ring);
  }
  
  *{box-sizing:border-box}
  html,body{margin:0;padding:0;font:16px/1.55 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,sans-serif;color:var(--brand-ink);background:var(--brand-surface)}
  .container{width:min(1200px,92%);margin-inline:auto}
  .section{padding:clamp(36px,6vw,80px) 0}
  .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
  
  h1,h2,h3,h4,h5,h6{
    background:var(--grad-brand-dark); -webkit-background-clip:text; background-clip:text; color:transparent;
    text-shadow:0 1px 18px rgba(244,111,93,.12);
  }
  a{color:var(--brand-primary);transition:color .2s} a:hover{color:var(--brand-primary-light)}
  button,.btn,.btn-cta{background:var(--grad-brand);color:#fff;border:0;box-shadow:var(--shadow-soft);transition:transform .12s,filter .15s,box-shadow .15s}
  button:hover,.btn:hover,.btn-cta:hover{filter:brightness(1.02);box-shadow:var(--shadow-med)}
  button:active,.btn:active,.btn-cta:active{transform:translateY(1px)}
  .btn-outline{border:1px solid color-mix(in srgb,var(--brand-primary) 40%,#0000);color:var(--brand-dark);background:transparent}
  .btn-outline:hover{background:color-mix(in srgb,var(--brand-primary) 8%,#fff);border-color:color-mix(in srgb,var(--brand-primary) 60%,#0000)}
  section{
    background:
      radial-gradient(1200px 600px at 10% -10%, color-mix(in srgb, var(--brand-primary) 8%, #0000) 0, transparent 60%),
      radial-gradient(900px 500px at 90% 110%, color-mix(in srgb, var(--brand-dark) 5%, #0000) 0, transparent 60%);
  }
  
  /* ===== Topbar + Navbar ===== */
  .topbar{background:var(--brand-primary);color:#fff;font-size:.95rem}
  .topbar__inner{display:flex;gap:16px;align-items:center;justify-content:space-between;padding:8px 0}
  .topbar__welcome{margin:0;text-align:center}
  .topbar__social{display:flex;align-items:center;gap:10px}
  .topbar__social .social{display:inline-flex;align-items:center;justify-content:center;color:#fff;opacity:.9;transition:opacity .2s}
  .topbar__social .social:hover{opacity:1}
  
  .header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid rgba(2,6,23,.06);transition:box-shadow .2s}
  .header.is-scrolled{box-shadow:var(--shadow-soft)}
  .nav{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:14px 0}
  .nav__logo img{height:44px;width:auto;display:block}
  .nav__toggle{display:none;appearance:none;background:transparent;border:0;cursor:pointer;padding:8px;margin-left:auto}
  .nav__toggle span{display:block;width:22px;height:2px;background:var(--brand-dark);margin:5px 0;transition:transform .2s,opacity .2s}
  .nav__menu{display:flex;justify-content:center}
  .menu{list-style:none;display:flex;align-items:center;gap:36px;margin:0;padding:0}
  .link{color:var(--brand-dark);text-decoration:none;font-weight:600;letter-spacing:.2px;padding:10px 2px;display:inline-flex;align-items:center;gap:6px;border-radius:6px}
  .link:hover{color:#111827}
  .link:focus-visible{outline:2px solid var(--brand-ring);outline-offset:3px}
  .has-dropdown{position:relative}
  .dropdown-toggle{background:transparent;border:0;cursor:pointer;font:inherit}
  .caret{transition:transform .2s}
  .has-dropdown.open .caret{transform:rotate(180deg)}
  .dropdown{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%);min-width:190px;background:#fff;border:1px solid rgba(2,6,23,.08);border-radius:12px;box-shadow:var(--shadow-soft);padding:8px;display:none}
  .has-dropdown:hover>.dropdown,.has-dropdown.open>.dropdown{display:block}
  .dropdown a{display:block;padding:10px 12px;border-radius:8px;color:var(--brand-ink);text-decoration:none;font-weight:500}
  .dropdown a:hover{background:rgba(244,111,93,.08)}
  .btn-cta{border-radius:12px;display:inline-flex;align-items:center;gap:8px;padding:12px 18px}
  @media (max-width:980px){
    .topbar__inner{flex-wrap:wrap;justify-content:center;gap:8px}
    .nav{grid-template-columns:auto auto}
    .btn-cta{display:none}
    .nav__toggle{display:inline-block}
    .nav__menu{grid-column:1 / -1;width:100%;display:none;background:#fff;border-top:1px solid rgba(2,6,23,.06)}
    .nav__menu.open{display:block}
    .menu{flex-direction:column;align-items:stretch;gap:0;padding:8px 0}
    .menu>li{padding:2px 14px}
    .hide-desktop{display:block}
    .has-dropdown>.dropdown{position:static;transform:none;border:0;box-shadow:none;padding:0;margin:6px 0 10px}

    /* Override: show "Menu" text instead of hamburger on mobile */
    .nav__toggle{width:auto;height:42px;padding:0 12px;gap:8px;display:inline-flex;align-items:center}
    .nav__toggle span{display:none !important}
    .nav__toggle::after{content:"Menu";font-weight:800;color:var(--brand-dark);letter-spacing:.4px}
  }

:root{
  --brand-primary:#f46f5d;
  --brand-primary-light:#ff9b8f;
  --brand-dark:#0a1334;
  --grad-brand:linear-gradient(90deg,#f46f5d,#ff9b8f);
  --brand-ring:rgba(244,111,93,.35);
  --brand-border:rgba(244,111,93,.25);
  --shadow-soft:0 16px 48px rgba(2,6,23,.08);
  --shadow-med:0 22px 64px rgba(2,6,23,.14);
}

/* Section header */
.leaders-head{ text-align:center; max-width:860px; margin:0 auto 18px; }
.leaders-head h2{
  margin:0 0 6px; font-size:clamp(28px,4.4vw,40px);
  background: linear-gradient(90deg, var(--brand-dark), var(--brand-primary) 60%, var(--brand-dark));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.leaders-head p{ color:#365486; margin:0; }

/* Frame grid */
.leader-frames{ display:grid; gap:16px; }
@media (min-width:920px){
  .leader-frames{ gap:18px; }
}

/* Single frame */
.lframe{
  background:#fff; border:1px solid var(--brand-border); border-radius:18px;
  box-shadow: var(--shadow-soft); padding:16px; display:grid; gap:16px; align-items:start;
  grid-template-columns: 9fr 11fr; position:relative; overflow:hidden;
}
.lmeta{ align-self:center; }
@media (max-width:880px){ .lmeta{ align-self:auto; } }
.lframe::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,.28) 30%, transparent 60%);
  transform: translateX(-120%); transition: transform .9s ease;
}
.lframe:hover{ border-color:var(--brand-ring); box-shadow:var(--shadow-med); }
.lframe:hover::after{ transform: translateX(120%); }

@media (max-width:880px){
  .lframe{ grid-template-columns: 1fr; }
}

/* Photo */
/* Leadership media as background for consistent sizing */
.lmedia{
  position:relative; border-radius:14px; overflow:hidden;
  aspect-ratio: 16/21;
  background-size:cover; background-position:center; background-repeat:no-repeat;
  box-shadow:0 10px 30px rgba(2,6,23,.15);
}
.lmedia img{ width:100%; height:100%; object-fit:cover; display:block; }
.lmedia.is-bg::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(to bottom, rgba(0,0,0,0) 40%, rgba(0,0,0,.28) 100%);
}
.lmedia.is-bg img{
  position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%);
  white-space:nowrap; border:0; padding:0; margin:-1px;
}

/* Right column content */
.lmeta h3{ margin:0 0 6px; font-size:clamp(22px,3vw,28px); color:#0a1334; }
.lrole{
  display:flex; align-items:center; gap:10px; margin:0 0 10px;
  color:#0a1334; font-weight:800; font-size:15.5px;
}
.lrole .ic{ color:#7c8aa5; }
.lbio{ color:#0f172a; line-height:1.7; }

/* Labeled blocks */
.lblock{ margin-top:12px; }
.lblock h4{ margin:0 0 8px; color:#0a1334; font-size:15px; display:flex; gap:8px; align-items:center; }
.lblock h4 .ic{ color:#f59e0b; }

/* Expertise tags */
.tags{ display:flex; flex-wrap:wrap; gap:8px; }
.tag{
  padding:6px 10px; border-radius:999px; font-size:12.5px; font-weight:700;
  background: color-mix(in srgb, var(--brand-primary) 10%, #fff);
  border:1px solid var(--brand-border); color:#0a1334;
}

/* Experience list */
.lxp{ list-style:none; margin:0; padding:0; display:grid; gap:6px; }
.lxp li{ display:flex; gap:10px; align-items:flex-start; color:#0f172a; }
.lxp li::before{ content:""; width:8px; height:8px; border-radius:50%; background:#10b981; margin-top:.5em; }

/* Education */
.edu p{ margin:0; color:#0f172a; }

/* Buttons */
.lactions{ display:flex; gap:10px; flex-wrap:wrap; margin-top:12px; }
.btn{
  display:inline-flex; align-items:center; gap:8px; border-radius:12px; padding:10px 14px;
  font-weight:800; border:0; cursor:pointer; text-decoration:none; transition: transform .06s, filter .15s;
}
.btn:active{ transform: translateY(1px); }
.btn--li{ background:#0a66c2; color:#fff; }
.btn--ct{ background: var(--grad-brand); color:#fff; box-shadow:0 8px 24px rgba(244,111,93,.25); }

/* Small icon */
.ic{ display:inline-grid; place-items:center; width:20px; height:20px; }

/* Reveal animation */
.reveal{ opacity:0; transform: translateY(10px); transition: opacity .5s ease, transform .5s ease; }
.reveal.is-visible{ opacity:1; transform: translateY(0); }



:root{
  --brand-primary:#f46f5d;
  --brand-primary-light:#ff9b8f;
  --brand-dark:#0a1334;
  --grad-brand:linear-gradient(90deg,#f46f5d,#ff9b8f);
  --brand-ring:rgba(244,111,93,.35);
  --brand-border:rgba(244,111,93,.25);
  --shadow-soft:0 16px 48px rgba(2,6,23,.08);
  --shadow-med:0 22px 64px rgba(2,6,23,.14);
}

.exec-head{ text-align:center; max-width:900px; margin:0 auto 18px; }
.exec-head h2{
  margin:0 0 6px; font-size:clamp(28px,4.6vw,40px);
  background: linear-gradient(90deg,var(--brand-dark),var(--brand-primary) 60%,var(--brand-dark));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.exec-head p{ color:#365486; margin:0; }

.exec-team{
  /* Light orange backdrop for the entire Executive Team section */
  background: color-mix(in srgb, var(--brand-primary) 10%, #fff);
}

.e-card{
  background:#fff; border:1px solid var(--brand-border); border-radius:18px;
  padding:16px; display:grid; gap:16px; align-items:start;
  grid-template-columns: 9fr 11fr; position:relative; overflow:hidden;
  box-shadow: var(--shadow-soft);
}
.e-body{ align-self:center; }
@media (max-width:880px){ .e-body{ align-self:auto; } }
.e-card + .e-card{ margin-top:16px; }
.e-card::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(120deg,transparent 0%, rgba(255,255,255,.28) 30%, transparent 60%);
  transform: translateX(-120%); transition: transform .9s ease;
}
.e-card:hover{ border-color:var(--brand-ring); box-shadow:var(--shadow-med); }
.e-card:hover::after{ transform: translateX(120%); }

@media (max-width:880px){ .e-card{ grid-template-columns: 1fr; } }

.e-media img{
  width:100%; aspect-ratio: 16/21; object-fit:cover; border-radius:14px; display:block;
  box-shadow:0 10px 30px rgba(2,6,23,.15);
}

/* Use media as a background container for better control and readability */
.e-media{
  position:relative; border-radius:14px; overflow:hidden;
  /* Keep same visual ratio as before */
  aspect-ratio: 16/21;
  background-size:cover; background-position:center; background-repeat:no-repeat;
  box-shadow:0 10px 30px rgba(2,6,23,.15);
}
.e-media.is-bg::after{
  content:""; position:absolute; inset:0;
  /* Subtle bottom gradient for text readability when content stacks */
  background:linear-gradient(to bottom, rgba(0,0,0,0) 40%, rgba(0,0,0,.28) 100%);
}
.e-media.is-bg img{
  /* Keep image for SEO/accessibility but remove from layout/visibility */
  position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%);
  white-space:nowrap; border:0; padding:0; margin:-1px;
}

.e-name{ margin:0 0 6px; font-size:clamp(22px,3vw,28px); color:#0a1334; }
.e-role{
  margin:0 0 10px; display:flex; gap:8px; align-items:center;
  color:#0a1334; font-weight:800; font-size:15.5px;
}
.e-role svg{ opacity:.7 }
.e-bio{ color:#0f172a; line-height:1.7; }

.e-block{ margin-top:12px; }
.e-block h4{ margin:0 0 8px; display:flex; gap:8px; align-items:center; color:#0a1334; font-size:15px; }
.tags{ display:flex; flex-wrap:wrap; gap:8px; }
.tag{
  padding:6px 10px; border-radius:999px; font-size:12.5px; font-weight:700;
  background: color-mix(in srgb, var(--brand-primary) 10%, #fff);
  border:1px solid var(--brand-border); color:#0a1334;
}
.list{ list-style:none; padding:0; margin:0; display:grid; gap:6px; color:#0f172a; }
.list li{ position:relative; padding-left:16px; }
.list li::before{
  content:""; position:absolute; left:0; top:.6em; width:8px; height:8px; border-radius:50%; background:#10b981;
}

.e-cta{ margin-top:12px; display:flex; gap:10px; flex-wrap:wrap; }
.btn-li{
  display:inline-flex; align-items:center; gap:8px; background:#0a66c2; color:#fff; text-decoration:none;
  font-weight:800; padding:10px 14px; border-radius:12px; transition: filter .15s, transform .06s;
  box-shadow:0 10px 26px rgba(10,102,194,.25);
}
.btn-li:hover{ filter:brightness(1.05) }
.btn-li:active{ transform: translateY(1px) }

.reveal{ opacity:0; transform: translateY(10px); transition: opacity .5s ease, transform .5s ease; }
.reveal.is-visible{ opacity:1; transform: translateY(0); }