/* ============================================================
   THAMANI ASSURANCE INC
   Design: Tailored Bay Digital
   Visual Direction: Nile Capital Re dark contrast + NCIB structure
   Palette: thamani-assurance.com teal system
   Fonts: Cormorant Garamond (display) + DM Sans (body)
   ============================================================ */

/* ── TOKENS ─────────────────────────────────────────────────── */
:root {
  /* Thamani brand — extracted from live site */
  --teal:       #157976;
  --teal-dark:  #0D4E4B;
  --teal-mid:   #18756E;
  --teal-glow:  #25B09E;
  --mint:       #D6F4F0;
  --mint-light: #EBF4F3;

  /* Nile Cap Re navy system for dark sections */
  --navy:       #0d1220;
  --navy-mid:   #131c2e;
  --navy-light: #1a2540;

  /* Neutrals */
  --white:      #ffffff;
  --off-white:  #f5f8f8;
  --bg:         #f0f5f5;
  --ink:        #0d1c1b;
  --muted:      #334040;
  --subtle:     #567070;
  --border:     #d4e0e0;
  --border-mid: #b8cccc;

  /* Typography */
  --display: 'Cormorant Garamond', Georgia, serif;
  --sans:    'DM Sans', system-ui, -apple-system, sans-serif;

  /* Layout */
  --max:   1280px;
  --gut:   clamp(20px, 4vw, 60px);
  --nav-h: 52px;

  /* Shadow */
  --sh:       0 4px 24px rgba(13,78,75,.10);
  --sh-md:    0 8px 40px rgba(13,78,75,.15);
  --sh-lg:    0 16px 64px rgba(13,78,75,.20);
  --sh-dark:  0 8px 40px rgba(13,18,32,.28);

  --r: 6px;
  --r-lg: 16px;
  --t: .3s;
  --ease: cubic-bezier(.4,0,.2,1);
}

/* ── RESET ─────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--sans);
  background: var(--white);
  color: var(--ink);
  overflow-x: hidden;
  font-size: clamp(15px, 1.05vw, 16px);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}
img  { display: block; max-width: 100%; height: auto; }
a    { text-decoration: none; color: inherit; }
ul   { list-style: none; }
button { font-family: var(--sans); cursor: pointer; border: none; background: none; }

/* ── LAYOUT ─────────────────────────────────────────────────── */
.container { max-width: var(--max); margin: 0 auto; padding: 0 var(--gut); }
.section-light { background: var(--off-white); }
.section-bg    { background: var(--bg); }
.section-white { background: var(--white); }
.section-navy  { background: var(--navy); color: var(--white); }
.section-teal  { background: var(--teal-dark); color: var(--white); }

/* ── EYEBROW + TITLES ───────────────────────────────────────── */
.eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: .72rem; font-weight: 700; letter-spacing: .18em;
  text-transform: uppercase; color: var(--teal-glow); margin-bottom: 14px;
}
.eyebrow::before { content: ''; display: block; width: 22px; height: 2px; background: var(--teal-glow); }
.eyebrow.on-dark { color: var(--teal-glow); }
.eyebrow.light { color: rgba(255,255,255,.55); }
.eyebrow.light::before { background: rgba(255,255,255,.35); }

.section-title {
  font-family: var(--display);
  font-size: clamp(2rem, 3.8vw, 3.4rem);
  font-weight: 400; line-height: 1.1;
  color: var(--ink); letter-spacing: -.01em;
}
.section-title.on-dark { color: var(--white); }
.section-title em { font-style: italic; color: var(--teal); }
.section-title.on-dark em { color: var(--teal-glow); }
.section-sub {
  font-size: clamp(.95rem, 1.1vw, 1.05rem);
  color: var(--muted); line-height: 1.8; max-width: 58ch;
}
.section-sub.on-dark { color: rgba(255,255,255,.62); }

/* ── BUTTONS ─────────────────────────────────────────────────── */
.btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 13px 28px; border-radius: var(--r);
  font-size: .9rem; font-weight: 600; font-family: var(--sans);
  border: 2px solid transparent; white-space: nowrap; cursor: pointer;
  transition: all var(--t) var(--ease);
}
.btn svg { width: 16px; height: 16px; flex-shrink: 0; }
.btn-primary { background: var(--teal-glow); color: #fff; border-color: var(--teal-glow); }
.btn-primary:hover { background: var(--teal); border-color: var(--teal); transform: translateY(-2px); box-shadow: 0 6px 20px rgba(37,176,158,.35); }
.btn-outline-w { background: transparent; color: #fff; border-color: rgba(255,255,255,.5); }
.btn-outline-w:hover { background: rgba(255,255,255,.1); border-color: #fff; }
.btn-outline { background: transparent; color: var(--teal); border-color: var(--teal); }
.btn-outline:hover { background: var(--teal); color: #fff; transform: translateY(-1px); }
.btn-sm { padding: 9px 20px; font-size: .83rem; }

/* ── REVEAL ─────────────────────────────────────────────────── */
.reveal { opacity: 0; transform: translateY(28px); transition: opacity .65s ease, transform .65s ease; }
.reveal.in-view { opacity: 1; transform: none; }

/* ═══════════════════════════════════════════════════════════
   HEADER
═══════════════════════════════════════════════════════════ */
#site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 900;
  height: var(--nav-h);
  background: rgba(13,18,32,.58);
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(255,255,255,.08);
  transition: background var(--t);
}
/* On hero pages, start transparent over dark */

.nav-inner { display: flex; align-items: center; height: 100%; padding: 0 calc(var(--gut)*0.5); gap: 0; }
.nav-logo img { height: 36px; width: auto; }

/* Hero-mode logo stays white */

.nav-links { display: flex; align-items: center; flex: 1; justify-content: center; gap: 2px; }
.nav-link {
  display: flex; align-items: center; gap: 4px;
  padding: 9px 14px; font-size: .88rem; font-weight: 500;
  color: rgba(255,255,255,.85); border-radius: var(--r);
  transition: color var(--t); position: relative;
}
.nav-link:hover, .nav-link.active { color: var(--teal-glow); }
/* active underline removed per design brief */
/* Hero mode nav links */

/* Dropdown caret */
.has-drop { position: relative; }
.has-drop > a .chevron { font-size: .78em; opacity: .5; transition: transform .2s; }
.has-drop.drop-open > a .chevron { transform: rotate(180deg); opacity: .8; }

/* Dropdown panel */
.nav-drop {
  display: none; position: absolute; top: calc(100% + 8px); left: 0;
  background: rgba(255,255,255,.97); backdrop-filter: blur(16px);
  border: 1px solid var(--border); border-radius: var(--r-lg);
  box-shadow: var(--sh-md); overflow: hidden; z-index: 500;
  min-width: 200px;
}
.has-drop.drop-open .nav-drop { display: block; }
.has-drop.drop-open .nav-drop-mega {
  display: flex !important;
  flex-direction: row;
}
.nav-drop-mega .nav-drop-group {
  flex: 1;
  padding: 14px 0;
  border-bottom: none;
}
.nav-drop-mega .nav-drop-group:not(:last-child) {
  border-right: 1px solid var(--border);
}

.nav-drop-group { padding: 10px 0; border-bottom: 1px solid var(--border); }
.nav-drop-group:last-child { border-bottom: none; }
.nav-drop-label {
  padding: 6px 18px; font-size: .68rem; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase; color: var(--teal-glow);
}
.nav-drop a {
  display: block; padding: 9px 18px; font-size: .87rem; font-weight: 500;
  color: var(--ink); transition: background var(--t), color var(--t);
}
.nav-drop a:hover { background: var(--mint-light); color: var(--teal); }

/* Header CTA */
.nav-cta {
  background: var(--teal); color: #fff;
  padding: 10px 22px; border-radius: var(--r);
  font-family: var(--sans); font-size: .87rem; font-weight: 600;
  cursor: pointer; transition: all var(--t); white-space: nowrap;
  margin-left: auto; margin-right: calc(var(--gut)*-0.25); flex-shrink: 0;
}
.nav-cta:hover { background: var(--teal-glow); transform: translateY(-1px); box-shadow: 0 4px 14px rgba(37,176,158,.35); }

.hamburger { display: none; flex-direction: column; gap: 5px; padding: 8px; cursor: pointer; }
.hamburger span { display: block; width: 22px; height: 2px; background: rgba(255,255,255,.85); border-radius: 1px; transition: all .3s; }
.hamburger.open span:nth-child(1) { transform: rotate(45deg) translate(5px,5px); }
.hamburger.open span:nth-child(2) { opacity: 0; }
.hamburger.open span:nth-child(3) { transform: rotate(-45deg) translate(5px,-5px); }

/* Mobile drawer — Nile Capital Re style */
#drawer-overlay { display: none; position: fixed; inset: 0; background: rgba(13,18,32,.45); z-index: 998; }
#drawer-overlay.open { display: block; }
#mobile-drawer {
  display: flex; position: fixed; top: 0; right: -100%; bottom: 0;
  width: 85%; max-width: 360px;
  background: rgba(13,18,32,.97); backdrop-filter: blur(18px); z-index: 999;
  transition: right .3s ease; flex-direction: column; overflow: hidden;
  box-shadow: -4px 0 24px rgba(13,18,32,.2);
}
#mobile-drawer.open { right: 0; }
.drawer-header {
  display: flex; align-items: center; justify-content: flex-end;
  padding: 0 20px; background: rgba(13,18,32,.08); backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(255,255,255,.08); min-height: var(--nav-h); flex-shrink: 0;
}
.drawer-header img { height: 32px; filter: brightness(0) invert(1); opacity: .22; }
.drawer-close {
  background: none; border: none; cursor: pointer; padding: 10px;
  color: rgba(255,255,255,.85); font-size: 22px; line-height: 1;
  transition: color var(--t);
}
.drawer-close:hover { color: var(--teal-glow); }
.drawer-body { flex: 1; overflow-y: auto; background: transparent; }
.drawer-item {
  display: flex; align-items: center;
  border-bottom: 1px solid rgba(255,255,255,.08);
  background: none;
}

/* Simple nav items (Home, Insights, Contact) */
a.drawer-item {
  padding: 16px 20px; font-size: .97rem; font-weight: 600;
  color: rgba(255,255,255,.85); width: 100%; font-family: var(--sans);
  transition: color var(--t); cursor: pointer;
}
a.drawer-item:hover { color: var(--teal-glow); }

/* Split row: link takes most of width, chevron button on right */
.drawer-row {
  display: flex; align-items: stretch;
  border-bottom: 1px solid rgba(255,255,255,.08);
  background: none; width: 100%;
}
.drawer-row-link {
  flex: 1; padding: 16px 20px; font-size: .97rem; font-weight: 600;
  color: rgba(255,255,255,.85); font-family: var(--sans);
  text-decoration: none; transition: color var(--t); cursor: pointer;
}
.drawer-row-link:hover { color: var(--teal-glow); }

.drawer-row .drawer-row-link { color: rgba(255,255,255,.85) !important; }

/* Chevron toggle button */
.drawer-chevron {
  display: flex; align-items: center; justify-content: center;
  width: 52px; flex-shrink: 0; background: none; border: none;
  border-left: 1px solid rgba(255,255,255,.08);
  cursor: pointer; color: rgba(255,255,255,.6);
  transition: color var(--t), background var(--t);
  padding: 0;
}
.drawer-chevron:hover { color: var(--teal-glow); background: rgba(255,255,255,.05); }
.drawer-chevron .chevron-icon {
  width: 18px; height: 18px;
  transition: transform .25s ease;
}
/* Rotate chevron when sub-menu is open */
.drawer-chevron.open .chevron-icon { transform: rotate(180deg); }
.drawer-item:hover { color: var(--teal-glow); }
.drawer-item a { width: 100%; color: inherit; }
.drawer-sub { display: none; background: rgba(255,255,255,.05); }
.drawer-sub.open { display: block; }
.drawer-sub-label {
  padding: 8px 20px; font-size: .68rem; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase; color: var(--teal-glow);
  border-bottom: 1px solid var(--border);
}
.drawer-sub a {
  display: block; padding: 12px 28px; font-size: .88rem; color: rgba(255,255,255,.65);
  border-bottom: 1px solid rgba(255,255,255,.08);
  transition: color var(--t);
}
.drawer-sub a:hover { color: var(--teal-glow); }
.drawer-footer { padding: 20px; border-top: 1px solid rgba(255,255,255,.1); flex-shrink: 0; }
.drawer-footer .btn { width: 100%; justify-content: center; }

/* ═══════════════════════════════════════════════════════════
   PAGE HERO (inner pages) — Nile Cap Re style
═══════════════════════════════════════════════════════════ */
.page-hero {
  background: var(--navy);
  padding: calc(var(--nav-h) + clamp(72px,9vw,120px)) 0 clamp(80px,10vw,140px);
  position: relative; overflow: hidden;
}
.page-hero-bg {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
  opacity: .22;
}
.page-hero::before {
  content: ''; position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(to right, rgba(13,18,32,.18) 0%, rgba(13,18,32,.06) 55%, transparent 80%);
}
.page-hero-watermark {
  position: absolute; right: -40px; top: 50%; transform: translateY(-50%);
  font-family: var(--display); font-size: clamp(8rem,15vw,16rem); font-weight: 600;
  color: rgba(255,255,255,.03); pointer-events: none; white-space: nowrap; line-height: 1; z-index: 1;
}
.page-hero-inner { position: relative; z-index: 2; }
.breadcrumb {
  display: flex; align-items: center; gap: 8px;
  font-size: .72rem; font-weight: 600; letter-spacing: .1em;
  text-transform: uppercase; color: rgba(255,255,255,.38); margin-bottom: 18px;
}
.breadcrumb a { color: rgba(255,255,255,.38); transition: color var(--t); }
.breadcrumb a:hover { color: var(--teal-glow); }
.breadcrumb span { color: rgba(255,255,255,.2); }
.page-hero h1 {
  font-family: var(--display); font-size: clamp(2.2rem,5vw,4.8rem);
  font-weight: 300; color: #fff; max-width: 18ch;
  margin-bottom: 16px; line-height: 1.08; letter-spacing: -.01em;
}
.page-hero h1 em { font-style: italic; color: var(--teal-glow); }
.page-hero .lead { text-shadow: 0 1px 8px rgba(13,18,32,.55);
  font-size: clamp(.95rem,1.2vw,1.1rem);
  color: rgba(255,255,255,.65); max-width: 56ch; line-height: 1.78;
}

/* ═══════════════════════════════════════════════════════════
   HOME HERO — multi-slide like Nile
═══════════════════════════════════════════════════════════ */
.hero {
  position: relative; height: 100vh; min-height: 640px;
  overflow: hidden; display: flex; align-items: center;
}
.hero-slides { position: absolute; inset: 0; }
.hero-slide {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
  opacity: 0; transition: opacity 1.2s ease;
}
.hero-slide.active { opacity: 1; }
.hero-slide-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to right, rgba(13,18,32,.88) 0%, rgba(13,18,32,.58) 50%, rgba(13,18,32,.22) 100%);
}
.hero-content {
  position: relative; z-index: 2; color: #fff;
  padding: var(--nav-h) var(--gut) 100px; max-width: var(--max); margin: 0 auto; width: 100%;
}
.hero-eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: .72rem; font-weight: 700; letter-spacing: .2em;
  text-transform: uppercase; color: var(--teal-glow); margin-bottom: 22px;
  opacity: 0; animation: fadeUp .8s ease .3s forwards;
}
.hero-eyebrow::before { content: ''; display: block; width: 26px; height: 2px; background: var(--teal-glow); }
.hero-title {
  font-family: var(--display); font-size: clamp(2.8rem,6vw,5.4rem);
  text-shadow: 0 2px 20px rgba(13,18,32,.7), 0 1px 4px rgba(13,18,32,.5);
  font-weight: 300; color: #fff; max-width: 680px; margin-bottom: 22px;
  line-height: 1.08; letter-spacing: -.01em;
  opacity: 0; animation: fadeUp .8s ease .5s forwards;
}
.hero-title em { font-style: italic; color: var(--teal-glow); }
.hero-sub {
  font-size: clamp(1rem,1.35vw,1.15rem); color: rgba(255,255,255,.75);
  text-shadow: 0 1px 8px rgba(13,18,32,.6);
  max-width: 520px; margin-bottom: 40px; line-height: 1.75;
  opacity: 0; animation: fadeUp .8s ease .7s forwards;
}
.hero-actions {
  display: flex; gap: 14px; flex-wrap: wrap;
  opacity: 0; animation: fadeUp .8s ease .9s forwards;
}
/* Hero credential strip */
.hero-creds {
  position: absolute; bottom: 0; left: 0; right: 0; z-index: 3;
  background: rgba(13,18,32,.75); backdrop-filter: blur(8px);
  border-top: 1px solid rgba(255,255,255,.08);
  padding: 16px var(--gut);
  display: flex; align-items: center; gap: 0; flex-wrap: wrap;
}
.hero-cred-item {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 24px; border-right: 1px solid rgba(255,255,255,.1);
  font-size: .75rem; font-weight: 700; letter-spacing: .1em;
  text-transform: uppercase; color: rgba(255,255,255,.55);
  transition: color var(--t);
}
.hero-cred-item:hover { color: var(--teal-glow); }
.hero-cred-item:last-child { border-right: none; }
.hero-cred-item span { color: var(--teal-glow); font-size: 1.1em; }
/* Hero progress bar */
.hero-progress { position: absolute; bottom: 0; left: 0; right: 0; height: 3px; background: rgba(255,255,255,.12); z-index: 4; }
.hero-progress-bar { height: 100%; background: var(--teal-glow); width: 0%; transition: width .1s linear; }
/* Hero thumbs */
.hero-thumbs {
  position: absolute; bottom: 80px; right: var(--gut); z-index: 3;
  display: flex; gap: 10px;
}
.thumb {
  position: relative; width: 76px; height: 52px;
  border: 2px solid rgba(255,255,255,.25); border-radius: 5px;
  overflow: hidden; cursor: pointer; background: none;
  transition: border-color var(--t);
}
.thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.thumb span {
  position: absolute; inset: 0; display: flex; align-items: flex-end;
  padding: 4px 5px; font-size: .52rem; font-weight: 700; color: #fff;
  background: linear-gradient(to top, rgba(0,0,0,.72), transparent);
  text-transform: uppercase; letter-spacing: .04em;
}
.thumb.active { border-color: var(--teal-glow); }
.thumb:hover { border-color: rgba(255,255,255,.7); }

@keyframes fadeUp { from{ opacity:0; transform:translateY(28px); } to{ opacity:1; transform:none; } }

/* ═══════════════════════════════════════════════════════════
   MARQUEE BANNER (Nile Cap Re style)
═══════════════════════════════════════════════════════════ */
.marquee-banner { background: var(--teal-dark); padding: 16px 0; overflow: hidden; white-space: nowrap; }
.marquee-track {
  display: inline-flex; align-items: center; gap: 28px;
  animation: marquee 28s linear infinite;
  font-family: var(--display); font-size: 1rem; font-weight: 400;
  letter-spacing: .04em; color: rgba(255,255,255,.75);
}
.marquee-track .dot { color: var(--teal-glow); font-size: .7em; margin: 0 4px; }
@keyframes marquee { from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* ═══════════════════════════════════════════════════════════
   WHY CHOOSE — dark box intro like Nile capabilities
═══════════════════════════════════════════════════════════ */
.why-intro-box {
  background: var(--navy); color: #fff;
  padding: 44px 40px; border-radius: 8px; position: relative;
}
.why-intro-box::before {
  content: ''; position: absolute; left: 0; top: 20%; bottom: 20%;
  width: 3px; background: var(--teal-glow); border-radius: 2px;
}
.why-intro-box h3 { font-family: var(--display); font-size: 1.6rem; color: #fff; margin-bottom: 12px; }
.why-intro-box p  { color: rgba(255,255,255,.62); font-size: .95rem; line-height: 1.78; margin-bottom: 24px; }

.why-pillars { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.pillar {
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1);
  border-radius: 8px; padding: 22px 20px;
  transition: background var(--t), border-color var(--t);
}
.pillar:hover { background: rgba(255,255,255,.1); border-color: rgba(37,176,158,.35); }
.pillar-icon {
  width: 38px; height: 38px; border-radius: 8px;
  background: rgba(37,176,158,.2); display: flex; align-items: center; justify-content: center;
  margin-bottom: 12px;
}
.pillar-icon svg { width: 18px; height: 18px; color: var(--teal-glow); }
.pillar h4 { font-family: var(--sans); font-size: .95rem; font-weight: 700; color: #0D1220; margin-bottom: 6px; }
.pillar p  { font-size: .84rem; color: #0D1220; line-height: 1.62; }

/* ═══════════════════════════════════════════════════════════
   STATS ROW
═══════════════════════════════════════════════════════════ */
.stats-row { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; background: var(--border); border-radius: var(--r-lg); overflow: hidden; }
.stat-cell { background: var(--white); padding: 28px 22px; transition: background var(--t); text-align: center; }
.stat-cell:hover { background: var(--mint-light); }
.stat-num { font-family: var(--display); font-size: clamp(34px,3.5vw,50px); font-weight: 400; color: var(--teal); line-height: 1; margin-bottom: 5px; letter-spacing: -.02em; text-align: center; display: block; }
.stat-lbl { font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--subtle); text-align: center; display: block; }

/* ═══════════════════════════════════════════════════════════
   TEXT + IMAGE BLOCK (Nile Cap Re style)
═══════════════════════════════════════════════════════════ */
.text-media { padding: clamp(64px,8vw,110px) 0; }
.text-media-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.text-media-inner.reverse .text-media-img { order: -1; }
.text-media-img { border-radius: 8px; overflow: hidden; box-shadow: var(--sh-md); }
.text-media-img img { width: 100%; aspect-ratio: 4/3; object-fit: cover; transition: transform .6s ease; }
.text-media-img:hover img { transform: scale(1.04); }
.text-media-content h2 { font-size: clamp(1.8rem,3vw,2.8rem); margin: 12px 0 18px; }
.text-media-content p { color: var(--muted); font-size: .98rem; line-height: 1.85; margin-bottom: 14px; }

/* ═══════════════════════════════════════════════════════════
   SERVICES — NCIB category + card + modal system
═══════════════════════════════════════════════════════════ */
.svc-categories { display: flex; gap: 0; border-bottom: 2px solid var(--border); margin-bottom: 0; }
.svc-cat-tab {
  padding: 14px 24px; font-size: .88rem; font-weight: 700;
  color: var(--subtle); border-bottom: 3px solid transparent;
  margin-bottom: -2px; cursor: pointer; background: none;
  letter-spacing: .03em;
  transition: color var(--t), border-color var(--t);
}
.svc-cat-tab:hover { color: var(--teal); }
.svc-cat-tab.active { color: var(--teal); border-color: var(--teal); }

.svc-panel { display: none; }
.svc-panel.active { display: block; }

/* The Nile Cap Re solution-card style: image background with overlay */
.svc-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
.svc-card {
  position: relative; border-radius: 8px; overflow: hidden;
  min-height: 340px; display: flex; flex-direction: column; justify-content: flex-end;
  color: #fff; cursor: pointer;
  transition: transform var(--t), box-shadow var(--t);
}
.svc-card:hover { transform: translateY(-7px); box-shadow: 0 20px 56px rgba(13,18,32,.28); }
.svc-card-bg {
  position: absolute; inset: 0; background-size: cover; background-position: center;
  transition: transform .65s ease;
}
.svc-card:hover .svc-card-bg { transform: scale(1.06); }
.svc-card::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(13,18,32,.98) 0%, rgba(13,18,32,.50) 55%, rgba(13,18,32,.28) 100%);
  z-index: 1;
}
.svc-card-body { position: relative; z-index: 2; padding: 26px 24px; text-shadow: 0 1px 6px rgba(13,18,32,.6); }
.svc-card-label {
  display: inline-block; font-size: .68rem; font-weight: 700;
  letter-spacing: .16em; text-transform: uppercase; color: var(--teal-glow); margin-bottom: 8px;
}
.svc-card-body h3 { font-family: var(--display); font-size: 1.3rem; font-weight: 400; color: #fff; margin-bottom: 8px; line-height: 1.25; text-shadow: 0 1px 8px rgba(13,18,32,.7), 0 2px 16px rgba(13,18,32,.5); }
.svc-card-body p { font-size: .84rem; color: rgba(255,255,255,.7); line-height: 1.6; margin-bottom: 16px; }
.svc-card-link {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: .82rem; font-weight: 700; color: var(--teal-glow);
  letter-spacing: .04em; transition: gap var(--t), color var(--t);
}
.svc-card:hover .svc-card-link { gap: 10px; color: #fff; }

/* Service MODAL — Nile Cap Re sol-modal style */
#svc-modal-overlay {
  display: none; position: fixed; inset: 0; z-index: 2000;
  background: rgba(13,18,32,.78);
  align-items: center; justify-content: center;
  padding: 24px; overflow-y: auto;
  opacity: 0; transition: opacity .3s ease;
}
#svc-modal-overlay.active { display: flex; opacity: 1; }
#svc-modal {
  background: var(--white); border-radius: 12px; max-width: 680px; width: 100%;
  max-height: 90vh; overflow-y: auto; position: relative;
  transform: translateY(20px); transition: transform .3s ease;
  box-shadow: 0 32px 80px rgba(13,18,32,.3);
}
#svc-modal-overlay.active #svc-modal { transform: translateY(0); }
.svc-modal-close {
  position: absolute; top: 14px; right: 14px; width: 34px; height: 34px;
  background: var(--off-white); border: none; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; color: var(--ink); font-size: 1rem; z-index: 10;
  transition: background var(--t), color var(--t);
}
.svc-modal-close:hover { background: var(--navy); color: #fff; }
.svc-modal-header {
  position: relative; min-height: 220px;
  background: linear-gradient(135deg, var(--navy) 0%, var(--teal-dark) 100%);
  background-size: cover; background-position: center;
  padding: 0;
  overflow: hidden;
}
.svc-modal-header-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(13,18,32,.85) 0%, rgba(13,18,32,.30) 60%, rgba(13,18,32,.15) 100%);
}
.svc-modal-header-content {
  position: relative; z-index: 2;
  padding: 28px 40px 24px;
  display: flex; flex-direction: column; justify-content: flex-end;
  min-height: 220px;
}
.svc-modal-header-content .svc-card-label { color: var(--teal-glow); margin-bottom: 6px; }
.svc-modal-header-content h2 {
  font-family: var(--display); font-size: clamp(1.4rem,2.5vw,2rem);
  font-weight: 300; color: #fff; line-height: 1.18;
  text-shadow: 0 2px 12px rgba(13,18,32,.7), 0 1px 4px rgba(13,18,32,.5);
}
.svc-modal-header .svc-card-label { color: var(--teal-glow); }
.svc-modal-header h2 { font-family: var(--display); font-size: clamp(1.5rem,2.5vw,2.2rem); font-weight: 300; color: #fff; margin-top: 8px; line-height: 1.18; }
.svc-modal-body { padding: 32px 40px 36px; }
.svc-modal-body p { font-size: .95rem; color: var(--muted); line-height: 1.85; margin-bottom: 14px; }
.svc-modal-body h4 { font-family: var(--display); font-size: 1.15rem; font-weight: 600; color: var(--ink); margin: 20px 0 10px; }
.svc-modal-body ul { padding-left: 0; display: flex; flex-direction: column; gap: 8px; }
.svc-modal-body ul li { display: flex; align-items: flex-start; gap: 10px; font-size: .9rem; color: var(--muted); line-height: 1.65; }
.svc-modal-body ul li::before { content: ''; display: block; width: 6px; height: 6px; border-radius: 50%; background: var(--teal-glow); flex-shrink: 0; margin-top: 7px; }
.svc-modal-footer { padding: 0 40px 32px; display: flex; gap: 12px; }

/* ═══════════════════════════════════════════════════════════
   SECTORS
═══════════════════════════════════════════════════════════ */
.sector-tags { display: flex; flex-wrap: wrap; gap: 12px; }
.sector-tag {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 12px 20px; background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.14); border-radius: var(--r);
  font-weight: 600; font-size: .88rem; color: rgba(255,255,255,.75);
  cursor: pointer; transition: all var(--t);
}
.sector-tag:hover { background: rgba(37,176,158,.2); border-color: rgba(37,176,158,.45); color: #fff; transform: translateY(-2px); }
.sector-tag .dot { color: var(--teal-glow); }

/* ═══════════════════════════════════════════════════════════
   TEAM — NCIB style with modal (Nile Cap Re team-modal)
═══════════════════════════════════════════════════════════ */
.team-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; align-items: stretch; }
.team-card {
  background: var(--white); border-radius: var(--r-lg); overflow: hidden;
  box-shadow: var(--sh); transition: transform var(--t), box-shadow var(--t);
  display: flex; flex-direction: column;
}
.team-card:hover { transform: translateY(-6px); box-shadow: var(--sh-md); }
.team-card-img { aspect-ratio: 3/4; overflow: hidden; flex-shrink: 0; }
.team-card-img img {
  width: 100%; height: 100%; object-fit: cover; object-position: top center;
  transition: transform .55s ease;
}
.team-card:hover .team-card-img img { transform: scale(1.05); }
.team-card-img-placeholder {
  width: 100%; height: 100%;
  background: linear-gradient(135deg, var(--navy), var(--teal-dark));
  display: flex; align-items: flex-end; justify-content: center; padding-bottom: 20px;
}
.team-card-img-placeholder svg { width: 72px; height: 72px; color: rgba(255,255,255,.18); }
.team-card-body { padding: 20px 22px; border-top: 3px solid var(--teal-glow); display: flex; flex-direction: column; flex: 1; }
.team-card-name { font-family: var(--display); font-size: 1.15rem; font-weight: 600; color: var(--ink); margin-bottom: 2px; }
.team-role { font-size: .78rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--teal); margin-bottom: 6px; }
.team-quals { font-size: .8rem; color: var(--subtle); margin-bottom: 14px; }
.team-learn-more {
  display: inline-flex; align-items: center; gap: 6px;
  background: none; border: none; color: var(--teal);
  padding: 0; font-family: var(--sans); font-size: .9rem; font-weight: 700;
  cursor: pointer; text-decoration: none; margin-top: auto; padding-top: 14px;
  transition: color var(--t);
}
.team-learn-more:hover { color: var(--teal-glow); }

/* Team modal — Nile Cap Re style */
#team-modal-overlay {
  display: none; position: fixed; inset: 0; z-index: 2000;
  background: rgba(13,18,32,.75); align-items: center; justify-content: center;
  padding: 24px; overflow-y: auto;
  opacity: 0; transition: opacity .3s ease;
}
#team-modal-overlay.active { display: flex; opacity: 1; }
#team-modal {
  background: var(--white); border-radius: 12px; max-width: 840px; width: 100%;
  overflow: hidden; position: relative;
  transform: translateY(20px); transition: transform .3s ease;
  box-shadow: 0 32px 80px rgba(13,18,32,.32);
  /* overflow managed per-breakpoint */
}
#team-modal-overlay.active #team-modal { transform: translateY(0); }
.team-modal-close {
  align-self: flex-end; margin-bottom: 12px;
  background: rgba(13,18,32,.18); border: none; border-radius: 50%;
  width: 54px; height: 54px; min-height: 54px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; color: var(--ink); font-size: 1.7rem;
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  transition: background var(--t), color var(--t); flex-shrink: 0;
}
.team-modal-close:hover { background: var(--teal); color: #fff; }
.team-modal-inner { display: grid; grid-template-columns: 260px 1fr; overflow: hidden; align-items: stretch; }
.team-modal-photo { overflow: hidden; border-radius: 12px 0 0 12px; }
.team-modal-photo img { width: 100%; height: 100%; object-fit: cover; object-position: top center; display: block; }
.team-modal-photo-placeholder {
  width: 100%; height: 100%; aspect-ratio: 4/5;
  background: linear-gradient(135deg, var(--navy), var(--teal-dark));
  display: flex; align-items: center; justify-content: center;
}
.team-modal-photo-placeholder svg { width: 80px; height: 80px; color: rgba(255,255,255,.2); }
.team-modal-content { padding: 0; overflow: hidden; display: flex; flex-direction: column; max-height: min(520px, 85vh); }
.team-modal-content .eyebrow { margin-bottom: 6px; }
.team-modal-content h2 { font-family: var(--display); font-size: 1.8rem; font-weight: 300; color: var(--ink); margin-bottom: 4px; }
.team-modal-role { font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--teal); margin-bottom: 6px; }
.team-modal-quals { font-size: .84rem; color: var(--subtle); margin-bottom: 22px; padding-bottom: 18px; border-bottom: 1px solid var(--border); }
.team-modal-bio { font-size: .92rem; color: var(--muted); line-height: 1.82; flex: 1; }
.team-modal-bio p { margin-bottom: 12px; }

/* ═══════════════════════════════════════════════════════════
   QUALITY MANAGEMENT — dark photo banner
═══════════════════════════════════════════════════════════ */
.qm-banner-section {
  position: relative; background-size: cover; background-position: center;
  padding: 84px 0;
}
.qm-overlay { position: absolute; inset: 0; background: rgba(13,18,32,.78); }
.qm-inner { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.qm-inner h2 { font-family: var(--display); font-size: clamp(1.8rem,3vw,2.8rem); color: #fff; margin: 10px 0 16px; line-height: 1.15; }
.qm-inner p { color: rgba(255,255,255,.68); font-size: .98rem; line-height: 1.8; max-width: 52ch; }
.qm-right { flex-shrink: 0; }

/* ═══════════════════════════════════════════════════════════
   CREDENTIALS
═══════════════════════════════════════════════════════════ */
.cred-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; background: var(--border); border-radius: var(--r-lg); overflow: hidden; }
.cred-cell {
  background: var(--white); padding: 32px 20px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
  transition: background var(--t);
}
.cred-cell:hover { background: var(--mint-light); }
.cred-cell img { max-height: 48px; max-width: 120px; object-fit: contain; filter: grayscale(1) opacity(.55); transition: filter var(--t); }
.cred-cell:hover img { filter: grayscale(0) opacity(1); }
.cred-cell-name { font-size: .72rem; font-weight: 700; color: var(--subtle); letter-spacing: .06em; }
.pill-row { display: flex; gap: 8px; flex-wrap: wrap; }
.pill {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--mint); color: var(--teal-dark);
  padding: 6px 14px; border-radius: 100px;
  font-size: .76rem; font-weight: 700; letter-spacing: .04em;
}
.pill svg { width: 12px; height: 12px; }

/* Partners */
.partner-strip { display: flex; align-items: center; justify-content: center; gap: 44px; flex-wrap: wrap; }
.partner-logo img { max-height: 36px; max-width: 100px; object-fit: contain; filter: grayscale(1) opacity(.42); transition: filter var(--t), transform var(--t); }
.partner-logo:hover img { filter: grayscale(0) opacity(1); transform: scale(1.06); }

/* Clients */
.client-list { display: flex; align-items: center; flex-wrap: wrap; gap: 0; margin-top: 32px; }
.client-item { padding: 12px 24px; border-right: 1px solid rgba(255,255,255,.12); font-size: .82rem; font-weight: 600; color: rgba(255,255,255,.5); letter-spacing: .04em; transition: color var(--t); }
.client-item:last-child { border-right: none; }
.client-item:hover { color: rgba(255,255,255,.85); }

/* ═══════════════════════════════════════════════════════════
   INSIGHTS
═══════════════════════════════════════════════════════════ */
.ins-grid-hero { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 20px; }
.ins-card {
  background: var(--white); border-radius: var(--r-lg); overflow: hidden; border: 1px solid var(--border);
  box-shadow: var(--sh); display: flex; flex-direction: column;
  transition: transform var(--t), box-shadow var(--t);
}
.ins-card:hover { transform: translateY(-4px); box-shadow: var(--sh-md); }
.ins-card-top {
  background: linear-gradient(135deg, var(--navy), var(--teal-dark));
  padding: 28px 24px; flex-shrink: 0;
}
.ins-card-sm .ins-card-top { padding: 20px 18px; }
.ins-tag {
  display: inline-block; background: rgba(37,176,158,.25); color: var(--teal-glow);
  padding: 3px 10px; border-radius: 100px;
  font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 10px;
}
.ins-card-top h3 { font-family: var(--display); font-size: 1.15rem; font-weight: 300; color: #fff; line-height: 1.3; }
.ins-card-sm .ins-card-top h3 { font-size: 1rem; }
.ins-body { padding: 20px 24px; flex: 1; display: flex; flex-direction: column; }
.ins-card-sm .ins-body { padding: 14px 18px; }
.ins-body p { font-size: .86rem; color: var(--muted); line-height: 1.7; flex: 1; }
.ins-meta { display: flex; align-items: center; justify-content: space-between; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border); font-size: .76rem; color: var(--subtle); }
.ins-meta a { color: var(--teal); font-weight: 700; }
.ins-meta a:hover { color: var(--teal-glow); }
.ins-list-card {
  display: grid; grid-template-columns: 240px 1fr;
  background: var(--white); border-radius: var(--r-lg); overflow: hidden; border: 1px solid var(--border);
  box-shadow: var(--sh); transition: transform var(--t), box-shadow var(--t);
}
.ins-list-card:hover { transform: translateY(-3px); box-shadow: var(--sh-md); }
.ins-list-visual { background: linear-gradient(135deg, var(--navy), var(--teal-dark)); padding: 24px 20px; display: flex; flex-direction: column; justify-content: flex-end; }
.ins-list-visual h3 { font-family: var(--display); font-size: 1.1rem; font-weight: 300; color: #fff; line-height: 1.3; }
.ins-list-body { padding: 22px 26px; display: flex; flex-direction: column; }
.ins-list-body p { font-size: .88rem; color: var(--muted); line-height: 1.75; flex: 1; }
.ins-list-meta { display: flex; align-items: center; justify-content: space-between; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border); font-size: .78rem; color: var(--subtle); }
.ins-list-meta a { color: var(--teal); font-weight: 700; }

/* Filter bar */
.filter-bar { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 32px; }
.filter-btn { padding: 7px 18px; border-radius: 100px; font-size: .82rem; font-weight: 600; border: 1.5px solid var(--border); color: var(--muted); background: var(--white); cursor: pointer; font-family: var(--sans); transition: all var(--t); }
.filter-btn:hover { border-color: var(--teal); color: var(--teal); }
.filter-btn.active { background: var(--teal); border-color: var(--teal); color: #fff; }

/* ═══════════════════════════════════════════════════════════
   CTA BANNER — photo background like Nile
═══════════════════════════════════════════════════════════ */
.cta-section { position: relative; background-size: cover; background-position: center; padding: 84px 0; }
.cta-overlay { position: absolute; inset: 0; background: rgba(13,18,32,.76); }
.cta-inner { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 44px; flex-wrap: wrap; }
.cta-left .eyebrow { color: var(--teal-glow); }
.cta-left h2 { text-shadow: 0 2px 16px rgba(13,18,32,.7); font-family: var(--display); font-size: clamp(2rem,4vw,3.2rem); color: #fff; margin-top: 8px; font-weight: 300; line-height: 1.15; }
.cta-left h2 em { font-style: italic; color: var(--teal-glow); }
.cta-right { flex-shrink: 0; display: flex; gap: 14px; flex-wrap: wrap; }

/* ═══════════════════════════════════════════════════════════
   CONTACT
═══════════════════════════════════════════════════════════ */
.contact-split { display: grid; grid-template-columns: 1fr 1.3fr; gap: 80px; align-items: start; }
.contact-detail { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 24px; }
.contact-detail-icon { width: 44px; height: 44px; border-radius: 50%; background: var(--off-white); display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--teal); }
.contact-detail-icon svg { width: 20px; height: 20px; }
.contact-detail-label { font-size: .76rem; font-weight: 700; text-transform: uppercase; letter-spacing: .09em; color: var(--teal); margin-bottom: 3px; }
.contact-detail p, .contact-detail a { font-size: .94rem; color: var(--ink); }
.contact-detail a:hover { color: var(--teal); }
.contact-form-wrap { background: var(--off-white); border-radius: 12px; padding: 44px; }
.contact-form-wrap h3 { font-family: var(--display); font-size: 1.8rem; font-weight: 300; color: var(--ink); margin-bottom: 6px; }
.contact-form-wrap > p { font-size: .9rem; color: var(--muted); margin-bottom: 30px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.form-group { display: flex; flex-direction: column; gap: 6px; margin-bottom: 18px; }
.form-group label { font-size: .76rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.form-group input, .form-group select, .form-group textarea {
  padding: 12px 15px; background: var(--white); border: 1.5px solid var(--border-mid);
  border-radius: var(--r); font-family: var(--sans); font-size: .93rem; color: var(--ink);
  transition: border-color var(--t); width: 100%; appearance: none;
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { outline: none; border-color: var(--teal); }
.form-group textarea { resize: vertical; min-height: 130px; line-height: 1.6; }
.form-check { display: flex; align-items: flex-start; gap: 9px; margin-bottom: 14px; font-size: .85rem; color: var(--muted); }
.form-check input[type="checkbox"] { width: 16px; height: 16px; flex-shrink: 0; margin-top: 2px; accent-color: var(--teal); }
.form-check.check-error input { outline: 2px solid #dc2626; border-radius: 2px; }
.form-check-err { font-size: .78rem; color: #dc2626; margin-bottom: 10px; display: none; }
.form-check-err.visible { display: block; }
.form-submit { width: 100%; padding: 14px; background: var(--teal); color: #fff; border: none; border-radius: var(--r); font-family: var(--sans); font-size: .94rem; font-weight: 700; cursor: pointer; transition: background var(--t), transform var(--t); }
.form-submit:hover { background: var(--teal-glow); }
.form-submit:active { transform: translateY(1px); }
.form-note { font-size: .76rem; color: var(--subtle); text-align: center; margin-top: 10px; }
.form-success { display: none; background: #d1fae5; border: 1px solid #a7f3d0; border-radius: var(--r); padding: 14px; color: #065f46; font-size: .88rem; margin-top: 14px; text-align: center; }
.form-success.show { display: block; }
.form-error { display: none; background: #fee2e2; border: 1px solid #fca5a5; border-radius: var(--r); padding: 14px; color: #991b1b; font-size: .88rem; margin-top: 14px; text-align: center; }
.form-error.show { display: block; }

/* FAQ */
.faq-list { border: 1px solid var(--border); border-radius: var(--r-lg); overflow: hidden; }
.faq-item { border-bottom: 1px solid var(--border); }
.faq-item:last-child { border-bottom: none; }
.faq-q { display: flex; align-items: center; justify-content: space-between; padding: 18px 22px; cursor: pointer; font-weight: 600; font-size: .9rem; color: var(--ink); background: var(--white); transition: background var(--t); font-family: var(--sans); }
.faq-q:hover { background: var(--mint-light); }
.faq-q.open { background: var(--mint-light); color: var(--teal); }
.faq-chevron { flex-shrink: 0; transition: transform .2s; }
.faq-q.open .faq-chevron { transform: rotate(180deg); }
.faq-a { display: none; padding: 4px 22px 18px; font-size: .88rem; color: var(--muted); line-height: 1.78; background: var(--mint-light); }
.faq-a.open { display: block; }

/* Values — on dark like Nile */
.values-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; margin-top: 44px; }
.value-card { padding: 28px 22px; background: rgba(255,255,255,.06); border-radius: 8px; border: 1px solid rgba(255,255,255,.1); transition: background var(--t); }
.value-card:hover { background: rgba(255,255,255,.1); }
.value-icon { font-size: 2rem; margin-bottom: 14px; display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; }
.value-card h4 { font-family: var(--display); font-size: 1.2rem; color: #fff; margin-bottom: 8px; }
.value-card p  { font-size: .86rem; color: rgba(255,255,255,.55); line-height: 1.72; }

/* VM cards */
.vm-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.vm-card { border-radius: var(--r-lg); padding: 36px 32px; box-shadow: var(--sh); }
.vm-card.vision { background: var(--navy); }
.vm-card.mission { background: var(--white); border: 1px solid var(--border); }
.vm-card h3 { font-family: var(--display); font-size: 1.3rem; margin-bottom: 14px; line-height: 1.3; }
.vm-card.vision h3 { color: #fff; }
.vm-card.mission h3 { color: var(--ink); }
.vm-card p { font-size: .93rem; line-height: 1.82; }
.vm-card.vision p  { color: rgba(255,255,255,.58); }
.vm-card.mission p { color: var(--muted); }

/* ═══════════════════════════════════════════════════════════
   FOOTER — dark like Nile
═══════════════════════════════════════════════════════════ */
#site-footer { background: var(--navy); color: rgba(255,255,255,.52); padding: 72px 0 0; }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr 1.4fr; gap: 36px; padding-bottom: 52px; }
.footer-brand { text-align: left; }
.footer-brand img { height: 42px; margin-bottom: 16px; filter: none; opacity: 1; }
.footer-brand p { font-size: .86rem; line-height: 1.82; max-width: 340px; color: rgba(255,255,255,.45); }
.footer-col h6 { font-family: var(--display); font-size: .82rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.75); margin-bottom: 16px; padding-bottom: 0; }
.footer-col a { display: block; font-size: .87rem; color: rgba(255,255,255,.48); margin-bottom: 9px; transition: color var(--t); }
.footer-col a:hover { color: var(--teal-glow); }
.footer-bottom { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; padding: 20px max(var(--gut), 20px) 28px; font-size: .8rem; color: rgba(255,255,255,.26); }
.footer-links { display: flex; gap: 24px; }
.footer-links a { color: rgba(255,255,255,.3); }
.footer-links a:hover { color: var(--teal-glow); }

/* ═══════════════════════════════════════════════════════════
   BACK TO TOP + WHATSAPP
═══════════════════════════════════════════════════════════ */
#btnTop { position: fixed; bottom: calc(82px + 5vh); right: 31px; z-index: 799; width: 42px; height: 42px; border-radius: 50%; background: var(--navy); color: #fff; display: flex; align-items: center; justify-content: center; box-shadow: var(--sh-dark); opacity: 0; pointer-events: none; transition: opacity var(--t), transform var(--t); border: none; cursor: pointer; }
#btnTop.visible { opacity: 1; pointer-events: auto; }
#btnTop:hover { transform: translateY(-2px); }

/* Cookie */
#cookieBanner { position: fixed; bottom: 0; left: 0; right: 0; z-index: 1000; background: var(--navy); border-top: 1px solid rgba(255,255,255,.1); transform: translateY(100%); transition: transform .4s var(--ease); padding: 16px var(--gut); }
#cookieBanner.visible { transform: translateY(0); }
.cookie-inner { max-width: var(--max); margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.cookie-text strong { color: #fff; font-size: .9rem; }
.cookie-text p { font-size: .8rem; color: rgba(255,255,255,.5); margin-top: 2px; }
.cookie-text a { color: var(--teal-glow); }
.cookie-btns { display: flex; gap: 8px; flex-shrink: 0; }
.cookie-ok  { padding: 8px 18px; background: var(--teal-glow); color: #fff; border: none; border-radius: var(--r); font-family: var(--sans); font-size: .82rem; font-weight: 700; cursor: pointer; transition: background var(--t); }
.cookie-ok:hover { background: var(--teal); }
.cookie-ess { padding: 8px 18px; background: transparent; color: rgba(255,255,255,.6); border: 1px solid rgba(255,255,255,.25); border-radius: var(--r); font-family: var(--sans); font-size: .82rem; cursor: pointer; transition: all var(--t); }
.cookie-ess:hover { border-color: rgba(255,255,255,.6); color: #fff; }

/* ═══════════════════════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════════════════════ */

/* Named helpers for inline grids — base styles inherited from inline, responsive via media */
.why-section-grid    { display: grid; }
.sectors-grid-inner  { display: grid; }
.about-stats-grid    { }


.svc-layout-grid { display: grid; }
@media (max-width: 1100px) {
  .team-grid { grid-template-columns: repeat(2,1fr); }
  .svc-grid { grid-template-columns: repeat(2,1fr); }
  .ins-grid-hero { grid-template-columns: 1fr 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr 1fr; }
  .cred-grid { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 900px) {
  .nav-links, .nav-cta { display: none !important; }
  .hamburger { display: flex !important; margin-left: auto; }
  .text-media-inner, .contact-split { grid-template-columns: 1fr; gap: 40px; }
  .text-media-inner.reverse .text-media-img { order: 0; }
  .vm-grid { grid-template-columns: 1fr; }
  .team-grid { grid-template-columns: 1fr 1fr; }  /* 2-col at tablet */
  .team-modal-inner { grid-template-columns: 1fr; }
  .team-modal-photo { border-radius: 12px 12px 0 0; }
  .team-modal-photo img { min-height: 240px; aspect-ratio: 4/3; }
  .cta-inner { flex-direction: column; text-align: center; }
  .cta-right { justify-content: center; }
  .stats-row { grid-template-columns: repeat(2,1fr); }
  .ins-grid-hero { grid-template-columns: 1fr; }
  .ins-list-card { grid-template-columns: 1fr; }
  .ins-list-visual { min-height: 140px; padding: 20px 18px; }
  .qm-inner { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 28px; }
  .values-grid { grid-template-columns: 1fr 1fr; }
  .hero-thumbs { display: none; }
  /* Inline 2-col grids → single column */
  .why-section-grid,
  .sectors-grid-inner { grid-template-columns: 1fr !important; }

  /* Sector tags wrap properly */
  .sector-tags { gap: 8px; }
  .sector-tag  { font-size: .82rem; padding: 10px 14px; }

  /* Why choose box stacks */
  .why-pillars { grid-template-columns: 1fr 1fr; }

  /* Stats: keep 2-col at 900 (already set but enforce) */
  .stats-row { grid-template-columns: 1fr 1fr; }

  /* Hero credentials wrap to 2-per-row */
  .hero-creds { flex-wrap: wrap; }
  .hero-cred-item { flex: 1 1 40%; min-width: 140px; }

  /* Partner strip */
  .partner-strip { gap: 28px; }

  /* Svc categories overflow scroll on tablet */
  .svc-categories { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .svc-cat-tab    { white-space: nowrap; padding: 12px 18px; }

  /* Client list wraps */
  .client-list { flex-wrap: wrap; }
  .client-item { border-right: none; border-bottom: 1px solid rgba(255,255,255,.12); width: 50%; padding: 10px 16px; }

  /* About page inline 2-col stats grid */
  .about-stats-grid { grid-template-columns: 1fr 1fr !important; }
  .svc-layout-grid { grid-template-columns: 1fr !important; gap: 36px !important; }
}
@media (max-width: 640px) {
  .container { padding: 0 20px; }
  /* ── Services tabs — 2×2 file-tab grid (mobile) ────────── */
  .svc-categories {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    border-bottom: none;
    /* Bottom border of the whole grid — active tab panel sits on this */
    position: relative;
  }
  .svc-categories::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 2px;
    background: rgba(255,255,255,.18);
  }
  .svc-cat-tab {
    position: relative;
    padding: 11px 8px;
    font-size: .75rem;
    text-align: center;
    background: rgba(255,255,255,.04);
    /* File-tab borders — top and sides rounded at top, open at bottom */
    border: 1.5px solid rgba(255,255,255,.18);
    border-bottom: none;
    border-radius: 7px 7px 0 0;
    margin-bottom: 0;
    /* Overlap tabs slightly so they sit flush */
    margin-right: -1px;
    color: var(--subtle);
    z-index: 1;
    transition: color var(--t), background var(--t), border-color var(--t);
  }
  /* Row 1: top-left and top-right tabs */
  .svc-cat-tab:nth-child(1) { border-radius: 7px 0 0 0; }
  .svc-cat-tab:nth-child(2) { border-radius: 0 7px 0 0; margin-right: 0; }
  /* Row 2: bottom-left and bottom-right tabs */
  .svc-cat-tab:nth-child(3) { border-radius: 7px 0 0 0; margin-top: 3px; }
  .svc-cat-tab:nth-child(4) { border-radius: 0 7px 0 0; margin-top: 3px; margin-right: 0; }
  /* Row 1 tabs have a bottom border to separate from row 2 */
  .svc-cat-tab:nth-child(1),
  .svc-cat-tab:nth-child(2) {
    border-bottom: 1.5px solid rgba(255,255,255,.18);
  }
  /* Active tab: lifts up, brighter border, accent bottom, full bg */
  .svc-cat-tab.active {
    background: rgba(255,255,255,.10);
    border-color: rgba(255,255,255,.35);
    border-bottom: 2px solid var(--teal-glow);
    color: var(--teal-glow);
    z-index: 3;
    font-weight: 800;
  }
  /* Row 1 active tab removes its bottom border (sits flush with row 2) */
  .svc-cat-tab:nth-child(1).active,
  .svc-cat-tab:nth-child(2).active {
    border-bottom: 2px solid var(--teal-glow);
  }
  .svc-grid { grid-template-columns: 1fr; }
  .team-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; }
  .values-grid { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; }
  .why-pillars { grid-template-columns: 1fr; }
  .cred-grid { grid-template-columns: 1fr 1fr; }
  .about-btn-wrap { justify-content: center; }
  .footer-contact-item { justify-content: center; }
  .footer-col-contact a { text-align: left; }
  .cred-grid-large { grid-template-columns: 1fr !important; }
  .partner-grid-2x2 { grid-template-columns: 1fr !important; }
  .filter-bar { gap: 6px; }
  .why-pillars { grid-template-columns: 1fr !important; gap: 16px !important; }
  .hero-creds { display: none; }
  .hero-content { padding-left: 20px; padding-right: 20px; }
  .svc-modal-header, .svc-modal-body, .svc-modal-footer { padding-left: 24px; padding-right: 24px; }
  /* Sector tags single column */
  .sector-tag  { width: 100%; justify-content: flex-start; }
  .sector-tags { flex-direction: column; }

  /* Why pillars single column */
  .why-pillars { grid-template-columns: 1fr; }

  /* Stats row 2-col stays (4 items → 2x2) */
  .stats-row { grid-template-columns: 1fr 1fr; }

  /* Client list full width items */
  .client-item { width: 100%; }

  /* Hero creds hide on very small (already set) */
  .hero-creds { display: none; }

  /* Service tab text smaller */
  .svc-cat-tab { padding: 10px 14px; font-size: .8rem; }

  /* Partner strip tighter */
  .partner-strip { gap: 20px; }

  /* Page hero watermark hide */
  .page-hero-watermark { display: none; }

  /* Sector section inner 2-col → 1-col */
  .sectors-inner-grid { grid-template-columns: 1fr !important; gap: 32px !important; }

  /* About stats grid full width */
  .about-stats-grid { grid-template-columns: 1fr 1fr !important; }

  /* Modal padding reduce */
  .team-modal-content { padding: 20px; }
  .svc-modal-header { padding: 24px 20px 18px; }
  .svc-modal-body   { padding: 20px; }
  .svc-modal-footer { padding: 0 20px 24px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; } }

/* Mobile Why Choose: 4 icons in a row */
@media (max-width: 900px) {
  .why-pillars-mobile-icons {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 12px !important;
    margin-bottom: 0;
  }
}

/* Insights article modal */
#article-modal-overlay {
  display: none; position: fixed; inset: 0; z-index: 2000;
  background: rgba(13,18,32,.78); align-items: flex-start; justify-content: center;
  padding: 40px 24px; overflow-y: auto;
  opacity: 0; transition: opacity .3s ease;
}
#article-modal-overlay.active { display: flex; opacity: 1; }
#article-modal {
  background: var(--white); border-radius: 12px; max-width: 760px; width: 100%;
  overflow: hidden; position: relative; margin: auto;
  transform: translateY(20px); transition: transform .3s ease;
  box-shadow: 0 32px 80px rgba(13,18,32,.3);
}
#article-modal-overlay.active #article-modal { transform: translateY(0); }
.article-modal-close {
  position: absolute; top: 14px; right: 14px; width: 34px; height: 34px;
  background: rgba(255,255,255,.15); border: none; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; color: #fff; font-size: 18px; z-index: 10;
  transition: background var(--t);
}
.article-modal-close:hover { background: rgba(255,255,255,.3); }
.article-modal-img {
  width: 100%; height: 260px; object-fit: cover; object-position: center; display: block;
}
.article-modal-img-placeholder {
  width: 100%; height: 260px;
  background: linear-gradient(135deg, var(--navy), var(--teal-dark));
  display: flex; align-items: flex-end; padding: 28px 32px;
}
.article-modal-body { padding: 32px; }
.article-modal-body h2 {
  font-family: var(--display); font-size: clamp(1.4rem,2.5vw,2rem);
  font-weight: 300; color: var(--ink); margin-bottom: 12px; line-height: 1.25;
}
.article-modal-body .article-meta { font-size: .82rem; color: var(--subtle); margin-bottom: 20px; }
.article-modal-body p { font-size: .95rem; color: var(--muted); line-height: 1.85; margin-bottom: 14px; }

/* About credentials — logos fill 2×2 grid cells */
.cred-cell-large { padding: 24px !important; }
.cred-cell-large img { max-height: 80px !important; max-width: 160px !important; }

/* About + Services tech partners 2×2 grid */
.partner-grid-2x2 {
  display: grid; grid-template-columns: 1fr 1fr; gap: 16px;
}
.partner-grid-2x2 .partner-logo {
  background: rgba(255,255,255,.85); border-radius: 8px; padding: 20px;
  display: flex; align-items: center; justify-content: center;
}
.partner-grid-2x2 .partner-logo img {
  max-height: 56px; max-width: 140px; object-fit: contain;
  filter: none !important; opacity: .22;
  transition: opacity var(--t), transform var(--t);
}
.partner-grid-2x2 .partner-logo:hover img { opacity: 1; transform: scale(1.06); }
/* About page: larger logos (200%) */
.partner-grid-2x2.partner-large img { max-height: 80px !important; max-width: 180px !important; opacity: .9; }
.partner-row { display: flex !important; flex-direction: row !important; gap: 64px !important; align-items: center; justify-content: center !important; flex-wrap: wrap; }
.partner-row .partner-logo { flex: 0 0 auto; background: none; padding: 0; border-radius: 0; }
.partner-row .partner-logo img { max-height: 80px; max-width: 180px; filter: none; opacity: .85; transition: opacity var(--t), transform var(--t); }
.partner-row .partner-logo:hover img { opacity: 1; transform: scale(1.06); }

/* About credentials right col: 2×2 grid large logos */
.cred-grid-large {
  display: grid; grid-template-columns: 1fr 1fr; gap: 2px;
  background: var(--border); border-radius: var(--r-lg); overflow: hidden;
}
.cred-grid-large .cred-cell {
  padding: 32px 24px; min-height: 180px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.cred-grid-large .cred-cell img {
  max-height: 164px; max-width: 240px; object-fit: contain;
  filter: none; opacity: .9; transition: opacity var(--t);
}
.cred-grid-large .cred-cell:hover img { opacity: 1; }

/* Footer bottom wrapper */
.footer-bottom-wrap { background: var(--navy); margin: 0; border-top: 1px solid rgba(255,255,255,.08); }
/* footer-bottom inner border removed — border-top on wrap only */

/* Tailored Bay link colour */
.footer-tb-link { color: rgba(255,255,255,.48) !important; text-decoration: none; transition: color var(--t); }
.footer-tb-link:hover { color: #AA2CA5 !important; }

/* Footer bottom privacy links hover */
.footer-links a { color: rgba(255,255,255,.38); transition: color var(--t); }

/* Copy year JS target */
.copy-year::after { content: attr(data-year); }

/* Mobile footer: hide affiliations, 2-col services/company, centre everything */
@media (max-width: 640px) {
  .footer-col-affiliations { display: none; }
  .footer-grid { grid-template-columns: 1fr 1fr !important; }
  .footer-brand { grid-column: 1 / -1; text-align: center; }
  .footer-brand img { margin: 0 auto 16px; }
  .footer-brand p { margin: 0 auto; }
  .footer-col { text-align: center; }
  .footer-links { justify-content: center; }
}

/* Back-to-top and WA aligned centres: both at right:24px, WA at bottom:24, btnTop at bottom:82 */
/* Already set in main rules above */

/* Navbar logo: no white bg */
.nav-logo img { background: transparent !important; }

}

/* Team card row alignment */
.team-card-name { font-family: var(--display); font-size: 1.15rem; font-weight: 600; color: var(--ink); margin-bottom: 4px; min-height: 1.5em; }
.team-role { font-size: .78rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--teal); margin-bottom: 6px; min-height: 2.5em; display: flex; align-items: flex-start; }
.team-quals { font-size: .8rem; color: var(--subtle); margin-bottom: 14px; min-height: 1.4em; }



/* QM section credential logo grid — square cells, larger logos */
.qm-cred-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2px;
  background: rgba(255,255,255,.12);
  border-radius: 8px;
  overflow: hidden;
}
.qm-cred-grid .cred-cell {
  background: rgba(255,255,255,.85);
  height: 100px;
  padding: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background var(--t);
}
.qm-cred-grid .cred-cell:hover { background: rgba(255,255,255,.18); }
.qm-cred-grid .cred-cell img {
  max-width: 100%;
  max-height: 60px;
  object-fit: contain;
  filter: none;
  opacity: .9;
  transition: opacity var(--t);
}
.qm-cred-grid .cred-cell:hover img { opacity: 1; }
/* QM credentials button: 40% of normal width */
.qm-cred-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: fit-content;
  padding: 10px 18px;
  font-size: .82rem;
  margin: 0 auto;
}

/* Team modal: static header + scrollable bio */
.team-modal-static {
  padding: 28px 28px 0 28px;
  flex-shrink: 0;
  background: var(--white);
}
.team-modal-scroll {
  padding: 16px 28px 0 28px;
  overflow-y: auto;
  flex: 1;
  min-height: 80px;
  /* Subtle fade at very top so text appears to emerge from header */
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 20px, black calc(100% - 0px));
  mask-image: linear-gradient(to bottom, transparent 0%, black 20px, black calc(100% - 0px));
}
/* LinkedIn sits inside scroll area but pinned at bottom via flex */
.team-modal-linkedin-wrap {
  padding: 16px 28px 24px 28px;
  border-top: 1px solid var(--border);
  flex-shrink: 0;
  background: var(--white);
}
/* Photo: enforce 4:5 always */




/* Footer mobile gap between stacked columns */
@media (max-width: 640px) {
  .footer-grid { gap: 28px !important; }
  .footer-col { padding-top: 0; }
}

/* ACCA logo — cropped to 3:1 rectangle, scales naturally with other logos */
/* About credentials: increase cell transparency by 20% (from .08 base)
   The cred-cell has background:var(--white) — increase opacity means more visible bg */
.cred-grid-large .cred-cell {
  background: rgba(255,255,255,1) !important;
}

/* Value card SVG icons */
.value-icon svg { width: 52px; height: 52px; }
.value-icon img { width: 52px; height: 52px; object-fit: contain; display: block; }

/* Footer-bottom mobile: ensure gap from screen edge */
@media (max-width: 640px) {
  .footer-bottom {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}

/* Mobile leadership modal: simple scroll — entire modal scrolls as one unit */
@media (max-width: 640px) {
  /* Modal outer: scrolls as one unit */
  #team-modal {
    overflow-y: auto;
    max-height: 92vh;
    border-radius: 12px;
  }

  /* Stack: photo on top, content below */
  .team-modal-inner {
    grid-template-columns: 1fr !important;
    display: flex !important;
    flex-direction: column;
  }

  /* Photo: full-width, face-cropped */
  .team-modal-photo {
    border-radius: 12px 12px 0 0 !important;
    flex-shrink: 0;
    overflow: hidden;
  }
  .team-modal-photo img,
  .team-modal-photo-placeholder {
    width: 100% !important;
    height: 260px !important;
    max-height: 260px !important;
    object-fit: cover !important;
    object-position: top center !important;
    display: block !important;
    aspect-ratio: unset !important;
  }

  /* Close button: top-right corner, floats over photo */
  .team-modal-close {
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    z-index: 10 !important;
    background: rgba(13,18,32,.45) !important;
    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
    color: #fff !important;
  }

  /* Content: normal flow, scrolls with the modal */
  .team-modal-content {
    overflow-y: visible !important;
    max-height: none !important;
    padding: 0;
  }

  /* Static header: normal flow */
  .team-modal-static {
    position: static !important;
    padding: 20px 20px 0 20px;
  }

  /* Bio: normal flow */
  .team-modal-scroll {
    overflow-y: visible !important;
    max-height: none !important;
    padding: 12px 20px 0 20px;
    -webkit-mask-image: none !important;
    mask-image: none !important;
  }

  /* LinkedIn: sticky at bottom */
  .team-modal-linkedin-wrap {
    position: sticky !important;
    bottom: 0;
    z-index: 3;
    background: var(--white);
    padding: 12px 20px;
    border-top: 1px solid var(--border);
  }
}

/* Footer-bottom mobile: links appear first (above copyright) */
/* footer-bottom mobile order consolidated below */

/* Contact form submit button: 50% width, centred, rounder */
#submitBtn, .form-submit {
  max-width: 50%;
  width: 50%;
  display: block;
  margin: 0 auto;
  border-radius: calc(var(--r) * 1.6) !important;
}

/* Mobile: centre "About the Firm" button in Why Choose box */
@media (max-width: 640px) {
  .why-intro-box .btn {
    display: block;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    width: fit-content;
  }
}

/* Mobile modal: hide eyebrow leadership label */
@media (max-width: 640px) {
  .team-modal-static .eyebrow { display: none; }
}

/* Footer-bottom mobile: links first, copyright last */
@media (max-width: 640px) {
  .footer-bottom {
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 10px;
  }
  .footer-links {
    order: 1;
    justify-content: center;
    flex-wrap: wrap;
    gap: 16px;
  }
  #footer-copy {
    order: 2;
  }
}

/* ── CLIENT CAROUSEL ─────────────────────────────────────────────────────── */
.client-carousel-section {
  background: var(--off-white);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 22px 0;
  overflow: hidden;
  /* Fade edges so names emerge smoothly */
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 8%, black 92%, transparent 100%);
  mask-image:         linear-gradient(to right, transparent 0%, black 8%, black 92%, transparent 100%);
}
.client-carousel-inner {
  display: flex;
  white-space: nowrap;
  width: max-content;
}
.client-track {
  display: inline-flex;
  align-items: center;
  gap: 0;
  animation: clientScroll 40s linear infinite;
  flex-shrink: 0;
}
/* Pause on hover */
.client-carousel-section:hover .client-track {
  animation-play-state: paused;
}
.client-name {
  font-family: var(--display);
  font-size: 1.05rem;
  font-weight: 600;
  letter-spacing: .03em;
  color: var(--teal-glow);
  padding: 0 28px;
  white-space: nowrap;
  transition: color var(--t);
}
.client-sep {
  color: var(--navy);
  font-size: .75rem;
  opacity: .35;
  flex-shrink: 0;
  line-height: 1;
}
@keyframes clientScroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  .client-track { animation: none; }
  .client-carousel-inner { overflow-x: auto; }
}

/* 4-column leadership cards — compact typography */
.team-card-name { font-size: 1rem; }
.team-role { font-size: .72rem; }
.team-quals { font-size: .74rem; }

/* ── CHATBOT FAB ─────────────────────────────────────────────────────────── */

/* Chatbot widget panel */

/* Footer contact column */
.footer-contact-item {
  display: flex; align-items: flex-start; gap: 8px;
  margin-bottom: 10px;
}
.footer-contact-icon {
  display: flex; align-items: center; justify-content: center;
  width: 20px; height: 20px; flex-shrink: 0; margin-top: 1px;
  color: var(--teal-glow);   /* permanently teal-glow — no hover change */
}
.footer-col-contact a {
  display: inline;   /* override block so it wraps with text */
  font-size: .82rem;
  line-height: 1.5;
}
/* ensure icons stay teal-glow even when parent is hovered */
.footer-contact-item:hover .footer-contact-icon { color: var(--teal-glow) !important; }

/* ── THAMANI AI CHATBOT ───────────────────────────────────────────────────── */
#taChatFab {
  position: fixed; bottom: 24px; right: 24px; z-index: 900;
  width: 56px; height: 56px; border-radius: 50%;
  background: var(--navy); border: none; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 20px rgba(13,18,32,.45);
  transition: transform .2s ease, box-shadow .2s ease;
  padding: 10px;
}
#taChatFab:hover { transform: scale(1.08); box-shadow: 0 8px 32px rgba(13,18,32,.5); }
#taChatFab img { width: 100%; height: 100%; object-fit: contain; }

#taChatWindow {
  position: fixed; bottom: 92px; right: 24px; z-index: 901;
  width: 360px; max-height: 540px;
  background: var(--white); border-radius: 16px;
  box-shadow: 0 16px 60px rgba(13,18,32,.22);
  display: flex; flex-direction: column; overflow: hidden;
  transform: scale(.92) translateY(16px); transform-origin: bottom right;
  opacity: 0; visibility: hidden;
  transition: transform .25s var(--ease), opacity .25s var(--ease), visibility .25s;
}
#taChatWindow.open {
  opacity: 1; visibility: visible; transform: scale(1) translateY(0);
}
.ta-chat-header {
  background: var(--navy); padding: 14px 18px;
  display: flex; align-items: center; gap: 12px; flex-shrink: 0;
}
.ta-chat-avatar {
  width: 36px; height: 36px; border-radius: 50%;
  background: var(--teal-dark); padding: 6px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
}
.ta-chat-avatar img { width: 100%; height: 100%; object-fit: contain; }
.ta-chat-title { flex: 1; }
.ta-chat-title strong { display: block; font-family: var(--sans); font-size: .85rem; color: #fff; font-weight: 700; }
.ta-chat-title span { font-size: .72rem; color: rgba(255,255,255,.55); }
.ta-chat-close { background: none; border: none; color: rgba(255,255,255,.55); cursor: pointer; font-size: 1.2rem; line-height:1; padding: 4px; transition: color var(--t); }
.ta-chat-close:hover { color: #fff; }
.ta-chat-msgs {
  flex: 1; overflow-y: auto; padding: 16px;
  display: flex; flex-direction: column; gap: 10px; min-height: 0;
}
.ta-msg {
  max-width: 88%; padding: 10px 14px; font-size: .85rem; line-height: 1.55;
  border-radius: 12px; word-break: break-word;
}
.ta-msg a { color: var(--teal-glow); text-decoration: underline; }
.ta-msg.bot { background: var(--off-white); color: var(--ink); border-radius: 4px 12px 12px 12px; align-self: flex-start; }
.ta-msg.user { background: var(--teal); color: #fff; border-radius: 12px 4px 12px 12px; align-self: flex-end; }
.ta-msg.thinking { background: var(--off-white); color: var(--subtle); border-radius: 4px 12px 12px 12px; align-self: flex-start; font-style: italic; }
.ta-chips {
  display: flex; flex-wrap: wrap; gap: 6px; padding: 0 16px 12px; flex-shrink: 0;
}
.ta-chip {
  background: none; border: 1.5px solid var(--teal); color: var(--teal);
  padding: 5px 13px; border-radius: 100px; font-size: .75rem; font-weight: 600;
  cursor: pointer; font-family: var(--sans);
  transition: background var(--t), color var(--t);
}
.ta-chip:hover { background: var(--teal); color: #fff; }
.ta-chat-input {
  display: flex; gap: 8px; padding: 12px 14px;
  border-top: 1px solid var(--border); flex-shrink: 0;
}
.ta-chat-input input {
  flex: 1; border: 1.5px solid var(--border); border-radius: 100px;
  padding: 9px 16px; font-family: var(--sans); font-size: .85rem;
  color: var(--ink); outline: none; transition: border-color var(--t);
}
.ta-chat-input input:focus { border-color: var(--teal); }
.ta-chat-send {
  width: 36px; height: 36px; border-radius: 50%; background: var(--teal);
  color: #fff; border: none; cursor: pointer; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  transition: background var(--t);
}
.ta-chat-send:hover { background: var(--teal-glow); }
.ta-chat-send svg { width: 16px; height: 16px; }
.ta-offline-msg { font-size: .82rem; color: var(--subtle); padding: 12px 16px; text-align: center; border-top: 1px solid var(--border); }
@media (max-width: 480px) {
  #taChatWindow { width: calc(100vw - 24px); right: 12px; bottom: 82px; }
  #taChatFab { right: 12px; }
  /* btnTop: centre-aligned with taChatFab, gap halved */
  #btnTop { right: 19px; bottom: calc(80px + 2.5vh); }
}