/* ==========================================================================
   CETRAD Brand Design System — assets/css/cetrad.css
   Version 1.0.0 | WCAG AA compliant
   ========================================================================== */

/* ── Google Fonts are enqueued via wp_enqueue_scripts in functions.php ── */

*, *::before, *::after { box-sizing: border-box; }

:root {
  /* PRIMARY BRAND COLORS */
  --blue:          var(--wp--preset--color--primary-blue, #1FBDE3);
  --orange:        var(--wp--preset--color--primary-orange, #F89E24);
  --green:         var(--wp--preset--color--primary-green, #5BB947);

  /* BLUE TINTS */
  --blue-t1:       var(--wp--preset--color--blue-t1, #EBF9FD);
  --blue-t2:       var(--wp--preset--color--blue-t2, #C3ECFA);
  --blue-t3:       var(--wp--preset--color--blue-t3, #7DD8F1);

  /* BLUE SHADES */
  --blue-s1:       var(--wp--preset--color--blue-s1, #189EC1);
  --blue-s2:       var(--wp--preset--color--blue-s2, #0E6F87);
  --blue-s3:       var(--wp--preset--color--blue-s3, #073D4A);

  /* ORANGE TINTS & SHADES */
  --orange-t1:     var(--wp--preset--color--orange-t1, #FEF4E4);
  --orange-t2:     var(--wp--preset--color--orange-t2, #FDE2B0);
  --orange-s1:     var(--wp--preset--color--orange-s1, #D4861A);
  --orange-s2:     var(--wp--preset--color--orange-s2, #8C5610);

  /* GREEN TINTS & SHADES */
  --green-t1:      var(--wp--preset--color--green-t1, #EBF7E8);
  --green-t2:      var(--wp--preset--color--green-t2, #C1E5BA);
  --green-s1:      var(--wp--preset--color--green-s1, #4A9A39);
  --green-s2:      var(--wp--preset--color--green-s2, #2D5E22);

  /* KEPT NEUTRAL */
  --off-white:     var(--wp--preset--color--off-white, #F5F5F5);
  --white:         var(--wp--preset--color--white, #FFFFFF);

  /* SEMANTIC TEXT — consolidated WCAG AA palette */
  --text-primary:   var(--wp--preset--color--text-primary, #073D4A);  /* 10.7:1+ — headings, body copy */
  --text-secondary: var(--wp--preset--color--text-secondary, #5A5A57);  /* ~4.5:1  — secondary content, subheads */
  --text-muted:     var(--wp--preset--color--text-muted, #8A8780);  /* ~3.5:1  — captions, tertiary info */

  /* DEPRECATED (for backward compatibility — use consolidated vars above) */
  --text-dark:      var(--text-primary);
  --text-body:      var(--text-primary);
  --text-head:      var(--text-primary);
  --text-orange:    #8C5610;
  --text-green:     #2D5E22;

  --border:        rgba(31, 189, 227, .14);
  --border-2:      rgba(31, 189, 227, .28);

  --r:             6px;
  --r-md:          8px;
  --r-lg:          13px;
  --r-xl:          20px;
  --r-full:        9999px;
  --nav-h:         68px;

  --blue-dark:     var(--wp--preset--color--dark, #073D4A);
  --hero-overlay:  rgba(7, 61, 74, 0.68);

  /* BRAND GRADIENTS */
  --blue-gradient:   var(--wp--preset--gradient--blue-gradient, linear-gradient(135deg, #1FBDE3 0%, #0E6F87 100%));
  --orange-gradient: var(--wp--preset--gradient--orange-gradient, linear-gradient(135deg, #F89E24 0%, #D4861A 100%));

  /* SHADOW PRESETS */
  --sh-xs:         0 1px 4px rgba(7, 61, 74, 0.03);
  --sh-sm:         var(--wp--preset--shadow--sh-sm, 0 2px 14px rgba(7, 61, 74, .06));
  --sh-md:         var(--wp--preset--shadow--sh-md, 0 8px 40px rgba(7, 61, 74, .10));
  --sh-lg:         var(--wp--preset--shadow--sh-lg, 0 20px 64px rgba(7, 61, 74, .14));

  /* SPACING PRESETS */
  --space-xs:      var(--wp--preset--spacing--xs, 8px);
  --space-sm:      var(--wp--preset--spacing--sm, 16px);
  --space-md:      var(--wp--preset--spacing--md, 24px);
  --space-lg:      var(--wp--preset--spacing--lg, 36px);
  --space-xl:      var(--wp--preset--spacing--xl, 60px);

  /* FONT SIZE PRESETS */
  --fs-sm:         var(--wp--preset--font-size--small, 0.875rem);
  --fs-md:         var(--wp--preset--font-size--medium, 1rem);
  --fs-lg:         var(--wp--preset--font-size--large, 1.25rem);
  --fs-xl:         var(--wp--preset--font-size--x-large, 1.5rem);
  --fs-xxl:        var(--wp--preset--font-size--xx-large, 2rem);
  --fs-display:    var(--wp--preset--font-size--display, clamp(2.2rem, 4.5vw, 3.8rem));
  --fs-display-lg: var(--wp--preset--font-size--display-lg, clamp(3rem, 6vw, 5.5rem));

  /* Zero WordPress's default block gap — sections manage their own spacing via padding */
  --wp--style--block-gap: 0;
}

html  { scroll-behavior: smooth; }

/* Prevent WordPress block layout from adding margin between page sections */
.site-main.is-layout-flow > * + *,
.wp-block-group.is-layout-flow.site-main > * + * { margin-block-start: 0 !important; margin-block-end: 0 !important; }

/* Anchor targets clear the fixed nav */
[id] { scroll-margin-top: calc(var(--nav-h) + 16px); }

body  {
  font-family:  'Plus Jakarta Sans', sans-serif;
  background:   var(--off-white);
  color:        var(--text-dark);
  line-height:  1.65;
  overflow-x:   hidden;
  -webkit-font-smoothing: antialiased;
  /* Override WordPress inline block-gap so sections touch cleanly */
  --wp--style--block-gap: 0;
}

img  { max-width: 100%; height: auto; display: block; }
a    { color: var(--blue-s2); text-decoration: underline; text-underline-offset: 3px; }
a:hover { color: var(--text-orange); }

/* ── MATERIAL ICONS ── */
@font-face {
  font-family: 'Material Symbols Outlined';
  font-style:  normal;
  font-weight: 100 700;
  font-display: block;
  src: url('../fonts/material-symbols/kJEhBvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oFsI.woff2') format('woff2');
}
.ms {
  font-family: 'Material Symbols Outlined';
  font-weight: 300;
  font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 24;
  font-size:   inherit;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  vertical-align: middle;
  user-select: none;
}

/* ── LAYOUT ── */
.container {
  max-width: 1280px;
  margin:    0 auto;
  padding:   0 52px;
}
.container-narrow { max-width: 780px; margin: 0 auto; padding: 0 52px; }

section { padding: 88px 0; }

/* ── TYPOGRAPHY ── */
.eyebrow {
  display: flex; align-items: center; gap: 10px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 13px; letter-spacing: .16em; text-transform: uppercase;
  color: var(--text-orange); margin-bottom: 16px;
  font-weight: 600;
}
.eyebrow::before { content: ''; width: 26px; height: 2px; background: currentColor; flex-shrink: 0; border-radius: 1px; }

h1, h2, h3 { font-family: 'Cormorant Garamond', serif; }
h1, h2, h3, h4, h5, h6 { line-height: 1.1; }

h2.stitle {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(1.9rem, 3.2vw, 2.8rem);
  font-weight: 600; letter-spacing: -.02em;
  color: var(--text-head);
}
.sbody {
  font-size: 14.5px; line-height: 1.85; color: var(--text-body);
  font-weight: 300; margin-top: 14px; max-width: 560px;
}

/* ── BUTTONS ── */
.btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 12px 26px; border-radius: var(--r);
  font-size: 13px; font-weight: 600; font-family: inherit;
  text-decoration: none; letter-spacing: .02em;
  border: none; cursor: pointer;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease;
  min-height: 44px; min-width: 44px; justify-content: center;
  position: relative;
}
.btn .ms { font-size: 17px; }

.btn:hover {
  transform: translateY(-1px);
  box-shadow: var(--sh-sm);
}

.btn:active {
  transform: translateY(0);
}

/* Button Variants */
.btn-orange {
  background: var(--orange);
  color: var(--text-primary);
}
.btn-orange:hover {
  background: var(--orange-s1);
}

.btn-blue {
  background: var(--blue);
  color: var(--text-primary);
}
.btn-blue:hover {
  background: var(--blue-s1);
  color: #fff;
}

.btn-outline {
  background: transparent;
  color: var(--blue-s2);
  border: 2px solid var(--blue-s2);
}
.btn-outline:hover {
  background: var(--blue);
  color: #fff;
  border-color: var(--blue);
}

.btn-ghost {
  background: rgba(255,255,255,.12);
  color: rgba(255,255,255,.95);
  border: 1.5px solid rgba(255,255,255,.25);
}
.btn-ghost:hover {
  background: rgba(255,255,255,.22);
  border-color: rgba(255,255,255,.4);
  color: #fff;
}

.btn:focus-visible,
.btn-orange:focus-visible,
.btn-blue:focus-visible,
.btn-outline:focus-visible,
.btn-ghost:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(31,189,227,.3);
}

/* ── ARROW LINK ── */
.arrow-link {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; font-weight: 600; color: var(--blue-s2);
  text-decoration: none; border-bottom: 2px solid var(--border-2); padding-bottom: 3px;
  transition: gap .3s cubic-bezier(0.16, 1, 0.3, 1), color .3s ease, border-color .3s ease;
  position: relative;
}
.arrow-link:hover {
  gap: 12px;
  color: var(--text-orange);
  border-color: var(--text-orange);
}
.arrow-link .ms {
  font-size: 16px;
  transition: transform .3s cubic-bezier(0.16, 1, 0.3, 1);
}
.arrow-link:hover .ms {
  transform: translateX(2px);
}

/* ── TAGS ── */
.tag {
  display: inline-flex; align-items: center; gap: 4px;
  font-family: 'Plus Jakarta Sans', sans-serif; font-size: 9px;
  letter-spacing: .1em; text-transform: uppercase;
  padding: 3px 9px; border-radius: 4px;
}
.tag.blue   { background: white;   color: var(--blue-s2); }
.tag.orange { background: var(--orange-t1); color: var(--text-orange); }
.tag.green  { background: var(--green-t1);  color: var(--text-green); }
.tag.gray   { background: white;   color: var(--text-body); }

/* ── ANIMATIONS ── */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* DEPRECATED: Removed slideInUp and fadeInScale (decorative entrance animations)
   Use simple fadeIn for all page transitions instead. */

/* ── REVEAL ANIMATION ── */
.reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .6s cubic-bezier(0.16, 1, 0.3, 1), transform .6s cubic-bezier(0.16, 1, 0.3, 1);
}
.revealed {
  opacity: 1;
  transform: none;
}

/* ── GRIDS ── */
.g2 { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: start; }
.g3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  align-items: stretch;
}
.g4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }

/* ── CARD BASE ── */
.card {
  background: var(--white); border-radius: var(--r-lg);
  border: 1px solid var(--border);
  box-shadow: 0 2px 12px rgba(7, 61, 74, .08);
  overflow: hidden;
  transition: transform .3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow .3s cubic-bezier(0.16, 1, 0.3, 1), border-color .3s ease;
}
.card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(7, 61, 74, .15);
  border-color: var(--blue);
}
.card-body  { padding: 24px 26px; }

/* ── DARK SECTION ── */
.dark-sec { background: var(--blue-s3); }
.dark-sec h2.stitle { color: var(--blue); }
.dark-sec .sbody    { color: rgba(255,255,255,.75); }
.dark-sec .eyebrow  { color: var(--orange); }
.dark-sec .eyebrow::before { background: var(--orange); }

/* Links inside dark sections and heroes */
.dark-sec .arrow-link,
.page-hero .arrow-link,
.cta-banner-card .arrow-link,
.sb-cta .arrow-link {
  color: var(--blue-t3);
  border-bottom-color: rgba(125, 216, 241, 0.4);
}
.dark-sec .arrow-link:hover,
.page-hero .arrow-link:hover,
.cta-banner-card .arrow-link:hover,
.sb-cta .arrow-link:hover {
  color: var(--orange);
  border-bottom-color: var(--orange);
}

.dark-sec a:not(.btn):not(.arrow-link):not(.soc-btn),
.page-hero a:not(.btn):not(.arrow-link):not(.bc-nav a),
.cta-banner-card a:not(.btn):not(.arrow-link),
.sb-cta a:not(.btn):not(.arrow-link) {
  color: var(--blue-t3);
  text-decoration: underline;
  text-decoration-color: rgba(125, 216, 241, 0.4);
  text-underline-offset: 3px;
  transition: color 0.2s, text-decoration-color 0.2s;
}
.dark-sec a:not(.btn):not(.arrow-link):not(.soc-btn):hover,
.page-hero a:not(.btn):not(.arrow-link):not(.bc-nav a):hover,
.cta-banner-card a:not(.btn):not(.arrow-link):hover,
.sb-cta a:not(.btn):not(.arrow-link):hover {
  color: var(--orange);
  text-decoration-color: var(--orange);
}

/* ================================================================
   NAVIGATION — white background, logo shows clearly
   ================================================================ */
#cetrad-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 300;
  height: var(--nav-h); background: #fff;
  box-shadow: 0 1px 0 var(--border), var(--sh-sm);
  transition: box-shadow 0.2s ease;
}
#cetrad-nav.nav-scrolled {
  box-shadow: 0 1px 0 var(--border-2), var(--sh-md);
}
.nav-inner {
  display: flex; align-items: center; justify-content: space-between;
  height: 100%; padding: 0 52px;
  max-width: 1200px;
  margin: 0 auto;
}
.nav-brand { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.nav-brand-logo { display: flex; align-items: center; text-decoration: none; }
.nav-logo-img { display: block; height: 44px; width: auto; max-width: 180px; }
/* WP custom logo output (.wp-block-site-logo / .custom-logo-link) */
.nav-brand-logo .custom-logo-link,
.custom-logo-link { display: flex; align-items: center; }
.custom-logo-link img,
.custom-logo { display: block; height: 44px; width: auto; max-width: 180px; }
.nav-lm {
  width: 36px; height: 36px; border-radius: 7px; background: var(--blue);
  display: flex; align-items: center; justify-content: center;
  font-family: 'Cormorant Garamond', serif; font-weight: 700; font-size: 15px;
  color: #fff; flex-shrink: 0;
}
.nav-wm strong { display: block; font-size: 12.5px; font-weight: 700; color: var(--blue-s3); letter-spacing: .05em; }
.nav-wm span   { display: block; font-size: 9px; color: var(--orange); font-family: 'Plus Jakarta Sans', sans-serif; letter-spacing: .04em; }

.nav-links { display: flex; align-items: center; gap: 2px; }
.nav-a {
  font-size: 12px; font-weight: 500; color: var(--text-body); text-decoration: none;
  padding: 8px 12px; border-radius: var(--r); letter-spacing: .02em;
  display: flex; align-items: center; gap: 4px; cursor: pointer;
  transition: color .18s, background .18s;
}
.nav-a:hover {
  color: var(--blue-s3);
  background: var(--blue-t1);
}
.nav-a.current-menu-item {
  color: var(--blue-s3);
  background: var(--blue-t2);
  font-weight: 600;
}

/* Dropdown */
.nav-drop { position: relative; }
.nav-drop .ms { font-size: 14px; opacity: .5; }
.nav-drop:hover > .dropdown,
.nav-drop:focus-within > .dropdown { display: block; }
.dropdown {
  display: none; position: absolute; top: calc(100% + 4px); left: 0;
  background: #fff; border: 1px solid var(--border-2); border-radius: var(--r-lg);
  min-width: 230px; padding: 8px; box-shadow: var(--sh-lg); z-index: 400;
}
.dropdown a {
  display: block; font-size: 12px; color: var(--text-body); text-decoration: none;
  padding: 8px 12px; border-radius: var(--r); white-space: nowrap;
  transition: background .15s, color .15s;
}
.dropdown a:hover {
  color: var(--blue-s3);
  background: var(--blue-t1);
}
.dropdown a.current-menu-item {
  color: var(--blue-s3);
  background: var(--blue-t2);
  font-weight: 600;
}
.dd-sep { height: 1px; background: var(--border); margin: 6px 0; }

.nav-cta {
  background: var(--orange) !important; color: var(--text-dark) !important;
  font-weight: 600 !important; margin-left: 8px;
  padding: 8px 18px !important; border-radius: var(--r) !important;
}
.nav-cta:hover { background: var(--orange-s1) !important; }

/* Hamburger (mobile) */
.nav-toggle {
  display: none; background: none; border: none; cursor: pointer;
  padding: 8px; color: var(--text-dark);
}
.nav-toggle .ms { font-size: 26px; }

/* ================================================================
   PAGE HERO (inner pages)
   ================================================================ */
.page-hero { padding-top: var(--nav-h); background: var(--blue-s3); position: relative; overflow: hidden; }
.page-hero::before {
  content: ''; position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(31,189,227,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(31,189,227,.04) 1px, transparent 1px);
  background-size: 52px 52px; pointer-events: none;
}
.page-hero-inner { position: relative; z-index: 2; padding-top: 56px; padding-bottom: 64px; }
.page-hero .eyebrow  { color: var(--orange); }
.page-hero .eyebrow::before { background: var(--orange); }
.page-hero h1 {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(2.4rem, 4.5vw, 4rem);
  font-weight: 600; line-height: 1.08; letter-spacing: -.025em;
  color: var(--blue); margin-bottom: 14px;
}
.page-hero p { font-size: 15px; color: rgba(255,255,255,.75); font-weight: 300; line-height: 1.8; max-width: 540px; }

/* ── Department Hero Metadata ── */
.dept-hero-meta {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 20px;
  flex-wrap: wrap;
}
.dept-hero-meta-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: var(--orange);
  background: rgba(248, 158, 36, 0.08);
  border: 1px solid rgba(248, 158, 36, 0.15);
  padding: 6px 14px;
  border-radius: 20px;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  white-space: nowrap;
}
.dept-hero-meta-item .ms {
  font-size: 16px;
  color: var(--orange);
}

.page-hero.pub-page h1 { font-size: clamp(1.75rem, 3.5vw, 2.8rem); max-width: 860px; color: #fff; }

/* Breadcrumb */
.bc-nav {
  display: flex; align-items: center; gap: 7px; margin-bottom: 22px;
  font-family: 'Plus Jakarta Sans', sans-serif; font-size: 10px;
  letter-spacing: .06em; text-transform: uppercase; color: rgba(255,255,255,.4);
}
.bc-nav a { color: rgba(255,255,255,.4); text-decoration: none; }
.bc-nav a:hover { color: var(--blue-t2); }
.bc-nav .ms { font-size: 13px; }

/* ================================================================
   HOMEPAGE HERO
   ================================================================ */
#cetrad-hero {
  min-height: 100vh; padding-top: var(--nav-h);
  display: grid; grid-template-columns: 1fr 1fr;
  position: relative; overflow: hidden;
  background: var(--blue-s3);
}
.hero-content-inner {
  position: relative;
  z-index: 5;
}
.hero-content-inner-media {
  width: 100%;
  max-width: 740px;
  margin: 0 auto;
  text-align: center;
}
.hero-l {
  background: var(--blue-s3);
  padding: 88px 72px 88px 88px;
  display: flex; flex-direction: column; justify-content: center;
  position: relative;
}
.hero-l::before {
  content: ''; position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(31,189,227,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(31,189,227,.04) 1px, transparent 1px),
    radial-gradient(circle at 80% 20%, rgba(31, 189, 227, .08) 0%, transparent 50%);
  background-size: 52px 52px, 52px 52px, 100% 100%;
  pointer-events: none;
}
.hero-kicker {
  display: flex; align-items: center; gap: 10px; margin-bottom: 26px;
  font-family: 'Plus Jakarta Sans', sans-serif; font-size: 12px;
  letter-spacing: .18em; text-transform: uppercase; color: var(--orange);
  font-weight: 600;
}
.hero-kicker::before {
  content: ''; width: 26px; height: 2px; background: currentColor;
  border-radius: 1px;
}
.hero-h1 {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(3rem, 5.2vw, 5rem); font-weight: 600;
  line-height: 1.07; letter-spacing: -.025em;
  color: #fff; margin-bottom: 20px;
}
.hero-h1 em { font-style: italic; color: var(--orange); }
.hero-p {
  font-size: 14.5px; font-weight: 300;
  color: rgba(255,255,255,.75); line-height: 1.8;
  max-width: 410px; margin-bottom: 36px;
}
.hero-btns {
  display: flex; gap: 12px; flex-wrap: wrap;
}
.hero-stats {
  margin-top: 52px; padding-top: 26px;
  border-top: 1px solid rgba(31,189,227,.15);
  display: flex; gap: 36px;
}
.hs-n {
  font-family: 'Cormorant Garamond', serif;
  font-size: 2.4rem; font-weight: 600; color: var(--blue);
  line-height: 1;
  transition: transform .3s cubic-bezier(0.16, 1, 0.3, 1), color .3s ease;
}
.hs-l {
  font-size: 12px; font-family: 'Plus Jakarta Sans', sans-serif;
  color: rgba(255,255,255,.6);
  text-transform: uppercase; letter-spacing: .06em;
  margin-top: 5px; font-weight: 500;
}

/* Hero right panel */
.hero-r { position: relative; background: white; overflow: hidden; display: flex; align-items: center; justify-content: center; }
.hero-r > .topo { position: absolute; inset: 0; width: 100%; height: 100%; }
/* Enhanced topographic animations */
@keyframes topoFlow {
  0% { stroke-dashoffset: 0; }
  100% { stroke-dashoffset: 60; }
}
@keyframes pulseCircle {
  0%, 100% { r: 14px; opacity: .5; }
  50% { r: 18px; opacity: .2; }
}
@keyframes topoGlow {
  0%, 100% { opacity: .4; }
  50% { opacity: .8; }
}

/* ACCESSIBILITY: Respect user motion preferences */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  .hero-bg-video,
  .hero-media-wrapper iframe {
    display: none !important;
  }
}

.hero-r > .topo {
}
.hero-r > .topo path {
  animation: topoFlow 25s linear infinite;
  stroke: url(#pathGradient);
}
.hero-r > .topo .topo-accent-lg {
  animation: pulseCircle 3s cubic-bezier(0.16, 1, 0.3, 1) infinite;
}
.hero-cards {
  position: relative; z-index: 2;
  padding: 60px 52px;
  display: flex; flex-direction: column; gap: 18px;
  width: 100%;
  max-width: 380px;
}
.hc {
  background: rgba(255,255,255,.95); backdrop-filter: blur(12px);
  border: 1.5px solid rgba(31,189,227,.2); border-radius: var(--r-lg);
  padding: 24px; display: flex; gap: 16px; align-items: flex-start;
  box-shadow: 0 8px 28px rgba(0, 0, 0, .12);
  transition: transform .3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow .3s cubic-bezier(0.16, 1, 0.3, 1), border-color .3s cubic-bezier(0.16, 1, 0.3, 1);
}
.hc:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 40px rgba(0, 0, 0, .16);
  border-color: var(--blue);
}
.hc-ico {
  width: 48px; height: 48px; border-radius: 12px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 24px;
  transition: transform .3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow .3s ease;
}
.hc-ico.b { background: white; color: var(--blue-s2); box-shadow: 0 4px 12px rgba(31, 189, 227, .15); }
.hc-ico.o { background: var(--orange-t1); color: var(--text-orange); box-shadow: 0 4px 12px rgba(248, 158, 36, .15); }
.hc-ico.g { background: var(--green-t1); color: var(--text-green); box-shadow: 0 4px 12px rgba(91, 185, 71, .15); }
.hc:hover .hc-ico {
  transform: scale(1.15) rotate(5deg);
}
.hc h2, .hc h4 {
  font-size: 14px; font-weight: 700;
  color: var(--text-dark);
  margin-bottom: 6px;
  line-height: 1.3;
}
.hc p {
  font-size: 13px; color: var(--text-body);
  line-height: 1.65;
  font-weight: 400;
}

/* Full-bleed media mode — single column, right panel hidden, content centred */
#cetrad-hero.hero-has-media { grid-template-columns: 1fr; }
.hero-has-media .hero-l {
  background: transparent;
  padding: 100px 80px;
  align-items: center;   /* centre the flex child (the inner div) horizontally */
}
.hero-has-media .hero-l::before { opacity: 0.15; }
.hero-has-media .hero-l > div {
  width: 100%;
  max-width: 740px;
  margin: 0 auto;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;   /* centre ALL block children, not just inline text */
}
.hero-has-media .hero-kicker {
  justify-content: center;
  text-align: center;
}
.hero-has-media .hero-kicker::before { display: none; } /* hide side-line in centred mode */
.hero-has-media .hero-h1 {
  text-align: center;
  width: 100%;
}
.hero-has-media .hero-p {
  text-align: center;
  max-width: 560px;
  margin-left: auto;
  margin-right: auto;
}
.hero-has-media .hero-btns { justify-content: center; }
.hero-has-media .hero-stats { justify-content: center; }
.hero-has-media .hero-r { display: none; }

/* ================================================================
   STATS BAND
   ================================================================ */
.stats-band { background: transparent; padding: 0; position: relative; z-index: 10; }
@media (min-width: 769px) {
  .stats-band { margin-top: -64px; margin-bottom: 24px; }
}
.band-row {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 1px;
  background: rgba(255, 255, 255, 0.08);
  border: 1.5px solid rgba(31, 189, 227, 0.15);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  border-radius: var(--r-lg);
  box-shadow: 0 20px 60px rgba(0, 0, 0, .15);
  overflow: hidden;
}
.bc-stat {
  background: rgba(7, 61, 74, 0.92);
  padding: 38px 24px;
  text-align: center;
  transition: background .3s cubic-bezier(0.16, 1, 0.3, 1), transform .3s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
}
.bc-stat::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(31, 189, 227, .1) 0%, transparent 100%);
  opacity: 0;
  transition: opacity .3s ease;
}
.bc-stat:hover {
  background: rgba(7, 61, 74, 0.85);
  transform: translateY(-3px);
}
.bc-stat:hover::before { opacity: 1; }
.bc-i  { font-size: 19px; color: var(--blue); margin-bottom: 8px; display: block; }
.bc-n  { font-family: 'Cormorant Garamond', serif; font-size: 2.4rem; font-weight: 600; color: var(--blue); line-height: 1; }
.bc-l  { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 9.5px; text-transform: uppercase; letter-spacing: .1em; color: rgba(255,255,255,.55); margin-top: 6px; }

/* ================================================================
   ABOUT PAGE — THRUST AREAS GRID
   ================================================================ */
.thrust-grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 1px; background: var(--border);
  border-radius: var(--r-xl); border: 1px solid var(--border); overflow: hidden; margin-top: 44px;
}
.thrust-panel {
  padding: 36px 26px; position: relative;
}
.thrust-accent {
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
}
.thrust-icon {
  font-size: 24px; margin-bottom: 16px; display: block;
}
.thrust-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.15rem; font-weight: 600; margin-bottom: 10px; line-height: 1.25;
}
.thrust-body {
  font-size: 12.5px; line-height: 1.75;
}

/* ================================================================
   SERVICE CARDS (What We Do)
   ================================================================ */
.svc-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 48px; }
.svc {
  background: var(--white); border-radius: var(--r-lg);
  padding: 36px 32px; position: relative; overflow: hidden;
  border: 1px solid var(--border);
  box-shadow: 0 2px 12px rgba(7, 61, 74, .06);
  transition: transform .3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow .3s cubic-bezier(0.16, 1, 0.3, 1), border-color .3s cubic-bezier(0.16, 1, 0.3, 1);
}
.svc::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0;
  height: 4px; border-radius: var(--r-lg) var(--r-lg) 0 0;
}
.svc:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 40px rgba(7, 61, 74, .12);
}
.svc:nth-child(1):hover, .svc:nth-child(4):hover { border-color: var(--blue); }
.svc:nth-child(2):hover, .svc:nth-child(5):hover { border-color: var(--orange); }
.svc:nth-child(3):hover, .svc:nth-child(6):hover { border-color: var(--green); }
.svc:nth-child(1)::before, .svc:nth-child(4)::before { background: linear-gradient(90deg, var(--blue) 0%, var(--blue-s1) 100%); }
.svc:nth-child(2)::before, .svc:nth-child(5)::before { background: linear-gradient(90deg, var(--orange) 0%, var(--orange-s1) 100%); }
.svc:nth-child(3)::before, .svc:nth-child(6)::before { background: linear-gradient(90deg, var(--green) 0%, var(--green-s1) 100%); }
.svc-ico { width: 44px; height: 44px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 22px; margin-bottom: 18px; }
.svc:nth-child(1) .svc-ico, .svc:nth-child(4) .svc-ico { background: white;   color: var(--blue-s2); }
.svc:nth-child(2) .svc-ico, .svc:nth-child(5) .svc-ico { background: var(--orange-t1); color: var(--text-orange); }
.svc:nth-child(3) .svc-ico, .svc:nth-child(6) .svc-ico { background: var(--green-t1);  color: var(--text-green); }
.svc h3 { font-family: 'Cormorant Garamond', serif; font-size: 1.25rem; font-weight: 600; color: var(--text-dark); line-height: 1.3; margin-bottom: 8px; }
.svc p  { font-size: 13px; color: var(--text-body); line-height: 1.75; }
.svc-link { margin-top: 18px; display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; font-weight: 500; text-decoration: none; padding-bottom: 2px; transition: all .2s; }
.svc:nth-child(1) .svc-link, .svc:nth-child(4) .svc-link { color: var(--blue-s2); border-bottom: 1px solid var(--border-2); }
.svc:nth-child(2) .svc-link, .svc:nth-child(5) .svc-link { color: var(--text-orange); border-bottom: 1px solid rgba(140,86,16,.25); }
.svc:nth-child(3) .svc-link, .svc:nth-child(6) .svc-link { color: var(--text-green); border-bottom: 1px solid rgba(45,94,34,.25); }
.svc-link:hover { gap: 10px; opacity: .8; }
.svc-link .ms { font-size: 14px; }

/* ================================================================
   ARTICLES SECTION FILTERS & GRID
   ================================================================ */
.articles-section {
  background: var(--white);
  padding: 60px 0;
}

.articles-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 32px;
  flex-wrap: wrap;
  gap: 16px;
}

.articles-header .stitle {
  margin-bottom: 0;
}

.articles-filters {
  display: flex;
  gap: 12px;
  margin-bottom: 32px;
  flex-wrap: wrap;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--border);
}

.articles-filter-form {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.filter-select {
  padding: 8px 12px;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  font-size: 13px;
  background: white;
  cursor: pointer;
  color: var(--text-primary);
  transition: border-color 0.2s ease;
}

.filter-select:hover,
.filter-select:focus {
  border-color: var(--blue);
  outline: none;
}

.clear-filters-link {
  font-size: 13px;
  color: var(--blue);
  text-decoration: none;
  margin-left: auto;
  padding: 8px 12px;
  transition: opacity 0.2s ease;
}

.clear-filters-link:hover {
  opacity: 0.8;
}

.articles-grid {
  margin-bottom: 40px;
}

.pagination-wrapper {
  display: flex;
  justify-content: center;
  gap: 8px;
  align-items: center;
  margin-top: 32px;
}

.pagination-link {
  padding: 8px 12px;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  font-size: 13px;
  text-decoration: none;
  color: var(--text-body);
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.pagination-link:hover {
  border-color: var(--blue);
  color: var(--blue);
}

.pagination-link.is-current {
  background: var(--blue);
  color: white;
  border-color: var(--blue);
}

.articles-no-results {
  text-align: center;
  padding: 40px;
}

.articles-no-results p {
  color: var(--text-muted);
  font-size: 15px;
}

.latest-news-section {
  background: white;
  padding: 60px 0;
}

.latest-news-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 40px;
  flex-wrap: wrap;
  gap: 16px;
}

/* ================================================================
   PUBLICATIONS SECTION
   ================================================================ */
.publications-section {
  background: var(--green-t1);
  padding: 60px 0;
}

.publications-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 36px;
}

.publication-card-body {
  display: flex;
  align-items: center;
  gap: 18px;
  text-decoration: none;
  color: inherit;
}

.publication-icon-box {
  background: white;
  color: var(--blue-s2);
  flex-shrink: 0;
  border-radius: var(--r);
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.publication-content {
  flex: 1;
  min-width: 0;
}

.publication-type-tag {
  font-size: 9.5px;
  display: inline-block;
  margin-bottom: 12px;
}

.publication-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  font-size: 11.5px;
  color: var(--text-muted);
  font-family: 'DM Mono', monospace;
  margin-top: 6px;
  align-items: center;
}

.publication-download {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--blue-s2);
}

.publication-download .ms {
  font-size: 13px;
}

.publication-arrow {
  font-size: 20px;
  color: var(--text-muted);
  margin-left: auto;
  flex-shrink: 0;
}

.publications-empty {
  margin-top: 36px;
}

.publications-empty .card-body {
  text-align: center;
}

.publication-empty-icon {
  font-size: 24px;
  margin-bottom: 14px;
  display: block;
}

.publications-empty p {
  font-size: 13px;
  color: var(--text-body);
  line-height: 1.65;
  margin: 0;
}

.publications-button-wrapper {
  margin-top: 28px;
  display: flex;
  justify-content: center;
}

/* ================================================================
   NEWS / POST CARDS
   ================================================================ */
.post-card-link {
  text-decoration: none;
  display: flex;
  color: inherit;
  width: 100%;
}

.post-card {
  background: var(--white);
  border-radius: 16px;
  border: 1px solid rgba(7, 61, 74, 0.05);
  box-shadow: 0 4px 20px -2px rgba(7, 61, 74, 0.04), 0 2px 6px -1px rgba(7, 61, 74, 0.02);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.4s ease;
  position: relative;
}

.post-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 32px -8px rgba(7, 61, 74, 0.12), 0 4px 12px -2px rgba(7, 61, 74, 0.04);
  border-color: rgba(31, 189, 227, 0.25);
}

.post-card-featured {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 10;
  background: var(--orange);
  color: var(--text-primary);
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  padding: 4px 10px;
  border-radius: 6px;
  box-shadow: 0 2px 10px rgba(7, 61, 74, 0.15);
}

.post-card-thumb {
  position: relative;
  aspect-ratio: 16/10;
  overflow: hidden;
  background: var(--blue-s3);
  display: block;
  border-bottom: 1px solid rgba(7, 61, 74, 0.02);
}

.post-card-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.post-card-thumb::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(7, 61, 74, 0.15) 0%, transparent 100%);
  opacity: 0.5;
  transition: opacity 0.3s ease;
  pointer-events: none;
}

.post-card:hover .post-card-thumb img {
  transform: scale(1.06);
}

.post-card:hover .post-card-thumb::after {
  opacity: 0.8;
}

.post-card-thumb-fallback {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.25);
  background: linear-gradient(135deg, var(--blue-s3) 0%, var(--blue-s2) 100%);
  min-height: 180px;
}

.post-card-thumb-fallback .ms {
  font-size: 44px;
}

.post-card-body {
  padding: 24px;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.post-card-header {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  width: 100%;
  margin-bottom: 12px;
}

.post-card-cat {
  position: absolute;
  top: 16px;
  left: 16px;
  z-index: 10;
  display: inline-flex;
  align-items: center;
}

.post-card-cat .art-cat {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .06em;
  padding: 4px 12px;
  border-radius: 100px;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.6);
  color: var(--blue-s3);
  text-decoration: none;
  box-shadow: 0 4px 12px rgba(7, 61, 74, 0.08);
  transition: background-color 0.25s, border-color 0.25s, color 0.25s, transform 0.25s;
}

.post-card-cat .art-cat:hover {
  background: var(--white);
  border-color: var(--white);
  color: var(--blue-s2);
  transform: translateY(-1px);
}

.post-card-cat .art-cat-icon {
  font-size: 12px;
  color: var(--blue-s1);
  margin-top: -1px;
}

.post-card-readtime {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 11px;
  color: var(--text-muted);
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.post-card-readtime .ms {
  font-size: 13px;
  color: var(--blue-s1);
  opacity: 0.7;
}

.post-card-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.45rem;
  font-weight: 600;
  margin: 0 0 12px 0;
  line-height: 1.35;
}

.post-card-title a {
  color: var(--text-primary);
  text-decoration: none;
  transition: color 0.25s ease;
}

.post-card-main-link::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
}

.post-card:hover .post-card-title a {
  color: var(--blue-s2);
}

.post-card-excerpt {
  font-size: 14px;
  color: var(--text-secondary);
  line-height: 1.6;
  margin-bottom: 24px;
  font-weight: 400;
  flex: 1;
}

.post-card-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid rgba(7, 61, 74, 0.05);
  padding-top: 16px;
  margin-top: auto;
}

.post-card-author {
  display: flex;
  align-items: center;
  gap: 12px;
  position: relative;
  z-index: 2;
}

.post-card-author .art-avatar {
  width: 32px;
  height: 32px;
  font-size: 11px;
  border-radius: 50%;
  background: var(--blue-t1);
  color: var(--blue-s2);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  flex-shrink: 0;
  border: 2px solid var(--white);
  box-shadow: 0 0 0 1px rgba(7, 61, 74, 0.08);
  overflow: hidden;
}

.post-card-author .art-avatar img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
}

.post-card-author-info {
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.post-card-author-name {
  font-size: 12.5px;
  color: var(--text-primary);
  font-weight: 600;
  line-height: 1.2;
}

.post-card-date {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 11px;
  color: var(--text-muted);
  font-weight: 400;
  display: inline-block;
}

.post-card-arrow {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--blue-t1);
  color: var(--blue-s2);
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(31, 189, 227, 0.1);
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  flex-shrink: 0;
}

.post-card-arrow .ms {
  font-size: 16px;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.post-card:hover .post-card-arrow {
  background: var(--blue-s2);
  color: var(--white);
  border-color: var(--blue-s2);
}

.post-card:hover .post-card-arrow .ms {
  transform: translateX(2px);
}

/* Compact / Compressed style variant */
.post-card-compact .post-card-thumb {
  aspect-ratio: 21/9;
}
.post-card-compact .post-card-body {
  padding: 16px 20px;
}
.post-card-compact .post-card-header {
  margin-bottom: 8px;
}
.post-card-compact .post-card-title {
  font-size: 1.2rem;
  margin-bottom: 8px;
}
.post-card-compact .post-card-excerpt {
  font-size: 13.5px;
  margin-bottom: 16px;
  line-height: 1.5;
}
.post-card-compact .post-card-footer {
  padding-top: 12px;
}
.post-card-compact .post-card-author .art-avatar {
  width: 28px;
  height: 28px;
}
.post-card-compact .post-card-author-name {
  font-size: 12px;
}
.post-card-compact .post-card-arrow {
  width: 28px;
  height: 28px;
}
.post-card-compact .post-card-arrow .ms {
  font-size: 14px;
}

/* Mobile responsive */
@media (max-width: 640px) {
  .post-card-body {
    padding: 20px;
  }
  .post-card-title {
    font-size: 1.3rem;
  }
  .post-card-excerpt {
    font-size: 13.5px;
    margin-bottom: 20px;
  }
}

/* ================================================================
   SINGLE ARTICLE / BLOG POST
   ================================================================ */
.art-hero { padding-top: var(--nav-h); background: var(--blue-s3); position: relative; overflow: hidden; }
.art-hero::before { content: ''; position: absolute; inset: 0; background-image: linear-gradient(rgba(31,189,227,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(31,189,227,.04) 1px, transparent 1px); background-size: 52px 52px; pointer-events: none; }
.art-hero-inner { position: relative; z-index: 2; padding-top: 52px; }
.art-cats { display: flex; gap: 8px; margin-bottom: 18px; flex-wrap: wrap; }
.art-cat { display: inline-flex; align-items: center; gap: 5px; font-family: 'Plus Jakarta Sans', sans-serif; font-size: 9px; letter-spacing: .12em; text-transform: uppercase; padding: 4px 10px; border-radius: 4px; border: 1px solid rgba(31,189,227,.3); color: var(--blue-t2); text-decoration: none; transition: all .2s; }
.art-cat:hover { background: rgba(31,189,227,.1); border-color: var(--blue); color: var(--blue-t2); }
.art-title { font-family: 'Cormorant Garamond', serif; font-size: clamp(2.2rem, 4.5vw, 3.8rem); font-weight: 600; line-height: 1.1; letter-spacing: -.025em; color: #fff; max-width: 960px; margin-bottom: 24px; }
.art-byline { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; padding-bottom: 36px; }
.art-author { display: flex; align-items: center; gap: 10px; }
.art-avatar { width: 36px; height: 36px; border-radius: 50%; background: var(--blue); display: flex; align-items: center; justify-content: center; font-family: 'Cormorant Garamond', serif; font-weight: 700; font-size: 14px; color: #fff; flex-shrink: 0; overflow: hidden; transform: translateZ(0); -webkit-mask-image: -webkit-radial-gradient(white, black); }
.art-avatar img { width: 100%; height: 100%; object-fit: cover; image-rendering: -webkit-optimize-contrast; transform: translateZ(0); }
.art-author-name { font-size: 13px; font-weight: 500; color: rgba(255,255,255,.85); }
.art-author-role { font-size: 11px; color: rgba(255,255,255,.45); font-family: 'Plus Jakarta Sans', sans-serif; }
.art-date, .art-read { font-size: 12px; color: rgba(255,255,255,.55); font-family: 'Plus Jakarta Sans', sans-serif; display: flex; align-items: center; gap: 6px; }
.art-date .ms, .art-read .ms { font-size: 15px; color: var(--blue-t3); }

/* Cover image */
.art-cover { position: relative; background: var(--blue-s3); overflow: hidden; }
.art-cover img { width: 100%; aspect-ratio: 21/9; object-fit: cover; display: block; }
.art-cover-cap {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 24px 52px 20px;
  background: linear-gradient(to top, rgba(7, 61, 74, 0.9) 0%, rgba(7, 61, 74, 0.4) 60%, transparent 100%);
  display: flex;
  align-items: center;
  gap: 10px;
  z-index: 5;
}
.art-cover-cap .ms { font-size: 14px; color: var(--blue-t3); flex-shrink: 0; }
.art-cover-cap-text { display: flex; flex-wrap: wrap; align-items: center; gap: 0 12px; }
.art-cover-caption { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 10.5px; color: rgba(255,255,255,.8); margin: 0; }
.art-cover-credit { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 10.5px; color: var(--blue-t3); margin: 0; }
.art-cover-caption + .art-cover-credit::before {
  content: "•";
  margin-right: 12px;
  color: rgba(255, 255, 255, 0.3);
}

/* Article two-column layout */
.art-layout { max-width: 1200px; margin: 0 auto; padding: 64px 52px; display: grid; grid-template-columns: 1fr 300px; gap: 64px; align-items: start; }

/* Article prose & Gutenberg blocks styling */
.art-body { min-width: 0; }
.art-body p:first-of-type::first-letter {
  font-family: 'Cormorant Garamond', serif;
  font-size: 4.2rem;
  font-weight: 600;
  color: var(--blue);
  float: left;
  line-height: .8;
  margin-right: 8px;
  margin-top: 6px;
}

/* Alignments (Wide & Full) */
.entry-content .alignwide,
.art-body .alignwide {
  margin-left: -80px;
  margin-right: -80px;
  max-width: calc(100% + 160px);
}
@media (max-width: 1360px) {
  .entry-content .alignwide,
  .art-body .alignwide {
    margin-left: 0;
    margin-right: 0;
    max-width: 100%;
  }
}
.entry-content .alignfull,
.art-body .alignfull {
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  max-width: 100vw;
  width: 100vw;
  border-radius: 0;
}
.entry-content .alignfull img,
.art-body .alignfull img {
  border-radius: 0;
  width: 100%;
}

/* Headings & Text */
.entry-content h1, .art-body h1,
.entry-content h2, .art-body h2,
.entry-content h3, .art-body h3,
.entry-content h4, .art-body h4,
.entry-content h5, .art-body h5,
.entry-content h6, .art-body h6 {
  font-family: 'Cormorant Garamond', serif;
  color: var(--text-dark);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.01em;
  margin-top: 1.6em;
  margin-bottom: 0.6em;
}
.entry-content h1, .art-body h1 { font-size: 2.2rem; }
.entry-content h2, .art-body h2 { font-size: 1.85rem; }
.entry-content h3, .art-body h3 { font-size: 1.45rem; }
.entry-content h4, .art-body h4 { font-size: 1.15rem; }
.entry-content h5, .art-body h5 { font-size: 0.95rem; font-family: 'Plus Jakarta Sans', sans-serif; text-transform: uppercase; letter-spacing: 0.05em; }
.entry-content h6, .art-body h6 { font-size: 0.85rem; font-family: 'Plus Jakarta Sans', sans-serif; text-transform: uppercase; letter-spacing: 0.05em; }

.entry-content p, .art-body p {
  font-size: 16px;
  line-height: 1.8;
  color: var(--text-body);
  margin-bottom: 1.5em;
  font-weight: 300;
  max-width: 72ch;
}
.entry-content a, .art-body a {
  color: var(--blue-s2);
  text-decoration: underline;
  text-decoration-color: var(--border-2);
  text-underline-offset: 3px;
  transition: color 0.2s, text-decoration-color 0.2s;
}
.entry-content a:hover, .art-body a:hover {
  color: var(--text-orange);
  text-decoration-color: var(--text-orange);
}

/* Lists */
.entry-content ul, .art-body ul,
.entry-content ol, .art-body ol {
  padding-left: 24px;
  margin-bottom: 1.5em;
}
.entry-content li, .art-body li {
  font-size: 16px;
  line-height: 1.8;
  color: var(--text-body);
  margin-bottom: 8px;
  font-weight: 300;
  max-width: 72ch;
}

/* Images & Captions */
.entry-content .wp-block-image,
.art-body .wp-block-image {
  margin: 28px 0;
}
.entry-content .wp-block-image img,
.art-body .wp-block-image img {
  max-width: 100%;
  height: auto;
  border-radius: var(--r-lg);
  box-shadow: 0 10px 30px rgba(7, 61, 74, 0.04);
  display: block;
}
.entry-content .wp-block-image figcaption,
.art-body .wp-block-image figcaption {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 10.5px;
  font-style: italic;
  color: var(--text-muted);
  margin-top: 0;
  text-align: left;
  line-height: 1.6;
  letter-spacing: 0.02em;
  background: rgba(7, 61, 74, 0.03);
  border-left: 3px solid var(--blue-s2);
  padding: 10px 16px;
  border-radius: 0 var(--r-md) var(--r-md) 0;
  box-sizing: border-box;
}
.wp-block-image-wrapper {
  position: relative;
  display: block;
  width: 100%;
}
.entry-content .wp-block-image-credit,
.art-body .wp-block-image-credit {
  position: absolute;
  bottom: 12px;
  right: 12px;
  z-index: 2;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9.5px;
  color: rgba(255, 255, 255, 0.95);
  background: rgba(7, 61, 74, 0.75);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  padding: 4px 10px;
  border-radius: 4px;
  pointer-events: none;
  line-height: 1.2;
}

/* Galleries */
.entry-content .wp-block-gallery,
.art-body .wp-block-gallery {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin: 32px 0;
  padding: 0;
  list-style: none;
}
.entry-content .wp-block-gallery .wp-block-image,
.art-body .wp-block-gallery .wp-block-image {
  flex-grow: 1;
  margin: 0;
}
.entry-content .wp-block-gallery .wp-element-caption,
.art-body .wp-block-gallery .wp-element-caption {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 10.5px;
  font-style: italic;
  color: var(--text-muted);
  width: 100%;
  text-align: left;
  margin-top: 0;
  background: rgba(7, 61, 74, 0.03);
  border-left: 3px solid var(--blue-s2);
  padding: 10px 16px;
  border-radius: 0 var(--r-md) var(--r-md) 0;
  box-sizing: border-box;
}

/* Tables */
.entry-content .wp-block-table,
.art-body .wp-block-table {
  width: 100%;
  margin: 32px 0;
  border-collapse: collapse;
  overflow-x: auto;
  display: block;
}
.entry-content .wp-block-table table,
.art-body .wp-block-table table {
  width: 100%;
  border-collapse: collapse;
}
.entry-content .wp-block-table th,
.art-body .wp-block-table th,
.entry-content .wp-block-table td,
.art-body .wp-block-table td {
  padding: 14px 18px;
  text-align: left;
  border-bottom: 1px solid rgba(7, 61, 74, 0.08);
  font-size: 14.5px;
  color: var(--text-body);
}
.entry-content .wp-block-table th,
.art-body .wp-block-table th {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--text-dark);
  background: white;
  font-weight: 600;
}
.entry-content .wp-block-table tr:nth-child(even),
.art-body .wp-block-table tr:nth-child(even) {
  background: rgba(7, 61, 74, 0.01);
}
.entry-content .wp-block-table tr:hover,
.art-body .wp-block-table tr:hover {
  background: rgba(31, 189, 227, 0.02);
}

/* Blockquotes & Pullquotes */
.entry-content .wp-block-quote,
.art-body .wp-block-quote,
.entry-content .wp-block-pullquote,
.art-body .wp-block-pullquote {
  margin: 36px 0;
  padding: 24px 32px;
  background: white;
  border-left: 4px solid var(--blue);
  border-radius: 0 var(--r-lg) var(--r-lg) 0;
}
.entry-content .wp-block-quote p,
.art-body .wp-block-quote p,
.entry-content .wp-block-pullquote p,
.art-body .wp-block-pullquote p {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.3rem;
  font-style: italic;
  color: var(--blue-s2);
  line-height: 1.6;
  margin: 0 !important;
  font-weight: 400;
}
.entry-content .wp-block-quote cite,
.art-body .wp-block-quote cite,
.entry-content .wp-block-pullquote cite,
.art-body .wp-block-pullquote cite {
  display: block;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--text-muted);
  margin-top: 12px;
  font-style: normal;
}

/* Columns */
.entry-content .wp-block-columns,
.art-body .wp-block-columns {
  display: flex;
  margin-bottom: 2em;
  box-sizing: border-box;
  flex-wrap: wrap;
  gap: 32px;
}
@media (min-width: 782px) {
  .entry-content .wp-block-columns,
  .art-body .wp-block-columns {
    flex-wrap: nowrap;
  }
}
.entry-content .wp-block-column,
.art-body .wp-block-column {
  flex-grow: 1;
  flex-basis: 0;
  min-width: 0;
  word-break: break-word;
  box-sizing: border-box;
}

/* Buttons */
.entry-content .wp-block-buttons,
.art-body .wp-block-buttons {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 2em;
}
.entry-content .wp-block-button__link,
.art-body .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 12px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .08em;
  padding: 12px 24px;
  border-radius: var(--r-md);
  text-decoration: none !important;
  transition: all 0.3s ease;
  cursor: pointer;
  border: 1px solid transparent;
}
.entry-content .wp-block-button:not(.is-style-outline) .wp-block-button__link,
.art-body .wp-block-button:not(.is-style-outline) .wp-block-button__link {
  background: var(--blue-s2);
  color: var(--white) !important;
}
.entry-content .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.art-body .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover {
  background: var(--blue-s3);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(7, 61, 74, 0.15);
}
.entry-content .wp-block-button.is-style-outline .wp-block-button__link,
.art-body .wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent;
  border-color: var(--blue);
  color: var(--blue-s2) !important;
}
.entry-content .wp-block-button.is-style-outline .wp-block-button__link:hover,
.art-body .wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: white;
  color: var(--blue-s3) !important;
  transform: translateY(-1px);
}

/* Files */
.entry-content .wp-block-file,
.art-body .wp-block-file {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--white);
  border: 1px solid rgba(7, 61, 74, 0.08);
  border-radius: var(--r-md);
  padding: 16px 20px;
  margin-bottom: 20px;
  box-shadow: 0 4px 12px rgba(7, 61, 74, 0.02);
}
.entry-content .wp-block-file a:not(.wp-block-file__button),
.art-body .wp-block-file a:not(.wp-block-file__button) {
  font-size: 14.5px;
  font-weight: 500;
  color: var(--text-dark);
  text-decoration: none;
}
.entry-content .wp-block-file .wp-block-file__button,
.art-body .wp-block-file .wp-block-file__button {
  background: var(--blue-s2);
  color: var(--white) !important;
  padding: 8px 16px;
  border-radius: 4px;
  font-size: 11px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  text-transform: uppercase;
  letter-spacing: .05em;
  text-decoration: none !important;
  transition: background 0.3s;
}
.entry-content .wp-block-file .wp-block-file__button:hover,
.art-body .wp-block-file .wp-block-file__button:hover {
  background: var(--blue-s3);
}

/* Separators */
.entry-content hr.wp-block-separator,
.art-body hr.wp-block-separator {
  border: none;
  border-top: 1px solid rgba(7, 61, 74, 0.08);
  margin: 40px 0;
  width: 100%;
}
.entry-content hr.wp-block-separator.is-style-dots,
.art-body hr.wp-block-separator.is-style-dots {
  text-align: center;
  border: none;
  background: none;
  height: auto;
}
.entry-content hr.wp-block-separator.is-style-dots::before,
.art-body hr.wp-block-separator.is-style-dots::before {
  content: '···';
  font-size: 24px;
  letter-spacing: 12px;
  color: var(--text-muted);
  padding-left: 12px;
}

/* Code, Preformatted, Verse */
.entry-content pre,
.art-body pre,
.entry-content code,
.art-body code,
.entry-content .wp-block-preformatted,
.art-body .wp-block-preformatted,
.entry-content .wp-block-verse,
.art-body .wp-block-verse {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 13.5px;
  background: white;
  border: 1px solid rgba(7, 61, 74, 0.08);
  border-radius: var(--r-md);
  color: var(--text-dark);
}
.entry-content code,
.art-body code {
  padding: 3px 6px;
  font-size: 13px;
  background: rgba(7, 61, 74, 0.04);
  border: none;
  border-radius: 4px;
}
.entry-content pre code,
.art-body pre code {
  padding: 0;
  background: transparent;
  border-radius: 0;
}
.entry-content pre,
.art-body pre,
.entry-content .wp-block-preformatted,
.art-body .wp-block-preformatted,
.entry-content .wp-block-verse,
.art-body .wp-block-verse {
  padding: 16px 20px;
  overflow-x: auto;
  line-height: 1.5;
  margin-bottom: 20px;
}

/* Media & Text */
.entry-content .wp-block-media-text,
.art-body .wp-block-media-text {
  display: grid;
  grid-template-columns: 50% 50%;
  gap: 32px;
  margin: 32px 0;
  align-items: center;
}
.entry-content .wp-block-media-text.is-image-fill .wp-block-media-text__media,
.art-body .wp-block-media-text.is-image-fill .wp-block-media-text__media {
  height: 100%;
  min-height: 250px;
}
.entry-content .wp-block-media-text.is-image-fill img,
.art-body .wp-block-media-text.is-image-fill img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.entry-content .wp-block-media-text__media img,
.art-body .wp-block-media-text__media img {
  max-width: 100%;
  border-radius: var(--r-lg);
  display: block;
}
.entry-content .wp-block-media-text__content,
.art-body .wp-block-media-text__content {
  padding: 0;
}
@media (max-width: 768px) {
  .entry-content .wp-block-media-text,
  .art-body .wp-block-media-text {
    grid-template-columns: 1fr !important;
    gap: 20px;
  }
}

/* Cover Block */
.entry-content .wp-block-cover,
.art-body .wp-block-cover {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 400px;
  padding: 48px;
  box-sizing: border-box;
  border-radius: var(--r-lg);
  overflow: hidden;
  margin: 36px 0;
  background-size: cover;
  background-position: center;
}
.entry-content .wp-block-cover__background,
.art-body .wp-block-cover__background {
  position: absolute;
  inset: 0;
  background: var(--blue-s3);
  opacity: 0.65;
  z-index: 1;
}
.entry-content .wp-block-cover__inner-container,
.art-body .wp-block-cover__inner-container {
  position: relative;
  z-index: 2;
  color: var(--white);
  text-align: center;
  max-width: 680px;
}
.entry-content .wp-block-cover h1, .art-body .wp-block-cover h1,
.entry-content .wp-block-cover h2, .art-body .wp-block-cover h2,
.entry-content .wp-block-cover h3, .art-body .wp-block-cover h3,
.entry-content .wp-block-cover p, .art-body .wp-block-cover p {
  color: var(--white) !important;
}

/* Audio & Video */
.entry-content .wp-block-audio,
.art-body .wp-block-audio,
.entry-content .wp-block-video,
.art-body .wp-block-video {
  margin: 28px 0;
  border-radius: var(--r-lg);
  overflow: hidden;
}
.entry-content .wp-block-audio audio,
.art-body .wp-block-audio audio,
.entry-content .wp-block-video video,
.art-body .wp-block-video video {
  width: 100%;
  display: block;
}

/* Social Links */
.entry-content .wp-block-social-links,
.art-body .wp-block-social-links {
  display: flex;
  gap: 12px;
  list-style: none;
  padding: 0;
  margin: 24px 0;
  flex-wrap: wrap;
}
.entry-content .wp-block-social-link,
.art-body .wp-block-social-link {
  margin: 0;
}
.entry-content .wp-block-social-link a,
.art-body .wp-block-social-link a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: white;
  color: var(--text-dark) !important;
  border: 1px solid rgba(7, 61, 74, 0.08);
  transition: all 0.2s;
  text-decoration: none !important;
}
.entry-content .wp-block-social-link a:hover,
.art-body .wp-block-social-link a:hover {
  background: white;
  border-color: var(--blue);
  color: var(--blue-s2) !important;
  transform: translateY(-2px);
}

/* Group blocks container alignment */
.entry-content .wp-block-group,
.art-body .wp-block-group {
  box-sizing: border-box;
}
.entry-content .wp-block-group.has-background,
.art-body .wp-block-group.has-background {
  padding: 32px;
  border-radius: var(--r-lg);
  margin: 28px 0;
}

/* Search Block */
.entry-content .wp-block-search,
.art-body .wp-block-search {
  margin: 28px 0;
  max-width: 480px;
}
.entry-content .wp-block-search__label,
.art-body .wp-block-search__label {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-muted);
  display: block;
  margin-bottom: 8px;
}
.entry-content .wp-block-search__inside-wrapper,
.art-body .wp-block-search__inside-wrapper {
  display: flex;
  border: 1px solid rgba(7, 61, 74, 0.12);
  border-radius: var(--r-md);
  overflow: hidden;
  background: var(--white);
  transition: border-color 0.2s;
}
.entry-content .wp-block-search__inside-wrapper:focus-within,
.art-body .wp-block-search__inside-wrapper:focus-within {
  border-color: var(--blue);
}
.entry-content .wp-block-search__input,
.art-body .wp-block-search__input {
  flex-grow: 1;
  border: none !important;
  outline: none !important;
  padding: 12px 16px;
  font-size: 14.5px;
  color: var(--text-dark);
}
.entry-content .wp-block-search__button,
.art-body .wp-block-search__button {
  background: var(--blue-s2) !important;
  color: var(--white) !important;
  border: none !important;
  padding: 0 20px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .05em;
  cursor: pointer;
  transition: background 0.2s;
}
.entry-content .wp-block-search__button:hover,
.art-body .wp-block-search__button:hover {
  background: var(--blue-s3) !important;
}

/* Calendar Widget Block */
.entry-content .wp-block-calendar,
.art-body .wp-block-calendar {
  margin: 28px 0;
  max-width: 320px;
}
.entry-content .wp-block-calendar table,
.art-body .wp-block-calendar table {
  width: 100%;
  border-collapse: collapse;
}
.entry-content .wp-block-calendar th,
.art-body .wp-block-calendar th,
.entry-content .wp-block-calendar td,
.art-body .wp-block-calendar td {
  padding: 8px;
  text-align: center;
  font-size: 13px;
  border: 1px solid rgba(7, 61, 74, 0.05);
}
.entry-content .wp-block-calendar th,
.art-body .wp-block-calendar th {
  background: white;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 10px;
}
.entry-content .wp-block-calendar caption,
.art-body .wp-block-calendar caption {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.1rem;
  font-weight: 600;
  margin-bottom: 8px;
  color: var(--text-dark);
}

/* Archives & Categories List */
.entry-content .wp-block-archives,
.art-body .wp-block-archives,
.entry-content .wp-block-categories,
.art-body .wp-block-categories,
.entry-content .wp-block-latest-posts,
.art-body .wp-block-latest-posts,
.entry-content .wp-block-latest-comments,
.art-body .wp-block-latest-comments {
  list-style: none;
  padding: 0;
  margin: 24px 0;
}
.entry-content .wp-block-archives li,
.art-body .wp-block-archives li,
.entry-content .wp-block-categories li,
.art-body .wp-block-categories li,
.entry-content .wp-block-latest-posts li,
.art-body .wp-block-latest-posts li,
.entry-content .wp-block-latest-comments li,
.art-body .wp-block-latest-comments li {
  padding: 8px 0;
  border-bottom: 1px solid rgba(7, 61, 74, 0.05);
  font-size: 14.5px;
}
.entry-content .wp-block-archives li a,
.art-body .wp-block-archives li a,
.entry-content .wp-block-categories li a,
.art-body .wp-block-categories li a,
.entry-content .wp-block-latest-posts li a,
.art-body .wp-block-latest-posts li a,
.entry-content .wp-block-latest-comments li a,
.art-body .wp-block-latest-comments li a {
  text-decoration: none;
  font-weight: 500;
}

/* Tag Cloud */
.entry-content .wp-block-tag-cloud,
.art-body .wp-block-tag-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 24px 0;
}
.entry-content .wp-block-tag-cloud a,
.art-body .wp-block-tag-cloud a {
  display: inline-flex;
  padding: 6px 12px;
  background: white;
  border: 1px solid rgba(7, 61, 74, 0.08);
  border-radius: 20px;
  text-decoration: none !important;
  font-size: 11px !important;
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: var(--text-body);
  transition: all 0.2s;
}
.entry-content .wp-block-tag-cloud a:hover,
.art-body .wp-block-tag-cloud a:hover {
  background: white;
  color: var(--blue-s2);
  border-color: var(--blue);
}

/* Embeds (YouTube, maps, general iframes) */
.entry-content .wp-block-embed,
.art-body .wp-block-embed,
.entry-content iframe,
.art-body iframe {
  margin: 32px 0;
  max-width: 100%;
  border-radius: var(--r-lg);
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(7, 61, 74, 0.05);
}
.entry-content .wp-block-embed__wrapper,
.art-body .wp-block-embed__wrapper {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 ratio */
  height: 0;
  overflow: hidden;
}
.entry-content .wp-block-embed__wrapper iframe,
.art-body .wp-block-embed__wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
  border: 0;
  margin: 0;
  border-radius: 0;
  box-shadow: none;
}

/* Details Widget Block */
.entry-content details,
.art-body details,
.entry-content .wp-block-details,
.art-body .wp-block-details {
  border: 1px solid rgba(7, 61, 74, 0.08);
  border-radius: var(--r-md);
  padding: 16px 20px;
  margin-bottom: 16px;
  background: var(--white);
  box-shadow: 0 4px 12px rgba(7, 61, 74, 0.02);
}
.entry-content details[open],
.art-body details[open] {
  border-color: rgba(31, 189, 227, 0.2);
}
.entry-content details summary,
.art-body details summary {
  font-weight: 600;
  color: var(--text-dark);
  cursor: pointer;
  outline: none;
  font-size: 15px;
}
.entry-content details .wp-block-details__summary,
.art-body details .wp-block-details__summary {
  font-weight: 600;
}
.entry-content details[open] summary,
.art-body details[open] summary {
  margin-bottom: 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(7, 61, 74, 0.05);
}

/* Math Block */
.entry-content .wp-block-math,
.art-body .wp-block-math,
.entry-content .math,
.art-body .math {
  display: block;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 15px;
  text-align: center;
  padding: 16px;
  margin: 24px 0;
  background: white;
  border: 1px solid rgba(7, 61, 74, 0.08);
  border-radius: var(--r-md);
  overflow-x: auto;
  color: var(--text-dark);
}

/* Classic Block */
.entry-content .wp-block-freeform,
.art-body .wp-block-freeform {
  line-height: 1.8;
}
.entry-content .wp-block-freeform p,
.art-body .wp-block-freeform p {
  margin-bottom: 1.5em;
}

/* Accordion Blocks */
.entry-content .wp-block-accordion,
.art-body .wp-block-accordion,
.entry-content .accordion,
.art-body .accordion {
  border: 1px solid rgba(7, 61, 74, 0.08);
  border-radius: var(--r-lg);
  overflow: hidden;
  margin: 28px 0;
}
.entry-content .accordion-item,
.art-body .accordion-item {
  border-bottom: 1px solid rgba(7, 61, 74, 0.08);
}
.entry-content .accordion-item:last-child,
.art-body .accordion-item:last-child {
  border-bottom: none;
}
.entry-content .accordion-title,
.art-body .accordion-title,
.entry-content .accordion-header,
.art-body .accordion-header {
  padding: 16px 20px;
  background: var(--white);
  font-weight: 600;
  color: var(--text-dark);
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: background 0.2s;
}
.entry-content .accordion-title:hover,
.art-body .accordion-title:hover,
.entry-content .accordion-header:hover,
.art-body .accordion-header:hover {
  background: white;
}
.entry-content .accordion-content,
.art-body .accordion-content {
  padding: 20px;
  background: rgba(7, 61, 74, 0.01);
  border-top: 1px solid rgba(7, 61, 74, 0.04);
}

/* Read More */
.entry-content .more-link,
.art-body .more-link {
  display: inline-flex;
  align-items: center;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--blue-s2);
  font-weight: 500;
  text-decoration: none !important;
  margin-top: 12px;
}
.entry-content .more-link:hover,
.art-body .more-link:hover {
  color: var(--text-orange);
}

/* Gutenberg Layout Grid, Row, Stack helpers */
.entry-content .is-layout-grid,
.art-body .is-layout-grid {
  display: grid;
  gap: 24px;
}
.entry-content .is-layout-flex,
.art-body .is-layout-flex {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}
.entry-content .is-layout-flex.is-vertical,
.art-body .is-layout-flex.is-vertical {
  flex-direction: column;
  align-items: flex-start;
}

/* Page Break / Nextpage pagination */
.entry-content .page-links,
.art-body .page-links,
.entry-content .post-page-numbers,
.art-body .post-page-numbers {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 36px 0;
  padding-top: 20px;
  border-top: 1px solid rgba(7, 61, 74, 0.08);
  clear: both;
}
.entry-content .page-links-title,
.art-body .page-links-title {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--text-muted);
}
.entry-content .page-links a,
.art-body .page-links a,
.entry-content .page-links span,
.art-body .page-links span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  height: 32px;
  padding: 0 8px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 12px;
  border-radius: var(--r);
  text-decoration: none !important;
  transition: all 0.2s;
}
.entry-content .page-links a,
.art-body .page-links a {
  background: white;
  border: 1px solid rgba(7, 61, 74, 0.08);
  color: var(--text-body);
}
.entry-content .page-links a:hover,
.art-body .page-links a:hover {
  background: white;
  border-color: var(--blue);
  color: var(--blue-s2);
}
.entry-content .page-links span,
.art-body .page-links span {
  background: var(--blue-s2);
  color: var(--white);
  border: 1px solid var(--blue-s2);
  font-weight: 600;
}

/* Widgets Dropdowns (Archives, Categories, etc.) */
.entry-content .wp-block-archives-dropdown,
.art-body .wp-block-archives-dropdown,
.entry-content .wp-block-categories-dropdown,
.art-body .wp-block-categories-dropdown {
  margin: 20px 0;
  max-width: 320px;
}
.entry-content select,
.art-body select {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid rgba(7, 61, 74, 0.12);
  border-radius: var(--r-md);
  font-size: 14px;
  background: var(--white);
  color: var(--text-dark);
  outline: none;
  cursor: pointer;
  transition: border-color 0.2s;
}
.entry-content select:focus,
.art-body select:focus {
  border-color: var(--blue);
}
/* Article stats boxes */
.art-stat-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 36px 0; }
.art-stat { background: var(--white); border: 1px solid var(--border); border-radius: var(--r-lg); padding: 20px; text-align: center; box-shadow: var(--sh-sm); }
.art-stat-n { font-family: 'Cormorant Garamond', serif; font-size: 2.2rem; font-weight: 600; line-height: 1; }
.art-stat-l { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 9.5px; text-transform: uppercase; letter-spacing: .1em; color: var(--text-body); margin-top: 6px; }

/* Highlight box */
.art-highlight { background: var(--orange-t1); border: 1px solid rgba(140,86,16,.18); border-radius: var(--r-lg); padding: 24px 28px; margin: 36px 0; display: flex; gap: 16px; align-items: flex-start; }
.art-highlight .ms { font-size: 24px; color: var(--text-orange); flex-shrink: 0; margin-top: 2px; }
.art-highlight p { font-size: 14.5px; color: var(--text-dark); line-height: 1.75; margin: 0; }

/* Tags & share */
.art-tags { display: flex; gap: 8px; flex-wrap: wrap; margin: 40px 0 0; padding-top: 28px; border-top: 1px solid var(--border); }
.art-tag { display: inline-flex; align-items: center; gap: 5px; font-family: 'Plus Jakarta Sans', sans-serif; font-size: 9.5px; letter-spacing: .1em; text-transform: uppercase; padding: 5px 11px; border-radius: 20px; border: 1px solid var(--border-2); color: var(--text-body); text-decoration: none; transition: all .2s; }
.art-tag:hover { background: white; color: var(--blue-s2); border-color: var(--blue); }
.art-share { margin-top: 28px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.art-share-lbl { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 10px; text-transform: uppercase; letter-spacing: .1em; color: var(--text-body); }
.share-btn { display: flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: var(--r); border: 1px solid var(--border-2); font-size: 12px; font-weight: 500; color: var(--text-body); text-decoration: none; transition: all .2s; }
.share-btn:hover { background: white; border-color: var(--blue); color: var(--blue-s2); }

/* ================================================================
   SIDEBAR & WIDGETS
   ================================================================ */
.art-sidebar {
  position: sticky;
  top: calc(var(--nav-h) + 32px);
  display: flex;
  flex-direction: column;
  gap: 36px;
}
.sb-card {
  background: transparent;
  border: none;
  padding: 0;
  box-shadow: none;
}
.sb-card h4 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9.5px;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--blue-s2);
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.sb-card h4 .ms {
  font-size: 15px;
  opacity: 0.85;
}
.sb-meta-row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 14px;
}
.sb-meta-row:last-child {
  margin-bottom: 0;
}
.sb-meta-row .ms {
  font-size: 16px;
  color: var(--blue-s2);
  flex-shrink: 0;
  margin-top: 2px;
  opacity: 0.8;
}
.sb-meta-row strong {
  display: block;
  font-size: 11.5px;
  font-weight: 600;
  color: var(--text-dark);
}
.sb-meta-row span {
  font-size: 12.5px;
  color: var(--text-body);
  font-weight: 300;
}

/* Related Posts list style */
.sb-related {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.sb-related-item {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
}
.sb-related-thumb {
  width: 56px;
  height: 56px;
  border-radius: var(--r-md);
  overflow: hidden;
  background: var(--blue-s3);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border);
}
.sb-related-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.sb-related-thumb-fallback {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.2);
  background: var(--blue-s3);
}
.sb-related-thumb-fallback .ms {
  font-size: 20px;
}
.sb-related-content {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.sb-related-title {
  font-size: 13px;
  font-weight: 500;
  color: var(--text-dark);
  line-height: 1.35;
  transition: color 0.25s ease;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.sb-related-date {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9.5px;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.sb-related-item:hover .sb-related-thumb img {
  transform: scale(1.08);
}
.sb-related-item:hover .sb-related-title {
  color: var(--text-orange);
}

.sb-toc a {
  display: flex;
  gap: 8px;
  align-items: baseline;
  font-size: 13px;
  color: var(--text-body);
  text-decoration: none;
  padding: 7px 0;
  border-bottom: 1px solid var(--border);
  transition: color .2s;
}
.sb-toc a:last-child {
  border-bottom: none;
}
.sb-toc a:hover {
  color: var(--blue-s2);
}
.sb-toc-n {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9px;
  color: var(--blue-t3);
  flex-shrink: 0;
  margin-top: 3px;
}

/* Sidebar CTA */
.sb-cta {
  background: var(--blue-s3);
  border-radius: var(--r-lg);
  padding: 24px;
}
.sb-cta h4 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9.5px;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--orange) !important;
  margin-bottom: 12px;
}
.sb-cta p {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.72);
  line-height: 1.65;
  margin-bottom: 16px;
  font-weight: 300;
}

/* WordPress Widgets - General Zen Styling */
.widget {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: 24px;
  box-shadow: var(--sh-sm);
}
.widget-title {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9.5px;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--text-orange);
  margin-bottom: 16px;
  font-weight: 600;
}
.widget ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.widget ul li {
  position: relative;
  padding-left: 12px;
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--text-dark);
  font-weight: 300;
}
.widget ul li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 7px;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: var(--blue-s2);
  opacity: 0.7;
}
.widget ul li a {
  color: inherit;
  text-decoration: none;
  transition: color 0.2s ease;
}
.widget ul li a:hover {
  color: var(--text-orange);
}

/* WordPress Search Widget Specific Styling */
.widget_search .widget-title {
  margin-bottom: 12px;
}
.search-form {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  max-width: 480px;
  background: var(--white);
  border: 1.5px solid var(--border-2);
  border-radius: var(--r-md);
  transition: border-color 0.25s ease, box-shadow 0.25s ease;
  overflow: hidden;
}
.search-form:focus-within {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(31, 189, 227, 0.12);
}
.search-form input[type="search"] {
  flex: 1;
  border: none;
  background: transparent;
  padding: 12px 44px 12px 16px;
  font-size: 13.5px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: var(--text-dark);
  outline: none;
}
.search-form button {
  position: absolute;
  right: 4px;
  background: transparent;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
  font-size: 0; /* Hides the "Search" text for a clean icon-only button */
}
.search-form button:hover {
  background: white;
  color: var(--blue-s2);
}
.search-form button .ms {
  font-size: 20px;
}

/* ================================================================
   FOOTER
   ================================================================ */
/* Footer template-part wrapper — must never be constrained by WordPress layout */
footer.wp-block-template-part {
  display: block;
  width: 100%;
  max-width: none !important;
  padding: 0 !important;
}

#cetrad-footer {
  background: var(--blue-s3);
  position: relative;
  border-top: 1px solid rgba(255, 255, 255, 0.03);
  width: 100%;
}
#cetrad-footer::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--blue) 0%, var(--green) 50%, var(--orange) 100%);
  z-index: 10;
}
.footer-top { padding: 68px 0 44px; display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 44px; }
.fb-brand { display: flex; align-items: center; gap: 11px; margin-bottom: 14px; }
.fb-brand-logo { display: block; margin-bottom: 14px; text-decoration: none; }
.footer-logo-img { display: block; height: 48px; width: auto; max-width: 180px; }
/* WP custom logo in footer */
.fb-brand-logo .custom-logo-link img,
.fb-brand-logo .custom-logo { display: block; height: 48px; width: auto; max-width: 180px; }
.fb-tagline {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--orange);
  margin-bottom: 14px;
}
.fb p { font-size: 12.5px; color: rgba(255,255,255,.60); line-height: 1.8; max-width: 320px; font-weight: 300; }
.fb-addr { display: flex; gap: 7px; margin-top: 16px; }
.fb-addr .ms { font-size: 12px; color: var(--blue-t3); margin-top: 2px; flex-shrink: 0; }
.fb-addr p { font-size: 11px; color: rgba(255,255,255,.60); line-height: 1.55; font-family: 'Plus Jakarta Sans', sans-serif; }
.footer-col h5 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 9.5px; text-transform: uppercase; letter-spacing: .14em; color: rgba(255,255,255,.85); margin-bottom: 16px; }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 8px; }
.footer-col ul li a {
  font-size: 12.5px;
  color: rgba(255,255,255,.60);
  text-decoration: none;
  transition: color .22s ease;
  display: inline-block;
  position: relative;
  padding-bottom: 2px;
}
.footer-col ul li a::after {
  content: '';
  position: absolute;
  width: 100%;
  transform: scaleX(0);
  height: 1px;
  bottom: 0;
  left: 0;
  background-color: var(--blue);
  transform-origin: bottom right;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}
.footer-col ul li a:hover {
  color: #fff;
}
.footer-col ul li a:hover::after {
  transform: scaleX(1);
  transform-origin: bottom left;
}
.footer-bot { border-top: 1px solid rgba(255,255,255,.05); padding: 20px 0; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; }
.footer-bot p { font-size: 11px; color: rgba(255,255,255,.55); font-family: 'Plus Jakarta Sans', sans-serif; }
.footer-links { display: flex; gap: 20px; }
.footer-links a {
  font-size: 11px;
  color: rgba(255,255,255,.55);
  text-decoration: none;
  font-family: 'Plus Jakarta Sans', sans-serif;
  transition: color .22s ease;
  position: relative;
}
.footer-links a::after {
  content: '';
  position: absolute;
  width: 100%;
  transform: scaleX(0);
  height: 1px;
  bottom: -2px;
  left: 0;
  background-color: var(--blue);
  transform-origin: bottom right;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}
.footer-links a:hover {
  color: #fff;
}
.footer-links a:hover::after {
  transform: scaleX(1);
  transform-origin: bottom left;
}
.social-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 18px; }
.soc-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: 30px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.7);
  font-size: 11.5px;
  text-decoration: none;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}
.soc-btn:hover {
  color: #fff;
  transform: translateY(-1px);
}
.soc-btn.soc-x:hover { background: #111111; border-color: #333333; }
.soc-btn.soc-fb:hover { background: #1877F2; border-color: #1877F2; }
.soc-btn.soc-yt:hover { background: #FF0000; border-color: #FF0000; }
.soc-btn.soc-ln:hover { background: #0A66C2; border-color: #0A66C2; }
.soc-btn .ms { font-size: 15px; }

.comments-area {
  max-width: 820px;
  margin: 64px auto 0;
  padding: 48px 0 0;
  border-top: 1px solid var(--border);
}
.comments-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.65rem;
  font-weight: 500;
  color: var(--text-dark);
  margin-bottom: 32px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.comments-title::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--border);
  opacity: 0.6;
}
.comment-list {
  list-style: none;
  padding: 0;
  margin: 0 0 48px;
}
.comment-list .comment {
  margin-bottom: 28px;
  border: none;
  padding: 0;
}
.comment-body {
  background: transparent;
  padding: 0;
  position: relative;
}
.comment-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}
.comment-author {
  display: flex;
  align-items: center;
  gap: 10px;
}
.comment-author .avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  object-fit: cover;
}
.comment-author .fn {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--text-dark);
  font-style: normal;
}
.comment-metadata {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9px;
  color: var(--text-muted);
  opacity: 0.8;
}
.comment-metadata a {
  color: inherit;
  text-decoration: none;
}
.comment-metadata a:hover {
  color: var(--text-orange);
}
.comment-content {
  font-size: 13.5px;
  line-height: 1.65;
  color: var(--text-body);
  font-weight: 300;
  padding-left: 38px;
}
.comment-content p {
  margin: 0 0 8px;
}
.comment-content p:last-child {
  margin-bottom: 0;
}
.comment-reply-link,
.comment-reply-title a {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 600;
  color: var(--blue-s2);
  text-decoration: none;
  transition: color 0.2s ease;
  cursor: pointer;
}
.comment-reply-link:hover {
  color: var(--text-orange);
}
.comment-reply-link::before {
  content: 'reply';
  font-family: 'Material Symbols Outlined';
  font-weight: 300;
  font-size: 12px;
  line-height: 1;
}
.reply {
  display: flex;
  justify-content: flex-start;
  margin-top: 6px;
  margin-left: 38px;
}

/* Nesting style */
.comment-list .children {
  list-style: none;
  padding: 0;
  margin: 16px 0 0 38px;
  border-left: 1px solid var(--border);
  padding-left: 20px;
}

@media (max-width: 768px) {
  .comment-list .children {
    margin-left: 16px;
    padding-left: 16px;
  }
  .comment-body {
    padding-left: 0;
  }
}

/* Comment Form */
.comment-respond {
  background: transparent;
  padding: 32px 0 0;
  margin-top: 48px;
  border-top: 1px solid var(--border);
}
.comment-reply-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.45rem;
  font-weight: 500;
  color: var(--text-dark);
  margin-bottom: 24px;
}
.comment-form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.comment-form-comment {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.comment-form-author,
.comment-form-email {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
@media (max-width: 600px) {
  .comment-form-author,
  .comment-form-email {
    grid-column: 1 / -1;
  }
}
.comment-form-url,
.comment-form-cookies-consent {
  grid-column: 1 / -1;
}
.comment-form-cookies-consent {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 12px;
  color: var(--text-body);
  font-weight: 300;
  margin-top: 4px;
}
.comment-form-cookies-consent input {
  margin-top: 3px;
}
.comment-form label {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9.5px;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--text-muted);
  font-weight: 500;
}
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
  width: 100%;
  padding: 10px 0;
  border: none;
  border-bottom: 1.5px solid var(--border);
  border-radius: 0;
  font-size: 13.5px;
  font-family: inherit;
  color: var(--text-dark);
  background: transparent;
  outline: none;
  transition: border-bottom-color .25s ease;
}
.comment-form input[type="text"]:focus,
.comment-form input[type="email"]:focus,
.comment-form input[type="url"]:focus,
.comment-form textarea:focus {
  border-bottom-color: var(--blue-s2);
}
.comment-form textarea {
  min-height: 120px;
  resize: vertical;
}
.form-submit {
  grid-column: 1 / -1;
  margin-top: 12px;
}
.form-submit .submit {
  background: var(--orange);
  color: var(--text-dark);
  font-weight: 500;
  padding: 12px 24px;
  border: none;
  border-radius: var(--r);
  cursor: pointer;
  font-size: 13px;
  font-family: inherit;
  letter-spacing: .02em;
  min-height: 44px;
  transition: background .2s ease;
}
.form-submit .submit:hover {
  background: var(--orange-s1);
}
.form-submit .submit:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(31,189,227,.3);
}

/* ================================================================
   ARCHIVE / NEWSROOM
   ================================================================ */
.archive-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.archive-filter { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 40px; }
.filter-btn { padding: 7px 16px; border-radius: 20px; border: 1px solid var(--border-2); font-size: 12px; font-family: 'Plus Jakarta Sans', sans-serif; text-transform: uppercase; letter-spacing: .08em; color: var(--text-body); background: var(--white); cursor: pointer; transition: all .2s; text-decoration: none; }
.filter-btn:hover { background: white; color: var(--blue-s2); border-color: var(--blue); }
.filter-btn.active { background: white; color: var(--blue-s2); border-color: var(--blue); font-weight: 600; }

/* Pagination */
.pagination { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 56px; }
.page-numbers { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: var(--r); border: 1px solid var(--border-2); font-size: 13px; color: var(--text-body); text-decoration: none; transition: all .2s; }
.page-numbers:hover, .page-numbers.current { background: var(--blue); color: var(--text-dark); border-color: var(--blue); }
.page-numbers.prev, .page-numbers.next { width: auto; padding: 0 16px; gap: 6px; display: flex; }

/* ================================================================
   PLATFORM CARDS
   ================================================================ */
.pcard { background: var(--white); border-radius: var(--r-lg); overflow: hidden; border: 1px solid var(--border); box-shadow: var(--sh-sm); transition: transform .25s, box-shadow .25s; }
.pcard:hover { transform: translateY(-3px); box-shadow: var(--sh-md); border-color: var(--blue); }
.pcard-thumb { aspect-ratio: 16/8; overflow: hidden; }
.pcard-thumb img { width: 100%; height: 100%; object-fit: cover; }
.pcard-body { padding: 22px; }
.pcard-body h3 { font-family: 'Cormorant Garamond', serif; font-size: 1.15rem; font-weight: 600; color: var(--text-head); margin-bottom: 8px; }
.pcard-body p { font-size: 13px; color: var(--text-body); line-height: 1.7; margin-bottom: 16px; }

/* ================================================================
   MANDATE ROW
   ================================================================ */
.mr { display: flex; gap: 13px; align-items: flex-start; padding: 14px 16px; border: 1px solid var(--border); border-radius: var(--r-lg); background: var(--white); transition: border-color .2s, box-shadow .2s; }
.mr:hover { border-color: var(--blue); box-shadow: var(--sh-sm); }
.mr-n { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 9.5px; color: var(--blue-s2); background: white; border-radius: 5px; width: 27px; height: 27px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 1px; }
.mr p { font-size: 13px; color: var(--text-dark); line-height: 1.65; }

/* ================================================================
   CTA BAND
   ================================================================ */
.cta-band { background: var(--blue); padding: 72px 0; }
.cta-inner { display: flex; justify-content: space-between; align-items: center; gap: 40px; flex-wrap: wrap; }
.cta-inner h2 { font-family: 'Cormorant Garamond', serif; font-size: clamp(1.8rem, 2.8vw, 2.5rem); font-weight: 600; color: #fff; }
.cta-inner p { font-size: 14px; color: rgba(255,255,255,.82); margin-top: 8px; max-width: 400px; font-weight: 300; line-height: 1.75; }
.cta-btns { display: flex; gap: 12px; flex-wrap: wrap; }
.cta-band .btn:not(.btn-ghost) { background: var(--white); color: var(--text-dark); }
.cta-band .btn:not(.btn-ghost):hover { background: var(--blue-t1); color: var(--text-dark); }
@media (max-width: 768px) {
  .cta-inner { flex-direction: column; align-items: stretch; text-align: center; }
  .cta-inner p { margin-left: auto; margin-right: auto; }
  .cta-btns { flex-direction: column; width: 100%; }
  .cta-btns .btn { width: 100%; }
}

/* ── Premium CTA Banner Card ── */
.cta-banner-card {
  background: linear-gradient(135deg, var(--blue-s2) 0%, var(--blue) 100%);
  border-radius: var(--r-lg);
  padding: 48px;
  color: var(--white);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 40px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(7, 61, 74, 0.15);
  margin-top: 56px;
  border: 1px solid rgba(255, 255, 255, 0.08);
}
.cta-banner-card::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -20%;
  width: 300px;
  height: 300px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0) 70%);
  pointer-events: none;
}
.cta-banner-card h3 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--white);
  margin: 0 0 10px 0;
  line-height: 1.2;
}
.cta-banner-card p {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.85);
  line-height: 1.6;
  margin: 0;
  max-width: 620px;
}
.cta-banner-card-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
  flex-shrink: 0;
}
.cta-banner-card .btn {
  background: var(--white);
  color: var(--blue-s2) !important;
  border: 1.5px solid var(--white);
  box-shadow: var(--sh-sm);
}
.cta-banner-card .btn:hover {
  background: rgba(255, 255, 255, 0.95);
  color: var(--blue-s3) !important;
  transform: translateY(-2px);
}
.cta-banner-card .btn-ghost {
  background: transparent;
  border-color: rgba(255, 255, 255, 0.45);
  color: var(--white) !important;
  box-shadow: none;
}
.cta-banner-card .btn-ghost:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: var(--white);
  color: var(--white) !important;
}
@media (max-width: 991px) {
  .cta-banner-card {
    flex-direction: column;
    align-items: flex-start;
    padding: 36px;
    gap: 24px;
  }
  .cta-banner-card p {
    max-width: 100%;
  }
  .cta-banner-card-actions {
    width: 100%;
  }
  .g3, .archive-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ================================================================
   SEARCH FORM
   ================================================================ */
/* Unified search form styles are declared above under Widget Styling */

/* ================================================================
   RESPONSIVE
   ================================================================ */
@media (max-width: 1024px) {
  .container, .container-narrow { padding-left: 32px; padding-right: 32px; }
  .nav-inner { padding: 0 32px; }
  .art-layout { gap: 40px; }
}

@media (max-width: 768px) {
  :root { --nav-h: 60px; }
  .container, .container-narrow, .nav-inner, .art-layout { padding-left: 20px; padding-right: 20px; }
  .nav-links { display: none; }
  .nav-links.open { display: flex; flex-direction: column; position: fixed; top: var(--nav-h); left: 0; right: 0; bottom: 0; background: #fff; padding: 20px; z-index: 299; overflow-y: auto; gap: 4px; }
  .nav-links.open .nav-a { padding: 12px 16px; font-size: 14px; }
  .nav-links.open .dropdown { display: block; position: static; box-shadow: none; border: none; border-radius: 0; padding: 4px 0 4px 16px; background: white; margin-top: 4px; border-radius: var(--r); }
  .nav-toggle { display: flex; }
  #cetrad-hero { grid-template-columns: 1fr; min-height: auto; }
  .hero-l { padding: 52px 20px 24px; }
  .hero-has-media .hero-l { padding: 72px 20px; }
  .hero-r { display: flex; flex-direction: column; padding: 0 20px 52px; background: transparent; }
  .hero-r > .topo { display: none; }
  .hero-cards { max-width: 100%; padding: 0; }
  .band-row { grid-template-columns: repeat(3, 1fr); }
  .g2, .g3, .g4 { grid-template-columns: 1fr; }
  #alumni > .container > div { grid-template-columns: 1fr; gap: 40px; }
  .thrust-grid { grid-template-columns: 1fr 1fr; }
  .svc-grid { grid-template-columns: 1fr; }
  .archive-grid { grid-template-columns: 1fr; }
  .art-layout { grid-template-columns: 1fr; padding-top: 40px; }
  .art-sidebar { position: static; }
  .art-stat-row { grid-template-columns: 1fr 1fr; }
  .art-cover-cap { padding: 10px 20px; }
  .footer-top { grid-template-columns: 1fr; gap: 32px; }
  .cta-inner { flex-direction: column; align-items: flex-start; }
  .footer-bot { flex-direction: column; text-align: center; align-items: center; padding: 24px 0; }
  .footer-links { justify-content: center; flex-wrap: wrap; gap: 16px; }
}

@media (max-width: 480px) {
  .container { padding-left: 16px; padding-right: 16px; }
  .hero-h1 { font-size: 2.4rem; }
  .art-title { font-size: 1.9rem; }
  .art-stat-row { grid-template-columns: 1fr; }
  .band-row { grid-template-columns: 1fr 1fr; }
  .thrust-grid { grid-template-columns: 1fr; }
}

/* ================================================================
   HERO VIDEO BACKGROUND & CUSTOM WIDGETS
   ================================================================ */
.hero-media-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: 1;
  pointer-events: none;
}
.hero-media-wrapper::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--hero-overlay, rgba(7, 61, 74, 0.68));
  z-index: 2;
}
.hero-bg-video,
.hero-media-wrapper iframe {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  min-width: 100%;
  min-height: 100%;
  transform: translate(-50%, -50%);
  object-fit: cover;
  z-index: 1;
  border: none;
}
.hero-media-wrapper iframe {
  width: 100vw;
  height: 56.25vw;
  min-height: 100vh;
  min-width: 177.77vh;
}
.page-hero-inner,
.hero-l {
  position: relative;
  z-index: 5;
}
.hero-custom-widget {
  position: relative;
  width: 100%;
}

/* ================================================================
   API DATA — Employee grid, Course cards, Vacancy cards
   ================================================================ */

/* Employee grid */
.emp-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.emp-card {
  background: var(--white); border-radius: var(--r-xl);
  border: 1px solid var(--border); box-shadow: var(--sh-sm);
  padding: 28px; text-align: center;
  transition: transform .25s, box-shadow .25s;
}
.emp-card:hover { transform: translateY(-3px); box-shadow: var(--sh-md); }
.emp-avatar {
  width: 72px; height: 72px; border-radius: 50%;
  margin: 0 auto 14px; overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.6rem; font-weight: 600; color: #fff;
  transform: translateZ(0); -webkit-mask-image: -webkit-radial-gradient(white, black);
}
.emp-avatar img { width: 100%; height: 100%; object-fit: cover; image-rendering: -webkit-optimize-contrast; transform: translateZ(0); }
.emp-name  { font-size: 15px; font-weight: 600; color: var(--blue-s3); margin-bottom: 4px; }
.emp-title { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 9.5px; text-transform: uppercase; letter-spacing: .1em; color: var(--text-orange); }

/* Course cards */
.course-card {
  background: var(--white); border-radius: var(--r-xl);
  border: 1px solid var(--border); box-shadow: var(--sh-sm);
  padding: 28px; display: flex; flex-direction: column; gap: 12px;
  transition: transform .25s, box-shadow .25s;
}
.course-card:hover { transform: translateY(-3px); box-shadow: var(--sh-md); }
.course-card-title { font-family: 'Cormorant Garamond', serif; font-size: 1.2rem; font-weight: 600; color: var(--text-dark); line-height: 1.3; }
.course-card-desc  { font-size: 13px; color: var(--text-body); line-height: 1.75; flex: 1; }
.course-card-footer {
  display: flex; align-items: center; justify-content: space-between;
  padding-top: 14px; border-top: 1px solid var(--border); gap: 12px; flex-wrap: wrap;
}
.course-card-meta { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.course-card-meta span { display: flex; align-items: center; gap: 5px; font-family: 'Plus Jakarta Sans', sans-serif; font-size: 10px; color: var(--text-muted); }
.course-card-meta .ms { font-size: 14px; color: var(--blue); }

/* Vacancy cards */
.vacancy-card {
  background: var(--white); border-radius: var(--r-xl);
  border: 1px solid var(--border); box-shadow: var(--sh-sm);
  padding: 28px 32px; transition: transform .25s, box-shadow .25s;
}
.vacancy-card:hover { transform: translateY(-3px); box-shadow: var(--sh-md); }
.vacancy-card-title  { font-family: 'Cormorant Garamond', serif; font-size: 1.2rem; font-weight: 600; color: var(--text-dark); line-height: 1.3; margin-top: 6px; }
.vacancy-card-desc   { font-size: 13px; color: var(--text-body); line-height: 1.75; margin-bottom: 16px; }
.vacancy-card-footer {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 12px; border-top: 1px solid var(--border); padding-top: 16px;
}
.vacancy-card-meta { display: flex; gap: 16px; flex-wrap: wrap; }
.vacancy-card-meta span { display: flex; align-items: center; gap: 5px; font-family: 'Plus Jakarta Sans', sans-serif; font-size: 10px; color: var(--text-muted); }
.vacancy-card-meta .ms { font-size: 14px; color: var(--blue); }

/* API state notices */
.api-notice {
  background: var(--orange-t1); border: 1px solid rgba(140,86,16,.2);
  border-radius: var(--r-lg); padding: 16px 20px; margin-top: 32px;
  display: flex; align-items: center; gap: 12px;
  font-size: 13px; color: var(--text-dark);
}
.api-notice .ms { font-size: 20px; color: var(--text-orange); flex-shrink: 0; }
.api-empty { text-align: center; padding: 56px 20px; color: var(--text-body); font-size: 14px; }
.api-empty .ms { font-size: 44px; color: var(--blue-t2); display: block; margin-bottom: 14px; }

/* ================================================================
   APPLICATION MODAL (<dialog>)
   ================================================================ */
.cetrad-modal {
  border: none; border-radius: var(--r-xl); padding: 0;
  width: min(680px, 95vw); max-height: 92vh; overflow: hidden;
  box-shadow: var(--sh-lg);
  margin: auto;
}
.cetrad-modal::backdrop { background: rgba(7,61,74,.55); backdrop-filter: blur(4px); }
.modal-inner { display: flex; flex-direction: column; max-height: 92vh; }
.modal-header {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 16px;
  padding: 22px 28px; background: var(--blue-s3);
  border-bottom: 1px solid rgba(31,189,227,.15); flex-shrink: 0;
}
.modal-header h3 { font-family: 'Cormorant Garamond', serif; font-size: 1.25rem; font-weight: 600; color: var(--blue); line-height: 1.25; }
.modal-close {
  background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2);
  border-radius: var(--r); width: 44px; height: 44px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,.8); font-size: 16px; line-height: 1;
  transition: background .2s; flex-shrink: 0; font-family: inherit;
}
.modal-close:hover { background: rgba(255,255,255,.2); color: #fff; }
.modal-body { padding: 26px 28px; overflow-y: auto; flex: 1; }

/* Application form */
.app-form { display: flex; flex-direction: column; gap: 14px; }
.app-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.app-form-group { display: flex; flex-direction: column; gap: 5px; }
.app-form-group.full { grid-column: 1 / -1; }
.app-form-group label {
  font-family: 'Plus Jakarta Sans', sans-serif; font-size: 10px;
  text-transform: uppercase; letter-spacing: .08em; color: var(--text-body);
}
.app-form-group .req { color: var(--text-orange); margin-left: 2px; }
.app-form-group input,
.app-form-group select,
.app-form-group textarea {
  padding: 12px 16px; border: 1.5px solid var(--border-2); border-radius: var(--r);
  font-size: 13.5px; font-family: 'Plus Jakarta Sans', sans-serif;
  color: var(--text-dark); background: var(--white); outline: none;
  transition: border-color .2s, box-shadow .2s;
}
.app-form-group input:focus,
.app-form-group select:focus,
.app-form-group textarea:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(31,189,227,.15); }
.app-form-group textarea { min-height: 80px; resize: vertical; }
.app-form-group input[type="file"] { padding: 8px; cursor: pointer; font-size: 12px; }
.file-hint { font-size: 10.5px; color: var(--text-muted); }

/* Modal layout components */
.modal-footer {
  display: flex; gap: 12px; flex-wrap: wrap; margin-top: 8px;
  justify-content: flex-start; padding: 0; border: none; background: none;
}
.modal-header-sub {
  font-family: 'Plus Jakarta Sans', sans-serif; font-size: 9px;
  text-transform: uppercase; letter-spacing: .12em; color: var(--orange-s1);
  margin-bottom: 4px;
}
.modal-title-small { font-size: 1.1rem; }
.app-form-group-salutation { grid-column: span 1; max-width: 120px; }

/* Inline form feedback */
.form-msg {
  padding: 12px 16px; border-radius: var(--r); font-size: 13px;
  line-height: 1.6; display: none; margin-bottom: 14px;
}
.form-msg.show    { display: block; }
.form-msg.success { background: var(--green-t1); color: var(--text-green); border: 1px solid rgba(74,154,57,.22); }
.form-msg.error   { background: var(--orange-t1); color: var(--text-dark); border: 1px solid rgba(140,86,16,.22); }

@media (max-width: 1024px) {
  .emp-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  .emp-grid { grid-template-columns: 1fr 1fr; }
  .app-form-row { grid-template-columns: 1fr; }
  .cetrad-modal { width: 100%; max-height: 100dvh; border-radius: var(--r-lg) var(--r-lg) 0 0; margin: auto auto 0 auto; }
}
@media (max-width: 480px) {
  .emp-grid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   PUBLICATION ARCHIVE & SINGLE
   ========================================================================== */

/* ── Archive filter secondary row ─────────────────────────────────────────── */
.pub-filter-form { margin-bottom: 0; }
.pub-filter-secondary {
  display: flex; gap: 12px; align-items: center; flex-wrap: wrap;
  margin-bottom: 22px;
}
.pub-select {
  padding: 8px 12px; border: 1px solid var(--border-2); border-radius: var(--r);
  font-size: 12.5px; color: var(--text-body); background: var(--white);
  cursor: pointer; outline: none; transition: border-color .2s;
}
.pub-select:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(31,189,227,.1); }
/* Unified publications search styles are declared under publication section */
.pub-clear-filters {
  display: flex; align-items: center; gap: 4px; font-size: 12px;
  color: var(--text-body); text-decoration: none; font-family: 'Plus Jakarta Sans', sans-serif;
  padding: 7px 12px; border: 1px solid var(--border-2); border-radius: var(--r);
  transition: all .2s;
}
.pub-clear-filters:hover { background: white; border-color: var(--blue); color: var(--text-dark); }

/* ── Result count ─────────────────────────────────────────────────────────── */
.pub-count {
  font-size: 11.5px; color: var(--text-muted); font-family: 'Plus Jakarta Sans', sans-serif;
  margin-bottom: 20px;
}

/* ── Publication card grid ────────────────────────────────────────────────── */
.pub-grid {
  display: grid; grid-template-columns: 1fr; gap: 2px;
  background: var(--border); border-radius: var(--r-xl); overflow: hidden;
}

/* ── Publication card ─────────────────────────────────────────────────────── */
.pub-card {
  position: relative; display: flex; gap: 18px; align-items: flex-start;
  padding: 24px 26px; background: var(--white); transition: background .15s;
}
.pub-card:hover { background: white; }
.pub-card-overlay {
  position: absolute; inset: 0; z-index: 1;
}
.pub-card-icon {
  width: 40px; height: 40px; border-radius: 9px; background: white;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; color: var(--blue-s2); transition: background .15s;
}
.pub-card:hover .pub-card-icon { background: var(--white); }
.pub-card-icon .ms { font-size: 20px; }
.pub-card-thumb {
  width: 52px; height: 68px; border-radius: 6px; overflow: hidden;
  flex-shrink: 0; background: white;
}
.pub-card-thumb img { width: 100%; height: 100%; object-fit: cover; }
.pub-card-body { flex: 1; min-width: 0; }
.pub-card-snippet {
  font-size: 12px; color: var(--text-body); line-height: 1.6;
  margin-bottom: 6px; display: -webkit-box; -webkit-line-clamp: 2;
  line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.pub-card-dl-btn {
  position: relative; z-index: 2; flex-shrink: 0; align-self: center;
  width: 34px; height: 34px; border-radius: 8px; border: 1px solid var(--border);
  background: var(--white); color: var(--blue-s2);
  display: flex; align-items: center; justify-content: center;
  text-decoration: none; transition: background .15s, border-color .15s;
}
.pub-card-dl-btn:hover { background: white; border-color: var(--blue); }
.pub-card-dl-btn .ms { font-size: 18px; }

/* Publication type chip */
.pub-type-tag {
  display: inline-flex; font-family: 'Plus Jakarta Sans', sans-serif; font-size: 9px;
  letter-spacing: .1em; text-transform: uppercase; padding: 2px 7px;
  border-radius: 4px; background: white; color: var(--blue-s2);
  margin-bottom: 7px; transition: background .15s;
}
.pub-card:hover .pub-type-tag { background: var(--white); }
.pub-type-technical-report  { background: var(--orange-t1); color: var(--text-orange); }
.pub-type-policy-brief      { background: var(--green-t1);  color: var(--text-green); }
.pub-type-field-guide        { background: var(--green-t1);  color: var(--text-green); }

.pub-card-title {
  font-size: 13.5px; font-weight: 600; color: var(--text-dark);
  line-height: 1.45; margin-bottom: 6px;
}
.pub-card-authors {
  font-size: 12px; color: var(--text-body); line-height: 1.5; margin-bottom: 7px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pub-card-meta {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  font-size: 11px; color: var(--text-muted); font-family: 'Plus Jakarta Sans', sans-serif;
}
.pub-card-meta-sep { opacity: .4; }
.pub-card-journal { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 160px; }
/* Sort select alignment */
.pub-sort-select { margin-left: auto; }


/* ── Mobile PDF download (replaces flipbook on small screens) ─────────────── */
.pub-mobile-download {
  display: none; background: #05262f; padding: 52px 24px; text-align: center;
  border-top: 1px solid rgba(255,255,255,.05);
}

/* ── Open access badge ────────────────────────────────────────────────────── */
.pub-oa-badge {
  display: inline-flex; align-items: center; background: var(--green-t1);
  color: var(--text-green); font-size: 9px; font-family: 'Plus Jakarta Sans', sans-serif;
  letter-spacing: .07em; text-transform: uppercase; padding: 2px 7px;
  border-radius: 4px; font-weight: 500;
}
.pub-oa-badge-lg { font-size: 11px; padding: 4px 10px; }

/* ── Single publication hero ──────────────────────────────────────────────── */
.pub-hero-authors {
  font-size: 15px;
  color: rgba(255, 255, 255, 0.78);
  margin-bottom: 16px;
  line-height: 1.6;
}
.pub-hero-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  font-size: 12.5px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: rgba(255, 255, 255, 0.55);
  margin-bottom: 28px;
}
.pub-sep { opacity: .4; }
.pub-hero-actions { display: flex; gap: 12px; flex-wrap: wrap; }

/* ── Single publication layout ────────────────────────────────────────────── */
.pub-layout {
  display: grid; grid-template-columns: 1fr 340px; gap: 48px;
  align-items: start; padding: 56px 0 72px;
}
.pub-section-head {
  font-family: 'Cormorant Garamond', serif; font-size: 1.45rem; font-weight: 600;
  color: var(--blue-s3); margin-bottom: 24px; line-height: 1.25;
  letter-spacing: -0.02em;
}

/* ── Metadata sidebar ─────────────────────────────────────────────────────── */
.pub-sidebar { position: sticky; top: 100px; }

/* ── Responsive ───────────────────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .pub-layout { grid-template-columns: 1fr; gap: 36px; }
  .pub-sidebar { position: static; }
}
@media (max-width: 768px) {
  .pub-grid { grid-template-columns: 1fr; }
  .pub-filter-secondary { flex-direction: column; align-items: stretch; }
  .pub-search-wrap { max-width: none; }
  .pub-sort-select { margin-left: 0; }
  .pub-flipbook-section { display: none; }
  .pub-mobile-download { display: block; }
}
@media (max-width: 480px) {
  .pub-card { flex-direction: column; gap: 12px; }
}

/* ── Single Publication Details & Metadata (Consolidated) ─────────────────── */
.pub-mobile-icon {
  font-size: 36px;
  color: var(--blue);
  display: block;
  margin-bottom: 16px;
}
.pub-mobile-text {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.7);
  margin-bottom: 24px;
  max-width: 320px;
  margin-left: auto;
  margin-right: auto;
}
.pub-flipbook-section .container {
  max-width: 1500px;
}
.pub-flipbook-section .pub-section-head {
  color: var(--white);
  text-align: center;
  margin-bottom: 36px;
  font-family: 'Cormorant Garamond', serif;
}
.fb-divider {
  width: 1px;
  height: 18px;
  background: rgba(255, 255, 255, 0.15);
  margin: 0 4px;
}
.fb-error-icon {
  font-size: 32px;
  color: var(--text-orange);
}
.fb-error-text {
  margin-top: 10px;
}
.pub-details-section {
  background: var(--white);
}
.pub-body-text {
  margin-top: 16px;
  font-size: 15.5px;
  line-height: 1.85;
  color: var(--text-body);
}
.pub-body-tags {
  margin-top: 36px;
  padding-top: 28px;
  border-top: 1px solid var(--border);
}
.pub-body-tag-icon {
  font-size: 12px;
}
.pub-related-wrapper {
  margin-top: 52px;
}
.pub-related-title {
  margin-bottom: 20px;
}
.pub-related-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
  background: var(--border);
  border-radius: var(--r-xl);
  overflow: hidden;
}
.pub-meta-card {
  background: var(--blue-s3);
  border-radius: var(--r-xl);
  padding: 36px;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.pub-meta-icon-wrap {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: rgba(31, 189, 227, 0.12);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
}
.pub-meta-icon-wrap .ms {
  font-size: 24px;
  color: var(--blue);
}
.pub-meta-type {
  font-size: 9px;
  font-family: 'DM Mono', monospace;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--orange);
}
.pub-meta-divider {
  border-bottom: 1px solid rgba(31, 189, 227, 0.1);
  margin: 18px 0;
}
.pub-meta-divider.divider-large {
  margin: 22px 0;
}
.pub-meta-rows {
  display: flex;
  flex-direction: column;
  gap: 13px;
}
.pub-meta-row {
  display: flex;
  gap: 8px;
  align-items: baseline;
}
.pub-meta-row.row-center {
  align-items: center;
}
.pub-meta-row.pub-meta-dimensions-row {
  display: none;
}
.pub-meta-label {
  font-size: 9px;
  font-family: 'DM Mono', monospace;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.38);
  flex-shrink: 0;
  min-width: 64px;
}
.pub-meta-value {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.75);
  line-height: 1.5;
}
.pub-meta-value.value-strong {
  font-size: 13px;
  color: #fff;
  font-weight: 600;
}
.pub-meta-value.value-italic {
  font-style: italic;
}
.pub-meta-value.value-link {
  color: var(--blue-t3);
  word-break: break-all;
  text-decoration: none;
}
.pub-meta-value.value-link:hover {
  text-decoration: underline;
}
.pub-sidebar-btn {
  justify-content: center;
}
.pub-sidebar-btn.mb-8 {
  margin-bottom: 8px;
}
.pub-citation-box {
  margin-top: 12px;
  padding: 20px 22px;
  background: white;
  border-radius: var(--r-xl);
  border: 1px solid var(--border);
}
.pub-citation-title {
  font-size: 9px;
  font-family: 'DM Mono', monospace;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--text-orange);
  margin-bottom: 10px;
}
.pub-citation-text {
  font-size: 12px;
  line-height: 1.75;
  color: var(--text-body);
}
.pub-citation-copy-btn {
  margin-top: 12px;
  font-size: 11px;
  font-family: 'DM Mono', monospace;
  background: none;
  border: 1px solid var(--border);
  border-radius: var(--r);
  padding: 5px 14px;
  cursor: pointer;
  color: var(--text-body);
  transition: background .15s, border-color .15s;
}
.pub-citation-copy-btn:hover {
  background: var(--border);
  border-color: var(--blue-s2);
}
.pub-sidebar-footer {
  margin-top: 22px;
}
.pub-sidebar-footer .arrow-link {
  color: var(--text-body);
  font-size: 12.5px;
}
.pub-icon-back {
  transform: rotate(180deg);
  display: inline-block;
}
.pub-error-icon {
  font-size: 32px;
  color: var(--text-orange);
}
.pub-error-text {
  margin-top: 10px;
}
.pub-icon-small {
  font-size: 12px;
}
.pub-access-row {
  display: flex;
  gap: 8px;
  align-items: center;
}
.pub-access-row.hidden-row {
  display: none;
}
.pub-access-dimension {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.75);
}

/* ── Flipbook Player ───────────────────────────────────────────────────────── */
.pub-flipbook-section {
  background: #05262f;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
  padding: 64px 0 80px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.pub-flipbook-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  position: relative;
}
.flipbook-wrapper {
  position: relative;
  width: 100%;
  min-height: 320px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: rgba(0, 0, 0, 0.25);
  border-radius: var(--r-lg);
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.55);
}
.flipbook-zoom-host {
  display: block;
  width: 100%;
}
#flipbook {
  margin: 0 auto;
  display: none;
}
.flip-page {
  background-color: var(--white);
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.3);
  overflow: hidden;
}
.flip-page canvas {
  width: 100%;
  height: 100%;
  display: block;
}
/* PDF.js text layer — invisible overlay for text selection / SEO */
.flip-page { position: relative; }
.flip-page .pdfTextLayer {
  position: absolute; inset: 0; overflow: hidden;
  pointer-events: auto; line-height: 1;
  color: transparent; user-select: text;
}
.flip-page .pdfTextLayer span,
.flip-page .pdfTextLayer br {
  color: transparent; position: absolute;
  white-space: pre; cursor: text; transform-origin: 0% 0%;
}
.flip-page .pdfTextLayer ::selection {
  background: rgba(31,189,227,.28); color: transparent;
}
.flipbook-loading {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: rgba(7, 61, 74, 0.95);
  color: var(--white);
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 13px;
  gap: 16px;
  z-index: 10;
  border-radius: var(--r-lg);
}
.flipbook-spinner {
  width: 44px;
  height: 44px;
  border: 3.5px solid rgba(255, 255, 255, 0.1);
  border-top-color: var(--blue);
  border-radius: 50%;
  animation: fb-spin 0.8s linear infinite;
}
@keyframes fb-spin {
  to { transform: rotate(360deg); }
}
.flipbook-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  background: rgba(255, 255, 255, 0.05);
  padding: 8px 20px;
  border-radius: 30px;
  border: 1px solid rgba(255, 255, 255, 0.08);
}
.flipbook-btn {
  background: transparent;
  border: none;
  color: rgba(255, 255, 255, 0.75);
  cursor: pointer;
  padding: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: all 0.2s ease;
}
.flipbook-btn:hover:not(:disabled) {
  background: rgba(255, 255, 255, 0.1);
  color: var(--blue);
}
.flipbook-btn:disabled {
  opacity: 0.3;
  cursor: not-allowed;
}
.flipbook-btn .ms {
  font-size: 20px;
}
.flipbook-page-num {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.85);
  user-select: none;
  min-width: 60px;
  text-align: center;
}

/* ── Flipbook TOC panel ───────────────────────────────────────────────────── */
.fb-toc-panel {
  position: absolute; top: 0; left: 0; bottom: 0;
  width: 280px; max-width: 80%;
  background: #042028; border-right: 1px solid rgba(255,255,255,.08);
  display: flex; flex-direction: column;
  transform: translateX(-100%);
  transition: transform .24s cubic-bezier(.25,.46,.45,.94);
  z-index: 50; border-radius: var(--r-lg) 0 0 var(--r-lg);
  overflow: hidden;
}
.fb-toc-panel.open { transform: translateX(0); }
.fb-toc-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px 14px 20px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .09em; color: rgba(255,255,255,.55);
  font-family: 'Plus Jakarta Sans', sans-serif; flex-shrink: 0;
}
.fb-toc-list {
  flex: 1; overflow-y: auto;
  scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.12) transparent;
  padding: 8px 0;
}
.fb-toc-root, .fb-toc-sub { list-style: none; margin: 0; padding: 0; }
.fb-toc-item { border-bottom: none; }
.fb-toc-btn {
  display: block; width: 100%; text-align: left;
  background: transparent; border: none; cursor: pointer;
  font-size: 13px; font-family: 'Plus Jakarta Sans', sans-serif;
  color: rgba(255,255,255,.78); padding: 9px 16px;
  line-height: 1.35; transition: background .12s, color .12s;
}
.fb-toc-btn:hover { background: rgba(255,255,255,.06); color: var(--blue); }
.fb-toc-depth-0 .fb-toc-btn { font-weight: 600; }
.fb-toc-depth-1 .fb-toc-btn { font-size: 12px; color: rgba(255,255,255,.58); }
.fb-toc-depth-2 .fb-toc-btn { font-size: 11.5px; color: rgba(255,255,255,.44); }
.flipbook-btn.active { background: rgba(255,255,255,.12); color: var(--blue); }

/* Fullscreen Styles — container holds book + scrubber + controls */
.pub-flipbook-container:-webkit-full-screen,
.pub-flipbook-container:fullscreen {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  background: #05262f !important;
  padding: 24px 32px 20px !important;
  gap: 16px !important;
  width: 100vw !important;
  height: 100vh !important;
  box-sizing: border-box !important;
}

/* Wrapper fills all available height in fullscreen */
.pub-flipbook-container:-webkit-full-screen .flipbook-wrapper,
.pub-flipbook-container:fullscreen .flipbook-wrapper {
  flex: 1 1 auto !important;
  width: 100% !important;
  height: auto !important;
  max-height: calc(100vh - 130px) !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}

/* Keep scrubber and controls visible in fullscreen */
.pub-flipbook-container:-webkit-full-screen .flipbook-scrubber-row,
.pub-flipbook-container:fullscreen .flipbook-scrubber-row,
.pub-flipbook-container:-webkit-full-screen .flipbook-controls,
.pub-flipbook-container:fullscreen .flipbook-controls {
  flex-shrink: 0 !important;
  width: 100% !important;
}
@media (max-width: 768px) {
  .flipbook-wrapper {
    min-height: 260px;
  }
}
@media (max-width: 480px) {
  .flipbook-wrapper {
    min-height: 200px;
  }
  .flipbook-controls {
    gap: 8px;
    padding: 6px 14px;
  }
}

/* ── Scrubber row ─────────────────────────────────────────────────────────── */
.flipbook-scrubber-row {
  display: flex; align-items: center; gap: 10px;
  padding: 0 4px; margin-bottom: 10px;
}
.flipbook-scrubber-icon {
  font-size: 16px; color: rgba(255,255,255,.35); flex-shrink: 0; user-select: none;
}

/* Scrubber input */
.flipbook-scrubber {
  -webkit-appearance: none;
  appearance: none;
  flex: 1;
  height: 4px;
  background: rgba(31,189,227,.18); /* overridden by JS fill */
  border-radius: 2px;
  outline: none;
  cursor: pointer;
  transition: background .15s;
}
.flipbook-scrubber::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 14px; height: 14px;
  border-radius: 50%;
  background: #1fbde3;
  cursor: pointer;
  transition: transform .15s, box-shadow .15s;
  box-shadow: 0 0 0 0 rgba(31,189,227,.4);
}
.flipbook-scrubber::-webkit-slider-thumb:hover {
  transform: scale(1.25);
  box-shadow: 0 0 0 4px rgba(31,189,227,.25);
}
.flipbook-scrubber::-moz-range-thumb {
  width: 14px; height: 14px;
  border-radius: 50%;
  background: #1fbde3;
  border: none;
  cursor: pointer;
}

/* Sound button states */
.flipbook-btn[data-sound="off"] { color: rgba(255,255,255,.35); }
.flipbook-btn.active { color: #1fbde3; }

/* ── Sound group & picker panel ───────────────────────────────────────────── */
.fb-sound-group {
  position: relative;
  display: flex;
  align-items: center;
  gap: 2px;
}
.fb-sound-panel {
  position: absolute;
  bottom: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%);
  background: #0b3540;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 12px;
  padding: 6px;
  min-width: 200px;
  box-shadow: 0 8px 32px rgba(0,0,0,.55);
  z-index: 200;
  display: none;
  pointer-events: auto;
}
.fb-sound-panel.open { display: block; }
.fb-sound-panel::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 6px solid transparent;
  border-top-color: rgba(255,255,255,.1);
  pointer-events: none;
}
.fb-sound-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 8px;
  cursor: pointer;
  color: rgba(255,255,255,.7);
  font-size: 12.5px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  transition: background .12s;
  user-select: none;
}
.fb-sound-item:hover        { background: rgba(255,255,255,.07); color: #fff; }
.fb-sound-item.active       { background: rgba(31,189,227,.12);  color: #1fbde3; }
.fb-sound-item.previewing   { background: rgba(31,189,227,.22); }
.fb-sound-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,.3);
  flex-shrink: 0;
  transition: all .15s;
}
.fb-sound-item.active .fb-sound-dot {
  background: #1fbde3;
  border-color: #1fbde3;
  box-shadow: 0 0 6px #1fbde3;
}
.fb-sound-name { flex: 1; }
.fb-sound-preview {
  background: none;
  border: none;
  color: rgba(255,255,255,.3);
  cursor: pointer;
  font-size: 15px;
  padding: 2px 3px;
  border-radius: 4px;
  line-height: 1;
  transition: color .12s, background .12s;
}
.fb-sound-item:hover .fb-sound-preview,
.fb-sound-preview:focus      { color: rgba(255,255,255,.7); }
.fb-sound-preview:hover      { color: #1fbde3; background: rgba(31,189,227,.12); }

/* Flipbook wrapper (position context) */
#flipbook { position: relative; }

/* ── Zoom overlay ─────────────────────────────────────────────────────────── */
.fb-zoom-overlay {
  position: fixed; inset: 0; z-index: 99999;
  background: rgba(7,61,74,.88);
  display: flex; align-items: center; justify-content: center;
  backdrop-filter: blur(4px);
  animation: fbZoomIn .18s ease;
}
@keyframes fbZoomIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
.fb-zoom-inner {
  position: relative;
  max-width: 92vw; max-height: 90vh;
  overflow: auto;
  border-radius: var(--r-xl);
  box-shadow: 0 24px 60px rgba(0,0,0,.6);
  background: #fff;
  cursor: grab;
  scroll-behavior: auto;
}
.fb-zoom-inner:active { cursor: grabbing; }
.fb-zoom-inner canvas { display: block; }

.fb-zoom-loading {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 12px; background: var(--blue-s3); color: rgba(255,255,255,.7);
  font-size: 13px; border-radius: var(--r-xl); z-index: 2;
}
.fb-zoom-close {
  position: fixed; top: 20px; right: 24px;
  width: 38px; height: 38px; border-radius: 50%;
  background: rgba(7,61,74,.85); border: 1px solid rgba(31,189,227,.3);
  display: flex; align-items: center; justify-content: center;
  color: #fff; cursor: pointer; z-index: 100000; transition: background .2s;
}
.fb-zoom-close:hover { background: var(--blue-s2); }
.fb-zoom-close .ms { font-size: 20px; }
.fb-zoom-hint {
  position: sticky; bottom: 0; left: 0;
  background: rgba(7,61,74,.75); color: rgba(255,255,255,.6);
  font-size: 10.5px; font-family: 'Plus Jakarta Sans', sans-serif;
  text-align: center; padding: 6px 16px;
  backdrop-filter: blur(4px); user-select: none;
  pointer-events: none;
}

@media (max-width: 600px) {
  .flipbook-scrubber-row { padding: 0; }
}

/* ================================================================
   ABOUT PAGE REFACTORED CLASSES (Zen Design Cleanup)
   ================================================================ */
/* About page section layout & alternation */
.about-section-white {
  background: var(--white);
  padding: 88px 0;
  border-bottom: 1px solid var(--border);
}
.about-section-gray {
  background: var(--off-white);
  padding: 88px 0;
  border-bottom: 1px solid var(--border);
}

.about-story-meta {
  display: flex;
  flex-direction: column;
}
.about-stats-card {
  background: var(--blue-s3);
  border-radius: var(--r-xl);
  padding: 36px;
  box-shadow: var(--sh-md);
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.about-stats-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--sh-lg);
}
.about-stats-card .mono-label.white-opacity {
  color: rgba(255, 255, 255, 0.6);
  margin-bottom: 24px;
}
.about-stats-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px;
}
.about-stat-item {
  display: flex;
  flex-direction: column;
}
.about-stat-item .stat-n {
  color: var(--orange);
  font-size: 2.6rem;
  font-weight: 700;
  line-height: 1;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  display: inline-block;
}
.about-stat-item:hover .stat-n {
  transform: scale(1.06);
}
.about-stat-item .stat-l {
  font-size: 11px;
  color: rgba(255, 255, 255, 0.7);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-top: 6px;
}
@media (max-width: 600px) {
  .about-stats-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .about-section-white,
  .about-section-gray {
    padding: 60px 0;
  }
}

/* Compatibility/retroactive styling for existing Gutenberg block content on the About page */
.page-hero + section .flex-col > div:first-child > div:last-child,
.has-white-background-color .flex-col > div:first-child > div:last-child {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-bottom: 28px;
}

.page-hero + section .flex-col > div:last-child,
.has-white-background-color .flex-col > div:last-child {
  background: var(--off-white);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: 24px;
}

.page-hero + section .flex-col > div:last-child > div:first-child,
.has-white-background-color .flex-col > div:last-child > div:first-child {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--blue-s2);
  font-weight: 600;
  margin-bottom: 8px;
}

.page-hero + section .flex-col > div:last-child > p,
.has-white-background-color .flex-col > div:last-child > p {
  margin: 0;
  font-size: 13px;
  line-height: 1.6;
  color: var(--text-body);
}

.about-stats-card .stat-l {
  color: rgba(255, 255, 255, 0.7);
}

@media (max-width: 600px) {
  .page-hero + section .flex-col > div:first-child > div:last-child,
  .has-white-background-color .flex-col > div:first-child > div:last-child {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

.vm-card {
  background: var(--white);
  border-radius: var(--r-xl);
  padding: 40px;
  border: 1px solid var(--border);
  box-shadow: var(--sh-sm);
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.3s ease;
}
.vm-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--sh-md);
}
.vm-card h3 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.6rem;
  font-weight: 600;
  color: var(--text-head);
  margin-bottom: 14px;
}
.vm-card p {
  font-size: 14px;
  color: var(--text-body);
  line-height: 1.85;
  margin: 0;
}
.vm-card.vision {
  background: var(--blue-t1);
  border-color: rgba(31, 189, 227, 0.15);
}
.vm-card.vision:hover {
  border-color: var(--blue-t3);
}
.vm-card.vision .eyebrow {
  color: var(--blue-s1);
}
.vm-card.vision h3 {
  color: var(--blue-s3);
}
.vm-card.mission {
  background: var(--orange-t1);
  border-color: rgba(248, 158, 36, 0.15);
}
.vm-card.mission:hover {
  border-color: var(--orange-t2);
}
.vm-card.mission .eyebrow {
  color: var(--orange);
}
.vm-card.mission h3 {
  color: var(--text-orange);
}

.info-card {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding: 24px;
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  background: var(--white);
  box-shadow: var(--sh-sm);
  transition: border-color 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1), transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.info-card:hover {
  border-color: var(--blue-t3);
  box-shadow: var(--sh-md);
  transform: translateY(-2px);
}
.info-card h4 {
  font-size: 14.5px;
  font-weight: 600;
  color: var(--text-dark);
  margin-bottom: 4px;
}
.info-card p {
  font-size: 13px;
  color: var(--text-body);
  line-height: 1.65;
  margin: 0;
}
.info-card-ico {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  flex-shrink: 0;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}
.info-card:hover .info-card-ico {
  transform: scale(1.08);
}
.info-card-ico.green { background: var(--green-t1); color: var(--text-green); }
.info-card-ico.orange { background: var(--orange-t1); color: var(--text-orange); }
.info-card-ico.blue { background: var(--blue-t1); color: var(--blue-s2); }

/* ── Admin Panel Form Controls (Newsletter & Backend) ────────────────────── */
.admin-subsubsub {
  margin-bottom: 10px;
}
.admin-form-wrapper {
  margin-bottom: 12px;
}
.admin-form-label {
  font-weight: 600;
  font-size: 12px;
}
.admin-form-input,
.admin-form-textarea,
.admin-form-select {
  width: 100%;
  margin-top: 4px;
}
.admin-tag {
  display: inline-block;
  margin: 1px 2px;
  padding: 1px 7px;
  border-radius: 20px;
  font-size: 11px;
  background: #e0f2fe;
  color: #0369a1;
}
.admin-tag-edit {
  font-size: 11px;
  color: #888;
  margin-left: 4px;
}
.admin-status-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 600;
}
.admin-helper-text {
  font-size: 11px;
  color: #888;
}
.admin-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
  margin-top: 8px;
}
.admin-table td {
  padding: 6px 0;
  color: #666;
}
.admin-table td.stat-value {
  font-weight: 700;
  text-align: right;
}
.admin-table .stat-secondary {
  color: #999;
  font-weight: 400;
}
.admin-progress-bar {
  background: #e5e7eb;
  border-radius: 4px;
  height: 8px;
  margin: 8px 0;
}
.admin-progress-bar-fill {
  background: #1FBDE3;
  height: 8px;
  border-radius: 4px;
  transition: width .3s;
}
.admin-color-input {
  width: 60px;
  height: 36px;
  cursor: pointer;
  border: none;
}
.admin-preview-img {
  width: 100%;
  max-height: 100px;
  object-fit: cover;
  border-radius: 4px;
  margin-bottom: 6px;
}
.admin-sublist-wrapper {
  margin-bottom: 6px;
}
.admin-section-text {
  font-size: 13px;
  color: #555;
}
.admin-form-row {
  margin-bottom: 10px;
}

/* ── Contact Page ─────────────────────────────────────────────────────────── */
.contact-section {
  background: white;
  padding: 60px 0;
}
.contact-grid {
  gap: 60px;
}
.contact-details-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 24px;
}
.contact-card-heading {
  margin: 0 0 4px 0;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-dark);
}
.contact-card-content {
  margin: 0;
  font-size: 12.5px;
  color: var(--text-body);
}
.contact-card-link {
  color: var(--blue-s2);
  text-decoration: none;
  font-weight: 500;
}
.contact-social-wrapper {
  margin-top: 28px;
}
.contact-social-label {
  margin-bottom: 12px;
}
.contact-social-links {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.contact-social-link {
  font-size: 12px;
}
.contact-social-icon {
  font-size: 14px;
}
.contact-map-card {
  margin-bottom: 28px;
  overflow: hidden;
}
.contact-map-svg {
  width: 100%;
  display: block;
}
.contact-form-success {
  display: none;
}
.contact-form-success.show {
  display: block;
}
.contact-success-icon {
  font-size: 20px;
  flex-shrink: 0;
}
.contact-form-container {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.contact-form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.contact-input-height-44 {
  height: 44px;
}
.contact-form-hidden {
  display: none;
}
.contact-form-message {
  display: none;
}
.contact-button-center {
  justify-content: center;
}

/* ── Publications Archive List ──────────────────────────────────────────── */
.archive-section {
  background: white;
  padding: 60px 0;
}
.archive-filter {
  margin-bottom: 16px;
}
.archive-sub-filter {
  margin-top: -8px;
  margin-bottom: 20px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.pub-list-container {
  display: flex;
  flex-direction: column;
  gap: 2px;
  background: var(--border);
  border-radius: var(--r-xl);
  overflow: hidden;
  margin-top: 8px;
}
.pub-list-row {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 18px;
  padding: 22px 26px;
  background: var(--white);
  transition: background .15s;
}
.pub-list-thumb {
  width: 44px;
  height: 58px;
  border-radius: 6px;
  overflow: hidden;
  flex-shrink: 0;
  background: white;
}
.pub-list-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.pub-list-icon {
  width: 40px;
  height: 40px;
  border-radius: 9px;
  background: white;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--blue-s2);
  margin-top: 2px;
}
.pub-list-icon .ms {
  font-size: 20px;
}
.pub-list-body {
  flex: 1;
  min-width: 0;
}
.pub-list-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-dark);
  line-height: 1.45;
  margin-bottom: 5px;
}
.pub-list-title a {
  color: inherit;
  text-decoration: none;
}
.pub-list-excerpt {
  font-size: 12.5px;
  color: var(--text-body);
  line-height: 1.6;
  margin-bottom: 7px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.pub-list-authors {
  font-size: 12px;
  color: var(--text-body);
  margin-bottom: 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pub-list-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  font-size: 11px;
  color: var(--text-muted);
  font-family: 'DM Mono', monospace;
}
.pub-list-divider {
  opacity: 0.4;
}
.pub-list-oa {
  background: var(--green-t1);
  color: var(--text-green);
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: .07em;
}
.pub-list-download {
  flex-shrink: 0;
  align-self: center;
  width: 44px;
  height: 44px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--white);
  color: var(--blue-s2);
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: background .15s, border-color .15s;
  position: relative;
  z-index: 2;
}
.pub-list-download .ms {
  font-size: 18px;
}
.pub-list-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
}
.pub-empty-state {
  text-align: center;
  padding: 72px 0;
}
.pub-empty-icon {
  font-size: 52px;
  color: var(--blue-t2);
  display: block;
  margin-bottom: 18px;
}
.pub-empty-text {
  color: var(--text-body);
  font-size: 14.5px;
}
.pub-empty-button {
  margin-top: 20px;
  display: inline-flex;
}
.archive-icon-small {
  font-size: 14px;
}

/* ── Careers Page ───────────────────────────────────────────────────────── */
.careers-section {
  background: var(--white);
  padding: 60px 0;
}
.careers-grid {
  gap: 60px;
}
.careers-links {
  display: flex;
  gap: 20px;
  margin-top: 24px;
  flex-wrap: wrap;
}
.careers-link-align {
  align-self: center;
}
.careers-tools-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.careers-tool-card {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 14px;
  border-radius: var(--r-md);
  border: 1px solid var(--border);
  text-decoration: none;
  color: inherit;
  transition: background-color .2s, border-color .2s;
}
.careers-tool-card:hover {
  background: white;
  border-color: var(--blue);
}
.careers-tool-icon {
  color: var(--blue);
  font-size: 20px;
  flex-shrink: 0;
}
.careers-tool-info {
  flex-grow: 1;
  min-width: 0;
}
.careers-tool-title {
  margin: 0 0 2px 0;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--text-dark);
}
.careers-tool-desc {
  margin: 0;
  font-size: 11.5px;
  color: var(--text-muted);
}
.careers-tool-arrow {
  font-size: 14px;
  color: var(--text-muted);
  flex-shrink: 0;
}

/* ── Department Single Page ────────────────────────────────────────────── */
.dept-title {
  margin-bottom: 24px;
}
.dept-actions {
  margin-top: 40px;
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  padding-top: 28px;
  border-top: 1px solid rgba(7, 61, 74, 0.08);
}
.dept-action-align {
  align-self: center;
}
.dept-head-profile {
  display: flex;
  align-items: center;
  gap: 16px;
}
.dept-head-avatar-wrap {
  width: 64px;
  height: 64px;
  flex-shrink: 0;
  padding: 2px;
  border: 1px solid rgba(7, 61, 74, 0.08);
  margin-right: 0;
}
.dept-head-avatar {
  transform: translateZ(0);
  -webkit-mask-image: -webkit-radial-gradient(white, black);
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--blue);
}
.dept-head-avatar img {
  image-rendering: -webkit-optimize-contrast;
  transform: translateZ(0);
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.dept-head-init-hidden {
  display: none;
}
.dept-head-name {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--text-dark);
  margin: 0;
  line-height: 1.2;
}
.dept-head-title {
  font-size: 11px;
  color: var(--text-muted);
  margin: 4px 0 0;
  font-family: 'DM Mono', monospace;
  text-transform: uppercase;
  letter-spacing: .03em;
}
.dept-head-contact {
  font-size: 12.5px;
  color: var(--text-body);
  border-top: 1px solid rgba(7, 61, 74, 0.05);
  padding-top: 12px;
  margin-top: 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.dept-contact-item {
  display: flex;
  align-items: center;
  gap: 8px;
}
.dept-contact-icon {
  font-size: 14px;
  color: var(--text-muted);
}
.dept-contact-link {
  color: var(--blue-s2);
  text-decoration: none;
  font-weight: 500;
}
.dept-contact-linkedin {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.dept-contact-icon-small {
  font-size: 10px;
}
.dept-section {
  background: white;
  padding: 60px 0;
}
.dept-button-block {
  width: 100%;
  justify-content: center;
  font-size: 12px;
  padding: 10px 16px;
}
.dept-link-inherit {
  color: inherit;
  text-decoration: none;
}

/* ── Publications Page ──────────────────────────────────────────────────── */
.publications-section {
  background: white;
  padding: 60px 0;
}
.publications-filters {
  display: flex;
  gap: 12px;
  margin-bottom: 40px;
  flex-wrap: wrap;
  border-bottom: 1px solid var(--border);
  padding-bottom: 20px;
}
.pub-filter-btn {
  background: none;
  border: none;
  padding: 0;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  position: relative;
  padding-bottom: 12px;
  margin-bottom: -20px;
  text-decoration: none;
}
.pub-filter-underline {
  display: block;
  position: absolute;
  bottom: -20px;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--blue);
}
.publications-grid {
  margin-top: 40px;
}
.pub-card {
  display: flex;
  flex-direction: column;
}
.pub-card-image {
  width: 100%;
  height: 200px;
  background: white;
  overflow: hidden;
  border-radius: var(--r-lg) var(--r-lg) 0 0;
}
.pub-card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.pub-card-body-flex {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}
.pub-card-tag-wrapper {
  margin-bottom: 12px;
}
.pub-card-tag {
  background: white;
  color: var(--blue-s2);
  font-size: 11px;
}
.pub-card-title {
  font-size: 15px;
  font-weight: 600;
  margin: 0 0 12px;
  color: var(--text-dark);
  flex-grow: 1;
}
.pub-card-description {
  font-size: 13px;
  color: var(--text-muted);
  margin: 0 0 16px;
  line-height: 1.6;
}
.pub-card-meta {
  font-size: 12px;
  color: var(--text-muted);
  margin-top: auto;
}
.pub-card-button {
  margin-top: 16px;
  align-self: flex-start;
}
.pub-empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 60px 20px;
}
.pub-empty-text {
  color: var(--text-muted);
  font-size: 15px;
}
.footer-section {
  padding: 60px 0;
}

/* ── Admin Theme Options & Settings ────────────────────────────────────── */
.admin-desc-muted {
  color: #888;
}
.admin-desc-text {
  color: #666;
  margin-bottom: 20px;
}
.admin-panel-rebuild {
  max-width: 900px;
  background: #fff;
  border: 1px solid #ccd0d4;
  border-radius: 4px;
  padding: 24px;
  margin-top: 20px;
  box-shadow: 0 1px 1px rgba(0,0,0,.04);
}
.admin-panel-rebuild h3 {
  margin-top: 0;
  font-size: 1.15rem;
  font-weight: 600;
  color: #1d2327;
}
.admin-rebuild-info {
  margin: 16px 0 24px;
  padding: 16px 20px;
  background: #f0f6fc;
  border-left: 4px solid #0a66c2;
  border-radius: 2px;
}
.admin-rebuild-info p {
  margin: 0 0 10px;
  color: #1d2327;
}
.admin-rebuild-info ul {
  margin: 0;
  padding-left: 20px;
  list-style-type: disc;
}
.admin-rebuild-info li {
  margin-bottom: 8px;
  color: #2c3338;
}
.admin-rebuild-warning {
  margin-top: 14px !important;
  color: #b32d2e !important;
  font-size: 12px;
}
.admin-section-divider {
  margin: 40px 0 20px;
}
.admin-settings-table {
  max-width: 900px;
  margin-top: 15px;
}
.admin-table-header-cell {
  padding: 10px;
  font-weight: 600;
}
.admin-table-cell-20 {
  width: 20%;
}
.admin-table-cell-15 {
  width: 15%;
}
.admin-table-cell-30 {
  width: 30%;
}
.admin-cell-right {
  text-align: right;
}

.partner-card {
  background: var(--white);
  border-radius: var(--r-lg);
  border: 1px solid var(--border);
  padding: 28px 24px;
  text-align: center;
  box-shadow: var(--sh-sm);
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.partner-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--sh-md);
  border-color: var(--blue-t3);
}
.partner-avatar {
  width: 52px;
  height: 52px;
  border-radius: 11px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Cormorant Garamond', serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
  text-align: center;
  margin: 0 auto 12px;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}
.partner-card:hover .partner-avatar {
  transform: scale(1.08);
}
.partner-avatar.blue { background: var(--blue-t1); color: var(--blue-s2); }
.partner-avatar.orange { background: var(--orange-t1); color: var(--text-orange); }
.partner-avatar.green { background: var(--green-t1); color: var(--text-green); }
.partner-card h4 {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--text-dark);
  margin-bottom: 4px;
}
.partner-card p {
  font-size: 11.5px;
  color: var(--text-body);
  margin: 0;
}

/* Thrust Panel Modifiers */
.thrust-panel {
  transition: background-color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}
.thrust-panel.blue { background: white; }
.thrust-panel.blue .thrust-accent { background: var(--blue); }
.thrust-panel.blue .thrust-icon, .thrust-panel.blue .thrust-title { color: var(--blue-dark); }
.thrust-panel.blue:hover { background: var(--blue-t1); }

.thrust-panel.green { background: var(--green-t1); }
.thrust-panel.green .thrust-accent { background: var(--green); }
.thrust-panel.green .thrust-icon, .thrust-panel.green .thrust-title { color: var(--text-green); }
.thrust-panel.green:hover { background: rgba(91, 185, 71, 0.12); }

.thrust-panel.orange { background: var(--orange-t1); }
.thrust-panel.orange .thrust-accent { background: var(--orange); }
.thrust-panel.orange .thrust-icon, .thrust-panel.orange .thrust-title { color: var(--text-orange); }
.thrust-panel.orange:hover { background: rgba(248, 158, 36, 0.12); }

.thrust-panel .thrust-body { color: var(--text-body); }
.thrust-panel:hover .thrust-icon {
  transform: translateY(-2px) scale(1.05);
}

/* Core Values Card Customizations */
#values .card-body .ms {
  font-size: 26px;
  margin-bottom: 12px;
  display: block;
}
#values .card-body .ms.blue { color: var(--blue-s2); }
#values .card-body .ms.orange { color: var(--orange); }
#values .card-body .ms.green { color: var(--green); }

#values .card-body h4 {
  font-size: 15px;
  font-weight: 600;
  color: var(--blue-s3);
  margin-bottom: 6px;
}
#values .card-body p {
  font-size: 13px;
  color: var(--text-body);
  line-height: 1.7;
  margin: 0;
}

/* ================================================================
   ZEN DESIGN REFACTORING (Remaining Theme Parts)
   ================================================================ */

/* News article card */
.news-article-card {
  background: var(--white);
  border-radius: var(--r-lg);
  overflow: hidden;
  border: 1px solid var(--border);
  box-shadow: var(--sh-sm);
  display: flex;
  flex-direction: column;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}
.news-article-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 40px rgba(13,30,19,0.11);
}

/* Researcher profile card */
.researcher-profile-card {
  background: white;
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  padding: 24px;
  display: flex;
  gap: 14px;
  align-items: flex-start;
  transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.22s cubic-bezier(0.16, 1, 0.3, 1);
}
.researcher-profile-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--sh-md);
}

/* Training track card */
.training-track-card {
  background: var(--white);
  border-radius: var(--r-lg);
  border: 1px solid var(--border);
  padding: 28px;
  box-shadow: var(--sh-sm);
  display: flex;
  gap: 18px;
  align-items: flex-start;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.training-track-card:hover {
  border-color: var(--orange);
  box-shadow: var(--sh-md);
}

/* Publication row link */
.pub-row-link {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding: 20px 24px;
  background: var(--white);
  text-decoration: none;
  transition: background 0.15s;
}
.pub-row-link:hover {
  background: var(--green-t1);
}

/* SharePoint / Staff Portal card */
.sharepoint-service-card {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: var(--r-lg);
  text-decoration: none;
  transition: background 0.2s, border-color 0.2s;
}
.sharepoint-service-card:hover {
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.2);
}
.sharepoint-service-card .ms {
  font-size: 22px;
  color: var(--text-green);
}
.sharepoint-service-card h5 {
  font-size: 13px;
  font-weight: 500;
  color: #fff;
  margin: 0;
}
.sharepoint-service-card p {
  font-size: 11.5px;
  color: rgba(255, 255, 255, 0.4);
  margin: 0;
}
.sharepoint-service-card .open-ico {
  font-size: 16px;
  color: rgba(255, 255, 255, 0.55);
  margin-left: auto;
}

/* Department hero card (Team page) */
.dept-hero-card {
  background: rgba(255, 255, 255, 0.06);
  padding: 36px 32px;
  display: flex;
  flex-direction: column;
  gap: 0;
  transition: background 0.2s;
}
.dept-hero-card:hover {
  background: rgba(31, 189, 227, 0.07);
}
.dept-hero-arrow-link {
  margin-top: 20px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  font-weight: 500;
  color: var(--blue);
  text-decoration: none;
  border-bottom: 1px solid rgba(31, 189, 227, 0.3);
  padding-bottom: 2px;
  width: fit-content;
  transition: gap 0.2s, border-color 0.2s;
}
.dept-hero-arrow-link:hover {
  gap: 12px;
  border-color: var(--blue);
}

/* Contact social link */
.contact-social-link {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 10px 14px;
  border-radius: var(--r);
  background: var(--white);
  border: 1px solid var(--border);
  color: var(--blue-s2);
  font-size: 13px;
  text-decoration: none;
  transition: border-color 0.2s, color 0.2s;
}
.contact-social-link:hover {
  border-color: var(--orange);
  color: var(--orange);
}
.contact-social-link .ms {
  font-size: 16px;
  color: var(--green-s1);
}

/* Service grid card */
.service-grid-card {
  background: var(--white);
  border-radius: var(--r-lg);
  border: 1px solid var(--border);
  padding: 24px;
  display: flex;
  gap: 14px;
  align-items: flex-start;
  text-decoration: none;
  box-shadow: var(--sh-sm);
  transition: border-color 0.2s, transform 0.2s;
}
.service-grid-card:hover {
  border-color: var(--orange);
  transform: translateY(-2px);
}

/* ==========================================================================
   PUBLICATION ARCHIVE — Zen Design
   ========================================================================== */

/* ── Page section wrapper ─────────────────────────────────────────────────── */
.pub-archive-section {
  background: white;
  padding: 52px 0 80px;
}

/* ── Type filter chips (top bar) ─────────────────────────────────────────── */
.pub-filter-form { margin-bottom: 0; }

.archive-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 28px 0 20px;
  border-bottom: 1px solid var(--border);
}

.filter-btn {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .10em;
  text-transform: uppercase;
  padding: 7px 16px;
  border-radius: 100px;
  border: 1px solid var(--border-2);
  background: var(--white);
  color: var(--text-body);
  cursor: pointer;
  transition: background .15s, border-color .15s, color .15s, transform .15s;
  white-space: nowrap;
}
.filter-btn:hover {
  background: white;
  border-color: var(--blue);
  color: var(--blue-s2);
  transform: translateY(-1px);
}
.filter-btn.active {
  background: var(--blue-s3);
  border-color: var(--blue-s3);
  color: #fff;
}

/* ── Secondary filters row ───────────────────────────────────────────────── */
.pub-filter-secondary {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  padding: 18px 0 22px;
  border-bottom: 1px solid var(--border);
}

.pub-select {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 13px;
  color: var(--text-dark);
  background: var(--white);
  border: 1px solid var(--border-2);
  border-radius: var(--r);
  padding: 8px 36px 8px 14px;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%230E6F87' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  cursor: pointer;
  transition: border-color .15s, box-shadow .15s;
  min-width: 160px;
}
.pub-select:focus {
  outline: none;
  border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(31,189,227,.15);
}

.pub-search-wrap {
  position: relative;
  flex: 1;
  min-width: 180px;
  max-width: 280px;
}
.pub-search-input {
  width: 100%;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 13px;
  padding: 8px 40px 8px 14px;
  border: 1px solid var(--border-2);
  border-radius: var(--r);
  background: var(--white);
  color: var(--text-dark);
  transition: border-color .15s, box-shadow .15s;
}
.pub-search-input::placeholder { color: rgba(14,111,135,.45); }
.pub-search-input:focus {
  outline: none;
  border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(31,189,227,.15);
}
.pub-search-btn {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  cursor: pointer;
  color: var(--blue-s1);
  display: flex;
  align-items: center;
  padding: 2px;
  transition: color .15s;
}
.pub-search-btn:hover { color: var(--blue-s3); }
.pub-search-btn .ms { font-size: 18px; }

.pub-sort-select { min-width: 140px; }

.pub-clear-filters {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--text-orange);
  text-decoration: none;
  padding: 7px 12px;
  border-radius: var(--r);
  border: 1px solid rgba(248,158,36,.25);
  background: var(--orange-t1);
  transition: background .15s, border-color .15s;
}
.pub-clear-filters:hover {
  background: var(--orange-t2);
  border-color: var(--orange);
  color: var(--text-orange);
}
.pub-clear-filters .ms { font-size: 14px; }

/* ── Result count ──────────────────────────────────────────────────────────  */
.pub-count {
  font-size: 12px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text-muted);
  padding: 16px 0 20px;
}

/* ── Publication card grid ────────────────────────────────────────────────── */
.pub-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 20px;
  margin-bottom: 44px;
}

/* ── Individual publication card ─────────────────────────────────────────── */
.pub-card {
  position: relative;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: var(--sh-sm);
  transition: transform .22s cubic-bezier(.16,1,.3,1),
              box-shadow .22s cubic-bezier(.16,1,.3,1),
              border-color .22s;
}
.pub-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--sh-md);
  border-color: var(--blue-t2);
}

/* Invisible full-card link overlay */
.pub-card-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
}

/* Thumbnail */
.pub-card-thumb {
  height: 160px;
  overflow: hidden;
  background: white;
  flex-shrink: 0;
}
.pub-card-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .35s cubic-bezier(.16,1,.3,1);
}
.pub-card:hover .pub-card-thumb img { transform: scale(1.04); }

/* Icon fallback (no thumbnail) */
.pub-card-icon {
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--blue-t1) 0%, var(--blue-t2) 100%);
  flex-shrink: 0;
}
.pub-card-icon .ms {
  font-size: 44px;
  color: var(--blue-s1);
  opacity: .6;
}

/* Card body */
.pub-card-body {
  padding: 20px 20px 16px;
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 8px;
}

/* Publication type tag */
.pub-type-tag {
  display: inline-block;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: 3px 10px;
  border-radius: 100px;
  background: white;
  color: var(--blue-s2);
  align-self: flex-start;
}
/* Type colour variants */
.pub-type-journal-article  { background: #E8F5E9; color: #2D5E22; }
.pub-type-technical-report { background: var(--orange-t1); color: var(--text-orange); }
.pub-type-policy-brief     { background: #EDE7F6; color: #4527A0; }
.pub-type-working-paper    { background: white; color: var(--blue-s2); }
.pub-type-field-guide      { background: #E0F2F1; color: #00695C; }
.pub-type-book-chapter     { background: #FFF3E0; color: #E65100; }
.pub-type-conference-paper { background: #FCE4EC; color: #880E4F; }

/* Card title */
.pub-card-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 15.5px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--text-dark);
  margin: 0;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  overflow: hidden;
}

/* Card snippet */
.pub-card-snippet {
  font-size: 12.5px;
  color: var(--text-body);
  line-height: 1.6;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  margin: 0;
}

/* Authors line */
.pub-card-authors {
  font-size: 11.5px;
  color: var(--text-muted);
  margin: 0;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  overflow: hidden;
  margin-top: auto;
}

/* Meta row: year · journal · OA badge */
.pub-card-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: var(--text-muted);
  padding-top: 8px;
  border-top: 1px solid var(--border);
  margin-top: 4px;
}
.pub-card-meta-sep { opacity: .4; }
.pub-card-journal {
  font-style: italic;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 11px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 140px;
}

/* Open Access badge */
.pub-oa-badge {
  display: inline-block;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: 2px 8px;
  border-radius: 100px;
  background: #E8F5E9;
  color: var(--text-green);
  border: 1px solid var(--green-t2);
  margin-left: auto;
}

/* Download PDF button — sits in top-right corner of card */
.pub-card-dl-btn {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.92);
  border: 1px solid var(--border-2);
  border-radius: 50%;
  color: var(--blue-s2);
  text-decoration: none;
  transition: background .15s, border-color .15s, transform .15s;
  backdrop-filter: blur(4px);
}
.pub-card-dl-btn:hover {
  background: var(--orange);
  border-color: var(--orange);
  color: #fff;
  transform: scale(1.1);
}
.pub-card-dl-btn .ms { font-size: 18px; }

/* ── Pagination ───────────────────────────────────────────────────────────── */
.pagination { display: flex; justify-content: center; padding: 8px 0 16px; }
.pagination .page-numbers {
  display: inline-flex;
  list-style: none;
  gap: 6px;
  flex-wrap: wrap;
  align-items: center;
}
.pagination .page-numbers li a,
.pagination .page-numbers li span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 8px 16px;
  border-radius: var(--r);
  border: 1px solid var(--border-2);
  background: var(--white);
  color: var(--text-body);
  font-size: 13px;
  text-decoration: none;
  transition: background .15s, border-color .15s, color .15s;
}
.pagination .page-numbers li a:hover {
  background: white;
  border-color: var(--blue);
  color: var(--blue-s2);
}
.pagination .page-numbers li .current {
  background: var(--blue-s3);
  border-color: var(--blue-s3);
  color: #fff;
  font-weight: 600;
}
.pagination .page-numbers li .dots {
  border-color: transparent;
  background: transparent;
  color: var(--text-muted);
}

/* ── Responsive ───────────────────────────────────────────────────────────── */
@media (max-width: 900px) {
  .pub-grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
}
@media (max-width: 640px) {
  .archive-filter { padding: 20px 0 16px; gap: 6px; }
  .pub-filter-secondary { gap: 8px; }
  .pub-search-wrap { max-width: 100%; }
  .pub-select { min-width: 130px; font-size: 12px; }
  .pub-grid { grid-template-columns: 1fr; }
  .pub-card-thumb { height: 140px; }
}

/* ==========================================================================
   TRAINING PAGE — Zen Design Refactoring
   ========================================================================== */

/* ── About Section ── */
.training-about-grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 60px;
  align-items: start;
}
@media (max-width: 900px) {
  .training-about-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }
}

.training-stats-card {
  background: var(--blue-s3);
  border-radius: var(--r-xl);
  padding: 36px 32px;
  box-shadow: var(--sh-md);
  border: 1px solid rgba(255, 255, 255, 0.05);
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.training-stats-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--sh-lg);
}
.training-stats-card .stats-title {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9.5px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--orange-s1);
  margin-bottom: 20px;
}
.training-stats-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.training-stat-item {
  display: flex;
  flex-direction: column;
}
.training-stat-num {
  font-family: 'Cormorant Garamond', serif;
  font-size: 2.3rem;
  font-weight: 600;
  color: var(--white);
  line-height: 1;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  display: inline-block;
}
.training-stat-item:hover .training-stat-num {
  transform: scale(1.06);
}
.training-stat-label {
  font-size: 10px;
  color: rgba(255, 255, 255, 0.6);
  font-family: 'Plus Jakarta Sans', sans-serif;
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-top: 6px;
}

/* Training Sidebar Card Target Trainees Section */
.training-card-divider {
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  margin: 28px 0 24px;
}
.training-card-target .target-title {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9.5px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--orange-s1);
  margin-bottom: 10px;
}
.training-card-target p {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.75);
  line-height: 1.7;
  margin: 0;
  font-weight: 300;
}

/* ── Short Courses Tracks ── */
.training-tracks-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 28px;
  margin-top: 44px;
}
@media (max-width: 768px) {
  .training-tracks-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

.track-icon-wrapper {
  width: 46px;
  height: 46px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  flex-shrink: 0;
  box-shadow: var(--sh-sm);
  transition: transform 0.25s ease;
}
.training-track-card:hover .track-icon-wrapper {
  transform: scale(1.05);
}

.track-icon-wrapper.gis {
  background: var(--green-t1);
  color: var(--text-green);
  border: 1px solid rgba(74, 154, 57, 0.15);
}
.track-icon-wrapper.hydro {
  background: var(--orange-t1);
  color: var(--orange);
  border: 1px solid rgba(248, 158, 36, 0.15);
}
.track-icon-wrapper.rangeland {
  background: white;
  color: var(--blue-s2);
  border: 1px solid rgba(31, 189, 227, 0.15);
}
.track-icon-wrapper.research {
  background: var(--green-t1);
  color: var(--text-green);
  border: 1px solid rgba(74, 154, 57, 0.15);
}

.training-track-card h4 {
  font-size: 15px;
  font-weight: 600;
  color: var(--blue-s3);
  margin-bottom: 6px;
}
.training-track-card p {
  font-size: 13px;
  color: var(--text-body);
  line-height: 1.7;
  margin: 0;
}

/* ── Open Courses ── */
.courses-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 40px;
}
@media (max-width: 992px) {
  .courses-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 768px) {
  .courses-grid {
    grid-template-columns: 1fr;
  }
}

.course-card {
  background: var(--white);
  border-radius: var(--r-xl);
  border: 1px solid var(--border);
  box-shadow: var(--sh-sm);
  padding: 32px 28px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.25s;
}
.course-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--sh-md);
  border-color: var(--orange-t2);
}
.course-card-meta-wrap {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.course-card-date {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9.5px;
  color: var(--text-muted);
}

/* ── Academic Section ── */
.academic-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  margin-top: 44px;
}
@media (max-width: 900px) {
  .academic-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

.academic-level-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  padding: 36px 30px;
  box-shadow: var(--sh-sm);
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.25s;
  display: flex;
  flex-direction: column;
}
.academic-level-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--sh-md);
  border-color: var(--green);
}
.academic-level-card .ms {
  font-size: 26px;
  color: var(--green-s1);
  margin-bottom: 18px;
  display: block;
}
.academic-level-card h3 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--text-dark);
  margin-bottom: 12px;
  line-height: 1.2;
}
.academic-level-card p {
  font-size: 13px;
  color: var(--text-body);
  line-height: 1.75;
  margin: 0;
}

.academic-partners-panel {
  margin-top: 36px;
  background: var(--white);
  border-radius: var(--r-xl);
  padding: 32px 36px;
  border: 1px solid var(--border);
  box-shadow: var(--sh-sm);
}
.academic-partners-title {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9.5px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--text-orange);
  margin-bottom: 18px;
}
.academic-partners-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.academic-partner-tag {
  background: var(--green-t1);
  border: 1px solid rgba(74, 154, 57, 0.12);
  border-radius: var(--r);
  padding: 6px 14px;
  font-size: 12px;
  color: var(--text-green);
  transition: background 0.2s, border-color 0.2s, color 0.2s;
  cursor: default;
}
.academic-partner-tag:hover {
  background: var(--green-t2);
  border-color: var(--green);
}

/* ── Enroll CTA Section ── */
.enroll-cta-card {
  max-width: 780px;
  margin: 0 auto;
  text-align: center;
  background: var(--orange-t1);
  border: 1px solid rgba(248, 158, 36, 0.2);
  border-radius: var(--r-xl);
  padding: 52px 48px;
  box-shadow: var(--sh-sm);
}
.enroll-cta-card .eyebrow {
  justify-content: center;
}
.enroll-btns {
  margin-top: 32px;
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
}
@media (max-width: 640px) {
  .enroll-cta-card {
    padding: 36px 24px;
  }
}

/* ── Alumni Section ── */
.alumni-wrapper {
  display: flex;
  gap: 16px;
  margin-top: 28px;
  flex-wrap: wrap;
  align-items: center;
}
@media (max-width: 640px) {
  .alumni-wrapper {
    gap: 12px;
  }
}

/* ==========================================================================
   DEPARTMENTS PAGE — Zen Design Refactoring
   ========================================================================== */

/* ── Departments List Grid (Team / Homepage) ── */
.dept-hero-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2px;
  background: rgba(31, 189, 227, 0.1);
  border-radius: var(--r-xl);
  overflow: hidden;
  margin-top: 44px;
}
@media (max-width: 768px) {
  .dept-hero-grid {
    grid-template-columns: 1fr;
  }
}

.dept-hero-icon-wrapper {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  background: rgba(31, 189, 227, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 18px;
  transition: transform 0.25s ease;
}
.dept-hero-card:hover .dept-hero-icon-wrapper {
  transform: scale(1.05);
}
.dept-hero-icon-wrapper .ms {
  font-size: 22px;
  color: var(--blue);
}

.dept-hero-card h3 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--white);
  line-height: 1.25;
  margin-bottom: 10px;
}
.dept-hero-card p {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.72);
  line-height: 1.8;
  flex: 1;
  margin: 0;
}
.dept-hero-arrow-link .ms {
  font-size: 14px;
}

.dept-last-updated {
  font-size: 10.5px;
  color: rgba(255, 255, 255, 0.3);
  margin-top: 18px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  text-align: right;
}

/* ── Single Department Template ── */
.dept-layout-grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 64px;
  align-items: start;
}
@media (max-width: 900px) {
  .dept-layout-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }
}

.dept-about-content {
  margin-bottom: 32px;
  line-height: 1.8;
}

.dept-head-card {
  margin-top: 32px;
  padding: 20px 24px;
  background: white;
  border-radius: var(--r-xl);
  border: 1px solid var(--border);
  display: flex;
  align-items: center;
  gap: 16px;
  box-shadow: var(--sh-sm);
}
.dept-head-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--blue-s3);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: var(--sh-sm);
}
.dept-head-avatar .ms {
  font-size: 20px;
  color: var(--blue);
}
.dept-head-kicker {
  font-size: 9.5px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--text-orange);
  margin-bottom: 3px;
}
.dept-head-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-dark);
}
.dept-head-title {
  font-size: 12px;
  color: var(--text-body);
  margin-top: 1px;
}

.dept-info-sidebar {
  background: var(--blue-s3);
  border-radius: var(--r-xl);
  padding: 40px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  box-shadow: var(--sh-md);
  border: 1px solid rgba(255, 255, 255, 0.05);
}
.dept-info-icon-wrapper {
  width: 60px;
  height: 60px;
  border-radius: 14px;
  background: rgba(31, 189, 227, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: var(--sh-sm);
  transition: transform 0.25s ease;
}
.dept-info-sidebar:hover .dept-info-icon-wrapper {
  transform: scale(1.05);
}
.dept-info-icon-wrapper .ms {
  font-size: 30px;
  color: var(--blue);
}
.dept-info-sidebar h3 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--white);
  line-height: 1.2;
}

.dept-info-row {
  display: flex;
  align-items: center;
  gap: 12px;
}
.dept-info-row.first {
  padding-top: 16px;
  border-top: 1px solid rgba(31, 189, 227, 0.12);
}
.dept-info-row .ms {
  font-size: 18px;
  color: var(--blue);
}
.dept-info-row span,
.dept-info-row a {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.75);
}
.dept-info-row a {
  text-decoration: none;
  transition: color 0.2s;
}
.dept-info-row a:hover {
  color: var(--blue);
}

.dept-staff-grid-wrapper {
  margin-top: 40px;
}

.dept-cta-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 28px;
}
.dept-cta-buttons {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

/* ==========================================================================
   SERVICES PAGE — Zen Design Refactoring
   ========================================================================== */

/* ── Services Grid section ── */
.services-nav-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
@media (max-width: 900px) {
  .services-nav-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 600px) {
  .services-nav-grid {
    grid-template-columns: 1fr;
  }
}

.service-grid-card .icon-box {
  background: var(--off-white);
  border: 1px solid var(--border);
  transition: transform .3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow .3s ease;
}
.service-grid-card.consultancy .icon-box {
  background: var(--green-t1);
  border-color: var(--green-t2);
}
.service-grid-card.publications .icon-box {
  background: var(--orange-t1);
  border-color: var(--orange-t2);
}
.service-grid-card.database .icon-box {
  background: var(--blue-t1);
  border-color: var(--blue-t2);
}
.service-grid-card.briefs .icon-box {
  background: var(--green-t1);
  border-color: var(--green-t2);
}
.service-grid-card.gis .icon-box {
  background: var(--off-white);
  border-color: var(--border);
}
.service-grid-card.training .icon-box {
  background: var(--orange-t1);
  border-color: var(--orange-t2);
}

.service-grid-card:hover .icon-box {
  transform: scale(1.08);
}

.service-grid-card .ms {
  font-size: 22px;
  flex-shrink: 0;
}
.service-grid-card.consultancy .ms { color: var(--green-s1); }
.service-grid-card.publications .ms { color: var(--orange); }
.service-grid-card.database .ms { color: var(--blue-s2); }
.service-grid-card.briefs .ms { color: var(--green-s1); }
.service-grid-card.gis .ms { color: var(--text-body); }
.service-grid-card.training .ms { color: var(--orange); }

.service-grid-card h4 {
  font-size: 14px;
  font-weight: 600;
  color: var(--blue-s3);
  margin-bottom: 4px;
}
.service-grid-card p {
  font-size: 12.5px;
  color: var(--text-body);
  margin: 0;
}

/* ── Consultancy section ── */
.consultancy-list {
  margin-top: 32px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.consultancy-item {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  background: var(--white);
  border-radius: var(--r-lg);
  border: 1px solid var(--border);
  transition: transform 0.2s, box-shadow 0.2s;
}
.consultancy-item:hover {
  transform: translateX(4px);
  box-shadow: var(--sh-sm);
}
.consultancy-item .ms {
  font-size: 20px;
  color: var(--green-s1);
  flex-shrink: 0;
}
.consultancy-item-label {
  font-size: 13.5px;
  color: var(--blue-s2);
}
.consultancy-cta-wrapper {
  margin-top: 24px;
}

/* ── GIS Sidebar Card ── */
.gis-service-card {
  background: var(--blue-s3);
  border-radius: var(--r-xl);
  padding: 36px;
  color: var(--white);
  box-shadow: var(--sh-md);
  border: 1px solid rgba(255, 255, 255, 0.05);
}
.gis-service-card .kicker {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9.5px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--orange-s1);
  margin-bottom: 18px;
}
.gis-service-card h3 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--white);
  margin-bottom: 14px;
}
.gis-service-card p {
  font-size: 13.5px;
  color: rgba(255, 255, 255, 0.75);
  line-height: 1.8;
  margin-bottom: 20px;
}
.gis-features-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.gis-feature-item {
  display: flex;
  gap: 10px;
  align-items: center;
}
.gis-feature-item .ms {
  font-size: 18px;
  color: var(--text-green);
  flex-shrink: 0;
}
.gis-feature-item span {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.6);
}
.gis-service-card .arrow-link {
  color: var(--white);
}
.gis-service-card .arrow-link:hover {
  color: var(--orange-t2);
}

/* ── Database section ── */
#database .icon-box {
  background: var(--blue-t1);
  color: var(--blue-s2);
  border: 1px solid var(--blue-t2);
  transition: transform .3s cubic-bezier(0.16, 1, 0.3, 1);
}
#database .card:hover .icon-box {
  transform: scale(1.08);
}

/* ── Publications Row Section ── */
.publications-list-container {
  display: flex;
  flex-direction: column;
  gap: 2px;
  background: rgba(45, 94, 34, 0.1);
  border-radius: var(--r-xl);
  overflow: hidden;
  margin-top: 40px;
}
.pub-row-icon-badge {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  background: var(--green-t1);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--text-green);
}
.pub-row-icon-badge .ms {
  font-size: 18px;
}
.pub-row-tag {
  display: inline-flex;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9px;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: 2px 7px;
  border-radius: 4px;
  background: var(--green-t1);
  color: var(--text-green);
  margin-bottom: 6px;
}
.pub-row-link h4 {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--text-dark);
  line-height: 1.45;
  margin-bottom: 5px;
}
.pub-row-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  font-size: 11.5px;
  color: var(--text-muted);
  font-family: 'Plus Jakarta Sans', sans-serif;
}
.pub-row-meta-dot {
  opacity: .4;
}
.pub-row-meta-tag {
  display: inline-flex;
  align-items: center;
  background: var(--green-t1);
  color: var(--text-green);
  font-size: 9px;
  letter-spacing: .07em;
  text-transform: uppercase;
  padding: 2px 6px;
  border-radius: 4px;
}
.pub-row-download {
  color: var(--blue-s2);
  display: flex;
  align-items: center;
  gap: 2px;
}
.pub-row-download .ms {
  font-size: 12px;
}
.pub-row-arrow {
  font-size: 18px;
  color: var(--text-body);
  flex-shrink: 0;
  margin-top: 2px;
}

/* Publications Fallback */
.publications-fallback-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 40px;
}
@media (max-width: 768px) {
  .publications-fallback-grid {
    grid-template-columns: 1fr;
  }
}
.publications-fallback-card {
  background: var(--white);
  border-radius: var(--r-lg);
  border: 1px solid var(--border);
  padding: 24px;
  box-shadow: var(--sh-sm);
}
.publications-fallback-card .ms {
  font-size: 26px;
  margin-bottom: 14px;
  display: block;
}
.publications-fallback-card .ms.blue {
  color: var(--blue-s2);
}
.publications-fallback-card .ms.orange {
  color: var(--orange);
}
.publications-fallback-card .ms.green {
  color: var(--green-s1);
}
.publications-fallback-card h4 {
  font-size: 15px;
  font-weight: 600;
  color: var(--blue-s3);
  margin-bottom: 8px;
}
.publications-fallback-card p {
  font-size: 13px;
  color: var(--text-body);
  line-height: 1.7;
  margin: 0;
}
.publications-btn-wrapper {
  margin-top: 28px;
}

/* ── Databases Grid ── */
.database-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px;
  background: rgba(14, 111, 135, 0.08);
  border-radius: var(--r-xl);
  overflow: hidden;
  margin-top: 44px;
}
@media (max-width: 900px) {
  .database-grid {
    grid-template-columns: 1fr;
  }
}
.database-card {
  background: white;
  padding: 32px 28px;
}
.database-card .ms {
  font-size: 24px;
  color: var(--text-green);
  margin-bottom: 16px;
  display: block;
}
.database-card h3 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--text-dark);
  margin-bottom: 10px;
}
.database-card p {
  font-size: 13px;
  color: var(--text-body);
  line-height: 1.75;
  margin: 0;
}
.database-card-link {
  color: var(--blue-s2);
  border-color: rgba(14, 111, 135, 0.3);
  margin-top: 16px;
  display: inline-flex;
}

/* ── Briefs & Guides Section ── */
.briefs-buttons-wrapper {
  margin-top: 32px;
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  align-items: center;
}

/* ==========================================================================
   RESEARCH PAGE — Zen Design Refactoring
   ========================================================================== */

/* ── Overview Stats Section ── */
.research-overview-grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 60px;
  align-items: center;
}
@media (max-width: 900px) {
  .research-overview-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }
}

.research-stats-card {
  background: var(--blue-s3);
  border-radius: var(--r-xl);
  padding: 36px;
  color: var(--white);
  box-shadow: var(--sh-md);
  border: 1px solid rgba(255, 255, 255, 0.05);
}
.research-stats-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.research-stats-num {
  font-family: 'Cormorant Garamond', serif;
  font-size: 2.2rem;
  font-weight: 600;
  color: var(--blue);
  line-height: 1;
}
.research-stats-label {
  font-size: 10.5px;
  color: rgba(255, 255, 255, 0.5);
  font-family: 'Plus Jakarta Sans', sans-serif;
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-top: 6px;
}

/* ── Thrust Pillars Grid ── */
.research-thrust-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2px;
  background: rgba(14, 111, 135, 0.1);
  border-radius: var(--r-xl);
  overflow: hidden;
  margin-top: 44px;
}
@media (max-width: 768px) {
  .research-thrust-grid {
    grid-template-columns: 1fr;
  }
}

.research-thrust-card {
  background: white;
  padding: 40px 36px;
}
.research-thrust-card .ms {
  font-size: 28px;
  color: var(--green-s1);
  margin-bottom: 20px;
  display: block;
}
.research-thrust-card h3 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--text-dark);
  margin-bottom: 12px;
}
.research-thrust-card p {
  font-size: 13.5px;
  color: var(--text-body);
  line-height: 1.8;
  margin: 0;
}
.research-thrust-tags {
  margin-top: 20px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

/* ── Current Projects Grid ── */
.research-projects-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-top: 44px;
}
@media (max-width: 768px) {
  .research-projects-grid {
    grid-template-columns: 1fr;
  }
}

.research-project-card {
  background: var(--white);
  border-radius: var(--r-xl);
  border: 1px solid var(--border);
  padding: 36px;
  box-shadow: var(--sh-sm);
  transition: transform 0.2s, box-shadow 0.2s;
}
.research-project-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--sh-md);
}
.research-project-card .tag {
  margin-bottom: 14px;
}
.research-project-card h4 {
  font-size: 17px;
  font-weight: 600;
  color: var(--blue-s3);
  margin-bottom: 10px;
}
.research-project-card p {
  font-size: 13.5px;
  color: var(--text-body);
  line-height: 1.75;
  margin-bottom: 20px;
}

/* ── Past Projects Section ── */
.past-projects-panel {
  margin-top: 32px;
  background: var(--white);
  border-radius: var(--r-xl);
  border: 1px solid var(--border);
  padding: 36px;
  box-shadow: var(--sh-sm);
}
.past-projects-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.past-project-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  background: white;
  border-radius: var(--r-lg);
  border: 1px solid var(--border);
  transition: transform 0.2s;
}
.past-project-row:hover {
  transform: translateX(4px);
}
.past-project-row-title {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--blue-s3);
}
.past-project-row-desc {
  font-size: 11.5px;
  color: var(--text-body);
  margin-top: 2px;
}
.past-project-row .ms {
  color: var(--blue);
  font-size: 18px;
}

/* ── Food Sustainability Box ── */
.food-sust-box {
  background: var(--white);
  border-radius: var(--r-xl);
  padding: 32px;
  border: 1px solid var(--border);
  box-shadow: var(--sh-lg);
}
.food-sust-box h4 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--blue-s3);
  margin-bottom: 14px;
}
.food-sust-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 0;
  margin: 0;
}
.food-sust-item .ms {
  color: var(--green-s1);
  font-size: 18px;
  flex-shrink: 0;
  margin-top: 1px;
}

/* ==========================================================================
   NEWSROOM & COMPONENT SECTION — Zen Design Refactoring
   ========================================================================== */

/* ── Newsroom Search Section ── */
.newsroom-search-section {
  background: var(--off-white);
  padding: 40px 0 20px;
}

.newsroom-search-wrapper {
  max-width: 600px;
  margin: 0 auto;
}

.newsroom-search-form {
  display: flex;
  gap: 12px;
  align-items: center;
}

.newsroom-search-input-wrapper {
  position: relative;
  flex: 1;
}

.newsroom-search-icon {
  position: absolute;
  left: 16px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--text-muted);
  font-size: 20px;
  pointer-events: none;
  transition: color 0.25s ease;
}

.newsroom-search-input {
  width: 100%;
  padding: 12px 16px 12px 46px;
  font-size: 15px;
  font-family: inherit;
  border: 1.5px solid var(--border-2);
  border-radius: var(--r-lg);
  background: var(--white);
  color: var(--text-primary);
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: var(--sh-sm);
  min-height: 48px;
}

.newsroom-search-input::placeholder {
  color: var(--text-muted);
  font-weight: 300;
}

.newsroom-search-input:hover {
  border-color: var(--blue-t3);
  box-shadow: 0 2px 8px rgba(31, 189, 227, 0.08);
}

.newsroom-search-input:focus {
  outline: none;
  border-color: var(--blue);
  box-shadow: 0 0 0 4px rgba(31, 189, 227, 0.15);
  background: #fafbfc;
}

.newsroom-search-input:focus + .newsroom-search-icon {
  color: var(--blue);
}

.newsroom-search-btn {
  height: 48px;
  padding: 0 24px;
  border-radius: var(--r-lg);
  font-size: 14.5px;
  font-weight: 600;
  box-shadow: var(--sh-sm);
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

.newsroom-search-btn:hover {
  transform: translateY(-1px);
  box-shadow: var(--sh-md);
}

.newsroom-search-btn:active {
  transform: translateY(0);
}

@media (max-width: 600px) {
  .newsroom-search-form {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }
  .newsroom-search-btn {
    width: 100%;
  }
}

/* ── Newsroom Featured Article ── */
.newsroom-featured-section {
  background: var(--off-white);
  padding: 40px 0 60px;
}

.newsroom-featured-card {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 56px;
  background: var(--blue-s3);
  border-radius: var(--r-xl);
  padding: 56px;
  align-items: center;
  overflow: hidden;
  box-shadow: var(--sh-lg);
  position: relative;
}

.newsroom-featured-content {
  display: flex;
  flex-direction: column;
  color: var(--white);
}

.newsroom-featured-eyebrow.eyebrow {
  color: var(--orange);
  margin-bottom: 20px;
}

.newsroom-featured-eyebrow.eyebrow::before {
  background: var(--orange);
}

.newsroom-featured-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(2rem, 3.5vw, 2.5rem);
  font-weight: 500;
  line-height: 1.2;
  margin-bottom: 18px;
  letter-spacing: -0.01em;
}

.newsroom-featured-title a {
  color: var(--white);
  text-decoration: none;
  transition: color 0.25s ease;
}

.newsroom-featured-title a:hover {
  color: var(--orange);
}

.newsroom-featured-excerpt {
  color: var(--blue-t2);
  font-size: 15px;
  line-height: 1.75;
  margin-bottom: 28px;
  font-weight: 300;
}

.newsroom-featured-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 32px;
}

.newsroom-featured-author-avatar img {
  border-radius: 50%;
  border: 1.5px solid var(--orange);
  display: block;
}

.newsroom-featured-author-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.newsroom-featured-author-name {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--white);
}

.newsroom-featured-date {
  font-size: 11px;
  color: var(--blue-t2);
  font-family: 'Plus Jakarta Sans', sans-serif;
  letter-spacing: 0.02em;
}

.newsroom-featured-media {
  width: 100%;
  height: 100%;
  aspect-ratio: 16/10;
  overflow: hidden;
  border-radius: var(--r-lg);
  box-shadow: var(--sh-md);
  position: relative;
  background: var(--blue-s2);
}

.newsroom-featured-image-link {
  display: block;
  width: 100%;
  height: 100%;
}

.newsroom-featured-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.newsroom-featured-card:hover .newsroom-featured-image {
  transform: scale(1.04);
}

.newsroom-featured-image-fallback {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.15);
}

.newsroom-featured-image-fallback .ms {
  font-size: 64px;
}

@media (max-width: 900px) {
  .newsroom-featured-card {
    grid-template-columns: 1fr;
    gap: 36px;
    padding: 36px;
  }
  .newsroom-featured-media {
    order: -1;
    aspect-ratio: 16/9;
  }
  .newsroom-featured-title {
    font-size: 1.85rem;
  }
}


/* ── Section Header ── */
.newsroom-section-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 40px;
}
@media (max-width: 600px) {
  .newsroom-section-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 28px;
  }
}

/* ── News Articles Grid ── */
.newsroom-articles-grid {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr;
  gap: 22px;
}
@media (max-width: 900px) {
  .newsroom-articles-grid {
    grid-template-columns: 1fr;
  }
}

.news-article-card {
  display: flex;
  flex-direction: column;
  background: var(--white);
  border-radius: var(--r-xl);
  border: 1px solid var(--border);
  box-shadow: var(--sh-sm);
  overflow: hidden;
  transition: transform 0.2s, box-shadow 0.2s;
}
.news-article-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--sh-md);
}

.news-article-thumb-wrapper {
  aspect-ratio: 16/9;
  overflow: hidden;
  background: var(--blue-s3);
}
.news-article-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.news-article-thumb-fallback {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.2);
}
.news-article-thumb-fallback .ms {
  font-size: 48px;
}

.news-article-content {
  padding: 20px 22px 18px;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.news-article-tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9px;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: 3px 8px;
  border-radius: 4px;
  background: rgba(42, 82, 54, 0.1);
  color: var(--text-body);
  margin-bottom: 10px;
  align-self: flex-start;
}
.news-article-tag .ms {
  font-size: 11px;
}
.news-article-title {
  font-weight: 500;
  color: var(--blue-s3);
  line-height: 1.45;
  flex: 1;
}
.news-article-card:nth-child(1) .news-article-title {
  font-size: 15px;
  margin-bottom: 14px;
}
.news-article-card:not(:nth-child(1)) .news-article-title {
  font-size: 14px;
  margin-bottom: 12px;
}

.news-article-footer {
  font-size: 10.5px;
  color: var(--text-body);
  border-top: 1px solid var(--border);
  display: flex;
  align-items: center;
  gap: 5px;
  font-family: 'Plus Jakarta Sans', sans-serif;
}
.news-article-card:nth-child(1) .news-article-footer {
  padding-top: 12px;
}
.news-article-card:not(:nth-child(1)) .news-article-footer {
  padding-top: 10px;
}
.news-article-footer .ms {
  font-size: 13px;
}
.news-article-footer a {
  color: var(--orange);
  text-decoration: none;
}

/* ── Notices Section ── */
.newsroom-notices-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.newsroom-notice-card {
  background: var(--white);
  border-radius: var(--r-lg);
  border: 1px solid var(--border);
  padding: 22px 24px;
  display: flex;
  gap: 20px;
  align-items: flex-start;
  box-shadow: var(--sh-sm);
  transition: transform 0.2s;
}
.newsroom-notice-card:hover {
  transform: translateX(4px);
}
@media (max-width: 600px) {
  .newsroom-notice-card {
    flex-direction: column;
    gap: 14px;
  }
}

.newsroom-notice-date {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9px;
  color: var(--text-body);
  border-radius: var(--r);
  padding: 8px 10px;
  text-align: center;
  flex-shrink: 0;
  min-width: 56px;
}
.newsroom-notice-year {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--blue-s3);
  line-height: 1;
}
.newsroom-notice-title {
  font-size: 14.5px;
  font-weight: 500;
  color: var(--blue-s3);
  margin-bottom: 6px;
}
.newsroom-notice-title a {
  color: inherit;
  text-decoration: none;
}
.newsroom-notice-desc {
  font-size: 13px;
  color: var(--text-body);
  line-height: 1.7;
  margin: 0;
}

/* ── Newsletter Component ── */
.newsletter-container {
  max-width: 560px;
  margin: 0 auto;
  text-align: center;
}
.newsletter-desc {
  font-size: 14.5px;
  color: var(--text-body);
  font-weight: 300;
  line-height: 1.8;
  margin-top: 14px;
}
.newsletter-form {
  margin-top: 28px;
}
.newsletter-form-wrapper {
  display: flex;
  gap: 0;
  max-width: 420px;
  margin: 0 auto;
}
.newsletter-input {
  flex: 1;
  min-width: 200px;
  padding: 12px 16px;
  border: 1.5px solid var(--border-2);
  border-radius: var(--r);
  background: var(--white);
  color: var(--text-dark);
  font-size: 13.5px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  outline: none;
  transition: border-color .2s, box-shadow .2s;
}
.newsletter-input:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(31,189,227,.15);
}
.newsletter-submit-btn {
  border-radius: 0 var(--r) var(--r) 0;
  margin: 0;
  flex-shrink: 0;
}
.newsletter-msg {
  min-height: 18px;
  margin-top: 10px;
  font-size: 13px;
}
.newsletter-note {
  font-size: 11px;
  color: var(--text-muted);
  margin-top: 8px;
  font-family: 'Plus Jakarta Sans', sans-serif;
}

/* ── Gallery Component ── */
.newsroom-gallery-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
@media (max-width: 768px) {
  .newsroom-gallery-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 480px) {
  .newsroom-gallery-grid {
    grid-template-columns: 1fr;
  }
}

.newsroom-gallery-item {
  border-radius: var(--r-lg);
  overflow: hidden;
  aspect-ratio: 1;
}
.newsroom-gallery-item svg {
  width: 100%;
  height: 100%;
  display: block;
}

/* ── Downloads Component ── */
.downloads-cta-wrapper {
  margin-top: 28px;
}

/* ==========================================================================
   CONTACT US PAGE — Zen Design Refactoring
   ========================================================================== */

/* ── Grid Layouts ── */
.contact-layout-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: start;
}
@media (max-width: 900px) {
  .contact-layout-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }
}

.contact-details-list {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-top: 32px;
}

.contact-detail-card {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding: 20px;
  background: var(--white);
  border-radius: var(--r-lg);
  border: 1px solid var(--border);
  box-shadow: var(--sh-sm);
  transition: transform 0.2s, box-shadow 0.2s;
}
.contact-detail-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--sh-md);
}
.contact-detail-card .ms {
  font-size: 22px;
  color: var(--orange);
  flex-shrink: 0;
  margin-top: 2px;
}

.contact-detail-label {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9.5px;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--text-body);
  margin-bottom: 6px;
}
.contact-detail-text {
  font-size: 14px;
  color: var(--blue-s2);
  line-height: 1.7;
  margin: 0;
}
.contact-detail-card a {
  font-size: 15px;
  color: var(--blue-s2);
  text-decoration: none;
  font-weight: 500;
}
.contact-detail-card a[href^="mailto:"] {
  color: var(--text-body);
}

.contact-social-label {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9.5px;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--text-body);
  margin-bottom: 14px;
}
.contact-social-list {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

/* ── Map Card ── */
.contact-map-card {
  background: var(--blue-s3);
  border-radius: var(--r-xl);
  overflow: hidden;
  box-shadow: var(--sh-lg);
  margin-bottom: 24px;
}

/* ── Form Card ── */
.contact-form-card {
  background: var(--white);
  border-radius: var(--r-xl);
  border: 1px solid var(--border);
  padding: 32px;
  box-shadow: var(--sh-sm);
}
.contact-form-label {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9.5px;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--text-orange);
  margin-bottom: 20px;
}
.contact-form {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.contact-form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
@media (max-width: 480px) {
  .contact-form-row {
    grid-template-columns: 1fr;
    gap: 14px;
  }
}

.contact-input-label {
  display: block;
  font-size: 11px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--text-body);
  margin-bottom: 6px;
}
.contact-input {
  width: 100%;
  padding: 12px 16px;
  border: 1.5px solid var(--border-2);
  border-radius: var(--r);
  font-size: 13.5px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: var(--text-dark);
  background: var(--white);
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;
}
.contact-input:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(31,189,227,.15);
}
.contact-input:disabled,
.app-form-group input:disabled,
.app-form-group select:disabled,
.app-form-group textarea:disabled,
.newsletter-input:disabled {
  background: var(--off-white) !important;
  border-color: rgba(31,189,227,.12) !important;
  color: rgba(7,61,74,.35) !important;
  cursor: not-allowed;
}
.contact-input.error,
.app-form-group input.error,
.app-form-group select.error,
.app-form-group textarea.error {
  border-color: #C0392B !important;
  border-left: 3px solid #C0392B !important;
}
.contact-input.valid,
.app-form-group input.valid,
.app-form-group select.valid,
.app-form-group textarea.valid {
  border-color: var(--green-s2) !important;
}
textarea.contact-input {
  resize: vertical;
}

.contact-form-msg {
  min-height: 18px;
  font-size: 13px;
  margin: 0;
}

/* ── Enquiries Grid ── */
.contact-enquiries-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px;
  background: var(--orange-t1);
  border-radius: var(--r-xl);
  overflow: hidden;
}
@media (max-width: 900px) {
  .contact-enquiries-grid {
    grid-template-columns: 1fr;
    gap: 2px;
  }
}

.contact-enquiry-card {
  padding: 36px 28px;
  text-align: center;
}
.contact-enquiry-card .ms {
  font-size: 28px;
  color: var(--orange-s1);
  display: block;
  margin-bottom: 12px;
}
.contact-enquiry-card h4 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--text-dark);
  margin-bottom: 8px;
}
.contact-enquiry-card p {
  font-size: 13px;
  color: var(--text-body);
  line-height: 1.65;
  margin: 0;
}
.contact-enquiry-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 14px;
  font-size: 12px;
  color: var(--orange-s1);
  text-decoration: none;
  border-bottom: 1px solid rgba(181, 98, 31, 0.35);
  padding-bottom: 2px;
  transition: opacity 0.2s;
}
.contact-enquiry-link:hover {
  opacity: 0.8;
}
.contact-enquiry-link .ms {
  font-size: 14px;
  display: inline;
  margin-bottom: 0;
}

/* ── Contact Details & Form Extension (Consolidated) ──────────────────────── */
.contact-section {
  background: white;
}
.contact-social-section {
  margin-top: 28px;
}
.contact-social-list .arrow-link {
  font-size: 12px;
}
.contact-social-list .arrow-link .ms {
  font-size: 14px;
}
.contact-map-svg {
  width: 100%;
  display: block;
}
.contact-form-success-container {
  display: none;
}
.contact-form-success-icon {
  font-size: 20px;
  flex-shrink: 0;
}
.contact-form-required-star {
  color: var(--text-orange);
}
select.contact-input {
  height: 44px;
}
.contact-form-honeypot {
  display: none;
}
.contact-form-message-alert {
  display: none;
}
.contact-form-submit-btn {
  justify-content: center;
}

/* ==========================================================================
   TEAM PAGE — Zen Design Refactoring
   ========================================================================== */

/* ── Staff / Leadership ── */
.team-api-notice {
  margin-top: 32px;
}
.team-employees-meta {
  margin-top: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
}
.team-employees-meta span {
  font-size: 10.5px;
  color: var(--text-muted);
  font-family: 'Plus Jakarta Sans', sans-serif;
}

/* ── Refined Team Cards & Grids ── */
.team-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 24px;
  margin-top: 40px;
}
.team-card {
  position: relative;
  width: 100%;
  aspect-ratio: 3 / 4; /* Standard elegant portrait ratio */
  min-height: 400px;
  border-radius: var(--r-xl);
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(7, 61, 74, 0.05);
  border: 1px solid rgba(7, 61, 74, 0.08);
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.5s ease, border-color 0.5s ease;
  background: var(--white);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.team-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 4px;
  background: linear-gradient(90deg, var(--blue) 0%, var(--green) 100%);
  opacity: 0;
  transition: opacity 0.4s ease;
  z-index: 3;
}
.team-card:hover {
  transform: translateY(-5px); /* Softened lift */
  border-color: rgba(31, 189, 227, 0.4);
  box-shadow: 0 15px 35px rgba(7, 61, 74, 0.12);
}
.team-card:hover::before {
  opacity: 1;
}
.team-card-photo-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  overflow: hidden;
}
.team-card-photo-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  image-rendering: -webkit-optimize-contrast;
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.team-card:hover .team-card-photo-bg img {
  transform: scale(1.05); /* Softened image zoom */
}
.team-card-initials-fallback {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white);
  position: relative;
  overflow: hidden;
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.team-card-initials-fallback span {
  font-family: 'Cormorant Garamond', serif;
  font-size: 5.4rem;
  font-weight: 700;
  opacity: 0.95;
  z-index: 2;
}
.team-card:hover .team-card-initials-fallback {
  transform: scale(1.03);
}
.team-card-initials-fallback::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: radial-gradient(circle at center, rgba(255, 255, 255, 0.12) 0%, rgba(255, 255, 255, 0) 75%);
  z-index: 1;
}
.team-card-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 24px 20px 14px 20px;
  z-index: 2;
  background: linear-gradient(
    to top,
    rgba(7, 61, 74, 0.98) 0%,
    rgba(7, 61, 74, 0.9) 35%,
    rgba(7, 61, 74, 0.5) 70%,
    rgba(7, 61, 74, 0.15) 88%,
    rgba(7, 61, 74, 0) 100%
  );
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 170px;
  transition: background 0.4s ease;
}
.team-card:hover .team-card-overlay {
  background: linear-gradient(
    to top,
    rgba(7, 61, 74, 1) 0%,
    rgba(7, 61, 74, 0.95) 40%,
    rgba(7, 61, 74, 0.6) 75%,
    rgba(7, 61, 74, 0.2) 90%,
    rgba(7, 61, 74, 0) 100%
  );
}
.team-card-details {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: 100%;
}
.team-card-name {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--white);
  margin: 0 0 6px 0;
  line-height: 1.25;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}
.team-card-title {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .16em;
  color: var(--orange-t2);
  line-height: 1.45;
  display: block;
}
.team-card-dept {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--white);
  opacity: 0.9;
  margin-top: 8px;
  line-height: 1.45;
  display: block;
}
.team-card-social {
  position: absolute;
  top: 14px;
  right: 14px;
  margin: 0;
  z-index: 4;
  display: flex;
  gap: 6px;
  opacity: 0;
  transform: translateY(-8px);
  transition: opacity 0.4s ease, transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.team-card:hover .team-card-social {
  opacity: 1;
  transform: translateY(0);
}
.team-card-social-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.1);
  color: var(--white);
  border: 1px solid rgba(255, 255, 255, 0.15);
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.team-card-social-link:hover {
  background: var(--blue);
  border-color: var(--blue);
  color: var(--white);
  transform: translateY(-2px) scale(1.08);
  box-shadow: 0 6px 15px rgba(31, 189, 227, 0.3);
}
.team-card-social-link svg {
  display: block;
}

/* ── Refined Vacancy Cards & Grid ── */
.vacancy-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 24px;
  margin-top: 36px;
}
.vacancy-card {
  background: var(--white);
  border-radius: var(--r-xl);
  border: 1px solid rgba(7, 61, 74, 0.06);
  box-shadow: 0 6px 24px rgba(7, 61, 74, 0.03);
  display: flex;
  flex-direction: column;
  height: 100%;
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
  overflow: hidden;
}
.vacancy-card::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 4px;
  background: var(--blue);
  opacity: 0;
  transition: opacity 0.3s ease;
}
.vacancy-card.job::after {
  background: var(--blue);
}
.vacancy-card.internship::after {
  background: var(--green);
}
.vacancy-card.attachment::after {
  background: var(--orange);
}
.vacancy-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 36px rgba(7, 61, 74, 0.08);
  border-color: rgba(7, 61, 74, 0.12);
}
.vacancy-card:hover::after {
  opacity: 1;
}
.vacancy-card-body {
  padding: 32px;
  display: flex;
  flex-direction: column;
  height: 100%;
  flex-grow: 1;
}
.vacancy-card-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--blue-s3);
  margin: 10px 0;
  line-height: 1.25;
}
.vacancy-card-text {
  font-size: 13.5px;
  color: var(--text-body);
  line-height: 1.65;
  margin-bottom: 24px;
  flex-grow: 1;
}
.vacancy-card-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  border-top: 1px solid rgba(7, 61, 74, 0.06);
  padding-top: 20px;
  margin-top: auto;
}
.vacancy-card-meta-info {
  display: flex;
  gap: 16px;
  font-size: 11.5px;
  color: var(--text-muted);
  flex-grow: 1;
}
.vacancy-card-meta-item {
  display: flex;
  align-items: center;
  gap: 6px;
}
.vacancy-card-meta-item .ms {
  font-size: 15px;
  color: var(--blue-s2);
}

/* ── Careers Page Footer Grid ── */
.careers-footer-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 28px;
  margin-top: 56px;
}
.careers-promo-card {
  border-radius: var(--r-xl);
  padding: 36px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  position: relative;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(7, 61, 74, 0.05);
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  border: 1px solid rgba(255, 255, 255, 0.08);
}
.careers-promo-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 15px 35px rgba(7, 61, 74, 0.1);
}
.careers-promo-card.open-app {
  background: linear-gradient(135deg, var(--blue-s2) 0%, var(--blue) 100%);
  color: var(--white);
}
.careers-promo-card.staff-portals {
  background: var(--blue-s3);
  color: var(--white);
}
.careers-promo-card-title {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 10.5px;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--orange-s1);
  margin-bottom: 20px;
  font-weight: 600;
}
.careers-promo-card.open-app .careers-promo-card-title {
  color: rgba(255, 255, 255, 0.8);
}
.careers-promo-card h3 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.75rem;
  font-weight: 700;
  margin: 0 0 12px 0;
  line-height: 1.2;
  color: var(--white);
}
.careers-promo-card p {
  font-size: 13.5px;
  color: rgba(255, 255, 255, 0.82);
  line-height: 1.6;
  margin: 0 0 24px 0;
}
.careers-portal-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
}
.careers-portal-item {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 14px;
  padding: 14px 18px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: var(--r-lg);
  text-decoration: none;
  color: var(--white) !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.careers-portal-item:hover {
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.25);
  transform: translateX(4px);
}
.careers-portal-item .portal-icon {
  font-size: 22px;
  color: var(--orange);
  flex-shrink: 0;
  transition: transform 0.3s ease;
}
.careers-portal-item:hover .portal-icon {
  transform: scale(1.15) rotate(5deg);
}
.careers-portal-item-content {
  flex-grow: 1;
  min-width: 0;
}
.careers-portal-item-content h5 {
  margin: 0 0 2px 0;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--white);
}
.careers-portal-item-content p {
  margin: 0;
  font-size: 11px;
  color: rgba(255, 255, 255, 0.45);
  line-height: 1.3;
}
.careers-portal-item .open-icon {
  font-size: 15px;
  color: rgba(255, 255, 255, 0.4);
  flex-shrink: 0;
  transition: color 0.3s ease, transform 0.3s ease;
}
.careers-portal-item:hover .open-icon {
  color: var(--white);
  transform: translate(2px, -2px);
}

/* ── Refined Department Cards & Grids ── */
.dept-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 24px;
  margin-top: 40px;
}
.dept-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: var(--r-lg);
  display: flex;
  flex-direction: column;
  height: 100%;
  position: relative;
  overflow: hidden;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}
.dept-card::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: var(--orange);
  opacity: 0;
  transition: opacity 0.3s ease;
}
.dept-card:hover {
  transform: translateY(-4px);
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(248, 158, 36, 0.3);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
}
.dept-card:hover::after {
  opacity: 1;
}
.dept-card-body {
  padding: 32px 28px;
  display: flex;
  flex-direction: column;
  height: 100%;
}
.dept-card-icon-wrap {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.05);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 24px;
  flex-shrink: 0;
  transition: transform 0.3s ease, background-color 0.3s ease;
}
.dept-card:hover .dept-card-icon-wrap {
  transform: rotate(-5deg) scale(1.05);
  background: rgba(248, 158, 36, 0.15);
}
.dept-card-icon-wrap .ms {
  color: var(--orange);
  font-size: 24px;
}
.dept-card-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.35rem;
  font-weight: 600;
  color: var(--white);
  margin: 0 0 12px 0;
  line-height: 1.25;
}
.dept-card-desc {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.75);
  line-height: 1.65;
  margin-bottom: 24px;
}

/* White/Gray Section overrides for Department Cards on Team page */
.about-section-gray .dept-card,
.about-section-white .dept-card {
  background: var(--white);
  border: 1px solid rgba(7, 61, 74, 0.08);
  box-shadow: 0 4px 20px rgba(7, 61, 74, 0.04);
}
.about-section-gray .dept-card:hover,
.about-section-white .dept-card:hover {
  background: var(--white);
  border-color: rgba(248, 158, 36, 0.4);
  box-shadow: 0 10px 30px rgba(7, 61, 74, 0.1);
}
.about-section-gray .dept-card-icon-wrap,
.about-section-white .dept-card-icon-wrap {
  background: rgba(24, 158, 193, 0.08);
}
.about-section-gray .dept-card:hover .dept-card-icon-wrap,
.about-section-white .dept-card:hover .dept-card-icon-wrap {
  background: rgba(248, 158, 36, 0.12);
}
.about-section-gray .dept-card-icon-wrap .ms,
.about-section-white .dept-card-icon-wrap .ms {
  color: var(--blue-s1);
}
.about-section-gray .dept-card:hover .dept-card-icon-wrap .ms,
.about-section-white .dept-card:hover .dept-card-icon-wrap .ms {
  color: var(--orange);
}
.about-section-gray .dept-card-title,
.about-section-white .dept-card-title {
  color: var(--text-primary);
}
.about-section-gray .dept-card-desc,
.about-section-white .dept-card-desc {
  color: var(--text-secondary);
}

/* ── Refined Department Info (Sidebar) Card ── */
.dept-info-card {
  background: var(--white);
  border: 1px solid rgba(7, 61, 74, 0.08);
  border-radius: var(--r-lg);
  box-shadow: 0 4px 20px rgba(7, 61, 74, 0.04);
  padding: 32px 28px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  transition: all 0.3s ease;
}
.dept-info-card:hover {
  border-color: rgba(31, 189, 227, 0.25);
  box-shadow: 0 10px 30px rgba(7, 61, 74, 0.07);
}
.dept-info-icon-wrap {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  background: white;
  color: var(--blue-s2);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  transition: transform 0.3s ease;
}
.dept-info-card:hover .dept-info-icon-wrap {
  transform: scale(1.05);
}
.dept-info-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.45rem;
  font-weight: 700;
  color: var(--text-dark);
  margin: 0;
  line-height: 1.2;
}

/* ── Premium Department Head Card ── */
.dept-head-showcase {
  margin-top: 40px;
  background: var(--white);
  border: 1px solid rgba(7, 61, 74, 0.08);
  border-radius: var(--r-lg);
  box-shadow: 0 10px 30px rgba(7, 61, 74, 0.04);
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 24px;
  position: relative;
  overflow: hidden;
  transition: all 0.3s ease;
}
.dept-head-showcase:hover {
  border-color: rgba(31, 189, 227, 0.25);
  box-shadow: 0 16px 40px rgba(7, 61, 74, 0.08);
  transform: translateY(-2px);
}
.dept-head-showcase::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: linear-gradient(180deg, var(--blue) 0%, var(--green) 100%);
}
.dept-head-avatar-wrap {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  padding: 3px;
  border: 2px solid rgba(7, 61, 74, 0.05);
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--white);
  flex-shrink: 0;
  transition: border-color 0.3s ease;
}
.dept-head-showcase:hover .dept-head-avatar-wrap {
  border-color: var(--blue);
}
.dept-head-avatar {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Cormorant Garamond', serif;
  font-size: 2.2rem;
  font-weight: 700;
  color: var(--white);
  background: var(--blue-s2);
  transform: translateZ(0);
  -webkit-mask-image: -webkit-radial-gradient(white, black);
}
.dept-head-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  image-rendering: -webkit-optimize-contrast;
  transform: translateZ(0);
}
.dept-head-info {
  flex-grow: 1;
}
.dept-head-label {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 8.5px;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--text-orange);
  margin-bottom: 4px;
}
.dept-head-name {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--text-dark);
  margin: 0 0 2px 0;
  line-height: 1.2;
}
.dept-head-title {
  font-size: 13px;
  color: var(--text-muted);
  margin: 0;
  line-height: 1.4;
}

/* ── Typography Styling for Department Description ── */
.dept-about-content {
  font-size: 15.5px;
  line-height: 1.8;
  color: var(--text-body);
}
.dept-about-content p:first-of-type {
  font-size: 17px;
  line-height: 1.75;
  color: var(--text-dark);
  font-weight: 400;
}

/* ── Department page enhancements ── */
.dept-sidebar-card {
  background: var(--white);
  border: 1px solid rgba(7, 61, 74, 0.08);
  border-radius: var(--r-lg);
  padding: 24px;
  box-shadow: 0 10px 30px rgba(7, 61, 74, 0.03);
  margin-bottom: 24px;
}
.dept-sidebar-card-title {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--text-orange);
  margin-bottom: 18px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(7, 61, 74, 0.05);
}
.dept-fact-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 16px;
}
.dept-fact-item:last-child {
  margin-bottom: 0;
}
.dept-fact-icon {
  background: var(--blue-t2);
  color: var(--blue-s2);
  width: 32px;
  height: 32px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.dept-fact-icon .ms {
  font-size: 16px;
}
.dept-fact-details {
  flex-grow: 1;
}
.dept-fact-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--text-muted);
  margin-bottom: 2px;
}
.dept-fact-value {
  font-size: 13.5px;
  font-weight: 500;
  color: var(--text-dark);
  word-break: break-all;
}
.dept-sidebar-actions {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid rgba(7, 61, 74, 0.05);
}
@media (max-width: 576px) {
  .dept-head-showcase {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    padding: 24px;
  }
  .dept-head-showcase::before {
    width: 100%;
    height: 4px;
    left: 0;
    top: 0;
  }
}

/* ── Layout helpers ── */
.sidebar-layout {
  display: grid;
  grid-template-columns: 1fr 360px;
  gap: 64px;
  align-items: start;
}
@media (max-width: 991px) {
  .sidebar-layout {
    grid-template-columns: 1fr;
    gap: 48px;
  }
}

/* ── Researchers ── */
.team-researchers-grid {
  margin-top: 40px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
@media (max-width: 900px) {
  .team-researchers-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 600px) {
  .team-researchers-grid {
    grid-template-columns: 1fr;
  }
}

.team-researcher-icon-wrapper {
  width: 42px;
  height: 42px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.team-researcher-icon-wrapper-blue {
  background: var(--blue-t2);
  color: var(--blue-s2);
}
.team-researcher-icon-wrapper-green {
  background: var(--green-t2);
  color: var(--text-green);
}
.team-researcher-icon-wrapper-orange {
  background: var(--orange-t2);
  color: var(--text-orange);
}
.team-researcher-icon-wrapper .ms {
  font-size: 20px;
}


.team-researcher-area {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-dark);
}
.team-researcher-focus {
  font-size: 11.5px;
  color: var(--text-body);
  margin-top: 3px;
}

.team-researchers-footer {
  margin-top: 32px;
  border-top: 1px solid var(--border);
  padding-top: 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
}
.team-researchers-footer p {
  font-size: 13.5px;
  color: var(--text-body);
  font-weight: 300;
  margin: 0;
}

/* ── Vacancies ── */
.team-vacancies-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-top: 40px;
}
.team-vacancies-footer {
  font-size: 10.5px;
  color: var(--text-muted);
  margin-top: 18px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  text-align: right;
}

.team-vacancies-open-panel {
  background: var(--blue-s3);
  border-radius: var(--r-xl);
  padding: 28px 32px;
  margin-top: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}
.team-vacancies-open-panel-label {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9.5px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--orange-s1);
  margin-bottom: 8px;
}
.team-vacancies-open-panel p {
  font-size: 14px;
  color: rgba(255, 255, 255, .75);
  font-weight: 300;
  line-height: 1.65;
  max-width: 420px;
  margin: 0;
}

/* ── Alumni ── */
.team-alumni-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
}
@media (max-width: 900px) {
  .team-alumni-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }
}

.team-alumni-buttons {
  display: flex;
  gap: 14px;
  margin-top: 28px;
  flex-wrap: wrap;
}

.team-alumni-stats-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.team-alumni-stats-card {
  background: rgba(255, 255, 255, .06);
  border-radius: var(--r-xl);
  padding: 24px 28px;
  display: flex;
  align-items: center;
  gap: 18px;
  transition: transform 0.2s;
}
.team-alumni-stats-card:hover {
  transform: translateX(4px);
}
.team-alumni-stats-card-blue {
  border: 1px solid rgba(31, 189, 227, .15);
}
.team-alumni-stats-card-orange {
  border: 1px solid rgba(248, 158, 36, .18);
}
.team-alumni-stats-card-green {
  border: 1px solid rgba(91, 185, 71, .18);
}

.team-alumni-stats-icon-wrapper {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.team-alumni-stats-icon-wrapper-blue {
  background: rgba(31, 189, 227, .15);
}
.team-alumni-stats-icon-wrapper-orange {
  background: rgba(248, 158, 36, .15);
}
.team-alumni-stats-icon-wrapper-green {
  background: rgba(91, 185, 71, .15);
}

.team-alumni-stats-icon-wrapper .ms {
  font-size: 24px;
}

.team-alumni-stats-num {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1;
}

.team-alumni-stats-label {
  font-size: 12px;
  color: rgba(255, 255, 255, .6);
  margin-top: 4px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.team-alumni-stats-card-blue .team-alumni-stats-num {
  color: var(--blue);
}
.team-alumni-stats-card-orange .team-alumni-stats-num {
  color: var(--orange);
}
.team-alumni-stats-card-green .team-alumni-stats-num {
  color: var(--green);
}



/* ── Careers & Portals ── */
.team-careers-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
}
@media (max-width: 900px) {
  .team-careers-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }
}

.team-careers-buttons {
  margin-top: 28px;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.team-careers-portals-card {
  background: var(--blue-s3);
  border-radius: var(--r-xl);
  padding: 36px;
}

.team-careers-portals-label {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9.5px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--orange-s1);
  margin-bottom: 18px;
}

.team-careers-portals-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* ==========================================================================
   DESIGN SYSTEM UPDATES — ALERTS, TOASTS, TOOLTIPS, TABLES, TABS, ACCORDIONS, SKELETONS
   ========================================================================== */

/* ── Alerts & Notifications ── */
.alert {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 16px 20px;
  border-radius: var(--r-lg);
  border: 1px solid var(--border-2);
  margin-bottom: 24px;
  font-size: 13.5px;
  line-height: 1.5;
  background: var(--white);
  transition: opacity 0.25s ease, transform 0.25s ease;
}
.alert-info {
  border-left: 4px solid var(--blue);
  background: white;
  color: var(--blue-s3);
}
.alert-success {
  border-left: 4px solid var(--green);
  background: var(--green-t1);
  color: var(--green-s2);
}
.alert-warning {
  border-left: 4px solid var(--orange);
  background: var(--orange-t1);
  color: var(--orange-s2);
}
.alert-error {
  border-left: 4px solid #C0392B;
  background: #FDEDED;
  color: #7A1C1C;
}
.alert-close {
  margin-left: auto;
  border: none;
  background: none;
  color: inherit;
  cursor: pointer;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0.6;
  transition: opacity 0.15s;
  min-height: 24px;
  min-width: 24px;
}
.alert-close:hover {
  opacity: 1;
}
.alert-close .ms {
  font-size: 18px;
}

/* ── Toast Notifications ── */
#toast-container {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 10000;
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 360px;
  width: calc(100% - 48px);
  pointer-events: none;
}
.toast {
  pointer-events: auto;
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 18px;
  border-radius: var(--r);
  background: var(--blue-s3);
  color: var(--white);
  box-shadow: var(--sh-lg);
  font-size: 13px;
  font-weight: 500;
  animation: toast-slide-in 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  overflow: hidden;
}
.toast.hide {
  animation: toast-slide-out 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes toast-slide-in {
  from { transform: translateY(20px) scale(0.95); opacity: 0; }
  to { transform: translateY(0) scale(1); opacity: 1; }
}
@keyframes toast-slide-out {
  from { transform: translateY(0) scale(1); opacity: 1; }
  to { transform: translateY(10px) scale(0.95); opacity: 0; }
}
.toast-success { border-left: 3px solid var(--green); }
.toast-warning { border-left: 3px solid var(--orange); }
.toast-error { border-left: 3px solid #C0392B; }
.toast-info { border-left: 3px solid var(--blue); }

.toast-progress {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 2px;
  background: rgba(255, 255, 255, 0.3);
  width: 100%;
  transform-origin: left;
}

/* ── Tooltips ── */
[data-tooltip] {
  position: relative;
  cursor: pointer;
}
[data-tooltip]::after {
  content: attr(data-tooltip);
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translate(-50%, -8px) scale(0.95);
  background: var(--blue-s3);
  color: var(--white);
  padding: 6px 10px;
  border-radius: 4px;
  font-size: 11px;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.15s ease, transform 0.15s ease;
  z-index: 1000;
  box-shadow: var(--sh-sm);
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 500;
}
[data-tooltip]::before {
  content: '';
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translate(-50%, -3px);
  border: 5px solid transparent;
  border-top-color: var(--blue-s3);
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.15s ease;
  z-index: 1000;
}
[data-tooltip]:hover::after,
[data-tooltip]:focus::after,
[data-tooltip]:focus-within::after {
  opacity: 1;
  transform: translate(-50%, -8px) scale(1);
}
[data-tooltip]:hover::before,
[data-tooltip]:focus::before,
[data-tooltip]:focus-within::before {
  opacity: 1;
}

/* ── Tables ── */
.table-wrap {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin: 24px 0;
  border-radius: var(--r-lg);
  border: 1px solid var(--border);
}
table.cetrad-table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
  font-size: 13.5px;
  background: var(--white);
}
table.cetrad-table caption {
  padding: 12px;
  font-size: 12px;
  color: var(--text-muted);
  text-align: left;
  background: white;
  border-bottom: 1px solid var(--border);
}
table.cetrad-table th {
  background: white;
  color: var(--text-dark);
  font-weight: 600;
  padding: 14px 16px;
  border-bottom: 1.5px solid var(--border-2);
}
table.cetrad-table td {
  padding: 14px 16px;
  border-bottom: 1px solid var(--border);
  color: var(--text-body);
  line-height: 1.45;
}
table.cetrad-table tbody tr:nth-child(even) {
  background: white;
}
table.cetrad-table tbody tr:hover {
  background: white;
}
table.cetrad-table td.numeric,
table.cetrad-table th.numeric {
  text-align: right;
  font-family: 'Plus Jakarta Sans', sans-serif;
}

/* ── Tabs ── */
.tab-list {
  display: flex;
  gap: 8px;
  border-bottom: 1px solid var(--border-2);
  margin-bottom: 24px;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.tab-list::-webkit-scrollbar {
  display: none;
}
.tab-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: transparent;
  border: none;
  border-bottom: 3px solid transparent;
  color: var(--text-body);
  padding: 12px 16px;
  font-size: 13.5px;
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.2s;
  font-family: inherit;
  min-height: 44px;
}
.tab-btn:hover {
  color: var(--blue-s2);
  background: white;
}
.tab-btn[aria-selected="true"] {
  border-bottom-color: var(--blue);
  color: var(--text-dark);
  font-weight: 600;
}
.tab-btn .ms {
  font-size: 18px;
}
.tab-panel {
  display: none;
}
.tab-panel.active {
  display: block;
  animation: tab-fade-in 0.3s ease forwards;
}
.tab-panel > section:first-of-type {
  padding-top: 32px;
}
@keyframes tab-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* ── Accordions ── */
.accordion {
  border: 1px solid var(--border-2);
  border-radius: var(--r-lg);
  background: var(--white);
  margin-bottom: 12px;
  overflow: hidden;
}
.accordion-trigger {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  background: transparent;
  border: none;
  font-family: inherit;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--text-dark);
  cursor: pointer;
  text-align: left;
  transition: background-color 0.2s;
  min-height: 44px;
}
.accordion-trigger:hover {
  background-color: var(--blue-t1);
}
.accordion-trigger .ms {
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  color: var(--blue-s2);
}
.accordion-trigger[aria-expanded="true"] {
  background-color: var(--blue-t1);
  border-bottom: 1px solid var(--border);
}
.accordion-trigger[aria-expanded="true"] .ms {
  transform: rotate(180deg);
}
.accordion-content {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.accordion-content-inner {
  overflow: hidden;
  padding: 0 20px;
  color: var(--text-body);
  font-size: 13.5px;
  line-height: 1.6;
}
.accordion-trigger[aria-expanded="true"] + .accordion-content {
  grid-template-rows: 1fr;
}
.accordion-trigger[aria-expanded="true"] + .accordion-content .accordion-content-inner {
  padding: 20px;
}

/* ── Loading States & Skeletons ── */
.skeleton {
  background-color: var(--blue-t2);
  background-image: linear-gradient(90deg, var(--blue-t2) 0px, var(--blue-t1) 40px, var(--blue-t2) 80px);
  background-size: 600px;
  background-repeat: no-repeat;
  animation: shimmer-sweep 1.6s infinite linear;
  border-radius: var(--r);
  display: block;
}
@keyframes shimmer-sweep {
  0% { background-position: -200px 0; }
  100% { background-position: 400px 0; }
}
.skeleton-card {
  padding: 20px;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.skeleton-img {
  width: 100%;
  aspect-ratio: 16/9;
  border-radius: var(--r-lg);
}
.skeleton-title {
  height: 18px;
  width: 70%;
  border-radius: 4px;
}
.skeleton-text {
  height: 12px;
  width: 100%;
  border-radius: 3px;
  margin-top: 4px;
}
.skeleton-text.short {
  width: 40%;
}

/* Button loading state spinner */
.btn.loading {
  position: relative;
  color: transparent !important;
  pointer-events: none;
}
.btn.loading::after {
  content: '';
  position: absolute;
  width: 18px;
  height: 18px;
  border: 2px solid currentColor;
  border-top-color: transparent;
  border-radius: 50%;
  animation: btn-spin 0.6s linear infinite;
  left: calc(50% - 9px);
  top: calc(50% - 9px);
}
@keyframes btn-spin {
  to { transform: rotate(360deg); }
}

/* ── Motion Prefs ── */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  /* Snap reveal elements visible immediately — don't wait for JS */
  .reveal { opacity: 1; transform: none; }
}


/* ── Utility Classes (extracted from template inline styles) ── */

/* Card body column layout */
.card-col {
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* Small body text in cards and info rows */
.text-sm {
  margin: 0;
  font-size: 12.5px;
  color: var(--text-body);
  line-height: 1.5;
}

/* Card heading */
.card-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--text-dark);
  margin: 0 0 10px 0;
}

/* Card body paragraph with flex-grow for equal-height cards */
.card-text {
  font-size: 13px;
  color: var(--text-body);
  line-height: 1.65;
  margin-bottom: 18px;
  flex-grow: 1;
}

/* DM Mono uppercase orange label (eyebrow-style inline label) */
.mono-label {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 9.5px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--text-orange);
  margin-bottom: 16px;
}

/* Stat number — Cormorant Garamond display numerals */
.stat-n {
  font-family: 'Cormorant Garamond', serif;
  font-size: 2.4rem;
  font-weight: 600;
  color: var(--blue);
  line-height: 1;
}

/* Stat label beneath the number */
.stat-l {
  font-size: 10.5px;
  color: var(--text-secondary);
  font-family: 'Plus Jakarta Sans', sans-serif;
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-top: 4px;
}

/* ════════════════════════════════════════════════════════════════
   SERVICES PAGE UTILITIES
   ════════════════════════════════════════════════════════════════ */

/* Icon box for feature lists */
.icon-box {
  width: 44px; height: 44px;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 22px;
  flex-shrink: 0;
  transition: transform .3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow .3s ease;
}

/* Feature list item (consultancy, services, checkmarks) */
.feature-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 13px;
  color: var(--text-body);
  line-height: 1.6;
}
.feature-item .ms {
  font-size: 18px;
  flex-shrink: 0;
}

/* Section spacing utilities */
.mt-12 { margin-top: 12px; }
.mt-20 { margin-top: 20px; }
.mt-24 { margin-top: 24px; }
.mt-32 { margin-top: 32px; }
.mt-36 { margin-top: 36px; }
.mt-40 { margin-top: 40px; }
.mt-44 { margin-top: 44px; }
.mt-52 { margin-top: 52px; }

.mb-8  { margin-bottom: 8px; }
.mb-12 { margin-bottom: 12px; }
.mb-16 { margin-bottom: 16px; }
.mb-18 { margin-bottom: 18px; }
.mb-20 { margin-bottom: 20px; }
.mb-24 { margin-bottom: 24px; }

/* Flex utilities */
.flex { display: flex; }
.flex-col { flex-direction: column; }
.flex-center { align-items: center; }
.flex-start { align-items: flex-start; }
.flex-wrap { flex-wrap: wrap; }
.flex-grow { flex-grow: 1; }
.mt-auto { margin-top: auto; }
.mb-auto { margin-bottom: auto; }

/* Border utilities */
.border-top { border-top: 1px solid var(--border); }

/* Padding utilities */
.pt-16 { padding-top: 16px; }
.pt-24 { padding-top: 24px; }

/* Text align utilities */
.text-center { text-align: center; }

/* Additional spacing utilities */
.mt-18 { margin-top: 18px; }
.mt-22 { margin-top: 22px; }
.mt-28 { margin-top: 28px; }

/* API last-updated timestamp stamp */
.api-stamp {
  font-size: 10.5px;
  color: var(--text-muted);
  margin-top: 18px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  text-align: right;
}








/* ==========================================================================
   ACCESSIBILITY: Honor prefers-reduced-motion
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ================================================================
   PUBLICATION SINGLE PAGE (FLIPBOOK)
   ================================================================ */
.pub-flipbook-section {
  background: #05262f;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
  padding: 64px 0 80px;
}

.pub-flipbook-container {
  max-width: 1500px;
}

.pub-section-head {
  color: white;
  text-align: center;
  margin-bottom: 36px;
  font-family: 'Cormorant Garamond', serif;
}

.pub-mobile-download {
  background: linear-gradient(135deg, var(--blue-s3) 0%, #0a1f2a 100%);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding: 48px 0;
  text-align: center;
}

.pub-mobile-download .ms {
  font-size: 36px;
  color: var(--blue);
  display: block;
  margin-bottom: 16px;
}

.pub-mobile-download p {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.7);
  margin-bottom: 24px;
  max-width: 320px;
  margin-left: auto;
  margin-right: auto;
}

/* Flipbook controls */
.flipbook-divider {
  width: 1px;
  height: 18px;
  background: rgba(255, 255, 255, 0.15);
  margin: 0 4px;
  display: inline-block;
}

/* Publication metadata section */
.pub-meta-section {
  background: var(--blue-s3);
  border-radius: var(--r-xl);
  padding: 36px;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.pub-meta-row {
  display: flex;
  flex-direction: column;
  gap: 13px;
  border-bottom: 1px solid rgba(31, 189, 227, 0.1);
  margin: 18px 0;
}

.pub-meta-row:last-child {
  border-bottom: 1px solid rgba(31, 189, 227, 0.1);
  margin: 22px 0;
}

.pub-meta-item {
  display: flex;
  gap: 8px;
  align-items: center;
}

.pub-meta-item.hidden {
  display: none;
  gap: 8px;
  align-items: baseline;
}

.pub-meta-label {
  font-size: 9px;
  font-family: 'DM Mono', monospace;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.38);
  flex-shrink: 0;
  min-width: 64px;
}

.pub-meta-value {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.75);
}

.pub-meta-value.italic {
  font-style: italic;
  line-height: 1.5;
}

.pub-meta-value.mono {
  font-family: 'DM Mono', monospace;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-orange);
  margin-bottom: 10px;
}

.pub-meta-title {
  font-size: 12px;
  line-height: 1.75;
  color: var(--text-body);
}

.pub-meta-url {
  font-size: 12px;
  color: var(--blue-t3);
  line-height: 1.5;
  word-break: break-all;
  text-decoration: none;
}

.pub-meta-section-label {
  font-size: 9px;
  font-family: 'DM Mono', monospace;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-orange);
}

.pub-icon-large {
  font-size: 24px;
  color: var(--blue);
}

.pub-icon-medium {
  font-size: 32px;
  color: var(--text-orange);
}

.pub-icon-small {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.75);
}

.pub-text-white {
  color: white;
  font-weight: 600;
  font-size: 13px;
}

.pub-text-center {
  text-align: center;
  justify-content: center;
}

.pub-text-center-mb {
  text-align: center;
  justify-content: center;
  margin-bottom: 8px;
}

.pub-mb-20 {
  margin-bottom: 20px;
}

.pub-mt-10 {
  margin-top: 10px;
}

.pub-flipbook-section .container {
  max-width: 1500px;
}

.pub-section-head {
  color: var(--white);
  text-align: center;
  margin-bottom: 36px;
  font-family: 'Cormorant Garamond', serif;
}

.pub-mobile-download {
  background: linear-gradient(135deg, var(--blue-s3) 0%, #0a1f2a 100%);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding: 48px 0;
}

.pub-mobile-download .ms {
  font-size: 36px;
  color: var(--blue);
  display: block;
  margin-bottom: 16px;
}

.pub-mobile-download p {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.7);
  margin-bottom: 24px;
  max-width: 320px;
  margin-left: auto;
  margin-right: auto;
}

.flipbook-divider {
  width: 1px;
  height: 18px;
  background: rgba(255, 255, 255, 0.15);
  margin: 0 4px;
}

.pub-hero-authors {
  font-size: 16px;
  font-weight: 500;
  color: var(--text-primary);
  margin-bottom: 12px;
}

.pub-hero-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  font-size: 13px;
  color: var(--text-muted);
  margin-bottom: 20px;
  align-items: center;
}

.pub-sep {
  opacity: 0.5;
}

.pub-oa-badge {
  background: var(--green);
  color: white;
  padding: 2px 8px;
  border-radius: var(--r);
  font-size: 11px;
  font-weight: 600;
}

.pub-hero-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 20px;
}

/* ================================================================
   NEWSLETTER ADMIN & FRONTEND
   ================================================================ */
.newsletter-section {
  padding: 60px 0;
  background: white;
}

.newsletter-form-wrapper {
  max-width: 500px;
  margin: 0 auto;
}

.newsletter-input-group {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.newsletter-input-group input,
.newsletter-input-group button {
  flex: 1;
  min-width: 150px;
}

.newsletter-status-badge {
  display: inline-block;
  padding: 4px 12px;
  border-radius: var(--r);
  font-size: 11px;
  font-weight: 600;
}

.newsletter-status-active {
  background: var(--green-t1);
  color: var(--green-s2);
}

.newsletter-status-pending {
  background: var(--orange-t1);
  color: var(--orange-s2);
}

.newsletter-status-unsubscribed {
  background: rgba(0, 0, 0, 0.05);
  color: var(--text-muted);
}

/* ==========================================================================
   PUBLICATIONS ARCHIVE — Zen Design Refactoring
   ========================================================================== */
.pub-archive-section {
  background: white;
}

.pub-filter-form .archive-filter {
  margin-bottom: 16px;
}

.archive-sub-filter {
  margin-top: -8px;
  margin-bottom: 20px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.pub-clear-filters .ms {
  font-size: 14px;
}

.pub-list-grid {
  display: flex;
  flex-direction: column;
  gap: 2px;
  background: var(--border);
  border-radius: var(--r-xl);
  overflow: hidden;
  margin-top: 8px;
}

.pub-list-row {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 18px;
  padding: 22px 26px;
  background: var(--white);
  transition: background .15s;
}

.pub-list-row:hover {
  background: var(--blue-t1) !important;
}

.pub-list-thumb {
  width: 44px;
  height: 58px;
  border-radius: 6px;
  overflow: hidden;
  flex-shrink: 0;
  background: white;
}

.pub-list-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.pub-list-icon {
  width: 40px;
  height: 40px;
  border-radius: 9px;
  background: white;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--blue-s2);
  margin-top: 2px;
}

.pub-list-icon .ms {
  font-size: 20px;
}

.pub-list-body {
  flex: 1;
  min-width: 0;
}

.pub-list-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-dark);
  line-height: 1.45;
  margin-bottom: 5px;
}

.pub-list-title a {
  color: inherit;
  text-decoration: none;
}

.pub-list-excerpt {
  font-size: 12.5px;
  color: var(--text-body);
  line-height: 1.6;
  margin-bottom: 7px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.pub-list-authors {
  font-size: 12px;
  color: var(--text-body);
  margin-bottom: 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pub-list-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  font-size: 11px;
  color: var(--text-muted);
  font-family: 'DM Mono', monospace;
}

.pub-list-meta-sep {
  opacity: .4;
}

.pub-list-journal {
  max-width: 260px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pub-list-oa-badge {
  background: var(--green-t1);
  color: var(--text-green);
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: .07em;
}

.pub-list-dl-btn {
  flex-shrink: 0;
  align-self: center;
  width: 44px;
  height: 44px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--white);
  color: var(--blue-s2);
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: background .15s, border-color .15s;
  position: relative;
  z-index: 2;
}

.pub-list-dl-btn:hover {
  background: white;
  border-color: var(--blue);
}

.pub-list-dl-btn .ms {
  font-size: 18px;
}

.pub-list-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
}

.pub-no-results {
  text-align: center;
  padding: 72px 0;
}

.pub-no-results-icon {
  font-size: 52px;
  color: var(--blue-t2);
  display: block;
  margin-bottom: 18px;
}

.pub-no-results-text {
  color: var(--text-body);
  font-size: 14.5px;
}

.pub-no-results-btn {
  margin-top: 20px;
  display: inline-flex;
}

.admin-input-group { margin-bottom: 6px; }
.admin-hidden { display: none !important; }
.admin-text-sm { font-size: 12px; color: #666; }
.admin-text-xsmall { font-size: 11px; color: #888; }
.admin-text-emphasis { font-size: 11px; font-weight: 600; margin: 8px 0 4px; color: #444; }
.admin-button-block { width: 100%; }
.admin-button-margin { margin-top: 8px; }
.admin-button-margin-bottom { margin-bottom: 8px; }
.admin-divider-compact { margin: 12px 0; }
.admin-text-input { width: 100%; }
.admin-send-msg { margin-top: 10px; font-size: 13px; display: none; }
.admin-tag-hint { font-size: 12px; color: #666; vertical-align: middle; margin-left: 8px; }
.admin-table-status { width: 160px; }
.admin-table-date { width: 220px; }
.admin-table-col { width: 130px; }
.admin-table-wordbreak { word-break: break-all; font-size: 13px; }
.admin-table-note { font-size: 12px; color: #666; }
.admin-empty-state { text-align: center; padding: 24px; color: #888; }
.admin-logs-wrapper { margin-bottom: 16px; }
.admin-logs-form { margin-top: 20px; }
.admin-log-list { margin: 10px 0; }
.admin-table-subject { font-size: 13px; }
.required-indicator { color: var(--text-orange); }
.pub-list-journal { max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-status-trash { color: #d63638; font-weight: 600; }
.admin-status-published { color: #67b744; font-weight: 600; }
.admin-status-missing { color: #666; font-style: italic; }
.admin-table-cell { padding: 10px; vertical-align: middle; }
.admin-table-cell-right { text-align: right; }
.admin-status-form { display: inline-block; margin: 0; }
.admin-panel { margin-top: 25px; max-width: 900px; padding: 20px; background: #fff; border: 1px solid #ccd0d4; border-radius: 4px; box-shadow: 0 1px 3px rgba(0,0,0,0.05); }
.admin-section-heading { margin-top: 0; font-size: 1.17em; font-weight: 600; color: #1d2327; }
.admin-section-heading-danger { margin-top: 0; font-size: 1.17em; font-weight: 600; color: #d63638; }
.admin-desc-small { color: #666; margin-bottom: 15px; }
.admin-form-reset { margin: 0; }
.admin-button-danger { background: #d63638; border-color: #d63638; text-shadow: none; }

/* ── Notices/Newsroom Section ──────────────────────────────────────────── */
.notices-section { background: var(--off-white); padding: 60px 0; }


/* ── Enhanced Newsletter Form ─────────────────────────────────────────── */

.newsletter-desc {
  font-size: 15px;
  line-height: 1.8;
  color: var(--text-secondary);
}

.newsletter-form {
  max-width: 500px;
  margin-left: auto;
  margin-right: auto;
}

.newsletter-form-wrapper {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

/* Newsletter Input Field Enhancements */
.newsletter-input {
  flex: 1;
  min-width: 220px;
  padding: 12px 16px;
  border: 2px solid #ddd;
  border-radius: var(--r);
  font-size: 14px;
  font-family: inherit;
  transition: all 0.3s ease;
  background: white;
}

.newsletter-input::placeholder {
  color: var(--text-muted);
  font-weight: 300;
}

.newsletter-input:hover {
  border-color: var(--blue-t3);
  box-shadow: 0 2px 8px rgba(31, 189, 227, 0.1);
}

.newsletter-input:focus {
  outline: none;
  border-color: var(--blue);
  box-shadow: 0 0 0 4px rgba(31, 189, 227, 0.2);
  background: #fafbfc;
}

.newsletter-input:valid {
  border-color: #ddd;
}

.newsletter-input.error {
  border-color: #c0392b;
  box-shadow: 0 0 0 4px rgba(192, 57, 43, 0.1);
}

/* Newsletter Button Enhancements */
.newsletter-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 28px;
  font-weight: 600;
  font-size: 14px;
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(31, 189, 227, 0.15);
}

.newsletter-btn:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(31, 189, 227, 0.25);
  background-color: #E07B1A;
}

.newsletter-btn:active:not(:disabled) {
  transform: translateY(0);
  box-shadow: 0 2px 8px rgba(31, 189, 227, 0.15);
}

.newsletter-btn:disabled,
.newsletter-btn.loading {
  opacity: 0.7;
  cursor: not-allowed;
}

.newsletter-btn-icon {
  font-size: 18px;
}

.newsletter-btn-loading {
  display: none !important;
}

.newsletter-btn.loading .newsletter-btn-loading {
  display: flex !important;
}

.newsletter-btn.loading .newsletter-btn-text {
  display: none;
}

.newsletter-btn.loading .newsletter-btn-icon {
  display: none;
}

/* Loading Spinner */
.spinner {
  display: inline-block;
  width: 16px;
  height: 16px;
  border: 2px solid rgba(255, 255, 255, 0.3);
  border-top-color: white;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

/* Newsletter Messages */
.newsletter-msg {
  display: none;
  margin-top: 16px;
  min-height: 24px;
  font-size: 13px;
  font-weight: 500;
  animation: slideIn 0.3s ease;
}

.newsletter-msg.show {
  display: block;
}

.newsletter-msg.success {
  color: #27ae60;
}

.newsletter-msg.error {
  color: #c0392b;
}

@keyframes slideIn {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.newsletter-privacy {
  font-size: 12px;
  color: var(--text-muted);
  margin-top: 16px;
}

/* Mobile Responsiveness */
@media (max-width: 640px) {
  .newsletter-form-wrapper {
    flex-direction: column;
    gap: 10px;
  }

  .newsletter-input {
    min-width: 100%;
    width: 100%;
  }

  .newsletter-btn {
    width: 100%;
    justify-content: center;
  }

  .newsletter-desc {
    font-size: 14px;
  }
}


/* Utility Classes — Phase 2 additions */

/* Spacing utilities */
.mt-14 { margin-top: 14px; }
.mb-14 { margin-bottom: 14px; }
.mt-spacer { margin-top: 24px; }
.mb-spacer { margin-bottom: 24px; }

/* Text alignment utilities */
.text-left { text-align: left; }

/* Flexbox alignment utilities */
.align-self-center { align-self: center; }
.ml-auto-flex { margin-left: auto; display: flex; }

/* Anchor/Link utilities */
.no-decoration { text-decoration: none; }

/* Size utilities */
.max-width-860 { max-width: 860px; }

/* Alignment utilities */
.vertical-middle { vertical-align: middle; }

/* Flexbox gap utilities */
.gap-8 { gap: 8px; }
.gap-12 { gap: 12px; }
.gap-14 { gap: 14px; }
.gap-16 { gap: 16px; }
.gap-18 { gap: 18px; }
.gap-20 { gap: 20px; }

/* Icon utilities */
.newsletter-section {
  background: var(--blue-t1);
  padding: 80px 0;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}

.newsletter-grid-layout {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 64px;
  align-items: center;
}

.newsletter-text-column {
  display: flex;
  flex-direction: column;
}

.newsletter-text-column .eyebrow {
  margin-bottom: 12px;
}

.newsletter-text-column .stitle {
  margin-bottom: 16px;
  color: var(--blue-s3);
}

.newsletter-desc {
  font-size: 15px;
  line-height: 1.7;
  color: var(--text-secondary);
  margin: 0;
}

.newsletter-form-column {
  display: flex;
  flex-direction: column;
}

.newsletter-form {
  width: 100%;
  margin: 0;
}

.newsletter-form-wrapper {
  display: flex;
  gap: 12px;
  width: 100%;
}

.newsletter-input {
  flex: 1;
  min-width: 0;
  padding: 14px 18px;
  border: 1.5px solid var(--border-2);
  border-radius: var(--r-lg);
  font-size: 14.5px;
  background: var(--white);
  color: var(--text-primary);
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: var(--sh-sm);
  min-height: 48px;
}

.newsletter-input:hover {
  border-color: var(--blue-t3);
}

.newsletter-input:focus {
  outline: none;
  border-color: var(--blue);
  box-shadow: 0 0 0 4px rgba(31, 189, 227, 0.15);
}

.newsletter-btn {
  height: 48px;
  padding: 0 28px;
  border-radius: var(--r-lg);
  font-size: 14px;
  font-weight: 600;
  box-shadow: var(--sh-sm);
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

.newsletter-btn:hover {
  transform: translateY(-1px);
  box-shadow: var(--sh-md);
}

.newsletter-btn:active {
  transform: translateY(0);
}

.newsletter-privacy {
  font-size: 11.5px;
  color: var(--text-muted);
  margin-top: 12px;
  letter-spacing: 0.01em;
}

@media (max-width: 900px) {
  .newsletter-grid-layout {
    grid-template-columns: 1fr;
    gap: 36px;
  }
}

@media (max-width: 600px) {
  .newsletter-form-wrapper {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }
  .newsletter-btn {
    width: 100%;
  }
}

.icon-small {
  width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
}

/* Admin UI utilities */
.admin-form-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--white);
}

.admin-form-table td,
.admin-form-table th {
  padding: 12px 16px;
  border-bottom: 1px solid var(--border);
  text-align: left;
}

.admin-notice-box {
  padding: 16px;
  background: var(--blue-t1);
  border-radius: var(--r);
  border-left: 4px solid var(--blue);
  color: var(--text-body);
}

.admin-desc-muted {
  font-size: 12px;
  color: var(--text-muted);
  margin-top: 4px;
}

.admin-settings-table {
  width: 100%;
  background: var(--white);
  border-collapse: collapse;
}

.admin-table-header-cell {
  padding: 12px 16px;
  text-align: left;
  font-weight: 600;
  background: var(--off-white);
  border-bottom: 2px solid var(--border-2);
  color: var(--text-primary);
}

.admin-table-cell-20 { width: 20%; }
.admin-table-cell-15 { width: 15%; }
.admin-table-cell-30 { width: 30%; }
.admin-table-cell-right { text-align: right; }

.admin-button-danger {
  background: #d63638;
  border-color: #d63638;
  color: white;
  text-shadow: none;
}

.admin-button-danger:hover {
  background: #c7292d;
  border-color: #c7292d;
}

.admin-notice-empty,
.admin-notice-text,
.admin-notice-title {
  display: block;
}

.admin-notice-title {
  font-weight: 600;
  margin-bottom: 4px;
}

.admin-notice-text {
  font-size: 14px;
}

.admin-form-th {
  padding: 12px 16px;
  text-align: left;
  font-weight: 600;
}

/* Meta box styles (moved from inc/meta-boxes.php) */
.cetrad-mb-row {
  margin-bottom: 14px;
}

.cetrad-mb-row label {
  display: block;
  font-weight: 600;
  margin-bottom: 4px;
  font-size: 12px;
}

.cetrad-mb-row input[type="text"],
.cetrad-mb-row input[type="url"],
.cetrad-mb-row textarea {
  width: 100%;
  box-sizing: border-box;
}

.cetrad-mb-row textarea {
  height: 72px;
  resize: vertical;
}

.cetrad-mb-hint {
  margin: 4px 0 0;
  font-size: 11px;
  color: #888;
}

/* Publications filter styles (moved from archive-cetrad_publication.php) */
.filter-sub-btn {
  font-size: 11px;
  padding: 6px 14px;
  border-radius: 20px;
  border: 1px solid var(--border);
  background: var(--white);
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
  color: var(--text-body);
}

.filter-sub-btn:hover {
  border-color: var(--blue);
  color: var(--blue-s2);
}

.filter-sub-btn.active {
  background: var(--blue);
  color: var(--white);
  border-color: var(--blue);
}

.pub-list-row:hover {
  background: var(--blue-t1);
}

/* SVG color variables (Phase 5) */

/* Hero topographic SVG */
.hero-topo .topo-bg {
  fill: var(--blue-t1);
}

.hero-topo .topo-grid {
  fill: none;
  stroke: var(--blue-t2);
}

.hero-topo .topo-path {
  fill: none;
  stroke: var(--blue);
}

.hero-topo .topo-accent-sm,
.hero-topo .topo-accent-lg {
  stroke: var(--orange);
}

.hero-topo .topo-accent-sm {
  fill: var(--orange);
}

.hero-topo .topo-accent-lg {
  fill: none;
}

/* Nanyuki map SVG */
.nanyuki-map,
.home-about-map-col img {
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
  width: 100%;
  max-width: 440px;
  height: auto;
  display: block;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.nanyuki-map:hover,
.home-about-map-col img:hover {
  transform: scale(1.02);
}

.nanyuki-map .map-bg {
  fill: transparent;
}

.nanyuki-map .map-county {
  fill: var(--blue-t1);
  stroke: var(--blue);
  stroke-width: 1.5;
}

.nanyuki-map .map-route {
  fill: none;
  stroke: var(--orange);
  stroke-dasharray: 6 4;
}

.nanyuki-map .map-marker-sm {
  fill: var(--orange-s1);
  stroke: var(--white);
  stroke-width: 1.5;
}

.nanyuki-map .map-marker-lg {
  fill: none;
  stroke: var(--orange);
  stroke-width: 1.5;
  animation: pulseCircle 3s cubic-bezier(0.16, 1, 0.3, 1) infinite;
}

.nanyuki-map .map-label {
  fill: var(--text-primary);
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.02em;
}

/* Home Page About Section Overrides */
.home-about-section {
  background: var(--off-white) !important;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}

.home-about-section .g2 {
  grid-template-columns: 1.15fr 0.85fr;
  gap: 56px;
  align-items: start;
}

.home-about-map-col {
  width: 100%;
  display: flex;
  justify-content: center;
}

.home-about-section .flex-col {
  gap: 12px;
}

/* Maintain 2-column layout on desktops, laptops, and tablets, stacking only on mobile (< 600px) */
@media (min-width: 601px) {
  .home-about-section .g2 {
    grid-template-columns: 1.15fr 0.85fr;
    align-items: start;
  }
}

@media (max-width: 600px) {
  .home-about-section .g2 {
    grid-template-columns: 1fr;
    gap: 40px;
  }
}

/* Gallery icon SVGs */
.gallery-icon .icon-bg {
  fill: var(--text-primary);
}

.gallery-icon .icon-shape,
.gallery-icon .icon-grid,
.gallery-icon .icon-cell {
  fill: var(--text-secondary);
  stroke: var(--text-secondary);
}

.gallery-icon .icon-accent,
.gallery-field .icon-accent {
  stroke: var(--orange-s2);
}

.gallery-hydromet .icon-grid {
  stroke: var(--blue-s2);
}

.gallery-hydromet .icon-bar {
  fill: var(--green-s2);
}

.gallery-hydromet .icon-bar-accent {
  fill: var(--orange-s2);
}

.gallery-gis .icon-grid {
  stroke: var(--text-secondary);
}

.gallery-gis .icon-highlight {
  fill: var(--text-secondary);
  opacity: 0.7;
}

.gallery-nexus .icon-circle-1 {
  fill: var(--blue-s2);
}

.gallery-nexus .icon-circle-2 {
  fill: var(--green-s2);
}

.gallery-nexus .icon-circle-3 {
  fill: var(--green-s1);
}

.gallery-icon .icon-label {
  fill: rgba(255, 255, 255, 0.60);
}



/* ── Newsroom Downloads Section ── */
.downloads-section {
  background: var(--white);
  padding: 80px 0;
  border-top: 1px solid var(--border);
}

.downloads-header {
  margin-bottom: 48px;
}

.downloads-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}

.download-card {
  background: var(--off-white);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  padding: 32px;
  display: flex;
  flex-direction: column;
  height: 100%;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

.download-card:hover {
  transform: translateY(-4px);
  background: var(--white);
  box-shadow: var(--sh-md);
  border-color: var(--blue-t3);
}

.download-card-icon-box {
  width: 52px;
  height: 52px;
  border-radius: var(--r-lg);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 24px;
  box-shadow: var(--sh-sm);
  background: var(--blue-t1);
  color: var(--blue-s2);
  flex-shrink: 0;
}

.download-card-icon-box.file-pdf {
  background: rgba(248, 158, 36, 0.1);
  color: var(--orange-s1);
}

.download-card-icon-box.file-doc {
  background: rgba(91, 185, 71, 0.1);
  color: var(--green-s1);
}

.download-card-icon-box.file-xls {
  background: var(--blue-t1);
  color: var(--blue-s2);
}

.download-card-icon-box .ms {
  font-size: 24px;
}

.download-card-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 28px;
}

.download-card-title {
  font-size: 18px;
  font-weight: 600;
  color: var(--text-primary);
  margin: 0;
  line-height: 1.3;
}

.download-card-excerpt {
  font-size: 13.5px;
  color: var(--text-secondary);
  line-height: 1.6;
  margin: 0;
}

.download-card-action {
  margin-top: auto;
}

.download-card-action .btn-sm {
  min-height: 38px;
  padding: 8px 16px;
  font-size: 12.5px;
  border-radius: var(--r-md);
}

.w-100 {
  width: 100%;
}

.mt-48 {
  margin-top: 48px;
}

.mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.text-center {
  text-align: center;
}

@media (max-width: 900px) {
  .downloads-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .download-card {
    padding: 28px;
  }
}

/* ================================================================
   NEWSROOM NOTICES SECTION (Phase 3)
   ================================================================ */
.notices-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 32px;
  flex-wrap: wrap;
  gap: 16px;
}

.notices-title {
  margin-bottom: 0;
}

.notices-filters {
  display: flex;
  gap: 12px;
  margin-bottom: 32px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--border);
}

.notices-filter-form {
  display: flex;
  gap: 8px;
}

.notices-sort-select {
  padding: 8px 12px;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  font-size: 13px;
  background: var(--white);
  cursor: pointer;
  color: var(--text-dark);
  transition: border-color 0.2s ease;
}

.notices-sort-select:hover,
.notices-sort-select:focus {
  border-color: var(--blue);
  outline: none;
}

.notices-clear-link {
  font-size: 13px;
  color: var(--blue);
  text-decoration: none;
  margin-left: auto;
  padding: 8px 12px;
}

.notices-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 40px;
}

.notice-card-body {
  display: flex;
  gap: 20px;
  align-items: center;
}

.notice-icon-box {
  width: 64px;
  height: 64px;
  border-radius: 10px;
  color: var(--text-dark);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-family: 'DM Mono', monospace;
  flex-shrink: 0;
  box-shadow: var(--sh-sm);
}

.notice-icon-orange { background: var(--orange-t1); }
.notice-icon-green { background: var(--green-t1); }
.notice-icon-blue { background: var(--blue-t1); }

.notice-date-month {
  font-size: 10px;
  text-transform: uppercase;
  opacity: 0.65;
  font-weight: 600;
}

.notice-date-day {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.2;
  color: var(--blue-s2);
}

.notice-content {
  flex: 1;
}

.notice-title {
  margin: 0 0 6px 0;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--text-dark);
}

.notice-title a {
  text-decoration: none;
  color: inherit;
}

.notice-title a:hover {
  color: var(--blue);
}

.notice-excerpt {
  margin: 0;
  font-size: 12.5px;
  color: var(--text-body);
  line-height: 1.55;
}

.notice-read-more {
  flex-shrink: 0;
}

.notices-pagination {
  display: flex;
  justify-content: center;
  gap: 8px;
  align-items: center;
}

.notices-pagination a {
  padding: 8px 12px;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  font-size: 13px;
  text-decoration: none;
}

.notices-empty {
  text-align: center;
  padding: 40px;
}

.notices-empty-text {
  color: var(--text-muted);
  font-size: 15px;
}

/* ================================================================
   GENERAL UTILITY HELPER CLASSES (Phase 4)
   ================================================================ */
.display-none { display: none !important; }
.color-muted { color: var(--text-muted); }
.color-dark { color: var(--text-dark); }
.tracking-wide { letter-spacing: 0.05em; }
.white-space-nowrap { white-space: nowrap; }

/* Spacing Helpers */
.pb-20 { padding-bottom: 20px; }
.pt-28 { padding-top: 28px; }
.py-80 { padding-top: 80px; padding-bottom: 80px; }

/* ================================================================
   DEFAULT WORDPRESS CORE BLOCK STYLING (Phase 5)
   ================================================================ */
.entry-content pre,
.art-body pre,
.wp-block-code {
  font-family: 'DM Mono', monospace;
  font-size: 13.5px;
  background: var(--blue-t1);
  border: 1px solid var(--border);
  border-radius: var(--r);
  padding: 16px 20px;
  margin-bottom: 24px;
  overflow-x: auto;
  color: var(--text-dark);
}

.wp-block-audio,
.wp-block-video {
  margin-bottom: 24px;
  width: 100%;
}

.wp-block-video video {
  max-width: 100%;
  border-radius: var(--r-lg);
  box-shadow: var(--sh-md);
}

.wp-block-file {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  background: var(--white);
  border: 1.5px solid var(--border-2);
  border-radius: var(--r);
  padding: 14px 20px;
  margin-bottom: 24px;
}

.wp-block-file__button {
  background: var(--blue);
  color: var(--white);
  border-radius: var(--r);
  padding: 8px 16px;
  font-weight: 600;
  font-size: 12.5px;
  text-decoration: none;
}

.wp-block-file__button:hover {
  background: var(--blue-s1);
  color: var(--white);
}

.wp-block-embed {
  margin-bottom: 24px;
}

.wp-block-embed iframe {
  max-width: 100%;
  border-radius: var(--r-lg);
  box-shadow: var(--sh-md);
}

/* ================================================================
   ADDITIONAL COMPONENT & HELPERS OVERRIDES
   ================================================================ */
.art-cat-icon {
  font-size: 12px !important;
}

.btn-link {
  background: transparent !important;
  color: var(--blue-s2) !important;
  padding: 0 !important;
  min-height: auto !important;
  min-width: auto !important;
  border-radius: 0 !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
  display: inline-flex !important;
  align-items: center !important;
}

.btn-link:hover {
  color: var(--text-orange) !important;
  background: transparent !important;
}

.consultancy-section {
  background: var(--blue-t1);
}

.consultancy-icon {
  color: var(--blue) !important;
}

.post-navigation {
  margin-top: 44px;
  padding-top: 28px;
  border-top: 1px solid var(--border);
  display: flex;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}

/* Alumni Network Section */
.alumni-network-section {
  padding: 80px 0;
  background: var(--off-white);
}

.alumni-section-header {
  text-align: center;
  margin-bottom: 60px;
}

/* Statistics Grid */
.alumni-stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 28px;
  margin-bottom: 80px;
}

.alumni-stat-card {
  background: var(--white);
  padding: 32px;
  border-radius: var(--r-lg);
  border: 1px solid var(--border);
  text-align: center;
  transition: all 0.3s;
}

.alumni-stat-card:hover {
  border-color: var(--blue);
  box-shadow: var(--sh-lg);
  transform: translateY(-4px);
}

.stat-icon {
  font-size: 40px;
  color: var(--blue);
  margin-bottom: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.stat-number {
  font-size: 36px;
  font-weight: 700;
  color: var(--blue);
  margin-bottom: 8px;
}

.stat-label {
  font-size: 14px;
  color: var(--text-secondary);
  line-height: 1.5;
}

/* Featured Alumni */
.alumni-featured-section {
  margin-bottom: 60px;
  padding: 48px;
  background: var(--white);
  border-radius: var(--r-lg);
  border: 1px solid var(--border);
}

.featured-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 32px;
}

.featured-header h3 {
  font-size: 24px;
  font-weight: 700;
}

.featured-nav {
  display: flex;
  gap: 8px;
}

.featured-prev,
.featured-next {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 2px solid var(--border);
  background: var(--white);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}

.featured-prev:hover,
.featured-next:hover {
  border-color: var(--blue);
  color: var(--blue);
}

.featured-prev:disabled,
.featured-next:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

/* Carousel */
.featured-alumni-carousel {
  overflow: hidden;
}

.carousel-track {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 24px;
}

.carousel-slide {
  min-width: 0;
}

.alumni-card-featured {
  text-align: center;
}

.alumni-photo {
  width: 100%;
  aspect-ratio: 1;
  border-radius: var(--r-lg);
  overflow: hidden;
  margin-bottom: 16px;
  background: var(--off-white);
}

.alumni-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.alumni-photo-placeholder {
  width: 100%;
  aspect-ratio: 1;
  border-radius: var(--r-lg);
  background: var(--blue-t1);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 64px;
  color: var(--blue);
  margin-bottom: 16px;
}

.alumni-info h4 {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 8px;
}

.alumni-courses {
  font-size: 12px;
  color: var(--text-secondary);
  margin-bottom: 12px;
  line-height: 1.4;
}

.alumni-view-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--blue);
  text-decoration: none;
  font-weight: 600;
  font-size: 13px;
  transition: gap 0.2s;
}

.alumni-view-link:hover {
  gap: 10px;
}

/* CTA Section */
.alumni-cta-section {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 28px;
}

.cta-card {
  padding: 40px;
  background: var(--white);
  border-radius: var(--r-lg);
  border: 1px solid var(--border);
}

.cta-card h3 {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 12px;
}

.cta-card p {
  font-size: 14px;
  color: var(--text-secondary);
  margin-bottom: 24px;
  line-height: 1.6;
}

.cta-buttons {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.cta-buttons .btn {
  width: 100%;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

/* ================================================================
   ALUMNI LISTING PAGE
   ================================================================ */

.alumni-listing-section {
  padding: 80px 0;
}

.no-alumni-message {
  text-align: center;
  padding: 60px 20px;
  font-size: 18px;
  color: var(--text-secondary);
}

.alumni-year-section {
  margin-bottom: 80px;
}

.alumni-year-title {
  font-size: 32px;
  font-weight: 600;
  margin-bottom: 30px;
  color: var(--text-primary);
  display: flex;
  align-items: center;
  gap: 12px;
}

.alumni-count {
  font-size: 18px;
  font-weight: 400;
  color: var(--text-secondary);
}

.alumni-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 40px;
}

.alumni-row {
  background: var(--white);
  border-radius: var(--r-lg);
  border: 1px solid var(--border);
  box-shadow: var(--sh-sm);
  padding: 16px 24px;
  display: grid;
  grid-template-columns: auto 1.5fr 2fr auto;
  gap: 24px;
  align-items: center;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.25s;
}

.alumni-row:hover {
  transform: translateY(-2px);
  box-shadow: var(--sh-md);
  border-color: var(--blue-t2);
}

.alumni-row-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  flex-shrink: 0;
  box-shadow: var(--sh-sm);
}

.alumni-row-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.alumni-row-avatar .team-card-initials-fallback {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.25rem;
  font-weight: 600;
  color: #fff;
}

.alumni-row-info {
  display: flex;
  flex-direction: column;
}

.alumni-row-name {
  font-size: 16.5px;
  font-weight: 600;
  color: var(--text-primary);
  margin: 0;
}

.alumni-row-courses {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.alumni-courses-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.alumni-courses-tags .tag.gray {
  background: #f8fafb;
  border: 1px solid var(--border);
  color: var(--text-body);
  transition: all 0.2s ease;
}

.alumni-courses-tags .tag.gray:hover {
  background: var(--blue-t1);
  border-color: var(--blue-t2);
  color: var(--blue);
}

.alumni-row-action {
  display: flex;
  justify-content: flex-end;
}

.alumni-row-action .btn.btn-outline-small {
  padding: 8px 16px;
  font-size: 12.5px;
  font-weight: 600;
  border-radius: var(--r-md);
  border: 1px solid var(--border);
  color: var(--text-secondary);
  background: transparent;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: all 0.2s ease;
  text-decoration: none;
}

.alumni-row-action .btn.btn-outline-small:hover {
  border-color: var(--blue-t3);
  color: var(--blue-s2);
  background: var(--blue-t1);
}

.alumni-row-action .btn.btn-outline-small .ms {
  font-size: 14px;
  transition: transform 0.2s ease;
}

.alumni-row-action .btn.btn-outline-small:hover .ms {
  transform: translateX(2px);
}

/* Responsive */
@media (max-width: 768px) {
  .alumni-network-section {
    padding: 60px 0;
  }

  .featured-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }

  .carousel-track {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 16px;
  }

  .alumni-featured-section {
    padding: 24px;
  }

  .alumni-cta-section {
    grid-template-columns: 1fr;
  }

  .cta-buttons {
    flex-direction: row;
  }

  .cta-buttons .btn {
    flex: 1;
  }

  .alumni-listing-section {
    padding: 40px 0;
  }

  .alumni-year-title {
    font-size: 24px;
    margin-bottom: 20px;
  }

  .alumni-row {
    grid-template-columns: auto 1fr;
    gap: 16px;
    padding: 16px;
  }
  .alumni-row-courses {
    grid-column: span 2;
    border-top: 1px solid var(--border);
    padding-top: 12px;
  }
  .alumni-row-action {
    grid-column: span 2;
    justify-content: flex-start;
    border-top: 1px solid var(--border);
    padding-top: 12px;
  }
}

/* Alumni Listing Search and Filters */
.alumni-listing-controls {
  max-width: 800px;
  margin: 0 auto 54px;
  text-align: center;
}

.alumni-search-wrapper {
  position: relative;
  max-width: 480px;
  margin: 0 auto 28px;
}

.alumni-search-wrapper input {
  width: 100%;
  padding: 14px 44px 14px 48px;
  border: 1.5px solid var(--border-2);
  border-radius: var(--r-xl);
  font-size: 15px;
  color: var(--text-primary);
  background: var(--white);
  box-shadow: var(--sh-sm);
  transition: all 0.25s ease;
}

.alumni-search-wrapper input:focus {
  border-color: var(--blue);
  box-shadow: var(--sh-md);
  outline: none;
}

.alumni-search-wrapper .search-icon {
  position: absolute;
  left: 18px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--text-secondary);
  font-size: 20px;
  pointer-events: none;
}

.alumni-search-clear {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  border: none;
  background: none;
  font-size: 18px;
  color: var(--text-secondary);
  cursor: pointer;
  padding: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: background 0.2s, color 0.2s;
}

.alumni-search-clear:hover {
  background: var(--border);
  color: var(--text-primary);
}

.alumni-filters {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.alumni-filters .filter-btn {
  background: var(--white);
  border: 1px solid var(--border-2);
  color: var(--text-secondary);
  padding: 8px 18px;
  border-radius: 20px;
  font-size: 12px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

.alumni-filters .filter-btn:hover {
  border-color: var(--blue);
  color: var(--blue);
  transform: translateY(-1px);
}

.alumni-filters .filter-btn.active {
  background: var(--blue);
  border-color: var(--blue);
  color: var(--white);
  box-shadow: var(--sh-sm);
}

/* Hidden States for JS Filter Engine */
.alumni-item.search-hidden,
.alumni-year-section.filter-hidden {
  display: none !important;
}

/* ==========================================================================
   RESEARCH & ABOUT PAGES - REFINED PREMIUM VISUAL LAYOUT OVERRIDES
   ========================================================================== */

/* Values section card hover icon rotate & scale */
#values .card {
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.3s ease;
}
#values .card:hover {
  border-color: var(--blue-t3);
  transform: translateY(-4px);
}
#values .card-body .ms {
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
#values .card:hover .ms {
  transform: scale(1.1) rotate(2deg);
}

/* Research Page - Stats Grid */
.research-stats-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-top: 16px;
}
.research-stat-item {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: 28px 24px;
  text-align: center;
  box-shadow: var(--sh-sm);
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.3s ease;
}
.research-stat-item:hover {
  transform: translateY(-2px);
  box-shadow: var(--sh-md);
  border-color: var(--blue-t3);
}
.research-stat-item .stat-n {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 2.3rem;
  font-weight: 700;
  color: var(--blue-s2);
  line-height: 1.1;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  display: inline-block;
}
.research-stat-item:hover .stat-n {
  transform: scale(1.06);
}
.research-stat-item .stat-l {
  font-size: 11px;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-top: 8px;
}
@media (max-width: 600px) {
  .research-stats-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

/* Research Page - Thrust Areas Grid and Card Mods */
.research-thrust-card {
  position: relative;
  border-top: 3px solid transparent;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.25s ease;
}
.research-thrust-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--sh-md);
  z-index: 2;
}
.research-thrust-card.blue { border-top-color: var(--blue); }
.research-thrust-card.blue .ms { color: var(--blue-s2); }
.research-thrust-card.blue:hover { background: var(--blue-t1); }

.research-thrust-card.green { border-top-color: var(--green); }
.research-thrust-card.green .ms { color: var(--green-s1); }
.research-thrust-card.green:hover { background: var(--green-t1); }

.research-thrust-card.orange { border-top-color: var(--orange); }
.research-thrust-card.orange .ms { color: var(--orange); }
.research-thrust-card.orange:hover { background: var(--orange-t1); }

/* Research Page - Current Projects Card Heights */
.research-project-card {
  display: flex;
  flex-direction: column;
}

/* Research Page - Past Projects Row Responsive Layout */
@media (max-width: 600px) {
  .past-project-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  .past-project-row .ms {
    align-self: flex-end;
  }
}

/* About Page - Unified Sidebar Card Location Section */
.about-card-divider {
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  margin: 28px 0;
}
.about-card-location {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
.about-card-location .ms {
  font-size: 24px;
  color: var(--blue-t3);
  flex-shrink: 0;
  margin-top: 1px;
}
.about-card-location h4 {
  font-size: 14.5px;
  font-weight: 600;
  color: white;
  margin-bottom: 6px;
}
.about-card-location p {
  font-size: 13.5px;
  color: rgba(255, 255, 255, 0.75);
  line-height: 1.65;
  margin: 0;
  font-weight: 300;
}

/* Courses List View */
.courses-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 40px;
}
.course-row {
  background: var(--white);
  border-radius: var(--r-xl);
  border: 1px solid var(--border);
  box-shadow: var(--sh-sm);
  padding: 24px 32px;
  display: grid;
  grid-template-columns: 2fr 1.5fr auto;
  gap: 32px;
  align-items: center;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.25s;
}
.course-row:hover {
  transform: translateY(-2px);
  box-shadow: var(--sh-md);
  border-color: var(--orange-t2);
}
.course-row-info {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.course-row-title-wrap {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.course-row-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.35rem;
  font-weight: 600;
  color: var(--text-dark);
  line-height: 1.3;
  margin: 0;
}
.course-row-desc {
  font-size: 13.5px;
  color: var(--text-body);
  line-height: 1.6;
  margin: 0;
}
.course-row-meta {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.course-meta-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 11px;
  color: var(--text-muted);
}
.course-meta-item .ms {
  font-size: 16px;
  color: var(--blue);
}
.course-row-action {
  display: flex;
  justify-content: flex-end;
  grid-column: 3;
}
@media (max-width: 900px) {
  .course-row {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 24px;
  }
  .course-row-meta {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 16px;
    border-top: 1px solid var(--border);
    padding-top: 16px;
  }
  .course-row-action {
    grid-column: auto;
    justify-content: flex-start;
    border-top: 1px solid var(--border);
    padding-top: 16px;
  }
}

/* 404 Error Page Redesign */
.error-404-main {
  min-height: calc(100vh - 420px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 100px 0;
  background: #fafafa;
}
.error-404-container {
  max-width: 640px;
  margin: 0 auto;
  padding: 0 24px;
}
.error-404-content {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
}
.error-404-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 18px;
  background: var(--blue-t1);
  border: 1px solid var(--blue-t2);
  border-radius: var(--r-full);
  color: var(--blue-s2);
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 700;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.error-404-badge .ms {
  font-size: 18px;
  color: var(--blue);
}
.error-404-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 3rem;
  font-weight: 600;
  color: var(--text-dark);
  line-height: 1.25;
  margin: 0;
}
.error-404-text {
  font-size: 15px;
  color: var(--text-secondary);
  line-height: 1.7;
  margin: 0;
  max-width: 500px;
}
.error-404-search {
  width: 100%;
  max-width: 460px;
  margin: 8px 0;
}
.error-404-search .search-form {
  margin: 0 auto;
  box-shadow: var(--sh-sm);
}
.error-404-nav {
  width: 100%;
  margin-top: 16px;
  border-top: 1px solid var(--border);
  padding-top: 32px;
}
.error-nav-title {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-muted);
  margin-bottom: 20px;
  margin-top: 0;
}
.error-nav-links {
  display: flex;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}
.error-nav-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 18px;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-secondary);
  text-decoration: none;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  box-shadow: var(--sh-xs);
}
.error-nav-item:hover {
  transform: translateY(-2px);
  border-color: var(--blue-t3);
  color: var(--blue-s2);
  box-shadow: var(--sh-sm);
}
.error-nav-item .ms {
  font-size: 16px;
  color: var(--blue);
}
@media (max-width: 600px) {
  .error-404-main {
    padding: 60px 0;
  }
  .error-404-title {
    font-size: 2.3rem;
  }
  .error-nav-links {
    flex-direction: column;
    gap: 8px;
    width: 100%;
    max-width: 280px;
    margin: 0 auto;
  }
  .error-nav-item {
    justify-content: center;
  }
}

/* ==========================================================================
   CPT DEPARTMENTS ARCHIVE STYLES
   Scoped to .about-section-white so they do not override the dark-section
   dept cards used on the Team page.
   ========================================================================== */
.about-section-white .dept-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 25px;
}
.about-section-white .dept-card {
  padding: 25px;
  background: var(--white);
  border-radius: 8px;
  border-top: 4px solid var(--blue-s2);
  box-shadow: 0 2px 8px rgba(7, 61, 74, 0.08);
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  display: flex;
  flex-direction: column;
}
.about-section-white .dept-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(7, 61, 74, 0.14);
}
.about-section-white .dept-card-header {
  margin-bottom: 20px;
}
.about-section-white .dept-icon-box {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  background: var(--blue-s1);
  border-radius: 8px;
  margin-bottom: 15px;
  color: var(--white);
  font-size: 28px;
}
.about-section-white .dept-title {
  margin: 0 0 8px;
  font-size: 20px;
  font-weight: 700;
}
.about-section-white .dept-title a {
  color: var(--text-primary);
  text-decoration: none;
  transition: color 0.2s ease;
}
.about-section-white .dept-title a:hover {
  color: var(--blue-s2);
}
.about-section-white .dept-excerpt {
  margin: 0 0 15px;
  color: var(--text-secondary);
  font-size: 14px;
}
.about-section-white .dept-details {
  flex: 1;
}
.about-section-white .dept-meta-item {
  padding-bottom: 15px;
  border-bottom: 1px solid rgba(7, 61, 74, 0.08);
  margin-bottom: 15px;
}
.about-section-white .dept-meta-item:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}
.about-section-white .dept-meta-label {
  margin: 0;
  font-size: 12px;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-weight: 600;
}
.about-section-white .dept-meta-val {
  margin: 5px 0 0;
  font-size: 15px;
  font-weight: 600;
  color: var(--text-primary);
}
.about-section-white .dept-meta-subtitle {
  margin: 2px 0 0;
  font-size: 13px;
  color: var(--text-secondary);
}
.about-section-white .dept-meta-staff-val {
  margin: 5px 0 0;
  font-size: 18px;
  font-weight: 700;
  color: var(--blue-s2);
}
.about-section-white .dept-meta-link {
  margin: 5px 0 0;
  font-size: 13px;
  color: var(--blue-s2);
  text-decoration: none;
  display: inline-block;
  transition: color 0.2s ease;
}
.about-section-white .dept-meta-link:hover {
  color: var(--text-orange);
}
.about-section-white .dept-meta-link .ms {
  font-size: 16px;
  vertical-align: middle;
  margin-right: 5px;
}
.about-section-white .dept-card-footer {
  margin-top: 20px;
  padding-top: 15px;
  border-top: 1px solid rgba(7, 61, 74, 0.08);
}
.about-section-white .dept-card-footer .btn {
  width: 100%;
  text-align: center;
  display: block;
  text-decoration: none;
}
.dept-empty-box {
  text-align: center;
  padding: 60px 20px;
  color: var(--text-muted);
}
.dept-empty-box .ms {
  font-size: 48px;
  display: block;
  margin-bottom: 15px;
}

/* ================================================================
   CPT LAYOUT ENHANCEMENTS & CLEANUP
   ================================================================ */

/* Unified Row Card (Projects, Newsletters) */
.cpt-row-card {
  background: var(--white);
  border-radius: var(--r-lg);
  border: 1px solid rgba(7, 61, 74, 0.05);
  border-left: 4px solid var(--blue-s2);
  box-shadow: 0 4px 20px -2px rgba(7, 61, 74, 0.04), 0 2px 6px -1px rgba(7, 61, 74, 0.02);
  padding: 24px;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.4s ease;
  width: 100%;
}
.cpt-row-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 28px -6px rgba(7, 61, 74, 0.1), 0 4px 10px -2px rgba(7, 61, 74, 0.03);
  border-color: rgba(31, 189, 227, 0.2);
}
.cpt-row-card-inner {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 24px;
}
@media (max-width: 768px) {
  .cpt-row-card-inner {
    flex-direction: column;
  }
}
.cpt-row-card-body {
  flex: 1;
  min-width: 0;
}
.cpt-row-card-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.35rem;
  font-weight: 600;
  margin: 0 0 10px 0;
  line-height: 1.3;
}
.cpt-row-card-title a {
  color: var(--text-primary);
  text-decoration: none;
  transition: color 0.2s ease;
}
.cpt-row-card-title a:hover {
  color: var(--blue-s2);
}
.cpt-row-card-excerpt {
  font-size: 13.5px;
  color: var(--text-secondary);
  line-height: 1.6;
  margin: 0 0 16px 0;
}
.cpt-row-card-meta {
  display: flex;
  gap: 20px;
  margin-bottom: 16px;
  flex-wrap: wrap;
  font-size: 13px;
  color: var(--text-muted);
}
.cpt-row-card-meta span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.cpt-row-card-meta .ms {
  font-size: 15px;
  color: var(--blue-s1);
}
.cpt-row-card-tags {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.cpt-row-card-aside {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 12px;
}
@media (max-width: 768px) {
  .cpt-row-card-aside {
    width: 100%;
    align-items: flex-start;
  }
}
.cpt-row-card-thumb-wrap {
  display: block;
}
.cpt-row-card-thumb {
  border-radius: var(--r-md);
  width: 200px;
  height: auto;
  display: block;
}
@media (max-width: 768px) {
  .cpt-row-card-thumb {
    width: 100%;
    max-width: 280px;
  }
}

/* Filter Widget */
.cpt-filter-widget {
  background: var(--bg-neutral, #f8f9fa);
  border-radius: var(--r-md);
  padding: 20px;
  margin-bottom: 32px;
  border: 1px solid var(--border);
}
.cpt-filter-widget h3 {
  margin-top: 0;
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 15px;
  color: var(--text-primary);
}
.cpt-filter-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
@media (max-width: 640px) {
  .cpt-filter-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}
.cpt-filter-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.cpt-filter-label {
  font-weight: 600;
  font-size: 13.5px;
  color: var(--text-primary);
}
.cpt-filter-select {
  width: 100%;
  padding: 10px 12px;
  border-radius: var(--r-sm, 6px);
  border: 1px solid var(--border);
  background-color: var(--white);
  color: var(--text-primary);
  font-size: 13.5px;
  cursor: pointer;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.cpt-filter-select:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 2px rgba(31, 189, 227, 0.15);
  outline: none;
}

/* Alumni Grid & Cards */
.alumni-section-title {
  font-size: 1.5rem;
  font-weight: 700;
  margin-bottom: 24px;
  color: var(--text-primary);
}
.alumni-grid-layout {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 24px;
  margin-top: 32px;
}
.alumni-item-card {
  text-align: center;
  padding: 24px 16px;
  border-radius: var(--r-md);
  background: var(--white);
  border: 1px solid rgba(7, 61, 74, 0.05);
  box-shadow: 0 2px 10px rgba(7, 61, 74, 0.03);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.alumni-item-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 20px rgba(7, 61, 74, 0.08);
}
.alumni-item-avatar {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 16px;
  color: var(--white);
  font-weight: 700;
  box-shadow: 0 4px 10px rgba(0,0,0,0.08);
}
.alumni-item-initials {
  font-size: 26px;
}
.alumni-item-name {
  margin: 0 0 6px 0;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--text-primary);
}
.alumni-item-course {
  margin: 0;
  font-size: 12.5px;
  color: var(--text-muted);
}

/* Alumni Archive Classes page styling */
.cpt-archive-grid {
  display: grid;
  gap: 32px;
}
.alumni-year-selector {
  text-align: center;
  margin-bottom: 40px;
  padding: 16px;
  background: var(--bg-neutral, #f8f9fa);
  border-radius: var(--r-md);
  border: 1px solid var(--border);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
}
@media (max-width: 480px) {
  .alumni-year-selector {
    flex-direction: column;
    width: 100%;
    align-items: stretch;
  }
}
.alumni-year-label {
  font-weight: 600;
  color: var(--text-primary);
  font-size: 14.5px;
}
.alumni-year-select {
  padding: 8px 16px;
  border-radius: var(--r-sm, 6px);
  border: 1px solid var(--border);
  background-color: var(--white);
  color: var(--text-primary);
  font-size: 14px;
  cursor: pointer;
}
.alumni-class-card-course {
  font-size: 14px;
  color: var(--text-secondary);
  margin-top: 8px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.alumni-class-card-course .ms {
  font-size: 15px;
  color: var(--blue-s1);
}
.alumni-class-more-card {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: var(--bg-neutral, #f8f9fa);
  border-radius: var(--r-sm, 6px);
  border: 1px dashed var(--border);
}
.alumni-class-more-text {
  margin: 0;
  font-size: 14px;
  color: var(--text-secondary);
  font-weight: 500;
}

/* Training page alumni section */
.training-alumni-section {
  padding: 60px 20px;
  background: var(--white);
  border-top: 1px solid var(--border);
}
.training-alumni-content {
  text-align: center;
}
.training-alumni-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 16px;
  color: var(--text-primary);
}
.training-alumni-text {
  font-size: 16px;
  color: var(--text-secondary);
  max-width: 600px;
  margin: 0 auto 28px;
  line-height: 1.6;
}
.training-alumni-btn {
  display: inline-block;
}

/* 404 Page */
.error-404-section {
  padding: 80px 20px;
  background: var(--white);
}
.error-404-search-block {
  max-width: 600px;
  margin: 0 auto 60px;
  padding: 40px;
  background: var(--bg-neutral, #f8f9fa);
  border-radius: 10px;
  border: 1px solid var(--border);
}
.error-404-search-block h2 {
  text-align: center;
  margin-bottom: 20px;
  color: var(--text-primary);
}
.error-404-search-block form {
  display: flex;
  gap: 10px;
}
.error-404-search-block input[type="search"] {
  flex: 1;
  padding: 12px 15px;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 14px;
}
.error-404-search-block button {
  padding: 12px 25px;
  background: var(--blue);
  color: white;
  border: none;
  border-radius: 6px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.3s ease;
}
.error-404-search-block button:hover {
  background: var(--blue-s2);
}
.error-404-links {
  margin-bottom: 60px;
}
.error-404-links h3 {
  text-align: center;
  margin-bottom: 30px;
  color: var(--text-primary);
  font-size: 20px;
  font-weight: 700;
}
.error-404-links-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 20px;
}
.error-404-link-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 30px 20px;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 8px;
  text-decoration: none;
  color: var(--text-primary);
  transition: all 0.3s ease;
}
.error-404-link-card:hover {
  border-color: var(--blue);
  box-shadow: 0 4px 16px rgba(31, 189, 227, 0.1);
  transform: translateY(-2px);
}
.error-404-link-card .ms {
  font-size: 32px;
  color: var(--blue);
}
.error-404-link-card .link-text {
  font-weight: 600;
  font-size: 15px;
  text-align: center;
}
@media (max-width: 768px) {
  .error-404-section {
    padding: 60px 15px;
  }
  .error-404-search-block {
    padding: 30px 20px;
    margin-bottom: 40px;
  }
  .error-404-search-block form {
    flex-direction: column;
  }
  .error-404-search-block button {
    width: 100%;
  }
  .error-404-links-grid {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 15px;
  }
  .error-404-link-card {
    padding: 25px 15px;
  }
  .error-404-link-card .ms {
    font-size: 28px;
  }
  .error-404-link-card .link-text {
    font-size: 14px;
  }
}
@media (max-width: 480px) {
  .error-404-section {
    padding: 50px 10px;
  }
  .error-404-search-block {
    padding: 20px 15px;
    margin-bottom: 30px;
  }
  .error-404-links-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
  .error-404-link-card {
    padding: 20px 12px;
    gap: 10px;
  }
  .error-404-link-card .ms {
    font-size: 24px;
  }
  .error-404-link-card .link-text {
    font-size: 12px;
  }
}

/* Course / CPT Single Helpers */
.course-actions {
  margin-top: 40px;
}
.course-sidebar-text {
  margin-bottom: 16px;
  font-size: 14px;
  color: var(--text-secondary);
}
.cpt-highlight-box {
  margin-top: 40px;
  padding: 20px;
  background: var(--bg-neutral, #f8f9fa);
  border-radius: var(--r-md);
  border: 1px solid var(--border);
}
.cpt-highlight-box h3 {
  margin-top: 0;
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 12px;
  color: var(--text-primary);
}
.cpt-highlight-box-flex {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

/* Alumni Class Card & Grid (for Class Archive) */
.alumni-class-card {
  background: var(--white);
  border-radius: var(--r-lg);
  border: 1px solid rgba(7, 61, 74, 0.05);
  box-shadow: 0 4px 20px -2px rgba(7, 61, 74, 0.04);
  padding: 24px;
  margin-bottom: 24px;
}
.class-card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 20px;
  border-bottom: 1px solid var(--border);
  padding-bottom: 16px;
  margin-bottom: 20px;
}
@media (max-width: 640px) {
  .class-card-header {
    flex-direction: column;
    align-items: stretch;
  }
}
.class-card-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.35rem;
  font-weight: 600;
  margin: 0 0 8px 0;
}
.class-card-title a {
  color: var(--text-primary);
  text-decoration: none;
  transition: color 0.2s ease;
}
.class-card-title a:hover {
  color: var(--blue-s2);
}
.class-card-meta {
  font-size: 13.5px;
  color: var(--text-muted);
  margin: 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.class-card-meta .ms {
  font-size: 15px;
  color: var(--blue-s1);
  margin-right: 6px;
}
.class-card-meta-sep {
  margin-left: 16px;
  display: inline-flex;
  align-items: center;
}
.class-alumni-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 20px;
  margin-top: 20px;
}
.alumni-profile-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  background: var(--bg-neutral, #f8f9fa);
  border-radius: var(--r-sm, 6px);
  border: 1px solid rgba(7, 61, 74, 0.03);
}
.alumni-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white);
  font-weight: 700;
  font-size: 12px;
  flex-shrink: 0;
}
.alumni-initials {
  font-size: 13px;
}
.alumni-info {
  min-width: 0;
}
.alumni-name {
  margin: 0;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Training Alumni CTA */
.training-alumni-cta {
  padding: 60px 20px;
  background: var(--white);
  border-top: 1px solid var(--border);
}
.training-alumni-cta-content {
  text-align: center;
}
.training-alumni-cta-title {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 16px;
  color: var(--text-primary);
}
.training-alumni-cta-text {
  font-size: 16px;
  color: var(--text-secondary);
  max-width: 600px;
  margin: 0 auto 32px;
  line-height: 1.6;
}
.training-alumni-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

/* Alumni No Results styling */
.alumni-no-results {
  margin-top: 40px;
  margin-bottom: 60px;
}
.alumni-no-results .ms {
  font-size: 48px;
  color: var(--text-secondary);
}
.alumni-no-results p {
  font-size: 16px;
  color: var(--text-secondary);
}