/* ============================================================
   site-v13.css — Global UI/UX standardization (v1.3.0+)
   Loaded AFTER site.css + auth.css + site-v11.css.
   Applies the new tokens to EVERY page, dashboard, form and card.
   ============================================================ */

/* ── 1. Tokens (override) ─────────────────────────────── */
:root {
  /* Palette */
  --c-paper:      #ffffff;
  --c-paper-2:    #f5f6f8;
  --c-paper-3:    #eaecf0;
  --c-card:       #D4D7DF;       /* grey blocks/cards/containers */
  --c-ink:        #14213D;       /* headings */
  --c-ink-2:      #6B7280;       /* descriptions */
  --c-rule:       rgba(20,33,61,0.08);
  --c-rule-strong:rgba(20,33,61,0.18);

  /* Brand actions */
  --c-blue:       #4F8EDC;
  --c-blue-deep:  #0058c5;
  --c-blue-light: #339cff;
  --c-blue-sky:   #66b3ff;
  --c-blue-pale:  #cfe5ff;
  --c-navy:       #14213D;
  --c-navy-deep:  #0a1623;
  --c-navy-darker:#06101c;

  /* Legacy aliases kept stable so old rules don't break */
  --c-gold:       var(--c-blue);
  --c-gold-soft:  var(--c-blue-pale);
  --c-gold-dim:   rgba(79,142,220,0.30);
  --c-gold-faint: rgba(79,142,220,0.08);

  --grad-brand:      linear-gradient(135deg, #339cff 0%, #4F8EDC 100%);
  --grad-brand-soft: linear-gradient(135deg, #66b3ff 0%, #4F8EDC 100%);

  --shadow-sm: 0 1px 2px rgba(20,33,61,0.05);
  --shadow-md: 0 4px 12px -4px rgba(20,33,61,0.10);
  --shadow-lg: 0 14px 32px -16px rgba(20,33,61,0.18);

  /* Typography */
  --f-body:    'Plus Jakarta Sans', sans-serif;
  --f-display: 'Plus Jakarta Sans', sans-serif;
  --f-mono:    'Plus Jakarta Sans', sans-serif;

  /* Spacing — compact */
  --pad-x: clamp(16px, 2.4vw, 36px);
  --pad-y: clamp(32px, 4.2vw, 56px);
  --max-w: 1200px;
}

/* ── 2. Global base typography ───────────────────────── */
html, body {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  background: var(--c-paper);
  color: var(--c-ink);
}
body { font-size: 13px !important; font-weight: 400 !important; line-height: 1.6 !important; }

h1, h2, h3, h4, h5, h6,
.display, .h1, .h2, .h3, .h4,
.modal h2, .modal-head h2,
.brand-text .name, .modal-head .brand-row span,
.dash-topbar h1, .dash-page-head h1, .dash-card h3, .card h3, .case-card h3, .leader h3, .insight h4,
.profile-name h2,
.ind-card h4, .kpi .num, .stats-band .num, .page-hero .inline-stats .num,
.entry-card h3, .mv-card h3, .timeline-list h3, .timeline-dark h4,
.principles .pr h4, .why-connect .item h4,
.site-footer h6, .site-footer .brand-block .name,
.specimen .name, .fn h4, .pull-quote blockquote, .testimonial blockquote {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  color: var(--c-ink) !important;
  font-weight: 600 !important;
  font-style: normal !important;
  letter-spacing: -0.005em !important;
  line-height: 1.3 !important;
}

/* Default heading 16px */
h1, h2, h3, h4, h5, h6 { font-size: 16px !important; font-weight: 700 !important; margin-top: 0; }

/* Page hero / hero / display headings — larger but still calm */
.hero .h1, .page-hero .h1 {
  font-size: clamp(22px, 2.4vw, 28px) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}
.h1, .display.h1 { font-size: clamp(20px, 2.2vw, 26px) !important; line-height: 1.3 !important; }
.h2, .display.h2 { font-size: clamp(18px, 1.8vw, 20px) !important; font-weight: 700 !important; line-height: 1.3 !important; }
.h3, .display.h3 { font-size: 16px !important; font-weight: 600 !important; }
.h4              { font-size: 14px !important; font-weight: 600 !important; }

/* Display em — accent (was gold/gradient text) */
.display em {
  background: none !important;
  -webkit-text-fill-color: var(--c-blue) !important;
  color: var(--c-blue) !important;
  font-style: normal !important;
  font-weight: 700 !important;
}

/* Body & descriptions */
p, .body, .lede, .desc, .modal-body .sub, .input-group .hint,
.card .desc, .case-card .desc, .leader p, .insight .body, .entry-card p,
.timeline-list p, .timeline-dark .desc, .principles .pr p,
.kpi .lbl, .kpi .trend,
.brand-text .sub, .dash-table td, .specimen .desc {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  color: var(--c-ink-2) !important;
  line-height: 1.6 !important;
  letter-spacing: 0 !important;
}
.lede { font-size: 14px !important; }

/* Eyebrows / mono / status — tame the all-caps tracking */
.eyebrow, .mono, .mono-gold, .modal-head .brand-row span,
.dash-sidebar .section-label, .dash-sidebar .brand .role,
.brand-text .sub, .pill, .status-badge,
.case-card .tag, .entry-card .tag, .roster-group .label .tag,
.field label, .input-group label, .form .field label,
.site-footer h6, .insight .tag, .principles .pr .num + div h4 {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
}
.eyebrow, .mono { font-size: 11px !important; color: var(--c-blue) !important; }
.eyebrow::before { background: var(--c-blue) !important; }

/* Buttons */
.btn, .btn-primary, .btn-navy, .btn-ghost, .btn-ghost-light,
.modal-foot .btn, .login-btn, .header-cta .login-btn,
.dash-topbar .icon-btn, .dash-table .row-action {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
.btn { padding: 9px 18px !important; border-radius: 8px !important; }
.btn.btn-primary, .btn-navy { background: var(--c-blue) !important; color: #fff !important; border-color: var(--c-blue) !important; box-shadow: 0 2px 8px -2px rgba(79,142,220,0.35) !important; }
.btn.btn-primary:hover, .btn-navy:hover { background: var(--c-blue-deep) !important; border-color: var(--c-blue-deep) !important; transform: translateY(-1px); }
.btn.btn-ghost { background: transparent !important; color: var(--c-ink) !important; border: 1.5px solid var(--c-rule-strong) !important; }
.btn.btn-ghost:hover { border-color: var(--c-blue) !important; color: var(--c-blue) !important; background: transparent !important; }
.btn.btn-ghost-light { color: #fff !important; border: 1.5px solid rgba(255,255,255,0.5) !important; }

/* Menu / Nav */
.main-nav a, .mobile-drawer nav a {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--c-ink) !important;
  letter-spacing: 0 !important;
}
.main-nav a.is-active { color: var(--c-blue) !important; }
.mobile-drawer nav a { font-size: 16px !important; color: #fff !important; }

/* ── 3. Spacing reset (compact) ───────────────────────── */
.section, .practices, .testimonial, .pull-quote,
.timeline-dark, .timeline-light, .triptych-dark, .why-connect,
.industries-section, .insights, .cta-dark, .brief-section,
.logo-wall {
  padding: clamp(28px, 4vw, 48px) 0 !important;
}
.hero      { padding: clamp(40px, 5vw, 56px) 0 clamp(28px, 4vw, 44px) !important; }
.page-hero { padding: clamp(24px, 3vw, 40px) 0 !important; }
.container { padding-left: var(--pad-x) !important; padding-right: var(--pad-x) !important; max-width: 1200px !important; }

.dash-page         { padding: 16px 20px 48px !important; }
.dash-topbar       { padding: 12px 20px !important; }
.dash-card         { padding: 16px !important; }
.kpi               { padding: 14px !important; }
.kpi-row           { gap: 12px !important; margin-bottom: 16px !important; }
.dash-page-head    { margin-bottom: 14px !important; }
.dash-grid         { gap: 14px !important; }
.section .head, .practices .head, .industries-section .head { margin-bottom: 20px !important; }

/* Card padding */
.card { padding: 18px !important; }
.case-card .body { padding: 18px !important; }
.insight { padding-top: 16px !important; }
.entry-card { padding: 22px !important; min-height: auto !important; }
.mv-card { padding: 24px !important; min-height: auto !important; }
.principles .pr { padding: 20px 24px 20px 0 !important; }
.principles .pr:nth-child(even) { padding-left: 24px !important; }

/* Grid gaps */
.industries-grid, .practices .grid, .cases, .leaders, .insights .grid, .why-connect .grid,
.entry-cards, .triptych-dark .grid, .timeline-dark .grid { gap: 12px !important; }

/* Hero stats band tighter */
.stats-band .stat { padding: 22px 18px !important; }

/* ── 4. Surfaces ──────────────────────────────────────── */
body.dash-mode { background: var(--c-paper) !important; }

.section, .practices, .industries-section, .insights,
.timeline-dark, .timeline-light, .triptych-dark, .why-connect,
.testimonial, .pull-quote, .stats-band, .brief-section, .logo-wall {
  background: var(--c-paper) !important;
  color: var(--c-ink) !important;
}

/* Cards / blocks — grey */
.card, .case-card, .leader, .insight, .ind-card, .kpi, .dash-card, .mv-card.mv-mission,
.dash-sidebar nav a:not(.is-active), .empty-state, .file-row,
.profile-card, .why-connect .item, .triptych-dark .item, .roster-group .label,
.logo-marquee .logo-tile.tile-img, .logo-marquee .logo-tile.tile-stacked,
.brief-form, .why-connect .item, .entry-card.entry-candidates, .entry-card.entry-whatsapp {
  background: var(--c-card) !important;
  border: 1px solid rgba(20,33,61,0.06) !important;
  border-radius: 10px !important;
  color: var(--c-ink) !important;
}
.case-card, .ind-card, .leader { overflow: hidden; }
.dash-card { border-radius: 12px !important; }
.kpi { border-radius: 10px !important; }
.card:hover, .case-card:hover, .ind-card:hover, .insight:hover { box-shadow: var(--shadow-lg) !important; transform: translateY(-2px); border-color: rgba(79,142,220,0.25) !important; }

/* Forms — white */
.brief-form { background: #fff !important; border: 1px solid var(--c-rule) !important; }
.field input, .field textarea, .field select, .field .fake-select,
.input-group input, .input-group select, .input-group textarea,
.hfk-input, .jobs-search input, .jobs-search select, .tag-input, .dash-topbar .search {
  background: #fff !important;
  color: var(--c-ink) !important;
  border: 1px solid var(--c-rule-strong) !important;
  border-radius: 8px !important;
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 13px !important;
}
.field input:focus, .input-group input:focus, .input-group textarea:focus, .input-group select:focus,
.field textarea:focus, .field select:focus,
.jobs-search input:focus, .jobs-search select:focus {
  border-color: var(--c-blue) !important;
  box-shadow: 0 0 0 3px rgba(79,142,220,0.15) !important;
}
.jobs-search { background: #fff !important; border-radius: 10px !important; }
.jobs-filter { background: #fff !important; border-radius: 10px !important; }

/* Industry hover-card — was navy gradient, now subtle */
.ind-card:hover { background: var(--c-paper) !important; color: var(--c-ink) !important; border-color: var(--c-blue) !important; }
.ind-card:hover h4 { color: var(--c-ink) !important; }
.ind-card:hover .bignum { color: rgba(79,142,220,0.18) !important; }
.ind-card:hover .ind-stat { color: var(--c-blue) !important; }
.ind-card .bignum { color: rgba(79,142,220,0.15) !important; }
.ind-card .ind-stat { color: var(--c-blue) !important; }

/* Stats band — light surface */
.stats-band { background: var(--c-card) !important; border-color: transparent !important; }
.stats-band .stat { border-color: rgba(20,33,61,0.08) !important; }
.stats-band .num { color: var(--c-blue) !important; }
.stats-band .lbl { color: var(--c-ink-2) !important; }

/* Timeline dark — make light */
.timeline-dark { background: var(--c-paper) !important; color: var(--c-ink) !important; }
.timeline-dark h2, .timeline-dark h4 { color: var(--c-ink) !important; }
.timeline-dark .desc { color: var(--c-ink-2) !important; }
.timeline-dark .dot { background: #fff !important; color: var(--c-blue) !important; border-color: var(--c-blue) !important; }
.timeline-dark .eyebrow { color: var(--c-blue) !important; }
.timeline-dark .line { background: var(--c-rule-strong) !important; }

/* Triptych — light */
.triptych-dark { background: var(--c-paper) !important; color: var(--c-ink) !important; }
.triptych-dark blockquote { color: var(--c-ink) !important; }
.triptych-dark cite { color: var(--c-blue) !important; }
.triptych-dark .item { background: var(--c-card) !important; border: 1px solid var(--c-rule) !important; border-radius: 10px !important; padding: 18px !important; }
.triptych-dark .eyebrow { color: var(--c-blue) !important; }
.triptych-dark .mark { background: var(--grad-brand) !important; }

/* Why-connect — keep light grid */
.why-connect { background: var(--c-paper) !important; color: var(--c-ink) !important; }
.why-connect h2 { color: var(--c-ink) !important; }
.why-connect .grid { background: transparent !important; }
.why-connect .item { background: var(--c-card) !important; padding: 18px !important; }
.why-connect .item h4 { color: var(--c-ink) !important; }

/* Mission/Vision — vision becomes blue card */
.mv-vision { background: var(--c-blue) !important; color: #fff !important; }
.mv-vision h3, .mv-vision .tag { color: #fff !important; }
.mv-vision::after { display: none !important; }

/* CTA dark sections — keep as accent, slimmer */
.cta-dark {
  background: linear-gradient(135deg, var(--c-blue) 0%, var(--c-blue-deep) 100%) !important;
  padding: clamp(36px, 5vw, 60px) 0 !important;
}
.cta-dark::before { display: none !important; }
.cta-dark h2 { color: #fff !important; }
.cta-dark p { color: rgba(255,255,255,0.92) !important; }
.cta-dark .eyebrow, .cta-dark .eyebrow::before { color: rgba(255,255,255,0.9) !important; background-color: rgba(255,255,255,0.9) !important; }
.cta-dark .btn.btn-primary { background: #fff !important; color: var(--c-blue) !important; border-color: #fff !important; }
.cta-dark .btn.btn-primary:hover { background: var(--c-blue-pale) !important; color: var(--c-blue-deep) !important; }
.cta-dark .btn.btn-ghost-light { color: #fff !important; border-color: rgba(255,255,255,0.6) !important; }

/* Entry cards (Contact) */
.entry-employers { background: var(--c-blue) !important; color: #fff !important; }
.entry-employers h3, .entry-employers .tag { color: #fff !important; }
.entry-employers p { color: rgba(255,255,255,0.92) !important; opacity: 1 !important; }
.entry-employers .btn { background: #fff !important; color: var(--c-blue) !important; border-color: #fff !important; }
.entry-employers::after { display: none !important; }

/* Pull quote — soft */
.pull-quote { background: var(--c-paper) !important; }
.pull-quote .mark { background: var(--grad-brand) !important; box-shadow: 0 6px 16px -6px rgba(79,142,220,0.4) !important; }

/* Hero — keep dynamic but use the blue, lighter */
.hero {
  background: linear-gradient(135deg, var(--c-blue-deep) 0%, var(--c-blue) 100%) !important;
  color: #fff !important;
}
.hero h1, .hero h2, .hero h3 { color: #fff !important; }
.hero .lede { color: rgba(255,255,255,0.92) !important; }
.hero::before, .hero::after { opacity: 0.4; }

/* ── 5. Header — white, compact ────────────────────────── */
.utility-bar {
  background: #fff !important;
  color: var(--c-ink-2) !important;
  border-bottom: 1px solid var(--c-rule) !important;
  padding: 6px 0 !important;
}
.utility-bar a { color: var(--c-ink-2) !important; }
.utility-bar a:hover { color: var(--c-blue) !important; }
.utility-bar .container { font-size: 11px !important; }

.site-header {
  background: #fff !important;
  border-bottom: 1px solid var(--c-rule) !important;
  box-shadow: 0 1px 3px rgba(20,33,61,0.04);
}
.site-header .container { padding-top: 10px !important; padding-bottom: 10px !important; }
.brand-mark { width: 36px !important; height: 36px !important; padding: 4px !important; background: #fff !important; border: 1px solid var(--c-rule) !important; border-radius: 6px !important; }
.brand-text .name { color: var(--c-ink) !important; font-size: 16px !important; font-weight: 700 !important; }
.brand-text .sub  { color: var(--c-blue) !important; font-size: 9px !important; letter-spacing: 0.3em !important; }
.menu-toggle { color: var(--c-ink) !important; border-color: var(--c-rule-strong) !important; }
.menu-toggle span { background: var(--c-ink) !important; }

.main-nav a { padding: 4px 0 !important; }
.main-nav a::after { background: var(--c-blue) !important; }
.main-nav a.is-active { border-bottom: 0 !important; }

.header-cta .login-btn { color: var(--c-ink) !important; }
.header-cta .login-btn:hover { color: var(--c-blue) !important; background: var(--c-paper-2) !important; }
.user-chip { background: var(--c-paper-2) !important; border-color: var(--c-rule) !important; color: var(--c-ink) !important; }
.user-chip:hover { background: var(--c-paper-3) !important; }

/* ── 6. Footer — blue ─────────────────────────────────── */
.site-footer {
  background: var(--c-blue) !important;
  color: #fff !important;
  padding: clamp(28px, 4vw, 48px) 0 18px !important;
}
.site-footer .grid { padding-bottom: 24px !important; border-bottom: 1px solid rgba(255,255,255,0.18) !important; }
.site-footer .brand-block .name { color: #fff !important; }
.site-footer .brand-block .name em { color: #fff !important; -webkit-text-fill-color: #fff !important; }
.site-footer .brand-block .sub, .site-footer h6 { color: rgba(255,255,255,0.85) !important; }
.site-footer .brand-block p, .site-footer li, .site-footer li a, .site-footer .meta { color: #fff !important; }
.site-footer li a:hover { color: var(--c-blue-pale) !important; }
.site-footer .social a { border-color: rgba(255,255,255,0.4) !important; color: #fff !important; }
.site-footer .social a:hover { background: #fff !important; color: var(--c-blue) !important; border-color: #fff !important; }
.site-footer .meta { color: rgba(255,255,255,0.85) !important; }

/* ── 7. Dashboard surfaces ───────────────────────────── */
.dash-sidebar {
  background: linear-gradient(180deg, var(--c-navy) 0%, var(--c-navy-darker) 100%) !important;
}
.dash-sidebar .brand .name { color: #fff !important; font-size: 14px !important; }
.dash-sidebar .brand .role { color: var(--c-blue-pale) !important; }
.dash-sidebar nav a { background: transparent !important; color: rgba(255,255,255,0.75) !important; font-size: 13px !important; font-weight: 500 !important; border: 0 !important; }
.dash-sidebar nav a:hover { background: rgba(255,255,255,0.06) !important; color: #fff !important; }
.dash-sidebar nav a.is-active { background: var(--c-blue) !important; color: #fff !important; }
.dash-sidebar .section-label { color: rgba(255,255,255,0.4) !important; }
.dash-sidebar .foot a { color: rgba(255,255,255,0.6) !important; }

.dash-topbar { background: #fff !important; border-bottom: 1px solid var(--c-rule) !important; }
.dash-topbar .greet h1 { font-size: 16px !important; }
.dash-topbar .search { background: var(--c-card) !important; border-radius: 8px !important; }
.dash-topbar .icon-btn { background: var(--c-card) !important; border-radius: 8px !important; }
.dash-topbar .user { background: var(--c-card) !important; }
.dash-topbar .user .avatar, .user-chip .avatar { background: var(--c-blue) !important; color: #fff !important; }

.kpi .ic { background: rgba(79,142,220,0.1) !important; color: var(--c-blue) !important; }
.kpi.green .ic { background: rgba(16,185,129,0.1) !important; color: var(--c-success) !important; }
.kpi.amber .ic { background: rgba(245,158,11,0.1) !important; color: var(--c-warning) !important; }
.kpi.indigo .ic { background: rgba(79,142,220,0.1) !important; color: var(--c-blue) !important; }
.kpi .num { color: var(--c-ink) !important; font-size: 24px !important; }
.kpi .lbl { color: var(--c-ink-2) !important; }

.dash-card .head h3 { font-size: 14px !important; }
.dash-table th { background: var(--c-paper-2) !important; color: var(--c-ink-2) !important; font-size: 11px !important; }
.dash-table tbody tr:hover { background: var(--c-paper-2) !important; }
.dash-table td { font-size: 13px !important; }

/* Status badges */
.status-badge { font-size: 11px !important; padding: 3px 10px !important; border-radius: 100px !important; }
.status-badge.active   { background: rgba(16,185,129,0.12) !important; color: var(--c-success) !important; }
.status-badge.pending  { background: rgba(245,158,11,0.12) !important; color: var(--c-warning) !important; }
.status-badge.approved { background: rgba(79,142,220,0.12) !important; color: var(--c-blue) !important; }
.status-badge.draft    { background: rgba(20,33,61,0.08) !important; color: var(--c-ink-2) !important; }
.status-badge.closed   { background: rgba(239,68,68,0.1)  !important; color: var(--c-danger) !important; }

/* Pills */
.pill { background: rgba(20,33,61,0.06) !important; color: var(--c-ink) !important; border-radius: 6px !important; }
.pill.blue { background: rgba(79,142,220,0.1) !important; color: var(--c-blue) !important; }
.pill.green { background: rgba(16,185,129,0.1) !important; color: var(--c-success) !important; }
.pill.amber { background: rgba(245,158,11,0.1) !important; color: var(--c-warning) !important; }
.pill.red   { background: rgba(239,68,68,0.1) !important; color: var(--c-danger) !important; }

/* Job cards / case cards / insights */
.job-card { background: #fff !important; border: 1px solid var(--c-rule) !important; border-radius: 10px !important; }
.job-card:hover { border-color: var(--c-blue) !important; }
.job-card .co-logo { background: var(--c-card) !important; color: var(--c-ink) !important; border-color: var(--c-rule) !important; }
.job-card .ttl { font-size: 14px !important; }
.job-card .co { font-size: 13px !important; }
.job-card .salary { color: var(--c-ink) !important; font-size: 14px !important; }
.save-btn { font-size: 11px !important; }
.save-btn.is-saved { background: var(--c-blue) !important; border-color: var(--c-blue) !important; }

/* ── 8. Modal ─────────────────────────────────────────── */
.modal { border-radius: 14px !important; }
.modal-head { background: linear-gradient(135deg, var(--c-blue) 0%, var(--c-blue-deep) 100%) !important; padding: 22px 26px 22px !important; }
.modal-head h2 { color: #fff !important; font-size: 18px !important; }
.modal-head p { color: rgba(255,255,255,0.92) !important; font-size: 12px !important; }
.modal-head::before { display: none !important; }
.modal-head .brand-row span { color: #fff !important; }
.modal-tabs { background: var(--c-paper-2) !important; }
.modal-tab { font-size: 12px !important; padding: 12px !important; }
.modal-tab.is-active { color: var(--c-blue) !important; border-bottom-color: var(--c-blue) !important; }
.modal-body, .modal-foot { padding: 20px 26px !important; }
.input-group label { font-size: 11px !important; letter-spacing: 0.04em !important; }
.input-group input, .input-group select, .input-group textarea { padding: 10px 12px !important; font-size: 13px !important; }
.role-row .role-card { padding: 12px 10px !important; border-radius: 8px !important; }
.modal-foot .btn { padding: 11px 18px !important; }

/* ── 9. Marquee / logo wall tightening ───────────────── */
.logo-wall { background: var(--c-paper) !important; padding: clamp(24px, 3vw, 40px) 0 !important; border-top: 1px solid var(--c-rule) !important; border-bottom: 1px solid var(--c-rule) !important; }
.logo-wall h2 { font-size: 18px !important; }
.logo-wall .head { margin-bottom: 18px !important; }
.logo-marquee .logo-tile.tile-img { height: 76px !important; min-width: 180px !important; padding: 14px 22px !important; background: #fff !important; }
.logo-marquee .logo-tile.tile-img img { max-height: 42px !important; }
.logo-marquee .logo-tile.tile-stacked { background: #fff !important; color: var(--c-ink) !important; }
.logo-marquee .logo-tile.tile-stacked .sub-line { color: var(--c-blue) !important; }

/* ── 10. Toasts / sticky CTA ─────────────────────────── */
.toast { border-radius: 8px !important; font-size: 13px !important; }
.sticky-cta { background: var(--c-blue) !important; border-top-color: rgba(255,255,255,0.3) !important; }
.sticky-cta .text .lbl { color: rgba(255,255,255,0.9) !important; }
.sticky-cta .text .sub { color: #fff !important; }
.sticky-cta .btn.btn-primary { background: #fff !important; color: var(--c-blue) !important; border-color: #fff !important; }

/* Admin floating login pill */
.footer-admin-btn {
  background: rgba(255,255,255,0.95) !important;
  color: var(--c-ink) !important;
  border: 1px solid var(--c-rule-strong) !important;
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
.footer-admin-btn:hover { background: var(--c-blue) !important; color: #fff !important; border-color: var(--c-blue) !important; }

/* WhatsApp FAB — keep its green */
.wa-fab { background: #25D366 !important; }

/* ── 11. Responsive tightening ───────────────────────── */
@media (max-width: 880px) {
  .section, .practices, .testimonial, .pull-quote, .timeline-dark, .timeline-light,
  .triptych-dark, .why-connect, .industries-section, .insights, .cta-dark, .brief-section, .logo-wall {
    padding: 28px 0 !important;
  }
  .hero { padding: 32px 0 !important; }
  .page-hero { padding: 22px 0 !important; }
  .dash-page { padding: 12px !important; }
  .modal-head, .modal-body, .modal-foot { padding-left: 18px !important; padding-right: 18px !important; }
  h1, h2, h3 { font-size: 15px !important; }
  .hero .h1, .page-hero .h1 { font-size: 22px !important; }
  .display.h2 { font-size: 17px !important; }
}