/* ============================================================
   Anderman & Company — combined site CSS
   Built from: styles-v2.css + pages-v2.css + home-v3.css
   Generated: 2026-05-18
   ============================================================ */

/* ===== styles-v2.css ===== */
/* ============================================================
   Anderman & Company — Home Page Prototype  v2
   Builds on v1 + new components:
   - Re-architected mega menu (fixed below header, never overflows)
   - Full-screen search modal (teal @ 0.85 opacity, blur)
   - AI chat FAB + side panel
   - About-section image illustration
   - Materials CTA
   - Auto-scrolling logo carousel
   - Searchable FAQs
   - Map background under contact form
   ============================================================ */

:root {
  --dark:        #1c2b3a;
  --dark-lt:     #243648;
  --accent:      #04adee;
  --accent-dk:   #0399d4;
  --accent-rgb:  4,173,238;
  --secondary:   #6b7c8e;
  --muted:       #5a6b7a;
  --light:       #e8eaef;
  --light-alt:   #f0f2f5;
  --white:       #ffffff;
  --border:      rgba(28,43,58,0.10);
  --overlay:     rgba(28,43,58,0.65);
  --error:       #d94040;

  --r-sm: 6px;  --r-md: 12px;  --r-lg: 20px;  --r-pill: 999px;

  --shadow-sm: 0 1px 3px rgba(28,43,58,.06);
  --shadow-md: 0 4px 8px rgba(28,43,58,.08), 0 2px 4px rgba(28,43,58,.04);
  --shadow-lg: 0 10px 20px rgba(28,43,58,.10), 0 4px 8px rgba(28,43,58,.06);
  --shadow-xl: 0 20px 30px rgba(28,43,58,.12), 0 10px 12px rgba(28,43,58,.06);
  --shadow-card: 0 2px 12px rgba(28,43,58,.08);
  --shadow-card-hover: 0 8px 28px rgba(28,43,58,.16);

  --container: 1200px;
  --container-narrow: 880px;
  --header-h: 84px;
  --header-h-compact: 64px;

  --ease: cubic-bezier(.4,0,.2,1);
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; -webkit-font-smoothing:antialiased; }
body {
  font-family:'Open Sans',-apple-system,BlinkMacSystemFont,sans-serif;
  font-size:16px; line-height:1.6; color:var(--dark);
  background:var(--light);
}
img { max-width:100%; display:block; }
a { color:var(--accent); text-decoration:none; transition:color .2s var(--ease); }
a:hover { color:var(--accent-dk); }
button { font-family:inherit; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; }

.container { width:100%; max-width:var(--container); margin:0 auto; padding:0 1.5rem; }
.container.narrow { max-width:var(--container-narrow); }
.section { padding:5rem 0; background:var(--white); }
.section-grey { background:var(--light); }

/* ========== Buttons ========== */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:.45rem;
  padding:.7rem 1.6rem;
  font-size:.85rem; font-weight:600; letter-spacing:.01em;
  text-decoration:none;
  border:2px solid transparent;
  border-radius:var(--r-pill);
  cursor:pointer;
  transition:all .35s var(--ease);
  white-space:nowrap;
}
.btn-primary { background:var(--accent); color:#fff; border-color:var(--accent); }
.btn-primary:hover { background:var(--accent-dk); border-color:var(--accent-dk); transform:translateY(-2px); box-shadow:0 5px 15px rgba(2,100,138,.35); color:#fff; }
.btn-secondary { background:var(--dark); color:#fff; border-color:var(--dark); }
.btn-secondary:hover { background:var(--dark-lt); transform:translateY(-2px); color:#fff; }
.btn-outline { background:transparent; color:var(--accent); border-color:var(--accent); }
.btn-outline:hover { background:var(--accent); color:#fff; transform:translateY(-2px); }
.btn-sm { padding:.5rem 1.1rem; font-size:.78rem; }
.btn-lg { padding:.95rem 2rem; font-size:.95rem; }
.btn-block { display:flex; width:100%; }

/* ========== Title holder ========== */
.title-holder { margin-bottom:2.5rem; }
.title-holder.center { text-align:center; }
.title-holder .st {
  display:block;
  font-size:.75rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:var(--accent); margin-bottom:.5rem;
}
.title-holder .tt {
  font-size:clamp(1.6rem,3vw,2.1rem); font-weight:700;
  line-height:1.2; letter-spacing:-.01em; color:var(--dark);
}
.title-holder .tb {
  display:block; width:48px; height:3px; margin-top:.85rem;
  background:var(--accent); border-radius:2px;
}
.title-holder.center .tb { margin-left:auto; margin-right:auto; }
.center-cta { text-align:center; margin-top:2.5rem; }

/* ============================================================
   HEADER
============================================================ */
.site-header {
  position:fixed; top:0; left:0; right:0; z-index:50;
  background:rgba(255,255,255,.97);
  backdrop-filter:saturate(140%) blur(8px);
  border-bottom:1px solid transparent;
  transition:box-shadow .25s var(--ease), border-color .25s var(--ease), background .25s var(--ease);
}
.site-header.scrolled { box-shadow:var(--shadow-md); border-bottom-color:var(--border); }
.header-inner {
  max-width:1320px; margin:0 auto;
  display:flex; align-items:center; gap:1.5rem;
  padding:0 1.5rem;
  height:var(--header-h);
  transition:height .25s var(--ease);
}
.site-header.scrolled .header-inner { height:var(--header-h-compact); }

.brand { display:flex; align-items:center; gap:.75rem; flex-shrink:0; }
.brand-logo { width:140px; height:auto; transition:width .25s var(--ease); }
.site-header.scrolled .brand-logo { width:115px; }
.brand-badge {
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:.1rem;
  padding:.32rem .65rem;
  background:var(--accent); color:#fff;
  border-radius:var(--r-md, 8px);
  letter-spacing:.06em;
  text-transform:uppercase;
  line-height:1;
  transition:transform .25s var(--ease);
}
.brand-badge .bb-eyebrow {
  font-size:.55rem;
  font-weight:600;
  letter-spacing:.14em;
  opacity:.92;
}
.brand-badge .bb-main {
  display:inline-flex;
  align-items:baseline;
  gap:.28rem;
  font-weight:800;
}
.brand-badge .bb-num {
  font-size:.95rem;
  font-weight:800;
  letter-spacing:0;
}
.brand-badge .bb-txt {
  font-size:.62rem;
  font-weight:800;
}
.site-header.scrolled .brand-badge { transform:scale(.9); }

/* primary nav */
.primary-nav { flex:1; min-width:0; }
.nav-list { list-style:none; display:flex; gap:.25rem; justify-content:center; align-items:center; }
.nav-item { position:relative; }
.nav-link {
  display:inline-flex; align-items:center; gap:.3rem;
  padding:.65rem .85rem;
  background:transparent; border:none;
  font-size:.88rem; font-weight:600; color:var(--dark);
  cursor:pointer; text-decoration:none;
  border-radius:var(--r-sm);
  transition:color .2s var(--ease), background .2s var(--ease);
}
.nav-link:hover, .nav-item.open > .nav-link, .nav-link[aria-expanded="true"] {
  color:var(--accent); background:rgba(var(--accent-rgb),.06);
}
.nav-link .caret { transition:transform .25s var(--ease); }
.nav-item.open .caret, .nav-link[aria-expanded="true"] .caret { transform:rotate(180deg); }

.header-utils { display:flex; align-items:center; gap:.6rem; flex-shrink:0; }
.header-search {
  width:36px; height:36px; border-radius:50%;
  background:transparent; border:1px solid var(--border);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; color:var(--dark);
  transition:all .2s var(--ease);
}
.header-search:hover { background:var(--accent); border-color:var(--accent); color:#fff; transform:translateY(-1px); }

/* lang */
.lang-switch { position:relative; }
.lang-btn {
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.45rem .7rem;
  background:transparent; border:1px solid var(--border);
  border-radius:var(--r-pill);
  font-size:.78rem; font-weight:700; color:var(--dark);
  cursor:pointer; transition:all .2s var(--ease);
}
.lang-btn:hover, .lang-switch.open .lang-btn { border-color:var(--accent); color:var(--accent); }
.lang-flag { font-size:.9rem; line-height:1; }
.lang-menu {
  position:absolute; top:calc(100% + 6px); right:0;
  list-style:none; min-width:160px;
  background:#fff; border:1px solid var(--border);
  border-radius:var(--r-sm); box-shadow:var(--shadow-lg);
  padding:.4rem 0;
  opacity:0; transform:translateY(-4px); pointer-events:none;
  transition:all .2s var(--ease);
  z-index:60;
}
.lang-switch.open .lang-menu { opacity:1; transform:translateY(0); pointer-events:auto; }
.lang-menu li {
  display:flex; align-items:center; gap:.5rem;
  padding:.55rem .8rem;
  font-size:.82rem; font-weight:600; color:var(--dark);
  cursor:pointer;
}
.lang-menu li:hover { background:var(--light-alt); color:var(--accent); }
.lang-menu li[aria-selected="true"] { color:var(--accent); }

/* burger */
.burger {
  display:none; width:40px; height:40px; padding:8px;
  background:transparent; border:1px solid var(--border);
  border-radius:var(--r-sm);
  cursor:pointer;
  flex-direction:column; justify-content:space-between;
}
.burger span { display:block; height:2px; background:var(--dark); border-radius:2px; transition:all .25s var(--ease); }
.burger[aria-expanded="true"] span:nth-child(1) { transform:translateY(9px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2) { opacity:0; }
.burger[aria-expanded="true"] span:nth-child(3) { transform:translateY(-9px) rotate(-45deg); }

/* ============================================================
   MEGA MENU — v2
   Fixed beneath the header, JS positions horizontally and clamps
============================================================ */
.mega-panel, .dropdown-panel {
  position:fixed;
  top:calc(var(--header-h) - 4px);
  left:1.5rem;
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  box-shadow:var(--shadow-xl);
  padding:1.5rem;
  opacity:0; visibility:hidden; transform:translateY(-6px);
  transition:opacity .2s var(--ease), transform .2s var(--ease), visibility .2s;
  z-index:55;
}
.site-header.scrolled .mega-panel,
.site-header.scrolled .dropdown-panel {
  top:calc(var(--header-h-compact) - 4px);
}
.nav-item.open > .mega-panel,
.nav-item.open > .dropdown-panel {
  opacity:1; visibility:visible; transform:translateY(0);
}

/* MEGA panel — clamped to viewport, full container width */
.has-mega .mega-panel {
  width:min(1180px, calc(100vw - 3rem));
  padding:2rem;
}
.mega-grid {
  display:grid;
  grid-template-columns:1.1fr 1.1fr 1fr 1.4fr;
  gap:2rem;
}
.mega-col { min-width:0; }
.mega-col-title {
  font-size:.7rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--secondary);
  padding-bottom:.6rem; margin-bottom:.85rem;
  border-bottom:1px solid var(--border);
}
.mega-links { list-style:none; margin:0; padding:0; }
.mega-links li { margin-bottom:.15rem; }
.mega-links a {
  display:inline-block; padding:.4rem 0;
  color:var(--dark); font-size:.88rem; font-weight:500;
  transition:color .2s var(--ease), padding-left .2s var(--ease);
}
.mega-links a:hover { color:var(--accent); padding-left:.25rem; }
.mega-links.two-col { display:grid; grid-template-columns:1fr 1fr; gap:0 1.5rem; }

.mega-links .has-sub { position:relative; }
.mega-sublinks { list-style:none; padding-left:1rem; margin:.1rem 0 .25rem; border-left:2px solid var(--border); }
.mega-sublinks a { font-size:.82rem; color:var(--muted); padding:.25rem 0; }
.mega-sublinks a:hover { color:var(--accent); }

.mega-arrow { display:inline-block; margin-top:.6rem; font-size:.82rem; font-weight:700; color:var(--accent); }
.mega-arrow:hover { color:var(--accent-dk); }

.mega-feature { display:flex; flex-direction:column; gap:.85rem; }
.mega-feature-card {
  display:block;
  background:var(--light);
  border-radius:var(--r-md);
  overflow:hidden;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
}
.mega-feature-card:hover { transform:translateY(-3px); box-shadow:var(--shadow-md); }
.mega-feature-img {
  height:120px;
  background:
    linear-gradient(140deg, rgba(4,173,238,.55), rgba(28,43,58,.85)),
    radial-gradient(circle at 30% 30%, rgba(255,255,255,.18), transparent 60%);
}
.mega-feature-body { padding:1rem 1.1rem 1.1rem; }
.mega-feature-tag {
  display:inline-block;
  background:var(--accent); color:#fff;
  font-size:.62rem; font-weight:800; letter-spacing:.1em;
  padding:.18rem .5rem; border-radius:var(--r-pill);
  margin-bottom:.5rem;
}
.mega-feature-body h4 { font-size:.95rem; font-weight:700; color:var(--dark); margin-bottom:.3rem; line-height:1.35; }
.mega-feature-body p { font-size:.8rem; color:var(--muted); margin-bottom:.5rem; line-height:1.55; }
.mega-feature-link { font-size:.78rem; font-weight:700; color:var(--accent); }

/* small dropdowns */
.dropdown-panel { min-width:340px; max-width:calc(100vw - 3rem); padding:1.4rem 1.5rem; }
.dropdown-panel.narrow { min-width:240px; }
.dropdown-title {
  font-size:.7rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--secondary);
  padding-bottom:.55rem; margin-bottom:.7rem;
  border-bottom:1px solid var(--border);
}
.dropdown-links { list-style:none; margin:0; padding:0; }
.dropdown-links li { margin-bottom:.15rem; }
.dropdown-links a {
  display:inline-block; padding:.4rem 0;
  font-size:.88rem; font-weight:500; color:var(--dark);
  transition:color .2s var(--ease), padding-left .2s var(--ease);
}
.dropdown-links a:hover { color:var(--accent); padding-left:.25rem; }
.dropdown-links.two-col { display:grid; grid-template-columns:1fr 1fr; gap:0 1.5rem; }
.dropdown-arrow { display:inline-block; margin-top:.65rem; font-size:.82rem; font-weight:700; color:var(--accent); }

/* ============================================================
   MOBILE DRAWER — slide-in panel (right) + scrim, ≤991px
============================================================ */
.mobile-drawer-scrim {
  position:fixed; inset:0;
  background:rgba(15, 23, 30, .55);
  z-index:90;
  opacity:0; pointer-events:none;
  transition:opacity .25s var(--ease);
}
.mobile-drawer-scrim.open { opacity:1; pointer-events:auto; }

.mobile-drawer {
  position:fixed;
  top:0; right:0; bottom:0;
  width:min(420px, 100vw);
  background:#fff;
  display:flex;
  flex-direction:column;
  overflow-y:auto;
  z-index:100;
  box-shadow:-12px 0 32px rgba(15, 23, 30, .18);
  transform:translateX(100%);
  transition:transform .3s var(--ease);
  -webkit-overflow-scrolling:touch;
}
.mobile-drawer.open { transform:translateX(0); }

/* Drawer head — logo + close */
.mobile-drawer-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:1rem 1.5rem;
  border-bottom:1px solid var(--border);
  flex-shrink:0;
}
.mobile-drawer-logo {
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  text-decoration:none;
  color:var(--dark);
}
.mobile-drawer-logo img { height:32px; width:auto; }
.mobile-drawer-logo strong { font-size:1.05rem; letter-spacing:-.005em; }
.mobile-drawer-close {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:40px; height:40px;
  background:transparent;
  border:1px solid var(--border);
  border-radius:var(--r-sm);
  cursor:pointer;
  color:var(--dark);
  transition:border-color .15s, color .15s, background .15s;
}
.mobile-drawer-close:hover {
  border-color:var(--accent);
  color:var(--accent);
}

/* Drawer body — nav list */
.mobile-drawer-body {
  flex:1;
  padding:.5rem 1.5rem 1.5rem;
}
.mobile-drawer .md-list {
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
}
.mobile-drawer .md-section {
  border-bottom:1px solid var(--border);
}
.mobile-drawer .md-section:last-child { border-bottom:none; }
.mobile-drawer .md-link {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  width:100%;
  padding:1rem 0;
  font-size:1rem;
  font-weight:600;
  color:var(--dark);
  background:transparent;
  border:none;
  cursor:pointer;
  text-align:left;
  text-decoration:none;
  transition:color .15s;
}
.mobile-drawer .md-link:hover { color:var(--accent); }
.mobile-drawer .md-link--toggle .md-chevron {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:24px; height:24px;
  color:var(--muted);
  transition:transform .25s var(--ease), color .15s;
}
.mobile-drawer .md-section.open .md-link--toggle .md-chevron {
  transform:rotate(180deg);
  color:var(--accent);
}
.mobile-drawer .md-section.open .md-link--toggle { color:var(--accent); }
.mobile-drawer .md-sub {
  display:none;
  padding:0 0 1rem;
  margin-top:-.4rem;
}
.mobile-drawer .md-section.open .md-sub { display:flex; flex-direction:column; }
.mobile-drawer .md-sub a {
  display:block;
  padding:.55rem 0 .55rem 1rem;
  font-size:.94rem;
  font-weight:500;
  color:var(--muted);
  border-left:2px solid var(--border);
  text-decoration:none;
  transition:color .15s, border-color .15s;
}
.mobile-drawer .md-sub a:hover {
  color:var(--accent);
  border-left-color:var(--accent);
}

/* Drawer foot — CTA + utilities */
.mobile-drawer-foot {
  border-top:1px solid var(--border);
  padding:1.25rem 1.5rem 1.5rem;
  display:flex;
  flex-direction:column;
  gap:1rem;
  flex-shrink:0;
  background:#fbf9f5;
}
.mobile-drawer-cta {
  width:100%;
  justify-content:center;
  text-align:center;
}
.mobile-drawer-utils {
  display:flex;
  flex-direction:column;
  gap:.5rem;
}
.mobile-drawer-util {
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  font-size:.88rem;
  font-weight:500;
  color:var(--dark);
  text-decoration:none;
  transition:color .15s;
}
.mobile-drawer-util:hover { color:var(--accent); }
.mobile-drawer-util svg { color:var(--accent); flex-shrink:0; }

/* Tablet (768–1100px) — slightly wider drawer, comfortable padding */
@media (max-width:1100px) and (min-width:768px) {
  .mobile-drawer { width:min(440px, 70vw); }
  .mobile-drawer-head { padding:1.1rem 2rem; }
  .mobile-drawer-body { padding:.5rem 2rem 1.5rem; }
  .mobile-drawer-foot { padding:1.4rem 2rem 1.6rem; }
}

/* Small mobile (≤767px) — full-width drawer, tighter padding */
@media (max-width:767px) {
  .mobile-drawer {
    width:100vw;
    box-shadow:none;
  }
  .mobile-drawer-head { padding:.85rem 1.25rem; }
  .mobile-drawer-body { padding:.5rem 1.25rem 1.25rem; }
  .mobile-drawer-foot { padding:1.1rem 1.25rem 1.4rem; }
  .mobile-drawer .md-link { padding:.9rem 0; font-size:.96rem; }
  .mobile-drawer .md-sub a { font-size:.9rem; padding-left:.85rem; }
}

/* ============================================================
   SEARCH MODAL
============================================================ */
.search-modal {
  position:fixed; inset:0;
  z-index:200;
  display:flex; flex-direction:column;
  opacity:0; pointer-events:none;
  transition:opacity .3s var(--ease);
}
.search-modal.open { opacity:1; pointer-events:auto; }
.search-modal-shade {
  position:absolute; inset:0;
  background:rgba(4,173,238,.85);
  backdrop-filter:blur(14px) saturate(140%);
  -webkit-backdrop-filter:blur(14px) saturate(140%);
}
.search-modal-inner {
  position:relative;
  width:100%; max-width:1100px;
  margin:0 auto;
  padding:5rem 1.5rem 3rem;
  color:#fff;
  z-index:1;
  transform:translateY(-12px);
  transition:transform .35s var(--ease);
  flex:1;
  overflow-y:auto;
}
.search-modal.open .search-modal-inner { transform:translateY(0); }

.search-modal-close {
  position:absolute; top:1.5rem; right:1.5rem;
  width:48px; height:48px;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.25);
  color:#fff;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
  transition:all .25s var(--ease);
}
.search-modal-close:hover { background:rgba(255,255,255,.22); transform:rotate(90deg); }

.search-modal-bar {
  display:flex; align-items:center; gap:1rem;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.28);
  border-radius:var(--r-pill);
  padding:.7rem 1.5rem;
  color:#fff;
}
.search-modal-bar input {
  flex:1;
  background:transparent; border:none; outline:none;
  color:#fff; font-size:1.1rem; font-weight:600;
  font-family:inherit;
}
.search-modal-bar input::placeholder { color:rgba(255,255,255,.7); font-weight:500; }
.search-modal-hint {
  font-size:.7rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  padding:.3rem .65rem;
  border:1px solid rgba(255,255,255,.4);
  border-radius:var(--r-pill);
  white-space:nowrap;
  opacity:.8;
}

.search-modal-meta {
  display:flex; justify-content:space-between; align-items:center;
  margin:1.75rem 0 1rem;
  font-size:.72rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:rgba(255,255,255,.85);
}
.search-results-count {
  background:rgba(255,255,255,.18);
  padding:.25rem .65rem;
  border-radius:var(--r-pill);
}

.search-modal-results {
  display:grid; grid-template-columns:repeat(3,1fr); gap:1rem;
}
.search-card {
  background:#fff;
  border-radius:var(--r-md);
  padding:1.25rem;
  display:flex; flex-direction:column; gap:.5rem;
  text-decoration:none;
  color:var(--dark);
  border:1px solid rgba(255,255,255,.4);
  transition:transform .25s var(--ease), box-shadow .25s var(--ease);
  min-height:160px;
}
.search-card:hover { transform:translateY(-3px); box-shadow:0 12px 30px rgba(0,0,0,.18); color:var(--dark); }
.search-card-tag {
  font-size:.62rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  color:var(--accent);
}
.search-card-title { font-size:1.05rem; font-weight:700; line-height:1.3; }
.search-card-desc { font-size:.82rem; color:var(--muted); line-height:1.55; }
.search-card-meta {
  display:flex; justify-content:space-between; align-items:center;
  margin-top:auto;
  padding-top:.65rem;
  border-top:1px solid var(--border);
  font-size:.72rem; color:var(--secondary);
}
.search-card-meta strong { color:var(--accent); }
.search-empty {
  grid-column:1/-1;
  text-align:center;
  padding:3rem 2rem;
  color:rgba(255,255,255,.85);
  font-size:.95rem;
}

/* ============================================================
   1. HERO
============================================================ */
.hero {
  position:relative;
  min-height:88vh;
  margin-top:var(--header-h);
  display:flex; align-items:center;
  overflow:hidden;
  background:var(--dark);
  /* Reserve bottom space so audience-tiles overlap doesn't clip hero content */
  padding-bottom:8rem;
}
.hero-video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.hero-overlay {
  position:absolute; inset:0;
  background:linear-gradient(120deg, rgba(28,43,58,.85) 0%, rgba(28,43,58,.55) 60%, rgba(4,173,238,.18) 100%);
  z-index:1;
}
.hero-inner {
  position:relative; z-index:2;
  width:100%; max-width:var(--container);
  margin:0 auto; padding:3rem 1.5rem;
  color:#fff;
}
.hero .eyebrow {
  display:inline-block; margin-bottom:1.1rem;
  font-size:.72rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent);
  padding:.4rem .8rem;
  background:rgba(255,255,255,.08);
  backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.18);
  border-radius:var(--r-pill);
}
.hero h1 {
  max-width:880px;
  font-size:clamp(2rem,4.5vw,3.4rem);
  font-weight:700; line-height:1.1; letter-spacing:-.015em;
  margin-bottom:1.25rem;
}
.hero-sub {
  max-width:680px;
  font-size:clamp(1rem,1.4vw,1.15rem);
  color:rgba(255,255,255,.85);
  margin-bottom:2rem; line-height:1.65;
}
.hero-cta { display:flex; align-items:center; gap:1.5rem; flex-wrap:wrap; }
.hero-meta {
  font-size:.78rem; font-weight:600; letter-spacing:.08em;
  color:rgba(255,255,255,.6);
  text-transform:uppercase;
}

/* ============================================================
   2. AUDIENCE TILES
============================================================ */
.audience-tiles {
  position:relative;
  padding-top:0;
  margin-top:-110px;
  z-index:3;
  padding-bottom:3rem;
}
.tiles-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.tile {
  position:relative; display:block;
  border-radius:var(--r-md);
  overflow:hidden; min-height:220px;
  color:#fff; text-decoration:none;
  box-shadow:var(--shadow-lg);
  transition:transform .4s var(--ease), box-shadow .4s var(--ease);
}
.tile:hover { transform:translateY(-6px); box-shadow:var(--shadow-xl); color:#fff; }
.tile-bg { position:absolute; inset:0; background-size:cover; background-position:center; transition:transform .6s var(--ease); }
.tile:hover .tile-bg { transform:scale(1.06); }
.tile-bg::after { content:''; position:absolute; inset:0; background:linear-gradient(160deg, rgba(28,43,58,.85), rgba(28,43,58,.55) 65%, rgba(4,173,238,.35)); }
.tile-ceramics .tile-bg { background-image:radial-gradient(circle at 70% 30%, rgba(4,173,238,.45), transparent 60%),linear-gradient(135deg,#243648,#1c2b3a); }
.tile-power .tile-bg { background-image:radial-gradient(circle at 30% 80%, rgba(4,173,238,.4), transparent 60%),linear-gradient(135deg,#1c2b3a,#0f1c2c); }
.tile-products .tile-bg { background-image:radial-gradient(circle at 80% 70%, rgba(4,173,238,.55), transparent 65%),linear-gradient(135deg,#243648,#0a3a55); }
.tile-body { position:relative; z-index:1; padding:2rem 1.75rem 1.75rem; height:100%; display:flex; flex-direction:column; justify-content:flex-end; }
.tile-body h3 { font-size:1.5rem; font-weight:700; line-height:1.2; margin-bottom:.6rem; }
.tile-body p { font-size:.88rem; color:rgba(255,255,255,.85); line-height:1.55; margin-bottom:1rem; max-width:34ch; }
.tile-arrow {
  display:inline-flex; align-items:center; justify-content:center;
  width:42px; height:42px;
  background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.28);
  border-radius:50%; align-self:flex-end;
  transition:all .3s var(--ease);
}
.tile:hover .tile-arrow { background:var(--accent); border-color:var(--accent); transform:translateX(4px); }

/* ============================================================
   3. ABOUT — with image
============================================================ */
.two-col { display:grid; grid-template-columns:1.1fr 1fr; gap:3rem; align-items:center; }
.about-text p { font-size:1rem; color:var(--muted); line-height:1.8; margin-bottom:1.6rem; max-width:60ch; }

.about-visual { position:relative; }
.about-image {
  position:relative;
  border-radius:var(--r-md);
  overflow:hidden;
  box-shadow:var(--shadow-lg);
  aspect-ratio:10/9;
  background:#1c2b3a;
}
.about-image > img,
.about-image > svg {
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover; object-position:center;
  display:block;
}
.about-image::after {
  content:''; position:absolute; inset:0;
  border:1px solid rgba(255,255,255,.08);
  border-radius:inherit; pointer-events:none;
}
.about-badge {
  position:absolute; bottom:1rem; left:1rem;
  background:#fff;
  color:var(--dark);
  font-size:.7rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  padding:.55rem 1rem;
  border-radius:var(--r-pill);
  box-shadow:var(--shadow-md);
}

.about-stats {
  display:grid; grid-template-columns:repeat(4,1fr); gap:1rem;
  background:var(--light);
  border-radius:var(--r-md);
  padding:2rem;
  margin-top:3rem;
}
.stat { text-align:left; }
.stat-num {
  display:block;
  font-size:clamp(2rem,3.5vw,2.6rem);
  font-weight:800; color:var(--accent);
  letter-spacing:-.02em; line-height:1;
  margin-bottom:.35rem;
}
.stat-lbl {
  font-size:.78rem; font-weight:600; color:var(--secondary);
  text-transform:uppercase; letter-spacing:.06em;
}

/* ============================================================
   4. PRODUCT GRID
============================================================ */
.product-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.product-tile {
  background:#fff;
  border-radius:var(--r-md);
  border:1px solid var(--border);
  padding:1.5rem;
  display:flex; flex-direction:column; gap:.4rem;
  text-decoration:none;
  transition:all .35s var(--ease);
  min-height:160px;
}
.product-tile:hover { transform:translateY(-4px); box-shadow:var(--shadow-card-hover); border-color:var(--accent); }
.product-icon {
  display:inline-flex; align-items:center; justify-content:center;
  width:42px; height:42px;
  background:rgba(var(--accent-rgb),.1);
  border-radius:var(--r-sm);
  color:var(--accent);
  font-size:1.4rem; margin-bottom:.4rem;
}
.product-name { font-size:1.05rem; font-weight:700; color:var(--dark); }
.product-desc { font-size:.82rem; color:var(--muted); line-height:1.55; }

.product-search-trigger {
  background:var(--dark);
  border:none; border-radius:var(--r-md);
  padding:1.5rem;
  display:flex; flex-direction:column; align-items:flex-start; gap:.5rem;
  color:#fff;
  cursor:pointer;
  text-align:left;
  transition:all .35s var(--ease);
  font-family:inherit;
}
.product-search-trigger:hover { background:#0f1c2c; transform:translateY(-4px); box-shadow:var(--shadow-card-hover); }
.product-search-trigger svg {
  background:rgba(255,255,255,.12);
  border-radius:50%; padding:8px;
  width:42px; height:42px;
  color:var(--accent);
}
.product-search-trigger > span:nth-of-type(1) {
  font-size:1.05rem; font-weight:700;
}
.product-search-trigger .ps-hint { font-size:.78rem; color:rgba(255,255,255,.6); font-weight:500; }

/* ============================================================
   5. MATERIALS
============================================================ */
.materials-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:1rem; margin-bottom:.5rem; }
.material-tile {
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  padding:1.25rem;
  transition:all .35s var(--ease);
}
.material-tile:hover { transform:translateY(-3px); border-color:var(--accent); box-shadow:var(--shadow-card); }
.material-tile h3 { font-size:1rem; font-weight:700; color:var(--dark); margin-bottom:.2rem; }
.material-formula {
  display:inline-block;
  font-family:'SFMono-Regular',Consolas,monospace;
  font-size:.72rem; color:var(--accent);
  background:rgba(var(--accent-rgb),.08);
  padding:.15rem .4rem; border-radius:var(--r-sm);
  margin-bottom:.65rem;
}
.material-tile p { font-size:.78rem; color:var(--muted); line-height:1.55; }

/* ============================================================
   6. CAPABILITIES
============================================================ */
.capabilities-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:1.5rem; }
.cap-card {
  text-align:left;
  padding:1.5rem 1rem 1rem;
  border-top:2px solid var(--accent);
  background:#fff;
  border-radius:0 0 var(--r-md) var(--r-md);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
}
.cap-card:hover { transform:translateY(-3px); box-shadow:var(--shadow-card); }
.cap-icon {
  width:44px; height:44px;
  display:flex; align-items:center; justify-content:center;
  background:rgba(var(--accent-rgb),.1);
  color:var(--accent);
  border-radius:var(--r-sm);
  margin-bottom:.85rem;
}
.cap-icon svg { width:22px; height:22px; }
.cap-card h3 { font-size:.95rem; font-weight:700; color:var(--dark); margin-bottom:.4rem; }
.cap-card p { font-size:.82rem; color:var(--muted); line-height:1.55; }

.cert-band {
  display:flex; flex-wrap:wrap; gap:1.5rem; justify-content:center; align-items:center;
  margin-top:3rem;
  padding:1.25rem 1.5rem;
  background:var(--light);
  border-radius:var(--r-md);
}
.cert { display:inline-flex; align-items:center; gap:.45rem; font-size:.82rem; font-weight:700; letter-spacing:.04em; color:var(--dark); }
.cert svg { color:var(--accent); }

/* ============================================================
   7. INDUSTRIES + LOGO CAROUSEL
============================================================ */
.industries-list {
  list-style:none;
  display:grid; grid-template-columns:1fr 1fr;
  column-gap:3rem;
  max-width:760px;
  margin:0 auto;
  border-top:1px solid var(--border);
}
.industries-list li { border-bottom:1px solid var(--border); }
.industries-list a {
  display:flex; justify-content:space-between; align-items:center;
  padding:.85rem .25rem;
  color:var(--dark); font-size:.95rem; font-weight:600;
  transition:color .2s var(--ease), padding-left .2s var(--ease);
}
.industries-list a:hover { color:var(--accent); padding-left:.5rem; }

.logo-caption {
  text-align:center;
  margin-top:3rem; margin-bottom:1rem;
  font-size:.72rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--secondary);
}
.logo-carousel {
  position:relative;
  overflow:hidden;
  padding:1.25rem 0;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  background:#fff;
  border-radius:var(--r-md);
  -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
          mask-image:linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
}
.logo-track {
  display:flex; align-items:center;
  gap:3.5rem;
  width:max-content;
  animation:logoScroll 50s linear infinite;
}
.logo-carousel:hover .logo-track { animation-play-state:paused; }
.logo-cell {
  flex:0 0 auto;
  width:170px; height:50px;
  display:flex; align-items:center; justify-content:flex-start;
  filter:grayscale(.3);
  opacity:.85;
  transition:opacity .25s var(--ease), filter .25s var(--ease);
}
.logo-cell:hover { opacity:1; filter:none; }
.logo-cell svg { max-width:100%; max-height:40px; height:auto; }
@keyframes logoScroll {
  0%   { transform:translateX(0); }
  100% { transform:translateX(-50%); }
}

/* ============================================================
   8. REVIEWS
============================================================ */
.reviews-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.review {
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  padding:1.75rem;
  display:flex; flex-direction:column; gap:1rem;
  box-shadow:var(--shadow-card);
}
.review-q { color:var(--accent); opacity:.4; }
.review blockquote { font-size:.95rem; color:var(--dark); line-height:1.65; border:none; padding:0; }
.review figcaption {
  font-size:.82rem; color:var(--muted); line-height:1.55;
  border-top:1px solid var(--border);
  padding-top:.85rem; margin-top:auto;
}
.review figcaption strong { color:var(--dark); font-size:.9rem; }
.review-co { color:var(--accent); font-weight:600; }

/* ============================================================
   9. INSIGHTS
============================================================ */
.insights-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; margin-bottom:2.5rem; }
.insight-card {
  background:#fff;
  border-radius:var(--r-md);
  overflow:hidden;
  box-shadow:var(--shadow-card);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
}
.insight-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-card-hover); }
.insight-img { aspect-ratio:16/10; background-size:cover; background-position:center; }
.insight-img-1 { background-image:linear-gradient(135deg,#243648 0%,#04adee 100%); }
.insight-img-2 { background-image:linear-gradient(135deg,#1c2b3a 0%,#3a5168 100%); }
.insight-img-3 { background-image:linear-gradient(135deg,#04adee 0%,#0399d4 100%); }
.insight-body { padding:1.5rem 1.5rem 1.75rem; }
.card-tag { display:inline-block; font-size:.65rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--accent); margin-bottom:.55rem; }
.insight-body h3 { font-size:1.05rem; font-weight:700; color:var(--dark); line-height:1.4; margin-bottom:.55rem; }
.insight-body p { font-size:.88rem; color:var(--muted); line-height:1.6; margin-bottom:1rem; }
.card-link { font-size:.85rem; font-weight:700; color:var(--accent); }

/* ============================================================
   10. FAQ — searchable
============================================================ */
.faq-search {
  position:relative;
  display:flex; align-items:center; gap:.6rem;
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-pill);
  padding:.45rem .55rem .45rem 1rem;
  margin-bottom:1.25rem;
  box-shadow:var(--shadow-sm);
  transition:border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.faq-search:focus-within { border-color:var(--accent); box-shadow:0 0 0 3px rgba(var(--accent-rgb),.15); }
.faq-search svg { color:var(--secondary); flex-shrink:0; }
.faq-search input {
  flex:1;
  height:2.4rem;
  background:transparent; border:none; outline:none;
  font-family:inherit; font-size:.92rem; color:var(--dark);
}
.faq-search-clear {
  width:32px; height:32px;
  border:none; background:var(--light);
  border-radius:50%;
  color:var(--secondary);
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:all .2s var(--ease);
}
.faq-search-clear:hover { background:var(--accent); color:#fff; }

.faq-list { display:flex; flex-direction:column; gap:.75rem; }
.faq-item {
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  overflow:hidden;
  box-shadow:var(--shadow-sm);
  transition:box-shadow .2s var(--ease), opacity .2s var(--ease);
}
.faq-item.hidden { display:none; }
.faq-item:hover, .faq-item[open] { box-shadow:var(--shadow-md); }
.faq-item summary {
  list-style:none;
  display:flex; justify-content:space-between; align-items:center;
  gap:1rem;
  padding:1.1rem 1.25rem;
  font-size:.95rem; font-weight:600; color:var(--dark);
  cursor:pointer;
}
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary:hover, .faq-item[open] summary { color:var(--accent); }
.faq-plus { position:relative; width:18px; height:18px; flex-shrink:0; }
.faq-plus::before, .faq-plus::after {
  content:''; position:absolute; background:var(--secondary); border-radius:2px;
  transition:all .25s var(--ease);
}
.faq-plus::before { top:8px; left:2px; right:2px; height:2px; }
.faq-plus::after  { top:2px; left:8px; bottom:2px; width:2px; }
.faq-item[open] .faq-plus::after { transform:rotate(90deg); opacity:0; }
.faq-item[open] .faq-plus::before { background:var(--accent); }
.faq-item p { padding:0 1.25rem 1.25rem; font-size:.92rem; color:var(--muted); line-height:1.7; }

.faq-empty {
  text-align:center;
  padding:2rem 1.5rem;
  background:#fff;
  border:1px dashed var(--border);
  border-radius:var(--r-md);
  color:var(--muted);
  font-size:.9rem;
}

/* search highlight */
.faq-item mark {
  background:rgba(var(--accent-rgb),.18);
  color:var(--dark);
  padding:0 2px;
  border-radius:2px;
}

/* ============================================================
   11. CONTACT — with map background
============================================================ */
.contact-section {
  position:relative;
  overflow:hidden;
  background:var(--light);
}
.contact-map {
  position:absolute; inset:0;
  filter:saturate(.6) contrast(1.05);
  z-index:0;
}
.contact-map .leaflet-container { background:#dde4ec; }
.contact-map-overlay {
  position:absolute; inset:0;
  z-index:1;
  background:
    linear-gradient(120deg, rgba(232,234,239,.55) 0%, rgba(232,234,239,.2) 50%, rgba(4,173,238,.18) 100%),
    radial-gradient(circle at 30% 50%, rgba(255,255,255,.2), transparent 40%);
  pointer-events:none;
}
/* allow zooming etc through to map */
.contact-section .container { position:relative; z-index:2; }

.contact-grid { align-items:start; }
.contact-form {
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(8px);
  padding:2rem;
  border-radius:var(--r-md);
  box-shadow:var(--shadow-lg);
  border:1px solid rgba(255,255,255,.7);
}
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-bottom:1rem; }
.form-field { display:flex; flex-direction:column; gap:.35rem; margin-bottom:1rem; }
.form-field label { font-size:.78rem; font-weight:700; letter-spacing:.04em; color:var(--dark); }
.form-field input,
.form-field select,
.form-field textarea {
  width:100%; padding:.7rem .9rem;
  border:1px solid var(--border);
  border-radius:var(--r-sm);
  background:#fff;
  font-family:inherit; font-size:.9rem; color:var(--dark);
  outline:none;
  transition:all .25s var(--ease);
}
.form-field textarea { resize:vertical; }
.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus {
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(var(--accent-rgb),.15);
}

.contact-direct { display:flex; flex-direction:column; gap:1.25rem; }
.contact-block {
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(8px);
  padding:1.5rem;
  border-radius:var(--r-md); border:1px solid rgba(255,255,255,.7);
  box-shadow:var(--shadow-md);
}
.contact-block h3 {
  font-size:.78rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
  color:var(--accent);
  margin-bottom:.65rem;
}
.contact-block p { font-size:.92rem; color:var(--muted); line-height:1.65; margin-bottom:.5rem; }
.contact-block p:last-child { margin-bottom:0; }
.contact-block a { color:var(--dark); font-weight:600; }
.contact-block a:hover { color:var(--accent); }

/* leaflet marker styling — Anderman teal */
.anderman-pin {
  width:36px; height:36px;
  border-radius:50% 50% 50% 0;
  background:var(--accent);
  border:3px solid #fff;
  transform:rotate(-45deg);
  box-shadow:0 6px 16px rgba(2,100,138,.35);
  display:flex; align-items:center; justify-content:center;
}
.anderman-pin span {
  transform:rotate(45deg);
  color:#fff; font-weight:800; font-size:.78rem;
}

/* ============================================================
   FOOTER
============================================================ */
.site-footer {
  background:var(--dark); color:rgba(255,255,255,.78);
  padding:4rem 0 1.5rem;
}
.footer-grid {
  display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:2.5rem;
  padding-bottom:3rem;
  border-bottom:1px solid rgba(255,255,255,.1);
}
.footer-brand .brand-logo { filter:brightness(0) invert(1); width:160px; margin-bottom:1rem; }
.footer-brand p { font-size:.88rem; line-height:1.65; margin-bottom:1rem; max-width:30ch; }
.footer-certs { display:flex; flex-wrap:wrap; gap:.5rem; }
.footer-certs span {
  font-size:.65rem; font-weight:700; letter-spacing:.08em;
  padding:.3rem .65rem;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.15);
  border-radius:var(--r-pill);
}
.footer-col h4 {
  font-size:.78rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
  color:#fff; margin-bottom:1rem;
}
.footer-col ul { list-style:none; }
.footer-col li { margin-bottom:.55rem; }
.footer-col a { color:rgba(255,255,255,.65); font-size:.88rem; transition:color .2s var(--ease); }
.footer-col a:hover { color:var(--accent); }
.footer-bottom {
  display:flex; justify-content:space-between; align-items:center;
  padding-top:1.5rem;
  font-size:.78rem; color:rgba(255,255,255,.5);
  flex-wrap:wrap; gap:1rem;
}
.footer-bottom a { color:rgba(255,255,255,.65); }
.footer-bottom a:hover { color:var(--accent); }

/* ============================================================
   AI CHAT — FAB & PANEL
============================================================ */
.aichat-fab {
  position:fixed;
  right:1.5rem; bottom:1.5rem;
  z-index:140;
  display:inline-flex; align-items:center; gap:.65rem;
  padding:.85rem 1.25rem .85rem 1rem;
  background:var(--dark); color:#fff;
  border:none; border-radius:var(--r-pill);
  font-size:.85rem; font-weight:700;
  cursor:pointer;
  box-shadow:0 12px 28px rgba(2,100,138,.35), 0 4px 8px rgba(28,43,58,.2);
  transition:transform .25s var(--ease), background .25s var(--ease);
}
.aichat-fab svg { color:var(--accent); }
.aichat-fab:hover { background:#0f1c2c; transform:translateY(-2px); }
.aichat-fab.open { transform:scale(.92); opacity:0; pointer-events:none; }
.aichat-pulse {
  position:absolute; top:6px; right:6px;
  width:10px; height:10px;
  background:var(--accent);
  border-radius:50%;
  box-shadow:0 0 0 0 rgba(var(--accent-rgb),.7);
  animation:aichatPulse 2s infinite;
}
@keyframes aichatPulse {
  0%   { box-shadow:0 0 0 0 rgba(var(--accent-rgb),.7); }
  70%  { box-shadow:0 0 0 14px rgba(var(--accent-rgb),0); }
  100% { box-shadow:0 0 0 0 rgba(var(--accent-rgb),0); }
}

.aichat-panel {
  position:fixed;
  right:1.5rem; bottom:1.5rem;
  width:min(380px, calc(100vw - 2rem));
  max-height:min(620px, calc(100vh - 2rem));
  background:#fff;
  border-radius:var(--r-lg);
  box-shadow:0 30px 60px rgba(0,0,0,.25);
  display:flex; flex-direction:column;
  overflow:hidden;
  z-index:145;
  transform:translateY(20px) scale(.96);
  opacity:0; pointer-events:none;
  transition:opacity .25s var(--ease), transform .25s var(--ease);
}
.aichat-panel.open { opacity:1; transform:translateY(0) scale(1); pointer-events:auto; }
.aichat-head {
  display:flex; align-items:center; justify-content:space-between;
  padding:1rem 1.1rem;
  background:linear-gradient(135deg, var(--dark) 0%, #0a3a55 100%);
  color:#fff;
}
.aichat-head-left { display:flex; align-items:center; gap:.75rem; }
.aichat-avatar {
  width:38px; height:38px;
  border-radius:50%;
  background:var(--accent);
  display:flex; align-items:center; justify-content:center;
  color:#fff;
}
.aichat-head h3 { font-size:.95rem; font-weight:700; }
.aichat-status {
  display:flex; align-items:center; gap:.4rem;
  font-size:.7rem; font-weight:500; color:rgba(255,255,255,.7);
}
.aichat-dot {
  width:7px; height:7px; border-radius:50%;
  background:#39d680;
  box-shadow:0 0 0 0 rgba(57,214,128,.7);
  animation:aichatPulse 2s infinite;
}
.aichat-close {
  width:32px; height:32px;
  background:rgba(255,255,255,.1);
  border:none; border-radius:50%;
  color:#fff; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:background .2s var(--ease);
}
.aichat-close:hover { background:rgba(255,255,255,.22); }

.aichat-body {
  flex:1;
  padding:1rem 1.1rem;
  overflow-y:auto;
  display:flex; flex-direction:column; gap:.75rem;
  background:linear-gradient(#fff 0%, #f7f9fc 100%);
}
.aichat-msg {
  max-width:88%;
  padding:.75rem 1rem;
  border-radius:var(--r-md);
  font-size:.88rem; line-height:1.55;
}
.aichat-msg.ai {
  background:#fff;
  border:1px solid var(--border);
  color:var(--dark);
  border-top-left-radius:4px;
  align-self:flex-start;
}
.aichat-msg.user {
  background:var(--accent); color:#fff;
  border-top-right-radius:4px;
  align-self:flex-end;
}
.aichat-msg.typing { display:flex; gap:.3rem; padding:.85rem 1rem; }
.aichat-msg.typing span {
  width:8px; height:8px; border-radius:50%; background:var(--secondary);
  animation:aichatTypeBounce 1.2s infinite ease-in-out;
}
.aichat-msg.typing span:nth-child(2){ animation-delay:.15s; }
.aichat-msg.typing span:nth-child(3){ animation-delay:.3s; }
@keyframes aichatTypeBounce {
  0%,80%,100% { transform:scale(.6); opacity:.4; }
  40% { transform:scale(1); opacity:1; }
}
.aichat-suggest { display:flex; flex-wrap:wrap; gap:.4rem; padding-top:.25rem; }
.aichat-chip {
  font-family:inherit;
  background:rgba(var(--accent-rgb),.08);
  border:1px solid rgba(var(--accent-rgb),.25);
  color:var(--accent);
  font-size:.74rem; font-weight:600;
  padding:.4rem .7rem;
  border-radius:var(--r-pill);
  cursor:pointer;
  transition:all .2s var(--ease);
}
.aichat-chip:hover { background:var(--accent); color:#fff; border-color:var(--accent); }

.aichat-form {
  display:flex; align-items:center; gap:.5rem;
  padding:.7rem .9rem;
  background:#fff;
  border-top:1px solid var(--border);
}
.aichat-form input {
  flex:1; height:2.4rem;
  padding:0 .85rem;
  border:1px solid var(--border);
  border-radius:var(--r-pill);
  font-family:inherit; font-size:.88rem;
  outline:none;
  transition:border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.aichat-form input:focus {
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(var(--accent-rgb),.15);
}
.aichat-send {
  width:38px; height:38px;
  background:var(--accent);
  border:none; border-radius:50%;
  color:#fff; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:background .2s var(--ease), transform .2s var(--ease);
}
.aichat-send:hover { background:var(--accent-dk); transform:scale(1.05); }
.aichat-disclaimer {
  padding:.55rem 1rem;
  font-size:.65rem; line-height:1.4;
  color:var(--secondary);
  background:#f7f9fc;
  border-top:1px solid var(--border);
  text-align:center;
}

/* ============================================================
   RESPONSIVE
============================================================ */
@media (max-width:1100px) {
  .has-mega .mega-panel { width:min(960px, calc(100vw - 2rem)); }
  .mega-grid { grid-template-columns:1fr 1fr; row-gap:1.25rem; }
  .mega-feature { grid-column:1/-1; }
}

/* Nav: hamburger / drawer kicks in at 1100px and below */
@media (max-width:1100px) {
  .primary-nav { display:none; }
  .header-cta { display:none; }
  .header-search { display:flex; }
  .burger { display:flex; }

  /* keep utils tight on the right */
  .header-inner { gap:.5rem; justify-content:space-between; }
  .header-utils { gap:.4rem; }
}

@media (max-width:991px) {
  .tiles-grid { grid-template-columns:1fr; }
  .audience-tiles { margin-top:-40px; }
  .hero { padding-bottom:5rem; }

  .two-col { grid-template-columns:1fr; gap:2rem; }
  .product-grid { grid-template-columns:repeat(2,1fr); }
  .materials-grid { grid-template-columns:repeat(3,1fr); }
  .capabilities-grid { grid-template-columns:repeat(2,1fr); }
  .reviews-grid, .insights-grid { grid-template-columns:1fr; }
  .industries-list { grid-template-columns:1fr; }
  .about-stats { grid-template-columns:repeat(2,1fr); }

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

  .search-modal-results { grid-template-columns:1fr 1fr; }
  .search-modal-inner { padding:5.5rem 1.25rem 2rem; }
  .search-modal-bar input { font-size:1rem; }
  .search-modal-hint { display:none; }
  .search-modal-close { top:1rem; right:1rem; width:42px; height:42px; }

  .aichat-fab-label { display:none; }
  .aichat-fab { padding:.85rem; }
}

/* Small mobile: tighten header utilities, keep lang-switch visible */
@media (max-width:767px) {
  .header-utils { gap:.25rem; }
  .lang-switch .lang-btn { padding:.35rem .5rem; }
  .lang-switch .lang-code { display:none; }   /* keep flag-only at small mobile to save space */
  .brand-badge { font-size:.55rem; padding:.2rem .45rem; gap:.25rem; }
  .brand-badge .bb-num { font-size:.78rem; }
}

/* Short viewports (laptops, browsers with toolbars open) — drop tile overlap entirely
   so hero content has the whole hero box to itself */
@media (max-height:700px) {
  .audience-tiles { margin-top:0; padding-top:1.5rem; }
  .hero { padding-bottom:3.5rem; }
}

@media (max-width:640px) {
  :root { --header-h:72px; --header-h-compact:60px; }

  .section { padding:3.5rem 0; }
  .hero { min-height:78vh; padding-bottom:6rem; }
  /* On phones, hero-cta wraps to two rows — drop overlap so tiles never clip the wrapped CTA */
  .audience-tiles { margin-top:0; padding-top:1.5rem; }

  .product-grid { grid-template-columns:1fr; }
  .materials-grid { grid-template-columns:repeat(2,1fr); }
  .capabilities-grid { grid-template-columns:1fr; }
  .form-row { grid-template-columns:1fr; }

  .footer-grid { grid-template-columns:1fr; gap:2rem; }
  .footer-bottom { justify-content:center; text-align:center; }

  .brand-badge { display:none; }
  .brand-logo { width:120px; }

  .about-stats { grid-template-columns:1fr 1fr; }

  .search-modal-results { grid-template-columns:1fr; }
}


/* ===== pages-v2.css ===== */
/* ============================================================
   Anderman & Company — sub-page components
   Loaded after styles-v2.css. Adds:
   - .page-hero (image-led variant of .hero)
   - .breadcrumb
   - .intent-split (Find by material | Find by product)
   - .props-strip (horizontal property scroll-stop band)
   - .grades-table, .specs-table
   - .variants-grid
   - .services-panel (3-up service cards with icons)
   - .case-study-feature
   - .datasheet-block
   - .contact-cta-band
   - .related-grid (alias for insights-grid usage on sub-pages)
   ============================================================ */

/* ============================================================
   Page hero — image-led, used by sub-pages instead of video hero
============================================================ */
.page-hero {
  position:relative;
  margin-top:var(--header-h);
  min-height:60vh;
  display:flex; align-items:center;
  background:var(--dark);
  overflow:hidden;
  color:#fff;
}
.page-hero-img {
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover; object-position:center;
}
.page-hero-overlay {
  position:absolute; inset:0;
  background:linear-gradient(120deg, rgba(28,43,58,.85) 0%, rgba(28,43,58,.55) 60%, rgba(4,173,238,.18) 100%);
}
.page-hero-inner {
  position:relative; z-index:2;
  width:100%; max-width:var(--container);
  margin:0 auto; padding:3rem 1.5rem;
}
.page-hero .eyebrow {
  display:inline-block; margin-bottom:1rem;
  font-size:.7rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent);
  padding:.4rem .8rem;
  background:rgba(255,255,255,.08);
  backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.18);
  border-radius:var(--r-pill);
}
.page-hero h1 {
  max-width:880px;
  font-size:clamp(1.8rem,4vw,2.8rem);
  font-weight:700; line-height:1.15; letter-spacing:-.015em;
  margin-bottom:1.1rem;
}
.page-hero .lede {
  max-width:680px;
  font-size:clamp(1rem,1.3vw,1.1rem);
  color:rgba(255,255,255,.85);
  margin-bottom:1.75rem; line-height:1.65;
}
.page-hero .cta-row { display:flex; flex-wrap:wrap; gap:.75rem 1rem; align-items:center; }
.page-hero .cta-row .btn { color:#fff; }
.page-hero .cta-row .btn-outline-light {
  background:transparent; color:#fff; border-color:rgba(255,255,255,.4);
}
.page-hero .cta-row .btn-outline-light:hover { background:rgba(255,255,255,.1); border-color:#fff; }

/* Material hero variant — formula sits next to / under the title */
.page-hero .formula {
  display:inline-block;
  font-family:'SFMono-Regular',Consolas,monospace;
  font-size:1.1rem; font-weight:600;
  background:rgba(4,173,238,.18);
  border:1px solid rgba(4,173,238,.4);
  color:#fff;
  padding:.3rem .8rem;
  border-radius:var(--r-sm);
  margin-left:.75rem;
  vertical-align:middle;
}
.page-hero h1 .formula { font-size:.7em; }

.page-hero .used-for {
  display:block;
  font-size:.85rem; color:rgba(255,255,255,.65);
  margin-bottom:1.5rem;
}
.page-hero .used-for strong { color:#fff; font-weight:600; }

/* ============================================================
   Breadcrumb
============================================================ */
.breadcrumb-bar { background:#fff; border-bottom:1px solid var(--border); }
.breadcrumb {
  max-width:var(--container); margin:0 auto; padding:.85rem 1.5rem;
  display:flex; flex-wrap:wrap; align-items:center; gap:.4rem;
  font-size:.8rem;
}
.breadcrumb a { color:var(--secondary); font-weight:500; transition:color .2s var(--ease); }
.breadcrumb a:hover { color:var(--accent); }
.breadcrumb .sep { color:var(--secondary); opacity:.5; }
.breadcrumb .cur { color:var(--dark); font-weight:600; }

/* ============================================================
   Intent split (Ceramics home — Find by Material | Find by Product)
============================================================ */
.intent-split {
  display:grid; grid-template-columns:1fr 1fr; gap:1.5rem;
}
.intent-card {
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  padding:2rem;
  position:relative;
  overflow:hidden;
  transition:box-shadow .35s var(--ease), transform .35s var(--ease);
}
.intent-card:hover { box-shadow:var(--shadow-card-hover); transform:translateY(-3px); }
.intent-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:var(--accent);
}
.intent-card h3 {
  font-size:1.15rem; font-weight:700; color:var(--dark);
  margin-bottom:.4rem;
  display:flex; align-items:center; gap:.55rem;
}
.intent-card h3 svg {
  width:24px; height:24px; color:var(--accent);
  flex-shrink:0;
}
.intent-card p.intent-lede {
  font-size:.9rem; color:var(--muted); line-height:1.6; margin-bottom:1.25rem;
}

.intent-filters {
  display:flex; flex-direction:column; gap:.5rem;
  margin-bottom:1.25rem;
}
.intent-filter {
  display:flex; align-items:center; gap:.6rem;
  padding:.55rem .85rem;
  background:var(--light-alt);
  border:1px solid var(--border);
  border-radius:var(--r-sm);
  font-size:.88rem; font-weight:500; color:var(--dark);
  cursor:pointer;
  transition:all .2s var(--ease);
  user-select:none;
}
.intent-filter input { display:none; }
.intent-filter .ck {
  width:18px; height:18px; flex-shrink:0;
  border:2px solid var(--border);
  border-radius:4px;
  background:#fff;
  display:flex; align-items:center; justify-content:center;
  transition:all .2s var(--ease);
}
.intent-filter .ck svg { width:11px; height:11px; stroke:#fff; stroke-width:3; fill:none; opacity:0; transition:opacity .15s; }
.intent-filter input:checked ~ .ck { background:var(--accent); border-color:var(--accent); }
.intent-filter input:checked ~ .ck svg { opacity:1; }
.intent-filter input:checked ~ span { color:var(--accent); font-weight:600; }
.intent-filter:hover { border-color:var(--accent); }

.intent-search {
  display:flex; align-items:center; gap:.5rem;
  background:var(--light-alt);
  border:1px solid var(--border);
  border-radius:var(--r-pill);
  padding:.4rem .55rem .4rem 1rem;
  margin-bottom:1rem;
}
.intent-search:focus-within {
  border-color:var(--accent); box-shadow:0 0 0 3px rgba(var(--accent-rgb),.15);
}
.intent-search svg { color:var(--secondary); flex-shrink:0; }
.intent-search input {
  flex:1; background:transparent; border:none; outline:none;
  font-family:inherit; font-size:.9rem; color:var(--dark);
  height:2.4rem; padding:0;
}

.intent-types {
  display:grid; grid-template-columns:repeat(4,1fr); gap:.5rem;
  margin-bottom:1rem;
}
.intent-type {
  background:var(--light-alt); border:1px solid var(--border);
  border-radius:var(--r-sm);
  padding:.55rem .55rem .65rem;
  font-size:.78rem; font-weight:600; color:var(--dark);
  text-align:center;
  text-decoration:none;
  transition:all .2s var(--ease);
}
.intent-type:hover { background:var(--accent); color:#fff; border-color:var(--accent); transform:translateY(-2px); }

/* ============================================================
   Properties strip — horizontal scroll-stop on material page
============================================================ */
.props-strip {
  display:grid;
  grid-template-columns:repeat(6, minmax(0, 1fr));
  gap:1px;
  background:var(--border);
  border:1px solid var(--border);
  border-radius:var(--r-md);
  overflow:hidden;
  margin-bottom:3rem;
}
.props-cell {
  background:#fff;
  padding:1.25rem 1rem;
  text-align:center;
}
.props-cell .lbl {
  display:block;
  font-size:.62rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  color:var(--secondary);
  margin-bottom:.45rem;
}
.props-cell .val {
  display:block;
  font-size:1.15rem; font-weight:700; color:var(--dark);
  letter-spacing:-.01em;
  line-height:1.1;
  margin-bottom:.2rem;
}
.props-cell .unit {
  display:block;
  font-size:.7rem; font-weight:600; color:var(--accent);
}

/* ============================================================
   Long-form prose blocks (material/product description)
============================================================ */
.prose { max-width:760px; margin:0 auto; }
.prose h2 {
  font-size:clamp(1.4rem,2.4vw,1.7rem);
  font-weight:700; color:var(--dark);
  margin:2.5rem 0 .85rem;
  letter-spacing:-.01em;
}
.prose h2:first-child { margin-top:0; }
.prose p {
  font-size:1rem; color:var(--muted); line-height:1.85; margin-bottom:1.1rem;
}
.prose strong { color:var(--dark); }
.prose ul {
  list-style:none; margin:.5rem 0 1.25rem; padding:0;
}
.prose ul li {
  position:relative; padding-left:1.5rem; margin-bottom:.6rem;
  font-size:.95rem; color:var(--muted); line-height:1.7;
}
.prose ul li::before {
  content:''; position:absolute; left:0; top:.7em;
  width:8px; height:8px;
  background:var(--accent);
  border-radius:50%;
}

/* ============================================================
   Industries page — bigger image tiles + compact CTA + matrix
============================================================ */
.industry-grid {
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1.25rem;
}
.industry-tile {
  position:relative;
  display:block;
  border-radius:var(--r-md);
  overflow:hidden;
  min-height:300px;
  color:#fff;
  text-decoration:none;
  box-shadow:var(--shadow-lg);
  transition:transform .4s var(--ease), box-shadow .4s var(--ease);
}
.industry-tile:hover { transform:translateY(-6px); box-shadow:var(--shadow-xl); color:#fff; }
.industry-tile .tile-bg {
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  transition:transform .6s var(--ease);
}
.industry-tile:hover .tile-bg { transform:scale(1.06); }
.industry-tile .tile-bg::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(28,43,58,.35) 0%, rgba(28,43,58,.55) 50%, rgba(28,43,58,.92) 100%);
}
.industry-tile .tile-body {
  position:relative; z-index:1;
  padding:2rem 1.85rem 1.75rem;
  height:100%; display:flex; flex-direction:column; justify-content:flex-end;
}
.industry-eyebrow {
  display:inline-block;
  font-family:'SFMono-Regular',Consolas,monospace;
  font-size:.7rem; font-weight:700; letter-spacing:.18em;
  color:rgba(255,255,255,.75);
  margin-bottom:.65rem;
}
.industry-tile h3 {
  font-size:1.4rem; font-weight:700; line-height:1.2; margin-bottom:.6rem;
  letter-spacing:-.005em;
}
.industry-tile .tile-body p {
  font-size:.85rem; color:rgba(255,255,255,.85); line-height:1.55;
  margin-bottom:1rem; max-width:34ch;
}
.industry-tile .tile-arrow {
  display:inline-flex; align-items:center; justify-content:center;
  width:42px; height:42px;
  background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.28);
  border-radius:50%; align-self:flex-end;
  transition:all .3s var(--ease);
}
.industry-tile:hover .tile-arrow { background:var(--accent); border-color:var(--accent); transform:translateX(4px); }

/* ============================================================
   Compact CTA band ("Don't see your industry?" pattern)
============================================================ */
.compact-cta-band {
  background:linear-gradient(135deg, rgba(4,173,238,.08) 0%, rgba(4,173,238,.02) 100%);
  border-top:1px solid rgba(var(--accent-rgb),.18);
  border-bottom:1px solid rgba(var(--accent-rgb),.18);
  padding:1.75rem 0;
}
.compact-cta-row {
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem 1.5rem;
}
.compact-cta-band p {
  font-size:.95rem; line-height:1.55; color:var(--dark);
  flex:1 1 60%;
  max-width:760px;
  margin:0;
}
.compact-cta-band p strong { color:var(--accent); font-weight:700; }
.compact-cta-band .btn { flex-shrink:0; }

/* ============================================================
   Matrix finder ("I need [material] for [industry]")
============================================================ */
.matrix-finder {
  display:flex; align-items:center; flex-wrap:wrap; gap:.85rem;
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  box-shadow:var(--shadow-card);
  padding:1.5rem 1.75rem;
  max-width:1080px;
  margin:0 auto;
}
.matrix-prefix {
  font-size:1.05rem; font-weight:600; color:var(--dark);
}
.matrix-select { flex:1 1 200px; min-width:0; }
.matrix-select select {
  width:100%;
  height:3rem;
  padding:0 2.4rem 0 1rem;
  border:1px solid var(--border);
  border-radius:var(--r-pill);
  background:var(--light-alt);
  font-family:inherit; font-size:.95rem; font-weight:600; color:var(--dark);
  outline:none;
  appearance:none;
  cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%2304adee' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 1.1rem center;
  transition:border-color .2s var(--ease), background-color .2s var(--ease);
}
.matrix-select select:focus,
.matrix-select select:hover {
  border-color:var(--accent);
  background-color:#fff;
}
.matrix-finder .btn { flex-shrink:0; height:3rem; }
.matrix-help {
  margin-top:1rem;
  text-align:center;
  font-size:.78rem; color:var(--secondary);
  max-width:680px; margin-left:auto; margin-right:auto;
}

/* ============================================================
   News-single article — 8/12 + 4/12 with sticky sidebar
============================================================ */
.article-section { padding-top:2.5rem; padding-bottom:4rem; }
.article-layout {
  display:grid;
  grid-template-columns: minmax(0, 8fr) minmax(0, 4fr);
  gap:3rem;
  align-items:start;
  max-width:1200px;
}

.article-main { min-width:0; }

/* ====== Header ====== */
.article-header { margin-bottom:2.5rem; }
.article-tag-strip {
  display:flex; flex-wrap:wrap; gap:.4rem;
  margin-bottom:1.25rem;
}
.topic-tag {
  display:inline-block;
  padding:.32rem .75rem;
  background:rgba(var(--accent-rgb),.08);
  color:var(--accent);
  font-size:.74rem; font-weight:700; letter-spacing:.04em;
  text-decoration:none;
  border-radius:var(--r-pill);
  border:1px solid rgba(var(--accent-rgb),.2);
  transition:all .2s var(--ease);
}
.topic-tag:hover {
  background:var(--accent); color:#fff; border-color:var(--accent);
}
.article-h1 {
  font-size:clamp(1.85rem, 3.4vw, 2.5rem);
  font-weight:700; line-height:1.18; letter-spacing:-.015em;
  color:var(--dark);
  margin-bottom:.85rem;
}
.article-dek {
  font-size:clamp(1rem, 1.4vw, 1.15rem);
  color:var(--muted);
  line-height:1.6;
  margin-bottom:1.5rem;
  max-width:62ch;
}
.article-meta {
  display:flex; flex-wrap:wrap; align-items:center;
  gap:.55rem .75rem;
  font-size:.85rem; color:var(--muted);
  margin-bottom:2rem;
  padding:1rem 0;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}
.article-meta-sep { color:var(--secondary); opacity:.5; }
.article-author-mini {
  display:inline-flex; align-items:center; gap:.6rem;
  text-decoration:none;
  padding:.15rem 0;
  margin-right:.25rem;
  transition:opacity .2s var(--ease);
}
.article-author-mini:hover { opacity:.75; }
.article-author-avatar {
  width:38px; height:38px;
  border-radius:50%;
  background:var(--accent);
  color:#fff;
  font-size:.78rem; font-weight:800;
  display:flex; align-items:center; justify-content:center;
  letter-spacing:.04em;
  flex-shrink:0;
  overflow:hidden;
}
.article-author-avatar img {
  width:100%; height:100%;
  object-fit:cover; object-position:center;
  display:block;
}
.article-author-text {
  display:flex; flex-direction:column;
  line-height:1.25;
  font-size:.82rem;
}
.article-author-text strong { color:var(--dark); font-size:.88rem; font-weight:700; }
.article-author-text span { color:var(--secondary); font-size:.74rem; }
.article-readtime { font-weight:600; color:var(--secondary); }
.article-updated {
  display:inline-flex; align-items:center; gap:.3rem;
  background:rgba(var(--accent-rgb),.08);
  color:var(--accent);
  padding:.2rem .55rem;
  border-radius:var(--r-pill);
  font-weight:700;
  font-size:.74rem;
}
.article-updated svg { color:var(--accent); }
.article-updated time { font-weight:700; color:var(--accent); }

.article-featured {
  margin:0;
  border-radius:var(--r-md);
  overflow:hidden;
  box-shadow:var(--shadow-card);
  aspect-ratio:16/9;
}
.article-featured img {
  width:100%; height:100%;
  object-fit:cover; object-position:center;
}

/* ====== Article body — extends .prose ====== */
.article-body { max-width:none; }
.article-body h2 {
  font-size:clamp(1.35rem, 2.2vw, 1.6rem);
  margin-top:2.5rem; margin-bottom:.85rem;
}
.article-body h2:first-child { margin-top:0; }
.article-body p { font-size:1.02rem; line-height:1.85; }

/* Key takeaways callout */
.takeaways-box {
  background:linear-gradient(135deg, rgba(4,173,238,.07) 0%, rgba(4,173,238,.02) 100%);
  border:1px solid rgba(var(--accent-rgb),.25);
  border-left:4px solid var(--accent);
  border-radius:var(--r-md);
  padding:1.5rem 1.75rem;
  margin:.5rem 0 2.5rem;
}
.takeaways-title {
  font-size:.72rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent);
  margin:0 0 .85rem !important;
  padding:0;
}
.takeaways-box ul {
  margin:0;
  list-style:none;
  padding:0;
}
.takeaways-box li {
  padding-left:1.5rem;
  position:relative;
  margin-bottom:.55rem;
  font-size:.95rem; color:var(--dark); line-height:1.6;
}
.takeaways-box li::before {
  content:'';
  position:absolute; left:0; top:.65em;
  width:8px; height:8px;
  border-radius:50%;
  background:var(--accent);
}
.takeaways-box li strong { color:var(--accent); font-weight:700; }

/* Pull quote */
.pull-quote {
  border:none;
  border-left:4px solid var(--accent);
  padding:.5rem 0 .5rem 1.5rem;
  margin:2rem 0 2rem;
}
.pull-quote p {
  font-size:clamp(1.1rem, 1.6vw, 1.2rem) !important;
  font-style:italic;
  color:var(--dark) !important;
  line-height:1.55 !important;
  font-weight:500;
  margin-bottom:.65rem !important;
}
.pull-quote cite {
  display:block;
  font-size:.8rem;
  color:var(--secondary);
  font-style:normal;
  font-weight:700;
}

/* Inline reference cards (material/product mentions) */
.inline-ref-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1rem;
  margin:1.5rem 0 2rem;
}
.inline-ref-card {
  display:flex; flex-direction:column; gap:.4rem;
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  padding:1.1rem 1.25rem 1.25rem;
  text-decoration:none;
  transition:all .25s var(--ease);
}
.inline-ref-card:hover {
  border-color:var(--accent);
  box-shadow:var(--shadow-card);
  transform:translateY(-2px);
}
.iref-tag {
  font-size:.62rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  color:var(--accent);
}
.inline-ref-card h4 {
  font-size:1rem; font-weight:700; color:var(--dark);
  margin-bottom:0;
  display:flex; align-items:baseline; gap:.55rem;
  flex-wrap:wrap;
}
.iref-formula {
  font-family:'SFMono-Regular',Consolas,monospace;
  font-size:.72rem; color:var(--accent);
  background:rgba(var(--accent-rgb),.08);
  padding:.15rem .4rem;
  border-radius:var(--r-sm);
  font-weight:600;
}
.inline-ref-card p {
  font-size:.85rem !important;
  color:var(--muted);
  line-height:1.55 !important;
  margin:0 !important;
}
.iref-link {
  font-size:.78rem; font-weight:700; color:var(--accent);
  margin-top:auto;
}
.inline-ref-card--product {
  display:block;
  margin:2rem 0;
  padding:1.5rem 1.75rem;
  border-left:4px solid var(--accent);
  background:linear-gradient(135deg, rgba(4,173,238,.04) 0%, transparent 100%);
}
.inline-ref-card--product h4 { font-size:1.15rem; }
.inline-ref-card--product p { font-size:.95rem !important; line-height:1.65 !important; max-width:62ch; }

/* FAQ block inside article — already styled via .faq-list */

/* ====== Article footer ====== */
.article-footer {
  margin-top:3rem;
  padding-top:2rem;
  border-top:1px solid var(--border);
}
.article-tags-strip {
  display:flex; flex-wrap:wrap; align-items:center;
  gap:.4rem;
  margin-bottom:2rem;
}
.article-tags-label {
  font-size:.65rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--secondary);
  margin-right:.45rem;
}

/* Author bio */
.author-bio {
  display:grid;
  grid-template-columns:auto 1fr;
  gap:1.5rem;
  background:var(--light);
  border-radius:var(--r-md);
  padding:1.75rem 2rem;
  margin-bottom:2rem;
}
.author-bio-avatar {
  width:72px; height:72px;
  border-radius:50%;
  background:var(--accent);
  color:#fff;
  font-size:1.3rem; font-weight:800;
  display:flex; align-items:center; justify-content:center;
  letter-spacing:.04em;
  flex-shrink:0;
  overflow:hidden;
}
.author-bio-avatar img {
  width:100%; height:100%;
  object-fit:cover; object-position:center;
  display:block;
}
.author-bio-content h3 {
  font-size:1.1rem; font-weight:700; color:var(--dark);
  margin-bottom:.15rem;
}
.author-bio-role {
  font-size:.78rem; font-weight:700; letter-spacing:.06em;
  color:var(--accent); text-transform:uppercase;
  margin-bottom:.75rem;
}
.author-bio-content p {
  font-size:.92rem; color:var(--muted); line-height:1.65;
  margin-bottom:.75rem;
}
.author-bio-link {
  font-size:.85rem; font-weight:700; color:var(--accent);
  text-decoration:none;
}

/* Share buttons */
.share-row {
  display:flex; flex-wrap:wrap; align-items:center;
  gap:.55rem;
  margin-top:.5rem;
}
.share-label {
  font-size:.78rem; font-weight:700; color:var(--secondary);
  margin-right:.4rem;
}
.share-btn {
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.5rem 1rem;
  border-radius:var(--r-pill);
  border:1px solid var(--border);
  background:#fff;
  font-family:inherit;
  font-size:.78rem; font-weight:700;
  color:var(--dark);
  text-decoration:none;
  cursor:pointer;
  transition:all .2s var(--ease);
}
.share-btn:hover { transform:translateY(-1px); box-shadow:var(--shadow-sm); }
.share-btn--linkedin { background:#0a66c2; border-color:#0a66c2; color:#fff; }
.share-btn--linkedin:hover { background:#084c91; border-color:#084c91; color:#fff; }
.share-btn--x { background:var(--dark); border-color:var(--dark); color:#fff; }
.share-btn--x:hover { background:#000; border-color:#000; color:#fff; }
.share-btn--copy:hover { border-color:var(--accent); color:var(--accent); }
.share-btn--copy.is-copied {
  background:var(--accent); color:#fff; border-color:var(--accent);
}

/* ====== Sidebar ====== */
.article-sidebar {
  position:sticky;
  top:calc(var(--header-h) + 1.5rem);
  display:flex; flex-direction:column; gap:1.25rem;
  min-width:0;
  align-self:start;
}
.sidebar-widget {
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  padding:1.35rem 1.4rem;
}
.sidebar-widget-title {
  font-size:.7rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--secondary);
  padding-bottom:.7rem;
  margin:0 0 .9rem;
  border-bottom:1px solid var(--border);
}

.sidebar-cat-list {
  list-style:none; margin:0; padding:0;
  display:flex; flex-direction:column; gap:.15rem;
}
.sidebar-cat-list a {
  display:flex; justify-content:space-between; align-items:center; gap:.6rem;
  padding:.55rem 0;
  font-size:.88rem; font-weight:600; color:var(--dark);
  border-bottom:1px dashed var(--border);
  transition:color .2s var(--ease);
}
.sidebar-cat-list li:last-child a { border-bottom:none; }
.sidebar-cat-list a:hover { color:var(--accent); }
.sb-count {
  font-size:.7rem; font-weight:700;
  background:var(--light);
  color:var(--secondary);
  padding:.18rem .5rem;
  border-radius:var(--r-pill);
}

.sidebar-tagcloud { display:flex; flex-wrap:wrap; gap:.35rem; }
.sidebar-tagcloud .topic-tag { font-size:.72rem; padding:.22rem .55rem; }

.sidebar-recent { list-style:none; margin:0; padding:0; }
.sidebar-recent li + li { margin-top:.85rem; padding-top:.85rem; border-top:1px dashed var(--border); }
.sidebar-recent a {
  display:grid; grid-template-columns:64px 1fr; gap:.75rem;
  text-decoration:none;
  align-items:flex-start;
}
.sr-img {
  width:64px; height:48px;
  border-radius:var(--r-sm);
  background-size:cover; background-position:center;
  flex-shrink:0;
}
.sr-body { display:flex; flex-direction:column; gap:.2rem; min-width:0; }
.sr-body strong {
  display:block;
  font-size:.85rem; font-weight:700; color:var(--dark);
  line-height:1.35;
  transition:color .2s var(--ease);
}
.sidebar-recent a:hover .sr-body strong { color:var(--accent); }
.sr-meta { font-size:.72rem; color:var(--secondary); }

.sidebar-subscribe p {
  font-size:.82rem; color:var(--muted); line-height:1.55;
  margin-bottom:.85rem;
}
.sidebar-subscribe-form { display:flex; flex-direction:column; gap:.5rem; }
.sidebar-subscribe-form input {
  width:100%;
  height:2.6rem;
  padding:0 .9rem;
  border:1px solid var(--border);
  border-radius:var(--r-pill);
  font-family:inherit; font-size:.85rem; color:var(--dark);
  outline:none;
  transition:border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.sidebar-subscribe-form input:focus {
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(var(--accent-rgb),.15);
}

.sidebar-ad {
  background:linear-gradient(135deg, var(--dark) 0%, #0a3a55 100%);
  color:#fff;
  border:none;
}
.sidebar-ad .sidebar-ad-eyebrow {
  display:inline-block;
  font-size:.62rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent);
  margin-bottom:.6rem;
}
.sidebar-ad h3 {
  font-size:1.1rem; font-weight:700; color:#fff;
  margin-bottom:.55rem;
}
.sidebar-ad p {
  font-size:.85rem; color:rgba(255,255,255,.8); line-height:1.55;
  margin-bottom:1rem;
}

/* ====== Article CTA band — 2-up ====== */
.article-cta-band {
  background:#fff;
  border-top:1px solid var(--border);
  padding:4rem 0;
}
.article-cta-row {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2.5rem;
  align-items:start;
}
.article-cta-row.article-cta-row--single {
  grid-template-columns:1fr;
  max-width:720px;
  margin-left:auto; margin-right:auto;
  text-align:center;
}
.article-cta-row--single .subscribe-form { justify-content:center; }
.article-cta-row--single p { margin-left:auto; margin-right:auto; }
.article-cta-half h2 {
  font-size:clamp(1.3rem, 2vw, 1.6rem);
  font-weight:700; line-height:1.25;
  color:var(--dark);
  margin:.55rem 0 .65rem;
  letter-spacing:-.005em;
}
.article-cta-half p {
  font-size:.92rem; color:var(--muted); line-height:1.65;
  margin-bottom:1.25rem;
  max-width:42ch;
}
.article-cta-half .eyebrow-light {
  display:inline-block;
  font-size:.68rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent);
}
.article-cta-talk .cta-row { display:flex; flex-wrap:wrap; gap:.6rem; }
/* Visual divider between the two halves of the CTA band */
.article-cta-row > .article-cta-talk { position:relative; }
.article-cta-row > .article-cta-talk::before {
  content:'';
  position:absolute; left:-1.25rem; top:0; bottom:0;
  width:1px; background:var(--border);
}


/* ============================================================
   Utility templates — category / tag / 404 / author / search
============================================================ */

/* Archive stats strip (category, tag, author) */
.archive-stats {
  list-style:none; margin:1rem 0 0; padding:0;
  display:flex; flex-wrap:wrap; gap:.5rem .85rem;
  font-size:.78rem; color:rgba(255,255,255,.78);
}
.archive-stats li {
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.18);
  padding:.3rem .7rem;
  border-radius:var(--r-pill);
  font-weight:600;
}
.archive-stats li strong { color:#fff; font-weight:800; margin-right:.2rem; }

/* Filter chip with count (category / tag / search) */
.filter-chip--counted {
  display:inline-flex; align-items:center; gap:.4rem;
}
.filter-chip--counted::before { display:none; }   /* hide the radio dot used by basic chips */
.filter-chip.is-active {
  background:var(--accent); color:#fff; border-color:var(--accent);
}
.chip-count {
  display:inline-flex; align-items:center; justify-content:center;
  min-width:1.5em;
  font-size:.7rem; font-weight:800;
  background:rgba(255,255,255,.25);
  color:inherit;
  padding:.1rem .45rem;
  border-radius:var(--r-pill);
  line-height:1.2;
}
.filter-chip:not(.is-active) .chip-count {
  background:var(--light);
  color:var(--secondary);
}

/* Polymorphic grid — explicit 3-column variant */
.followup-grid--3col { grid-template-columns:repeat(3, 1fr); }

/* Related-terms strip (category / tag) */
.related-terms-section {
  background:#fff;
  border-top:1px solid var(--border);
  padding:2rem 0 2.5rem;
}
.related-terms-strip {
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center;
  gap:.55rem .8rem;
  font-size:.92rem;
  color:var(--muted);
  margin:0;
}
.related-terms-strip .rt-label {
  font-size:.7rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  color:var(--secondary);
  margin-right:.4rem;
}
.related-terms-strip a {
  color:var(--dark); font-weight:600;
  padding:.2rem .15rem;
  transition:color .2s var(--ease);
}
.related-terms-strip a:hover { color:var(--accent); }
.related-terms-strip .rt-sep { color:var(--secondary); opacity:.55; }
.related-terms-strip .rt-all { color:var(--accent); margin-left:.4rem; }

/* Cross-taxonomy suggestion grid (category / tag) */
.cross-tax-grid {
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1rem;
}
.cross-tax-card {
  display:flex; flex-direction:column; gap:.35rem;
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  padding:1.5rem 1.65rem;
  text-decoration:none;
  transition:transform .25s var(--ease), border-color .25s var(--ease), box-shadow .25s var(--ease);
}
.cross-tax-card:hover { transform:translateY(-3px); border-color:var(--accent); box-shadow:var(--shadow-card); }
.ct-eyebrow {
  font-size:.65rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent);
}
.cross-tax-card h3 {
  font-size:1.05rem; font-weight:700; color:var(--dark);
  margin:.15rem 0 .35rem;
  letter-spacing:-.005em;
}
.cross-tax-card p {
  font-size:.85rem; color:var(--muted); line-height:1.55;
  margin:0 0 .85rem;
  flex:1;
}
.ct-arrow {
  font-size:.85rem; font-weight:700; color:var(--accent);
  margin-top:auto;
}

/* ============================================================
   404 page — clean, search-led
============================================================ */
.notfound-section {
  padding:4rem 0 3rem;
  text-align:center;
  background:linear-gradient(180deg, var(--light) 0%, var(--white) 100%);
}
.notfound-inner { max-width:720px; margin:0 auto; }
.notfound-eyebrow {
  display:inline-block;
  font-size:.7rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
  color:var(--accent);
  margin-bottom:.85rem;
  padding:.4rem .85rem;
  background:rgba(var(--accent-rgb),.1);
  border-radius:var(--r-pill);
}
.notfound-section h1 {
  font-size:clamp(2rem, 4vw, 2.8rem);
  font-weight:700; line-height:1.15; letter-spacing:-.015em;
  color:var(--dark);
  margin-bottom:.85rem;
}
.notfound-sub {
  font-size:1.05rem; color:var(--muted); line-height:1.65;
  margin:0 auto 2rem;
  max-width:540px;
}
.notfound-search {
  display:flex; align-items:center; gap:.5rem;
  background:#fff;
  border:2px solid var(--accent);
  border-radius:var(--r-pill);
  padding:.45rem .55rem .45rem 1.1rem;
  max-width:560px;
  margin:0 auto;
  box-shadow:0 8px 24px rgba(2,100,138,.15);
}
.notfound-search > svg { color:var(--accent); flex-shrink:0; }
.notfound-search input {
  flex:1;
  height:3rem;
  background:transparent; border:none; outline:none;
  font-family:inherit; font-size:1rem; color:var(--dark);
  min-width:0;
}
.notfound-search .btn { flex-shrink:0; height:3rem; }
.notfound-hint {
  font-size:.88rem; color:var(--muted);
  margin-top:1.25rem;
}
.notfound-hint a { color:var(--accent); font-weight:600; }

/* 404 / search empty: 3-column "browse by" routes */
.notfound-routes {
  display:grid; grid-template-columns:repeat(3, 1fr); gap:1.5rem;
}
.notfound-route {
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  padding:1.5rem 1.65rem;
}
.nf-route-eyebrow {
  display:block;
  font-size:.65rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent);
  padding-bottom:.7rem;
  margin-bottom:.85rem;
  border-bottom:1px solid var(--border);
}
.notfound-route ul { list-style:none; margin:0 0 .85rem; padding:0; }
.notfound-route li { margin-bottom:.45rem; }
.notfound-route li a {
  font-size:.92rem; font-weight:600; color:var(--dark);
  text-decoration:none;
  transition:color .2s var(--ease);
}
.notfound-route li a:hover { color:var(--accent); }
.nf-route-link {
  display:inline-block;
  font-size:.85rem; font-weight:700; color:var(--accent);
  margin-top:.35rem;
}

/* Migration callout (404) */
.migration-callout {
  display:grid;
  grid-template-columns:auto 1fr;
  gap:1.75rem;
  background:#fff;
  border:1px solid rgba(var(--accent-rgb),.25);
  border-left:4px solid var(--accent);
  border-radius:var(--r-md);
  padding:2rem 2.25rem;
  align-items:center;
}
.migration-icon {
  width:64px; height:64px;
  background:rgba(var(--accent-rgb),.08);
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  color:var(--accent);
  flex-shrink:0;
}
.migration-eyebrow {
  display:inline-block;
  font-size:.65rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent);
  margin-bottom:.55rem;
}
.migration-body h3 {
  font-size:1.2rem; font-weight:700; color:var(--dark);
  margin:0 0 .55rem;
}
.migration-body p {
  font-size:.92rem; color:var(--muted); line-height:1.65;
  margin:0 0 1rem;
}
.migration-body p strong { color:var(--dark); }

/* ============================================================
   Author page
============================================================ */
.author-hero-section { padding-top:2.5rem; }
.author-hero {
  display:grid;
  grid-template-columns:1.5fr 1fr;
  gap:3rem;
  align-items:start;
}
.author-hero-text { min-width:0; }
.author-hero-text .eyebrow-light {
  display:inline-block;
  font-size:.7rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent);
}
.author-hero-text h1 {
  font-size:clamp(1.85rem, 4vw, 2.6rem);
  font-weight:700; line-height:1.15; letter-spacing:-.015em;
  color:var(--dark);
  margin:.65rem 0 .25rem;
}
.author-role {
  font-size:.92rem; font-weight:700; color:var(--accent);
  letter-spacing:.04em; text-transform:uppercase;
  margin:0 0 1.5rem;
}
.author-bio-text p {
  font-size:1rem; color:var(--muted); line-height:1.75;
  margin-bottom:1rem;
  max-width:60ch;
}
.author-specialisms {
  display:flex; flex-wrap:wrap; align-items:center; gap:.4rem;
  margin:1.25rem 0 1.5rem;
}
.author-specialisms-label {
  font-size:.65rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--secondary);
  margin-right:.4rem;
}
.author-social {
  display:flex; flex-wrap:wrap; gap:.55rem;
}
.author-social-link {
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.6rem 1.1rem;
  background:#0a66c2;
  color:#fff;
  border-radius:var(--r-pill);
  font-size:.85rem; font-weight:700;
  text-decoration:none;
  transition:all .2s var(--ease);
}
.author-social-link:hover { background:#084c91; color:#fff; transform:translateY(-1px); }
.author-social-link--email {
  background:transparent; color:var(--dark);
  border:1px solid var(--border);
}
.author-social-link--email:hover {
  background:var(--accent); color:#fff; border-color:var(--accent);
}

.author-hero-side { min-width:0; }
.author-headshot {
  margin:0 0 1.25rem;
  aspect-ratio:1;
  border-radius:var(--r-md);
  overflow:hidden;
  box-shadow:var(--shadow-lg);
  background:linear-gradient(135deg,#243648,#04adee);
}
.author-headshot img {
  width:100%; height:100%;
  object-fit:cover; object-position:center;
}
.author-stats {
  list-style:none; margin:0; padding:0;
  display:flex; flex-direction:column; gap:.4rem;
  background:var(--light);
  border-radius:var(--r-md);
  padding:1.1rem 1.25rem;
}
.author-stats li {
  display:flex; align-items:baseline; gap:.55rem;
  font-size:.88rem; color:var(--muted);
  padding:.2rem 0;
  border-bottom:1px dashed var(--border);
}
.author-stats li:last-child { border-bottom:none; }
.author-stats strong {
  color:var(--accent); font-weight:800; font-size:1.1rem;
  min-width:3em;
}

/* Other authors (small cards) */
.other-authors-grid {
  display:grid; grid-template-columns:repeat(4, 1fr); gap:1rem;
}
.other-author-card {
  display:flex; flex-direction:column; align-items:center;
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  padding:1.25rem 1rem;
  text-align:center;
  text-decoration:none;
  transition:all .25s var(--ease);
}
.other-author-card:hover { transform:translateY(-3px); border-color:var(--accent); box-shadow:var(--shadow-card); }
.other-author-photo {
  width:64px; height:64px;
  border-radius:50%;
  overflow:hidden;
  margin-bottom:.85rem;
  background:linear-gradient(135deg,#243648,#04adee);
}
.other-author-photo img {
  width:100%; height:100%;
  object-fit:cover; object-position:center;
}
.other-author-card strong {
  display:block;
  font-size:.92rem; color:var(--dark); font-weight:700;
}
.other-author-card span {
  font-size:.76rem; color:var(--muted);
  margin-top:.15rem;
}

/* ============================================================
   Search results page
============================================================ */
.search-header-section {
  padding:3rem 0 2rem;
  background:linear-gradient(180deg, var(--light) 0%, var(--white) 100%);
  margin-top:0;
}
.search-header-inner { max-width:720px; }
.search-header-section .eyebrow {
  display:inline-block;
  font-size:.7rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent);
  margin-bottom:.55rem;
}
.search-header-section h1 {
  font-size:clamp(1.6rem, 3vw, 2.1rem);
  font-weight:700; line-height:1.2; letter-spacing:-.01em;
  color:var(--dark);
  margin:0 0 1.25rem;
}
.search-header-section h1 em {
  font-style:normal;
  color:var(--accent);
}
.search-page-input {
  display:flex; align-items:center; gap:.5rem;
  background:#fff;
  border:2px solid var(--accent);
  border-radius:var(--r-pill);
  padding:.45rem .55rem .45rem 1.1rem;
  margin-bottom:1rem;
  box-shadow:0 8px 24px rgba(2,100,138,.12);
}
.search-page-input > svg { color:var(--accent); flex-shrink:0; }
.search-page-input input {
  flex:1;
  height:3rem;
  background:transparent; border:none; outline:none;
  font-family:inherit; font-size:1rem; color:var(--dark);
  min-width:0;
}
.search-page-input .btn { flex-shrink:0; height:3rem; }
.search-result-count {
  font-size:.92rem; color:var(--muted);
  margin:0;
}
.search-result-count strong { color:var(--dark); font-weight:800; }

/* Search results list — flat list, distinct from card grid */
.search-results-list {
  list-style:none; margin:0; padding:0;
  display:flex; flex-direction:column; gap:1.25rem;
}
.search-result {
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  padding:1.5rem 1.75rem 1.65rem;
  transition:border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.search-result:hover { border-color:var(--accent); box-shadow:var(--shadow-card); }
.search-result[hidden] { display:none; }
.search-result-tag {
  display:inline-block;
  font-size:.6rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  padding:.22rem .55rem;
  border-radius:var(--r-pill);
  background:var(--light);
  color:var(--secondary);
  margin-bottom:.45rem;
}
.search-result-tag.tag-product { background:rgba(var(--accent-rgb),.1); color:var(--accent); }
.search-result-tag.tag-material { background:rgba(var(--accent-rgb),.1); color:var(--accent); }
.search-result-tag.tag-article { background:rgba(243,156,18,.15); color:#b3700c; }
.search-result-tag.tag-case { background:rgba(57,214,128,.15); color:#1f8e4f; }
.search-result-tag.tag-webinar-card { background:rgba(142,95,191,.15); color:#7a3fb3; }
.search-result h3 {
  font-size:1.15rem; font-weight:700; color:var(--dark);
  margin:0 0 .55rem;
  line-height:1.35;
}
.search-result h3 a { color:inherit; text-decoration:none; }
.search-result h3 a:hover { color:var(--accent); }
.search-result h3 mark,
.search-result-snippet mark {
  background:rgba(var(--accent-rgb),.18);
  color:inherit;
  padding:0 2px;
  border-radius:2px;
}
.search-result-snippet {
  font-size:.92rem; color:var(--muted); line-height:1.65;
  margin:0 0 .65rem;
}
.search-result-path {
  font-family:'SFMono-Regular',Consolas,monospace;
  font-size:.74rem; color:var(--secondary);
  letter-spacing:.02em;
}

/* Search empty state */
.search-prototype-note { padding:2rem 0 0; }
.search-empty-state { padding-top:3rem; padding-bottom:4rem; }
.search-empty-h2 {
  font-size:clamp(1.4rem, 2.5vw, 1.8rem);
  font-weight:700; color:var(--dark);
  margin-bottom:1rem;
}
.search-empty-h2 em { font-style:normal; color:var(--accent); }
.search-empty-spellcheck {
  font-size:1.05rem; color:var(--muted);
  margin-bottom:2rem;
}
.search-empty-spellcheck a { color:var(--accent); font-weight:700; text-decoration:underline; text-underline-offset:3px; }
.search-empty-suggest {
  display:flex; flex-wrap:wrap; align-items:center; gap:.45rem;
  margin-bottom:.5rem;
}
.search-empty-label {
  font-size:.7rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--secondary);
  margin-right:.4rem;
}
.search-partial-empty {
  margin-top:2.5rem;
  padding:1.25rem 1.5rem;
  background:rgba(var(--accent-rgb),.05);
  border:1px solid rgba(var(--accent-rgb),.2);
  border-radius:var(--r-md);
  font-size:.92rem; color:var(--dark); line-height:1.65;
  text-align:center;
}
.search-partial-empty p { margin:0; }
.search-partial-empty a { color:var(--accent); font-weight:700; }
.search-empty-cta {
  text-align:center;
  margin-top:2rem;
}


/* ============================================================
   Event single — full-width hero, sticky quick-bar, 7/12+5/12
============================================================ */
.event-hero {
  position:relative;
  min-height:42vh;
  display:flex; align-items:flex-end;
  overflow:hidden;
  background:var(--dark);
  color:#fff;
  padding:5rem 0 3rem;
}
.event-hero-img {
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover; object-position:center;
}
.event-hero-overlay {
  position:absolute; inset:0;
  background:linear-gradient(135deg, rgba(28,43,58,.9) 0%, rgba(28,43,58,.6) 60%, rgba(4,173,238,.18) 100%);
}
.event-hero-inner { position:relative; z-index:1; }
.event-status-badge {
  display:inline-block;
  font-size:.7rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
  padding:.4rem .85rem;
  border-radius:var(--r-pill);
  margin-bottom:1rem;
}
.event-status-badge--upcoming { background:var(--accent); color:#fff; }
.event-status-badge--past     { background:rgba(255,255,255,.92); color:var(--dark); }
.event-hero h1 {
  font-size:clamp(1.85rem, 4vw, 2.8rem);
  font-weight:700; line-height:1.15; letter-spacing:-.015em;
  margin-bottom:.85rem;
}
.event-dek {
  font-size:clamp(1rem, 1.4vw, 1.15rem);
  color:rgba(255,255,255,.85);
  line-height:1.6;
  max-width:62ch;
  margin-bottom:1.25rem;
}
.event-hero-meta {
  display:flex; flex-wrap:wrap; align-items:center;
  gap:.5rem .65rem;
  font-size:.92rem; color:rgba(255,255,255,.85);
}
.event-hero-meta-item {
  display:inline-flex; align-items:center; gap:.45rem;
  font-weight:600;
}
.event-hero-meta-item svg { color:var(--accent); }
.event-hero-meta-sep { color:rgba(255,255,255,.4); }

/* Sticky quick-action bar — `top` is set dynamically by JS to match
   the live header height, and z-index sits above Leaflet panes (≤650). */
.event-quickbar {
  position:sticky;
  top:var(--qb-top, var(--header-h));
  z-index:700;
  background:#fff;
  border-bottom:1px solid var(--border);
  box-shadow:0 1px 0 rgba(0,0,0,.02);
}
.event-quickbar-inner {
  display:flex; gap:.5rem;
  padding:.85rem 1.5rem;
  flex-wrap:wrap;
}
.event-quickbar-action {
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.55rem 1rem;
  background:var(--light-alt);
  border:1px solid var(--border);
  border-radius:var(--r-pill);
  font-size:.82rem; font-weight:700;
  color:var(--dark);
  text-decoration:none;
  transition:all .2s var(--ease);
}
.event-quickbar-action svg { color:var(--accent); flex-shrink:0; }
.event-quickbar-action:hover {
  background:#fff; border-color:var(--accent);
  color:var(--accent);
}
.event-quickbar-action--primary {
  background:var(--accent); border-color:var(--accent); color:#fff; margin-left:auto;
}
.event-quickbar-action--primary svg { color:#fff; }
.event-quickbar-action--primary:hover {
  background:var(--accent-dk); border-color:var(--accent-dk); color:#fff;
}

/* Layout — match site container width and 8/4 ratio for consistency */
.event-section { padding-top:3rem; padding-bottom:4rem; }
.event-layout {
  display:grid;
  grid-template-columns: minmax(0, 8fr) minmax(0, 4fr);
  gap:3rem;
  align-items:start;
}
.event-main { min-width:0; }
.event-main h2 {
  font-size:clamp(1.3rem, 2.2vw, 1.6rem);
  font-weight:700; color:var(--dark);
  margin:2.5rem 0 1rem;
  letter-spacing:-.005em;
}
.event-main h2:first-of-type { margin-top:0; }

.event-sidebar {
  position:sticky;
  top:calc(var(--header-h) + 5rem);
  display:flex; flex-direction:column; gap:1.25rem;
  align-self:start;
  min-width:0;
}

/* Event organiser block */
.event-organiser-block {
  display:grid;
  grid-template-columns:auto 1fr;
  gap:1.25rem;
  background:var(--light);
  border-radius:var(--r-md);
  padding:1.5rem 1.75rem;
  margin:1.5rem 0 0;
}
.event-organiser-logo {
  width:64px; height:64px;
  border-radius:var(--r-md);
  background:var(--dark);
  color:#fff;
  font-size:1.1rem; font-weight:800;
  display:flex; align-items:center; justify-content:center;
  letter-spacing:.04em;
  flex-shrink:0;
}
.event-organiser-info { display:flex; flex-direction:column; gap:.25rem; }
.event-organiser-eyebrow {
  font-size:.62rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent);
}
.event-organiser-info strong {
  font-size:1.05rem; color:var(--dark); font-weight:700;
}
.event-organiser-info p {
  font-size:.88rem; color:var(--muted); line-height:1.55;
  margin:.15rem 0 .55rem;
}

/* Event team grid — thumbnail on top, content below */
.event-team-grid {
  display:grid; grid-template-columns:repeat(3, 1fr); gap:1rem;
  margin-bottom:1.5rem;
}
.event-team-card {
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  overflow:hidden;
  display:flex; flex-direction:column;
  transition:transform .25s var(--ease), border-color .25s var(--ease), box-shadow .25s var(--ease);
}
.event-team-card:hover { transform:translateY(-2px); border-color:var(--accent); box-shadow:var(--shadow-card); }
.event-team-photo {
  display:block;
  width:100%;
  aspect-ratio:4/3;
  overflow:hidden;
  background:linear-gradient(135deg,#243648,#04adee);
}
.event-team-photo img {
  width:100%; height:100%;
  object-fit:cover; object-position:center;
  display:block;
}
.event-team-body {
  padding:1.15rem 1.35rem 1.25rem;
  display:flex; flex-direction:column; gap:.35rem;
  flex:1;
}
.event-team-card h3 {
  font-size:1rem; font-weight:700; color:var(--dark); margin:0;
}
.event-team-role {
  font-size:.75rem; font-weight:700; color:var(--accent);
  text-transform:uppercase; letter-spacing:.04em;
  margin:0 0 .35rem;
}
.event-team-availability {
  font-size:.85rem; color:var(--muted); line-height:1.55; margin:0 0 .65rem;
  flex:1;
}
.event-team-book {
  font-family:inherit;
  background:transparent; border:none;
  text-align:left;
  padding:.4rem 0;
  font-size:.82rem; font-weight:700; color:var(--accent);
  cursor:pointer;
  transition:color .2s var(--ease);
}
.event-team-book:hover { color:var(--accent-dk); }

/* Map */
.event-stand-info {
  font-size:.92rem; color:var(--muted);
  margin:0 0 1rem;
}
.event-stand-info strong { color:var(--accent); font-weight:700; }
.event-map-wrap {
  border-radius:var(--r-md);
  overflow:hidden;
  box-shadow:var(--shadow-card);
  margin-bottom:1rem;
}
.event-map { height:340px; background:#dde4ec; }
.event-map .leaflet-container { background:#dde4ec; }

/* Stand list */
.event-stand-list {
  list-style:none;
  margin:0; padding:0;
  display:flex; flex-direction:column; gap:.6rem;
}
.event-stand-list li {
  position:relative;
  padding:.85rem 1rem .85rem 2.25rem;
  background:rgba(var(--accent-rgb),.05);
  border-left:3px solid var(--accent);
  border-radius:var(--r-sm);
  font-size:.92rem; color:var(--muted);
  line-height:1.55;
}
.event-stand-list li::before {
  content:'';
  position:absolute; left:1rem; top:1.25em;
  width:8px; height:8px;
  border-radius:50%;
  background:var(--accent);
}
.event-stand-list li strong { color:var(--dark); font-weight:700; display:block; margin-bottom:.2rem; }

/* Meeting form (sidebar) — extends registration-form patterns */
.meeting-form {
  background:#fff;
  border:2px solid var(--accent);
  border-radius:var(--r-md);
  padding:1.5rem 1.65rem;
  box-shadow:0 8px 24px rgba(2,100,138,.12);
}
.meeting-day-set {
  border:none; padding:0; margin:.5rem 0 .85rem;
}
.meeting-day-set legend {
  font-size:.78rem; font-weight:700; color:var(--dark);
  margin-bottom:.4rem; padding:0;
}
.meeting-day-set { display:flex; flex-direction:column; gap:.35rem; }
.meeting-day {
  display:flex; align-items:center; gap:.55rem;
  padding:.5rem .75rem;
  background:var(--light-alt);
  border:1px solid var(--border);
  border-radius:var(--r-sm);
  font-size:.85rem; color:var(--dark);
  cursor:pointer;
  transition:all .2s var(--ease);
}
.meeting-day:hover { border-color:var(--accent); }
.meeting-day input { margin:0; flex-shrink:0; accent-color:var(--accent); }
.meeting-day:has(input:checked) {
  background:#fff;
  border-color:var(--accent);
  color:var(--accent);
  font-weight:600;
}

/* Honeypot — visually hidden from real users */
.hp-field {
  position:absolute !important;
  left:-9999px !important;
  width:1px; height:1px; overflow:hidden;
}

/* Quick facts */
.event-quick-facts dl { margin:0; }
.qf-row {
  display:grid;
  grid-template-columns:90px 1fr;
  gap:.5rem;
  padding:.45rem 0;
  border-bottom:1px dashed var(--border);
  font-size:.88rem;
}
.qf-row:last-child { border-bottom:none; }
.qf-row dt {
  font-size:.7rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase;
  color:var(--secondary);
  align-self:center;
}
.qf-row dd { margin:0; color:var(--dark); font-weight:600; }
.qf-row dd a { color:var(--accent); }

/* Past-event sidebar card (replaces meeting form) */
.past-event-card {
  background:linear-gradient(135deg, var(--dark) 0%, #0a3a55 100%);
  color:#fff;
  border-radius:var(--r-md);
  padding:1.75rem 1.65rem;
  text-align:center;
  position:relative;
  overflow:hidden;
}
.past-event-card::before {
  content:'';
  position:absolute; right:-30px; top:-30px;
  width:120px; height:120px;
  border-radius:50%;
  background:rgba(4,173,238,.12);
  pointer-events:none;
}
.past-event-eyebrow {
  display:inline-block;
  font-size:.62rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
  color:var(--accent);
  margin-bottom:.65rem;
  position:relative;
}
.past-event-card h3 {
  font-size:1.2rem; font-weight:700; color:#fff;
  margin:0 0 .55rem;
  position:relative;
}
.past-event-card p {
  font-size:.88rem; color:rgba(255,255,255,.78); line-height:1.55;
  margin:0 0 1.1rem;
  position:relative;
}
.past-event-card .btn { position:relative; }
.past-event-card .btn-primary {
  background:#fff; color:var(--accent); border-color:#fff;
}
.past-event-card .btn-primary:hover {
  background:var(--accent-dk); color:#fff; border-color:var(--accent-dk);
}
.past-event-secondary {
  display:inline-block;
  margin-top:.85rem;
  font-size:.78rem; font-weight:700;
  color:rgba(255,255,255,.85);
  text-decoration:underline;
  text-underline-offset:3px;
  position:relative;
}
.past-event-secondary:hover { color:#fff; }


/* ============================================================
   Webinar single — hero + overlapping player frame, 7/12+5/12
============================================================ */
.webinar-hero {
  position:relative;
  background:linear-gradient(135deg, var(--dark) 0%, #0a3a55 100%);
  color:#fff;
  padding:3rem 0 8rem;       /* large bottom pad — player frame overlaps */
  overflow:hidden;
}
.webinar-hero-shade {
  position:absolute; inset:0;
  background:
    radial-gradient(circle at 80% 20%, rgba(4,173,238,.18), transparent 45%),
    radial-gradient(circle at 12% 110%, rgba(4,173,238,.12), transparent 45%);
  pointer-events:none;
}
.webinar-hero-inner { position:relative; z-index:1; max-width:880px; }

.webinar-status-badge {
  display:inline-block;
  font-size:.7rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  padding:.4rem .85rem;
  border-radius:var(--r-pill);
  margin-bottom:1rem;
}
.webinar-status-badge--upcoming { background:var(--accent); color:#fff; }
.webinar-status-badge--past     { background:rgba(255,255,255,.92); color:var(--dark); }
.webinar-status-badge--live {
  background:#d94040; color:#fff;
  animation:wsbPulse 2s infinite;
}
@keyframes wsbPulse { 0%,100% { box-shadow:0 0 0 0 rgba(217,64,64,.7); } 70% { box-shadow:0 0 0 12px rgba(217,64,64,0); } }

.webinar-hero h1 {
  font-size:clamp(1.75rem, 3.4vw, 2.5rem);
  font-weight:700; line-height:1.18; letter-spacing:-.015em;
  margin-bottom:.85rem;
}
.webinar-dek {
  font-size:clamp(1rem, 1.4vw, 1.15rem);
  color:rgba(255,255,255,.85);
  line-height:1.6; margin-bottom:1.25rem;
  max-width:62ch;
}
.webinar-when-meta {
  font-size:.85rem; color:rgba(255,255,255,.75);
  margin:0;
}
.webinar-when-meta strong { color:#fff; font-weight:700; }
.webinar-gated-tag {
  display:inline-block;
  font-size:.7rem; font-weight:700; letter-spacing:.06em;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.25);
  padding:.18rem .55rem;
  border-radius:var(--r-pill);
  margin-left:.4rem;
}

/* Player frame — half-overlapping the hero band */
.webinar-player-wrap {
  position:relative;
  z-index:5;
  margin-top:-7rem;             /* pull up to overlap hero */
  margin-bottom:2rem;
  max-width:1080px;
}
.webinar-player-frame {
  position:relative;
  aspect-ratio:16/9;
  background:#000;
  border-radius:var(--r-md);
  overflow:hidden;
  box-shadow:0 30px 60px rgba(0,0,0,.45), 0 10px 20px rgba(0,0,0,.25);
  border:4px solid rgba(255,255,255,.92);
}
.webinar-player-poster {
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
}
.webinar-player-frame::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.45));
  pointer-events:none;
}
.webinar-play-button {
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:88px; height:88px;
  border-radius:50%;
  background:rgba(255,255,255,.95);
  color:var(--dark);
  border:none;
  display:flex; align-items:center; justify-content:center;
  padding-left:6px;
  cursor:pointer;
  box-shadow:0 12px 28px rgba(0,0,0,.35);
  transition:all .25s var(--ease);
  z-index:2;
}
.webinar-play-button:hover { transform:translate(-50%,-50%) scale(1.06); background:#fff; color:var(--accent); }

/* Upcoming variant — no play button, "LIVE SOON" badge */
.webinar-player-frame--upcoming .webinar-play-button { display:none; }
.webinar-live-soon-badge {
  position:absolute; top:1.25rem; left:1.25rem;
  z-index:2;
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.45rem .85rem;
  background:rgba(0,0,0,.65);
  color:#fff;
  border-radius:var(--r-pill);
  font-size:.7rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
  backdrop-filter:blur(6px);
}
.live-soon-dot {
  width:8px; height:8px;
  border-radius:50%;
  background:#39d680;
  box-shadow:0 0 0 0 rgba(57,214,128,.7);
  animation:wsbPulse 2s infinite;
}
.webinar-gate-pill {
  position:absolute; bottom:1.25rem; right:1.25rem;
  z-index:2;
  padding:.45rem .85rem;
  background:rgba(0,0,0,.7);
  color:#fff;
  border-radius:var(--r-pill);
  font-size:.72rem; font-weight:700; letter-spacing:.04em;
  backdrop-filter:blur(6px);
}

/* "Playing" placeholder (after click — prototype only) */
.webinar-playing-placeholder {
  position:absolute; inset:0;
  background:#000;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:.85rem;
  color:#fff;
  z-index:3;
}
.webinar-playing-placeholder svg { color:var(--accent); }
.webinar-playing-placeholder p {
  font-size:.95rem; color:rgba(255,255,255,.85);
  text-align:center; max-width:340px;
}
.webinar-playing-placeholder small {
  font-size:.7rem; color:rgba(255,255,255,.5);
  letter-spacing:.06em;
}

/* Layout */
.webinar-section { padding-top:3rem; }
.webinar-layout {
  display:grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap:3rem;
  align-items:start;
  max-width:1200px;
}
.webinar-main { min-width:0; }
.webinar-main h2 {
  font-size:clamp(1.3rem, 2.2vw, 1.6rem);
  font-weight:700; color:var(--dark);
  margin:2.5rem 0 1rem;
  letter-spacing:-.005em;
}
.webinar-main h2:first-child { margin-top:0; }
.webinar-main h3 {
  font-size:1.08rem; font-weight:700; color:var(--dark);
  margin:1.5rem 0 .55rem;
}
.webinar-main .write-up p { font-size:1rem; line-height:1.85; }
.webinar-sidebar {
  position:sticky;
  top:calc(var(--header-h) + 1.5rem);
  display:flex; flex-direction:column; gap:1.25rem;
  align-self:start;
  min-width:0;
}

/* Countdown timer */
.countdown-timer {
  background:linear-gradient(135deg, var(--dark) 0%, #0a3a55 100%);
  color:#fff;
  border-radius:var(--r-md);
  padding:1.5rem 1.75rem;
  margin-bottom:2rem;
  box-shadow:var(--shadow-card);
}
.countdown-status {
  display:block;
  font-size:.7rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent);
  margin-bottom:.85rem;
}
.countdown-cells {
  display:grid; grid-template-columns:repeat(4, 1fr);
  gap:.75rem;
}
.countdown-cell {
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);
  border-radius:var(--r-md);
  padding:1.25rem .85rem 1rem;
  text-align:center;
}
.countdown-num {
  display:block;
  font-size:clamp(1.6rem, 3vw, 2.4rem);
  font-weight:800; color:#fff;
  letter-spacing:-.02em; line-height:1;
  font-variant-numeric:tabular-nums;
}
.countdown-label {
  display:block;
  font-size:.62rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
  color:rgba(255,255,255,.65);
  margin-top:.45rem;
}
.countdown-timer.countdown-live {
  background:#d94040;
  text-align:center;
}
.countdown-timer.countdown-live .countdown-status {
  color:#fff;
  font-size:1.2rem;
  letter-spacing:.16em;
}
.countdown-timer.countdown-live .countdown-cells { display:none; }

/* Speakers grid — thumbnail on top, content below */
.speakers-grid {
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1rem;
  margin-bottom:2rem;
}
.speaker-card {
  display:flex; flex-direction:column;
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  overflow:hidden;
}
.speaker-card--guest { background:rgba(var(--accent-rgb),.04); border-color:rgba(var(--accent-rgb),.25); }
.speaker-photo {
  display:block;
  width:100%;
  aspect-ratio:4/3;
  overflow:hidden;
  background:linear-gradient(135deg,#243648,#04adee);
}
.speaker-photo img {
  width:100%; height:100%;
  object-fit:cover; object-position:center;
  display:block;
}
.speaker-body { padding:1rem 1.15rem 1.15rem; min-width:0; }
.speaker-card h3 {
  font-size:.95rem; font-weight:700; color:var(--dark);
  margin:0 0 .15rem;
  display:flex; align-items:baseline; gap:.5rem;
  flex-wrap:wrap;
}
.speaker-guest {
  font-size:.62rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
  background:var(--accent); color:#fff;
  padding:.15rem .5rem;
  border-radius:var(--r-pill);
}
.speaker-role {
  font-size:.72rem; font-weight:700; color:var(--accent);
  text-transform:uppercase; letter-spacing:.04em;
  margin:0 0 .45rem;
}
.speaker-bio { font-size:.82rem; color:var(--muted); line-height:1.55; margin:0; }

/* Agenda list */
.agenda-list {
  list-style:none; margin:0; padding:0;
  border-top:1px solid var(--border);
}
.agenda-list li {
  display:grid;
  grid-template-columns:80px 1fr;
  gap:1rem;
  padding:.85rem 0;
  border-bottom:1px solid var(--border);
  align-items:flex-start;
}
.agenda-time {
  font-family:'SFMono-Regular',Consolas,monospace;
  font-size:.85rem; font-weight:700;
  color:var(--accent);
  padding-top:.1rem;
}
.agenda-text { font-size:.92rem; color:var(--muted); line-height:1.55; }
.agenda-text strong { color:var(--dark); font-weight:700; display:block; margin-bottom:.15rem; }

/* Bullet variant — agenda without timestamps */
.agenda-list.agenda-list--bullets {
  border-top:none;
}
.agenda-list.agenda-list--bullets li {
  display:block;
  position:relative;
  padding:.6rem 0 .6rem 1.6rem;
  border-bottom:1px solid var(--border);
  font-size:.95rem; color:var(--muted); line-height:1.6;
}
.agenda-list.agenda-list--bullets li:last-child { border-bottom:none; }
.agenda-list.agenda-list--bullets li::before {
  content:'';
  position:absolute; left:0; top:1.05em;
  width:8px; height:8px;
  border-radius:50%;
  background:var(--accent);
}
.agenda-list.agenda-list--bullets li strong {
  color:var(--dark); font-weight:700;
}

/* Follow-up reading polymorphic cards */
.followup-intro {
  font-size:.92rem; color:var(--muted);
  margin-bottom:1rem;
}
.followup-grid {
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1rem;
  margin-bottom:1.5rem;
}
.followup-card {
  display:flex; flex-direction:column;
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  overflow:hidden;
  text-decoration:none;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease);
}
.followup-card:hover {
  transform:translateY(-3px);
  border-color:var(--accent);
  box-shadow:var(--shadow-card-hover);
}
.followup-img {
  aspect-ratio:16/10;
  background-size:cover; background-position:center;
}
.followup-body {
  padding:1rem 1.1rem 1.1rem;
  display:flex; flex-direction:column; gap:.4rem;
  flex:1;
}
.followup-card-tag {
  font-size:.6rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  padding:.2rem .55rem;
  border-radius:var(--r-pill);
  background:var(--light);
  color:var(--secondary);
  align-self:flex-start;
}
.followup-card-tag.tag-product   { background:rgba(var(--accent-rgb),.1); color:var(--accent); }
.followup-card-tag.tag-material  { background:rgba(var(--accent-rgb),.1); color:var(--accent); }
.followup-card-tag.tag-article   { background:rgba(243,156,18,.15); color:#b3700c; }
.followup-card-tag.tag-case      { background:rgba(57,214,128,.15); color:#1f8e4f; }
.followup-card-tag.tag-webinar-card { background:rgba(142,95,191,.15); color:#7a3fb3; }
.followup-card-tag.tag-industry  { background:rgba(28,43,58,.07); color:var(--dark); }
.followup-body strong {
  font-size:.95rem; font-weight:700; color:var(--dark);
  line-height:1.35;
}
.followup-desc { font-size:.8rem; color:var(--muted); line-height:1.55; }

/* Registration form (upcoming sidebar) */
.registration-form {
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  padding:1.5rem 1.65rem;
  box-shadow:var(--shadow-card);
}
.reg-title {
  font-size:1.05rem; font-weight:700; color:var(--dark);
  margin:0 0 .25rem;
}
.reg-sub {
  font-size:.8rem; color:var(--muted);
  margin:0 0 1.1rem;
}
.reg-field { display:flex; flex-direction:column; gap:.3rem; margin-bottom:.85rem; }
.reg-field label {
  font-size:.78rem; font-weight:700; color:var(--dark);
}
.reg-optional { color:var(--secondary); font-weight:500; font-size:.7rem; }
.reg-field input,
.reg-field select,
.reg-field textarea {
  width:100%;
  padding:.6rem .85rem;
  border:1px solid var(--border);
  border-radius:var(--r-sm);
  font-family:inherit; font-size:.88rem; color:var(--dark);
  outline:none;
  background:#fff;
  transition:border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.reg-field textarea { resize:vertical; }
.reg-field input:focus,
.reg-field select:focus,
.reg-field textarea:focus {
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(var(--accent-rgb),.15);
}
.reg-checkbox {
  display:flex; align-items:flex-start; gap:.55rem;
  margin:.85rem 0 1rem;
  font-size:.82rem; color:var(--muted); line-height:1.5;
  cursor:pointer;
}
.reg-checkbox input { margin-top:.2rem; flex-shrink:0; }
.reg-disclaimer {
  font-size:.7rem; color:var(--secondary); line-height:1.45;
  margin:.85rem 0 0;
}

/* Add to calendar block */
.add-to-cal-block .cal-options {
  list-style:none; margin:0; padding:0;
  display:flex; flex-direction:column; gap:.4rem;
}
.cal-option {
  display:flex; align-items:center; gap:.7rem;
  padding:.55rem .75rem;
  background:var(--light-alt);
  border:1px solid var(--border);
  border-radius:var(--r-sm);
  font-size:.85rem; font-weight:600; color:var(--dark);
  text-decoration:none;
  transition:all .2s var(--ease);
}
.cal-option:hover { border-color:var(--accent); background:#fff; color:var(--accent); }
.cal-icon {
  width:20px; height:20px;
  flex-shrink:0;
  display:inline-flex; align-items:center; justify-content:center;
  color:var(--secondary);
  transition:color .2s var(--ease);
}
.cal-option:hover .cal-icon { color:var(--accent); }

/* Gate modal */
.gate-modal {
  position:fixed; inset:0;
  z-index:300;
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none;
  transition:opacity .3s var(--ease);
}
.gate-modal.open { opacity:1; pointer-events:auto; }
.gate-modal-shade {
  position:absolute; inset:0;
  background:rgba(28,43,58,.75);
  backdrop-filter:blur(8px);
}
.gate-modal-card {
  position:relative;
  background:#fff;
  border-radius:var(--r-lg);
  padding:2rem 2.25rem 1.75rem;
  box-shadow:0 30px 80px rgba(0,0,0,.4);
  max-width:440px;
  width:calc(100% - 2rem);
  z-index:1;
  transform:translateY(20px) scale(.96);
  transition:transform .3s var(--ease);
}
.gate-modal.open .gate-modal-card { transform:translateY(0) scale(1); }
.gate-close {
  position:absolute; top:1rem; right:1rem;
  width:36px; height:36px;
  background:var(--light);
  border:none; border-radius:50%;
  color:var(--dark);
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:background .2s var(--ease);
}
.gate-close:hover { background:var(--border); }
.gate-eyebrow {
  display:inline-block;
  font-size:.65rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
  color:var(--accent);
  margin-bottom:.55rem;
}
.gate-modal-card h2 {
  font-size:1.4rem; font-weight:700; color:var(--dark);
  margin:0 0 .55rem;
  letter-spacing:-.005em;
}
.gate-sub {
  font-size:.92rem; color:var(--muted); line-height:1.55;
  margin:0 0 1.25rem;
}
.gate-form { display:flex; flex-direction:column; }
.gate-decline {
  font-family:inherit;
  background:transparent; border:none;
  font-size:.85rem; font-weight:600; color:var(--secondary);
  margin-top:.85rem;
  cursor:pointer;
  text-decoration:underline;
  text-underline-offset:3px;
}
.gate-decline:hover { color:var(--accent); }
.gate-disclaimer {
  font-size:.68rem; color:var(--secondary);
  margin:.85rem 0 0;
  line-height:1.45;
  text-align:center;
}


/* ============================================================
   Press-release-single — extends article layout
============================================================ */

/* Release-status label (CMS-driven) */
.release-label {
  display:inline-block;
  margin-bottom:1rem;
  padding:.4rem .85rem;
  font-size:.7rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
  border-radius:var(--r-pill);
}
.release-label--immediate {
  background:rgba(var(--accent-rgb),.1);
  color:var(--accent);
  border:1px solid rgba(var(--accent-rgb),.3);
}
.release-label--embargoed {
  background:rgba(243,156,18,.12);
  color:#b3700c;
  border:1px solid rgba(243,156,18,.45);
}

/* Standfirst — slightly larger lead paragraph */
.article-dek--standfirst {
  font-size:clamp(1.05rem, 1.55vw, 1.2rem);
  font-weight:500;
  color:var(--dark);
  line-height:1.6;
  border-left:4px solid var(--accent);
  padding:.4rem 0 .4rem 1.25rem;
}

/* Press meta strip — no author */
.article-meta--press { padding-top:1rem; padding-bottom:1rem; }
.article-dateline {
  font-size:.78rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--secondary);
}
.article-dateline strong { color:var(--dark); font-weight:800; }

/* Exec quotation block — schema Quotation */
.article-quotation {
  background:linear-gradient(135deg, rgba(4,173,238,.06) 0%, rgba(4,173,238,.02) 100%);
  border:1px solid rgba(var(--accent-rgb),.2);
  border-left:4px solid var(--accent);
  border-radius:var(--r-md);
  padding:1.75rem 2rem 1.5rem;
  margin:2rem 0;
}
.article-quotation p {
  font-size:clamp(1.05rem, 1.5vw, 1.15rem) !important;
  font-style:italic;
  color:var(--dark) !important;
  line-height:1.6 !important;
  margin-bottom:1.25rem !important;
  font-weight:500;
}
.article-quotation cite {
  display:flex; align-items:center; gap:.85rem;
  font-style:normal;
}
.quote-avatar {
  width:44px; height:44px;
  border-radius:50%;
  background:var(--accent);
  color:#fff;
  font-size:.85rem; font-weight:800;
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
  letter-spacing:.04em;
}
.quote-attribution {
  font-size:.85rem; color:var(--muted);
  line-height:1.45;
}
.quote-attribution strong { color:var(--dark); font-weight:700; display:block; font-size:.92rem; }

/* "About Anderman" boilerplate block */
.boilerplate-block {
  background:var(--light);
  border-radius:var(--r-md);
  padding:1.5rem 1.75rem;
  margin:1rem 0 0;
  border-left:3px solid var(--secondary);
}
.boilerplate-block p {
  font-size:.92rem !important;
  color:var(--muted) !important;
  line-height:1.7 !important;
  margin:0 !important;
}
.boilerplate-block a { color:var(--accent); font-weight:600; }

/* In-article press contact card */
.press-contact-block {
  background:#fff;
  border:2px solid var(--dark);
  border-radius:var(--r-md);
  padding:1.5rem 1.75rem;
  margin:2.5rem 0 1.5rem;
}
.press-contact-title {
  font-size:.7rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
  color:var(--accent);
  padding-bottom:.65rem; margin-bottom:.85rem;
  border-bottom:1px solid var(--border);
}
.press-contact-list { margin:0; }
.press-contact-row {
  display:grid;
  grid-template-columns:80px 1fr;
  gap:.75rem;
  padding:.4rem 0;
  font-size:.92rem;
}
.press-contact-row dt {
  font-weight:700; color:var(--secondary);
  font-size:.78rem;
  text-transform:uppercase;
  letter-spacing:.06em;
  align-self:center;
}
.press-contact-row dd { margin:0; color:var(--dark); }
.press-contact-row a { color:var(--accent); font-weight:600; }

/* Downloads block */
.downloads-block { margin:2rem 0 1rem; }
.downloads-title {
  font-size:.7rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--secondary);
  margin-bottom:.85rem;
}
.downloads-list {
  list-style:none; margin:0; padding:0;
  display:flex; flex-direction:column; gap:.6rem;
}
.download-item {
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:1rem;
  align-items:center;
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  padding:1rem 1.25rem;
  text-decoration:none;
  color:var(--dark);
  transition:all .25s var(--ease);
}
.download-item:hover {
  border-color:var(--accent);
  box-shadow:var(--shadow-card);
  transform:translateY(-1px);
  color:var(--dark);
}
.dl-icon {
  width:44px; height:44px;
  border-radius:var(--r-sm);
  background:rgba(var(--accent-rgb),.1);
  color:var(--accent);
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.dl-body { display:flex; flex-direction:column; gap:.2rem; min-width:0; }
.dl-body strong { font-size:.92rem; font-weight:700; color:var(--dark); }
.dl-body span { font-size:.78rem; color:var(--secondary); }
.dl-arrow {
  font-size:1.4rem; color:var(--accent); font-weight:700;
  transition:transform .2s var(--ease);
}
.download-item:hover .dl-arrow { transform:translateY(2px); }

/* Sidebar variants — press-release-specific */
.sidebar-recent--text a { grid-template-columns:1fr; }

.sidebar-press-kit {
  background:linear-gradient(135deg, var(--accent) 0%, var(--accent-dk) 100%);
  color:#fff;
  border:none;
  position:relative;
  overflow:hidden;
}
.sidebar-press-kit::before {
  content:'';
  position:absolute; right:-30px; top:-30px;
  width:120px; height:120px;
  border-radius:50%;
  background:rgba(255,255,255,.07);
  pointer-events:none;
}
.sidebar-press-kit-eyebrow {
  display:inline-block;
  font-size:.6rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
  color:rgba(255,255,255,.85);
  margin-bottom:.55rem;
  position:relative;
}
.sidebar-press-kit h3 {
  font-size:1.2rem; font-weight:700; color:#fff;
  margin-bottom:.55rem;
  position:relative;
}
.sidebar-press-kit p {
  font-size:.85rem; color:rgba(255,255,255,.85); line-height:1.55;
  margin-bottom:1rem;
  position:relative;
}
.sidebar-press-kit .btn-primary {
  background:#fff; color:var(--accent); border-color:#fff;
  position:relative;
}
.sidebar-press-kit .btn-primary:hover {
  background:var(--dark); color:#fff; border-color:var(--dark);
}
.press-kit-link {
  display:block;
  margin-top:.65rem;
  font-size:.78rem; font-weight:700;
  color:rgba(255,255,255,.85);
  text-decoration:underline;
  text-underline-offset:3px;
}
.press-kit-link:hover { color:#fff; }

.sidebar-press-contact { background:var(--light); border-color:transparent; }
.sidebar-press-contact .spc-name { font-size:1rem; color:var(--dark); margin:0 0 .15rem; }
.sidebar-press-contact .spc-role {
  font-size:.78rem; color:var(--muted);
  margin:0 0 .85rem;
}
.sidebar-press-contact .spc-link {
  margin:.2rem 0;
  font-size:.88rem;
}
.sidebar-press-contact .spc-link a {
  color:var(--accent); font-weight:600;
}


/* ============================================================
   Archive pages — filter bar, status tabs, pagination, cross-link
============================================================ */
.archive-bar-section { padding:1.75rem 0 1.25rem; background:#fff; border-bottom:1px solid var(--border); }
.archive-bar {
  display:flex; flex-wrap:wrap; gap:.85rem 1.25rem;
  align-items:center;
  background:var(--light-alt);
  border:1px solid var(--border);
  border-radius:var(--r-md);
  padding:.85rem 1.1rem;
}
.archive-bar .archive-search {
  display:flex; align-items:center; gap:.5rem;
  flex:1 1 240px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-pill);
  padding:.4rem .55rem .4rem .9rem;
  min-width:0;
  transition:border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.archive-bar .archive-search:focus-within {
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(var(--accent-rgb),.15);
}
.archive-bar .archive-search svg { color:var(--secondary); flex-shrink:0; }
.archive-bar .archive-search input {
  flex:1; height:2.2rem;
  border:none; outline:none; background:transparent;
  font-family:inherit; font-size:.9rem; color:var(--dark);
  min-width:0;
}
.archive-filter-group {
  display:inline-flex; align-items:center; flex-wrap:wrap;
  gap:.4rem;
  padding:.2rem 0;
}
.archive-filter-group .archive-filter-label {
  font-size:.65rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  color:var(--secondary);
  margin-right:.35rem;
}
.archive-bar .archive-sort {
  display:inline-flex; align-items:center; gap:.5rem;
  margin-left:auto;
}
.archive-bar .archive-sort select {
  height:2.4rem;
  padding:0 2rem 0 .85rem;
  border:1px solid var(--border);
  border-radius:var(--r-pill);
  background-color:#fff;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%2304adee' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right .85rem center;
  appearance:none;
  font-family:inherit; font-size:.85rem; font-weight:600; color:var(--dark);
  outline:none;
  cursor:pointer;
}
.archive-bar .archive-sort select:focus,
.archive-bar .archive-sort select:hover {
  border-color:var(--accent);
}
.archive-meta-row {
  display:flex; justify-content:space-between; align-items:center;
  margin-top:.85rem;
  padding:0 .25rem;
  font-size:.85rem; color:var(--muted);
}
.archive-meta-row strong { color:var(--dark); }

/* Status tabs (webinars, events) */
.archive-tabs-section { padding:1.5rem 0 0; background:#fff; }
.archive-tabs {
  display:flex; flex-wrap:wrap;
  gap:.4rem;
  border-bottom:2px solid var(--border);
  padding-bottom:.05rem;
}
.archive-tab {
  font-family:inherit;
  background:transparent;
  border:none;
  border-bottom:3px solid transparent;
  margin-bottom:-2px;
  padding:.85rem 1.25rem;
  font-size:.92rem; font-weight:700;
  color:var(--secondary);
  cursor:pointer;
  display:inline-flex; align-items:center; gap:.5rem;
  transition:color .2s var(--ease), border-color .2s var(--ease);
}
.archive-tab:hover { color:var(--dark); }
.archive-tab.is-active {
  color:var(--accent);
  border-bottom-color:var(--accent);
}
.archive-tab .tab-count {
  display:inline-block;
  font-size:.7rem; font-weight:700;
  padding:.15rem .45rem;
  background:var(--light);
  color:var(--secondary);
  border-radius:var(--r-pill);
}
.archive-tab.is-active .tab-count {
  background:rgba(var(--accent-rgb),.12);
  color:var(--accent);
}

/* Pagination */
.pagination {
  display:flex; align-items:center; justify-content:center;
  gap:.4rem;
  margin-top:3rem;
  flex-wrap:wrap;
}
.pagination-list {
  list-style:none; margin:0; padding:0;
  display:flex; gap:.3rem; align-items:center;
}
.pagination-page {
  display:inline-flex; align-items:center; justify-content:center;
  min-width:38px; height:38px;
  padding:0 .55rem;
  border:1px solid var(--border);
  border-radius:var(--r-sm);
  font-size:.88rem; font-weight:700;
  color:var(--dark);
  text-decoration:none;
  transition:all .2s var(--ease);
}
.pagination-page:hover { border-color:var(--accent); color:var(--accent); }
.pagination-page.is-current {
  background:var(--accent); color:#fff; border-color:var(--accent);
}
.pagination-arrow {
  font-size:.85rem; font-weight:700;
  color:var(--accent);
  text-decoration:none;
  padding:.55rem .85rem;
  border-radius:var(--r-sm);
  transition:background .2s var(--ease), color .2s var(--ease);
}
.pagination-arrow:hover { background:rgba(var(--accent-rgb),.08); }
.pagination-arrow--disabled {
  color:var(--secondary);
  pointer-events:none;
  opacity:.55;
}
.pagination-ellipsis {
  font-size:.95rem; color:var(--secondary);
  padding:0 .25rem;
  list-style:none;
}

/* Cross-link band — "Looking for something else?" */
.cross-link-band {
  background:var(--white);
  padding:3rem 0;
  border-top:1px solid var(--border);
}
.cross-link-band h2 {
  text-align:center;
  font-size:clamp(1.3rem, 2vw, 1.6rem);
  font-weight:700; color:var(--dark);
  margin-bottom:1.75rem;
  letter-spacing:-.005em;
}
.cross-links {
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1rem;
}
.cross-links a {
  display:flex; flex-direction:column; gap:.25rem;
  padding:1.25rem 1.5rem;
  background:var(--light-alt);
  border:1px solid var(--border);
  border-radius:var(--r-md);
  text-decoration:none;
  transition:all .25s var(--ease);
}
.cross-links a:hover {
  background:#fff; border-color:var(--accent);
  transform:translateY(-2px);
}
.cl-label {
  font-size:1rem; font-weight:700; color:var(--accent);
  display:flex; align-items:center; justify-content:space-between;
}
.cl-label::after { content:'→'; transition:transform .2s var(--ease); }
.cross-links a:hover .cl-label::after { transform:translateX(4px); }
.cl-sub {
  font-size:.8rem; color:var(--muted); line-height:1.4;
}

/* ============================================================
   News card — extends insight-card with read-time + author
============================================================ */
.news-grid {
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1.25rem;
}
.news-card {
  background:#fff;
  border-radius:var(--r-md);
  border:1px solid var(--border);
  overflow:hidden;
  display:flex; flex-direction:column;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
}
.news-card:hover { transform:translateY(-3px); box-shadow:var(--shadow-card-hover); }
.news-card[hidden] { display:none; }
.news-img {
  position:relative;
  aspect-ratio:16/10;
  background-size:cover; background-position:center;
}
.news-pin-badge {
  position:absolute; top:.85rem; left:.85rem;
  padding:.3rem .65rem;
  background:var(--accent); color:#fff;
  font-size:.62rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  border-radius:var(--r-pill);
  box-shadow:var(--shadow-sm);
}
.news-body {
  padding:1.25rem 1.4rem 1.4rem;
  display:flex; flex-direction:column; gap:.55rem;
  flex:1;
}
.news-meta-top {
  display:flex; justify-content:space-between; align-items:center;
  font-size:.7rem; font-weight:700; letter-spacing:.06em;
  margin-bottom:.15rem;
}
.news-tag { color:var(--accent); text-transform:uppercase; letter-spacing:.08em; }
.news-readtime {
  color:var(--secondary);
  background:var(--light-alt);
  padding:.18rem .55rem;
  border-radius:var(--r-pill);
  font-weight:700;
}
.news-card h3 {
  font-size:1.05rem; font-weight:700; color:var(--dark);
  line-height:1.35;
}
.news-card p {
  font-size:.88rem; color:var(--muted); line-height:1.6;
}
.news-meta-bottom {
  display:flex; justify-content:space-between; align-items:center;
  margin-top:auto;
  padding-top:.75rem;
  border-top:1px solid var(--border);
  font-size:.78rem; color:var(--secondary);
}
.news-meta-bottom strong { color:var(--dark); font-weight:600; }
.news-card .card-link { font-size:.85rem; font-weight:700; color:var(--accent); }

/* Featured news card spans 2 columns + horizontal layout */
.news-card--featured {
  grid-column:span 2;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0;
}
.news-card--featured .news-img { aspect-ratio:auto; min-height:100%; }
.news-card--featured .news-body { padding:1.75rem 2rem; }
.news-card--featured h3 { font-size:1.25rem; }

/* ============================================================
   Press list — single dense list, date-led
============================================================ */
.press-list {
  list-style:none;
  margin:0; padding:0;
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  overflow:hidden;
}
.press-item {
  display:grid;
  grid-template-columns:200px 1fr;
  gap:1.5rem;
  padding:1.5rem 1.75rem;
  border-bottom:1px solid var(--border);
  transition:background .2s var(--ease);
}
.press-item:last-child { border-bottom:none; }
.press-item:hover { background:rgba(var(--accent-rgb),.03); }
.press-item[hidden] { display:none; }
.press-date {
  display:flex; flex-direction:column; gap:.25rem;
}
.press-date time {
  font-size:.95rem; color:var(--dark); font-weight:600;
}
.press-date time strong {
  display:inline-block;
  font-size:1.5rem; font-weight:800;
  color:var(--accent);
  line-height:1;
  margin-right:.15rem;
}
.press-status {
  font-size:.62rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--secondary);
}
.press-body h3 {
  font-size:1.1rem; font-weight:700; color:var(--dark);
  line-height:1.35; margin-bottom:.45rem;
  letter-spacing:-.005em;
}
.press-body p {
  font-size:.9rem; color:var(--muted); line-height:1.6;
  margin-bottom:.85rem;
}
.press-actions {
  display:flex; flex-wrap:wrap; gap:1rem;
  font-size:.82rem;
}
.press-actions .card-link { font-weight:700; color:var(--accent); }
.press-actions .press-pdf {
  display:inline-flex; align-items:center; gap:.35rem;
  font-weight:700; color:var(--secondary);
  text-decoration:none;
  transition:color .2s var(--ease);
}
.press-actions .press-pdf::before {
  content:'⤓';
  font-weight:800;
}
.press-actions .press-pdf:hover { color:var(--accent); }

/* ============================================================
   Webinar grid + card variants
============================================================ */
.webinar-grid {
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1.25rem;
}
.webinar-grid .webinar-card[hidden] { display:none; }

.webinar-card {
  background:#fff;
  border:1px solid var(--border);
  border-top:3px solid #8e5fbf;
  border-radius:var(--r-md);
  overflow:hidden;
  display:flex; flex-direction:column;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
}
.webinar-card:hover { transform:translateY(-3px); box-shadow:var(--shadow-card-hover); }
.webinar-img {
  position:relative;
  aspect-ratio:16/9;
  background-size:cover; background-position:center;
}
.webinar-play {
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:56px; height:56px;
  background:rgba(255,255,255,.92);
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  color:var(--dark);
  font-size:1.4rem;
  padding-left:5px;
  box-shadow:var(--shadow-md);
  transition:transform .25s var(--ease);
}
.webinar-card:hover .webinar-play { transform:translate(-50%,-50%) scale(1.05); }
.webinar-body {
  padding:1.25rem 1.4rem 1.4rem;
  display:flex; flex-direction:column; gap:.55rem;
  flex:1;
}
.webinar-when {
  display:block;
  font-size:.85rem; color:var(--muted);
  margin-bottom:.1rem;
}
.webinar-when strong { color:var(--accent); font-weight:700; }
.webinar-card h3 {
  font-size:1.05rem; font-weight:700; color:var(--dark);
  line-height:1.35;
}
.webinar-card p { font-size:.88rem; color:var(--muted); line-height:1.6; }
.webinar-host {
  display:flex; align-items:center; gap:.55rem;
  margin-top:.25rem;
  padding:.6rem 0;
  border-top:1px dashed var(--border);
}
.webinar-host-avatar {
  width:32px; height:32px;
  border-radius:50%;
  background:rgba(var(--accent-rgb),.12);
  color:var(--accent);
  font-size:.7rem; font-weight:800;
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.webinar-host-meta { font-size:.78rem; color:var(--muted); line-height:1.4; }
.webinar-host-meta strong { color:var(--dark); font-weight:700; display:block; }
.webinar-meta {
  display:flex; justify-content:space-between; align-items:center;
  font-size:.78rem; color:var(--secondary);
  padding-bottom:.25rem;
}
.webinar-duration { font-weight:600; }
.add-to-cal {
  font-size:.78rem; font-weight:700; color:var(--accent);
  text-decoration:none;
}
.add-to-cal:hover { color:var(--accent-dk); }

/* ============================================================
   Event grid + card variants
============================================================ */
.event-grid {
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1.25rem;
}
.event-grid .event-card[hidden] { display:none; }

.event-card {
  background:#fff;
  border:1px solid var(--border);
  border-top:3px solid #27ae60;
  border-radius:var(--r-md);
  overflow:hidden;
  display:flex; flex-direction:column;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
}
.event-card:hover { transform:translateY(-3px); box-shadow:var(--shadow-card-hover); }
.event-img {
  position:relative;
  aspect-ratio:16/9;
  background-size:cover; background-position:center;
}
.event-body {
  padding:1.25rem 1.4rem 1.4rem;
  display:flex; flex-direction:column; gap:.55rem;
  flex:1;
}
.event-card .event-when {
  display:block;
  font-size:.92rem; color:var(--muted);
}
.event-card .event-when strong { color:var(--accent); font-weight:700; font-size:1rem; }
.event-card h3 {
  font-size:1.05rem; font-weight:700; color:var(--dark);
  line-height:1.35;
}
.event-card .event-where {
  display:block;
  font-size:.85rem; color:var(--secondary);
  font-weight:600;
}
.event-card p { font-size:.88rem; color:var(--muted); line-height:1.55; }
.event-stand {
  display:inline-flex; align-items:center;
  font-size:.78rem; color:var(--dark);
  background:rgba(var(--accent-rgb),.08);
  border:1px dashed rgba(var(--accent-rgb),.3);
  padding:.35rem .7rem;
  border-radius:var(--r-pill);
  align-self:flex-start;
}
.event-stand strong { color:var(--accent); font-weight:800; margin-left:.3rem; }
.event-meta { padding-bottom:.25rem; }


/* ============================================================
   Insights page — slim hero + section header row + tag colours
   + status badges + subscribe band + topic strip
============================================================ */
.slim-hero {
  margin-top:0;
  background:linear-gradient(135deg, var(--dark) 0%, #0a3a55 100%);
  padding:3rem 0 3.5rem;
  color:#fff;
  position:relative;
  overflow:hidden;
}
.slim-hero::before {
  content:'';
  position:absolute; inset:0;
  background:
    radial-gradient(circle at 80% 20%, rgba(4,173,238,.18), transparent 45%),
    radial-gradient(circle at 12% 110%, rgba(4,173,238,.12), transparent 45%);
  pointer-events:none;
}
.slim-hero-inner { position:relative; z-index:1; }
.slim-hero .eyebrow {
  display:inline-block; margin-bottom:.85rem;
  font-size:.7rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent);
  padding:.35rem .75rem;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.18);
  border-radius:var(--r-pill);
}
.slim-hero h1 {
  font-size:clamp(2rem, 4vw, 2.8rem);
  font-weight:700; line-height:1.1; letter-spacing:-.015em;
  margin-bottom:.65rem;
}
.slim-hero .lede {
  font-size:1.05rem;
  color:rgba(255,255,255,.75);
  max-width:520px;
  margin:0;
}

/* Section header row — title-holder on left, "Browse all" on right */
.section-header-row {
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  flex-wrap:wrap;
  gap:1rem 1.5rem;
  margin-bottom:2.5rem;
}
.section-header-row .title-holder { margin-bottom:0; flex:1 1 auto; min-width:0; }
.section-header-row .browse-all {
  display:inline-flex; align-items:center; gap:.3rem;
  font-size:.88rem; font-weight:700; color:var(--accent);
  text-decoration:none;
  padding:.4rem .65rem;
  border-radius:var(--r-sm);
  transition:all .2s var(--ease);
  flex-shrink:0;
}
.section-header-row .browse-all:hover {
  background:rgba(var(--accent-rgb),.08);
  color:var(--accent-dk);
}

/* Card-tag colour modifiers (semantic per content type) */
.card-tag.tag-press   { color:#b3700c; }
.card-tag.tag-webinar { color:#7a3fb3; }
.card-tag.tag-event   { color:#1f8e4f; }

/* Coloured left-border on insights-section variants — gives the eye a
   per-content-type cue without changing card silhouette */
.insights-section.section-press  .insight-card { border-top:3px solid #f39c12; }
.insights-section.section-webinar .insight-card { border-top:3px solid #8e5fbf; }
.insights-section.section-event  .insight-card { border-top:3px solid #27ae60; }

/* Status badge overlaid on card image (Webinar / Event) */
.status-badge {
  position:absolute;
  top:.85rem; left:.85rem;
  z-index:2;
  font-size:.62rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  padding:.32rem .65rem;
  border-radius:var(--r-pill);
  backdrop-filter:blur(6px);
  box-shadow:var(--shadow-sm);
}
.status-badge--upcoming {
  background:var(--accent); color:#fff;
}
.status-badge--past {
  background:rgba(255,255,255,.92); color:var(--dark);
}
/* The .insight-img holds the badge — needs to be the positioning context */
.insights-section .insight-img { position:relative; }

/* When/where metadata rows for webinars + events */
.event-when, .event-where {
  display:block;
  font-size:.8rem; color:var(--muted);
  margin-bottom:.25rem;
  line-height:1.5;
}
.event-when strong { color:var(--accent); font-weight:700; }
.event-where { color:var(--secondary); }

/* Card meta row (date · author) */
.card-meta {
  display:flex; gap:.85rem;
  margin-bottom:.6rem;
  font-size:.78rem; color:var(--secondary);
}
.card-meta time { font-weight:600; color:var(--dark); }

/* Subscribe band */
.subscribe-band {
  background:linear-gradient(135deg, rgba(4,173,238,.08) 0%, rgba(4,173,238,.03) 100%);
  border-top:1px solid rgba(var(--accent-rgb),.18);
  border-bottom:1px solid rgba(var(--accent-rgb),.18);
  padding:3rem 0;
}
.subscribe-row {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2.5rem;
  align-items:center;
}
.subscribe-text .eyebrow-light {
  display:inline-block; margin-bottom:.65rem;
  font-size:.7rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent);
}
.subscribe-text h2 {
  font-size:clamp(1.35rem, 2.2vw, 1.75rem);
  font-weight:700; line-height:1.25;
  color:var(--dark);
  margin-bottom:.6rem;
  letter-spacing:-.005em;
}
.subscribe-text p {
  font-size:.9rem; color:var(--muted); line-height:1.65;
  max-width:42ch;
}
.subscribe-form {
  display:flex; gap:.6rem;
  align-items:center;
}
.subscribe-form input {
  flex:1;
  height:3rem;
  padding:0 1.25rem;
  border:1px solid var(--border);
  border-radius:var(--r-pill);
  background:#fff;
  font-family:inherit; font-size:.95rem; color:var(--dark);
  outline:none;
  transition:border-color .2s var(--ease), box-shadow .2s var(--ease);
  min-width:0;
}
.subscribe-form input:focus {
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(var(--accent-rgb),.15);
}
.subscribe-form .btn { flex-shrink:0; height:3rem; }

/* Browse-by-topic strip */
.topic-browse { padding:5rem 0 4rem; }
.topic-row {
  display:flex; flex-wrap:wrap; align-items:center;
  gap:.4rem .55rem;
  padding:1rem 1.25rem;
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  margin-bottom:.75rem;
  font-size:.92rem;
}
.topic-row:last-child { margin-bottom:0; }
.topic-row .topic-label {
  font-size:.65rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--secondary);
  margin-right:.85rem;
  min-width:90px;
  flex-shrink:0;
}
.topic-row a {
  color:var(--dark); font-weight:600;
  padding:.15rem .25rem;
  border-radius:var(--r-sm);
  transition:color .2s var(--ease), background .2s var(--ease);
}
.topic-row a:hover { color:var(--accent); background:rgba(var(--accent-rgb),.08); }
.topic-row .topic-sep { color:var(--secondary); opacity:.5; }

/* ============================================================
   Applications page — applications grid + tiles
============================================================ */
.applications-grid {
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1.25rem;
}
.application-tile {
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  overflow:hidden;
  display:flex; flex-direction:column;
  text-decoration:none;
  color:var(--dark);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
}
.application-tile:hover {
  transform:translateY(-4px);
  box-shadow:var(--shadow-card-hover);
  border-color:var(--accent);
  color:var(--dark);
}
.app-tile-img {
  aspect-ratio:16/9;
  background-size:cover; background-position:center;
  position:relative;
}
.app-tile-img::after {
  content:'';
  position:absolute; inset:auto 0 0 0; height:50%;
  background:linear-gradient(to top, rgba(28,43,58,.45), transparent);
  pointer-events:none;
}
.app-tile-body {
  padding:1.4rem 1.4rem 1.25rem;
  display:flex; flex-direction:column; gap:.55rem;
  flex:1;
}
.app-tile-name {
  font-size:1.15rem; font-weight:700; color:var(--dark);
  line-height:1.3;
  letter-spacing:-.005em;
}
.app-tile-desc {
  font-size:.88rem; color:var(--muted); line-height:1.55;
  margin-bottom:.25rem;
}
.app-tile-chips {
  display:flex; flex-wrap:wrap; gap:.3rem;
}
.app-tile-chip {
  display:inline-block;
  font-size:.68rem; font-weight:700; letter-spacing:.04em;
  padding:.22rem .55rem;
  background:rgba(var(--accent-rgb),.08);
  color:var(--accent);
  border-radius:var(--r-pill);
}
.app-tile-meta {
  display:flex; justify-content:space-between; align-items:center;
  margin-top:auto;
  padding-top:.85rem;
  border-top:1px solid var(--border);
  font-size:.78rem; color:var(--secondary);
}
.app-tile-meta strong { color:var(--dark); font-weight:700; }
.app-tile-arrow {
  color:var(--accent); font-weight:700; font-size:1.1rem;
  transition:transform .25s var(--ease);
}
.application-tile:hover .app-tile-arrow { transform:translateX(4px); }

/* ============================================================
   Applications page — advisory band
============================================================ */
.advisory-band {
  display:grid;
  grid-template-columns:1fr 1.25fr;
  gap:2.5rem;
  align-items:center;
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  padding:2.5rem;
  box-shadow:var(--shadow-card);
}
.advisory-text h2 {
  font-size:clamp(1.3rem, 2vw, 1.6rem);
  font-weight:700; line-height:1.25;
  color:var(--dark);
  margin-bottom:.75rem;
  letter-spacing:-.005em;
}
.advisory-text p {
  font-size:.95rem; color:var(--muted); line-height:1.7;
  max-width:42ch;
}
.advisory-actions {
  display:flex; flex-direction:column; gap:.6rem;
}
.advisory-link {
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:.4rem 1rem;
  padding:1rem 1.25rem;
  background:var(--light-alt);
  border:1px solid var(--border);
  border-radius:var(--r-sm);
  text-decoration:none;
  transition:all .25s var(--ease);
}
.advisory-link:hover {
  background:#fff;
  border-color:var(--accent);
  transform:translateX(3px);
}
.advisory-link-label {
  grid-column:1;
  font-size:.95rem; font-weight:700; color:var(--dark);
}
.advisory-link-sub {
  grid-column:1;
  grid-row:2;
  font-size:.78rem; color:var(--muted);
}
.advisory-link-arrow {
  grid-column:2; grid-row:1 / 3;
  align-self:center;
  font-size:1.4rem;
  color:var(--accent);
  font-weight:700;
}
.advisory-link-primary {
  background:var(--accent);
  border-color:var(--accent);
}
.advisory-link-primary .advisory-link-label,
.advisory-link-primary .advisory-link-arrow { color:#fff; }
.advisory-link-primary .advisory-link-sub { color:rgba(255,255,255,.8); }
.advisory-link-primary:hover {
  background:var(--accent-dk); border-color:var(--accent-dk);
}

/* ============================================================
   Industry-single: case studies 2-up
============================================================ */
.case-grid-2 {
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:1.5rem;
}

/* ============================================================
   Industry-single: material card with dual CTA
============================================================ */
.material-action {
  display:flex; flex-direction:column; gap:.35rem;
  margin-top:.85rem;
  padding-top:.75rem;
  border-top:1px dashed var(--border);
  font-size:.78rem;
}
.material-action .learn { color:var(--accent); font-weight:700; }
.material-action .browse a { color:var(--secondary); font-weight:600; transition:color .2s var(--ease); }
.material-action .browse a:hover { color:var(--accent); }

/* ============================================================
   Industry-single: related industries strip (bottom of page)
============================================================ */
.related-industries-section {
  padding:2rem 0 3rem;
  background:#fff;
  border-top:1px solid var(--border);
}
.related-industries-strip {
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center;
  gap:.55rem .85rem;
  font-size:.92rem;
  color:var(--muted);
  margin:0;
}
.related-industries-strip .ri-label {
  font-size:.7rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  color:var(--secondary);
  margin-right:.4rem;
}
.related-industries-strip a {
  color:var(--dark); font-weight:600;
  padding:.2rem .15rem;
  transition:color .2s var(--ease);
}
.related-industries-strip a:hover { color:var(--accent); }
.related-industries-strip .ri-sep { color:var(--secondary); opacity:.55; }
.related-industries-strip .ri-all { color:var(--accent); margin-left:.4rem; }

/* ============================================================
   Tabbed long-form prose (material page "About this material")
============================================================ */
.prose-tabs {
  display:grid;
  grid-template-columns: 280px 1fr;
  gap:2rem;
  align-items:start;
}
.prose-tabs-nav {
  list-style:none;
  position:sticky;
  top:calc(var(--header-h) + 1.5rem);
  display:flex; flex-direction:column;
  gap:.45rem;
}
.prose-tabs-nav li { margin:0; padding:0; }
.prose-tabs-nav button {
  width:100%;
  display:flex; align-items:center; gap:.7rem;
  padding:.95rem 1.15rem;
  background:#fff;
  border:1px solid var(--border);
  border-left:3px solid transparent;
  border-radius:var(--r-sm);
  font-family:inherit;
  font-size:.95rem; font-weight:600;
  color:var(--secondary);
  text-align:left;
  cursor:pointer;
  transition:all .25s var(--ease);
}
.prose-tabs-nav button:hover { color:var(--accent); border-color:var(--accent); }
.prose-tabs-nav button[aria-selected="true"] {
  color:var(--accent);
  border-left-color:var(--accent);
  background:#fff;
  box-shadow:var(--shadow-sm);
}
.prose-tabs-nav button .num {
  width:26px; height:26px; flex-shrink:0;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--light);
  color:var(--secondary);
  border-radius:50%;
  font-size:.72rem; font-weight:800;
  letter-spacing:0;
  transition:all .25s var(--ease);
}
.prose-tabs-nav button[aria-selected="true"] .num {
  background:var(--accent); color:#fff;
}

.prose-tabs-panes article {
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  padding:2.5rem 2.5rem 2.25rem;
  box-shadow:var(--shadow-card);
  min-height:340px;
}
.prose-tabs-panes article[hidden] { display:none; }
.prose-tabs-panes article.active { display:block; }
.prose-tabs-panes article .prose { max-width:none; }
.prose-tabs-panes article .prose h2:first-child { margin-top:0; }

/* ============================================================
   Grades comparison table (material page) + Specs table (product)
============================================================ */
.data-table-wrap {
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  overflow-x:auto;
  box-shadow:var(--shadow-card);
}
.data-table {
  width:100%;
  border-collapse:collapse;
  font-size:.88rem;
}
.data-table th, .data-table td {
  padding:.95rem 1.1rem;
  text-align:left;
  border-bottom:1px solid var(--border);
  white-space:nowrap;
}
.data-table th {
  background:var(--light-alt);
  font-size:.72rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase;
  color:var(--secondary);
  user-select:none;
  cursor:pointer;
  position:relative;
}
.data-table th.sortable::after {
  content:'⇅';
  margin-left:.4rem;
  opacity:.4;
  font-size:.85rem;
}
.data-table th.sort-asc::after { content:'↑'; opacity:1; color:var(--accent); }
.data-table th.sort-desc::after { content:'↓'; opacity:1; color:var(--accent); }
.data-table tr:last-child td { border-bottom:none; }
.data-table tr:hover td { background:rgba(var(--accent-rgb),.04); }
.data-table .grade-name { font-weight:700; color:var(--dark); }
.data-table .find-link {
  display:inline-flex; align-items:center; gap:.3rem;
  font-size:.8rem; font-weight:700; color:var(--accent);
}
.data-table .pill {
  display:inline-block; padding:.2rem .55rem;
  background:rgba(var(--accent-rgb),.1);
  color:var(--accent);
  font-size:.72rem; font-weight:700;
  border-radius:var(--r-pill);
}

/* ============================================================
   Variants grid (product page — table-of-SKUs alternative)
============================================================ */
.variants-grid {
  display:grid; grid-template-columns:repeat(3, 1fr); gap:1rem;
}
.variant-card {
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  padding:1.25rem;
  display:flex; flex-direction:column; gap:.55rem;
  transition:all .3s var(--ease);
}
.variant-card:hover { transform:translateY(-3px); border-color:var(--accent); box-shadow:var(--shadow-card); }
.variant-sku {
  font-family:'SFMono-Regular',Consolas,monospace;
  font-size:.78rem; color:var(--accent); font-weight:700;
  letter-spacing:.04em;
}
.variant-name { font-size:1rem; font-weight:700; color:var(--dark); }
.variant-spec {
  display:flex; flex-direction:column; gap:.25rem;
  font-size:.82rem; color:var(--muted);
  margin:.25rem 0 .5rem;
}
.variant-spec span { display:flex; justify-content:space-between; padding:.15rem 0; border-bottom:1px dashed var(--border); }
.variant-spec span:last-child { border-bottom:none; }
.variant-spec strong { color:var(--dark); font-weight:600; }
.variant-cta { font-size:.82rem; font-weight:700; color:var(--accent); margin-top:auto; }

/* ============================================================
   Product gallery + Lightbox
============================================================ */
.product-gallery {
  display:grid;
  grid-template-columns:repeat(5, 1fr);
  gap:.75rem;
}
.gallery-item {
  position:relative;
  aspect-ratio:1;
  background:var(--light-alt);
  border:1px solid var(--border);
  border-radius:var(--r-md);
  overflow:hidden;
  cursor:zoom-in;
  padding:0;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.gallery-item:hover {
  transform:translateY(-2px);
  box-shadow:var(--shadow-card-hover);
  border-color:var(--accent);
}
.gallery-item img {
  width:100%; height:100%;
  object-fit:cover; object-position:center;
  display:block;
  transition:transform .55s var(--ease);
}
.gallery-item:hover img { transform:scale(1.06); }
.gallery-item::after {
  content:'';
  position:absolute; inset:auto 0 0 0;
  height:55%;
  background:linear-gradient(to top, rgba(28,43,58,.55), transparent);
  opacity:0;
  transition:opacity .3s var(--ease);
  pointer-events:none;
}
.gallery-item:hover::after { opacity:1; }
.gallery-item .zoom-icon {
  position:absolute; top:.6rem; right:.6rem;
  width:34px; height:34px;
  background:rgba(255,255,255,.92);
  color:var(--dark);
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  opacity:0;
  transform:scale(.85);
  transition:opacity .25s var(--ease), transform .25s var(--ease);
}
.gallery-item:hover .zoom-icon { opacity:1; transform:scale(1); }

/* Lightbox */
.lightbox {
  position:fixed; inset:0;
  z-index:300;
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none;
  transition:opacity .3s var(--ease);
}
.lightbox.open { opacity:1; pointer-events:auto; }
.lightbox-shade {
  position:absolute; inset:0;
  background:rgba(28,43,58,.92);
  backdrop-filter:blur(12px) saturate(140%);
  -webkit-backdrop-filter:blur(12px) saturate(140%);
}
.lightbox-stage {
  position:relative;
  z-index:1;
  max-width:min(1180px, 92vw);
  max-height:88vh;
  margin:0;
  display:flex; flex-direction:column; align-items:center;
  gap:.85rem;
}
.lightbox-stage img {
  max-width:100%;
  max-height:78vh;
  object-fit:contain;
  border-radius:var(--r-md);
  box-shadow:0 30px 80px rgba(0,0,0,.5);
  background:#0f1c2c;
}
.lightbox-stage figcaption {
  font-size:.88rem; color:rgba(255,255,255,.85);
  text-align:center;
  max-width:760px;
  line-height:1.55;
}

.lightbox-close, .lightbox-prev, .lightbox-next {
  position:absolute;
  z-index:2;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.28);
  color:#fff;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
  transition:all .25s var(--ease);
}
.lightbox-close { top:1.5rem; right:1.5rem; width:48px; height:48px; }
.lightbox-close:hover { background:rgba(255,255,255,.22); transform:rotate(90deg); }
.lightbox-prev, .lightbox-next { top:50%; width:54px; height:54px; transform:translateY(-50%); }
.lightbox-prev { left:1.5rem; }
.lightbox-next { right:1.5rem; }
.lightbox-prev:hover, .lightbox-next:hover {
  background:var(--accent); border-color:var(--accent);
}
.lightbox-counter {
  position:absolute; bottom:1.25rem; left:50%; transform:translateX(-50%);
  z-index:2;
  font-size:.75rem; font-weight:700; letter-spacing:.14em;
  color:rgba(255,255,255,.85);
  background:rgba(255,255,255,.1);
  padding:.4rem .85rem;
  border-radius:var(--r-pill);
  border:1px solid rgba(255,255,255,.18);
}

/* ============================================================
   Archive (materials.html, products.html) — controls + grid
============================================================ */
.archive-controls {
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  padding:1.25rem 1.5rem;
  margin-bottom:1.75rem;
  box-shadow:var(--shadow-sm);
  display:flex; flex-direction:column; gap:1rem;
}
.archive-search {
  display:flex; align-items:center; gap:.65rem;
  background:var(--light-alt);
  border:1px solid var(--border);
  border-radius:var(--r-pill);
  padding:.45rem .55rem .45rem 1rem;
  transition:border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.archive-search:focus-within {
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(var(--accent-rgb),.15);
  background:#fff;
}
.archive-search svg { color:var(--secondary); flex-shrink:0; }
.archive-search input {
  flex:1;
  height:2.5rem;
  background:transparent; border:none; outline:none;
  font-family:inherit; font-size:.95rem; color:var(--dark);
}

.archive-filter-row {
  display:flex; flex-wrap:wrap; align-items:center; gap:.5rem;
}
.archive-filter-label {
  font-size:.7rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  color:var(--secondary);
  margin-right:.25rem;
}
.filter-chip {
  font-family:inherit;
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.45rem .85rem;
  background:var(--light-alt);
  border:1px solid var(--border);
  border-radius:var(--r-pill);
  font-size:.82rem; font-weight:600;
  color:var(--dark);
  cursor:pointer;
  transition:all .2s var(--ease);
}
.filter-chip::before {
  content:'';
  width:14px; height:14px; flex-shrink:0;
  border:2px solid var(--border);
  border-radius:50%;
  background:#fff;
  transition:all .2s var(--ease);
}
.filter-chip:hover { border-color:var(--accent); color:var(--accent); }
.filter-chip:hover::before { border-color:var(--accent); }
.filter-chip.active {
  background:var(--accent); color:#fff; border-color:var(--accent);
}
.filter-chip.active::before {
  background:#fff; border-color:#fff;
  box-shadow:inset 0 0 0 3px var(--accent);
}

.archive-meta {
  display:flex; justify-content:space-between; align-items:center; gap:1rem;
  padding-top:.5rem;
  border-top:1px dashed var(--border);
  font-size:.85rem; color:var(--muted);
}
.archive-meta strong { color:var(--dark); font-weight:700; }
.archive-reset {
  background:transparent; border:none;
  font-family:inherit; font-size:.82rem; font-weight:700;
  color:var(--accent); cursor:pointer;
  padding:.2rem .4rem;
  border-radius:var(--r-sm);
  transition:background .2s var(--ease);
}
.archive-reset:hover { background:rgba(var(--accent-rgb),.1); color:var(--accent-dk); }

.archive-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(240px, 1fr));
  gap:1rem;
}
.archive-grid .related-card { transition:opacity .25s var(--ease), transform .25s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease); }
.archive-grid .related-card[hidden] { display:none; }
.archive-empty {
  text-align:center;
  padding:3rem 1.5rem;
  background:#fff;
  border:1px dashed var(--border);
  border-radius:var(--r-md);
  color:var(--muted);
  font-size:.95rem;
}
.archive-empty a { color:var(--accent); font-weight:700; }

/* ============================================================
   Related-card variant: with image (used on product pages)
============================================================ */
.related-card.has-image {
  padding:0;
  overflow:hidden;
  display:flex; flex-direction:column;
  gap:0;
}
.related-card-img {
  display:block;
  width:100%;
  aspect-ratio:16/10;
  overflow:hidden;
  background:var(--light-alt);
}
.related-card-img img {
  width:100%; height:100%;
  object-fit:cover; object-position:center;
  display:block;
  transition:transform .5s var(--ease);
}
.related-card.has-image:hover .related-card-img img { transform:scale(1.05); }
.related-card-body {
  padding:1.1rem 1.25rem 1.25rem;
  display:flex; flex-direction:column; gap:.4rem;
}

/* ============================================================
   Services panel (Power Services home — 3-up icon cards)
============================================================ */
.services-panel { display:grid; grid-template-columns:repeat(3, 1fr); gap:1.5rem; }
.service-card {
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  padding:2rem 1.75rem;
  transition:all .35s var(--ease);
  display:flex; flex-direction:column;
}
.service-card:hover { transform:translateY(-4px); border-color:var(--accent); box-shadow:var(--shadow-card-hover); }
.service-icon {
  width:54px; height:54px;
  background:linear-gradient(135deg, rgba(4,173,238,.15), rgba(4,173,238,.05));
  color:var(--accent);
  border-radius:var(--r-md);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:1.25rem;
}
.service-icon svg { width:28px; height:28px; }
.service-card h3 { font-size:1.1rem; font-weight:700; color:var(--dark); margin-bottom:.55rem; }
.service-card p { font-size:.92rem; color:var(--muted); line-height:1.65; margin-bottom:1.1rem; }
.service-card .card-link { margin-top:auto; }

/* Power-services pending-input notice */
.tbc-notice {
  margin-top:1.5rem;
  padding:.85rem 1.1rem;
  background:rgba(255, 200, 87, .15);
  border:1px solid rgba(255, 200, 87, .5);
  border-radius:var(--r-sm);
  font-size:.82rem;
  color:#7a5800;
  display:flex; align-items:flex-start; gap:.6rem;
}
.tbc-notice svg { flex-shrink:0; margin-top:2px; color:#b37309; }

/* ============================================================
   Case study feature (single hero card)
============================================================ */
.case-feature {
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:0;
  background:#fff;
  border-radius:var(--r-md);
  overflow:hidden;
  box-shadow:var(--shadow-lg);
}
.case-feature-img {
  background-size:cover; background-position:center;
  min-height:340px;
  position:relative;
}
.case-feature-img::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(135deg, rgba(28,43,58,.5) 0%, rgba(4,173,238,.2) 100%);
}
.case-feature-body {
  padding:2.5rem 2.25rem;
  display:flex; flex-direction:column; justify-content:center;
}
.case-feature-body .card-tag { margin-bottom:.65rem; }
.case-feature-body h3 {
  font-size:clamp(1.2rem, 2vw, 1.5rem);
  font-weight:700; color:var(--dark);
  line-height:1.3; margin-bottom:.85rem;
}
.case-feature-body p { font-size:.95rem; color:var(--muted); line-height:1.7; margin-bottom:1.25rem; }
.case-feature-meta {
  display:flex; flex-wrap:wrap; gap:.5rem;
  margin-bottom:1.25rem;
}
.case-feature-meta span {
  font-size:.7rem; font-weight:700; letter-spacing:.06em;
  padding:.25rem .6rem;
  background:var(--light);
  color:var(--secondary);
  border-radius:var(--r-pill);
  text-transform:uppercase;
}

/* ============================================================
   Datasheet shortcut block
============================================================ */
.datasheet-block {
  display:flex; align-items:center; gap:1.5rem;
  padding:1.75rem 2rem;
  background:linear-gradient(135deg, var(--dark) 0%, #0a3a55 100%);
  color:#fff;
  border-radius:var(--r-md);
  box-shadow:var(--shadow-lg);
}
.datasheet-block .ds-icon {
  width:54px; height:54px; flex-shrink:0;
  background:rgba(4,173,238,.2);
  border-radius:var(--r-sm);
  display:flex; align-items:center; justify-content:center;
  color:var(--accent);
}
.datasheet-block .ds-icon svg { width:28px; height:28px; }
.datasheet-block .ds-text { flex:1; min-width:0; }
.datasheet-block h3 {
  font-size:1.1rem; font-weight:700; color:#fff; margin-bottom:.3rem;
}
.datasheet-block p {
  font-size:.9rem; color:rgba(255,255,255,.7); line-height:1.55;
}

/* ============================================================
   Contact CTA band (single-line CTA, used at end of sub-pages)
============================================================ */
.contact-cta-band {
  background:linear-gradient(135deg, var(--dark) 0%, #0a3a55 100%);
  color:#fff;
  padding:3rem 0;
  text-align:center;
}
.contact-cta-band h2 {
  font-size:clamp(1.4rem, 2.5vw, 1.8rem);
  font-weight:700; line-height:1.3;
  margin-bottom:1rem;
  max-width:720px;
  margin-left:auto; margin-right:auto;
}
.contact-cta-band p {
  font-size:1rem; color:rgba(255,255,255,.75);
  margin-bottom:1.5rem;
  max-width:560px;
  margin-left:auto; margin-right:auto;
}
.contact-cta-band .cta-row { display:flex; flex-wrap:wrap; justify-content:center; gap:.75rem 1rem; }

/* ============================================================
   Related grid (re-uses insight-card visual but lighter)
============================================================ */
.related-grid {
  display:grid; grid-template-columns:repeat(4, 1fr); gap:1rem;
}
.related-card {
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  padding:1.25rem;
  text-decoration:none;
  transition:all .3s var(--ease);
  display:flex; flex-direction:column; gap:.4rem;
}
.related-card:hover { transform:translateY(-3px); border-color:var(--accent); box-shadow:var(--shadow-card); }
.related-card .related-tag {
  font-size:.62rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
  color:var(--accent);
  margin-bottom:.2rem;
}
.related-card h4 {
  font-size:1rem; font-weight:700; color:var(--dark);
  line-height:1.35;
}
.related-card p { font-size:.82rem; color:var(--muted); line-height:1.55; }
.related-card .formula { font-size:.72rem; color:var(--accent); font-weight:600; }

/* ============================================================
   Sub-page contact (no map — simpler than home)
============================================================ */
.sub-contact {
  background:var(--light);
  padding:5rem 0;
}
.sub-contact .container { max-width:1080px; }
.sub-contact .two-col { gap:2.5rem; }

/* ============================================================
   ABOUT — OUR STORY (heritage hero, timeline, gallery, team teaser, today block)
============================================================ */

/* Heritage hero — split */
.heritage-hero-section {
  background:linear-gradient(180deg, #fbf9f5 0%, #fff 100%);
  padding:3.5rem 0 4rem;
}
.heritage-hero {
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:3rem;
  align-items:center;
}
.heritage-hero-text .eyebrow {
  display:inline-block;
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--accent);
  margin-bottom:1rem;
}
.heritage-hero-text h1 {
  font-size:clamp(2rem, 3.5vw, 3rem);
  line-height:1.1;
  margin:0 0 1.25rem;
  color:var(--dark);
  letter-spacing:-.01em;
}
.heritage-strapline {
  font-size:1.18rem;
  line-height:1.55;
  color:#3a3a3a;
  margin:0;
  max-width:46ch;
}
.heritage-hero-visual {
  position:relative;
  border-radius:6px;
  overflow:hidden;
  box-shadow:0 14px 40px rgba(20,20,20,.18);
}
.heritage-hero-visual img {
  width:100%;
  height:auto;
  aspect-ratio:5/4;
  object-fit:cover;
  display:block;
  filter:saturate(.85);
}
.heritage-hero-caption {
  position:absolute;
  left:0; right:0; bottom:0;
  padding:.7rem 1.1rem;
  background:linear-gradient(0deg, rgba(0,0,0,.7), rgba(0,0,0,0));
  color:#fff;
  font-size:.78rem;
  letter-spacing:.06em;
  text-transform:uppercase;
}

/* Lead paragraph */
.our-story-lead-section {
  padding:3.5rem 0 1.5rem;
}
.our-story-lead-section .container { max-width:840px; }
.our-story-lead {
  font-size:1.32rem;
  line-height:1.6;
  color:#1f1f1f;
  margin:0;
  font-weight:300;
  letter-spacing:-.005em;
  border-left:3px solid var(--accent);
  padding-left:1.4rem;
}

/* Vertical alternating timeline */
.milestone-timeline {
  list-style:none;
  margin:3rem 0 1rem;
  padding:0;
  position:relative;
  max-width:1100px;
  margin-left:auto;
  margin-right:auto;
}
.milestone-timeline::before {
  content:"";
  position:absolute;
  top:0; bottom:0;
  left:50%;
  transform:translateX(-50%);
  width:2px;
  background:linear-gradient(180deg, transparent 0, #d4cdb8 8%, #d4cdb8 92%, transparent 100%);
}
.milestone {
  position:relative;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2rem;
  margin-bottom:2.25rem;
  align-items:flex-start;
}
.milestone::before {
  content:"";
  position:absolute;
  left:50%;
  top:1.4rem;
  transform:translate(-50%, 0);
  width:14px; height:14px;
  border-radius:50%;
  background:#fff;
  border:3px solid var(--accent);
  z-index:2;
}
.milestone--present::before {
  background:var(--accent);
  box-shadow:0 0 0 6px rgba(var(--accent-rgb,233,109,67),.18);
}
.milestone-year {
  font-size:1.85rem;
  font-weight:700;
  color:var(--accent);
  letter-spacing:.02em;
  display:block;
}
.milestone--left .milestone-year {
  grid-column:1;
  text-align:right;
  padding-right:2.5rem;
  padding-top:.6rem;
}
.milestone--left .milestone-card {
  grid-column:2;
  margin-left:1.25rem;
}
.milestone--right .milestone-year {
  grid-column:2;
  text-align:left;
  padding-left:2.5rem;
  padding-top:.6rem;
  order:2;
}
.milestone--right .milestone-card {
  grid-column:1;
  margin-right:1.25rem;
  text-align:right;
}
.milestone-card {
  background:#fff;
  border:1px solid #ece8de;
  border-radius:6px;
  padding:1.1rem 1.3rem 1.2rem;
  box-shadow:0 4px 14px rgba(20,20,20,.04);
}
.milestone-card h3 {
  margin:0 0 .4rem;
  font-size:1.05rem;
  color:var(--dark);
}
.milestone-card p {
  margin:0;
  font-size:.92rem;
  line-height:1.55;
  color:#4a4a4a;
}
.milestone-card--with-image {
  padding:0;
  overflow:hidden;
}
.milestone-card--with-image .milestone-img {
  display:block;
  width:100%;
  height:140px;
  background-size:cover;
  background-position:center;
  filter:saturate(.85);
}
.milestone-card--with-image .milestone-card-body {
  padding:1rem 1.25rem 1.15rem;
}
.milestone--right .milestone-card--with-image {
  text-align:left;
}
.milestone-disclaimer {
  text-align:center;
  font-size:.82rem;
  color:#7a7a7a;
  font-style:italic;
  margin:2rem 0 0;
}

/* Long-form prose */
.our-story-prose {
  max-width:760px;
}
.our-story-prose h2 {
  font-size:1.45rem;
  margin:2.4rem 0 .9rem;
  color:var(--dark);
  letter-spacing:-.005em;
}
.our-story-prose h2:first-child { margin-top:0; }
.our-story-prose p {
  font-size:1.02rem;
  line-height:1.75;
  color:#2a2a2a;
  margin:0 0 1.1rem;
}

/* Heritage gallery 3-up */
.heritage-gallery {
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1.5rem;
  margin-top:2rem;
}
.heritage-gallery-item {
  margin:0;
  border-radius:6px;
  overflow:hidden;
  background:#fff;
  border:1px solid #ece8de;
  box-shadow:0 4px 14px rgba(20,20,20,.04);
}
.heritage-gallery-img {
  display:block;
  width:100%;
  aspect-ratio:4/3;
  background-size:cover;
  background-position:center;
  filter:saturate(.85);
}
.heritage-gallery-item figcaption {
  padding:.85rem 1.05rem 1rem;
  font-size:.86rem;
  line-height:1.55;
  color:#4a4a4a;
}
.heritage-gallery-item figcaption strong {
  color:var(--accent);
  margin-right:.35rem;
  font-weight:700;
  letter-spacing:.04em;
}

/* Team teaser — bridge to /about/our-team/ */
.team-teaser-grid {
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1.5rem;
  margin-top:2rem;
}
.team-teaser-card {
  background:#fff;
  border:1px solid #ece8de;
  border-radius:8px;
  padding:1.5rem 1.25rem 1.4rem;
  text-align:center;
  box-shadow:0 4px 14px rgba(20,20,20,.04);
}
.team-teaser-photo {
  display:block;
  width:96px;
  height:96px;
  border-radius:50%;
  overflow:hidden;
  margin:0 auto 1rem;
  background:#f4f0e6;
  border:3px solid #fff;
  box-shadow:0 0 0 1px #ece8de;
}
.team-teaser-photo img {
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.team-teaser-card strong {
  display:block;
  color:var(--dark);
  font-size:1rem;
  margin-bottom:.25rem;
}
.team-teaser-role {
  display:block;
  font-size:.85rem;
  color:#5a5a5a;
  letter-spacing:.02em;
}
.team-teaser-cta {
  text-align:center;
  margin-top:2rem;
}

/* Where we are today — compact ops summary */
.today-grid {
  list-style:none;
  margin:2rem 0 0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:1.25rem;
}
.today-item {
  background:#fbf9f5;
  border-radius:6px;
  padding:1.5rem 1.25rem 1.4rem;
  text-align:center;
  border:1px solid #ece8de;
}
.today-item-num {
  display:block;
  font-size:2.4rem;
  font-weight:800;
  color:var(--accent);
  letter-spacing:-.02em;
  line-height:1;
  margin-bottom:.55rem;
}
.today-item-lbl {
  display:block;
  font-size:.88rem;
  line-height:1.45;
  color:#3a3a3a;
}

/* ============================================================
   ABOUT — MISSION & VALUES
============================================================ */

/* Purpose hero — abstract, lighter than heritage hero */
.purpose-hero-section {
  background:linear-gradient(180deg, #f4f7f5 0%, #fff 100%);
  padding:3.5rem 0 4rem;
}
.purpose-hero {
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:3rem;
  align-items:center;
}
.purpose-hero-text .eyebrow {
  display:inline-block;
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--accent);
  margin-bottom:1rem;
}
.purpose-hero-text h1 {
  font-size:clamp(2.2rem, 4vw, 3.4rem);
  line-height:1.05;
  margin:0 0 1.25rem;
  color:var(--dark);
  letter-spacing:-.015em;
  font-weight:700;
}
.purpose-strapline {
  font-size:1.18rem;
  line-height:1.55;
  color:#3a3a3a;
  margin:0;
  max-width:48ch;
}
.purpose-hero-visual {
  position:relative;
  border-radius:6px;
  overflow:hidden;
  box-shadow:0 14px 40px rgba(20,20,20,.16);
}
.purpose-hero-img {
  display:block;
  width:100%;
  aspect-ratio:5/4;
  background-size:cover;
  background-position:center;
  filter:saturate(.7) brightness(1.02);
}

/* Mission statement — typographic moment */
.mission-statement-section {
  padding:5rem 0 4.5rem;
  text-align:center;
  background:#fff;
}
.mission-statement-eyebrow {
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--accent);
  margin:0 0 1.5rem;
}
.mission-statement {
  font-size:clamp(1.5rem, 2.4vw, 2.1rem);
  line-height:1.4;
  color:var(--dark);
  font-weight:300;
  letter-spacing:-.005em;
  max-width:920px;
  margin:0 auto;
  padding:0 1rem;
  border:none;
  font-style:normal;
  position:relative;
}
.mission-statement::before,
.mission-statement::after {
  content:"";
  display:block;
  width:48px;
  height:2px;
  background:var(--accent);
  margin:0 auto;
  opacity:.5;
}
.mission-statement::before { margin-bottom:1.5rem; }
.mission-statement::after { margin-top:1.5rem; }

/* Mission expanded prose */
.mission-prose {
  max-width:780px;
}
.mission-prose p {
  font-size:1.04rem;
  line-height:1.75;
  color:#2a2a2a;
  margin:0 0 1.2rem;
}
.mission-prose em {
  font-style:normal;
  font-weight:600;
  color:var(--dark);
  border-bottom:2px solid rgba(var(--accent-rgb,4,173,238), .35);
  padding-bottom:1px;
}

/* Values — 2-up grid of substantive cards */
.values-grid {
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:1.75rem;
  margin-top:2.5rem;
}
.value-card {
  background:#fff;
  border:1px solid #ece8de;
  border-radius:10px;
  padding:2rem 2rem 1.85rem;
  box-shadow:0 6px 18px rgba(20,20,20,.05);
  display:flex;
  flex-direction:column;
}
.value-card-icon {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:56px;
  height:56px;
  border-radius:50%;
  background:rgba(var(--accent-rgb,4,173,238), .1);
  color:var(--accent);
  margin-bottom:1.1rem;
}
.value-card-name {
  font-size:1.25rem;
  margin:0 0 .55rem;
  color:var(--dark);
  letter-spacing:-.005em;
}
.value-card-tagline {
  font-size:1rem;
  color:#3a3a3a;
  font-weight:500;
  margin:0 0 1.2rem;
  line-height:1.45;
}
.value-card-body p {
  margin:0 0 .85rem;
  font-size:.94rem;
  line-height:1.7;
  color:#3a3a3a;
}
.value-card-body p:last-child { margin-bottom:0; }
.value-card-quote {
  margin:1.5rem 0 0;
  padding:1rem 1.1rem 1rem 1.25rem;
  border-left:3px solid var(--accent);
  background:#fbf9f5;
  border-radius:0 6px 6px 0;
  font-size:.92rem;
  line-height:1.6;
  color:#2a2a2a;
}
.value-card-quote p {
  margin:0 0 .55rem;
  font-style:italic;
}
.value-card-quote cite {
  font-style:normal;
  font-size:.78rem;
  color:#5a5a5a;
  letter-spacing:.04em;
  text-transform:uppercase;
}

/* Vignettes — values in action */
.vignettes-grid {
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:1.5rem;
  margin-top:2rem;
}
.vignette {
  background:#fbf9f5;
  border-left:3px solid var(--accent);
  padding:1.4rem 1.5rem 1.5rem;
  border-radius:0 6px 6px 0;
}
.vignette-tag {
  display:inline-block;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--accent);
  margin-bottom:.7rem;
  background:#fff;
  padding:.3rem .7rem;
  border-radius:999px;
  border:1px solid rgba(var(--accent-rgb,4,173,238), .25);
}
.vignette p {
  margin:0;
  font-size:.96rem;
  line-height:1.7;
  color:#2a2a2a;
}

/* Sustainability block */
.sustainability-block {
  display:grid;
  grid-template-columns:1fr 1.4fr;
  gap:2.5rem;
  align-items:start;
  margin-top:2rem;
}
.sustainability-lead p {
  font-size:1.08rem;
  line-height:1.65;
  color:#2a2a2a;
  margin:0;
  padding-right:.5rem;
}
.sustainability-list {
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:1.25rem;
}
.sustainability-list li {
  display:grid;
  grid-template-columns:44px 1fr;
  gap:1rem;
  align-items:start;
  padding:1.1rem 1.25rem;
  background:#fff;
  border:1px solid #e6e9e7;
  border-radius:6px;
}
.sl-icon {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  background:#eef5ee;
  color:#3b8a4e;
  border-radius:50%;
  flex-shrink:0;
}
.sustainability-list h3 {
  margin:0 0 .35rem;
  font-size:1rem;
  color:var(--dark);
}
.sustainability-list p {
  margin:0;
  font-size:.92rem;
  line-height:1.6;
  color:#3a3a3a;
}

/* Careers hand-off */
.careers-handoff-section {
  padding:3.5rem 0;
  background:#fff;
}
.careers-handoff {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:2rem;
  padding:1.75rem 2rem;
  background:linear-gradient(135deg, #fbf9f5 0%, #f4f7f5 100%);
  border:1px solid #ece8de;
  border-radius:10px;
}
.careers-handoff-text h2 {
  font-size:1.35rem;
  margin:0 0 .4rem;
  color:var(--dark);
}
.careers-handoff-text p {
  margin:0;
  font-size:.96rem;
  line-height:1.6;
  color:#3a3a3a;
  max-width:62ch;
}

/* ============================================================
   ABOUT — OUR TEAM (team hero, filter bar, leadership, commercial, offices)
============================================================ */

/* Team hero — light, less weight than heritage/purpose */
.team-hero-section {
  background:linear-gradient(180deg, #f7f6f1 0%, #fff 100%);
  padding:3rem 0 3.5rem;
}
.team-hero {
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:3rem;
  align-items:center;
}
.team-hero-text .eyebrow {
  display:inline-block;
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--accent);
  margin-bottom:1rem;
}
.team-hero-text h1 {
  font-size:clamp(2rem, 3.4vw, 2.9rem);
  line-height:1.1;
  margin:0 0 1.1rem;
  color:var(--dark);
  letter-spacing:-.01em;
}
.team-hero-sub {
  font-size:1.12rem;
  line-height:1.55;
  color:#3a3a3a;
  margin:0;
  max-width:48ch;
}
.team-hero-visual {
  position:relative;
  border-radius:6px;
  overflow:hidden;
  box-shadow:0 12px 32px rgba(20,20,20,.14);
}
.team-hero-img {
  display:block;
  width:100%;
  aspect-ratio:5/4;
  background-size:cover;
  background-position:center;
  filter:saturate(.85);
}
.team-hero-caption {
  position:absolute;
  left:0; right:0; bottom:0;
  padding:.7rem 1.05rem;
  background:linear-gradient(0deg, rgba(0,0,0,.65), rgba(0,0,0,0));
  color:#fff;
  font-size:.76rem;
  letter-spacing:.06em;
  text-transform:uppercase;
}

/* Page intro */
.team-intro-section {
  padding:2.5rem 0 1rem;
}
.team-intro-section .container { max-width:840px; }
.team-intro {
  font-size:1.12rem;
  line-height:1.65;
  color:#2a2a2a;
  margin:0;
  border-left:3px solid var(--accent);
  padding-left:1.25rem;
}

/* Filter bar */
.team-filter-section {
  padding:1.5rem 0 0;
}
.team-filter-bar {
  display:flex;
  flex-wrap:wrap;
  gap:1.25rem 2rem;
  align-items:center;
  justify-content:center;
  padding:1rem 1.25rem;
  background:#fbf9f5;
  border:1px solid #ece8de;
  border-radius:8px;
}

/* Section header inside leadership / commercial */
.team-section-header {
  text-align:center;
  margin-bottom:2rem;
}
.team-section-header h2 {
  font-size:1.6rem;
  margin:0 0 .4rem;
  color:var(--dark);
  letter-spacing:-.005em;
}
.team-section-header p {
  margin:0;
  font-size:1rem;
  color:#5a5a5a;
}

/* Leadership grid — 3-up larger cards */
.leadership-grid {
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1.75rem;
  margin-top:.5rem;
}
.leadership-card {
  background:#fff;
  border:1px solid #ece8de;
  border-radius:10px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  box-shadow:0 6px 18px rgba(20,20,20,.05);
}
.leadership-photo {
  display:block;
  width:100%;
  aspect-ratio:2.5 / 3;
  background:#f4f0e6;
  overflow:hidden;
}
.leadership-photo img {
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  filter:saturate(.9);
}
.leadership-card-body {
  padding:1.4rem 1.5rem 1.5rem;
  display:flex;
  flex-direction:column;
  flex:1;
}
.leadership-card-body h3 {
  margin:0 0 .25rem;
  font-size:1.2rem;
  color:var(--dark);
  letter-spacing:-.005em;
}
.leadership-role {
  margin:0 0 .55rem;
  color:var(--accent);
  font-weight:600;
  font-size:.96rem;
}
.leadership-meta {
  margin:0 0 1rem;
  font-size:.8rem;
  color:#7a7a7a;
  letter-spacing:.04em;
  text-transform:uppercase;
  display:flex;
  gap:.5rem;
}
.leadership-meta span:nth-child(2) { color:#bcbcbc; }
.leadership-bio-short {
  margin:0 0 .85rem;
  font-size:.94rem;
  line-height:1.65;
  color:#2a2a2a;
}
.leadership-bio-toggle {
  background:none;
  border:none;
  color:var(--accent);
  font-size:.86rem;
  font-weight:600;
  letter-spacing:.02em;
  padding:.25rem 0;
  cursor:pointer;
  align-self:flex-start;
  text-decoration:underline;
  text-underline-offset:3px;
}
.leadership-bio-full {
  margin:.85rem 0 0;
  padding:.95rem 1.05rem 1rem;
  background:#fbf9f5;
  border-left:3px solid var(--accent);
  border-radius:0 6px 6px 0;
}
.leadership-bio-full p {
  margin:0 0 .7rem;
  font-size:.9rem;
  line-height:1.65;
  color:#3a3a3a;
}
.leadership-bio-full p:last-child { margin-bottom:0; }
.leadership-contact {
  margin-top:auto;
  padding-top:1rem;
  border-top:1px solid #f0ebde;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.6rem;
  font-size:.86rem;
}
.leadership-contact a:not(.leadership-linkedin) {
  color:#3a3a3a;
  word-break:break-all;
}
.leadership-linkedin {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:32px;
  height:32px;
  border-radius:6px;
  background:#0a66c2;
  color:#fff;
  flex-shrink:0;
}
.leadership-linkedin:hover { background:#084f97; }

/* Commercial grid — 4-up smaller, denser */
.commercial-grid {
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:1.25rem;
  margin-top:.5rem;
}
.commercial-card {
  background:#fff;
  border:1px solid #ece8de;
  border-radius:8px;
  padding:1.25rem 1.1rem 1.1rem;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  box-shadow:0 4px 14px rgba(20,20,20,.04);
}
.commercial-photo {
  display:block;
  width:88px;
  height:88px;
  border-radius:50%;
  overflow:hidden;
  margin-bottom:.85rem;
  background:#f4f0e6;
  border:3px solid #fff;
  box-shadow:0 0 0 1px #ece8de;
}
.commercial-photo img {
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.commercial-card strong {
  display:block;
  color:var(--dark);
  font-size:1rem;
  margin-bottom:.2rem;
}
.commercial-role {
  display:block;
  font-size:.84rem;
  color:var(--accent);
  font-weight:600;
  margin-bottom:.45rem;
}
.commercial-spec {
  display:block;
  font-size:.82rem;
  color:#5a5a5a;
  line-height:1.45;
  margin-bottom:1rem;
}
.commercial-contact-btn {
  margin-top:auto;
  background:transparent;
  border:1px solid var(--accent);
  color:var(--accent);
  font-size:.82rem;
  font-weight:600;
  letter-spacing:.02em;
  padding:.5rem .9rem;
  border-radius:999px;
  cursor:pointer;
  transition:background .15s, color .15s;
}
.commercial-contact-btn:hover {
  background:var(--accent);
  color:#fff;
}

/* Empty state */
.team-empty {
  margin-top:2rem;
  padding:1.5rem;
  background:#fbf9f5;
  border:1px dashed #d4cdb8;
  border-radius:8px;
  text-align:center;
  color:#5a5a5a;
}
.team-empty button {
  background:none;
  border:none;
  color:var(--accent);
  font-weight:600;
  cursor:pointer;
  text-decoration:underline;
  padding:0;
  font-size:inherit;
}

/* Office cards — 2-up with map at top, matching contact page treatment */
.offices-grid {
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:2rem;
  margin-top:1rem;
}
.office-card {
  background:#fff;
  border:1px solid #ece8de;
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 6px 18px rgba(20,20,20,.05);
  display:flex;
  flex-direction:column;
}
.office-card .office-map {
  order:-1;
  height:280px;
  background:#f4f0e6;
  border-bottom:1px solid #ece8de;
  z-index:1;
}
.office-card-header {
  padding:1.4rem 1.6rem 1rem;
}
.office-eyebrow {
  display:inline-block;
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--accent);
  margin-bottom:.5rem;
}
.office-card-header h3 {
  margin:0;
  font-size:1.2rem;
  color:var(--dark);
  letter-spacing:-.005em;
}
.office-card-body {
  padding:0 1.6rem 1.4rem;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1.5rem;
  align-items:start;
}
.office-address {
  font-style:normal;
  font-size:.95rem;
  line-height:1.65;
  color:#2a2a2a;
}
.office-meta {
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:.55rem;
  font-size:.88rem;
}
.office-meta li {
  display:grid;
  grid-template-columns:64px 1fr;
  gap:.6rem;
  align-items:baseline;
}
.office-meta strong {
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:#7a7a7a;
}
.office-meta a { color:var(--accent); }
.anderman-pin {
  width:36px;
  height:36px;
  border-radius:50% 50% 50% 0;
  background:var(--accent);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  transform:rotate(-45deg);
  box-shadow:0 4px 12px rgba(0,0,0,.25);
}
.anderman-pin span {
  transform:rotate(45deg);
  font-size:14px;
}

/* ============================================================
   ABOUT — CERTIFICATIONS (about-certs.html)
============================================================ */
.certs-hero-section {
  background:linear-gradient(180deg, #f6f7fa 0%, #fff 100%);
  padding:3rem 0 2.5rem;
}
.certs-hero {
  text-align:center;
  max-width:840px;
}
.certs-hero h1 {
  font-size:clamp(1.9rem, 3.2vw, 2.7rem);
  letter-spacing:-.005em;
  margin:.5rem 0 1rem;
  color:var(--dark);
}
.certs-hero-sub {
  font-size:1.08rem;
  line-height:1.6;
  color:#3a3a3a;
  margin:0 auto;
  max-width:64ch;
}

/* Compliance summary panel */
.certs-summary-section {
  padding:0 0 2rem;
}
.certs-summary {
  background:#fff;
  border:1px solid #ece8de;
  border-radius:10px;
  box-shadow:0 8px 24px rgba(20,20,20,.06);
  padding:1.75rem 2rem;
  margin-top:-1.5rem;
  position:relative;
  z-index:2;
}
.certs-summary-header {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  margin-bottom:1.1rem;
}
.certs-summary-eyebrow {
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--accent);
  margin-bottom:.4rem;
}
.certs-summary-header h2 {
  margin:0;
  font-size:1.3rem;
  color:var(--dark);
}
.certs-summary-list {
  list-style:none;
  padding:0;
  margin:0 0 1.25rem;
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:.85rem;
}
.certs-summary-list li {
  display:flex;
  flex-direction:column;
  gap:.2rem;
  padding:.85rem 1rem;
  background:#fbf9f5;
  border-radius:6px;
  border:1px solid #ece8de;
}
.certs-tick {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:24px;
  height:24px;
  border-radius:50%;
  background:#1f8a4d;
  color:#fff;
  margin-bottom:.25rem;
}
.certs-summary-list strong {
  color:var(--dark);
  font-size:.96rem;
}
.certs-summary-meta {
  font-size:.78rem;
  color:#5a5a5a;
}
.certs-summary-footer {
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:1rem;
  padding-top:1rem;
  border-top:1px solid #f0ebde;
}
.certs-summary-asof {
  font-size:.86rem;
  color:#5a5a5a;
}
.certs-summary-download {
  display:inline-flex;
  align-items:center;
  gap:.5rem;
}

/* Cert dedicated blocks */
.cert-block {
  background:#fff;
  border:1px solid #ece8de;
  border-radius:10px;
  padding:2rem 2.25rem 1.85rem;
  margin-bottom:2rem;
  box-shadow:0 6px 18px rgba(20,20,20,.04);
}
.cert-block-head {
  display:grid;
  grid-template-columns:140px 1fr;
  gap:1.5rem;
  align-items:center;
  margin-bottom:1.2rem;
}
.cert-badge {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  width:140px;
  height:140px;
  border-radius:50%;
  background:linear-gradient(135deg, #1f4a7a 0%, #0d2c4d 100%);
  color:#fff;
  text-align:center;
  border:6px solid #fff;
  box-shadow:0 0 0 1px #ece8de, 0 8px 20px rgba(20,20,20,.12);
}
.cert-badge--cyber { background:linear-gradient(135deg, #1f8a4d 0%, #0a5a2c 100%); }
.cert-badge-line {
  font-size:.74rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-weight:600;
  opacity:.85;
}
.cert-badge-num {
  font-size:1.45rem;
  font-weight:800;
  letter-spacing:.04em;
  margin:.1rem 0;
}
.cert-block-title h2 {
  margin:0 0 .25rem;
  font-size:1.5rem;
  color:var(--dark);
  letter-spacing:-.005em;
}
.cert-block-subtitle {
  margin:0;
  font-size:1rem;
  color:#5a5a5a;
}

/* Cert meta */
.cert-meta {
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:1rem 1.5rem;
  margin:0 0 1.4rem;
  padding:1.1rem 1.25rem;
  background:#fbf9f5;
  border-radius:6px;
  border:1px solid #ece8de;
}
.cert-meta > div { display:flex; flex-direction:column; }
.cert-meta-wide { grid-column:1 / -1; }
.cert-meta dt {
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:#7a7a7a;
  margin-bottom:.25rem;
}
.cert-meta dd {
  margin:0;
  font-size:.95rem;
  color:#2a2a2a;
}

.cert-actions {
  display:flex;
  flex-wrap:wrap;
  gap:.85rem;
  margin-bottom:1.5rem;
}
.cert-actions .btn { display:inline-flex; align-items:center; gap:.5rem; }
.cert-actions .btn-text {
  background:none;
  border:none;
  color:var(--accent);
  padding:.5rem .25rem;
  font-weight:600;
  text-decoration:underline;
  text-underline-offset:3px;
}

.cert-explainer h3 {
  font-size:.84rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#7a7a7a;
  margin:0 0 .8rem;
  padding-top:1.2rem;
  border-top:1px solid #f0ebde;
}
.cert-explainer p {
  font-size:.95rem;
  line-height:1.7;
  color:#3a3a3a;
  margin:0 0 .85rem;
}

/* Buyer-perspective grid */
.cert-buyer-grid {
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1.5rem;
  margin-top:2rem;
}
.cert-buyer-card {
  background:#fff;
  border:1px solid #ece8de;
  border-radius:8px;
  padding:1.5rem 1.5rem 1.4rem;
  box-shadow:0 4px 14px rgba(20,20,20,.04);
}
.cert-buyer-card h3 {
  margin:0 0 .85rem;
  font-size:1.1rem;
  color:var(--dark);
}
.cert-buyer-card p {
  margin:0;
  font-size:.94rem;
  line-height:1.7;
  color:#3a3a3a;
}

/* Industry memberships — compact 4-up centered cards */
.memberships-grid {
  list-style:none;
  margin:2rem 0 0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:1.25rem;
}
.membership-item {
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  background:#fff;
  border:1px solid #ece8de;
  border-radius:8px;
  padding:1.5rem 1.25rem 1.4rem;
  box-shadow:0 4px 14px rgba(20,20,20,.04);
}
.membership-logo {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:72px;
  height:72px;
  background:#fbf9f5;
  border-radius:50%;
  font-weight:800;
  font-size:.95rem;
  letter-spacing:.05em;
  color:var(--accent);
  border:1px solid #ece8de;
  margin-bottom:.85rem;
}
.membership-item strong {
  display:block;
  color:var(--dark);
  font-size:.96rem;
  line-height:1.35;
  margin-bottom:.4rem;
}
.membership-meta {
  display:block;
  font-size:.84rem;
  line-height:1.55;
  color:#5a5a5a;
}

/* Standards grid */
.standards-grid {
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:1.25rem;
  margin-top:2rem;
}
.standard-item {
  background:#fff;
  border-left:3px solid var(--accent);
  border-radius:0 6px 6px 0;
  padding:1.2rem 1.4rem 1.25rem;
  border-top:1px solid #ece8de;
  border-right:1px solid #ece8de;
  border-bottom:1px solid #ece8de;
}
.standard-item h3 {
  margin:0 0 .55rem;
  font-size:1.05rem;
  color:var(--dark);
}
.standard-item p {
  margin:0;
  font-size:.92rem;
  line-height:1.65;
  color:#3a3a3a;
}

/* Documentation request form */
.docs-request-form {
  background:#fbf9f5;
  border:1px solid #ece8de;
  border-radius:10px;
  padding:2rem 2.25rem 2rem;
  max-width:840px;
  margin:0 auto;
}
.docs-request-header {
  margin-bottom:1.5rem;
}
.docs-request-eyebrow {
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--accent);
  display:block;
  margin-bottom:.4rem;
}
.docs-request-header h2 {
  margin:0 0 .55rem;
  font-size:1.4rem;
  color:var(--dark);
}
.docs-request-header p {
  margin:0;
  font-size:.96rem;
  line-height:1.65;
  color:#3a3a3a;
}
.docs-request-grid {
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:1rem;
  margin-bottom:1rem;
}
.docs-request-footer {
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:1rem;
  margin-top:1.25rem;
}
.docs-request-note {
  font-size:.86rem;
  color:#5a5a5a;
}

/* Generic form-field component (used across pages) */
.form-field {
  display:flex;
  flex-direction:column;
  gap:.4rem;
}
.form-field--full { grid-column:1 / -1; }
.form-field > span {
  font-size:.86rem;
  font-weight:600;
  color:var(--dark);
}
.form-field em {
  font-style:normal;
  color:var(--accent);
  font-weight:600;
  margin-left:.15rem;
}
.form-field input[type="text"],
.form-field input[type="email"],
.form-field input[type="tel"],
.form-field input[type="url"],
.form-field input[type="date"],
.form-field input[type="file"],
.form-field select,
.form-field textarea {
  border:1px solid #d4cdb8;
  background:#fff;
  border-radius:6px;
  padding:.65rem .85rem;
  font:inherit;
  font-size:.95rem;
  color:#1a1a1a;
  width:100%;
  transition:border-color .15s, box-shadow .15s;
}
.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus {
  outline:none;
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(var(--accent-rgb,4,173,238), .18);
}
.form-field--checkbox {
  flex-direction:row;
  align-items:flex-start;
  gap:.65rem;
}
.form-field--checkbox input { margin-top:.2rem; }
.form-field--checkbox span { font-weight:400; font-size:.92rem; line-height:1.55; }

.hp-field {
  position:absolute;
  left:-10000px;
  width:1px;
  height:1px;
  overflow:hidden;
}

/* ============================================================
   ABOUT — CAREERS (about-careers.html)
============================================================ */
.careers-hero-section {
  background:linear-gradient(180deg, #f4f7f5 0%, #fff 100%);
  padding:3rem 0 3.5rem;
}
.careers-hero {
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:3rem;
  align-items:center;
}
.careers-hero-text h1 {
  font-size:clamp(2rem, 3.4vw, 2.9rem);
  margin:.5rem 0 1.1rem;
  color:var(--dark);
  letter-spacing:-.01em;
}
.careers-hero-sub {
  font-size:1.12rem;
  line-height:1.6;
  color:#3a3a3a;
  margin:0;
  max-width:48ch;
}
.careers-hero-visual {
  position:relative;
  border-radius:6px;
  overflow:hidden;
  box-shadow:0 12px 32px rgba(20,20,20,.14);
}
.careers-hero-img {
  display:block;
  width:100%;
  aspect-ratio:5/4;
  background-size:cover;
  background-position:center;
  filter:saturate(.88);
}

/* Why work here grid */
.careers-why-grid {
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:1.5rem;
  margin-top:2rem;
}
.careers-why-card {
  background:#fff;
  border:1px solid #ece8de;
  border-radius:8px;
  padding:1.5rem 1.6rem 1.5rem;
  display:grid;
  grid-template-columns:48px 1fr;
  gap:1rem;
  align-items:start;
  box-shadow:0 4px 14px rgba(20,20,20,.04);
}
.careers-why-icon {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:48px;
  height:48px;
  border-radius:50%;
  background:rgba(var(--accent-rgb,4,173,238), .1);
  color:var(--accent);
}
.careers-why-card h3 {
  margin:0 0 .55rem;
  font-size:1.1rem;
  color:var(--dark);
}
.careers-why-card p {
  margin:0;
  font-size:.94rem;
  line-height:1.7;
  color:#3a3a3a;
}

/* Careers filter bar */
.careers-filter-bar {
  display:flex;
  flex-wrap:wrap;
  gap:1.25rem 2rem;
  align-items:center;
  justify-content:center;
  padding:1rem 1.25rem;
  background:#fff;
  border:1px solid #ece8de;
  border-radius:8px;
  margin-bottom:1.5rem;
}

/* Careers list */
.careers-list {
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:1rem;
}
.career-item {
  background:#fff;
  border:1px solid #ece8de;
  border-radius:8px;
  padding:1.5rem 1.75rem 1.5rem;
  box-shadow:0 4px 14px rgba(20,20,20,.04);
  transition:border-color .15s, transform .15s;
}
.career-item:hover {
  border-color:var(--accent);
  transform:translateY(-1px);
}
.career-item-head {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:1rem;
  margin-bottom:.5rem;
}
.career-item h3 {
  margin:0;
  font-size:1.2rem;
  color:var(--dark);
}
.career-item h3 a { color:inherit; }
.career-tag {
  display:inline-block;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--accent);
  background:rgba(var(--accent-rgb,4,173,238), .1);
  padding:.3rem .7rem;
  border-radius:999px;
  flex-shrink:0;
}
.career-meta {
  margin:0 0 .65rem;
  font-size:.84rem;
  color:#5a5a5a;
  display:flex;
  flex-wrap:wrap;
  gap:.4rem;
}
.career-meta .dot { color:#bcbcbc; }
.career-summary {
  margin:0 0 .85rem;
  font-size:.96rem;
  line-height:1.65;
  color:#3a3a3a;
}
.career-link {
  font-size:.92rem;
  font-weight:600;
  color:var(--accent);
  text-decoration:none;
}

.careers-empty {
  margin-top:1rem;
  padding:1.5rem;
  background:#fbf9f5;
  border:1px dashed #d4cdb8;
  border-radius:8px;
  text-align:center;
}
.careers-empty p { margin:0; font-size:.95rem; line-height:1.65; color:#3a3a3a; }

/* Speculative form */
.speculative-form {
  background:#fbf9f5;
  border:1px solid #ece8de;
  border-radius:10px;
  padding:2rem 2.25rem 2rem;
  max-width:840px;
  margin:0 auto;
}
.speculative-form-header { margin-bottom:1.5rem; }
.speculative-eyebrow {
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--accent);
  display:block;
  margin-bottom:.4rem;
}
.speculative-form-header h2 {
  margin:0 0 .5rem;
  font-size:1.4rem;
  color:var(--dark);
}
.speculative-form-header p {
  margin:0;
  font-size:.96rem;
  line-height:1.65;
  color:#3a3a3a;
}
.speculative-grid {
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:1rem;
  margin-bottom:1rem;
}
.speculative-form-footer {
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:1rem;
  margin-top:1.25rem;
}
.speculative-note {
  font-size:.86rem;
  color:#5a5a5a;
}

/* Employee voices */
.employee-voices-grid {
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1.5rem;
  margin-top:2rem;
}
.employee-voice {
  background:#fff;
  border:1px solid #ece8de;
  border-radius:8px;
  padding:1.6rem 1.6rem 1.5rem;
  margin:0;
  display:flex;
  flex-direction:column;
  box-shadow:0 4px 14px rgba(20,20,20,.04);
}
.employee-voice p {
  margin:0 0 1.25rem;
  font-size:1rem;
  line-height:1.65;
  color:#1a1a1a;
  font-style:italic;
  position:relative;
  padding-left:1rem;
  border-left:3px solid var(--accent);
}
.employee-voice footer {
  display:flex;
  align-items:center;
  gap:.85rem;
  margin-top:auto;
  padding-top:1rem;
  border-top:1px solid #f0ebde;
}
.employee-voice-photo {
  display:block;
  width:48px;
  height:48px;
  border-radius:50%;
  overflow:hidden;
  background:#f4f0e6;
  flex-shrink:0;
}
.employee-voice-photo img {
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.employee-voice cite {
  font-style:normal;
  font-size:.86rem;
  color:#3a3a3a;
  line-height:1.4;
}
.employee-voice cite strong {
  display:block;
  color:var(--dark);
  font-size:.95rem;
  margin-bottom:.1rem;
}

/* Hiring process */
.hiring-steps {
  list-style:none;
  margin:2rem 0 0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:1.25rem;
}
.hiring-step {
  background:#fff;
  border:1px solid #ece8de;
  border-radius:8px;
  padding:1.4rem 1.4rem 1.3rem;
  display:flex;
  flex-direction:column;
  gap:.85rem;
}
.hiring-step-num {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  border-radius:50%;
  background:var(--accent);
  color:#fff;
  font-weight:700;
}
.hiring-step h3 {
  margin:0 0 .4rem;
  font-size:1rem;
  color:var(--dark);
}
.hiring-step p {
  margin:0;
  font-size:.9rem;
  line-height:1.6;
  color:#3a3a3a;
}

/* Office life grid */
.office-life-grid {
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  grid-template-rows:1fr 1fr;
  gap:1rem;
  margin-top:2rem;
  height:440px;
}
.office-life-item {
  background-size:cover;
  background-position:center;
  border-radius:6px;
  margin:0;
  filter:saturate(.85);
}
.office-life-item--lg {
  grid-row:1 / span 2;
  grid-column:1;
}

/* Careers / contact FAQ section width — markup uses the global .faq-item / .faq-list / .faq-plus pattern from styles-v2.css */
.careers-faq-section { max-width:820px; }
.careers-faq-section .container { max-width:820px; }

/* ============================================================
   CONTACT PAGE (contact.html)
============================================================ */
.contact-hero-section {
  background:linear-gradient(180deg, #fbf9f5 0%, #fff 100%);
  padding:3rem 0 1rem;
}
.contact-hero {
  text-align:center;
  max-width:840px;
}
.contact-hero h1 {
  font-size:clamp(1.9rem, 3.2vw, 2.7rem);
  margin:.5rem 0 1rem;
  color:var(--dark);
  letter-spacing:-.005em;
}
.contact-hero-sub {
  font-size:1.1rem;
  line-height:1.6;
  color:#3a3a3a;
  margin:0 auto;
  max-width:60ch;
}

/* Quick contact panel */
.contact-quick-section {
  padding:1.5rem 0 2rem;
}
.contact-quick-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1.5rem;
}
.contact-quick-card {
  background:#fff;
  border:1px solid #ece8de;
  border-radius:10px;
  padding:1.75rem 1.85rem 1.6rem;
  position:relative;
  box-shadow:0 6px 18px rgba(20,20,20,.05);
}
.contact-quick-flag {
  position:absolute;
  top:1.25rem;
  right:1.5rem;
  font-size:1.6rem;
  line-height:1;
}
.contact-quick-eyebrow {
  display:inline-block;
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--accent);
  margin-bottom:.85rem;
}
.contact-quick-address {
  font-style:normal;
  font-size:.96rem;
  line-height:1.65;
  color:#2a2a2a;
  margin:0 0 1rem;
}
.contact-quick-link {
  display:flex;
  align-items:center;
  gap:.65rem;
  font-size:1rem;
  font-weight:600;
  color:var(--dark);
  padding:.35rem 0;
  text-decoration:none;
}
.contact-quick-link:hover { color:var(--accent); }
.contact-quick-link svg { color:var(--accent); flex-shrink:0; }
.contact-quick-hours {
  font-size:.86rem;
  color:#5a5a5a;
  margin:.85rem 0 .85rem;
  padding-top:.85rem;
  border-top:1px solid #f0ebde;
}
.contact-quick-directions {
  font-size:.92rem;
  font-weight:600;
  color:var(--accent);
}

/* Contact form layout — uses the existing .contact-form / .form-row / .form-field
   pattern from styles-v2.css. Only the additions specific to this page below. */
.contact-form-layout {
  display:grid;
  grid-template-columns:1.6fr 1fr;
  gap:2.25rem;
  align-items:start;
}
.contact-form-header { margin-bottom:1.25rem; }
.contact-form-eyebrow {
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--accent);
  display:block;
  margin-bottom:.4rem;
}
.contact-form-header h2 {
  margin:0;
  font-size:1.5rem;
  color:var(--dark);
}

/* Enquiry-type radio pills */
.enquiry-type-grid {
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:.55rem;
}
.enquiry-type-pill {
  display:flex;
  align-items:center;
  gap:.65rem;
  padding:.65rem .85rem;
  background:#fbf9f5;
  border:1px solid var(--border, #e8e5dc);
  border-radius:var(--r-sm, 6px);
  font-size:.9rem;
  cursor:pointer;
  margin:0;
  transition:border-color .15s, background .15s;
}
.enquiry-type-pill:hover { border-color:var(--accent); }
.enquiry-type-pill input[type="radio"] {
  accent-color:var(--accent);
  width:auto !important;
  padding:0 !important;
  margin:0;
}
.enquiry-type-pill:has(input:checked) {
  background:rgba(var(--accent-rgb), .08);
  border-color:var(--accent);
}
.enquiry-type-pill:has(input:checked) span {
  color:var(--accent);
  font-weight:600;
}

/* Conditional sections — quiet, plain blocks */
.contact-form-conditional {
  margin:.5rem 0 1rem;
  padding-top:1rem;
  border-top:1px solid #f0ebde;
  animation:cf-conditional-in .22s ease-out;
}
@keyframes cf-conditional-in {
  from { opacity:0; transform:translateY(-4px); }
  to   { opacity:1; transform:translateY(0); }
}
.contact-form-conditional[hidden] { display:none; }
.cf-conditional-title {
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--accent);
  margin:0 0 .85rem;
}

.checkbox-grid {
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:.5rem .85rem;
  padding:.4rem 0;
  font-size:.9rem;
}
.checkbox-grid label {
  display:flex;
  align-items:center;
  gap:.55rem;
  font-weight:400;
  margin:0;
}
.checkbox-grid input { accent-color:var(--accent); }

.cf-subscribe {
  display:flex;
  align-items:flex-start;
  gap:.65rem;
  margin:0 0 1rem;
  font-size:.9rem;
  color:#3a3a3a;
  line-height:1.55;
}
.cf-subscribe input { margin-top:.2rem; accent-color:var(--accent); }

.contact-form-footer {
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:1rem;
  margin-top:1.25rem;
  padding-top:1.25rem;
  border-top:1px solid #f0ebde;
}
.contact-form-note {
  font-size:.84rem;
  color:#5a5a5a;
  max-width:46ch;
}

/* Contact form sidebar */
.contact-form-sidebar {
  background:#fbf9f5;
  border:1px solid #ece8de;
  border-radius:10px;
  padding:1.6rem 1.6rem 1.4rem;
  position:sticky;
  top:calc(var(--header-h, 84px) + 1rem);
}
.contact-form-sidebar h3 {
  margin:0 0 1rem;
  font-size:1.05rem;
  color:var(--dark);
}
.route-list {
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:.85rem;
}
.route-list li {
  padding:.85rem 0;
  border-bottom:1px solid #ece8de;
  font-size:.9rem;
  line-height:1.55;
}
.route-list li:last-child { border-bottom:none; }
.route-list strong {
  display:block;
  color:var(--dark);
  font-size:.92rem;
  margin-bottom:.2rem;
}
.route-list span {
  display:block;
  color:#3a3a3a;
}
.route-list em {
  font-style:normal;
  color:var(--accent);
  font-weight:600;
}

/* Contact map cards */
.contact-maps-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2rem;
  margin-top:1rem;
}
.contact-map-card {
  background:#fff;
  border:1px solid #ece8de;
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 6px 18px rgba(20,20,20,.05);
  display:flex;
  flex-direction:column;
}
.contact-map-card header {
  padding:1.4rem 1.6rem 1rem;
}
.contact-map-card h3 {
  margin:0;
  font-size:1.2rem;
  color:var(--dark);
}
.contact-map-card .office-map {
  height:280px;
  z-index:1;
}
.contact-map-meta {
  padding:1.25rem 1.6rem 1.4rem;
}
.contact-map-meta address {
  font-style:normal;
  font-size:.94rem;
  line-height:1.6;
  color:#2a2a2a;
  margin:0 0 .85rem;
}
.contact-map-meta p {
  margin:0 0 .55rem;
  font-size:.88rem;
  line-height:1.6;
  color:#3a3a3a;
}
.contact-map-meta em { color:#5a5a5a; }
.map-card-link {
  display:inline-block;
  margin-top:.5rem;
  font-size:.88rem;
  font-weight:600;
  color:var(--accent);
}

/* Direct contacts */
.direct-contacts-block {
  max-width:840px;
  margin:0 auto;
  background:#fff;
  border:1px solid #ece8de;
  border-radius:10px;
  padding:1.85rem 2rem;
}
.direct-contacts-eyebrow {
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--accent);
  display:block;
  margin-bottom:.4rem;
}
.direct-contacts-block h2 {
  margin:0 0 .55rem;
  font-size:1.35rem;
  color:var(--dark);
}
.direct-contacts-block > header > p {
  margin:0 0 1.25rem;
  font-size:.96rem;
  color:#3a3a3a;
}
.direct-contacts-grid {
  list-style:none;
  margin:0 0 1rem;
  padding:0;
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:.85rem;
}
.direct-contacts-grid li {
  display:flex;
  flex-direction:column;
  gap:.2rem;
  padding:.85rem 1rem;
  background:#fbf9f5;
  border-radius:6px;
}
.direct-contacts-grid strong {
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:#7a7a7a;
}
.direct-contacts-grid a { color:var(--accent); font-weight:600; }
.direct-contacts-note {
  margin:.85rem 0 0;
  padding-top:.85rem;
  border-top:1px solid #f0ebde;
  font-size:.86rem;
  color:#5a5a5a;
}

/* Contact social */
.contact-social-section {
  padding:3.5rem 0;
}
.contact-social {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:2rem;
  padding:1.75rem 2rem;
  background:linear-gradient(135deg, #f4f7f5 0%, #fbf9f5 100%);
  border:1px solid #ece8de;
  border-radius:10px;
}
.contact-social-text h2 {
  margin:0 0 .35rem;
  font-size:1.3rem;
  color:var(--dark);
}
.contact-social-text p {
  margin:0;
  font-size:.95rem;
  color:#3a3a3a;
  max-width:60ch;
}
.contact-social-links {
  display:flex;
  gap:.75rem;
  flex-shrink:0;
}
.social-link {
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding:.65rem 1rem;
  border-radius:6px;
  font-weight:600;
  font-size:.92rem;
  background:#fff;
  border:1px solid #ece8de;
  color:var(--dark);
  text-decoration:none;
}
.social-link:hover { border-color:var(--accent); color:var(--accent); }
.social-link--linkedin svg { color:#0a66c2; }
.social-link--yt svg { color:#ff0000; }
.social-link--x svg { color:#000; }

/* ============================================================
   ABOUT — HUB (about.html)
============================================================ */
.about-hub-hero-section {
  background:linear-gradient(180deg, #fbf9f5 0%, #fff 100%);
  padding:3.5rem 0 4rem;
}
.about-hub-hero {
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:3rem;
  align-items:center;
}
.about-hub-hero-text h1 {
  font-size:clamp(2.2rem, 4vw, 3.4rem);
  margin:.5rem 0 1.25rem;
  color:var(--dark);
  letter-spacing:-.015em;
}
.about-hub-hero-lede {
  font-size:1.18rem;
  line-height:1.6;
  color:#2a2a2a;
  margin:0;
  max-width:50ch;
}
.about-hub-hero-visual {
  position:relative;
  border-radius:6px;
  overflow:hidden;
  box-shadow:0 14px 40px rgba(20,20,20,.16);
}
.about-hub-hero-img {
  display:block;
  width:100%;
  aspect-ratio:5/4;
  background-size:cover;
  background-position:center;
  filter:saturate(.85);
}

/* About subnav */
.about-subnav {
  border-top:1px solid #ece8de;
  border-bottom:1px solid #ece8de;
  background:#fff;
  position:sticky;
  top:var(--header-h, 84px);
  z-index:10;
}
.about-subnav-inner {
  display:flex;
  flex-wrap:wrap;
  gap:.25rem 1.75rem;
  padding:.65rem 0;
}
.about-subnav-link {
  font-size:.92rem;
  font-weight:600;
  color:#5a5a5a;
  padding:.55rem 0;
  text-decoration:none;
  border-bottom:2px solid transparent;
  transition:color .15s, border-color .15s;
}
.about-subnav-link:hover { color:var(--accent); }
.about-subnav-link.is-current {
  color:var(--accent);
  border-bottom-color:var(--accent);
}

/* About teaser — story (2-col) */
.about-teaser-story {
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:3rem;
  align-items:center;
}
.about-teaser-text p {
  font-size:1.02rem;
  line-height:1.75;
  color:#2a2a2a;
  margin:0 0 1rem;
}
.about-teaser-text .btn { margin-top:.5rem; }
.about-teaser-visual {
  position:relative;
  border-radius:6px;
  overflow:hidden;
  box-shadow:0 10px 28px rgba(20,20,20,.14);
}
.about-teaser-img {
  display:block;
  width:100%;
  aspect-ratio:4/3;
  background-size:cover;
  background-position:center;
  filter:saturate(.85);
}
.about-teaser-caption {
  position:absolute;
  left:0; right:0; bottom:0;
  padding:.65rem 1rem;
  background:linear-gradient(0deg, rgba(0,0,0,.65), rgba(0,0,0,0));
  color:#fff;
  font-size:.76rem;
  letter-spacing:.06em;
  text-transform:uppercase;
}

/* Mission teaser — pull quote */
.about-teaser-mission {
  text-align:center;
  max-width:920px;
}
.about-teaser-mission .st.center {
  display:inline-block;
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--accent);
  margin-bottom:1.5rem;
}
.about-teaser-quote {
  font-size:clamp(1.4rem, 2.2vw, 1.95rem);
  line-height:1.45;
  color:var(--dark);
  font-weight:300;
  letter-spacing:-.005em;
  margin:0 0 1.5rem;
  position:relative;
  padding:0 1rem;
}
.about-teaser-quote::before,
.about-teaser-quote::after {
  content:"";
  display:block;
  width:48px;
  height:2px;
  background:var(--accent);
  margin:0 auto;
  opacity:.5;
}
.about-teaser-quote::before { margin-bottom:1.5rem; }
.about-teaser-quote::after  { margin-top:1.5rem; }
.about-teaser-values {
  list-style:none;
  margin:0 0 2rem;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:.6rem;
  justify-content:center;
}
.about-teaser-values li {
  background:#fbf9f5;
  border:1px solid #ece8de;
  border-radius:999px;
  padding:.5rem 1rem;
  font-size:.92rem;
  color:#2a2a2a;
}
.about-teaser-cta {
  text-align:center;
  margin-top:2rem;
}

/* About — team teaser */
.about-team-teaser-grid {
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1.5rem;
  margin-top:1.5rem;
}
.about-team-card {
  background:#fff;
  border:1px solid #ece8de;
  border-radius:8px;
  padding:1.5rem 1.25rem 1.4rem;
  text-align:center;
  box-shadow:0 4px 14px rgba(20,20,20,.04);
}
.about-team-photo {
  display:block;
  width:96px;
  height:96px;
  border-radius:50%;
  overflow:hidden;
  margin:0 auto 1rem;
  background:#f4f0e6;
  border:3px solid #fff;
  box-shadow:0 0 0 1px #ece8de;
}
.about-team-photo img { width:100%; height:100%; object-fit:cover; display:block; }
.about-team-card strong {
  display:block;
  color:var(--dark);
  font-size:1rem;
  margin-bottom:.2rem;
}
.about-team-role {
  display:block;
  font-size:.85rem;
  color:#5a5a5a;
}

/* About — certs teaser */
.about-teaser-certs {
  display:grid;
  grid-template-columns:1fr 1.1fr;
  gap:3rem;
  align-items:center;
}
.about-teaser-certs p {
  font-size:1rem;
  line-height:1.7;
  color:#2a2a2a;
  margin:.5rem 0 1.25rem;
}
.about-certs-summary {
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:.85rem;
}
.about-certs-summary li {
  display:grid;
  grid-template-columns:32px 1fr auto;
  gap:.85rem;
  align-items:center;
  padding:1rem 1.25rem;
  background:#fff;
  border:1px solid #ece8de;
  border-radius:6px;
}
.about-certs-summary strong {
  color:var(--dark);
  font-size:1rem;
}
.about-certs-summary span:not(.certs-tick) {
  font-size:.86rem;
  color:#5a5a5a;
}

/* About — careers teaser */
.about-teaser-careers {
  display:grid;
  grid-template-columns:1.4fr 1fr;
  gap:3rem;
  align-items:center;
}
.about-teaser-careers-text p {
  font-size:1rem;
  line-height:1.7;
  color:#2a2a2a;
  margin:.5rem 0 0;
}
.about-teaser-careers-count {
  background:#fff;
  border:1px solid #ece8de;
  border-radius:10px;
  padding:1.85rem 2rem;
  text-align:center;
  box-shadow:0 4px 14px rgba(20,20,20,.04);
}
.about-teaser-careers-count strong {
  display:block;
  font-size:3rem;
  font-weight:800;
  color:var(--accent);
  letter-spacing:-.02em;
  line-height:1;
  margin-bottom:.4rem;
}
.about-teaser-careers-count > span {
  display:block;
  font-size:.86rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:#5a5a5a;
  margin-bottom:1.2rem;
}

/* Press / contact handoff */
.press-contact-row {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1.5rem;
}
.press-contact-block {
  padding:1.6rem 1.75rem 1.5rem;
  background:#fbf9f5;
  border:1px solid #ece8de;
  border-radius:10px;
}
.press-contact-block h3 {
  margin:0 0 .5rem;
  font-size:1.1rem;
  color:var(--dark);
}
.press-contact-block p {
  margin:0 0 1rem;
  font-size:.94rem;
  line-height:1.65;
  color:#3a3a3a;
}

/* ============================================================
   RESPONSIVE OVERRIDES for sub-page components
============================================================ */
@media (max-width:991px) {
  .intent-split { grid-template-columns:1fr; }
  .intent-types { grid-template-columns:repeat(2,1fr); }
  .props-strip { grid-template-columns:repeat(3,1fr); }
  .services-panel { grid-template-columns:1fr; }
  .variants-grid { grid-template-columns:repeat(2,1fr); }
  .related-grid { grid-template-columns:repeat(2,1fr); }
  .case-feature { grid-template-columns:1fr; }
  .case-feature-img { min-height:220px; }
  .product-gallery { grid-template-columns:repeat(3,1fr); }
  .lightbox-prev, .lightbox-next { width:44px; height:44px; }
  .lightbox-prev { left:.75rem; }
  .lightbox-next { right:.75rem; }

  .industry-grid { grid-template-columns:repeat(2, 1fr); }
  .applications-grid { grid-template-columns:repeat(2, 1fr); }
  .advisory-band { grid-template-columns:1fr; gap:1.5rem; padding:1.75rem; }
  .case-grid-2 { grid-template-columns:1fr; }
  .subscribe-row { grid-template-columns:1fr; gap:1.25rem; }
  .topic-row .topic-label { min-width:auto; flex-basis:100%; margin-right:0; margin-bottom:.25rem; }

  .news-grid { grid-template-columns:repeat(2, 1fr); }
  .webinar-grid { grid-template-columns:repeat(2, 1fr); }
  .event-grid { grid-template-columns:repeat(2, 1fr); }
  .cross-links { grid-template-columns:1fr; }

  /* Article: stack sidebar below */
  .article-layout { grid-template-columns:1fr; gap:3rem; }
  .article-sidebar { position:static; }
  .article-cta-row { grid-template-columns:1fr; gap:2rem; }
  .article-cta-row > .article-cta-talk::before { display:none; }
  .article-cta-talk { padding-top:2rem; border-top:1px solid var(--border); }
  .inline-ref-grid { grid-template-columns:1fr; }

  /* Webinar: stack sidebar below, smaller speaker grid, simpler player wrap */
  .webinar-layout { grid-template-columns:1fr; gap:2.5rem; }
  .webinar-sidebar { position:static; }
  .speakers-grid { grid-template-columns:1fr; }
  .followup-grid { grid-template-columns:repeat(2, 1fr); }
  .countdown-cells { gap:.5rem; }

  /* Event: stack sidebar below */
  .event-layout { grid-template-columns:1fr; gap:2.5rem; }
  .event-sidebar { position:static; top:auto; }
  .event-team-grid { grid-template-columns:1fr; }
  .event-quickbar-action--primary { margin-left:0; }

  .archive-bar .archive-sort { margin-left:0; }
  .matrix-finder { padding:1.25rem; }
  .matrix-finder .matrix-prefix { flex-basis:100%; text-align:center; }
  .matrix-finder .matrix-select { flex:1 1 calc(50% - .5rem); }
  .matrix-finder .btn { flex-basis:100%; }

  .prose-tabs { grid-template-columns:1fr; gap:1rem; }
  .prose-tabs-nav {
    position:static;
    flex-direction:row; flex-wrap:wrap;
    overflow-x:auto;
    margin:0 -.25rem 0;
  }
  .prose-tabs-nav li { flex:1 1 calc(50% - .9rem); min-width:0; }
  .prose-tabs-nav button {
    border-left:none;
    border-bottom:3px solid transparent;
    width:100%;
    padding:.7rem .9rem;
    font-size:.88rem;
    justify-content:flex-start;
  }
  .prose-tabs-nav button[aria-selected="true"] {
    border-left:none;
    border-bottom-color:var(--accent);
  }
  .prose-tabs-panes article { padding:1.5rem 1.5rem 1rem; }

  /* Our story — tablet */
  .heritage-hero { grid-template-columns:1fr; gap:2rem; }
  .heritage-gallery { grid-template-columns:repeat(2, 1fr); }
  .team-teaser-grid { grid-template-columns:repeat(3, 1fr); gap:1rem; }
  .today-grid { grid-template-columns:repeat(2, 1fr); }

  /* Mission — tablet */
  .purpose-hero { grid-template-columns:1fr; gap:2rem; }
  .values-grid { grid-template-columns:1fr; gap:1.25rem; }
  .vignettes-grid { grid-template-columns:1fr; gap:1.25rem; }
  .sustainability-block { grid-template-columns:1fr; gap:1.5rem; }
  .careers-handoff { flex-direction:column; align-items:flex-start; gap:1.25rem; padding:1.5rem 1.5rem; }

  /* Team — tablet */
  .team-hero { grid-template-columns:1fr; gap:2rem; }
  .leadership-grid { grid-template-columns:repeat(2, 1fr); }
  .commercial-grid { grid-template-columns:repeat(3, 1fr); }
  .offices-grid { grid-template-columns:1fr; gap:1.5rem; }
  .office-card-body { grid-template-columns:1fr; gap:1rem; }

  /* Certs — tablet */
  .certs-summary-list { grid-template-columns:1fr; }
  .cert-block-head { grid-template-columns:96px 1fr; gap:1rem; }
  .cert-badge { width:96px; height:96px; }
  .cert-badge-num { font-size:1.15rem; }
  .cert-meta { grid-template-columns:repeat(2, 1fr); }
  .cert-buyer-grid { grid-template-columns:1fr; gap:1rem; }
  .memberships-grid { grid-template-columns:1fr; }
  .standards-grid { grid-template-columns:1fr; }
  .docs-request-grid { grid-template-columns:1fr; }

  /* Careers — tablet */
  .careers-hero { grid-template-columns:1fr; gap:2rem; }
  .careers-why-grid { grid-template-columns:1fr; gap:1rem; }
  .speculative-grid { grid-template-columns:1fr; }
  .employee-voices-grid { grid-template-columns:1fr; gap:1.25rem; }
  .hiring-steps { grid-template-columns:repeat(2, 1fr); }
  .office-life-grid { grid-template-columns:1fr 1fr; grid-template-rows:repeat(3, 1fr); height:520px; }
  .office-life-item--lg { grid-row:1 / span 2; grid-column:1 / span 2; }

  /* Contact — tablet */
  .contact-form-layout { grid-template-columns:1fr; gap:1.5rem; }
  .contact-form-sidebar { position:static; }
  .contact-quick-grid { grid-template-columns:1fr; }
  .contact-maps-grid { grid-template-columns:1fr; }
  .direct-contacts-grid { grid-template-columns:1fr; }
  .enquiry-type-grid { grid-template-columns:1fr; }
  .contact-form-grid { grid-template-columns:1fr; }
  .checkbox-grid { grid-template-columns:1fr; }
  .contact-social { flex-direction:column; align-items:flex-start; gap:1.25rem; }

  /* About hub — tablet */
  .about-hub-hero { grid-template-columns:1fr; gap:2rem; }
  .about-teaser-story,
  .about-teaser-certs,
  .about-teaser-careers { grid-template-columns:1fr; gap:1.5rem; }
  .about-team-teaser-grid { grid-template-columns:repeat(3, 1fr); gap:1rem; }
  .press-contact-row { grid-template-columns:1fr; }
  .about-subnav { position:relative; top:auto; }
  .about-subnav-inner { gap:.25rem 1.25rem; overflow-x:auto; flex-wrap:nowrap; padding-bottom:.85rem; }

  /* 404 / search empty / category cross-tax — tablet (3-col → 2-col) */
  .notfound-routes { grid-template-columns:repeat(2, 1fr); gap:1.25rem; }
  .cross-tax-grid { grid-template-columns:repeat(2, 1fr); gap:1.25rem; }

  /* Author — tablet */
  .author-hero { grid-template-columns:1fr; gap:2rem; }
  .other-authors-grid { grid-template-columns:repeat(2, 1fr); gap:1rem; }

  /* Memberships — tablet */
  .memberships-grid { grid-template-columns:repeat(2, 1fr); gap:1rem; }
}
@media (max-width:640px) {
  .props-strip { grid-template-columns:repeat(2,1fr); }
  .variants-grid, .related-grid { grid-template-columns:1fr; }
  .data-table th, .data-table td { padding:.7rem .8rem; font-size:.82rem; }
  .datasheet-block { flex-direction:column; align-items:flex-start; padding:1.25rem 1.25rem; }
  .product-gallery { grid-template-columns:repeat(2,1fr); }
  .lightbox-close { top:.75rem; right:.75rem; width:40px; height:40px; }
  .lightbox-stage img { max-height:64vh; }

  .industry-grid { grid-template-columns:1fr; }
  .industry-tile { min-height:260px; }
  .compact-cta-row { flex-direction:column; align-items:flex-start; }
  .applications-grid { grid-template-columns:1fr; }

  .news-grid { grid-template-columns:1fr; }
  .webinar-grid, .event-grid { grid-template-columns:1fr; }
  .press-item { grid-template-columns:1fr; gap:.6rem; }
  .author-bio { grid-template-columns:1fr; gap:1rem; padding:1.25rem 1.25rem; }
  .author-bio-avatar { width:56px; height:56px; font-size:1.05rem; }

  /* Webinar small */
  .webinar-player-wrap { margin-top:-4rem; }
  .webinar-hero { padding:2.5rem 0 6rem; }
  .countdown-num { font-size:1.4rem; }
  .countdown-cell { padding:.85rem .55rem .7rem; }
  .followup-grid { grid-template-columns:1fr; }
  .agenda-list li { grid-template-columns:60px 1fr; gap:.6rem; }
  .gate-modal-card { padding:1.5rem 1.5rem 1.25rem; }

  /* Event small */
  .event-quickbar-inner { padding:.7rem 1rem; }
  .event-quickbar-action { font-size:.75rem; padding:.45rem .75rem; }
  .event-organiser-block { grid-template-columns:1fr; gap:.85rem; padding:1.25rem; }
  .event-organiser-logo { width:48px; height:48px; font-size:.95rem; }
  .qf-row { grid-template-columns:80px 1fr; }

  /* Our story — small */
  .heritage-hero-section { padding:2.5rem 0 3rem; }
  .heritage-hero-text h1 { font-size:1.7rem; }
  .heritage-strapline { font-size:1.02rem; }
  .our-story-lead { font-size:1.05rem; padding-left:1rem; }
  .our-story-lead-section { padding:2.5rem 0 1rem; }

  /* Mobile timeline: collapse to single column with year as accent */
  .milestone-timeline::before { left:14px; transform:none; }
  .milestone {
    grid-template-columns:1fr;
    gap:.4rem;
    padding-left:38px;
    margin-bottom:1.5rem;
  }
  .milestone::before {
    left:14px;
    top:.6rem;
  }
  .milestone--left .milestone-year,
  .milestone--right .milestone-year {
    grid-column:1;
    text-align:left;
    padding:0;
    font-size:1.4rem;
    order:0;
  }
  .milestone--left .milestone-card,
  .milestone--right .milestone-card {
    grid-column:1;
    margin:0;
    text-align:left;
  }
  .milestone--right .milestone-card--with-image { text-align:left; }
  .milestone-card--with-image .milestone-img { height:120px; }

  .our-story-prose h2 { font-size:1.2rem; }
  .our-story-prose p { font-size:.96rem; line-height:1.7; }

  .heritage-gallery { grid-template-columns:1fr; }
  .team-teaser-grid { grid-template-columns:1fr; gap:1rem; }
  .today-grid { grid-template-columns:1fr; gap:.85rem; }
  .today-item-num { font-size:2rem; }

  /* Mission — small */
  .purpose-hero-section { padding:2.5rem 0 3rem; }
  .purpose-hero-text h1 { font-size:1.85rem; }
  .purpose-strapline { font-size:1.02rem; }
  .mission-statement-section { padding:3rem 0 2.75rem; }
  .mission-statement { font-size:1.18rem; line-height:1.5; }
  .mission-prose p { font-size:.96rem; line-height:1.7; }
  .value-card { padding:1.5rem 1.4rem 1.4rem; }
  .value-card-name { font-size:1.1rem; }
  .vignette { padding:1.15rem 1.2rem 1.25rem; }
  .sustainability-list li { padding:.95rem 1.1rem; gap:.85rem; }
  .careers-handoff-text h2 { font-size:1.15rem; }

  /* Team — small */
  .team-hero-section { padding:2.25rem 0 2.5rem; }
  .team-hero-text h1 { font-size:1.7rem; }
  .team-hero-sub { font-size:.98rem; }
  .team-intro { font-size:1rem; padding-left:1rem; }
  .team-filter-bar { gap:.85rem; padding:.85rem 1rem; }
  .team-section-header h2 { font-size:1.3rem; }
  .leadership-grid { grid-template-columns:1fr; gap:1.25rem; }
  .commercial-grid { grid-template-columns:repeat(2, 1fr); gap:.85rem; }
  .commercial-card { padding:1.05rem .9rem .95rem; }
  .commercial-photo { width:72px; height:72px; }
  .office-card-header { padding:1.15rem 1.25rem .85rem; }
  .office-card-body { padding:0 1.25rem 1.15rem; }
  .office-map { height:200px; }

  /* Certs — small */
  .certs-hero-section { padding:2.25rem 0 1.5rem; }
  .certs-summary { padding:1.25rem 1.25rem; }
  .cert-block { padding:1.5rem 1.4rem 1.4rem; }
  .cert-block-head { grid-template-columns:1fr; gap:.85rem; text-align:center; }
  .cert-badge { width:96px; height:96px; margin:0 auto; }
  .cert-meta { grid-template-columns:1fr; padding:1rem; }
  .cert-actions { flex-direction:column; align-items:stretch; }
  .docs-request-form,
  .speculative-form { padding:1.5rem 1.4rem; }
  .docs-request-footer,
  .speculative-form-footer { flex-direction:column; align-items:stretch; }

  /* Careers — small */
  .careers-hero-section { padding:2.25rem 0 2.5rem; }
  .careers-hero-text h1 { font-size:1.7rem; }
  .careers-hero-sub { font-size:1rem; }
  .career-item-head { flex-direction:column; align-items:flex-start; gap:.55rem; }
  .career-item { padding:1.25rem 1.25rem; }
  .hiring-steps { grid-template-columns:1fr; gap:1rem; }
  .office-life-grid { grid-template-columns:1fr; grid-template-rows:auto; height:auto; }
  .office-life-item { aspect-ratio:5/3; }
  .office-life-item--lg { grid-row:auto; grid-column:auto; aspect-ratio:5/3; }

  /* Contact — small */
  .contact-hero-section { padding:2.25rem 0 1rem; }
  .contact-hero h1 { font-size:1.7rem; }
  .contact-hero-sub { font-size:.98rem; }
  .contact-quick-card { padding:1.4rem 1.4rem 1.25rem; }
  .contact-form { padding:1.5rem 1.4rem; }
  .contact-form-conditional { padding:.95rem 1.05rem; }
  .contact-form-footer { flex-direction:column; align-items:stretch; }
  .contact-map-card .office-map { height:220px; }

  /* About hub — small */
  .about-hub-hero-section { padding:2.5rem 0 3rem; }
  .about-hub-hero-text h1 { font-size:1.85rem; }
  .about-hub-hero-lede { font-size:1.02rem; }
  .about-team-teaser-grid { grid-template-columns:1fr; gap:1rem; }
  .about-teaser-quote { font-size:1.18rem; line-height:1.5; }
  .about-teaser-careers-count { padding:1.4rem 1.5rem; }
  .about-teaser-careers-count strong { font-size:2.4rem; }

  /* 404 / search empty / category cross-tax — small (2-col → 1-col) */
  .notfound-routes { grid-template-columns:1fr; gap:.85rem; }
  .cross-tax-grid { grid-template-columns:1fr; gap:.85rem; }

  /* 404 migration callout — icon on top, text full width */
  .migration-callout { grid-template-columns:1fr; gap:.85rem; padding:1.4rem 1.4rem; }
  .migration-icon { margin:0 auto; }

  /* Author — small */
  .other-authors-grid { grid-template-columns:1fr; gap:.85rem; }

  /* Memberships — small */
  .memberships-grid { grid-template-columns:1fr; gap:.85rem; }
  .membership-item { padding:1.15rem 1.25rem; }

  /* Cert blocks — already covered above; nudge meta */
  .cert-buyer-grid { gap:.85rem; }
}

/* ============================================================
   GLOBAL MOBILE RULES — buttons 100% width / stack, left-align titles+pagination+text
============================================================ */
@media (max-width:640px) {
  /* All button rows stack and fill width */
  .cta-row,
  .contact-cta-band .cta-row,
  .careers-handoff,
  .cert-actions,
  .speculative-form-footer,
  .docs-request-footer,
  .contact-form-footer {
    flex-direction:column;
    align-items:stretch;
  }
  .cta-row .btn,
  .careers-handoff .btn,
  .cert-actions .btn,
  .speculative-form-footer .btn,
  .docs-request-footer .btn,
  .contact-form-footer .btn,
  .about-teaser-cta .btn,
  .about-teaser-careers-count .btn,
  .leadership-contact .btn,
  .team-teaser-cta .btn,
  .press-contact-block .btn,
  .nf-route-link.btn {
    width:100%;
    justify-content:center;
    text-align:center;
  }

  /* Centered title-holders left-align on small screens */
  .title-holder.center,
  .title-holder.center .tt,
  .title-holder.center .st,
  .team-section-header,
  .docs-request-header,
  .speculative-form-header,
  .contact-form-header,
  .careers-hero,
  .contact-hero,
  .certs-hero {
    text-align:left;
  }
  .title-holder.center .tb { margin-left:0; margin-right:auto; }

  /* Mission / pull-quote treatments stay centered for typographic effect, but lighter padding */
  .mission-statement,
  .about-teaser-quote {
    text-align:left;
    padding-left:0;
    padding-right:0;
  }
  .mission-statement::before,
  .mission-statement::after,
  .about-teaser-quote::before,
  .about-teaser-quote::after {
    margin-left:0;
    margin-right:auto;
  }
  .about-teaser-mission { text-align:left; }
  .about-teaser-mission .st.center,
  .about-teaser-values { justify-content:flex-start; }
  .about-teaser-values { text-align:left; }
  .mission-statement-section { text-align:left; }
  .careers-hero-section,
  .contact-hero-section,
  .certs-hero-section,
  .about-hub-hero-section,
  .heritage-hero-section,
  .purpose-hero-section,
  .team-hero-section { text-align:left; }
  .careers-hero-text,
  .contact-hero,
  .certs-hero,
  .about-hub-hero-text { text-align:left; }

  /* Pagination — left-align */
  .pagination {
    justify-content:flex-start;
    flex-wrap:wrap;
  }

  /* Stat bands — keep grids but left-align text inside */
  .about-stats .stat,
  .today-item,
  .archive-stats { text-align:left; }
  .archive-stats { justify-content:flex-start; }
}


/* ===== home-v3.css (nature-palette home overrides) ===== */
/* =============================================================
   home-v3.css  (blue palette / original Anderman-Site)
   v3 layout overrides on top of styles-v2.css + pages-v2.css.
   Load order: styles-v2.css → pages-v2.css → home-v3.css
   ============================================================= */


/* ---------- HERO (image-led, replaces looping video) ---------- */
.hero {
  position: relative;
  height: auto;
  min-height: 0;
  padding-bottom: 8rem;            /* headroom so the tiles can overlap */
  background-image:
    linear-gradient(135deg, rgba(255,255,255,.12) 0%, rgba(28,43,58,.18) 55%, rgba(28,43,58,.35) 100%),
    url('assets/img/backgrounds/iStock-2249188216.jpg');
  background-size: cover;
  background-position: center;
  background-color: var(--light);
}
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,.18);
  pointer-events: none;
  z-index: 0;
}
.hero-inner { position: relative; z-index: 1; }
.hero-poster {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; z-index: 0;
}
@media (max-width: 900px) {
  .hero { padding-bottom: 6rem; }
}


/* ---------- AUDIENCE TILES SECTION ---------- */
.audience-tiles {
  margin-top: 0;
  margin-bottom: -3rem;
  padding-top: 0;
  padding-bottom: 0;
  background: var(--white);
  position: relative;
  z-index: 2;
}


/* ---------- TILES GRID (3-up, col 3 stacks Products + Materials) ---------- */
.tiles-grid {
  position: relative;
  top: -4rem;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-auto-rows: 1fr;
  gap: 1.25rem;
}
.tile-ceramics, .tile-power { grid-row: span 2; }

/* Blue tile gradients (same as the original blue palette) */
.tile-ceramics .tile-bg {
  background-image:
    radial-gradient(circle at 70% 30%, rgba(4,173,238,.45), transparent 60%),
    linear-gradient(135deg, #243648, #1c2b3a);
}
.tile-power .tile-bg {
  background-image:
    radial-gradient(circle at 30% 80%, rgba(4,173,238,.4), transparent 60%),
    linear-gradient(135deg, #1c2b3a, #0f1c2c);
}
.tile-products .tile-bg {
  background-image:
    radial-gradient(circle at 80% 70%, rgba(4,173,238,.55), transparent 65%),
    linear-gradient(135deg, #243648, #0a3a55);
}
.tile-materials .tile-bg {
  background-image:
    radial-gradient(circle at 20% 30%, rgba(4,173,238,.4), transparent 60%),
    linear-gradient(135deg, #1c2b3a, #243648);
}

.tile { position: relative; min-height: 0; }
.tile .tile-body {
  align-self: flex-start;
  justify-content: flex-start;
  padding-bottom: 2rem;
}
.tile-products .tile-body,
.tile-materials .tile-body {
  padding-top: 1.1rem;
  padding-bottom: 1.6rem;
}

.tile-products .tile-body p,
.tile-materials .tile-body p {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-bottom: 0;
}

/* Arrow pinned to bottom-right corner of each tile */
.tile .tile-arrow {
  position: absolute;
  right: 1.25rem;
  bottom: 1rem;
  margin: 0;
}

@media (max-width: 900px) {
  .tiles-grid {
    grid-template-columns: 1fr;
    top: 0;
  }
  .tile-ceramics, .tile-power { grid-row: auto; }
}


/* ---------- ABOUT IMAGE ---------- */
.about-image { position: relative; z-index: 1; }
.about-image img {
  aspect-ratio: 4/5;
  object-fit: cover;
  object-position: center;
}
.about-image::after {
  content: "";
  position: absolute;
  inset: auto -10px -10px auto;
  width: 70%; height: 50%;
  background: linear-gradient(135deg, transparent 60%, rgba(var(--accent-rgb), .25) 100%);
  border-radius: var(--r-md);
  pointer-events: none;
  z-index: -1;
}


/* ---------- DECORATIVE SECTION BACKGROUNDS ---------- */
.deco-bg {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
.deco-bg::before {
  content: "";
  position: absolute; inset: 0;
  background-position: center;
  background-size: cover;
  opacity: .07;
  z-index: -1;
  filter: grayscale(.2) saturate(.85);
}
.deco-bg-products::before { background-image: url('assets/img/backgrounds/iStock-1491502075.jpg'); }
.deco-bg-industries::before { background-image: url('assets/img/backgrounds/iStock-1432814602.jpg'); opacity: .05; }


/* ---------- PRODUCT GRID (16 items, 4 cols) ---------- */
.product-grid { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1100px) { .product-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width:  720px) { .product-grid { grid-template-columns: repeat(2, 1fr); } }


/* ---------- MATERIALS GRID (12 items, 4 cols) ---------- */
.materials-grid { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1100px) { .materials-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width:  720px) { .materials-grid { grid-template-columns: repeat(2, 1fr); } }


/* ---------- VARIANT: materials-grid with background image ----------
   Add modifier class `materials-grid-photo` to .materials-grid.
   Each tile gets a photo behind a dark navy overlay so text stays legible. */
.materials-grid-photo .material-tile {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background-color: var(--dark);
  color: #fff;
}
.materials-grid-photo .material-tile::before {
  content: "";
  position: absolute; inset: 0;
  background-size: cover;
  background-position: center;
  z-index: -2;
}
.materials-grid-photo .material-tile::after {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(28,43,58,.35) 0%, rgba(28,43,58,.82) 100%);
  z-index: -1;
}
.materials-grid-photo .material-tile h3,
.materials-grid-photo .material-tile p,
.materials-grid-photo .material-tile .material-formula,
.materials-grid-photo .material-tile a { color: #fff; }
.materials-grid-photo .material-tile .material-formula {
  background: rgba(var(--accent-rgb), .22);
  border-color: rgba(var(--accent-rgb), .4);
  color: #fff;
}
.materials-grid-photo .material-tile:hover::after {
  background: linear-gradient(180deg, rgba(28,43,58,.25) 0%, rgba(28,43,58,.72) 100%);
}

/* Make the whole material-tile clickable */
.materials-grid-photo .material-tile a {
  display: block;
  text-decoration: none;
  color: inherit;
  height: 100%;
}
.materials-grid-photo .material-tile a:hover { color: inherit; }

/* Photo assignment per material slug — drop a file into /assets/img/ named
   <slug>-hero.jpg (or .avif/.png) and it will appear automatically.
   alumina-hero.jpg already exists; the others are placeholders to be added. */
.materials-grid-photo .material-tile[data-mat="alumina-dense"]::before     { background-image: url('assets/img/alumina-hero.jpg'); }
.materials-grid-photo .material-tile[data-mat="alumina-porous"]::before    { background-image: url('assets/img/alumina-hero.jpg'); }
.materials-grid-photo .material-tile[data-mat="mullite"]::before           { background-image: url('assets/img/mullite-hero.jpg'); }
.materials-grid-photo .material-tile[data-mat="steatite"]::before          { background-image: url('assets/img/steatite-hero.jpg'); }
.materials-grid-photo .material-tile[data-mat="zirconia"]::before          { background-image: url('assets/img/zirconia-hero.jpg'); }
.materials-grid-photo .material-tile[data-mat="silicon-carbide"]::before   { background-image: url('assets/img/silicon-carbide-hero.jpg'); }
.materials-grid-photo .material-tile[data-mat="fused-silica"]::before      { background-image: url('assets/img/fused-silica-hero.jpg'); }
.materials-grid-photo .material-tile[data-mat="boron-nitride"]::before     { background-image: url('assets/img/boron-nitride-hero.jpg'); }
.materials-grid-photo .material-tile[data-mat="aluminium-nitride"]::before { background-image: url('assets/img/aluminium-nitride-hero.jpg'); }
.materials-grid-photo .material-tile[data-mat="quartz"]::before            { background-image: url('assets/img/quartz-hero.jpg'); }
.materials-grid-photo .material-tile[data-mat="aluminium-titanate"]::before{ background-image: url('assets/img/aluminium-titanate-hero.jpg'); }
.materials-grid-photo .material-tile[data-mat="cordierite"]::before        { background-image: url('assets/img/cordierite-hero.jpg'); }


/* ---------- VARIANT: condensed product-grid (hide product-desc) ----------
   Add modifier class `product-grid-condensed` to .product-grid.
   Hides the descriptive sub-text and tightens vertical padding so the
   list reads as a compact category index. */
.product-grid-condensed .product-desc { display: none; }
.product-grid-condensed .product-tile {
  padding-block: 1.25rem;
  gap: .5rem;
  min-height: auto;
  height: auto;
}


/* ---------- SEARCH-CATALOGUE CTA ---------- */
.product-search-cta {
  display: flex;
  justify-content: center;
  margin-top: 2rem;
}
.product-search-cta button {
  display: inline-flex;
  align-items: center;
  gap: .65rem;
  padding: .85rem 1.6rem;
  border-radius: var(--r-pill);
  background: var(--dark);
  color: #fff;
  border: 2px solid var(--accent);
  font-weight: 700;
  cursor: pointer;
  transition: all .2s var(--ease);
}
.product-search-cta button:hover {
  background: var(--accent);
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(var(--accent-rgb), .35);
}
.product-search-cta .ps-hint { font-weight: 500; opacity: .85; }


/* ---------- INSIGHT-CARD BACKGROUND IMAGES ---------- */
/* Override the gradient versions in styles-v2.css with the iStock photos */
.insight-img-1,
.insight-img-2,
.insight-img-3 {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.insight-img-1 {
  background-image:
    linear-gradient(135deg, rgba(28,43,58,.15), rgba(28,43,58,.05)),
    url('assets/img/backgrounds/iStock-1215208168.jpg');
}
.insight-img-2 {
  background-image:
    linear-gradient(135deg, rgba(28,43,58,.15), rgba(28,43,58,.05)),
    url('assets/img/backgrounds/iStock-1215208794.jpg');
}
.insight-img-3 {
  background-image:
    linear-gradient(135deg, rgba(28,43,58,.15), rgba(28,43,58,.05)),
    url('assets/img/backgrounds/iStock-1491502056.jpg');
}


/* ---------- CONTACT BLOCK ---------- */
.contact-grid { grid-template-columns: 0.8fr 1fr; }
@media (max-width: 900px) { .contact-grid { grid-template-columns: 1fr; } }

.contact-direct {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.25rem;
}
.contact-direct .contact-block:last-child { grid-column: 1 / -1; }
@media (max-width: 600px) {
  .contact-direct { grid-template-columns: 1fr; }
  .contact-direct .contact-block:last-child { grid-column: auto; }
}
.contact-block h3 {
  margin-bottom: .35rem;
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: .82rem;
}