/* ─────────────────────────────────────────────────────────────────
   PRIBAIT · Global Styles v2 (Multi-page)
   Stack: Alpine.js + GSAP ScrollTrigger + Vanilla JS i18n
   ───────────────────────────────────────────────────────────────── */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Manrope:wght@400;600;700;800;900&family=Inter:wght@300;400;500;600&family=JetBrains+Mono:wght@400;500;600&display=swap');

html { scroll-behavior: smooth; }

/* ── Design Tokens ─────────────────────────────────────────────── */
:root {
  --navy:         #0B4F7E;
  --navy-dark:    #083D62;
  --navy-deep:    #052C47;
  --navy-deeper:  #031D30;
  --sky:          #B9E4FF;
  --sky-mid:      #74C3F0;
  --sky-light:    #E0F4FF;
  --sky-pale:     #F0F9FF;
  --white:        #FFFFFF;
  --off-white:    #F7FBFF;
  --gray-50:      #F8FAFC;
  --gray-100:     #EFF6FF;
  --text:         #0F172A;
  --text-muted:   #64748B;
  --text-faint:   #94A3B8;
  --border:       rgba(11,79,126,.1);
  --border-dark:  rgba(11,79,126,.2);
  --shadow-xs:    0 1px 4px rgba(11,79,126,.06);
  --shadow-sm:    0 2px 12px rgba(11,79,126,.09);
  --shadow-md:    0 8px 32px rgba(11,79,126,.14);
  --shadow-lg:    0 20px 60px rgba(11,79,126,.18);
  --shadow-xl:    0 32px 96px rgba(11,79,126,.22);
  --radius-sm:    8px;
  --radius-md:    12px;
  --radius-lg:    20px;
  --radius-xl:    28px;
  --ease:         cubic-bezier(0.4, 0, 0.2, 1);
  --ease-spring:  cubic-bezier(0.34, 1.56, 0.64, 1);
  --header-h:     86px; /* top:22px + pill height 62px + 2 */
}

/* ── Reset ─────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Inter', system-ui, sans-serif;
  background: var(--white);
  color: var(--text);
  overflow-x: hidden;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
img, svg { display: block; max-width: 100%; }
a { text-decoration: none; color: inherit; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }
ul, ol { list-style: none; }
::selection { background: var(--sky); color: var(--navy-deep); }
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: var(--sky-pale); }
::-webkit-scrollbar-thumb { background: var(--navy); border-radius: 4px; }

/* ══════════════════════════════════════════════════════════════════
   PILL HEADER (inspired by pribait_2.html)
══════════════════════════════════════════════════════════════════ */
#siteHeader {
  position: fixed;
  top: 20px; left: 0; right: 0;
  z-index: 9000;
  padding: 0 clamp(1rem, 3vw, 2rem);
}

.nav-pill {
  max-width: 1120px;
  margin: 0 auto;
  background: var(--navy);
  border-radius: 14px;
  box-shadow: 0 8px 32px rgba(11,79,126,.28), 0 2px 8px rgba(11,79,126,.18);
  height: 62px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  padding: 0 20px;
  transition: box-shadow 0.3s var(--ease);
  gap: 8px;
  overflow: visible;
}

/* Logo */
.nav-logo {
  display: flex;
  align-items: center;
  gap: 9px;
  text-decoration: none;
  flex-shrink: 0;
}
.nav-logo-img {
  height: 46px;
  width: auto;
  display: block;
  opacity: .95;
  transition: opacity .2s;
  filter: brightness(0) invert(1);
}
.nav-logo:hover .nav-logo-img { opacity: 1; }

/* Center nav */
.nav-center {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
}

.nav-link {
  display: flex;
  align-items: center;
  gap: 3px;
  padding: 6px 13px;
  border-radius: 7px;
  font-family: 'Manrope', sans-serif;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  text-transform: none;
  color: rgba(255,255,255,.75);
  text-decoration: none;
  transition: color 0.18s, background 0.18s;
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
}
.nav-link:hover,
.nav-link--active { color: #fff; background: rgba(255,255,255,.12); }
.nav-link--active { background: rgba(255,255,255,.15); }
.chev { width: 13px; height: 13px; opacity: .55; transition: transform 0.2s, opacity 0.2s; flex-shrink: 0; }
.nav-link:hover .chev { transform: translateY(2px); opacity: .9; }

/* Dropdown */
.has-drop { position: static; }
.dropdown {
  position: fixed;
  min-width: 220px;
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 16px 48px rgba(11,79,126,.18), 0 4px 12px rgba(11,79,126,.10);
  border: 1px solid rgba(11,79,126,.08);
  padding: 7px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-8px);
  transition: opacity 0.18s var(--ease), transform 0.18s var(--ease), visibility 0.18s;
  pointer-events: none;
  z-index: 99999;
}
.dropdown::before {
  content: '';
  position: absolute;
  top: -6px; left: 24px;
  border: 6px solid transparent;
  border-top: none;
  border-bottom-color: #fff;
}
.has-drop.open .dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: all;
}
.dropdown-wide { min-width: 260px; }
.drop-section-label {
  font-family: 'Manrope', sans-serif;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--text-faint);
  padding: 8px 12px 4px;
}
.drop-divider { height: 1px; background: var(--border); margin: 5px 8px; }
.drop-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 8px;
  text-decoration: none;
  transition: background 0.15s;
  cursor: pointer;
  width: 100%;
  text-align: left;
  border: none;
  background: none;
}
.drop-item:hover { background: var(--sky-pale); }
.drop-icon { font-size: 15px; flex-shrink: 0; width: 20px; text-align: center; font-family: 'Manrope', sans-serif; font-weight: 700; color: var(--navy); }
.lang-code { font-family: 'Manrope', sans-serif; font-size: 0.72rem; font-weight: 800; color: var(--navy); letter-spacing: 0.04em; }
.drop-icon-text { font-family: 'Manrope', sans-serif; font-size: 0.62rem; font-weight: 800; color: var(--navy); width: auto; }
.drop-text { display: flex; flex-direction: column; }
.drop-label { font-family: 'Manrope', sans-serif; font-size: 0.84rem; font-weight: 700; color: var(--navy); line-height: 1.3; }
.drop-sub { font-size: 0.76rem; color: var(--text-muted); margin-top: 3px; line-height: 1.4; }
.drop-item-desc { align-items: flex-start; padding: 10px 12px; }
.drop-item-desc:hover .drop-label { color: var(--primary); }
.drop-item-sector { padding: 9px 12px; }
.drop-item-sector:hover .drop-label { color: var(--primary); }
.dropdown-wide { min-width: 260px; }
.drop-item-all { color: var(--navy); font-family: 'Manrope', sans-serif; font-size: 0.8rem; font-weight: 700; justify-content: space-between; }
.drop-item-all:hover { background: var(--sky-light); }
.nav-link-btn { background: none; border: none; }

/* Language dropdown */
.lang-dropdown { min-width: 170px; left: auto; right: 0; transform: translateY(-8px); }
.lang-dropdown::before { left: auto; right: 18px; transform: none; }
.has-drop.open .lang-dropdown { transform: translateY(0); }
.lang-opt.active { background: var(--sky-light); }
.lang-opt.active .drop-label { font-weight: 700; }

/* Right */
.nav-right {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}
.nav-divider {
  width: 1px; height: 24px;
  background: rgba(255,255,255,.18);
  margin-right: 4px;
}

/* Lang button */
.lang-btn {
  gap: 5px;
  font-size: 10px;
  letter-spacing: 0.1em;
}

/* CTA button in nav */
.btn-demo {
  font-family: 'Manrope', sans-serif;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  text-transform: none;
  color: #fff;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 8px;
  padding: 8px 18px;
  text-decoration: none;
  transition: background 0.2s, border-color 0.2s, box-shadow 0.2s;
  white-space: nowrap;
}
.btn-demo:hover {
  background: rgba(255,255,255,.18);
  border-color: rgba(255,255,255,.5);
  box-shadow: 0 4px 14px rgba(0,0,0,.15);
}

/* Hamburger */
.hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  padding: 4px;
  background: none;
  border: none;
  margin-left: 8px;
}
.hamburger span {
  display: block;
  width: 20px; height: 2px;
  background: rgba(255,255,255,.85);
  border-radius: 2px;
  transition: transform 0.25s, opacity 0.25s;
}
.hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity: 0; }
.hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Mobile menu pill */
.mobile-menu {
  position: fixed;
  top: 96px; left: clamp(1rem,3vw,2rem); right: clamp(1rem,3vw,2rem);
  background: var(--navy-deep);
  border-radius: 14px;
  padding: 14px;
  box-shadow: 0 16px 48px rgba(11,79,126,.35);
  display: none;
  flex-direction: column;
  gap: 3px;
  z-index: 8999;
  max-width: 1120px;
  margin: 0 auto;
}
.mobile-menu.open { display: flex; }
.mob-link {
  padding: 9px 14px;
  border-radius: 8px;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 0.88rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: rgba(255,255,255,.82);
  text-decoration: none;
  transition: background 0.15s;
}
.mob-link:hover { background: rgba(255,255,255,.1); color: #fff; }
.mob-divider { height: 1px; background: rgba(255,255,255,.1); margin: 4px 0; }
.mob-lang-btn {
  flex: 1;
  padding: 7px;
  border-radius: 7px;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: rgba(255,255,255,.75);
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.12);
  transition: background 0.15s, color 0.15s;
}
.mob-lang-btn:hover,
.mob-lang-btn.active { background: rgba(255,255,255,.18); color: #fff; }
.mob-cta {
  margin-top: 6px;
  display: block;
  text-align: center;
  padding: 11px;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 9px;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: #fff;
  text-decoration: none;
  transition: background 0.2s;
}
.mob-cta:hover { background: rgba(255,255,255,.18); }

/* ══════════════════════════════════════════════════════════════════
   LAYOUT PRIMITIVES
══════════════════════════════════════════════════════════════════ */
.container {
  max-width: 1120px;
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 4vw, 2.5rem);
}
.section { padding-block: clamp(72px, 9vw, 120px); }

/* Page top padding to clear pill header */
.page-top { padding-top: var(--header-h); }

/* ── Eyebrow ─────────────────────────────────────────────────── */
.eyebrow {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-bottom: 14px;
}
.eyebrow-line { width: 32px; height: 1.5px; background: var(--navy); opacity: .3; border-radius: 2px; }
.eyebrow-text {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 0.67rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--navy);
}
.eyebrow.light .eyebrow-line { background: var(--sky); opacity: .45; }
.eyebrow.light .eyebrow-text { color: var(--sky); }
.eyebrow.left { justify-content: flex-start; }

/* ── Section headings ────────────────────────────────────────── */
.section-title {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(1.85rem, 3.5vw, 2.75rem);
  font-weight: 800;
  letter-spacing: -0.025em;
  line-height: 1.1;
  color: var(--text);
  text-align: center;
  margin-bottom: 12px;
}
.section-title.light { color: #fff; }
.section-title.left { text-align: left; }
.section-sub {
  text-align: center;
  font-size: 1.02rem;
  color: var(--text-muted);
  max-width: 540px;
  margin-inline: auto;
  line-height: 1.8;
  margin-bottom: 60px;
}
.section-sub.light { color: rgba(255,255,255,.55); }
.section-sub.left { text-align: left; margin-inline: 0; }

/* ── Gradient text ────────────────────────────────────────────── */
.gradient-text {
  background: linear-gradient(135deg, var(--navy) 0%, #1a7fc2 45%, #38b6e6 100%);
  background-size: 200%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: gradShift 4s ease infinite;
}
@keyframes gradShift { 0%,100%{background-position:0% 50%} 50%{background-position:100% 50%} }

/* ── Buttons ─────────────────────────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 26px;
  border-radius: 10px;
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: 0.88rem;
  letter-spacing: 0.01em;
  transition: all 0.22s var(--ease);
  cursor: pointer;
}
.btn-primary {
  background: var(--navy);
  color: #fff;
  box-shadow: 0 4px 20px rgba(11,79,126,.32);
}
.btn-primary:hover { background: var(--navy-dark); box-shadow: 0 8px 28px rgba(11,79,126,.42); transform: translateY(-2px); }
.btn-outline { border: 1.5px solid rgba(11,79,126,.22); color: var(--navy); }
.btn-outline:hover { border-color: var(--navy); background: var(--sky-light); transform: translateY(-2px); }
.btn-sky { background: linear-gradient(135deg, var(--sky), var(--sky-mid)); color: var(--navy-deep); box-shadow: 0 4px 18px rgba(185,228,255,.42); }
.btn-sky:hover { box-shadow: 0 8px 28px rgba(185,228,255,.55); transform: translateY(-2px); }
.btn-white { background: #fff; color: var(--navy-deep); box-shadow: 0 4px 20px rgba(0,0,0,.1); }
.btn-white:hover { transform: translateY(-2px); box-shadow: 0 8px 32px rgba(0,0,0,.16); }
.btn-outline-white { border: 1.5px solid rgba(255,255,255,.3); color: #fff; }
.btn-outline-white:hover { border-color: #fff; background: rgba(255,255,255,.1); transform: translateY(-2px); }

/* ── Card ─────────────────────────────────────────────────────── */
.card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  transition: border-color 0.25s, box-shadow 0.25s, transform 0.25s var(--ease);
}
.card:hover { border-color: var(--border-dark); box-shadow: var(--shadow-md); transform: translateY(-5px); }

/* ── Tag / badge ──────────────────────────────────────────────── */
.tag {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 100px;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.tag-navy { background: var(--sky-light); color: var(--navy); }
.tag-green { background: #DCFCE7; color: #166534; }
.tag-amber { background: #FEF3C7; color: #92400E; }
.tag-red { background: #FEE2E2; color: #991B1B; }

/* ══════════════════════════════════════════════════════════════════
   PAGE HERO (shared hero structure for inner pages)
══════════════════════════════════════════════════════════════════ */
.page-hero {
  padding-top: calc(var(--header-h) + 40px);
  padding-bottom: 56px;
  position: relative;
  overflow: hidden;
}
.page-hero-bg {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(11,79,126,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(11,79,126,.045) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: radial-gradient(ellipse 80% 80% at 50% 40%, black 35%, transparent 100%);
  -webkit-mask-image: radial-gradient(ellipse 80% 80% at 50% 40%, black 35%, transparent 100%);
}
.page-hero-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  pointer-events: none;
}
.page-hero-orb-1 { width: 500px; height: 500px; background: radial-gradient(circle,rgba(185,228,255,.35)0%,transparent 65%); top:-100px;right:-100px; }
.page-hero-orb-2 { width: 320px; height: 320px; background: radial-gradient(circle,rgba(11,79,126,.12)0%,transparent 65%); bottom:0;left:-60px; }
.page-hero-inner { position: relative; z-index: 1; text-align: center; }
.page-hero-h1 {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(2.4rem, 5vw, 3.8rem);
  font-weight: 900;
  letter-spacing: -0.035em;
  line-height: 1.08;
  color: var(--text);
  margin-bottom: 20px;
  max-width: 780px;
  margin-inline: auto;
}
.page-hero-sub {
  font-size: 1.1rem;
  color: var(--text-muted);
  line-height: 1.8;
  max-width: 560px;
  margin-inline: auto;
  margin-bottom: 36px;
}
.page-hero-actions { display: flex; justify-content: center; gap: 14px; flex-wrap: wrap; }

/* Page hero metrics strip */
.hero-metrics {
  display: flex;
  justify-content: center;
  gap: 48px;
  margin-top: 52px;
  padding-top: 40px;
  border-top: 1px solid var(--border);
  flex-wrap: wrap;
}
.hero-metric-num {
  font-family: 'Manrope', sans-serif;
  font-size: 2rem;
  font-weight: 900;
  color: var(--navy);
  letter-spacing: -0.03em;
}
.hero-metric-label { font-size: 0.8rem; color: var(--text-muted); margin-top: 3px; }

/* ══════════════════════════════════════════════════════════════════
   HOME HERO
══════════════════════════════════════════════════════════════════ */
#home-hero {
  min-height: 100vh;
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
  padding-top: calc(var(--header-h) + 10px);
  padding-bottom: 40px;
}
.hero-grid-bg {
  position: absolute; inset: 0;
  background-image: linear-gradient(rgba(11,79,126,.05) 1px,transparent 1px), linear-gradient(90deg,rgba(11,79,126,.05) 1px,transparent 1px);
  background-size: 54px 54px;
  mask-image: radial-gradient(ellipse 90% 80% at 50% 50%,black 30%,transparent 100%);
  -webkit-mask-image: radial-gradient(ellipse 90% 80% at 50% 50%,black 30%,transparent 100%);
}
.orb { position:absolute; border-radius:50%; filter:blur(90px); pointer-events:none; }
.orb-1 { width:660px;height:660px; background:radial-gradient(circle,rgba(185,228,255,.36)0%,transparent 65%); top:-170px;right:-140px; }
.orb-2 { width:420px;height:420px; background:radial-gradient(circle,rgba(11,79,126,.13)0%,transparent 65%); bottom:60px;left:-90px; }
.orb-3 { width:280px;height:280px; background:radial-gradient(circle,rgba(185,228,255,.18)0%,transparent 70%); top:42%;left:42%; }

.hero-inner {
  display: grid;
  grid-template-columns: 1fr 1.08fr;
  gap: 72px;
  align-items: center;
  padding-block: 20px 20px;
  position: relative; z-index: 1;
}
.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 13px 5px 7px;
  background: rgba(185,228,255,.26);
  border: 1px solid rgba(185,228,255,.58);
  border-radius: 100px;
  margin-bottom: 26px;
}
.badge-dot { width: 8px; height: 8px; background: var(--navy); border-radius: 50%; }
.hero-badge span {
  font-family: 'Manrope', sans-serif;
  font-size: 0.67rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  color: var(--navy);
  text-transform: uppercase;
}
.hero-h1 {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(2.5rem, 5vw, 4rem);
  font-weight: 900;
  letter-spacing: -0.035em;
  line-height: 1.06;
  color: var(--text);
  margin-bottom: 22px;
}
.hero-h1-blue { color: #0b4f7e; }
.hero-desc { font-size: 1.05rem; color: var(--text-muted); line-height: 1.8; max-width: 490px; margin-bottom: 36px; }
.hero-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 48px; }
.hero-stats { display: flex; gap: 32px; padding-top: 28px; border-top: 1px solid var(--border); }
.stat-num { font-family: 'Manrope', sans-serif; font-size: 1.7rem; font-weight: 900; color: var(--navy); letter-spacing: -0.03em; }
.stat-label { font-size: 0.77rem; color: var(--text-muted); margin-top: 3px; line-height: 1.4; }

/* Dashboard mockup */
.hero-visual { position: relative; }
.dashboard-frame {
  background: #fff;
  border: 1px solid rgba(11,79,126,.12);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-xl);
  overflow: hidden;
}
.df-bar { background: var(--navy-deeper); padding: 12px 16px; display: flex; align-items: center; gap: 6px; }
.df-dot { width: 11px; height: 11px; border-radius: 50%; }
.df-bar span { margin-left: 10px; background: rgba(255,255,255,.07); border-radius: 5px; padding: 4px 12px; font-family: 'JetBrains Mono',monospace; font-size: 0.65rem; color: rgba(255,255,255,.4); flex: 1; }
.df-body { display: grid; grid-template-columns: 155px 1fr; }
.df-sidebar { background: var(--off-white); border-right: 1px solid var(--border); padding: 14px 10px; }
.df-bar-logo { height: 26px; width: auto; opacity: .85; }
.df-nav-item { display: flex; align-items: center; gap: 7px; padding: 7px 10px; border-radius: 6px; font-size: 0.74rem; font-weight: 500; color: var(--text-muted); margin-bottom: 2px; cursor: default; transition: background 0.15s, color 0.15s; }
.df-nav-item:hover { background: var(--sky-light); color: var(--navy); }
.df-nav-item.active { background: var(--navy); color: #fff; }
.df-nav-dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: .45; flex-shrink: 0; }
.df-nav-item.active .df-nav-dot { opacity: 1; }
.df-nav-nowrap { white-space: nowrap; }
.df-main { padding: 16px; position: relative; min-height: 180px; }

/* Panel system — smooth crossfade */
.df-panel {
  position: absolute;
  inset: 0;
  padding: 16px;
  opacity: 0;
  transform: translateY(3px);
  transition: opacity .6s ease, transform .6s ease;
  pointer-events: none;
  visibility: hidden;
}
.df-panel-active {
  position: relative;
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
  visibility: visible;
}

/* Smooth sidebar active transition */
.df-nav-item { transition: background .5s ease, color .5s ease, box-shadow .5s ease; }

.df-panel-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.df-panel-title { font-family:'Manrope',sans-serif; font-size:0.72rem; font-weight:800; color:var(--text); }

/* Documents panel (original) */
.df-metrics { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; margin-bottom: 10px; }
.df-metric { background: #fff; border: 1px solid var(--border); border-radius: 9px; padding: 11px; }
.df-metric-label { font-size: 0.62rem; text-transform: uppercase; letter-spacing: .05em; color: var(--text-muted); font-weight: 500; margin-bottom: 4px; }
.df-metric-value { font-family: 'Manrope',sans-serif; font-size: 1.25rem; font-weight: 800; color: var(--navy); }
.df-badge { display: inline-block; margin-top: 2px; padding: 2px 7px; border-radius: 100px; font-size: 0.6rem; font-weight: 700; }
.badge-g { background: #DCFCE7; color: #166534; }
.badge-b { background: var(--sky-light); color: var(--navy); }
.badge-r { background: #FEE2E2; color: #991B1B; }
.badge-y { background: #FEF3C7; color: #92400E; }
.df-chart { background: #fff; border: 1px solid var(--border); border-radius: 9px; padding: 11px; }
.df-chart-title { font-size: 0.62rem; text-transform: uppercase; letter-spacing: .05em; color: var(--text-muted); font-weight: 500; margin-bottom: 9px; }
.chart-bars { display: flex; align-items: flex-end; gap: 5px; height: 46px; }
.c-bar { flex: 1; border-radius: 3px 3px 0 0; background: var(--sky); }
.c-bar.hi { background: var(--navy); }

/* Alerts panel */
.df-alert-list { display:flex; flex-direction:column; gap:6px; }
.df-alert-row { display:flex; align-items:center; gap:8px; padding:7px 10px; background:#fff; border:1px solid var(--border); border-radius:8px; transition:background .15s; }
.df-alert-row:hover { background:var(--sky-pale); }
.df-alert-dot { width:7px; height:7px; border-radius:50%; flex-shrink:0; }
.df-dot-red { background:#EF4444; }
.df-dot-yellow { background:#F59E0B; }
.df-dot-green { background:#22C55E; }
.df-alert-info { flex:1; display:flex; flex-direction:column; gap:1px; min-width:0; }
.df-alert-name { font-family:'Manrope',sans-serif; font-size:0.68rem; font-weight:700; color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.df-alert-meta { font-size:0.58rem; color:var(--text-faint); }
.df-alert-row .df-badge { margin-top:0; flex-shrink:0; }

/* Exfiltrations panel */
.df-exf-grid { display:flex; flex-direction:column; gap:8px; margin-bottom:10px; }
.df-exf-card { background:#fff; border:1px solid var(--border); border-radius:8px; padding:9px 11px; }
.df-exf-top { display:flex; justify-content:space-between; align-items:center; margin-bottom:5px; }
.df-exf-dest { font-family:'Manrope',sans-serif; font-size:0.68rem; font-weight:700; color:var(--text); }
.df-exf-count { font-family:'Manrope',sans-serif; font-size:0.72rem; font-weight:800; color:var(--navy); }
.df-exf-bar { height:4px; background:var(--gray-100); border-radius:4px; overflow:hidden; }
.df-exf-fill { height:100%; background:linear-gradient(90deg,var(--navy),var(--sky-mid)); border-radius:4px; transition:width .6s ease; }
.df-exf-total { display:flex; justify-content:space-between; align-items:center; padding:8px 11px; background:var(--sky-pale); border-radius:8px; font-size:0.68rem; color:var(--text-muted); }
.df-exf-total strong { font-family:'Manrope',sans-serif; font-size:0.88rem; color:var(--navy); font-weight:800; }

/* Classification panel */
.df-class-list { display:flex; flex-direction:column; gap:5px; margin-bottom:10px; }
.df-class-row { display:flex; align-items:center; gap:8px; padding:6px 10px; background:#fff; border:1px solid var(--border); border-radius:7px; }
.df-class-tag { font-size:0.56rem; font-weight:700; padding:2px 7px; border-radius:4px; white-space:nowrap; text-transform:uppercase; letter-spacing:.04em; }
.df-tag-darkred { background:#7F1D1D; color:#fff; font-size:0.5rem; }
.df-tag-red { background:#FEE2E2; color:#991B1B; }
.df-tag-orange { background:#FEF3C7; color:#92400E; }
.df-tag-blue { background:var(--sky-light); color:var(--navy); }
.df-tag-green { background:#DCFCE7; color:#166534; }
.df-class-file { flex:1; font-family:'JetBrains Mono',monospace; font-size:0.6rem; color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.df-class-time { font-size:0.56rem; color:var(--text-faint); white-space:nowrap; }
.df-class-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; }
.df-class-stats div { text-align:center; background:var(--sky-pale); border-radius:7px; padding:7px 4px; }
.df-class-stats strong { display:block; font-family:'Manrope',sans-serif; font-size:0.82rem; font-weight:800; color:var(--navy); }
.df-class-stats span { font-size:0.56rem; color:var(--text-muted); }

/* Leak Detection panel */
.df-leak-channels { display:flex; flex-direction:column; gap:8px; }
.df-leak-ch { background:#fff; border:1px solid var(--border); border-radius:8px; padding:9px 11px; }
.df-leak-ch-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:5px; }
.df-leak-ch-head span:first-child { font-family:'Manrope',sans-serif; font-size:0.68rem; font-weight:700; color:var(--text); }
.df-leak-status { font-size:0.58rem; font-weight:700; }
.df-ls-ok { color:#166534; }
.df-ls-warn { color:#92400E; }
.df-leak-bar { height:3px; background:var(--gray-100); border-radius:3px; overflow:hidden; }
.df-leak-fill { height:100%; border-radius:3px; transition:width .6s ease; }
.df-lf-ok { background:#22C55E; }
.df-lf-warn { background:#F59E0B; }

/* Floating alert cards */
.float-alert {
  position: absolute;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-lg);
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 12px 16px;
  z-index: 3;
  animation: float-drift 4s ease-in-out infinite alternate;
  transition: opacity .7s ease, transform .7s ease;
}
.float-alert-top {
  top: -18px;
  right: -24px;
  animation-delay: 0s;
}
.float-alert-bottom {
  bottom: -20px;
  left: -28px;
  flex-wrap: wrap;
  max-width: 230px;
  animation-delay: -2s;
}
@keyframes float-drift {
  0%   { transform: translateY(0); }
  100% { transform: translateY(-8px); }
}
.float-alert-icon {
  width: 32px; height: 32px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.float-alert-icon svg { width: 16px; height: 16px; }
.float-alert-icon { background: #f7f7f7; }
.fa-logo-img { width: 20px; height: 20px; display: block; object-fit: contain; border-radius: 3px; }
.fa-logo-img[src*="claude"] { width: 28px; height: 28px; }
.fa-icon-scan { background: rgba(11,79,126,.1); color: #0b4f7e; }
.float-alert-body { display: flex; flex-direction: column; gap: 2px; }
.float-alert-title { font-family: 'Manrope', sans-serif; font-size: 0.75rem; font-weight: 700; color: var(--text); }
.float-alert-sub { font-size: 0.65rem; color: var(--text-muted); }
.float-alert-progress {
  width: 100%;
  height: 3px;
  background: rgba(11,79,126,.1);
  border-radius: 3px;
  overflow: hidden;
  margin-top: 4px;
}
.float-alert-progress-fill {
  height: 100%;
  width: 75%;
  background: linear-gradient(90deg, #0b4f7e, var(--sky-mid));
  border-radius: 3px;
  animation: progress-sweep 3s ease-in-out infinite;
}
@keyframes progress-sweep {
  0%   { width: 0%; }
  60%  { width: 75%; }
  100% { width: 75%; }
}

/* Legacy float-badge compat */
.float-badge { position: absolute; background: #fff; border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-md); display: flex; align-items: center; gap: 11px; padding: 10px 14px; z-index: 2; }
.fb-bottom { bottom: -22px; left: -26px; }
.fb-label { font-size: 0.62rem; color: var(--text-faint); font-weight: 500; }
.fb-value { font-size: 0.82rem; color: var(--text); font-weight: 700; margin-top: 1px; }
.fb-icon { font-size: 20px; }
.live-badge { position: absolute; top: -16px; right: -18px; background: var(--navy-deeper); border-radius: var(--radius-md); padding: 9px 13px; display: flex; align-items: center; gap: 7px; z-index: 3; }
.live-dot { width: 7px; height: 7px; border-radius: 50%; background: #22C55E; }
.live-text strong { display: block; font-size: 0.78rem; color: #fff; }
.live-text span { font-size: 0.67rem; color: rgba(255,255,255,.5); }
.fb-icon { font-size: 18px; }
.fb-label { font-size: 0.67rem; color: var(--text-muted); }
.fb-value { font-family: 'Manrope',sans-serif; font-weight: 800; font-size: 0.84rem; color: var(--text); }

/* ══════════════════════════════════════════════════════════════════
   LOGOS CAROUSEL
══════════════════════════════════════════════════════════════════ */
#logos { background: var(--off-white); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 32px 0; overflow: hidden; }
.logos-label { text-align: center; font-family: 'Space Grotesk',sans-serif; font-size: 0.67rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--text-faint); margin-bottom: 24px; }
.logos-mask { overflow: hidden; mask-image: linear-gradient(90deg,transparent 0%,black 8%,black 92%,transparent 100%); -webkit-mask-image: linear-gradient(90deg,transparent 0%,black 8%,black 92%,transparent 100%); }
.logos-track { display: flex; align-items: center; gap: 32px; width: max-content; animation: logoScroll var(--logo-dur, 60s) linear infinite; will-change: transform; backface-visibility: hidden; transform: translate3d(0,0,0); }
.logos-track:hover { animation-play-state: paused; }
@keyframes logoScroll {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(var(--logo-shift, -50%), 0, 0); }
}
.logo-chip { display: flex; align-items: center; justify-content: center; padding: 10px 22px; background: #fff; border: 1px solid var(--border); border-radius: 12px; flex-shrink: 0; min-height: 52px; }
.logo-chip-img { height: 34px; width: auto; max-width: 220px; object-fit: contain; opacity: .85; transition: opacity .3s; }
.logo-chip:hover .logo-chip-img { opacity: 1; }
.logo-chip-dark { background: var(--navy-deeper); border-color: rgba(11,79,126,.2); }
.logo-chip-dark .logo-chip-img { opacity: .9; }
.logo-chip-text { font-family: 'Manrope',sans-serif; font-weight: 800; font-size: 0.82rem; color: var(--text-faint); letter-spacing: -.01em; transition: color .3s; }
.logo-chip:hover .logo-chip-text { color: var(--text-muted); }

/* ══════════════════════════════════════════════════════════════════
   WHY SECTION — Zynap-style card grid, white bg + navy cards
══════════════════════════════════════════════════════════════════ */
#why {
  background: #fff;
  padding: 56px 0 48px;
}

/* Centered header */
.why-header {
  text-align: center;
  margin-bottom: 52px;
}
.why-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'Manrope', sans-serif;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--navy);
  background: rgba(11,79,126,.07);
  border: 1px solid rgba(11,79,126,.16);
  border-radius: 50px;
  padding: 6px 16px;
  margin-bottom: 20px;
}
.why-badge-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--navy);
  animation: pulse-dot 2s ease-in-out infinite;
}
@keyframes pulse-dot {
  0%,100% { opacity: 1; transform: scale(1); }
  50%      { opacity: .4; transform: scale(.65); }
}
.why-h2 {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(2rem, 3.4vw, 3rem);
  font-weight: 900;
  letter-spacing: -0.04em;
  line-height: 1.1;
  color: var(--text);
}

/* Card rows */
.why-row-top {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-bottom: 16px;
}
.why-row-bottom { display: grid; grid-template-columns: 1fr; }

/* Card */
.why-card {
  position: relative;
  background: #0b4f7e;
  border-radius: 18px;
  padding: 36px 32px 32px;
  overflow: hidden;
  transition: transform .3s var(--ease-spring);
  isolation: isolate;
}
.why-card:hover { transform: translateY(-5px); }
.why-card:hover .why-card-glow {
  background:
    radial-gradient(ellipse 70% 60% at 50% 100%,
      rgba(185,228,255,.75) 0%,
      rgba(116,195,240,.5) 30%,
      transparent 60%),
    radial-gradient(ellipse 100% 80% at 50% 100%,
      rgba(74,160,220,.6) 0%,
      transparent 65%);
}

/* Bottom glow — soft blue bleeds up from the base #0b4f7e */
.why-card-glow {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 70%;
  background:
    radial-gradient(ellipse 70% 60% at 50% 100%,
      rgba(185,228,255,.55) 0%,
      rgba(116,195,240,.35) 30%,
      transparent 60%),
    radial-gradient(ellipse 100% 80% at 50% 100%,
      rgba(74,160,220,.4) 0%,
      transparent 65%);
  pointer-events: none;
}

/* Large number */
.why-card-num {
  position: relative;
  z-index: 1;
  font-family: 'Manrope', sans-serif;
  font-size: clamp(3.2rem, 5vw, 4.8rem);
  font-weight: 900;
  letter-spacing: -0.05em;
  line-height: 1;
  color: #fff;
  margin-bottom: 14px;
}

/* Label */
.why-card-label {
  position: relative;
  z-index: 1;
  font-size: 0.88rem;
  font-weight: 500;
  color: rgba(185,228,255,.75);
  line-height: 1.65;
  max-width: 280px;
}

/* Wide card */
.why-card-wide {
  display: flex;
  align-items: center;
  gap: 52px;
  padding: 36px 48px;
}
.why-card-wide .why-card-num {
  flex-shrink: 0;
  font-size: clamp(3.6rem, 5.5vw, 5.2rem);
}
.why-card-wide .why-card-label { max-width: 520px; font-size: 0.95rem; }

/* ══════════════════════════════════════════════════════════════════
   PLATFORM FLOW
══════════════════════════════════════════════════════════════════ */
/* ── Section base ── */
#platform-flow {
  position: relative;
  background: #fff;
  background-image: radial-gradient(rgba(11,79,126,.07) 1px, transparent 1px);
  background-size: 22px 22px;
  padding: 48px 0 100px;
  overflow: hidden;
  border-bottom: 1px solid rgba(11,79,126,.08);
}
#platform-visual {
  position: relative;
  background: #fff;
  padding: 80px 0 60px;
  overflow: hidden;
}

/* Header — dark theme overrides */
.pf-header {
  text-align: center;
  margin-bottom: 60px;
}
.pf-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'Manrope', sans-serif;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #0B4F7E;
  background: rgba(11,79,126,.06);
  border: 1px solid rgba(11,79,126,.12);
  border-radius: 50px;
  padding: 6px 16px;
  margin-bottom: 22px;
}
#platform-visual .pf-badge { color: #B9E4FF; background: rgba(185,228,255,.08); border-color: rgba(185,228,255,.18); }
.pf-badge-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: #0B4F7E;
  animation: pulse-dot 2s ease-in-out infinite;
}
#platform-visual .pf-badge-dot { background: #B9E4FF; }
.pf-h2 {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(2rem, 3.4vw, 3rem);
  font-weight: 900;
  letter-spacing: -0.04em;
  line-height: 1.15;
  color: var(--text);
  margin-bottom: 18px;
}
#platform-visual .pf-h2 { color: #fff; }
.pf-sub {
  font-size: 1rem;
  color: var(--text-muted);
  max-width: 520px;
  margin: 0 auto 28px;
  line-height: 1.75;
}
#platform-visual .pf-sub { color: rgba(185,228,255,.6); }
.pf-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'Manrope', sans-serif;
  font-size: 0.85rem;
  font-weight: 700;
  color: #0B4F7E;
  text-decoration: none;
  border: 1px solid rgba(11,79,126,.2);
  border-radius: 50px;
  padding: 9px 22px;
  transition: border-color .25s, color .25s, background .25s;
}
.pf-link:hover { border-color: #0B4F7E; background: rgba(11,79,126,.05); }
#platform-visual .pf-link { color: #B9E4FF; border-color: rgba(185,228,255,.25); }
#platform-visual .pf-link:hover { border-color: #B9E4FF; background: rgba(185,228,255,.08); }

/* ── Pipeline (5-step flow — index.html) ── */
.pf-pipeline { display: flex; align-items: center; justify-content: center; gap: 0; flex-wrap: wrap; }
.pf-nw { flex-shrink: 0; }
.pf-node { display: flex; flex-direction: column; align-items: center; gap: 8px; background: #0B4F7E; border: 2px solid rgba(185,228,255,.35); transition: border-color .3s, background .3s, transform .3s, box-shadow .3s; }
.pf-node:hover { border-color: rgba(185,228,255,.7); background: #083D62; transform: translateY(-4px); box-shadow: 0 0 20px rgba(185,228,255,.2), 0 0 40px rgba(185,228,255,.08); }
.pf-hex { border-radius: 16px; clip-path: polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%); width: 130px; height: 130px; padding: 0; justify-content: center; border: none; text-align: center; }
.pf-hex .pf-icon { width: 24px; height: 24px; }
.pf-hex .pf-title { font-size: 0.72rem; }
.pf-hex .pf-sublabel { font-size: 0.6rem; white-space: nowrap; }
.pf-hex-outer { position: relative; width: 136px; height: 136px; display: flex; align-items: center; justify-content: center; }
.pf-hex-outer::before { content: ''; position: absolute; inset: 0; width: 136px; height: 136px; clip-path: polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%); background: linear-gradient(135deg, rgba(185,228,255,.6), rgba(185,228,255,.2), rgba(185,228,255,.6)); z-index: 0; filter: drop-shadow(0 0 10px rgba(185,228,255,.4)) drop-shadow(0 0 20px rgba(185,228,255,.15)); animation: hex-glow 3s ease-in-out infinite; }
.pf-hex-outer .pf-hex { position: relative; z-index: 1; }
@keyframes hex-glow { 0%,100% { filter: drop-shadow(0 0 8px rgba(185,228,255,.3)) drop-shadow(0 0 16px rgba(185,228,255,.1)); } 50% { filter: drop-shadow(0 0 14px rgba(185,228,255,.5)) drop-shadow(0 0 28px rgba(185,228,255,.2)); } }
.pf-pill { border-radius: 20px; padding: 20px 36px; min-width: 140px; min-height: 90px; justify-content: center; box-shadow: 0 0 12px rgba(185,228,255,.15), 0 0 4px rgba(185,228,255,.25), inset 0 0 20px rgba(185,228,255,.04); animation: pill-glow 3.5s ease-in-out infinite; }
.pf-node-active { border-color: rgba(185,228,255,.7); background: #083D62; box-shadow: 0 0 18px rgba(185,228,255,.25), 0 0 6px rgba(185,228,255,.35), inset 0 0 25px rgba(185,228,255,.05); }
@keyframes pill-glow { 0%,100% { box-shadow: 0 0 10px rgba(185,228,255,.1), 0 0 3px rgba(185,228,255,.2); } 50% { box-shadow: 0 0 18px rgba(185,228,255,.2), 0 0 6px rgba(185,228,255,.3); } }
.pf-icon { width: 28px; height: 28px; color: #B9E4FF; }
.pf-title { font-family: 'Space Grotesk', sans-serif; font-size: 0.8rem; font-weight: 700; color: #fff; letter-spacing: .05em; text-transform: uppercase; }
.pf-sublabel { font-size: 0.68rem; color: rgba(185,228,255,.6); }
.pf-conn { display: flex; align-items: center; width: 72px; position: relative; }
.pf-conn-line { flex: 1; height: 2px; background: linear-gradient(90deg, rgba(185,228,255,.5), rgba(185,228,255,.8), rgba(185,228,255,.5)); box-shadow: 0 0 6px rgba(185,228,255,.3); }
.pf-conn::before, .pf-conn::after { content: ''; width: 8px; height: 8px; border-radius: 50%; background: #B9E4FF; box-shadow: 0 0 8px rgba(185,228,255,.6), 0 0 3px rgba(185,228,255,.8); flex-shrink: 0; }
.pf-conn-dot { position: absolute; left: 50%; top: 50%; width: 5px; height: 5px; background: #B9E4FF; border-radius: 50%; transform: translate(-50%, -50%); animation: pf-dot-travel 2.5s ease-in-out infinite; box-shadow: 0 0 8px rgba(185,228,255,.7); }
@keyframes pf-dot-travel { 0%,100% { left: 5%; opacity: .2; } 50% { left: 95%; opacity: 1; } }
@keyframes pulse-dot { 0%,100% { opacity: .5; } 50% { opacity: 1; } }
.pf-atmo { position: absolute; inset: 0; background: radial-gradient(ellipse 60% 50% at 50% 40%, rgba(11,79,126,.03) 0%, transparent 70%); pointer-events: none; }

@media (max-width: 768px) {
  .pf-pipeline { flex-direction: column; gap: 12px; }
  .pf-conn { width: auto; height: 32px; flex-direction: column; }
  .pf-conn-line { width: 1.5px; height: 100%; flex: 1; background: linear-gradient(180deg, rgba(11,79,126,.1), rgba(11,79,126,.25), rgba(11,79,126,.1)); }
  @keyframes pf-dot-travel { 0%,100% { top: 10%; opacity: .3; } 50% { top: 90%; opacity: 1; } }
}

/* ── Platform Visual — Concentric Semicircles ── */
.pv-wrap { max-width: 900px; margin: 0 auto; }
.pv-arcs {
  position: relative;
  width: 100%;
  aspect-ratio: 1.6 / 1;
  overflow: hidden;
}

/* Ring base */
.pv-ring {
  position: absolute;
  left: 50%;
  bottom: 0;
  border-radius: 50%;
  transform: translateX(-50%) translateY(50%);
  border: 2px solid rgba(11,79,126,.15);
  border-bottom-color: transparent;
}

/* Ring sizes (inside out) */
.pv-ring-1 { width: 180px; height: 180px; border: none; z-index: 5; }
.pv-ring-2 { width: 340px; height: 340px; background: radial-gradient(ellipse at 50% 100%, rgba(185,228,255,.12) 0%, transparent 60%); z-index: 4; }
.pv-ring-3 { width: 500px; height: 500px; background: radial-gradient(ellipse at 50% 100%, rgba(11,79,126,.08) 0%, transparent 60%); z-index: 3; }
.pv-ring-4 { width: 660px; height: 660px; background: radial-gradient(ellipse at 50% 100%, rgba(185,228,255,.05) 0%, transparent 60%); z-index: 2; }
.pv-ring-5 { width: 820px; height: 820px; z-index: 1; }

/* Ring titles (curved top) */
.pv-ring-title {
  position: absolute;
  top: -1px;
  left: 50%;
  transform: translate(-50%, -50%);
  font-family: 'Manrope', sans-serif;
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #0B4F7E;
  background: #fff;
  padding: 3px 16px;
  border-radius: 4px;
  white-space: nowrap;
}

/* Ring labels */
.pv-ring-label {
  position: absolute;
  font-family: 'Space Grotesk', sans-serif;
  font-size: .68rem;
  font-weight: 600;
  color: var(--text-muted);
  line-height: 1.3;
  text-align: center;
}

/* Center core */
.pv-core {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%) translateY(50%);
  width: 150px;
  height: 150px;
  background: linear-gradient(135deg, #0B4F7E, #0a6aad);
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  z-index: 10;
  border: 3px solid rgba(185,228,255,.3);
  box-shadow: 0 0 30px rgba(11,79,126,.25), 0 0 60px rgba(185,228,255,.08);
}
.pv-core svg { color: #B9E4FF; }
.pv-core-title {
  font-family: 'Manrope', sans-serif;
  font-size: .72rem;
  font-weight: 800;
  color: #fff;
  text-align: center;
  letter-spacing: .08em;
  line-height: 1.2;
}

/* Bottom bar */
.pv-bottom-bar {
  background: #fff;
  border: 2px solid rgba(11,79,126,.12);
  border-radius: 0;
  padding: 14px 0;
  text-align: center;
  margin-top: 8px;
  position: relative;
  z-index: 10;
}
.pv-bar-title {
  font-family: 'Manrope', sans-serif;
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #0B4F7E;
}
.pv-bottom-pills {
  display: flex;
  justify-content: center;
  gap: 0;
  margin-top: 8px;
}
.pv-pill {
  flex: 1;
  padding: 10px 16px;
  background: #B9E4FF;
  font-family: 'Manrope', sans-serif;
  font-size: .72rem;
  font-weight: 700;
  color: #0B4F7E;
  text-align: center;
  letter-spacing: .04em;
  text-transform: uppercase;
  border-right: 2px solid rgba(11,79,126,.1);
}
.pv-pill:last-child { border-right: none; }

/* Responsive */
@media (max-width: 768px) {
  .pv-arcs { aspect-ratio: 1.2 / 1; }
  .pv-ring-1 { width: 120px; height: 120px; }
  .pv-ring-2 { width: 220px; height: 220px; }
  .pv-ring-3 { width: 320px; height: 320px; }
  .pv-ring-4 { width: 420px; height: 420px; }
  .pv-ring-5 { width: 520px; height: 520px; }
  .pv-core { width: 100px; height: 100px; }
  .pv-core-title { font-size: .58rem; }
  .pv-ring-title { font-size: .55rem; padding: 2px 8px; }
  .pv-ring-label { font-size: .55rem; }
  .pv-bottom-pills { flex-wrap: wrap; }
  .pv-pill { flex: none; width: 50%; border-bottom: 2px solid rgba(11,79,126,.1); }
}

/* ══════════════════════════════════════════════════════════════════
   PRODUCT SHOWCASE
══════════════════════════════════════════════════════════════════ */
#product-sec { background: #fff; }
/* Tighter spacing on product page */
#modules.section, #how-pribait.section { padding-block: clamp(48px, 6vw, 80px); }
#dlp.section, #dspm.section, #antiphishing.section { padding-block: clamp(32px, 4vw, 56px); }
#platform-overview.section { padding-top: clamp(24px, 3vw, 40px); padding-bottom: clamp(48px, 6vw, 80px); }
#modules.section { padding-top: clamp(40px, 5vw, 64px); }
.product-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: center; }
.product-grid-reverse > *:first-child { order: 1; }
.product-grid-reverse > *:last-child  { order: 0; }

/* Product visual card (DLP / DSPM / Anti Phishing) */
.product-visual-card { background:#fff; border:1px solid var(--border); border-radius:var(--radius-xl); padding:28px; box-shadow:var(--shadow-md); }
.pvc-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; }
.pvc-title { font-family:'Manrope',sans-serif; font-weight:700; font-size:0.9rem; color:var(--text); }
.pvc-badge { font-family:'Space Grotesk',sans-serif; font-size:0.65rem; font-weight:700; padding:3px 10px; border-radius:100px; }
.badge-g { background:#dcfce7; color:#166534; }
.badge-b { background:var(--sky-light); color:var(--navy); }
.pvc-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:20px; }
.pvc-stat { background:var(--gray-50); border-radius:10px; padding:12px 10px; text-align:center; }
.pvc-num { font-family:'Manrope',sans-serif; font-size:1.3rem; font-weight:900; color:var(--navy); }
.pvc-lbl { font-size:0.7rem; color:var(--text-faint); margin-top:3px; }
.pvc-channels { display:flex; flex-direction:column; gap:10px; }
.pvc-ch { display:flex; align-items:center; gap:10px; font-size:0.78rem; color:var(--text-muted); }
.pvc-ch > span:first-child { width:110px; flex-shrink:0; }
.pvc-ch > span:last-child  { width:30px; text-align:right; }
.pvc-ch-bar { flex:1; height:6px; background:var(--gray-100); border-radius:100px; overflow:hidden; }
.pvc-ch-fill { height:100%; background:var(--navy); border-radius:100px; }
.pvc-ch-red  { background:#EF4444; }
.pvc-tree { display:flex; flex-direction:column; gap:7px; }
.pvc-tree-item { font-family:'JetBrains Mono',monospace; font-size:0.76rem; color:var(--text); padding:7px 12px; border-radius:7px; background:var(--gray-50); }
.pvc-tree-root { font-weight:600; background:var(--sky-light); color:var(--navy); }
.pvc-tree-l1 { margin-left:18px; }
.pvc-alerts { display:flex; flex-direction:column; gap:10px; }
.pvc-alert { display:flex; align-items:flex-start; gap:12px; padding:12px 14px; border-radius:10px; border-left:3px solid transparent; }
.pvc-alert-red    { background:#fff5f5; border-color:#EF4444; }
.pvc-alert-yellow { background:#fffbeb; border-color:#F59E0B; }
.pvc-alert-green  { background:#f0fdf4; border-color:#22C55E; }
.pvc-alert-icon { font-size:18px; flex-shrink:0; }
.pvc-alert-title { font-family:'Manrope',sans-serif; font-size:0.83rem; font-weight:700; color:var(--text); }
.pvc-alert-sub   { font-size:0.73rem; color:var(--text-faint); margin-top:2px; }
.feat-list { display: flex; flex-direction: column; gap: 10px; }
.feat-item { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; background: var(--off-white); border-radius: var(--radius-md); border: 1px solid transparent; transition: border-color 0.2s, background 0.2s, transform 0.2s var(--ease); cursor: default; }
.feat-item:hover { border-color: var(--border); background: var(--sky-light); transform: translateX(4px); }
.feat-check { width: 22px; height: 22px; background: var(--navy); border-radius: 6px; display: grid; place-items: center; flex-shrink: 0; margin-top: 1px; }
.feat-check svg { width: 11px; height: 11px; color: #fff; }
.feat-body strong { font-family: 'Manrope',sans-serif; font-weight: 700; font-size: 0.88rem; color: var(--text); display: block; margin-bottom: 3px; }
.feat-body p { font-size: 0.81rem; color: var(--text-muted); line-height: 1.65; }

/* Threat card */
.threat-card { background: linear-gradient(150deg,var(--navy-deeper),var(--navy)); border-radius: var(--radius-xl); padding: 28px; box-shadow: var(--shadow-xl); position: relative; overflow: hidden; }
.threat-card::before { content:''; position:absolute; top:0;right:0; width:200px;height:200px; background:radial-gradient(circle,rgba(185,228,255,.09)0%,transparent 70%); pointer-events:none; }
.tc-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 22px; }
.tc-title { font-family: 'Space Grotesk',sans-serif; font-size: 0.67rem; font-weight: 700; letter-spacing: .09em; color: rgba(255,255,255,.55); text-transform: uppercase; }
.tc-live { display: flex; align-items: center; gap: 5px; font-size: 0.72rem; color: #22C55E; font-weight: 600; }
.tc-live-dot { width: 6px; height: 6px; background: #22C55E; border-radius: 50%; }
.tc-counts { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin-bottom: 20px; }
.tc-count { background: rgba(255,255,255,.055); border: 1px solid rgba(255,255,255,.08); border-radius: 9px; padding: 12px; text-align: center; }
.tc-num { font-family: 'Manrope',sans-serif; font-size: 1.45rem; font-weight: 900; }
.tc-lbl { font-size: 0.65rem; color: rgba(255,255,255,.42); margin-top: 3px; }
.tc-bars { display: flex; flex-direction: column; gap: 10px; }
.tc-bar-meta { display: flex; justify-content: space-between; font-size: 0.7rem; color: rgba(255,255,255,.5); margin-bottom: 4px; }
.tc-bar-track { height: 5px; background: rgba(255,255,255,.09); border-radius: 3px; overflow: hidden; }
.tc-bar-fill { height: 100%; border-radius: 3px; background: linear-gradient(90deg,var(--sky),#4db8f0); }

/* ══════════════════════════════════════════════════════════════════
   FEATURES GRID
══════════════════════════════════════════════════════════════════ */
#features-sec { background: var(--gray-50); }
.features-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.feature-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 28px 24px; position: relative; overflow: hidden; transition: border-color 0.25s, box-shadow 0.25s, transform 0.25s var(--ease); }
.feature-card::after { content:''; position:absolute; top:0;left:0;right:0; height:2px; background:linear-gradient(90deg,var(--navy),var(--sky)); transform:scaleX(0); transform-origin:left; transition:transform 0.3s var(--ease); }
.feature-card:hover { border-color: var(--border-dark); box-shadow: var(--shadow-md); transform: translateY(-6px); }
.feature-card:hover::after { transform: scaleX(1); }
.feature-icon { width: 48px; height: 48px; background: var(--sky-light); border-radius: 12px; display: grid; place-items: center; font-size: 20px; margin-bottom: 16px; transition: background 0.25s, transform 0.25s var(--ease-spring); }
.feature-card:hover .feature-icon { background: var(--navy); transform: scale(1.1) rotate(-4deg); }
.feature-card h3 { font-family: 'Manrope',sans-serif; font-size: 1rem; font-weight: 700; color: var(--text); margin-bottom: 9px; }
.feature-card p { font-size: 0.84rem; color: var(--text-muted); line-height: 1.7; }

/* ══════════════════════════════════════════════════════════════════
   HOW IT WORKS
══════════════════════════════════════════════════════════════════ */
.steps-wrap { position: relative; }
.steps-line { position: absolute; top: 31px; left: calc(16.667% + 18px); right: calc(16.667% + 18px); height: 2px; background: linear-gradient(90deg,var(--sky),var(--navy),var(--sky)); z-index: 0; transform-origin: left; }
.steps-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 0; position: relative; z-index: 1; }
.step { text-align: center; padding: 0 24px; }
.step-num { width: 62px; height: 62px; background: var(--navy); border-radius: 50%; display: grid; place-items: center; margin-inline: auto; margin-bottom: 24px; font-family: 'Manrope',sans-serif; font-weight: 900; font-size: 1.15rem; color: #fff; box-shadow: 0 0 0 8px rgba(11,79,126,.1), var(--shadow-md); transition: transform 0.25s var(--ease-spring), box-shadow 0.25s; }
.step:hover .step-num { transform: scale(1.1); box-shadow: 0 0 0 14px rgba(11,79,126,.11), var(--shadow-lg); }
.step h3 { font-family: 'Manrope',sans-serif; font-size: 1.05rem; font-weight: 700; color: var(--text); margin-bottom: 10px; }
.step p { font-size: 0.85rem; color: var(--text-muted); line-height: 1.75; }

/* ══════════════════════════════════════════════════════════════════
   HOW IT WORKS
══════════════════════════════════════════════════════════════════ */
#how-sec {
  background: #fff;
  padding: 32px 0 64px;
  position: relative;
  overflow: hidden;
}
#how-sec::before { display: none; }

/* ══════════════════════════════════════════════════════════════════
   HOW IT WORKS — Premium 3-step flow
══════════════════════════════════════════════════════════════════ */
.hiw-section {
  background: #fff;
  padding: clamp(64px, 8vw, 100px) 0;
}
.hiw-header {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 56px;
}
.hiw-flow {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  max-width: 1000px;
  margin: 0 auto;
}
.hiw-step {
  flex: 1;
  text-align: center;
  max-width: 300px;
  position: relative;
}
.hiw-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: #0B4F7E;
  color: #fff;
  font-family: 'Space Grotesk', sans-serif;
  font-size: .68rem;
  font-weight: 700;
  border-radius: 50%;
  margin-bottom: 18px;
}
.hiw-icon-wrap {
  display: flex;
  justify-content: center;
  margin-bottom: 22px;
}
.hiw-icon {
  width: 72px;
  height: 72px;
  background: #E0F4FF;
  border-radius: 20px;
  display: grid;
  place-items: center;
  color: #0B4F7E;
  transition: transform .35s, box-shadow .35s;
}
.hiw-icon svg { width: 30px; height: 30px; }
.hiw-icon-active {
  background: #0B4F7E;
  color: #fff;
  box-shadow: 0 8px 24px rgba(11,79,126,.2);
}
.hiw-step:hover .hiw-icon {
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(11,79,126,.15);
}
.hiw-step h3 {
  font-family: 'Manrope', sans-serif;
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--text);
  margin: 0 0 10px;
}
.hiw-step p {
  font-size: .85rem;
  color: var(--text-muted);
  line-height: 1.65;
  margin: 0;
  padding: 0 12px;
}

/* Connectors */
.hiw-conn {
  display: flex;
  align-items: center;
  width: 80px;
  flex-shrink: 0;
  margin-top: 68px;
  position: relative;
}
.hiw-conn-line {
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, rgba(11,79,126,.12), rgba(11,79,126,.2), rgba(11,79,126,.12));
}
.hiw-conn-dot {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 6px;
  height: 6px;
  background: #B9E4FF;
  border: 2px solid #0B4F7E;
  border-radius: 50%;
  transform: translate(-50%, -50%);
}

@media (max-width: 700px) {
  .hiw-flow { flex-direction: column; align-items: center; gap: 24px; }
  .hiw-conn { width: auto; height: 40px; flex-direction: column; margin-top: 0; }
  .hiw-conn-line { width: 2px; height: 100%; background: linear-gradient(180deg, rgba(11,79,126,.12), rgba(11,79,126,.2), rgba(11,79,126,.12)); }
}
.how-header {
  text-align: center;
  margin-bottom: 72px;
  position: relative;
  z-index: 1;
}
.how-badge {
  display: inline-block;
  font-family: 'Manrope', sans-serif;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #0b4f7e;
  background: rgba(11,79,126,.08);
  border: 1px solid rgba(11,79,126,.18);
  border-radius: 6px;
  padding: 5px 14px;
  margin-bottom: 24px;
}
.how-h2 {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(2rem, 3.6vw, 3.2rem);
  font-weight: 900;
  letter-spacing: -0.04em;
  line-height: 1.1;
  color: var(--text);
  margin-bottom: 16px;
}
.how-sub {
  font-size: 1rem;
  color: var(--text-muted);
  max-width: 480px;
  margin: 0 auto;
  line-height: 1.75;
}
.how-steps {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 48px;
}
.how-line {
  position: absolute;
  top: 36px;
  left: calc(16.66% + 36px);
  right: calc(16.66% + 36px);
  height: 1px;
  background: linear-gradient(90deg, transparent, #0b4f7e 20%, #0b4f7e 80%, transparent);
  z-index: 0;
}
.how-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  position: relative;
  z-index: 1;
  opacity: 0;
}
.how-line { transform: scaleX(0); transform-origin: left center; }
.how-num {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: #0b4f7e;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Manrope', sans-serif;
  font-size: 1.5rem;
  font-weight: 900;
  color: #fff;
  margin-bottom: 28px;
  box-shadow: 0 0 0 7px rgba(11,79,126,.1);
  transition: box-shadow .3s var(--ease), transform .3s var(--ease-spring), background .3s;
}
.how-step:hover .how-num {
  background: #083d62;
  box-shadow: 0 0 0 10px rgba(11,79,126,.15), 0 0 32px rgba(11,79,126,.35);
  transform: scale(1.1);
}
.how-step-title {
  font-family: 'Manrope', sans-serif;
  font-size: 1rem;
  font-weight: 800;
  color: var(--text);
  margin-bottom: 12px;
}
.how-step-desc {
  font-size: 0.9rem;
  color: var(--text-muted);
  line-height: 1.75;
  max-width: 280px;
}

/* ══════════════════════════════════════════════════════════════════
   CAPABILITIES GRID
══════════════════════════════════════════════════════════════════ */
#caps-sec {
  background: #fff;
  padding: 88px 0 0;
  position: relative;
  overflow: hidden;
}

/* Two-column header */
.caps-header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: end;
  margin-bottom: 60px;
  position: relative;
  z-index: 1;
}
.caps-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'Manrope', sans-serif;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #0b4f7e;
  background: linear-gradient(135deg, rgba(11,79,126,.06), rgba(185,228,255,.22));
  border: 1px solid rgba(11,79,126,.18);
  border-radius: 100px;
  padding: 7px 14px 7px 12px;
  margin-bottom: 18px;
  box-shadow: 0 1px 2px rgba(11,79,126,.04), inset 0 1px 0 rgba(255,255,255,.6);
}
.caps-eyebrow::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #0b4f7e;
  box-shadow: 0 0 0 3px rgba(11,79,126,.12);
  flex-shrink: 0;
}
.caps-h2 {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(2rem, 3.2vw, 2.9rem);
  font-weight: 900;
  letter-spacing: -0.04em;
  line-height: 1.12;
  color: var(--text);
}
.caps-h2 em {
  font-style: italic;
  color: #0b4f7e;
  font-weight: 900;
}
.caps-desc {
  font-family: 'Inter', sans-serif;
  font-size: 1rem;
  color: var(--text-muted);
  line-height: 1.85;
  padding-top: 8px;
}

/* 3×2 card grid */
.caps-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  position: relative;
  z-index: 1;
}
.caps-cell {
  position: relative;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 36px 32px 32px;
  overflow: hidden;
  transition: border-color .3s var(--ease), box-shadow .3s var(--ease), transform .3s var(--ease-spring);
}
.caps-cell::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, #0b4f7e, var(--sky-mid));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .35s var(--ease);
}
.caps-cell:hover {
  border-color: rgba(11,79,126,.25);
  box-shadow: var(--shadow-md);
  transform: translateY(-5px);
}
.caps-cell:hover::after { transform: scaleX(1); }

/* Icon */
.caps-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: rgba(11,79,126,.08);
  border: 1px solid rgba(11,79,126,.12);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 24px;
  transition: background .3s, border-color .3s;
}
.caps-cell:hover .caps-icon {
  background: #0b4f7e;
  border-color: #0b4f7e;
}
.caps-cell:hover .caps-icon svg { color: #fff; }
.caps-icon svg {
  width: 20px;
  height: 20px;
  color: #0b4f7e;
  transition: color .3s;
}
.caps-title {
  font-family: 'Manrope', sans-serif;
  font-size: 0.95rem;
  font-weight: 800;
  color: var(--text);
  margin-bottom: 10px;
  letter-spacing: -.01em;
}
.caps-sub {
  font-family: 'Inter', sans-serif;
  font-size: 0.87rem;
  color: var(--text-muted);
  line-height: 1.75;
}

/* ══════════════════════════════════════════════════════════════════
   SOLUTIONS CARDS
══════════════════════════════════════════════════════════════════ */
.solutions-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 18px; }
.solution-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 28px; display: flex; gap: 20px; align-items: flex-start; transition: border-color 0.25s, box-shadow 0.25s, transform 0.25s var(--ease); }
.solution-card:hover { border-color: var(--border-dark); box-shadow: var(--shadow-md); transform: translateY(-4px); }
.sol-icon-wrap { width: 52px; height: 52px; background: linear-gradient(135deg,var(--navy),#1a7fc2); border-radius: 13px; display: grid; place-items: center; font-size: 22px; flex-shrink: 0; }
.solution-card h3 { font-family: 'Manrope',sans-serif; font-size: 1.05rem; font-weight: 700; color: var(--text); margin-bottom: 8px; }
.solution-card p { font-size: 0.84rem; color: var(--text-muted); line-height: 1.7; }
.sol-link { display: inline-flex; align-items: center; gap: 5px; margin-top: 12px; font-size: 0.82rem; font-weight: 600; color: var(--navy); transition: gap 0.2s var(--ease); }
.sol-link:hover { gap: 9px; }
.sol-link svg { width: 13px; height: 13px; }

/* ══════════════════════════════════════════════════════════════════
   INTEGRATIONS ORBIT
══════════════════════════════════════════════════════════════════ */
.int-orbit { position: relative; width: 300px; height: 300px; margin-inline: auto; margin-bottom: 44px; }
.int-center { position: absolute; top:50%;left:50%; transform:translate(-50%,-50%); width:74px;height:74px; background:var(--navy); border-radius:18px; display:grid; place-items:center; font-size:28px; z-index:2; box-shadow:0 0 0 13px rgba(11,79,126,.09),0 0 0 26px rgba(11,79,126,.05); }
.int-ring { position:absolute; top:50%;left:50%; border:1.5px dashed rgba(11,79,126,.14); border-radius:50%; transform:translate(-50%,-50%); }
.int-ring-1 { width:160px;height:160px; }
.int-ring-2 { width:265px;height:265px; }
.int-node-item { position:absolute; width:45px;height:45px; background:#fff; border:1.5px solid var(--border); border-radius:11px; display:grid; place-items:center; font-size:17px; box-shadow:var(--shadow-xs); transition:transform 0.25s var(--ease-spring),border-color 0.2s; cursor:default; }
.int-node-item:hover { transform:scale(1.22) !important; border-color:var(--navy); }
.int-pills-wrap { display:flex; flex-wrap:wrap; justify-content:center; gap:9px; }
.int-pill { display:flex; align-items:center; gap:6px; padding:7px 15px; background:#fff; border:1px solid var(--border); border-radius:100px; font-size:0.8rem; font-weight:500; color:var(--text-muted); transition:border-color 0.2s,color 0.2s,transform 0.2s var(--ease-spring); cursor:default; }
.int-pill:hover { border-color:var(--navy); color:var(--navy); transform:translateY(-3px); }
.int-pill-dot { width:6px;height:6px; border-radius:50%; background:var(--navy); opacity:.38; }

/* ══════════════════════════════════════════════════════════════════
   PRICING
══════════════════════════════════════════════════════════════════ */
.pricing-toggle { display:flex; align-items:center; justify-content:center; gap:12px; margin-bottom:52px; }
.toggle-label { font-family:'Space Grotesk',sans-serif; font-size:0.82rem; font-weight:600; color:var(--text-muted); }
.toggle-switch { width:48px; height:26px; background:var(--navy); border-radius:100px; position:relative; cursor:pointer; border:none; transition:background 0.2s; }
.toggle-knob { position:absolute; top:3px; left:3px; width:20px; height:20px; background:#fff; border-radius:50%; transition:transform 0.25s var(--ease-spring); box-shadow:var(--shadow-xs); }
.toggle-switch.annual .toggle-knob { transform:translateX(22px); }
.toggle-save { background:var(--sky-light); color:var(--navy); padding:3px 9px; border-radius:100px; font-size:0.68rem; font-weight:700; letter-spacing:0.06em; font-family:'Space Grotesk',sans-serif; text-transform:uppercase; }
.pricing-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; align-items:stretch; max-width:1100px; margin:0 auto; }
.price-card {
  display: flex; flex-direction: column;
  background:#fff; border:1.5px solid var(--border); border-radius:18px;
  padding:34px 28px; position:relative;
  overflow: hidden;
  transition: border-color .3s var(--ease), box-shadow .3s var(--ease), transform .3s var(--ease);
}
.price-card:hover { border-color: rgba(11,79,126,.3); box-shadow: 0 8px 30px rgba(11,79,126,.06); transform: translateY(-4px); }
.price-card.featured {
  border: 1.5px solid rgba(11,79,126,.35);
  background: #fff;
  box-shadow: 0 4px 20px rgba(11,79,126,.05);
}
.price-card.featured:hover { transform: translateY(-4px); box-shadow: 0 8px 30px rgba(11,79,126,.08); border-color: var(--navy); }
.price-popular {
  position: absolute; top: -13px; left: 50%; transform: translateX(-50%);
  background: linear-gradient(135deg, #0B4F7E, #1a7fc2);
  color: #fff;
  font-family: 'Manrope', sans-serif;
  font-size: 0.65rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  padding: 5px 14px; border-radius: 100px;
  white-space: nowrap;
  box-shadow: 0 4px 12px rgba(11,79,126,.25);
}
.price-tier {
  font-family: 'Manrope', sans-serif;
  font-size: 1.7rem; letter-spacing: -0.02em;
  color: var(--text); margin-bottom: 10px; font-weight: 800;
  line-height: 1.1;
}
.price-card.featured .price-tier { color: var(--navy); }
.price-amt {
  font-family: 'Manrope', sans-serif;
  font-size: 1.6rem; font-weight: 800; color: var(--text);
  letter-spacing: -0.02em; line-height: 1.1; margin-bottom: 4px;
}
.price-amt.pri-price-custom { font-size: 1.5rem; }
.price-card.featured .price-amt { color: var(--navy); }
.price-amt sup { font-size: 1rem; vertical-align: top; margin-top: 6px; }
.price-amt sub { font-size: 0.85rem; font-weight: 500; color: var(--text-muted); }
.price-desc { font-size: 0.85rem; color: var(--text-muted); margin: 16px 0 22px; line-height: 1.65; }
.price-card.featured .price-desc { color: var(--text); }
.price-divider { height: 1px; background: var(--border); margin-bottom: 18px; }
.price-card.featured .price-divider { background: rgba(11,79,126,.15); }
.price-feats { display: flex; flex-direction: column; gap: 11px; margin-bottom: 26px; flex: 1; }
.price-feat {
  display: flex; align-items: flex-start; gap: 9px;
  font-family: 'Manrope', sans-serif;
  font-size: 0.85rem; color: var(--text); line-height: 1.5;
}
.price-card.featured .price-feat { color: var(--text); }
.pf-ck {
  width: 18px; height: 18px;
  background: var(--sky-light); border-radius: 6px;
  display: grid; place-items: center; flex-shrink: 0; margin-top: 1px;
}
.pf-ck svg { width: 10px; height: 10px; color: var(--navy); }
.price-card .btn { padding: 12px 18px; border-radius: 10px; font-weight: 700; font-size: 0.9rem; }

/* Plan icons */
.price-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.price-icon {
  width: 40px; height: 40px; border-radius: 11px;
  display: grid; place-items: center; flex-shrink: 0;
}
.price-icon-starter { background: rgba(34,197,94,.1); color: #16a34a; }
.price-icon-business { background: linear-gradient(135deg, #0B4F7E, #1a7fc2); color: #fff; }
.price-icon-enterprise { background: rgba(11,79,126,.08); color: var(--navy); border: 1px solid rgba(11,79,126,.15); }

.price-head .price-tier { margin-bottom: 0; }

/* Plan distinction */
.price-card-starter { border-top: 3px solid #16a34a; }
.price-card-business {} /* gradient already from .featured */
.price-card-enterprise { border-top: 3px solid var(--navy); background: linear-gradient(180deg, #fff 0%, #f8fafc 100%); }
.price-card-enterprise:hover { border-color: var(--navy); }

/* Button placement (move btn before features) */
.price-card-btn { display: block !important; text-align: center; margin-bottom: 22px; }

/* Feature labels */
.price-feats-label {
  font-family: 'Manrope', sans-serif;
  font-size: 0.72rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .08em;
  color: var(--text-muted);
  margin-bottom: 14px;
}
.price-feats-label strong { color: var(--text); font-weight: 700; }

/* Not-available features (Starter only) */
.price-feat-na { opacity: .45; }
.price-feat-na .pf-ck-na { background: var(--gray-100) !important; }
.price-feat-na .pf-ck-na svg { color: var(--text-faint); }
.price-feat-na span:not(.pf-ck) { text-decoration: line-through; color: var(--text-muted) !important; }

/* Deployment toggle — refined professional switch */
.pri-deploy-toggle-wrap { display: flex; justify-content: center; margin-top: -8px; }
.pri-deploy-toggle {
  position: relative;
  display: inline-flex; gap: 0; padding: 5px;
  background: #f4f6f9;
  border: 1px solid rgba(11,79,126,.08);
  border-radius: 999px;
  margin: 0 auto;
  box-shadow: inset 0 1px 2px rgba(11,79,126,.04);
}
.pri-deploy-toggle::before {
  content: '';
  position: absolute;
  top: 5px; bottom: 5px;
  width: calc(50% - 5px);
  background: var(--navy);
  border-radius: 999px;
  box-shadow: 0 2px 6px rgba(11,79,126,.18);
  transition: transform .4s cubic-bezier(.4, 0, .2, 1);
  transform: translateX(0);
  z-index: 0;
}
.pri-deploy-toggle.cloud::before { transform: translateX(100%); }
.pri-deploy-btn {
  position: relative; z-index: 1;
  display: flex; align-items: center; gap: 9px;
  padding: 11px 30px; border-radius: 999px;
  font-family: 'Manrope', sans-serif; font-size: 0.84rem; font-weight: 600;
  color: var(--text-muted); background: transparent; border: none;
  cursor: pointer; transition: color .3s var(--ease);
  flex: 1; justify-content: center; min-width: 165px;
  letter-spacing: -0.005em;
}
.pri-deploy-btn:hover:not(.active) { color: var(--text); }
.pri-deploy-btn.active { color: #fff; }
.pri-deploy-btn svg { color: currentColor; transition: color .3s; }

.pri-deploy-desc {
  text-align: center; font-family: 'Manrope', sans-serif;
  font-size: 0.86rem; color: var(--text-muted);
  margin: 28px auto 36px; min-height: 22px; line-height: 1.6;
  max-width: 520px;
  transition: opacity .3s var(--ease);
}
.price-users {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: 'Manrope', sans-serif; font-size: 0.82rem; font-weight: 600;
  color: var(--navy);
  background: var(--sky-light); border: 1px solid rgba(11,79,126,.15);
  padding: 6px 14px; border-radius: 100px;
  margin-bottom: 22px;
}
.price-users::before {
  content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--navy);
}
.price-card.featured .price-users { background: var(--sky-light); border-color: rgba(11,79,126,.2); color: var(--navy); }
.price-card.featured .price-users::before { background: var(--navy); }
.pri-price-custom { letter-spacing: -0.02em; }
.pri-compare {
  display: flex; justify-content: center; align-items: center; gap: 8px;
  margin-top: 36px; padding: 14px 20px;
  font-family: 'Manrope', sans-serif; font-size: 0.85rem;
  color: var(--text-muted);
}
.pri-compare a {
  display: inline-flex; align-items: center; gap: 5px;
  color: var(--navy); font-weight: 700; text-decoration: none;
  transition: gap .2s;
}
.pri-compare a:hover { gap: 8px; }

/* ── Contact page ─────────────────────────────────────────────── */
.ctc-grid { display: grid; grid-template-columns: 340px 1fr; gap: 32px; align-items: start; max-width: 1100px; margin: 0 auto; }

/* Left column: methods */
.ctc-side { display: flex; flex-direction: column; gap: 16px; }
.ctc-method {
  display: flex; gap: 14px; padding: 22px;
  background: #fff; border: 1px solid var(--border); border-radius: 14px;
  transition: border-color .25s var(--ease), transform .25s var(--ease);
}
.ctc-method:hover { border-color: var(--navy); transform: translateY(-2px); }
.ctc-method-icon {
  width: 40px; height: 40px; border-radius: 10px;
  display: grid; place-items: center; flex-shrink: 0;
}
.ctc-method-icon-blue { background: rgba(11,79,126,.08); color: var(--navy); }
.ctc-method-icon-green { background: rgba(34,197,94,.1); color: #16a34a; }
.ctc-method-icon-navy { background: linear-gradient(135deg, #0B4F7E, #1a7fc2); color: #fff; }
.ctc-method-body { flex: 1; min-width: 0; }
.ctc-method-body h3 {
  font-family: 'Manrope', sans-serif; font-size: 0.92rem; font-weight: 700;
  color: var(--text); margin-bottom: 4px;
}
.ctc-method-body p { font-size: 0.78rem; color: var(--text-muted); line-height: 1.6; margin-bottom: 8px; }
.ctc-method-link {
  display: inline-flex; align-items: center; gap: 5px;
  font-family: 'Manrope', sans-serif; font-size: 0.78rem; font-weight: 600;
  color: var(--navy); text-decoration: none;
  transition: gap .2s;
}
.ctc-method-link:hover { gap: 8px; }

/* Trust badges */
.ctc-trust {
  margin-top: 4px; padding: 18px 22px;
  background: var(--sky-pale); border-radius: 12px;
  display: flex; flex-direction: column; gap: 8px;
}
.ctc-trust-item {
  display: flex; align-items: center; gap: 8px;
  font-family: 'Manrope', sans-serif; font-size: 0.78rem; font-weight: 600;
  color: var(--navy);
}
.ctc-trust-item svg { color: var(--navy); flex-shrink: 0; }

/* Right column: form */
.ctc-form-card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 32px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 4px 24px rgba(11,79,126,.04);
}
.ctc-form-card::before {
  content: '';
  position: absolute;
  top: -120px; right: -120px;
  width: 240px; height: 240px;
  background: radial-gradient(circle, rgba(185,228,255,.4) 0%, transparent 70%);
  pointer-events: none;
}
.ctc-form-header {
  display: flex; align-items: center; gap: 14px;
  margin-bottom: 28px;
  position: relative;
}
.ctc-form-pulse {
  width: 10px; height: 10px; border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 0 6px rgba(34,197,94,.15);
  flex-shrink: 0;
  animation: ctc-pulse 2s ease infinite;
}
@keyframes ctc-pulse {
  0%, 100% { box-shadow: 0 0 0 6px rgba(34,197,94,.15); }
  50% { box-shadow: 0 0 0 10px rgba(34,197,94,.05); }
}
.ctc-form-title {
  font-family: 'Manrope', sans-serif; font-size: 1.2rem; font-weight: 800;
  color: var(--text); margin-bottom: 2px;
}
.ctc-form-sub { font-size: 0.78rem; color: var(--text-muted); }

.ctc-form { display: flex; flex-direction: column; gap: 14px; position: relative; }
.ctc-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.ctc-field { display: flex; flex-direction: column; gap: 5px; }
.ctc-field label {
  font-family: 'Manrope', sans-serif; font-size: 0.72rem; font-weight: 600;
  color: var(--text-muted); letter-spacing: .01em;
}
.ctc-field input, .ctc-field textarea, .ctc-field select {
  padding: 11px 14px;
  border: 1.5px solid var(--border); border-radius: 10px;
  background: #fff; font-family: 'Manrope', sans-serif; font-size: 0.86rem;
  color: var(--text); transition: border-color .2s, box-shadow .2s;
}
.ctc-field input:focus, .ctc-field textarea:focus, .ctc-field select:focus {
  outline: none; border-color: var(--navy);
  box-shadow: 0 0 0 4px rgba(11,79,126,.08);
}
.ctc-field textarea { resize: vertical; min-height: 80px; font-family: inherit; }
.ctc-check {
  display: flex; align-items: flex-start; gap: 9px;
  font-size: 0.74rem; color: var(--text-muted); line-height: 1.55; cursor: pointer;
  margin-top: 4px;
}
.ctc-check input { margin-top: 3px; flex-shrink: 0; accent-color: var(--navy); }
.ctc-submit {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 14px 28px; border-radius: 12px;
  background: linear-gradient(135deg, #0B4F7E, #1a7fc2); color: #fff; border: none;
  font-family: 'Manrope', sans-serif; font-size: 0.92rem; font-weight: 700;
  cursor: pointer; transition: transform .2s var(--ease), box-shadow .2s var(--ease);
  margin-top: 8px;
}
.ctc-submit:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(11,79,126,.25); }
.ctc-submit svg { transition: transform .2s; }
.ctc-submit:hover svg { transform: translateX(3px); }

@media (max-width: 880px) {
  .ctc-grid { grid-template-columns: 1fr; }
  .ctc-row { grid-template-columns: 1fr; }
  .ctc-form-card { padding: 24px; }
}

/* ── FAQ page ─────────────────────────────────────────────────── */
.faq-search-wrap {
  position: relative; max-width: 480px; margin: 28px auto 0;
}
.faq-search-icon {
  position: absolute; left: 16px; top: 50%; transform: translateY(-50%);
  color: var(--text-faint);
  pointer-events: none;
}
.faq-search-input {
  width: 100%; padding: 14px 18px 14px 44px;
  border: 1.5px solid var(--border); border-radius: 12px;
  background: #fff; font-family: 'Manrope', sans-serif; font-size: 0.92rem; color: var(--text);
  transition: border-color .2s, box-shadow .2s;
}
.faq-search-input:focus {
  outline: none; border-color: var(--navy);
  box-shadow: 0 0 0 4px rgba(11,79,126,.08);
}
.faq-search-input::placeholder { color: var(--text-faint); }

.faq-tabs {
  display: flex; gap: 6px; flex-wrap: wrap; justify-content: center;
  margin-bottom: 32px;
}
.faq-tab {
  padding: 8px 18px; border-radius: 100px;
  background: transparent; border: 1.5px solid var(--border);
  font-family: 'Manrope', sans-serif; font-size: 0.78rem; font-weight: 600;
  color: var(--text-muted); cursor: pointer;
  transition: all .2s var(--ease);
}
.faq-tab:hover { color: var(--text); border-color: var(--border-dark); }
.faq-tab.active { background: var(--navy); border-color: var(--navy); color: #fff; }

#faqList { display: block; max-width: 760px; margin: 0 auto; }
#faqList { display: block; max-width: 760px; margin: 0 auto; }
#faqList .faq-item {
  display: block;
  background: #fff; border: 1.5px solid var(--border); border-radius: 14px;
  margin-bottom: 10px; transition: border-color .25s var(--ease), box-shadow .25s var(--ease);
  overflow: hidden;
}
#faqList .faq-q { display: flex; visibility: visible; opacity: 1; }
#faqList .faq-q span { display: inline; visibility: visible; }
#faqList .faq-q * { pointer-events: none; }
#faqList .faq-item:hover { border-color: var(--border-dark); }
#faqList .faq-item.open { border-color: var(--navy); box-shadow: 0 4px 20px rgba(11,79,126,.06); }
#faqList .faq-q {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 18px 22px; background: none; border: none; cursor: pointer;
  font-family: 'Manrope', sans-serif; font-size: 0.94rem; font-weight: 700;
  color: var(--text); text-align: left;
}
#faqList .faq-q span { flex: 1; }
#faqList .faq-chev {
  width: 18px; height: 18px; flex-shrink: 0; color: var(--navy);
  transition: transform .25s var(--ease);
}
#faqList .faq-item.open .faq-chev { transform: rotate(180deg); }
#faqList .faq-a {
  max-height: 0;
  overflow: hidden;
  font-size: 0.86rem; color: var(--text-muted); line-height: 1.7;
  transition: max-height .25s var(--ease), padding .25s var(--ease);
  padding: 0 22px;
}
#faqList .faq-item.open > .faq-a { max-height: 400px; padding: 4px 22px 20px; }
#faqList .faq-a p { margin-bottom: 10px; }
#faqList .faq-a p:last-child { margin-bottom: 0; }
#faqList .faq-a ul { padding-left: 18px; margin: 8px 0 12px; display: flex; flex-direction: column; gap: 4px; }
#faqList .faq-a li { font-size: 0.84rem; color: var(--text-muted); line-height: 1.65; }
#faqList .faq-a li strong { color: var(--text); font-weight: 700; }
#faqList .faq-a strong { color: var(--text); }
#faqList .faq-a em { color: var(--navy); font-style: normal; font-weight: 600; }

.faq-empty {
  display: none; flex-direction: column; align-items: center; gap: 10px;
  padding: 48px 20px; color: var(--text-muted);
  text-align: center;
}
.faq-empty svg { color: var(--text-faint); }

.faq-list { max-width: 760px; margin: 0 auto; }

/* Pricing CTA card */
.pri-cta { padding: clamp(32px, 5vw, 56px) 0 clamp(64px, 8vw, 100px); }
.pri-cta-card {
  position: relative; overflow: hidden; border-radius: 20px;
  background: linear-gradient(135deg, #0B4F7E 0%, #083D62 100%);
  padding: 56px 40px; text-align: center;
}
.pri-cta-card-bg {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(185,228,255,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(185,228,255,.04) 1px, transparent 1px);
  background-size: 40px 40px;
  mask-image: radial-gradient(ellipse 70% 70% at 50% 50%, black 20%, transparent 100%);
  -webkit-mask-image: radial-gradient(ellipse 70% 70% at 50% 50%, black 20%, transparent 100%);
  pointer-events: none;
}
.pri-cta-content { position: relative; }
.pri-cta-logo { width: 48px; height: auto; filter: brightness(0) invert(1); margin-bottom: 20px; opacity: .8; }
.pri-cta-title {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(1.6rem, 3.5vw, 2.4rem);
  font-weight: 900; letter-spacing: -0.03em; line-height: 1.1;
  color: #fff; margin-bottom: 14px;
  max-width: 480px; margin-inline: auto;
}
.pri-cta-sub {
  font-size: 0.95rem; color: rgba(255,255,255,.45); line-height: 1.7;
  max-width: 420px; margin: 0 auto 28px;
}

/* Comparison table */
.comp-table { width:100%; border-collapse:collapse; margin-top:56px; }
.comp-table th { font-family:'Space Grotesk',sans-serif; font-size:0.75rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:14px 16px; text-align:left; border-bottom:2px solid var(--border); }
.comp-table th:first-child { color:var(--text-muted); }
.comp-table th:not(:first-child) { color:var(--navy); text-align:center; }
.comp-table td { padding:12px 16px; border-bottom:1px solid var(--border); font-size:0.86rem; vertical-align:middle; }
.comp-table td:first-child { color:var(--text-muted); }
.comp-table td:not(:first-child) { text-align:center; }
.comp-table tr:hover td { background:var(--sky-pale); }
.comp-table .featured-col { background:rgba(11,79,126,.04); }
.comp-check { color:var(--navy); font-size:1rem; }
.comp-dash { color:var(--text-faint); }
.comp-table-section td { background:var(--gray-50); font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:0.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--text-muted); padding:10px 16px; }

/* Pricing FAQ accordion */
.faq-list { display:flex; flex-direction:column; gap:12px; }
.faq-item { background:#fff; border:1px solid var(--border); border-radius:var(--radius-md); overflow:hidden; transition:border-color 0.2s; }
.faq-item.open { border-color:var(--border-dark); }
.faq-q { display:flex; align-items:center; justify-content:space-between; padding:18px 22px; cursor:pointer; font-family:'Manrope',sans-serif; font-weight:700; font-size:0.95rem; color:var(--text); user-select:none; }
.faq-q svg { width:18px;height:18px; flex-shrink:0; color:var(--navy); transition:transform 0.25s var(--ease); }
.faq-item.open .faq-q svg { transform:rotate(180deg); }
.faq-a { max-height:0; overflow:hidden; transition:max-height 0.35s var(--ease), padding 0.35s; padding:0 22px; font-size:0.9rem; color:var(--text-muted); line-height:1.75; }
.faq-item.open .faq-a { max-height:200px; padding:0 22px 18px; }

/* ══════════════════════════════════════════════════════════════════
   RESOURCES PAGE
══════════════════════════════════════════════════════════════════ */

/* Resource quick-nav */
.res-nav { display:flex; justify-content:center; gap:10px; flex-wrap:wrap; margin-bottom:10px; }
.res-nav-pill { display:inline-flex; align-items:center; gap:6px; padding:9px 20px; background:#fff; border:1.5px solid var(--border); border-radius:100px; font-family:'Space Grotesk',sans-serif; font-size:0.8rem; font-weight:700; letter-spacing:.04em; color:var(--text-muted); text-decoration:none; transition:border-color 0.2s,color 0.2s,background 0.2s,box-shadow 0.2s; }
.res-nav-pill:hover { border-color:var(--navy); color:var(--navy); background:var(--sky-light); box-shadow:0 2px 8px rgba(11,79,126,.1); }

/* Blog */
.blog-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.blog-card { background:#fff; border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; display:flex; flex-direction:column; transition:border-color 0.25s,box-shadow 0.25s,transform 0.25s var(--ease); }
.blog-card:hover { border-color:var(--border-dark); box-shadow:var(--shadow-md); transform:translateY(-5px); }
.blog-thumb { height:180px; display:flex; align-items:center; justify-content:center; font-size:52px; position:relative; overflow:hidden; }
.blog-thumb-1 { background:linear-gradient(135deg,#1a1a2e,#16213e); }
.blog-thumb-2 { background:linear-gradient(135deg,#0b4f7e,#1a7fc2); }
.blog-thumb-3 { background:linear-gradient(135deg,#0a3d62,#1e5f84); }
.blog-thumb::after { content:''; position:absolute; inset:0; background:linear-gradient(0deg,rgba(11,79,126,.15)0%,transparent 60%); }
.blog-body { padding:22px; display:flex; flex-direction:column; flex:1; }
.blog-tag-chip { display:inline-block; padding:3px 10px; border-radius:100px; font-family:'Space Grotesk',sans-serif; font-size:0.63rem; font-weight:700; letter-spacing:.07em; text-transform:uppercase; margin-bottom:12px; }
.blog-tag-red  { background:#fff0f0; color:#c0392b; }
.blog-tag-blue { background:var(--sky-light); color:var(--navy); }
.blog-tag-teal { background:#e8f8f5; color:#0d6e5a; }
.blog-card h3 { font-family:'Manrope',sans-serif; font-size:1rem; font-weight:700; color:var(--text); line-height:1.4; margin-bottom:10px; }
.blog-card p { font-size:0.83rem; color:var(--text-muted); line-height:1.7; margin-bottom:14px; flex:1; }
.blog-meta { display:flex; align-items:center; justify-content:space-between; font-size:0.76rem; color:var(--text-faint); border-top:1px solid var(--border); padding-top:12px; margin-top:auto; }
.blog-read-link { color:var(--navy); font-weight:600; text-decoration:none; }
.blog-read-link:hover { text-decoration:underline; }

/* Contact form */
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start; }
.contact-info h3 { font-family:'Manrope',sans-serif; font-size:1.3rem; font-weight:800; color:var(--text); margin-bottom:12px; }
.contact-info p { font-size:0.9rem; color:var(--text-muted); line-height:1.75; margin-bottom:28px; }
.contact-method { display:flex; align-items:flex-start; gap:14px; margin-bottom:20px; }
.contact-method-icon { width:40px;height:40px; background:var(--sky-light); border-radius:10px; display:grid; place-items:center; font-size:17px; flex-shrink:0; }
.contact-method-label { font-family:'Space Grotesk',sans-serif; font-size:0.68rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--text-faint); }
.contact-method-value { font-size:0.9rem; font-weight:500; color:var(--text); margin-top:2px; }
.contact-form { background:#fff; border:1px solid var(--border); border-radius:var(--radius-xl); padding:36px; display:flex; flex-direction:column; gap:14px; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.form-field { display:flex; flex-direction:column; gap:6px; }
.form-field label { font-family:'Space Grotesk',sans-serif; font-size:0.72rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--text-muted); }
.form-field input, .form-field textarea, .form-field select { padding:11px 14px; border:1.5px solid var(--border); border-radius:var(--radius-sm); font-family:'Inter',sans-serif; font-size:0.88rem; color:var(--text); background:#fff; transition:border-color 0.2s,box-shadow 0.2s; resize:none; outline:none; appearance:none; }
.form-field input:focus, .form-field textarea:focus, .form-field select:focus { border-color:var(--navy); box-shadow:0 0 0 3px rgba(11,79,126,.08); }
.form-field textarea { height:110px; }
.form-success { display:none; background:#f0faf5; border:1px solid #a8e6c8; border-radius:var(--radius-sm); padding:14px 18px; font-size:0.88rem; color:#0d6e5a; font-weight:500; }

/* Documentation cards */
.doc-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.doc-card { background:#fff; border:1px solid var(--border); border-radius:var(--radius-md); padding:26px 20px; text-align:center; text-decoration:none; display:flex; flex-direction:column; transition:border-color 0.2s,box-shadow 0.2s,transform 0.2s var(--ease); }
.doc-card:hover { border-color:var(--navy); box-shadow:var(--shadow-sm); transform:translateY(-4px); }
.doc-icon { font-size:28px; margin-bottom:14px; }
.doc-card h4 { font-family:'Manrope',sans-serif; font-size:0.9rem; font-weight:700; color:var(--text); margin-bottom:8px; }
.doc-card p { font-size:0.78rem; color:var(--text-muted); line-height:1.6; flex:1; }
.doc-link { display:inline-block; margin-top:16px; font-family:'Space Grotesk',sans-serif; font-size:0.75rem; font-weight:700; letter-spacing:.04em; color:var(--navy); }

/* ══════════════════════════════════════════════════════════════════
   PRODUCT PAGE SPECIFIC
══════════════════════════════════════════════════════════════════ */
.modules-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.module-card { background:#fff; border:1px solid var(--border); border-radius:var(--radius-lg); padding:28px 24px; position:relative; overflow:hidden; transition:border-color 0.25s,box-shadow 0.25s,transform 0.25s var(--ease); }
.module-card::after { content:''; position:absolute; top:0;left:0;right:0; height:2px; background:linear-gradient(90deg,var(--navy),var(--sky)); transform:scaleX(0); transform-origin:left; transition:transform 0.3s; }
.module-card:hover { border-color:var(--border-dark); box-shadow:var(--shadow-md); transform:translateY(-6px); }
.module-card:hover::after { transform:scaleX(1); }
.module-num { font-family:'Space Grotesk',sans-serif; font-size:0.65rem; font-weight:700; letter-spacing:.12em; color:var(--text-faint); margin-bottom:16px; }
.module-icon { width:46px;height:46px; background:var(--sky-light); border-radius:11px; display:grid; place-items:center; font-size:19px; margin-bottom:14px; transition:background 0.2s,transform 0.25s var(--ease-spring); }
.module-card:hover .module-icon { background:var(--navy); transform:scale(1.08) rotate(-4deg); }
.module-card h3 { font-family:'Manrope',sans-serif; font-size:1rem; font-weight:700; color:var(--text); margin-bottom:9px; }
.module-card p { font-size:0.83rem; color:var(--text-muted); line-height:1.7; }

/* Architecture visual */
.arch-visual { background:linear-gradient(135deg,var(--navy-deeper),var(--navy)); border-radius:var(--radius-xl); padding:36px; box-shadow:var(--shadow-xl); position:relative; overflow:hidden; }
.arch-visual::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 60% 60% at 80% 20%,rgba(185,228,255,.08)0%,transparent 60%); pointer-events:none; }
.arch-layers { display:flex; flex-direction:column; gap:10px; position:relative; z-index:1; }
.arch-layer { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.09); border-radius:10px; padding:14px 20px; display:flex; align-items:center; gap:14px; }
.arch-layer-icon { width:36px;height:36px; background:rgba(185,228,255,.12); border-radius:8px; display:grid; place-items:center; font-size:16px; flex-shrink:0; }
.arch-layer-name { font-family:'Space Grotesk',sans-serif; font-size:0.78rem; font-weight:700; color:#fff; letter-spacing:.04em; }
.arch-layer-desc { font-size:0.73rem; color:rgba(255,255,255,.5); margin-top:1px; }
.arch-arrow { text-align:center; color:rgba(255,255,255,.25); font-size:1.1rem; }

/* ══════════════════════════════════════════════════════════════════
   SOLUTIONS PAGE SPECIFIC
══════════════════════════════════════════════════════════════════ */
.industry-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.industry-card { background:#fff; border:1px solid var(--border); border-radius:var(--radius-lg); padding:30px 26px; transition:border-color 0.25s,box-shadow 0.25s,transform 0.25s var(--ease); }
.industry-card:hover { border-color:var(--border-dark); box-shadow:var(--shadow-md); transform:translateY(-6px); }
.industry-card.featured { border-color:var(--navy); background:var(--sky-pale); }
.ind-icon { width:52px;height:52px; background:linear-gradient(135deg,var(--navy),#1a7fc2); border-radius:13px; display:grid; place-items:center; font-size:22px; margin-bottom:18px; }
.industry-card h3 { font-family:'Manrope',sans-serif; font-size:1.05rem; font-weight:700; color:var(--text); margin-bottom:9px; }
.industry-card p { font-size:0.84rem; color:var(--text-muted); line-height:1.7; margin-bottom:14px; }
.ind-badges { display:flex; flex-wrap:wrap; gap:6px; }
.ind-badge { background:var(--sky-light); color:var(--navy); padding:3px 9px; border-radius:100px; font-family:'Space Grotesk',sans-serif; font-size:0.63rem; font-weight:700; letter-spacing:.06em; }

/* Usecase strip */
.usecase-strip { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; }
.usecase-item { background:#fff; padding:24px 20px; text-align:center; transition:background 0.2s; }
.usecase-item:hover { background:var(--sky-pale); }
.usecase-icon { font-size:24px; margin-bottom:12px; }
.usecase-item h4 { font-family:'Manrope',sans-serif; font-size:0.9rem; font-weight:700; color:var(--text); margin-bottom:7px; }
.usecase-item p { font-size:0.78rem; color:var(--text-muted); line-height:1.6; }

/* ── Solutions hero ─────────────────────────────────────────────── */
.solh {
  padding-top: calc(var(--header-h) + 60px);
  padding-bottom: 24px;
  position: relative;
  overflow: hidden;
}
.solh-content {
  max-width: 720px;
  margin: 0 auto;
  text-align: center;
  position: relative;
  z-index: 1;
}
.solh-kicker {
  font-family: 'Manrope', sans-serif;
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--navy);
  margin-bottom: 20px;
  text-align: center;
}
.solh-title {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(2.2rem, 5vw, 3.6rem);
  font-weight: 900;
  letter-spacing: -0.04em;
  line-height: 1.08;
  color: var(--text);
  margin-bottom: 22px;
  text-align: center;
}
.solh-highlight {
  position: relative;
  display: inline;
  background: linear-gradient(180deg, transparent 58%, var(--sky-light) 58%, var(--sky-light) 90%, transparent 90%);
}
.solh-sub {
  font-size: 1.08rem;
  color: var(--text-muted);
  line-height: 1.8;
  max-width: 520px;
  margin: 0 auto 32px;
}
.solh-actions {
  display: flex;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
}

.sol-tag-pill {
  display: table;
  margin: 0 auto 18px;
  padding: 7px 20px;
  border: 1.5px solid var(--navy);
  border-radius: 100px;
  font-family: 'Manrope', sans-serif;
  font-size: 0.74rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--navy);
  text-align: center;
}

@media (max-width: 768px) {
  .solh { padding-top: calc(var(--header-h) + 36px); }
  .solh-title { font-size: clamp(1.8rem, 6vw, 2.6rem); }
}

/* Solutions CTA radar */
.sol-cta-radar-wrap { display: flex; align-items: center; justify-content: center; }
.sol-cta-radar { width: 320px; height: 320px; }

/* ── Dropbox upload demo ───────────────────────────────────────── */
.sol-dropbox { background: #fff; min-height: 280px; display: flex; flex-direction: column; }
.sol-dbx-drop {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 20px 16px; border-bottom: 1px solid #e8e8e8;
  background: linear-gradient(180deg, #f7f7f7 0%, #fff 100%);
}
.sol-dbx-drop-icon { color: #0061fe; margin-bottom: 6px; }
.sol-dbx-drop-text { font-family: 'Manrope', sans-serif; font-size: 0.82rem; font-weight: 600; color: var(--text); }
.sol-dbx-drop-acct { font-size: 0.62rem; color: var(--text-faint); margin-top: 2px; }
.sol-dbx-files { padding: 10px 14px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.sol-dbx-file {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 10px; border-radius: 8px;
  background: #f9fafb; border: 1px solid #eee;
  transition: all .4s;
}
.sol-dbx-file.blocked { border-color: rgba(239,68,68,.35); background: rgba(239,68,68,.03); }
.sol-dbx-file-icon {
  width: 28px; height: 28px; border-radius: 6px;
  display: grid; place-items: center; flex-shrink: 0;
}
.sol-dbx-xlsx { background: #0d7c3d; color: #fff; }
.sol-dbx-pdf { background: #d93025; color: #fff; }
.sol-dbx-file-info { flex: 1; min-width: 0; }
.sol-dbx-file-name {
  display: block; font-family: 'Manrope', sans-serif; font-size: 0.7rem;
  font-weight: 600; color: var(--text); margin-bottom: 5px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  transition: all .3s;
}
.sol-dbx-file.blocked .sol-dbx-file-name { text-decoration: line-through; opacity: .4; }
.sol-dbx-file-bar { height: 3px; background: #e5e7eb; border-radius: 100px; overflow: hidden; }
.sol-dbx-file-fill { height: 100%; width: 0; background: #0061fe; border-radius: 100px; transition: width .12s linear; }
.sol-dbx-file.blocked .sol-dbx-file-fill { background: #ef4444; }
.sol-dbx-file-status {
  font-family: 'Manrope', sans-serif; font-size: 0.6rem; font-weight: 700;
  flex-shrink: 0; white-space: nowrap; min-width: 50px; text-align: right;
}

/* ── DeepSeek interface demo ────────────────────────────────────── */
.sol-deepseek { display: flex; min-height: 270px; background: #fff; }
.sol-ds-side {
  width: 130px; background: #f7f8fa; border-right: 1px solid #e8eaed;
  padding: 10px 8px; display: flex; flex-direction: column; gap: 4px;
  flex-shrink: 0;
}
.sol-ds-new {
  display: flex; align-items: center; gap: 5px;
  padding: 7px 10px; border-radius: 6px;
  background: #4d6bfe; color: #fff;
  font-size: 0.62rem; font-weight: 600; margin-bottom: 8px; cursor: default;
}
.sol-ds-side-label { font-size: 0.52rem; color: #999; text-transform: uppercase; letter-spacing: .08em; font-weight: 600; padding: 4px 6px; }
.sol-ds-side-item {
  padding: 6px 8px; border-radius: 5px; font-size: 0.6rem; color: #555;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: default;
}
.sol-ds-side-item.active { background: #e8eaff; color: #4d6bfe; font-weight: 600; }

.sol-ds-chat { flex: 1; display: flex; flex-direction: column; position: relative; min-width: 0; }
.sol-ds-chat-head {
  display: flex; align-items: center; gap: 6px;
  padding: 8px 14px; border-bottom: 1px solid #e8eaed;
  font-family: 'Manrope', sans-serif; font-size: 0.76rem; font-weight: 700; color: var(--text);
}
.sol-ds-model { font-size: 0.6rem; font-weight: 500; color: #999; margin-left: auto; }
.sol-ds-chat-body { flex: 1; padding: 12px 14px; overflow: hidden; }
.sol-ds-msg { display: flex; justify-content: flex-end; }
.sol-ds-bubble-user {
  max-width: 90%; padding: 10px 14px; border-radius: 14px 14px 4px 14px;
  background: #4d6bfe; color: #fff; font-size: 0.72rem; line-height: 1.6;
  white-space: pre-wrap; word-break: break-word;
}
.sol-ds-typing-label { display: block; font-size: 0.58rem; opacity: .5; margin-bottom: 4px; text-transform: uppercase; letter-spacing: .06em; }
.sol-ds-typed { display: block; min-height: 50px; }

.sol-ds-block {
  position: absolute; inset: 0; left: 130px;
  background: rgba(239,68,68,.07); backdrop-filter: blur(4px);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
  opacity: 0; pointer-events: none; transition: opacity .4s var(--ease);
  font-family: 'Manrope', sans-serif; font-size: 0.78rem; font-weight: 700; color: #991b1b;
}
.sol-ds-block svg { color: #dc2626; }
.sol-ds-block.show { opacity: 1; pointer-events: auto; }

@media (max-width: 768px) {
  .sol-ds-side { width: 90px; }
  .sol-ds-block { left: 90px; }
}

/* ── Industry section reveal (modern aesthetic) ─────────────────── */
.sol-ind .product-grid > * {
  opacity: 0;
  filter: blur(6px);
  will-change: opacity, transform, filter;
  transition:
    opacity 1s cubic-bezier(.22,.61,.36,1),
    transform 1s cubic-bezier(.22,.61,.36,1),
    filter .8s cubic-bezier(.22,.61,.36,1);
}
/* Whole section alternates: Finance LEFT, Healthcare RIGHT, Manufacturing LEFT, Public RIGHT, SMEs LEFT */
#finance .product-grid > * { transform: translateX(-100px); }
#health  .product-grid > * { transform: translateX( 100px); }
#mfg     .product-grid > * { transform: translateX(-100px); }
#public  .product-grid > * { transform: translateX( 100px); }
#sme     .product-grid > * { transform: translateX(-100px); }

.sol-ind.is-visible .product-grid > * {
  opacity: 1;
  transform: translateX(0);
  filter: blur(0);
}
.sol-ind.is-visible .product-grid > *:nth-child(1) { transition-delay: .05s; }
.sol-ind.is-visible .product-grid > *:nth-child(2) { transition-delay: .2s; }

/* On mobile fall back to vertical to avoid horizontal overflow */
@media (max-width: 768px) {
  .sol-ind .product-grid > *,
  .sol-ind .product-grid.product-grid-reverse > * {
    transform: translateY(40px) !important;
  }
  .sol-ind.is-visible .product-grid > * {
    transform: translateY(0) !important;
  }
}

/* Subtle background fade for whole section */
.sol-ind { position: relative; }
.sol-ind::before {
  content: '';
  position: absolute;
  inset: 0;
  background: inherit;
  opacity: 0;
  transition: opacity 1s ease;
  pointer-events: none;
  z-index: 0;
}
.sol-ind.is-visible::before { opacity: 1; }
.sol-ind > * { position: relative; z-index: 1; }

@media (prefers-reduced-motion: reduce) {
  .sol-ind .product-grid > * { opacity: 1 !important; transform: none !important; filter: none !important; }
}

/* ── Solutions feature list ─────────────────────────────────────── */
.sol-feat-list { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.sol-feat {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 14px;
  background: var(--sky-pale);
  border-radius: 8px;
  font-family: 'Manrope', sans-serif;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--text);
}
.sol-feat svg { color: var(--navy); flex-shrink: 0; }

/* ── Healthcare X-ray preview ──────────────────────────────────── */
.sol-xray-preview { padding: 0; }
.sol-xray-img {
  position: relative;
  background: #0a0e14;
  height: 140px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-bottom: 1px solid #1a2030;
}
.sol-xray-svg { width: 160px; height: auto; opacity: .9; }
.sol-xray-overlay {
  position: absolute;
  top: 6px; left: 8px;
  display: flex; flex-direction: column; gap: 1px;
}
.sol-xray-overlay-br {
  position: absolute;
  bottom: 6px; right: 8px;
  display: flex; flex-direction: column; align-items: flex-end; gap: 1px;
}
.sol-xray-tag {
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.48rem;
  color: rgba(180,210,240,.5);
  letter-spacing: .04em;
}
.sol-xray-scanline {
  position: absolute;
  left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(239,68,68,.6), transparent);
  box-shadow: 0 0 8px rgba(239,68,68,.3);
  opacity: 0;
  transition: opacity .3s;
}
.sol-xray-scanline.active {
  opacity: 1;
  animation: sol-xray-scan 1.5s ease-in-out forwards;
}
@keyframes sol-xray-scan {
  0% { top: 0; }
  100% { top: 100%; }
}

/* ── Healthcare ZIP exfiltration demo ───────────────────────────── */
.sol-zip { background: #f6f6f6; min-height: 280px; display: flex; flex-direction: column; position: relative; font-family: 'Segoe UI', 'Manrope', sans-serif; }
.sol-zip-header { padding: 10px 14px; background: #fff; border-bottom: 1px solid #e0e0e0; }
.sol-zip-archive { display: flex; align-items: center; gap: 10px; }
.sol-zip-archive svg { color: #d4a017; flex-shrink: 0; }
.sol-zip-archive-info { min-width: 0; }
.sol-zip-name { display: block; font-size: 0.76rem; font-weight: 600; color: var(--text); }
.sol-zip-dest { display: block; font-size: 0.6rem; color: #b91c1c; font-weight: 500; }
.sol-zip-files { padding: 8px 14px; display: flex; flex-direction: column; gap: 4px; flex: 1; }
.sol-zip-file { display: flex; align-items: center; gap: 10px; padding: 8px 10px; background: #fff; border: 1px solid #e8e8e8; border-radius: 6px; transition: all .4s; }
.sol-zip-file.compressing { border-color: #d4a017; background: rgba(212,160,23,.04); }
.sol-zip-file.blocked { border-color: rgba(239,68,68,.4); background: rgba(239,68,68,.04); }
.sol-zip-file-icon { width: 32px; height: 22px; border-radius: 3px; display: grid; place-items: center; font-size: 0.52rem; font-weight: 800; letter-spacing: .03em; flex-shrink: 0; }
.sol-zip-icon-dicom { background: #1a365d; color: #93c5fd; }
.sol-zip-file-info { flex: 1; min-width: 0; }
.sol-zip-file-name { display: block; font-family: 'JetBrains Mono', monospace; font-size: 0.65rem; font-weight: 600; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sol-zip-file-meta { display: block; font-size: 0.55rem; color: var(--text-muted); margin-top: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sol-zip-file.blocked .sol-zip-file-name { text-decoration: line-through; opacity: .5; }
.sol-zip-file.blocked .sol-zip-file-meta { opacity: .4; }
.sol-zip-file-status { font-size: 0.58rem; font-weight: 700; flex-shrink: 0; white-space: nowrap; }
.sol-zip-progress { padding: 10px 14px; background: #fff; border-top: 1px solid #e0e0e0; }
.sol-zip-progress-info { display: flex; justify-content: space-between; margin-bottom: 5px; }
.sol-zip-progress-label { font-size: 0.65rem; color: var(--text-muted); }
.sol-zip-progress-pct { font-size: 0.65rem; font-weight: 700; color: var(--text); font-family: 'JetBrains Mono', monospace; }
.sol-zip-progress-bar { height: 4px; background: #e5e7eb; border-radius: 100px; overflow: hidden; }
.sol-zip-progress-fill { height: 100%; width: 0; background: #d4a017; border-radius: 100px; transition: width .15s linear, background .3s; }
.sol-zip-progress-fill.blocked { background: #ef4444; }
.sol-zip-block { position: absolute; inset: 0; top: auto; bottom: 0; left: 0; right: 0; background: rgba(239,68,68,.06); backdrop-filter: blur(6px); border-top: 2px solid rgba(239,68,68,.25); padding: 16px; opacity: 0; transform: translateY(8px); transition: all .4s var(--ease); border-radius: 0 0 var(--radius-lg) var(--radius-lg); }
.sol-zip-block.show { opacity: 1; transform: translateY(0); }
.sol-zip-block-inner { text-align: center; }
.sol-zip-block-inner svg { color: #dc2626; margin-bottom: 4px; }
.sol-zip-block-title { display: block; font-family: 'Manrope', sans-serif; font-size: 0.78rem; font-weight: 700; color: #991b1b; }
.sol-zip-block-detail { display: block; font-size: 0.62rem; font-weight: 500; color: var(--text-muted); margin-top: 2px; }

/* ── Manufacturing Gemini + blueprint demo ─────────────────────── */
.sol-gemini { background: #fff; min-height: 280px; display: flex; flex-direction: column; position: relative; }
.sol-blueprint { background: #060d18; padding: 0; position: relative; overflow: hidden; }
.sol-blueprint-svg { width: 100%; height: auto; display: block; }
.sol-blueprint-chip {
  position: absolute; bottom: 8px; left: 8px;
  display: flex; align-items: center; gap: 6px;
  padding: 5px 10px; background: rgba(0,20,50,.7); backdrop-filter: blur(8px);
  border: 1px solid rgba(100,180,255,.2); border-radius: 6px;
  font-family: 'JetBrains Mono', monospace; font-size: 0.55rem; color: rgba(100,180,255,.7);
  transition: all .4s;
}
.sol-blueprint-chip svg { color: rgba(100,180,255,.5); flex-shrink: 0; }
.sol-blueprint-chip-size { color: rgba(100,180,255,.4); margin-left: 4px; }
.sol-blueprint-chip.blocked { border-color: rgba(239,68,68,.4); background: rgba(50,0,0,.7); }
.sol-blueprint-chip.blocked, .sol-blueprint-chip.blocked svg { color: rgba(239,68,68,.6); }
.sol-gemini-prompt {
  padding: 12px 16px; flex: 1; display: flex; align-items: flex-start;
  min-height: 44px; border-top: 1px solid var(--border);
}
.sol-gemini-typed {
  font-size: 0.76rem; color: var(--text); line-height: 1.6;
  white-space: pre-wrap; word-break: break-word;
}
.sol-gemini-block {
  position: absolute; inset: 0; top: auto; bottom: 0; left: 0; right: 0;
  background: rgba(239,68,68,.06); backdrop-filter: blur(6px);
  border-top: 2px solid rgba(239,68,68,.25);
  display: flex; align-items: center; justify-content: center; gap: 8px;
  padding: 14px; opacity: 0; transform: translateY(8px);
  transition: all .4s var(--ease);
  border-radius: 0 0 var(--radius-lg) var(--radius-lg);
  font-family: 'Manrope', sans-serif; font-size: 0.78rem; font-weight: 700; color: #991b1b;
}
.sol-gemini-block svg { color: #dc2626; flex-shrink: 0; }
.sol-gemini-block.show { opacity: 1; transform: translateY(0); }

/* ── Phishing demo (Outlook style) ──────────────────────────────── */
.sol-phish { background: #fff; min-height: 260px; display: flex; flex-direction: column; }
.sol-phish-bar { display: flex; align-items: center; gap: 8px; padding: 10px 16px; border-bottom: 1px solid var(--border); }
.sol-phish-subj { flex: 1; font-family: 'Manrope', sans-serif; font-size: 0.8rem; font-weight: 700; color: var(--text); }
.sol-phish-flag { color: var(--text-faint); transition: color .4s; }
.sol-phish-flag.warn { color: #ef4444; }
.sol-phish-meta { display: flex; align-items: center; gap: 10px; padding: 10px 16px; border-bottom: 1px solid var(--border); }
.sol-phish-avatar { width: 30px; height: 30px; border-radius: 50%; background: #0078d4; color: #fff; display: grid; place-items: center; font-size: 0.6rem; font-weight: 800; flex-shrink: 0; }
.sol-phish-sender { flex: 1; min-width: 0; }
.sol-phish-from { display: block; font-family: 'Manrope', sans-serif; font-size: 0.76rem; font-weight: 700; color: var(--text); }
.sol-phish-email { display: block; font-size: 0.62rem; color: var(--text-muted); transition: color .4s; }
.sol-phish-email.warn { color: #ef4444; text-decoration: underline wavy #ef4444; }
.sol-phish-time { font-size: 0.62rem; color: var(--text-faint); flex-shrink: 0; }
.sol-phish-body { padding: 12px 16px; flex: 1; font-size: 0.76rem; color: var(--text); line-height: 1.7; position: relative; }
.sol-phish-body p { margin-bottom: 6px; }
.sol-phish-link { display: inline-flex; align-items: center; gap: 5px; padding: 4px 8px; background: rgba(0,120,212,.06); border: 1px solid transparent; border-radius: 4px; font-family: 'JetBrains Mono', monospace; font-size: 0.65rem; color: #0078d4; transition: all .4s; word-break: break-all; }
.sol-phish-link.warn { border-color: rgba(239,68,68,.4); background: rgba(239,68,68,.06); color: #991b1b; text-decoration: line-through; }
.sol-phish-block { position: absolute; bottom: 0; left: 0; right: 0; background: rgba(239,68,68,.06); backdrop-filter: blur(6px); border-top: 2px solid rgba(239,68,68,.25); padding: 14px; opacity: 0; transform: translateY(8px); transition: all .4s var(--ease); border-radius: 0 0 var(--radius-lg) var(--radius-lg); }
.sol-phish-block.show { opacity: 1; transform: translateY(0); }
.sol-phish-block-inner { text-align: center; }
.sol-phish-block-inner svg { color: #dc2626; margin-bottom: 4px; }
.sol-phish-block-inner span { display: block; font-family: 'Manrope', sans-serif; font-size: 0.76rem; font-weight: 700; color: #991b1b; }
.sol-phish-block-detail { font-size: 0.62rem !important; font-weight: 500 !important; color: var(--text-muted) !important; margin-top: 2px; }
.mini-sol-step .sol-phish { position: relative; }

/* ── Industry bridge ────────────────────────────────────────────── */
.sol-bridge { padding: 20px 0 28px; }
.sol-bridge-content { text-align: center; margin-bottom: 36px; }
.sol-bridge-sub { font-size: 1rem; color: var(--text-muted); line-height: 1.7; max-width: 480px; margin: 12px auto 0; }
.sol-bridge-nav { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }
.sol-bridge-card {
  display: flex; align-items: center; gap: 8px; padding: 14px 24px;
  background: var(--gray-50); border: 1px solid var(--border); border-radius: 12px;
  font-family: 'Manrope', sans-serif; font-size: 0.84rem; font-weight: 600;
  color: var(--text); text-decoration: none; transition: all .25s var(--ease);
}
.sol-bridge-card svg { color: var(--text-faint); transition: all .25s var(--ease); }
.sol-bridge-card:hover { border-color: var(--navy); background: var(--sky-pale); color: var(--navy); transform: translateY(-2px); box-shadow: 0 4px 12px rgba(11,79,126,.08); }
.sol-bridge-card:hover svg { color: var(--navy); transform: translateY(2px); }
@media (max-width: 768px) {
  .sol-bridge-nav { flex-direction: column; align-items: center; }
  .sol-bridge-card { width: 100%; max-width: 280px; justify-content: center; }
}

/* ── Solutions page v2 ─────────────────────────────────────────── */

/* Industry nav bar */
.sol-nav-section { position: sticky; top: 60px; z-index: 90; background: rgba(255,255,255,.92); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom: 1px solid var(--border); }
.sol-nav { display: flex; justify-content: center; padding: 10px 0; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.sol-nav-inner { display: inline-flex; gap: 2px; background: var(--gray-50); border: 1px solid var(--border); border-radius: 10px; padding: 4px; }
.sol-nav-item { padding: 8px 20px; font-family: 'Manrope', sans-serif; font-size: 0.8rem; font-weight: 600; color: var(--text-muted); text-decoration: none; transition: all 0.25s var(--ease); white-space: nowrap; border-radius: 7px; cursor: pointer; }
.sol-nav-item:hover { color: var(--text); background: rgba(255,255,255,.6); }
.sol-nav-item.active { color: var(--navy); background: #fff; box-shadow: 0 1px 4px rgba(0,0,0,.08); }

/* Finance demo: WhatsApp chat */
.sol-wa { display: flex; flex-direction: column; min-height: 290px; background: #efeae2; }
.sol-wa-header { display: flex; align-items: center; gap: 10px; padding: 8px 14px; background: #f0f2f5; border-bottom: 1px solid #d1d7db; }
.sol-wa-avatar { width: 32px; height: 32px; border-radius: 50%; background: #00a884; color: #fff; display: grid; place-items: center; font-family: 'Manrope', sans-serif; font-size: 0.65rem; font-weight: 800; flex-shrink: 0; }
.sol-wa-contact { min-width: 0; }
.sol-wa-name { display: block; font-family: 'Manrope', sans-serif; font-size: 0.76rem; font-weight: 600; color: var(--text); }
.sol-wa-status { display: block; font-size: 0.6rem; color: #00a884; }
.sol-wa-body { flex: 1; padding: 10px 14px; display: flex; flex-direction: column; gap: 5px; overflow: hidden; }
.sol-wa-msg { display: flex; }
.sol-wa-in { justify-content: flex-start; }
.sol-wa-out { justify-content: flex-end; }
.sol-wa-bubble-in { max-width: 82%; padding: 7px 10px; background: #fff; border-radius: 0 8px 8px 8px; font-size: 0.72rem; color: var(--text); line-height: 1.55; box-shadow: 0 1px 1px rgba(0,0,0,.06); }
.sol-wa-bubble-in p { margin: 0; }
.sol-wa-bubble-out { max-width: 82%; padding: 7px 10px; background: #d9fdd3; border-radius: 8px 0 8px 8px; font-size: 0.72rem; color: var(--text); line-height: 1.55; box-shadow: 0 1px 1px rgba(0,0,0,.06); }
.sol-wa-time { display: block; text-align: right; font-size: 0.55rem; color: var(--text-faint); margin-top: 3px; }

/* WhatsApp file attachment */
.sol-wa-file { position: relative; padding: 6px 8px 4px !important; }
.sol-wa-file-row { display: flex; align-items: center; gap: 8px; }
.sol-wa-file-icon { width: 28px; height: 28px; border-radius: 6px; background: linear-gradient(135deg, #0B4F7E, #1a7fc2); display: grid; place-items: center; flex-shrink: 0; transition: opacity 0.3s; }
.sol-wa-file.blocked .sol-wa-file-icon { opacity: .35; }
.sol-wa-file-info { flex: 1; min-width: 0; }
.sol-wa-file-name { display: block; font-family: 'JetBrains Mono', monospace; font-size: 0.62rem; font-weight: 600; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: all 0.3s; }
.sol-wa-file-meta { display: block; font-size: 0.55rem; color: var(--text-muted); margin-top: 1px; transition: all 0.3s; }
.sol-wa-file.blocked .sol-wa-file-name,
.sol-wa-file.blocked .sol-wa-file-meta { opacity: .35; text-decoration: line-through; }
.sol-wa-file-progress { width: 100%; height: 3px; background: rgba(0,0,0,.06); border-radius: 100px; margin-top: 6px; overflow: hidden; }
.sol-wa-file-fill { height: 100%; width: 0; background: #00a884; border-radius: 100px; transition: width 0.1s linear; }
.sol-wa-file.blocked .sol-wa-file-fill { background: #ef4444; }
.sol-wa-file-block { position: absolute; right: 10px; top: 10px; color: #dc2626; transform: scale(0); transition: transform 0.3s var(--ease); }
.sol-wa-file-block.show { transform: scale(1); }
.sol-wa-file.blocked { background: rgba(239,68,68,.08) !important; border: 1px dashed rgba(239,68,68,.3); }

/* Manufacturing OT dashboard */
.sol-ot-dash { padding: 16px 18px; min-height: 280px; background: #fff; display: flex; flex-direction: column; gap: 12px; }
.sol-ot-header { display: flex; justify-content: space-between; align-items: center; }
.sol-ot-title { font-family: 'Space Grotesk', sans-serif; font-size: 0.78rem; font-weight: 700; color: var(--text); }
.sol-ot-status { display: flex; align-items: center; gap: 6px; font-size: 0.68rem; color: var(--text-muted); font-family: 'Space Grotesk', sans-serif; }
.sol-ot-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }
.sol-ot-dot-green { background: #22c55e; box-shadow: 0 0 6px rgba(34,197,94,.5); }
.sol-ot-dot-red { background: #ef4444; box-shadow: 0 0 6px rgba(239,68,68,.5); animation: sol-pulse-dot 1s ease infinite; }
@keyframes sol-pulse-dot { 0%,100% { opacity:1; } 50% { opacity:.4; } }

.sol-ot-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.sol-ot-node { background: var(--gray-50); border: 1px solid var(--border); border-radius: 10px; padding: 12px; display: flex; flex-direction: column; align-items: center; gap: 6px; transition: all 0.4s var(--ease); }
.sol-ot-node-icon { width: 32px; height: 32px; border-radius: 8px; background: rgba(11,79,126,.08); display: grid; place-items: center; color: var(--navy); }
.sol-ot-node-name { font-family: 'JetBrains Mono', monospace; font-size: 0.68rem; font-weight: 600; color: var(--text); }
.sol-ot-node-tag { font-family: 'Space Grotesk', sans-serif; font-size: 0.58rem; font-weight: 700; letter-spacing: .06em; padding: 2px 8px; border-radius: 100px; text-transform: uppercase; }
.sol-ot-tag-ok { background: rgba(34,197,94,.12); color: #15803d; }
.sol-ot-tag-alert { background: rgba(239,68,68,.12); color: #991b1b; }
.sol-ot-node-alert { border-color: transparent; }
.sol-ot-node-alert-active { border-color: rgba(239,68,68,.5); background: rgba(239,68,68,.04); animation: sol-node-flash 1.5s ease infinite; }
@keyframes sol-node-flash { 0%,100% { border-color:rgba(239,68,68,.5); } 50% { border-color:rgba(239,68,68,.2); } }

.sol-ot-event { display: flex; align-items: center; gap: 10px; padding: 10px 14px; background: rgba(239,68,68,.06); border: 1px solid rgba(239,68,68,.2); border-radius: 10px; opacity: 0; transform: translateY(8px); transition: all 0.4s var(--ease); }
.sol-ot-event.show { opacity: 1; transform: translateY(0); }
.sol-ot-event-icon { width: 28px; height: 28px; border-radius: 8px; background: rgba(239,68,68,.12); display: grid; place-items: center; color: #dc2626; flex-shrink: 0; }
.sol-ot-event-body { min-width: 0; }
.sol-ot-event-title { display: block; font-family: 'Space Grotesk', sans-serif; font-size: 0.72rem; font-weight: 700; color: #991b1b; }
.sol-ot-event-sub { display: block; font-size: 0.63rem; color: var(--text-muted); margin-top: 1px; }

/* Public Sector email compose demo */
.sol-email-compose { padding: 0; min-height: 270px; background: #fff; display: flex; flex-direction: column; }
.sol-email-fields { padding: 12px 18px; border-bottom: 1px solid var(--border); }
.sol-email-field { display: flex; align-items: center; gap: 8px; padding: 3px 0; font-size: 0.74rem; }
.sol-email-label { font-weight: 600; color: var(--text-muted); font-family: 'Space Grotesk', sans-serif; min-width: 52px; }
.sol-email-value { color: var(--text); }
.sol-email-body { padding: 14px 18px; flex: 1; font-size: 0.76rem; color: var(--text); line-height: 1.7; }
.sol-email-body p { margin-bottom: 8px; }
.sol-email-attachment { display: flex; align-items: center; gap: 10px; margin: 0 14px 14px; padding: 10px 14px; background: var(--gray-50); border: 1px solid var(--border); border-radius: 10px; position: relative; transition: all 0.3s var(--ease); }
.sol-email-attachment.blocked { border-color: rgba(239,68,68,.5); background: rgba(239,68,68,.04); }
.sol-email-attach-icon { width: 32px; height: 32px; border-radius: 8px; background: linear-gradient(135deg, var(--navy), #1a7fc2); display: grid; place-items: center; color: #fff; flex-shrink: 0; transition: opacity 0.3s; }
.sol-email-attachment.blocked .sol-email-attach-icon { opacity: 0.35; }
.sol-email-attach-info { flex: 1; min-width: 0; }
.sol-email-attach-name { display: block; font-family: 'JetBrains Mono', monospace; font-size: 0.68rem; font-weight: 600; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: all 0.3s; }
.sol-email-attach-meta { display: block; font-size: 0.6rem; color: var(--text-muted); margin-top: 2px; transition: all 0.3s; }
.sol-email-attachment.blocked .sol-email-attach-name,
.sol-email-attachment.blocked .sol-email-attach-meta { opacity: 0.35; text-decoration: line-through; }
.sol-email-attach-progress { width: 100%; position: absolute; bottom: 0; left: 0; height: 3px; border-radius: 0 0 10px 10px; overflow: hidden; }
.sol-email-attach-bar { width: 100%; height: 100%; }
.sol-email-attach-fill { height: 100%; width: 0; background: linear-gradient(90deg, #0B4F7E, #1a7fc2); transition: width 0.15s linear; border-radius: 0 0 10px 10px; }
.sol-email-attachment.blocked .sol-email-attach-fill { background: #ef4444; }
.sol-email-attach-block { position: absolute; right: 12px; top: 50%; transform: translateY(-50%) scale(0); color: #dc2626; transition: transform 0.3s var(--ease); }
.sol-email-attach-block.show { transform: translateY(-50%) scale(1); }

/* SME deployment wizard demo */
.sol-deploy { padding: 16px 18px; min-height: 280px; background: #fff; display: flex; flex-direction: column; gap: 10px; }
.sol-deploy-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; }
.sol-deploy-brand { display: flex; align-items: center; gap: 8px; }
.sol-deploy-logo { height: 22px; width: auto; }
.sol-deploy-title { font-family: 'Manrope', sans-serif; font-size: 0.82rem; font-weight: 700; color: var(--text); }
.sol-deploy-done-logo { height: 24px; width: auto; }
.sol-deploy-step { font-family: 'Space Grotesk', sans-serif; font-size: 0.68rem; font-weight: 600; color: var(--navy); background: var(--sky-light); padding: 3px 10px; border-radius: 100px; }
.sol-deploy-steps { display: flex; flex-direction: column; gap: 8px; flex: 1; }
.sol-deploy-item { display: flex; align-items: center; gap: 12px; padding: 12px 14px; background: var(--gray-50); border: 1px solid var(--border); border-radius: 10px; transition: all 0.4s var(--ease); }
.sol-deploy-item.active { border-color: var(--navy); background: var(--sky-pale); box-shadow: 0 0 0 3px rgba(11,79,126,.08); }
.sol-deploy-item.completed { border-color: rgba(11,79,126,.25); background: rgba(11,79,126,.04); }
.sol-deploy-check { width: 22px; height: 22px; border-radius: 50%; border: 2px solid var(--border); display: grid; place-items: center; flex-shrink: 0; transition: all 0.3s var(--ease); color: transparent; }
.sol-deploy-check.checked { border-color: #0B4F7E; background: #0B4F7E; color: #fff; }
.sol-deploy-info { flex: 1; min-width: 0; }
.sol-deploy-name { display: block; font-family: 'Space Grotesk', sans-serif; font-size: 0.76rem; font-weight: 600; color: var(--text); }
.sol-deploy-meta { display: block; font-size: 0.63rem; color: var(--text-muted); margin-top: 2px; }
.sol-deploy-time { font-family: 'JetBrains Mono', monospace; font-size: 0.65rem; color: var(--text-faint); flex-shrink: 0; }
.sol-deploy-bar { height: 4px; background: var(--gray-100); border-radius: 100px; overflow: hidden; }
.sol-deploy-fill { height: 100%; width: 0; background: linear-gradient(90deg, #0B4F7E, #1a7fc2); border-radius: 100px; transition: width 0.6s var(--ease); }
.sol-deploy-done { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 10px; background: rgba(11,79,126,.06); border: 1px solid rgba(11,79,126,.15); border-radius: 10px; font-family: 'Space Grotesk', sans-serif; font-size: 0.76rem; font-weight: 700; color: #0B4F7E; opacity: 0; transform: translateY(6px); transition: all 0.4s var(--ease); }
.sol-deploy-done.show { opacity: 1; transform: translateY(0); }
.sol-deploy-done svg { color: #0B4F7E; }

/* ── Use case stepper ────────────────────────────────────────── */
.sol-step-bar {
  display: flex; align-items: center; position: relative;
  margin-bottom: 40px; padding: 0 4px;
}
.sol-step-line {
  position: absolute; top: 50%; left: 0; right: 0; height: 3px;
  background: var(--gray-100); border-radius: 100px; transform: translateY(-50%);
}
.sol-step-line-fill {
  height: 100%; width: 0; background: var(--navy); border-radius: 100px;
  transition: width .6s var(--ease);
}
.sol-step-dot {
  position: relative; z-index: 2; flex: 1; display: flex; flex-direction: column; align-items: center; gap: 8px;
  background: none; border: none; cursor: pointer; padding: 8px 0;
}
.sol-step-dot-label {
  font-family: 'Manrope', sans-serif;
  font-size: 0.68rem;
  font-weight: 600;
  color: var(--text-faint);
  transition: color .3s var(--ease);
  white-space: nowrap;
}
.sol-step-dot.active .sol-step-dot-label { color: var(--navy); font-weight: 700; }
.sol-step-dot.done .sol-step-dot-label { color: var(--navy); }
.sol-step-dot-inner {
  width: 16px; height: 16px; border-radius: 50%;
  background: var(--gray-100); border: 3px solid #fff;
  box-shadow: 0 0 0 2px var(--gray-100);
  transition: all .3s var(--ease);
}
.sol-step-dot.active .sol-step-dot-inner {
  background: var(--navy); box-shadow: 0 0 0 2px var(--navy);
}
.sol-step-dot.done .sol-step-dot-inner {
  background: var(--navy); box-shadow: 0 0 0 2px var(--navy);
}

/* Panels */
.sol-step-panels { position: relative; }
.sol-step-panel {
  display: none; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start;
}
.sol-step-panel.active { display: grid; animation: sol-step-in .5s var(--ease); }
@keyframes sol-step-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.sol-step-info { padding-top: 8px; }
.sol-step-icon {
  width: 44px; height: 44px; border-radius: 11px;
  background: var(--sky-pale); display: grid; place-items: center;
  color: var(--navy); margin-bottom: 18px;
}
.sol-step-title {
  font-family: 'Manrope', sans-serif; font-size: 1.4rem; font-weight: 800;
  color: var(--text); margin-bottom: 12px; letter-spacing: -.02em;
}
.sol-step-desc {
  font-size: 0.88rem; color: var(--text-muted); line-height: 1.75; margin-bottom: 20px;
}
.sol-step-checks { display: flex; flex-direction: column; gap: 10px; }
.sol-step-check {
  display: flex; align-items: flex-start; gap: 10px;
  font-family: 'Manrope', sans-serif; font-size: 0.82rem; font-weight: 500;
  color: var(--text); line-height: 1.5;
}
.sol-step-check svg { color: var(--navy); flex-shrink: 0; margin-top: 2px; }

.sol-step-visual { position: relative; }

/* Chat for Gen AI step */
.sol-chat { padding: 16px 18px; min-height: 220px; display: flex; flex-direction: column; justify-content: center; background: #fff; position: relative; }
.sol-chat-msg { display: flex; justify-content: flex-end; }
.sol-chat-bubble { max-width: 85%; padding: 12px 16px; border-radius: 16px 16px 4px 16px; font-size: 0.76rem; line-height: 1.65; white-space: pre-wrap; word-break: break-word; }
.sol-bubble-user { background: #0B4F7E; color: #fff; }
.sol-chat-label { display: block; font-size: 0.63rem; opacity: 0.6; margin-bottom: 6px; text-transform: uppercase; letter-spacing: .06em; }
.sol-chat-typed { display: block; min-height: 60px; }
.sol-chat-block { position: absolute; inset: 0; background: rgba(239,68,68,.08); backdrop-filter: blur(4px); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; opacity: 0; pointer-events: none; transition: opacity 0.4s var(--ease); border-radius: 0 0 var(--radius-lg) var(--radius-lg); font-family: 'Manrope', sans-serif; font-size: 0.82rem; font-weight: 700; color: #991b1b; }
.sol-chat-block svg { color: #dc2626; }
.sol-chat-block.show { opacity: 1; pointer-events: auto; }

@media (max-width: 768px) {
  .sol-step-panel { grid-template-columns: 1fr; gap: 28px; }
  .sol-step-title { font-size: 1.15rem; }
}

/* Use case cards grid (legacy) */
.sol-usecase-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.sol-uc-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 28px 24px; transition: border-color 0.25s, box-shadow 0.25s, transform 0.25s var(--ease); }
.sol-uc-card:hover { border-color: var(--border-dark); box-shadow: var(--shadow-md); transform: translateY(-4px); }
.sol-uc-icon { width: 44px; height: 44px; border-radius: 11px; background: linear-gradient(135deg, var(--navy), #1a7fc2); display: grid; place-items: center; color: #fff; margin-bottom: 16px; }
.sol-uc-card h3 { font-family: 'Manrope', sans-serif; font-size: 1rem; font-weight: 700; color: var(--text); margin-bottom: 8px; }
.sol-uc-card p { font-size: 0.82rem; color: var(--text-muted); line-height: 1.7; margin-bottom: 14px; }
.sol-uc-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.sol-uc-tags span { background: var(--sky-light); color: var(--navy); padding: 3px 10px; border-radius: 100px; font-family: 'Space Grotesk', sans-serif; font-size: 0.62rem; font-weight: 700; letter-spacing: .05em; }

/* Stats row */
.sol-proof { background: var(--gray-50); }
.sol-stats-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.sol-stat { background: #fff; border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 28px 22px; text-align: center; transition: border-color 0.25s, box-shadow 0.25s, transform 0.25s var(--ease); }
.sol-stat:hover { border-color: var(--border-dark); box-shadow: var(--shadow-md); transform: translateY(-4px); }
.sol-stat-num { font-family: 'Manrope', sans-serif; font-size: 2.6rem; font-weight: 800; color: var(--navy); line-height: 1; }
.sol-stat-unit { font-family: 'Manrope', sans-serif; font-size: 1.3rem; font-weight: 700; color: var(--navy); }
.sol-stat-label { display: block; font-family: 'Space Grotesk', sans-serif; font-size: 0.78rem; font-weight: 700; color: var(--text); margin-top: 6px; }
.sol-stat-desc { display: block; font-size: 0.72rem; color: var(--text-muted); line-height: 1.6; margin-top: 6px; }

/* ── Solutions responsive ── */
@media (max-width: 768px) {
  .sol-nav { justify-content: flex-start; padding: 8px 0; }
  .sol-nav-inner { gap: 2px; padding: 3px; border-radius: 8px; }
  .sol-nav-item { padding: 7px 14px; font-size: 0.72rem; border-radius: 6px; }
  .sol-usecase-grid { grid-template-columns: 1fr; }
  .sol-stats-row { grid-template-columns: 1fr 1fr; }
  .sol-ot-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 480px) {
  .sol-stats-row { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════════════════════════════════
   CTA SECTION (shared)
══════════════════════════════════════════════════════════════════ */
.cta-section {
  background: #fff;
}
.cta-inner {
  text-align: center;
  padding: 48px 0 100px;
  max-width: 640px;
  margin: 0 auto;
}
.cta-eyebrow {
  font-family: 'Manrope', sans-serif;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #0b4f7e;
  margin-bottom: 20px;
}
.cta-title {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(2.6rem, 5vw, 4.2rem);
  font-weight: 900;
  letter-spacing: -0.05em;
  line-height: 1.08;
  color: var(--text);
  margin-bottom: 22px;
}
.cta-title em {
  font-style: italic;
  color: #0b4f7e;
}
.cta-sub {
  font-family: 'Inter', sans-serif;
  font-size: 1rem;
  color: var(--text-muted);
  line-height: 1.8;
  margin-bottom: 32px;
}
.cta-btns {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 28px;
}
.cta-btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #0b4f7e;
  color: #fff;
  font-family: 'Manrope', sans-serif;
  font-size: 0.92rem;
  font-weight: 800;
  padding: 15px 32px;
  border-radius: var(--radius-md);
  text-decoration: none;
  transition: background .2s, transform .25s var(--ease-spring), box-shadow .2s;
  box-shadow: 0 4px 16px rgba(11,79,126,.3);
}
.cta-btn-primary:hover {
  background: var(--navy-dark);
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(11,79,126,.4);
}
.cta-btn-secondary {
  display: inline-flex;
  align-items: center;
  background: transparent;
  color: var(--text-muted);
  font-family: 'Manrope', sans-serif;
  font-size: 0.92rem;
  font-weight: 700;
  padding: 14px 32px;
  border-radius: var(--radius-md);
  border: 1.5px solid var(--border-dark);
  text-decoration: none;
  transition: border-color .2s, color .2s, transform .25s var(--ease-spring);
}
.cta-btn-secondary:hover {
  border-color: #0b4f7e;
  color: #0b4f7e;
  transform: translateY(-2px);
}
.cta-pills {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
}
.cta-pill {
  font-family: 'Inter', sans-serif;
  font-size: 0.78rem;
  color: var(--text-faint);
}
.cta-pill-dot {
  width: 3px; height: 3px;
  border-radius: 50%;
  background: var(--border-dark);
  display: inline-block;
}

/* ══════════════════════════════════════════════════════════════════
   FOOTER
══════════════════════════════════════════════════════════════════ */
footer { background:var(--navy-deeper); padding:64px clamp(1.25rem,4vw,2.5rem) 28px; color:rgba(255,255,255,.58); }
.footer-grid { max-width:1120px; margin-inline:auto; display:grid; grid-template-columns:2.2fr 1fr 1.4fr 0.7fr 0.8fr; gap:40px; margin-bottom:48px; }
.footer-logo-link { display:inline-block; text-decoration:none; margin-bottom:16px; }
.footer-logo-img { height:80px; width:auto; display:block; object-fit:contain; filter: brightness(0) invert(1); }
.footer-brand-desc { font-size:0.86rem; margin-top:13px; line-height:1.75; max-width:280px; }
.footer-socials { display:flex; gap:8px; margin-top:18px; }
.social-icon { width:34px;height:34px; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.1); border-radius:7px; display:grid; place-items:center; font-size:12px; color:rgba(255,255,255,.55); transition:background 0.18s,border-color 0.18s,color 0.18s; text-decoration:none; }
.social-icon:hover { background:rgba(185,228,255,.15); border-color:rgba(185,228,255,.3); color:var(--sky); }
.footer-col h4 { font-family:'Space Grotesk',sans-serif; font-size:0.78rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#fff; margin-bottom:14px; }
.footer-col ul { display:flex; flex-direction:column; gap:8px; }
.footer-col-sub { font-family:'Space Grotesk',sans-serif; font-size:0.65rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:rgba(255,255,255,.3); margin-bottom:8px; }
.footer-col a { font-size:0.83rem; color:rgba(255,255,255,.48); transition:color 0.18s; }
.footer-col a:hover { color:var(--sky); }
.footer-bottom { max-width:1120px; margin-inline:auto; padding-top:22px; border-top:1px solid rgba(255,255,255,.07); display:flex; align-items:center; justify-content:space-between; font-size:0.76rem; color:rgba(255,255,255,.28); flex-wrap:wrap; gap:10px; }
.footer-links { display:flex; gap:18px; }
.footer-links a { color:rgba(255,255,255,.28); transition:color 0.18s; }
.footer-links a:hover { color:var(--sky); }

/* ══════════════════════════════════════════════════════════════════
   GSAP INITIAL STATES
══════════════════════════════════════════════════════════════════ */
.gs-up    { opacity:0; transform:translateY(40px); }
.gs-left  { opacity:0; transform:translateX(-44px); }
.gs-right { opacity:0; transform:translateX(44px); }
.gs-scale { opacity:0; transform:scale(0.88); }
.gs-fade  { opacity:0; }

/* ══════════════════════════════════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════════════════════════════════ */
@media (max-width:960px) {
  .nav-pill {
    display: flex !important;
    grid-template-columns: none !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 8px;
    padding: 0 10px 0 16px !important;
  }
  .nav-logo { margin-right: auto; }
  .nav-center { display:none !important; }
  .nav-divider { display:none !important; }
  .lang-switcher { display: none !important; }
  .btn-demo { display:none !important; }
  .nav-right { display: none !important; }
  .hamburger {
    display:flex !important;
    margin-left: auto !important;
    order: 99;
  }
  .hero-inner { grid-template-columns:1fr; text-align:center; }
  .hero-desc { margin-inline:auto; }
  .hero-actions { justify-content:center; }
  .hero-stats { justify-content:center; }
  .hero-visual { max-width:540px; margin-inline:auto; }
  .product-grid { grid-template-columns:1fr; gap:44px; }
  .product-text .eyebrow, .product-text .section-title, .product-text .section-sub { text-align:center; }
  .product-text .eyebrow { justify-content:center; }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .df-sidebar { display:none; }
  .df-body { grid-template-columns:1fr; }
  .float-badge, .live-badge, .float-alert { display:none; }
}
@media (max-width:768px) {
  .caps-header { grid-template-columns:1fr; gap:24px; }
  .caps-grid { grid-template-columns:1fr 1fr; }
  .features-grid, .modules-grid { grid-template-columns:1fr; }
  .why-row-top { grid-template-columns:1fr; gap:12px; }
  .why-card-wide { flex-direction:column; align-items:flex-start; gap:16px; padding:32px 28px; }
  .cta-inner { grid-template-columns:1fr; gap:40px; }
  .cta-right { width:100%; }
  .steps-grid { grid-template-columns:1fr; gap:36px; }
  .steps-line { display:none; }
  .solutions-grid, .blog-grid { grid-template-columns:1fr; }
  .pricing-grid { grid-template-columns:1fr; }
  .price-card.featured { transform:scale(1); }
  .footer-grid { grid-template-columns:1fr; }
  .industry-grid { grid-template-columns:1fr; }
  .usecase-strip { grid-template-columns:1fr 1fr; }
  .doc-grid { grid-template-columns:1fr 1fr; }
  .contact-grid { grid-template-columns:1fr; }
  .form-row { grid-template-columns:1fr; }
  .df-metrics { grid-template-columns:1fr 1fr; }
  .comp-table { display:none; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation-duration:.01ms !important; transition-duration:.01ms !important; }
}

/* ══════════════════════════════════════════════════════════════════
   CONTACT CARD — Zynap-style
══════════════════════════════════════════════════════════════════ */
.hc-card {
  background: linear-gradient(135deg, #0B4F7E 0%, #B9E4FF 40%, #B9E4FF 60%, #0B4F7E 100%);
  border-radius: 28px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  overflow: hidden;
  box-shadow: 0 25px 80px rgba(11,79,126,.18);
  position: relative;
}
.hc-info {
  padding: 60px 50px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.hc-eyebrow {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #0B4F7E;
  margin-bottom: 20px;
}
.hc-title {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(2rem, 4vw, 3.2rem);
  font-weight: 900;
  color: #052C47;
  line-height: 1.1;
  letter-spacing: -0.03em;
  margin-bottom: 20px;
}
.hc-title em {
  font-style: normal;
  color: #0B4F7E;
}
.hc-desc {
  font-size: 1rem;
  color: rgba(5,44,71,.7);
  line-height: 1.7;
  margin-bottom: 32px;
  max-width: 400px;
}
.hc-trust { display: flex; flex-direction: column; gap: 14px; }
.hc-trust-item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.88rem;
  font-weight: 600;
  color: #052C47;
}
.hc-trust-item svg { color: #0B4F7E; flex-shrink: 0; }

.hc-form-wrap {
  padding: 50px;
}
.hc-form { display: flex; flex-direction: column; gap: 14px; }
.hc-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.hc-field { display: flex; flex-direction: column; gap: 6px; }
.hc-field-full { grid-column: 1 / -1; }
.hc-field label {
  font-family: 'Manrope', sans-serif;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: rgba(5,44,71,.7);
}
.hc-optional {
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  color: rgba(5,44,71,.45);
  margin-left: 3px;
}
.hc-field input, .hc-field textarea {
  background: rgba(255,255,255,.6);
  border: 1.5px solid rgba(5,44,71,.12);
  border-radius: 10px;
  padding: 12px 14px;
  font-family: 'Manrope', sans-serif;
  font-size: 0.88rem;
  color: #052C47;
  outline: none;
  transition: border-color .2s, background .2s, box-shadow .2s;
  resize: none;
}
.hc-field input::placeholder, .hc-field textarea::placeholder {
  color: rgba(5,44,71,.35);
}
.hc-field input:focus, .hc-field textarea:focus {
  background: #fff;
  border-color: #0B4F7E;
  box-shadow: 0 0 0 4px rgba(11,79,126,.08);
}
.hc-field textarea { min-height: 60px; line-height: 1.55; }
.hc-checks { display: flex; flex-direction: column; gap: 12px; }
.hc-check {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 0.75rem;
  color: rgba(5,44,71,.55);
  line-height: 1.5;
  cursor: pointer;
}
.hc-check input[type="checkbox"] {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  margin-top: 2px;
  accent-color: #0B4F7E;
}
.hc-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 32px;
  background: linear-gradient(135deg, #0B4F7E, #1a7fc2);
  color: #fff;
  font-family: 'Manrope', sans-serif;
  font-size: 0.92rem;
  font-weight: 700;
  border: none;
  border-radius: 12px;
  cursor: pointer;
  transition: transform .2s, box-shadow .2s, filter .2s;
  align-self: flex-start;
  margin-top: 6px;
  box-shadow: 0 4px 16px rgba(11,79,126,.2);
}
.hc-submit svg { transition: transform .2s; }
.hc-submit:hover svg { transform: translateX(3px); }
.hc-submit:hover {
  background: #0B4F7E;
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(11,79,126,.3);
}

/* Contact card extras */
.hc-disclaimer { font-size: 0.72rem; color: var(--text-faint); line-height: 1.6; max-width: 800px; margin: 20px auto 0; text-align: center; }
.hc-contact-methods { display: flex; flex-direction: column; gap: 14px; margin-top: 28px; padding-top: 24px; border-top: 1px solid rgba(5,44,71,.12); }
.hc-method { display: flex; align-items: center; gap: 12px; }
.hc-method-icon { font-size: 18px; width: 36px; height: 36px; background: rgba(11,79,126,.1); border-radius: 10px; display: grid; place-items: center; flex-shrink: 0; }
.hc-method-label { font-family: 'Space Grotesk',sans-serif; font-size: 0.65rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: rgba(5,44,71,.45); display: block; }
.hc-method-value { font-size: 0.88rem; color: #052C47; font-weight: 600; }

@media (max-width: 768px) {
  .hc-card { grid-template-columns: 1fr; }
  .hc-info { padding: 40px 30px 20px; }
  .hc-form-wrap { padding: 30px; }
  .hc-form-row { grid-template-columns: 1fr; }
}

/* Contact page — full screen card */
.contact-page {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  padding: calc(var(--header-h) + 64px) 24px 48px;
}
.contact-page-inner {
  width: 100%;
  max-width: 1200px;
}
.hc-card-full {
  border-radius: 24px;
}
.contact-intro {
  text-align: center;
  margin-bottom: 48px;
}
.contact-intro-badge {
  display: inline-block;
  font-family: 'Space Grotesk', sans-serif;
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--text-muted);
  border: 1.5px solid rgba(11,79,126,.12);
  border-radius: 50px;
  padding: 7px 20px;
  margin-bottom: 24px;
  cursor: default;
  transition: color .3s, border-color .3s, background .3s, transform .3s, box-shadow .3s;
}
.contact-intro-badge:hover {
  color: #0B4F7E;
  border-color: #0B4F7E;
  background: rgba(185,228,255,.1);
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(11,79,126,.1);
}
.contact-intro-title {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(1.8rem, 4vw, 2.8rem);
  font-weight: 900;
  color: var(--text);
  line-height: 1.15;
  letter-spacing: -0.03em;
}
.contact-intro-title em {
  font-style: normal;
  color: #0B4F7E;
}
.contact-bg {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(11,79,126,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(11,79,126,.045) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: radial-gradient(ellipse 70% 60% at 50% 25%, black 25%, transparent 100%);
  -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 25%, black 25%, transparent 100%);
  pointer-events: none;
  z-index: 0;
}
.contact-orb {
  position: absolute; border-radius: 50%; filter: blur(80px); pointer-events: none; z-index: 0;
}
.contact-orb-1 { width: 480px; height: 480px; background: radial-gradient(circle, rgba(185,228,255,.5) 0%, transparent 65%); top: -100px; right: -100px; }
.contact-orb-2 { width: 320px; height: 320px; background: radial-gradient(circle, rgba(11,79,126,.15) 0%, transparent 65%); bottom: 20%; left: -60px; }
.contact-page { position: relative; overflow: hidden; }
.contact-page-inner { position: relative; z-index: 1; }
.contact-intro-badge-pulse {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-family: 'Manrope', sans-serif !important;
  font-weight: 700 !important;
  font-size: .78rem !important;
  color: var(--navy) !important;
  background: var(--sky-pale);
  border-color: rgba(11,79,126,.18) !important;
}
.contact-badge-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 0 4px rgba(34,197,94,.15);
  animation: contact-pulse 2s ease infinite;
  flex-shrink: 0;
}
@keyframes contact-pulse {
  0%, 100% { box-shadow: 0 0 0 4px rgba(34,197,94,.15); }
  50% { box-shadow: 0 0 0 7px rgba(34,197,94,.05); }
}
.contact-intro-sub {
  font-size: 1rem;
  color: var(--text-muted);
  line-height: 1.7;
  max-width: 520px;
  margin: 18px auto 0;
}
.contact-intro-line {
  width: 60px;
  height: 3px;
  background: linear-gradient(90deg, #0B4F7E, #B9E4FF);
  border-radius: 2px;
  margin: 28px auto 0;
}

/* Contact page animations */
.cp-fade {
  opacity: 0;
  transform: translateY(28px);
  animation: cp-fade-in .7s cubic-bezier(.4,0,.2,1) forwards;
}
.cp-fade-1 { animation-delay: .1s; }
.cp-fade-2 { animation-delay: .3s; }
.cp-fade-3 { animation-delay: .55s; }
@keyframes cp-fade-in {
  to { opacity: 1; transform: translateY(0); }
}

/* Disclaimer (no shield) */
.contact-page .hc-disclaimer {
  margin: 20px auto 0;
  text-align: center;
  max-width: 800px;
  color: var(--text-faint);
  font-size: .72rem;
  line-height: 1.6;
}

@media (max-width: 768px) {
  .contact-page { padding: calc(var(--header-h) + 40px) 16px 32px; }
}

/* ══════════════════════════════════════════════════════════════════
   PRODUCT — How Pribait Works
══════════════════════════════════════════════════════════════════ */
.hp-section {
  position: relative;
  background: #fff;
  overflow: hidden;
}
.hp-bg-grid {
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(11,79,126,.06) 1px, transparent 1px);
  background-size: 24px 24px;
  mask-image: radial-gradient(ellipse 70% 70% at 50% 50%, black 30%, transparent 80%);
  -webkit-mask-image: radial-gradient(ellipse 70% 70% at 50% 50%, black 30%, transparent 80%);
  pointer-events: none;
}
.hp-flow {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 0;
  margin-top: 56px;
}
.hp-step {
  flex: 1;
  max-width: 280px;
  text-align: center;
  position: relative;
}
.hp-step-num {
  font-family: 'Manrope', sans-serif;
  font-size: .68rem;
  font-weight: 800;
  color: #B9E4FF;
  background: #0B4F7E;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
}
.hp-step-icon {
  width: 72px;
  height: 72px;
  margin: 0 auto 20px;
  background: #E0F4FF;
  border: 2px solid rgba(11,79,126,.1);
  border-radius: 20px;
  display: grid;
  place-items: center;
  transition: transform .3s, box-shadow .3s, border-color .3s;
}
.hp-step-icon svg { width: 32px; height: 32px; color: #0B4F7E; }
.hp-step-icon-active {
  background: #0B4F7E;
  border-color: rgba(185,228,255,.3);
  box-shadow: 0 0 30px rgba(11,79,126,.15), 0 0 8px rgba(185,228,255,.2);
}
.hp-step-icon-active svg { color: #B9E4FF; }
.hp-step:hover .hp-step-icon {
  transform: translateY(-4px) scale(1.05);
  box-shadow: 0 8px 24px rgba(11,79,126,.12);
  border-color: #0B4F7E;
}
.hp-step-title {
  font-family: 'Manrope', sans-serif;
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--text);
  margin-bottom: 8px;
}
.hp-step-desc {
  font-size: .88rem;
  color: var(--text-muted);
  line-height: 1.65;
}
.hp-connector {
  display: flex;
  align-items: center;
  width: 80px;
  position: relative;
  margin-top: 72px;
  flex-shrink: 0;
}
.hp-conn-line {
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, rgba(11,79,126,.1), #0B4F7E, rgba(11,79,126,.1));
}
.hp-conn-pulse {
  position: absolute;
  width: 8px;
  height: 8px;
  background: #B9E4FF;
  border-radius: 50%;
  top: 50%;
  transform: translateY(-50%);
  box-shadow: 0 0 10px rgba(185,228,255,.6);
  animation: hp-pulse-move 2.5s ease-in-out infinite;
}
@keyframes hp-pulse-move {
  0%, 100% { left: 0; opacity: .3; }
  50% { left: calc(100% - 8px); opacity: 1; }
}

@media (max-width: 768px) {
  .hp-flow { flex-direction: column; align-items: center; gap: 12px; }
  .hp-connector { width: auto; height: 48px; flex-direction: column; margin-top: 0; }
  .hp-conn-line { width: 2px; height: 100%; background: linear-gradient(180deg, rgba(11,79,126,.1), #0B4F7E, rgba(11,79,126,.1)); }
  @keyframes hp-pulse-move {
    0%, 100% { top: 0; opacity: .3; }
    50% { top: calc(100% - 8px); opacity: 1; }
  }
}

/* ══════════════════════════════════════════════════════════════════
   PRODUCT — Premium CTA
══════════════════════════════════════════════════════════════════ */
.product-cta {
  position: relative;
  padding: 120px 0;
  background: linear-gradient(135deg, #031D30 0%, #0B4F7E 50%, #031D30 100%);
  overflow: hidden;
}
.pcta-bg {
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(ellipse 50% 50% at 50% 50%, rgba(185,228,255,.06) 0%, transparent 70%),
    radial-gradient(circle at 20% 80%, rgba(185,228,255,.04) 0%, transparent 50%),
    radial-gradient(circle at 80% 20%, rgba(185,228,255,.04) 0%, transparent 50%);
  pointer-events: none;
}
.pcta-inner {
  text-align: center;
  max-width: 700px;
  margin: 0 auto;
}
.pcta-badge {
  display: inline-block;
  font-family: 'Manrope', sans-serif;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #B9E4FF;
  background: rgba(185,228,255,.08);
  border: 1px solid rgba(185,228,255,.15);
  border-radius: 50px;
  padding: 8px 20px;
  margin-bottom: 28px;
}
.pcta-title {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 900;
  color: #fff;
  line-height: 1.15;
  letter-spacing: -0.03em;
  margin-bottom: 20px;
}
.pcta-title em {
  font-style: normal;
  background: linear-gradient(90deg, #B9E4FF, #74C3F0);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.pcta-sub {
  font-size: 1.05rem;
  color: rgba(255,255,255,.6);
  line-height: 1.75;
  margin-bottom: 36px;
}
.pcta-btns {
  display: flex;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 32px;
}
.pcta-btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 15px 32px;
  background: #fff;
  color: #0B4F7E;
  font-family: 'Manrope', sans-serif;
  font-size: .95rem;
  font-weight: 800;
  border-radius: 50px;
  text-decoration: none;
  transition: background .2s, transform .2s, box-shadow .2s;
}
.pcta-btn-primary:hover {
  background: #B9E4FF;
  transform: translateY(-2px);
  box-shadow: 0 8px 30px rgba(185,228,255,.25);
}
.pcta-btn-outline {
  display: inline-flex;
  align-items: center;
  padding: 15px 32px;
  background: transparent;
  color: #B9E4FF;
  font-family: 'Manrope', sans-serif;
  font-size: .95rem;
  font-weight: 700;
  border: 1.5px solid rgba(185,228,255,.3);
  border-radius: 50px;
  text-decoration: none;
  transition: border-color .2s, background .2s, transform .2s;
}
.pcta-btn-outline:hover {
  border-color: #B9E4FF;
  background: rgba(185,228,255,.08);
  transform: translateY(-2px);
}
.pcta-trust {
  display: flex;
  justify-content: center;
  gap: 28px;
  flex-wrap: wrap;
}
.pcta-trust span {
  font-family: 'Space Grotesk', sans-serif;
  font-size: .78rem;
  font-weight: 600;
  color: rgba(185,228,255,.5);
  letter-spacing: .02em;
}

/* ══════════════════════════════════════════════════════════════════
   PRODUCT — Platform Overview (Concentric Arcs)
══════════════════════════════════════════════════════════════════ */
.po-section { background: #fff; overflow: hidden; }
.po-visual { max-width: 860px; margin: 48px auto 0; }
.po-arcs {
  position: relative;
  width: 100%;
  aspect-ratio: 1.55 / 1;
  overflow: hidden;
}

/* Arc base */
.po-arc {
  position: absolute;
  left: 50%;
  bottom: 0;
  border-radius: 50%;
  transform: translateX(-50%) translateY(50%);
  border: 2px solid rgba(11,79,126,.12);
  border-bottom-color: transparent;
  transition: border-color .4s;
}
.po-arc:hover { border-color: rgba(11,79,126,.3); }

/* Sizes & fills */
.po-arc-5 { width: 820px; height: 820px; background: radial-gradient(ellipse at 50% 100%, rgba(11,79,126,.02) 0%, transparent 50%); }
.po-arc-4 { width: 660px; height: 660px; background: radial-gradient(ellipse at 50% 100%, rgba(185,228,255,.06) 0%, transparent 50%); }
.po-arc-3 { width: 500px; height: 500px; background: radial-gradient(ellipse at 50% 100%, rgba(11,79,126,.06) 0%, transparent 50%); }
.po-arc-2 { width: 340px; height: 340px; background: radial-gradient(ellipse at 50% 100%, rgba(185,228,255,.1) 0%, transparent 50%); }

/* Arc titles */
.po-arc-title {
  position: absolute;
  top: -1px;
  left: 50%;
  transform: translate(-50%, -50%);
  font-family: 'Manrope', sans-serif;
  font-size: .65rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #0B4F7E;
  background: #fff;
  padding: 3px 14px;
  border-radius: 4px;
  white-space: nowrap;
  border: 1px solid rgba(11,79,126,.08);
}

/* Arc labels */
.po-arc-lbl {
  position: absolute;
  font-family: 'Space Grotesk', sans-serif;
  font-size: .65rem;
  font-weight: 600;
  color: var(--text-muted);
  line-height: 1.3;
  text-align: center;
}
.po-lbl-l { left: 8%; }
.po-lbl-r { right: 8%; }

/* Arc icons */
.po-arc-ico {
  position: absolute;
  width: 32px;
  height: 32px;
  background: #fff;
  border: 1.5px solid rgba(11,79,126,.1);
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 14px;
  box-shadow: 0 2px 8px rgba(11,79,126,.08);
  transform: translateX(-50%);
}

/* Core */
.po-core {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%) translateY(50%);
  z-index: 10;
}
.po-core-inner {
  width: 140px;
  height: 140px;
  background: linear-gradient(135deg, #0B4F7E, #0a6aad);
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 3px solid rgba(185,228,255,.25);
  box-shadow: 0 0 40px rgba(11,79,126,.2), 0 0 80px rgba(185,228,255,.08);
  animation: po-core-glow 3s ease-in-out infinite;
}
.po-core-inner svg { color: #B9E4FF; }
.po-core-txt {
  font-family: 'Manrope', sans-serif;
  font-size: .62rem;
  font-weight: 800;
  color: #fff;
  text-align: center;
  letter-spacing: .08em;
  line-height: 1.2;
}
@keyframes po-core-glow {
  0%, 100% { box-shadow: 0 0 30px rgba(11,79,126,.2), 0 0 60px rgba(185,228,255,.06); }
  50%      { box-shadow: 0 0 45px rgba(11,79,126,.3), 0 0 90px rgba(185,228,255,.12); }
}

/* Bottom bar & pills */
.po-bar {
  background: #fff;
  border: 2px solid rgba(11,79,126,.1);
  padding: 14px 0;
  text-align: center;
  margin-top: 12px;
}
.po-bar-title {
  font-family: 'Manrope', sans-serif;
  font-size: .8rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #0B4F7E;
}
.po-pills {
  display: flex;
  gap: 0;
  margin-top: 6px;
}
.po-pill {
  flex: 1;
  padding: 11px 12px;
  background: #B9E4FF;
  font-family: 'Manrope', sans-serif;
  font-size: .7rem;
  font-weight: 700;
  color: #0B4F7E;
  text-align: center;
  letter-spacing: .04em;
  text-transform: uppercase;
  border-right: 2px solid rgba(11,79,126,.08);
}
.po-pill:last-child { border-right: none; }

/* Responsive */
@media (max-width: 900px) {
  .po-arc-5 { width: 600px; height: 600px; }
  .po-arc-4 { width: 480px; height: 480px; }
  .po-arc-3 { width: 360px; height: 360px; }
  .po-arc-2 { width: 240px; height: 240px; }
  .po-core-inner { width: 110px; height: 110px; }
  .po-core-txt { font-size: .52rem; }
  .po-arc-title { font-size: .55rem; padding: 2px 8px; }
  .po-arc-lbl { font-size: .55rem; }
  .po-arc-ico { width: 26px; height: 26px; font-size: 11px; }
}
@media (max-width: 600px) {
  .po-arcs { aspect-ratio: 1.2 / 1; }
  .po-arc-5 { width: 440px; height: 440px; }
  .po-arc-4 { width: 350px; height: 350px; }
  .po-arc-3 { width: 260px; height: 260px; }
  .po-arc-2 { width: 170px; height: 170px; }
  .po-core-inner { width: 80px; height: 80px; }
  .po-core-txt { font-size: .45rem; }
  .po-core-inner svg { width: 18px; height: 18px; }
  .po-arc-title { font-size: .48rem; }
  .po-arc-lbl { display: none; }
  .po-arc-ico { display: none; }
  .po-pills { flex-wrap: wrap; }
  .po-pill { flex: none; width: 50%; border-bottom: 2px solid rgba(11,79,126,.08); }
}

/* ══════════════════════════════════════════════════════════════════
   FAQs PAGE
══════════════════════════════════════════════════════════════════ */
.faq-page {
  background: #fff;
  padding: calc(var(--header-h) + 72px) 0 80px;
  min-height: 100vh;
}
.faq-intro {
  text-align: center;
  margin-bottom: 56px;
}
.faq-intro-sub {
  font-size: .92rem;
  color: var(--text-muted);
  margin-top: 20px;
  line-height: 1.7;
}
.faq-intro-sub a {
  color: #0B4F7E;
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid rgba(11,79,126,.2);
  transition: border-color .2s;
}
.faq-intro-sub a:hover { border-color: #0B4F7E; }

/* FAQ items override for standalone page */
.faq-page .faq-list { max-width: 760px; margin: 0 auto; }
.faq-page .faq-item {
  border: 1px solid rgba(11,79,126,.08);
  border-radius: 14px;
  margin-bottom: 10px;
  transition: border-color .25s, box-shadow .25s;
}
.faq-page .faq-item:hover { border-color: rgba(11,79,126,.18); box-shadow: 0 4px 16px rgba(11,79,126,.05); }
.faq-page .faq-item.open { border-color: #0B4F7E; box-shadow: 0 4px 20px rgba(11,79,126,.08); }
.faq-page .faq-q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 20px 24px;
  background: none;
  border: none;
  cursor: pointer;
  font-family: 'Manrope', sans-serif;
  font-weight: 700;
  font-size: .95rem;
  color: var(--text);
  text-align: left;
}
.faq-chev {
  width: 18px;
  height: 18px;
  color: #0B4F7E;
  flex-shrink: 0;
  transition: transform .3s cubic-bezier(.4,0,.2,1);
}
.faq-page .faq-item.open .faq-chev { transform: rotate(180deg); }
.faq-page .faq-a {
  max-height: 0;
  overflow: hidden;
  padding: 0 24px;
  font-size: .9rem;
  color: var(--text-muted);
  line-height: 1.75;
  transition: max-height .4s cubic-bezier(.4,0,.2,1), padding .4s;
}
.faq-page .faq-item.open .faq-a { max-height: 300px; padding: 0 24px 22px; }

/* CTA inline */
.faq-cta {
  text-align: center;
  margin-top: 56px;
  padding: 40px;
  background: var(--gray-50);
  border-radius: 20px;
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
}
.faq-cta-text {
  font-family: 'Manrope', sans-serif;
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--text);
  margin-bottom: 20px;
}
.faq-cta-btn {
  display: inline-flex;
  align-items: center;
  padding: 13px 32px;
  background: #0B4F7E;
  color: #fff;
  font-family: 'Manrope', sans-serif;
  font-size: .9rem;
  font-weight: 700;
  border-radius: 50px;
  text-decoration: none;
  transition: background .2s, transform .2s, box-shadow .2s;
}
.faq-cta-btn:hover {
  background: #083D62;
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(11,79,126,.2);
}

/* ══════════════════════════════════════════════════════════════════
   LEGAL PAGES (Privacy, Terms, Cookies)
══════════════════════════════════════════════════════════════════ */
.legal-page {
  background: #fff;
  padding: calc(var(--header-h) + 72px) 0 80px;
  min-height: 100vh;
}
.legal-header {
  text-align: center;
  margin-bottom: 48px;
}
.legal-updated {
  font-family: 'Space Grotesk', sans-serif;
  font-size: .78rem;
  color: var(--text-faint);
  margin-top: 16px;
}
.legal-content {
  max-width: 760px;
  margin: 0 auto;
}
.legal-content h2 {
  font-family: 'Manrope', sans-serif;
  font-size: 1.2rem;
  font-weight: 800;
  color: var(--text);
  margin-top: 40px;
  margin-bottom: 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(11,79,126,.08);
}
.legal-content h3 {
  font-family: 'Manrope', sans-serif;
  font-size: 1rem;
  font-weight: 700;
  color: var(--text);
  margin-top: 24px;
  margin-bottom: 8px;
}
.legal-content p {
  font-size: .92rem;
  color: var(--text-muted);
  line-height: 1.8;
  margin-bottom: 14px;
}
.legal-content ul {
  margin: 0 0 16px 0;
  padding-left: 20px;
}
.legal-content li {
  font-size: .9rem;
  color: var(--text-muted);
  line-height: 1.75;
  margin-bottom: 6px;
}
.legal-content a {
  color: #0B4F7E;
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid rgba(11,79,126,.2);
  transition: border-color .2s;
}
.legal-content a:hover { border-color: #0B4F7E; }
.legal-table-wrap {
  overflow-x: auto;
  margin: 16px 0 24px;
}
.legal-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .85rem;
}
.legal-table th {
  font-family: 'Space Grotesk', sans-serif;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #0B4F7E;
  text-align: left;
  padding: 10px 14px;
  border-bottom: 2px solid rgba(11,79,126,.12);
  background: var(--gray-50);
}
.legal-table td {
  padding: 10px 14px;
  color: var(--text-muted);
  border-bottom: 1px solid rgba(11,79,126,.06);
}
.legal-table tr:hover td { background: rgba(185,228,255,.04); }

/* ══════════════════════════════════════════════════════════════════
   BLOG PAGE v2 — editorial style
══════════════════════════════════════════════════════════════════ */
.blog2-page {
  background: #fff;
  padding: calc(var(--header-h) + 72px) 0 100px;
  min-height: 100vh;
}

/* Hero 2-col */
.blog2-hero {
  display: grid;
  grid-template-columns: 1.6fr 1fr;
  gap: 60px;
  align-items: end;
  padding-bottom: 48px;
  margin-bottom: 48px;
  border-bottom: 1px solid rgba(11,79,126,.1);
}
.blog2-hero-left { }
.blog2-title {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(2.4rem, 5vw, 4.2rem);
  font-weight: 900;
  color: var(--text);
  line-height: 1.05;
  letter-spacing: -0.035em;
  margin-top: 20px;
  margin-bottom: 20px;
  max-width: 720px;
}
.blog2-title em { font-style: normal; color: #0B4F7E; }
.blog2-sub {
  font-size: 1rem;
  color: var(--text-muted);
  max-width: 520px;
  line-height: 1.75;
}

/* Hero right: latest article teaser */
.blog2-hero-right { display: flex; align-items: stretch; }
.blog2-latest {
  position: relative;
  width: 100%;
  background: linear-gradient(155deg, #0B4F7E 0%, #083D62 60%, #052C47 100%);
  border-radius: 22px;
  padding: 28px 28px 26px;
  overflow: hidden;
  box-shadow: 0 20px 50px rgba(11,79,126,.18);
}
.b2-latest-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
  position: relative;
  z-index: 2;
}
.b2-latest-label {
  font-family: 'Space Grotesk', sans-serif;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(185,228,255,.7);
}
.b2-latest-pulse {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #B9E4FF;
  box-shadow: 0 0 0 0 rgba(185,228,255,.6);
  animation: b2-pulse 2s ease-in-out infinite;
}
@keyframes b2-pulse {
  0% { box-shadow: 0 0 0 0 rgba(185,228,255,.5); }
  70% { box-shadow: 0 0 0 10px rgba(185,228,255,0); }
  100% { box-shadow: 0 0 0 0 rgba(185,228,255,0); }
}
.b2-latest-card {
  display: block;
  text-decoration: none;
  position: relative;
  z-index: 2;
}
.b2-latest-tag {
  display: inline-block;
  font-family: 'Space Grotesk', sans-serif;
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #B9E4FF;
  background: rgba(185,228,255,.12);
  border: 1px solid rgba(185,228,255,.22);
  padding: 4px 11px;
  border-radius: 50px;
  margin-bottom: 14px;
}
.b2-latest-title {
  font-family: 'Manrope', sans-serif;
  font-size: 1.25rem;
  font-weight: 800;
  color: #fff;
  line-height: 1.3;
  letter-spacing: -0.015em;
  margin-bottom: 22px;
  transition: color .25s;
}
.b2-latest-card:hover .b2-latest-title { color: #B9E4FF; }
.b2-latest-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 16px;
  border-top: 1px solid rgba(185,228,255,.15);
}
.b2-latest-date {
  font-family: 'Space Grotesk', sans-serif;
  font-size: .72rem;
  font-weight: 600;
  color: rgba(185,228,255,.55);
  letter-spacing: .04em;
}
.b2-latest-arrow {
  font-family: 'Manrope', sans-serif;
  font-size: 1.3rem;
  color: #B9E4FF;
  transition: transform .25s;
}
.b2-latest-card:hover .b2-latest-arrow { transform: translateX(4px); }

/* Decorative concentric circles bg */
.b2-latest-deco {
  position: absolute;
  bottom: -40px;
  right: -40px;
  width: 220px;
  height: 220px;
  color: #B9E4FF;
  pointer-events: none;
  opacity: .35;
  animation: b2-deco-rotate 30s linear infinite;
}
.b2-latest-deco svg { width: 100%; height: 100%; }
@keyframes b2-deco-rotate {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* Layout: sidebar + list */
.blog2-layout {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 48px;
  align-items: start;
}

/* Sidebar */
.blog2-sidebar {
  position: sticky;
  top: calc(var(--header-h) + 24px);
}
.blog2-side-label {
  font-family: 'Space Grotesk', sans-serif;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--text-faint);
  margin-bottom: 14px;
}
.blog2-tabs {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-bottom: 40px;
}
.blog2-tab {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  background: transparent;
  border: none;
  border-radius: 10px;
  font-family: 'Manrope', sans-serif;
  font-size: .88rem;
  font-weight: 600;
  color: var(--text-muted);
  cursor: pointer;
  text-align: left;
  transition: background .2s, color .2s;
}
.blog2-tab:hover { background: rgba(185,228,255,.15); color: #0B4F7E; }
.blog2-tab.active { background: #0B4F7E; color: #fff; }
.b2t-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(11,79,126,.3);
  flex-shrink: 0;
  transition: background .2s;
}
.blog2-tab:hover .b2t-dot { background: #0B4F7E; }
.blog2-tab.active .b2t-dot { background: #B9E4FF; }

/* Newsletter box in sidebar */
.blog2-side-newsletter {
  background: linear-gradient(135deg, #0B4F7E 0%, #083D62 100%);
  border-radius: 14px;
  padding: 22px 20px;
  color: #fff;
}
.b2-nl-title {
  font-family: 'Manrope', sans-serif;
  font-size: 1rem;
  font-weight: 800;
  margin-bottom: 6px;
}
.b2-nl-sub {
  font-size: .78rem;
  color: rgba(185,228,255,.7);
  line-height: 1.55;
  margin-bottom: 14px;
}
.b2-nl-btn {
  display: inline-block;
  font-family: 'Manrope', sans-serif;
  font-size: .78rem;
  font-weight: 700;
  color: #B9E4FF;
  text-decoration: none;
  padding-bottom: 2px;
  border-bottom: 1px solid rgba(185,228,255,.4);
  transition: color .2s, border-color .2s;
}
.b2-nl-btn:hover { color: #fff; border-color: #fff; }

/* Article list */
.blog2-list {
  display: flex;
  flex-direction: column;
}
.b2-row {
  display: grid;
  grid-template-columns: 60px 1fr 40px;
  gap: 24px;
  align-items: start;
  padding: 32px 0;
  border-bottom: 1px solid rgba(11,79,126,.08);
  text-decoration: none;
  transition: padding .3s, background .3s;
  position: relative;
}
.b2-row:first-child { padding-top: 4px; }
.b2-row::before {
  content: '';
  position: absolute;
  left: -24px;
  right: -24px;
  top: 0;
  bottom: 0;
  background: linear-gradient(90deg, rgba(185,228,255,.08), transparent);
  opacity: 0;
  border-radius: 12px;
  transition: opacity .3s;
  z-index: -1;
}
.b2-row:hover::before { opacity: 1; }
.b2-row:hover { padding-left: 8px; padding-right: 8px; }
.b2-row-num {
  font-family: 'Space Grotesk', sans-serif;
  font-size: .78rem;
  font-weight: 700;
  color: var(--text-faint);
  letter-spacing: .06em;
  padding-top: 4px;
}
.b2-row:hover .b2-row-num { color: #0B4F7E; }
.b2-row-content { min-width: 0; }
.b2-row-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  font-family: 'Space Grotesk', sans-serif;
  font-size: .72rem;
  color: var(--text-faint);
}
.b2-row-tag {
  font-weight: 700;
  color: #0B4F7E;
  background: rgba(185,228,255,.25);
  padding: 3px 10px;
  border-radius: 50px;
  letter-spacing: .04em;
  text-transform: uppercase;
  font-size: .65rem;
}
.b2-row-sep { color: var(--text-faint); }
.b2-row-title {
  font-family: 'Manrope', sans-serif;
  font-size: 1.35rem;
  font-weight: 800;
  color: var(--text);
  line-height: 1.3;
  letter-spacing: -0.02em;
  margin-bottom: 10px;
  transition: color .25s;
}
.b2-row:hover .b2-row-title { color: #0B4F7E; }
.b2-row-excerpt {
  font-size: .92rem;
  color: var(--text-muted);
  line-height: 1.75;
  max-width: 680px;
}
.b2-row-arrow {
  font-family: 'Manrope', sans-serif;
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--text-faint);
  padding-top: 4px;
  transition: color .25s, transform .25s;
}
.b2-row:hover .b2-row-arrow { color: #0B4F7E; transform: translateX(4px); }

@media (max-width: 900px) {
  .blog2-hero { grid-template-columns: 1fr; gap: 32px; }
  .blog2-layout { grid-template-columns: 1fr; gap: 32px; }
  .blog2-sidebar { position: static; }
  .blog2-tabs { flex-direction: row; flex-wrap: wrap; margin-bottom: 24px; }
  .blog2-side-newsletter { display: none; }
  .b2-row { grid-template-columns: 40px 1fr 30px; gap: 16px; }
  .b2-row-title { font-size: 1.15rem; }
}

/* ══════════════════════════════════════════════════════════════════
   POST PAGE — Article reader
══════════════════════════════════════════════════════════════════ */
.post-page {
  background: #fff;
  padding: calc(var(--header-h) + 56px) 0 80px;
  min-height: 100vh;
}
.post-container {
  max-width: 760px;
}
.post-back {
  display: inline-block;
  font-family: 'Space Grotesk', sans-serif;
  font-size: .8rem;
  font-weight: 600;
  color: var(--text-muted);
  text-decoration: none;
  margin-bottom: 32px;
  transition: color .2s, transform .2s;
}
.post-back:hover { color: #0B4F7E; transform: translateX(-3px); }

.post-header { margin-bottom: 48px; }
.post-tag {
  display: inline-block;
  font-family: 'Space Grotesk', sans-serif;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #0B4F7E;
  background: rgba(185,228,255,.3);
  padding: 5px 14px;
  border-radius: 50px;
  margin-bottom: 24px;
}
.post-title {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(2rem, 4.5vw, 3.4rem);
  font-weight: 900;
  color: var(--text);
  line-height: 1.1;
  letter-spacing: -0.03em;
  margin-bottom: 22px;
}
.post-excerpt {
  font-size: 1.15rem;
  color: var(--text-muted);
  line-height: 1.65;
  margin-bottom: 28px;
}
.post-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  font-family: 'Space Grotesk', sans-serif;
  font-size: .82rem;
  color: var(--text-faint);
  padding-top: 24px;
  border-top: 1px solid rgba(11,79,126,.1);
}
.post-meta-sep { color: var(--text-faint); opacity: .5; }

/* Article body */
.post-body {
  font-family: 'Inter', sans-serif;
  font-size: 1.05rem;
  line-height: 1.85;
  color: var(--text);
}
.post-body h2 {
  font-family: 'Manrope', sans-serif;
  font-size: 1.6rem;
  font-weight: 900;
  color: var(--text);
  letter-spacing: -0.02em;
  margin-top: 56px;
  margin-bottom: 18px;
  line-height: 1.25;
}
.post-body h3 {
  font-family: 'Manrope', sans-serif;
  font-size: 1.25rem;
  font-weight: 800;
  color: var(--text);
  margin-top: 36px;
  margin-bottom: 14px;
}
.post-body p {
  color: var(--text-muted);
  margin-bottom: 22px;
}
.post-body ul {
  margin: 0 0 24px 0;
  padding-left: 24px;
}
.post-body li {
  color: var(--text-muted);
  margin-bottom: 10px;
  line-height: 1.75;
}
.post-body li::marker { color: #0B4F7E; }
.post-body strong { color: var(--text); font-weight: 700; }

/* CTA at bottom */
.post-cta {
  margin-top: 80px;
  padding: 40px;
  background: linear-gradient(135deg, #0B4F7E 0%, #083D62 100%);
  border-radius: 22px;
  text-align: center;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.post-cta::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -20%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(185,228,255,.1) 0%, transparent 60%);
  pointer-events: none;
}
.post-cta-title {
  font-family: 'Manrope', sans-serif;
  font-size: 1.5rem;
  font-weight: 900;
  margin-bottom: 10px;
  position: relative;
  z-index: 1;
}
.post-cta-sub {
  font-size: .95rem;
  color: rgba(185,228,255,.7);
  margin-bottom: 24px;
  position: relative;
  z-index: 1;
}
.post-cta-btn {
  display: inline-block;
  padding: 14px 32px;
  background: #fff;
  color: #0B4F7E;
  font-family: 'Manrope', sans-serif;
  font-size: .9rem;
  font-weight: 800;
  border-radius: 50px;
  text-decoration: none;
  transition: background .25s, transform .25s, box-shadow .25s;
  position: relative;
  z-index: 1;
}
.post-cta-btn:hover {
  background: #B9E4FF;
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(0,0,0,.2);
}

@media (max-width: 768px) {
  .post-cta { padding: 32px 24px; }
  .post-body { font-size: 1rem; }
  .post-body h2 { font-size: 1.35rem; margin-top: 40px; }
}

/* ══════════════════════════════════════════════════════════════════
   BLOG PAGE (legacy, no longer used)
══════════════════════════════════════════════════════════════════ */
.blog-page {
  background: #fff;
  padding: calc(var(--header-h) + 56px) 0 80px;
  min-height: 100vh;
}

/* Breadcrumb */
.blog-breadcrumb {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 28px;
  font-family: 'Space Grotesk', sans-serif;
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .04em;
}
.blog-breadcrumb a { color: var(--text-muted); text-decoration: none; transition: color .2s; }
.blog-breadcrumb a:hover { color: #0B4F7E; }
.blog-breadcrumb .bc-sep { color: var(--text-faint); }
.blog-breadcrumb .bc-tag {
  color: #0B4F7E;
  margin-left: 4px;
  letter-spacing: .1em;
}

/* Hero */
.blog-hero {
  text-align: center;
  margin-bottom: 36px;
}
.blog-hero-title {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(2.2rem, 5vw, 3.6rem);
  font-weight: 900;
  color: var(--text);
  line-height: 1.1;
  letter-spacing: -0.03em;
  margin-bottom: 18px;
  max-width: 860px;
  margin-left: auto;
  margin-right: auto;
}
.blog-hero-title em { font-style: normal; color: #0B4F7E; }
.blog-hero-sub {
  font-size: 1rem;
  color: var(--text-muted);
  max-width: 560px;
  margin: 0 auto;
  line-height: 1.7;
}

/* Filter pills */
.blog-filters {
  display: flex;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 48px;
}
.blog-filter {
  font-family: 'Space Grotesk', sans-serif;
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .04em;
  padding: 9px 20px;
  border-radius: 50px;
  border: 1.5px solid rgba(11,79,126,.15);
  background: transparent;
  color: var(--text-muted);
  cursor: pointer;
  transition: all .25s;
}
.blog-filter:hover { color: #0B4F7E; border-color: #0B4F7E; background: rgba(185,228,255,.1); }
.blog-filter.active { color: #fff; background: #0B4F7E; border-color: #0B4F7E; box-shadow: 0 4px 14px rgba(11,79,126,.2); }

/* "All Posts" label */
.blog-section-label {
  font-family: 'Manrope', sans-serif;
  font-size: 1.4rem;
  font-weight: 800;
  color: var(--text);
  margin-bottom: 20px;
  letter-spacing: -0.02em;
}

/* Top grid: 1 big + 1 vertical */
.blog-top-grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 20px;
  margin-bottom: 20px;
}

/* Card base */
.bp-card {
  background: #fff;
  border: 1px solid rgba(11,79,126,.1);
  border-radius: 18px;
  overflow: hidden;
  text-decoration: none;
  display: flex;
  flex-direction: column;
  transition: border-color .35s, box-shadow .35s, transform .35s;
}
.bp-card:hover {
  border-color: rgba(11,79,126,.28);
  box-shadow: 0 12px 36px rgba(11,79,126,.1);
  transform: translateY(-4px);
}

/* Big featured card (left) */
.bp-card-big { min-height: 440px; }
.bp-card-big .bp-thumb { height: 260px; }
.bp-card-big .bp-body { padding: 28px 32px; }
.bp-big-title {
  font-family: 'Manrope', sans-serif;
  font-size: 1.3rem;
  font-weight: 800;
  color: var(--text);
  line-height: 1.3;
  margin-bottom: 12px;
}
.bp-big-icon { width: 80px; height: 80px; color: rgba(255,255,255,.2); }

/* Vertical featured (right) */
.bp-card-vert .bp-thumb { height: 220px; }
.bp-card-vert .bp-body { padding: 22px 24px; }

/* Post thumb */
.bp-thumb {
  height: 190px;
  display: grid;
  place-items: center;
  position: relative;
  overflow: hidden;
}
.bp-icon { width: 52px; height: 52px; color: rgba(255,255,255,.25); position: relative; z-index: 2; }

/* Patterns inside thumbs */
.bp-pattern { position: absolute; inset: 0; pointer-events: none; opacity: .3; }
.bp-pattern-1 {
  background-image:
    repeating-linear-gradient(45deg, rgba(185,228,255,.08) 0 2px, transparent 2px 20px),
    repeating-linear-gradient(-45deg, rgba(185,228,255,.05) 0 2px, transparent 2px 20px);
}
.bp-pattern-2 {
  background-image: radial-gradient(circle at 30% 40%, rgba(185,228,255,.12) 0%, transparent 40%), radial-gradient(circle at 70% 70%, rgba(185,228,255,.1) 0%, transparent 35%);
}

/* Gradient variations */
.bp-grad-1 { background: linear-gradient(135deg, #0B4F7E 0%, #1a7fc2 50%, #083D62 100%); }
.bp-grad-2 { background: linear-gradient(135deg, #083D62, #0B4F7E, #0a6aad); }
.bp-grad-3 { background: linear-gradient(135deg, #052C47, #0B4F7E); }
.bp-grad-4 { background: linear-gradient(135deg, #0B4F7E, #74C3F0, #0B4F7E); }
.bp-grad-5 { background: linear-gradient(135deg, #083D62 0%, #1a5276 50%, #0B4F7E 100%); }
.bp-grad-6 { background: linear-gradient(135deg, #031D30, #0B4F7E, #083D62); }

/* Card body */
.bp-body { padding: 22px 24px; flex: 1; display: flex; flex-direction: column; }
.bp-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
  font-family: 'Space Grotesk', sans-serif;
  font-size: .72rem;
  color: var(--text-faint);
}
.bp-body h3 {
  font-family: 'Manrope', sans-serif;
  font-size: 1rem;
  font-weight: 800;
  color: var(--text);
  line-height: 1.35;
  margin-bottom: 10px;
}
.bp-body p {
  font-size: .85rem;
  color: var(--text-muted);
  line-height: 1.7;
  flex: 1;
  margin-bottom: 14px;
}
.bp-link {
  font-family: 'Manrope', sans-serif;
  font-size: .82rem;
  font-weight: 700;
  color: #0B4F7E;
  margin-top: auto;
}
.bp-card:hover .bp-link { color: #083D62; }

/* Bottom posts grid */
.blog-posts {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

/* Tag chips */
.blog-tag-navy { background: rgba(11,79,126,.1); color: #0B4F7E; }
.blog-tag-sky { background: rgba(185,228,255,.35); color: #0B4F7E; }
.blog-tag-green { background: rgba(34,197,94,.1); color: #16a34a; }
.blog-tag-amber { background: rgba(245,158,11,.1); color: #d97706; }
.blog-tag-red { background: rgba(239,68,68,.1); color: #dc2626; }

/* Responsive */
@media (max-width: 900px) {
  .blog-top-grid { grid-template-columns: 1fr; }
  .blog-posts { grid-template-columns: repeat(2, 1fr); }
  .bp-card-big { min-height: auto; }
  .bp-card-big .bp-thumb { height: 200px; }
}
@media (max-width: 600px) {
  .blog-posts { grid-template-columns: 1fr; }
  .blog-hero-title { font-size: 2rem; }
}

/* Hero magic title */
.hero-magic { letter-spacing: -0.04em; }
.hero-magic em {
  font-style: normal;
  position: relative;
  color: #0B4F7E;
  white-space: nowrap;
}
.hero-magic em::after {
  content: '';
  position: absolute;
  left: -2px;
  right: -2px;
  bottom: 4px;
  height: 12px;
  background: linear-gradient(90deg, rgba(185,228,255,.7), rgba(185,228,255,.4));
  z-index: -1;
  border-radius: 2px;
  transform: skewX(-6deg);
}

/* ══════════════════════════════════════════════════════════════════
   PRODUCT — Interactive demo (ChatGPT mockup with PII detection)
══════════════════════════════════════════════════════════════════ */
.prod-demo {
  padding: 0 0 80px;
  background: #fff;
  position: relative;
}

.prod-demo-window {
  max-width: 1100px;
  margin: 0 auto;
  border-radius: 18px;
  background: #fff;
  box-shadow:
    0 0 0 2px #0B4F7E,
    0 0 0 8px rgba(11,79,126,.08),
    0 30px 80px rgba(11,79,126,.18),
    0 0 80px rgba(185,228,255,.3);
  overflow: hidden;
  position: relative;
}
.prod-demo-window::before {
  content: '';
  position: absolute;
  inset: -3px;
  border-radius: 21px;
  padding: 3px;
  background: linear-gradient(135deg, #0B4F7E, #B9E4FF, #0B4F7E);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: .55;
  animation: pdw-glow 4s ease-in-out infinite;
  pointer-events: none;
}
@keyframes pdw-glow {
  0%, 100% { opacity: .45; }
  50% { opacity: .85; }
}

/* Browser bar */
.pdw-bar {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 18px;
  background: #f4f6f9;
  border-bottom: 1px solid rgba(11,79,126,.1);
}
.pdw-dots { display: flex; gap: 6px; }
.pdw-dot { width: 11px; height: 11px; border-radius: 50%; }
.pdw-dot-r { background: #ff5f57; }
.pdw-dot-y { background: #febc2e; }
.pdw-dot-g { background: #28c840; }
.pdw-url {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  background: #fff;
  border: 1px solid rgba(11,79,126,.1);
  border-radius: 50px;
  padding: 5px 14px;
  font-family: 'Inter', sans-serif;
  font-size: .76rem;
  color: var(--text-muted);
  max-width: 360px;
  margin: 0 auto;
}
.pdw-url svg { color: var(--text-faint); }
.pdw-pribait {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 18px 6px 14px;
  background: linear-gradient(135deg, rgba(11,79,126,.05), rgba(185,228,255,.18));
  border: 1px solid rgba(11,79,126,.18);
  border-radius: 50px;
}
.pdw-pribait-logo {
  height: 38px;
  width: auto;
  display: block;
  object-fit: contain;
}
.pdw-pribait-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #0B4F7E;
  box-shadow: 0 0 0 0 rgba(11,79,126,.5);
  animation: pdw-pulse 2s ease-in-out infinite;
}
@keyframes pdw-pulse {
  0% { box-shadow: 0 0 0 0 rgba(11,79,126,.5); }
  70% { box-shadow: 0 0 0 8px rgba(11,79,126,0); }
  100% { box-shadow: 0 0 0 0 rgba(11,79,126,0); }
}

/* App layout */
.pdw-app {
  display: grid;
  grid-template-columns: 240px 1fr;
  min-height: 460px;
}

/* Sidebar */
.pdw-side {
  background: #fafbfc;
  border-right: 1px solid rgba(11,79,126,.08);
  padding: 18px 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.pdw-newchat {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 14px;
  background: #fff;
  border: 1px solid rgba(11,79,126,.12);
  border-radius: 10px;
  color: #0B4F7E;
  font-family: 'Inter', sans-serif;
  font-size: .82rem;
  font-weight: 600;
  cursor: pointer;
  margin-bottom: 14px;
  box-shadow: 0 1px 3px rgba(11,79,126,.05);
}
.pdw-newchat svg { color: #0B4F7E; }
.pdw-side-label {
  font-family: 'Space Grotesk', sans-serif;
  font-size: .58rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--text-faint);
  padding: 6px 14px 8px;
}
.pdw-side-item {
  padding: 9px 14px;
  font-family: 'Inter', sans-serif;
  font-size: .78rem;
  color: var(--text-muted);
  border-radius: 8px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pdw-side-item.active {
  background: rgba(185,228,255,.3);
  color: #0B4F7E;
  font-weight: 600;
}

/* Chat area */
.pdw-chat {
  display: flex;
  flex-direction: column;
  background: #fff;
  position: relative;
}
.pdw-chat-head {
  padding: 16px 22px;
  border-bottom: 1px solid rgba(11,79,126,.08);
}
.pdw-logo {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--text);
  font-family: 'Inter', sans-serif;
  font-size: .92rem;
  font-weight: 600;
}
.pdw-logo svg { color: #0d0d0d; }
.pdw-chat-ver {
  color: var(--text-faint);
  font-size: .78rem;
  font-weight: 400;
  margin-left: 4px;
}

.pdw-chat-body {
  flex: 1;
  padding: 24px 28px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  overflow: hidden;
}
.pdw-msg {
  display: flex;
  gap: 12px;
  max-width: 80%;
}
.pdw-msg-user { align-self: flex-end; }
.pdw-msg-bot { align-self: flex-start; }
.pdw-avatar {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: rgba(13,13,13,.06);
  border: 1px solid rgba(13,13,13,.15);
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
.pdw-bubble {
  padding: 12px 18px;
  border-radius: 18px;
  font-family: 'Inter', sans-serif;
  font-size: .87rem;
  line-height: 1.55;
  color: var(--text);
}
.pdw-bubble-user {
  background: rgba(185,228,255,.3);
  color: #052C47;
  border-radius: 18px;
}

/* Input bar */
.pdw-input-wrap {
  padding: 12px 22px 22px;
  position: relative;
}
.pdw-input {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #fafbfc;
  border: 1px solid rgba(11,79,126,.12);
  border-radius: 26px;
  padding: 12px 18px;
  min-height: 50px;
}
.pdw-input-icons {
  display: flex;
  gap: 10px;
  color: var(--text-faint);
  flex-shrink: 0;
}
.pdw-input-text {
  flex: 1;
  font-family: 'Inter', sans-serif;
  font-size: .87rem;
  color: var(--text);
  min-height: 22px;
  display: flex;
  align-items: center;
}
.pdw-cursor {
  display: inline-block;
  color: #B9E4FF;
  animation: pdw-blink 1s infinite;
  margin-left: 1px;
}
@keyframes pdw-blink {
  0%, 50% { opacity: 1; }
  51%, 100% { opacity: 0; }
}

/* PII highlight */
.pdw-pii {
  background: rgba(245, 158, 11, .25);
  color: #fbbf24;
  padding: 1px 6px;
  border-radius: 5px;
  border: 1px solid rgba(245, 158, 11, .45);
  font-weight: 500;
}

/* File upload chip */
.pdw-file {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: #fff;
  border: 1px solid rgba(11,79,126,.15);
  border-radius: 12px;
  padding: 10px 14px;
  position: relative;
  width: 100%;
  max-width: 360px;
  transition: border-color .35s, background .35s;
  overflow: hidden;
  box-shadow: 0 2px 6px rgba(11,79,126,.05);
}
.pdw-file.blocked {
  border-color: rgba(239, 68, 68, .55);
  background: rgba(239, 68, 68, .04);
}
.pdw-file-icon {
  width: 36px;
  height: 36px;
  background: linear-gradient(135deg, #1e7a4d, #19c37d);
  border-radius: 8px;
  display: grid;
  place-items: center;
  color: #fff;
  flex-shrink: 0;
  transition: background .35s, opacity .35s;
}
.pdw-file.blocked .pdw-file-icon {
  background: linear-gradient(135deg, #991b1b, #ef4444);
  opacity: .35;
}
.pdw-file-info {
  display: flex;
  flex-direction: column;
  min-width: 0;
  flex: 1;
}
.pdw-file-name {
  font-family: 'Inter', sans-serif;
  font-size: .82rem;
  font-weight: 600;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: opacity .35s;
}
.pdw-file-meta {
  font-family: 'Inter', sans-serif;
  font-size: .68rem;
  color: var(--text-muted);
  margin-top: 2px;
  transition: opacity .35s;
}
.pdw-file.blocked .pdw-file-name,
.pdw-file.blocked .pdw-file-meta { opacity: .35; }

/* Progress bar */
.pdw-file-progress {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: rgba(11,79,126,.06);
}
.pdw-file-bar {
  display: block;
  width: 100%;
  height: 100%;
}
.pdw-file-fill {
  display: block;
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, #19c37d, #B9E4FF);
  transition: width .12s linear, background .35s;
}
.pdw-file.blocked .pdw-file-fill {
  background: linear-gradient(90deg, #ef4444, #f87171);
}

/* Block overlay icon (red ban) */
.pdw-file-block {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 44px;
  height: 44px;
  background: #ef4444;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  transform: translate(-50%, -50%) scale(0);
  opacity: 0;
  transition: transform .4s cubic-bezier(.34, 1.56, .64, 1), opacity .3s;
  box-shadow: 0 0 0 6px rgba(239, 68, 68, .15), 0 8px 24px rgba(239, 68, 68, .35);
}
.pdw-file-block.show {
  transform: translate(-50%, -50%) scale(1);
  opacity: 1;
}

.pdw-input-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--text-faint);
  flex-shrink: 0;
}
.pdw-send {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #0B4F7E;
  color: #fff;
  display: grid;
  place-items: center;
  border: none;
  cursor: pointer;
  transition: background .2s;
}
.pdw-send:hover { background: #083D62; }

/* Pribait alert popup */
.pdw-alert {
  position: absolute;
  bottom: 78px;
  right: 22px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 18px;
  background: #fff;
  border: 1px solid rgba(11,79,126,.15);
  border-radius: 14px;
  box-shadow: 0 12px 40px rgba(11,79,126,.2), 0 0 0 4px rgba(185,228,255,.12);
  opacity: 0;
  transform: translateY(8px) scale(.96);
  transition: opacity .35s, transform .35s cubic-bezier(.34, 1.56, .64, 1);
  pointer-events: none;
  z-index: 5;
  max-width: 280px;
}
.pdw-alert.show {
  opacity: 1;
  transform: translateY(0) scale(1);
}
.pdw-alert-icon {
  width: 38px;
  height: 38px;
  background: linear-gradient(135deg, #0B4F7E, #1a7fc2);
  border-radius: 10px;
  display: grid;
  place-items: center;
  color: #fff;
  flex-shrink: 0;
}
.pdw-alert-title {
  font-family: 'Manrope', sans-serif;
  font-size: .85rem;
  font-weight: 800;
  color: #0B4F7E;
}
.pdw-alert-sub {
  font-size: .72rem;
  color: var(--text-muted);
  margin-top: 2px;
}

@media (max-width: 768px) {
  .prod-demo { padding-bottom: 56px; }
  .pdw-app { grid-template-columns: 1fr; min-height: 420px; }
  .pdw-side { display: none; }
  .pdw-pribait { font-size: .58rem; padding: 4px 10px; }
  .pdw-pribait span:not(.pdw-pribait-dot) { display: none; }
  .pdw-alert { right: 12px; left: 12px; max-width: none; }
}

/* ══════════════════════════════════════════════════════════════════
   MINI DEMOS — DLP / DSPM / Phishing
══════════════════════════════════════════════════════════════════ */
.mini-demo {
  background: #fff;
  border-radius: 18px;
  overflow: hidden;
  position: relative;
  box-shadow:
    0 0 0 1px rgba(11,79,126,.08),
    0 1px 2px rgba(11,79,126,.04),
    0 24px 60px -12px rgba(11,79,126,.18),
    0 0 80px -20px rgba(185,228,255,.6);
  font-family: 'Inter', sans-serif;
  isolation: isolate;
  transition: transform .5s cubic-bezier(.16,1,.3,1), box-shadow .5s;
}
.mini-demo:hover {
  transform: translateY(-4px);
  box-shadow:
    0 0 0 1px rgba(11,79,126,.14),
    0 1px 2px rgba(11,79,126,.04),
    0 32px 70px -12px rgba(11,79,126,.25),
    0 0 100px -20px rgba(185,228,255,.7);
}

/* Animated gradient border layer */
.mini-demo::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 18px;
  padding: 1.5px;
  background: conic-gradient(from var(--mdg-angle, 0deg),
    rgba(11,79,126,.5) 0%,
    rgba(185,228,255,.85) 25%,
    rgba(11,79,126,.5) 50%,
    rgba(116,195,240,.7) 75%,
    rgba(11,79,126,.5) 100%);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  animation: md-spin 8s linear infinite;
  pointer-events: none;
  z-index: 0;
}
@property --mdg-angle {
  syntax: '<angle>';
  initial-value: 0deg;
  inherits: false;
}
@keyframes md-spin {
  to { --mdg-angle: 360deg; }
}
@-webkit-keyframes md-spin {
  to { --mdg-angle: 360deg; }
}

/* Scanline holographic overlay (subtle) */
.mini-demo::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(185,228,255,.04) 0%, transparent 30%, transparent 70%, rgba(11,79,126,.03) 100%),
    repeating-linear-gradient(180deg, transparent 0, transparent 4px, rgba(11,79,126,.012) 4px, rgba(11,79,126,.012) 5px);
  pointer-events: none;
  z-index: 1;
}
.mini-demo > * {
  position: relative;
  z-index: 2;
}

/* Browser bar */
.md-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 9px 14px;
  background: #f4f6f9;
  border-bottom: 1px solid rgba(11,79,126,.1);
}
.md-dots { display: flex; gap: 5px; }
.md-dots span { width: 9px; height: 9px; border-radius: 50%; background: #d1d5db; }
.md-dots span:nth-child(1) { background: #ff5f57; }
.md-dots span:nth-child(2) { background: #febc2e; }
.md-dots span:nth-child(3) { background: #28c840; }
.md-app {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  background: #fff;
  border: 1px solid rgba(11,79,126,.1);
  border-radius: 50px;
  padding: 4px 12px;
  font-size: .68rem;
  color: var(--text-muted);
}
.md-app svg { color: var(--text-faint); }

/* ─── DLP MINI: Email compose ─── */
.md-mail {
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 280px;
  background: #fff;
}
.md-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(11,79,126,.08);
  font-size: .78rem;
}
.md-row-l {
  font-family: 'Space Grotesk', sans-serif;
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text-faint);
  width: 56px;
  flex-shrink: 0;
}
.md-row-v { color: var(--text); }
.md-mail-body {
  flex: 1;
  font-size: .82rem;
  color: var(--text-muted);
  line-height: 1.6;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-top: 4px;
}
.md-mail-body p { margin: 0; }
.md-pii-row { display: flex; align-items: center; }
.md-pii {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 6px;
  background: rgba(11,79,126,.04);
  color: var(--text);
  font-size: .76rem;
  border: 1px dashed rgba(11,79,126,.2);
  font-family: 'JetBrains Mono', monospace;
  transition: background .35s, color .35s, border-color .35s;
}
.md-pii.blocked {
  background: rgba(239, 68, 68, .1);
  color: #b91c1c;
  border-color: rgba(239, 68, 68, .55);
  border-style: solid;
}
.md-mail-foot {
  display: flex;
  justify-content: flex-end;
  margin-top: auto;
  padding-top: 14px;
}
.md-btn-send {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 18px;
  background: #0B4F7E;
  color: #fff;
  border: none;
  border-radius: 50px;
  font-family: 'Manrope', sans-serif;
  font-size: .78rem;
  font-weight: 700;
  cursor: pointer;
  transition: transform .15s, background .25s;
}
.md-btn-send.clicked { background: #083D62; transform: scale(.95); }
.md-btn-send.shake { animation: md-shake .4s; background: #ef4444; color: #fff; }
@keyframes md-shake {
  0%, 100% { transform: translateX(0); }
  20%, 60% { transform: translateX(-4px); }
  40%, 80% { transform: translateX(4px); }
}

/* Toast */
.md-toast {
  position: absolute;
  bottom: 16px;
  right: 16px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 14px;
  background: #fff;
  border: 1px solid rgba(11,79,126,.15);
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(11,79,126,.25), 0 0 0 4px rgba(185,228,255,.1);
  max-width: 230px;
  opacity: 0;
  transform: translateY(8px) scale(.96);
  transition: opacity .35s, transform .35s cubic-bezier(.34, 1.56, .64, 1);
  pointer-events: none;
  z-index: 5;
}
.md-toast.show { opacity: 1; transform: translateY(0) scale(1); }
.md-toast-icon {
  width: 30px;
  height: 30px;
  background: linear-gradient(135deg, #0B4F7E, #1a7fc2);
  border-radius: 8px;
  display: grid;
  place-items: center;
  color: #fff;
  flex-shrink: 0;
}
.md-toast-p { width: 110%; height: 110%; object-fit: contain; }
.md-toast-title {
  font-family: 'Manrope', sans-serif;
  font-size: .78rem;
  font-weight: 800;
  color: #0B4F7E;
}
.md-toast-sub { font-size: .68rem; color: var(--text-muted); margin-top: 1px; }

/* ─── DSPM MINI: Scanning files ─── */
.md-scan { padding: 16px 18px 18px; min-height: 280px; display: flex; flex-direction: column; background: #fff; }
.md-scan-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}
.md-scan-title {
  font-family: 'Space Grotesk', sans-serif;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #0B4F7E;
}
.md-scan-counter {
  font-family: 'JetBrains Mono', monospace;
  font-size: .72rem;
  color: var(--text-muted);
}
.md-scan-list { display: flex; flex-direction: column; gap: 5px; flex: 1; }
.md-file {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  background: #fafbfc;
  border: 1px solid rgba(11,79,126,.08);
  border-radius: 8px;
  font-size: .72rem;
  color: var(--text-muted);
  transition: background .3s, border-color .3s, color .3s;
  position: relative;
  overflow: hidden;
}
.md-file svg { color: var(--text-faint); flex-shrink: 0; }
.md-file-name { flex: 1; font-family: 'JetBrains Mono', monospace; font-size: .7rem; }
.md-file-tag {
  font-family: 'Space Grotesk', sans-serif;
  font-size: .56rem;
  font-weight: 700;
  letter-spacing: .06em;
  padding: 2px 7px;
  border-radius: 50px;
  opacity: 0;
  transform: scale(.8);
  transition: opacity .35s, transform .35s cubic-bezier(.34, 1.56, .64, 1);
}
.md-file.scanned .md-file-tag { opacity: 1; transform: scale(1); }
.md-file.scanned { background: rgba(185,228,255,.15); border-color: rgba(11,79,126,.18); color: var(--text); }
.md-file.scanned svg { color: #0B4F7E; }
.md-file.scanning {
  background: rgba(185,228,255,.25);
  border-color: #0B4F7E;
  box-shadow: 0 0 0 3px rgba(185,228,255,.2);
}
.md-file.scanning::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(11,79,126,.12), transparent);
  animation: md-scan-line .7s linear;
}
@keyframes md-scan-line {
  from { transform: translateX(-100%); }
  to { transform: translateX(100%); }
}
.md-tag-hconf { background: rgba(153,27,27,.15); color: #991b1b; font-weight: 800; }
.md-tag-pii  { background: rgba(245,158,11,.15); color: #b45309; }
.md-tag-pci  { background: rgba(239,68,68,.12); color: #b91c1c; }
.md-tag-conf { background: rgba(168,85,247,.12); color: #7c3aed; }
.md-tag-warn { background: rgba(239,68,68,.18); color: #991b1b; }
.md-tag-pub  { background: rgba(34,197,94,.15); color: #15803d; }
.md-tag-int  { background: rgba(11,79,126,.12); color: #0B4F7E; }
.md-file-warn.scanned { border-color: rgba(239,68,68,.45); background: rgba(239,68,68,.05); }
.md-scan-bar {
  height: 4px;
  background: rgba(11,79,126,.06);
  border-radius: 2px;
  margin-top: 12px;
  overflow: hidden;
}
.md-scan-fill {
  display: block;
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, #0B4F7E, #B9E4FF);
  transition: width .6s ease-out;
}

/* ─── PHISHING MINI: Inbox with incoming attack ─── */
.md-inbox { padding: 16px 18px; min-height: 280px; background: #fff; }
.md-inbox-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}
.md-inbox-title {
  font-family: 'Manrope', sans-serif;
  font-size: .92rem;
  font-weight: 800;
  color: var(--text);
}
.md-inbox-count {
  font-family: 'Space Grotesk', sans-serif;
  font-size: .62rem;
  font-weight: 700;
  color: #0B4F7E;
  background: rgba(185,228,255,.3);
  padding: 3px 10px;
  border-radius: 50px;
}
.md-inbox-list { display: flex; flex-direction: column; gap: 6px; }
.md-mail-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 12px;
  background: #fafbfc;
  border: 1px solid rgba(11,79,126,.08);
  border-radius: 10px;
  position: relative;
  overflow: hidden;
}
.md-mail-avatar {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-family: 'Manrope', sans-serif;
  font-size: .68rem;
  font-weight: 700;
  color: #fff;
  flex-shrink: 0;
}
.md-av-1 { background: linear-gradient(135deg, #0B4F7E, #1a7fc2); }
.md-av-2 { background: linear-gradient(135deg, #6366f1, #8b5cf6); }
.md-av-3 { background: linear-gradient(135deg, #ef4444, #b91c1c); }
.md-mail-info { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.md-mail-from {
  font-family: 'Inter', sans-serif;
  font-size: .76rem;
  font-weight: 700;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.md-mail-subj {
  font-size: .7rem;
  color: var(--text-muted);
  margin-top: 1px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.md-mail-time { font-size: .65rem; color: var(--text-faint); flex-shrink: 0; }

/* Phishing — Open email view */
.md-phish-open {
  padding: 0;
  min-height: 280px;
  background: #fff;
  position: relative;
  overflow: hidden;
}
.md-po-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 20px;
  border-bottom: 1px solid rgba(11,79,126,.08);
}
.md-po-meta { flex: 1; min-width: 0; }
.md-po-from {
  display: block;
  font-size: .78rem;
  font-weight: 700;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.md-po-to {
  display: block;
  font-size: .65rem;
  color: var(--text-faint);
  margin-top: 1px;
}
.md-po-time { font-size: .65rem; color: var(--text-faint); flex-shrink: 0; }

.md-po-body {
  padding: 16px 20px 20px;
  font-size: .82rem;
  color: var(--text-muted);
  line-height: 1.6;
  transition: opacity .4s;
}
.md-po-body p { margin: 0 0 10px; }
.md-po-subj {
  font-family: 'Manrope', sans-serif;
  font-size: .95rem;
  font-weight: 800;
  color: var(--text);
  margin-bottom: 14px !important;
}
.md-po-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: rgba(239,68,68,.06);
  border: 1px solid rgba(239,68,68,.2);
  border-radius: 8px;
  font-family: 'JetBrains Mono', monospace;
  font-size: .72rem;
  color: #b91c1c;
  transition: background .35s, border-color .35s;
}
.md-po-link svg { color: #ef4444; }

/* Block overlay */
.md-po-block {
  position: absolute;
  inset: 0;
  background: rgba(239,68,68,.06);
  backdrop-filter: blur(3px);
  display: grid;
  place-items: center;
  opacity: 0;
  transition: opacity .5s;
  z-index: 3;
  pointer-events: none;
}
.md-po-block.show { opacity: 1; }
.md-po-block-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 20px 32px;
  background: #fff;
  border: 2px solid #ef4444;
  border-radius: 16px;
  box-shadow: 0 12px 40px rgba(239,68,68,.2);
  transform: scale(.8);
  transition: transform .5s cubic-bezier(.34,1.56,.64,1);
  color: #b91c1c;
}
.md-po-block.show .md-po-block-inner { transform: scale(1); }
.md-po-block-inner svg { color: #ef4444; }
.md-po-block-inner span {
  font-family: 'Manrope', sans-serif;
  font-size: .88rem;
  font-weight: 800;
  color: #b91c1c;
}

@media (max-width: 768px) {
  .md-mail, .md-scan, .md-inbox { min-height: 240px; }
  .md-toast { right: 10px; bottom: 10px; max-width: 200px; }
}

/* ══════════════════════════════════════════════════════════════════
   CORE MODULES — Orbital diagram with center logo + 4 nodes
══════════════════════════════════════════════════════════════════ */
/* ══════════════════════════════════════════════════════════════════
   CORE MODULES — Horizontal compact nav strip
══════════════════════════════════════════════════════════════════ */
.cmx-section {
  background: #fff;
  padding: 24px 0 40px;
}
.cmx-strip {
  display: flex;
  align-items: stretch;
  gap: 0;
  max-width: 960px;
  margin: 0 auto;
}
.cmx-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 28px 28px 24px;
  text-decoration: none;
  position: relative;
  transition: background .3s;
  border-radius: 14px;
}
.cmx-item:hover {
  background: rgba(185,228,255,.12);
}
.cmx-item-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}
.cmx-icon {
  width: 38px;
  height: 38px;
  background: linear-gradient(135deg, rgba(185,228,255,.35), rgba(11,79,126,.1));
  border-radius: 11px;
  display: grid;
  place-items: center;
  color: #0B4F7E;
  transition: background .3s, color .3s, transform .3s;
}
.cmx-icon svg { width: 18px; height: 18px; }
.cmx-item:hover .cmx-icon {
  background: #0B4F7E;
  color: #fff;
  transform: scale(1.06);
}
.cmx-arrow {
  font-family: 'Manrope', sans-serif;
  font-size: 1.2rem;
  color: var(--text-faint);
  opacity: 0;
  transform: translateX(-6px);
  transition: opacity .3s, transform .3s, color .3s;
}
.cmx-item:hover .cmx-arrow {
  opacity: 1;
  transform: translateX(0);
  color: #0B4F7E;
}
.cmx-item h3 {
  font-family: 'Manrope', sans-serif;
  font-size: .95rem;
  font-weight: 800;
  color: var(--text);
  margin: 0 0 6px;
  letter-spacing: -0.01em;
}
.cmx-item p {
  font-size: .78rem;
  color: var(--text-muted);
  line-height: 1.5;
  margin: 0;
}
.cmx-divider {
  width: 1px;
  background: rgba(11,79,126,.1);
  align-self: stretch;
  margin: 12px 0;
  flex-shrink: 0;
}

@media (max-width: 700px) {
  .cmx-strip { flex-direction: column; gap: 4px; }
  .cmx-divider { width: 100%; height: 1px; margin: 0; }
  .cmx-arrow { opacity: 1; transform: translateX(0); }
}

/* "Core Modules" badge wrapper — centered */
.cm-header-wrap {
  display: flex;
  justify-content: center;
  margin-bottom: 18px;
}

/* Stylish "Core Modules" badge */
.cm-badge {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-family: 'Space Grotesk', sans-serif;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #B9E4FF;
  background: rgba(185,228,255,.08);
  border: 1px solid rgba(185,228,255,.2);
  border-radius: 50px;
  padding: 9px 22px;
  margin-bottom: 18px;
}
.cm-badge-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #B9E4FF;
  box-shadow: 0 0 0 0 rgba(185,228,255,.5);
  animation: cm-badge-pulse 2.2s ease-out infinite;
}
@keyframes cm-badge-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(185,228,255,.6); }
  70%  { box-shadow: 0 0 0 8px rgba(185,228,255,0); }
  100% { box-shadow: 0 0 0 0 rgba(185,228,255,0); }
}

/* Orbit container — smaller */
.cm-orbit {
  position: relative;
  width: 100%;
  max-width: 720px;
  margin: 48px auto 0;
  aspect-ratio: 1 / 1;
}
.cm-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

/* Center: Pribait logo */
.cm-center {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 160px;
  height: 160px;
  transform: translate(-50%, -50%);
  display: grid;
  place-items: center;
  z-index: 5;
}
.cm-center-pulse {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 1.5px solid rgba(11,79,126,.18);
  animation: cm-pulse 4s ease-out infinite;
}
.cm-center-pulse-2 { animation-delay: 2s; }
@keyframes cm-pulse {
  0%   { transform: scale(.7); opacity: 0; }
  20%  { opacity: .8; }
  100% { transform: scale(1.6); opacity: 0; }
}
.cm-center-inner {
  position: relative;
  width: 120px;
  height: 120px;
  background: linear-gradient(135deg, #0B4F7E, #083D62);
  border: 2px solid rgba(185,228,255,.3);
  border-radius: 50%;
  display: grid;
  place-items: center;
  box-shadow:
    0 0 40px rgba(185,228,255,.2),
    0 0 100px rgba(185,228,255,.1),
    0 20px 60px rgba(0,0,0,.4);
  animation: cm-float 6s ease-in-out infinite;
}
@keyframes cm-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-5px); }
}
.cm-center-logo {
  width: 80px;
  height: 80px;
  object-fit: contain;
  filter: brightness(10) drop-shadow(0 0 8px rgba(185,228,255,.4));
}

/* Node base */
.cm-node {
  position: absolute;
  width: 210px;
  background: rgba(255,255,255,.04);
  backdrop-filter: blur(12px);
  border: 1.5px solid rgba(185,228,255,.15);
  border-radius: 16px;
  padding: 18px 18px 16px;
  box-shadow:
    0 4px 12px rgba(0,0,0,.2),
    0 16px 40px rgba(0,0,0,.15);
  transition: transform .35s, box-shadow .35s, border-color .35s;
  cursor: default;
  z-index: 4;
}
.cm-node:hover {
  transform: translate(var(--tx, 0), var(--ty, 0)) scale(1.04);
  border-color: rgba(185,228,255,.45);
  box-shadow:
    0 4px 12px rgba(0,0,0,.25),
    0 28px 60px rgba(0,0,0,.2),
    0 0 40px rgba(185,228,255,.08);
}
.cm-node-icon {
  width: 38px;
  height: 38px;
  background: linear-gradient(135deg, #0B4F7E, #1a7fc2);
  border-radius: 10px;
  display: grid;
  place-items: center;
  color: #fff;
  margin-bottom: 12px;
  box-shadow: 0 6px 20px rgba(11,79,126,.25);
  transition: transform .3s, box-shadow .3s;
}
.cm-node-icon svg { width: 18px; height: 18px; }
.cm-node:hover .cm-node-icon {
  transform: rotate(-6deg) scale(1.08);
  box-shadow: 0 10px 28px rgba(11,79,126,.35);
}
.cm-node-num {
  font-family: 'Space Grotesk', sans-serif;
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: .14em;
  color: var(--text-faint);
  margin-bottom: 6px;
}
.cm-node-title {
  font-family: 'Manrope', sans-serif;
  font-size: .92rem;
  font-weight: 800;
  color: #fff;
  margin-bottom: 6px;
  letter-spacing: -0.01em;
}
.cm-node-desc {
  font-size: .74rem;
  color: rgba(185,228,255,.55);
  line-height: 1.55;
  margin: 0;
}

/* Position 4 nodes — offset from edges of orbit container */
.cm-node-top {
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  --tx: -50%;
  --ty: 0;
}
.cm-node-top:hover { transform: translateX(-50%) translateY(-6px) scale(1.04); }

.cm-node-right {
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  --tx: 0;
  --ty: -50%;
}
.cm-node-right:hover { transform: translateY(-50%) translateX(6px) scale(1.04); }

.cm-node-bottom {
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  --tx: -50%;
  --ty: 0;
}
.cm-node-bottom:hover { transform: translateX(-50%) translateY(6px) scale(1.04); }

.cm-node-left {
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  --tx: 0;
  --ty: -50%;
}
.cm-node-left:hover { transform: translateY(-50%) translateX(-6px) scale(1.04); }

/* SVG line glow */
.cm-link {
  filter: drop-shadow(0 0 6px rgba(185,228,255,.5));
  animation: cm-link-pulse 4s ease-in-out infinite;
}
.cm-link:nth-of-type(2) { animation-delay: 1s; }
.cm-link:nth-of-type(3) { animation-delay: 2s; }
.cm-link:nth-of-type(4) { animation-delay: 3s; }
@keyframes cm-link-pulse {
  0%, 100% { opacity: .6; }
  50% { opacity: 1; }
}

/* Particles glow */
.cm-particle {
  filter: drop-shadow(0 0 6px #B9E4FF) drop-shadow(0 0 12px rgba(185,228,255,.6));
}

/* Responsive */
@media (max-width: 900px) {
  .cm-orbit { max-width: 720px; }
  .cm-node { width: 200px; padding: 18px; }
  .cm-node-title { font-size: .92rem; }
  .cm-node-desc { font-size: .74rem; }
  .cm-center-inner { width: 130px; height: 130px; }
  .cm-center-logo { width: 88px; height: 88px; }
}
@media (max-width: 700px) {
  .cm-orbit {
    aspect-ratio: auto;
    max-width: 100%;
    margin-top: 40px;
  }
  .cm-svg { display: none; }
  .cm-center {
    position: relative;
    top: auto;
    left: auto;
    transform: none;
    margin: 0 auto 32px;
  }
  .cm-node {
    position: relative;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    transform: none !important;
    width: 100%;
    margin-bottom: 14px;
  }
  .cm-node:hover { transform: translateY(-3px) !important; }
  .cm-node { background: rgba(255,255,255,.06); backdrop-filter: blur(8px); }
}

/* ══════════════════════════════════════════════════════════════════
   PRODUCT FEATURE TEXT — Editorial layout for DLP / DSPM / Phishing
══════════════════════════════════════════════════════════════════ */
.prod-feature-text {
  display: flex;
  flex-direction: column;
}
.pf-tag {
  display: inline-block;
  font-family: 'Space Grotesk', sans-serif;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #0B4F7E;
  background: rgba(185,228,255,.25);
  padding: 6px 16px;
  border-radius: 50px;
  align-self: flex-start;
  margin-bottom: 20px;
}
.pf-headline {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(1.7rem, 3vw, 2.3rem);
  font-weight: 900;
  color: var(--text);
  line-height: 1.15;
  letter-spacing: -0.03em;
  margin: 0 0 18px;
}
.pf-headline em {
  font-style: normal;
  color: #0B4F7E;
}
.pf-lead {
  font-size: 1rem;
  color: var(--text-muted);
  line-height: 1.75;
  margin: 0 0 28px;
  max-width: 480px;
}
/* DLP mini — Google Drive upload */
.md-drive { padding: 0; min-height: 280px; display: flex; flex-direction: column; background: #fff; }
.md-drive-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 20px;
  border-bottom: 1px solid rgba(11,79,126,.08);
}
.md-drive-title {
  font-family: 'Manrope', sans-serif;
  font-size: .88rem;
  font-weight: 700;
  color: var(--text);
}
.md-drive-acct {
  font-size: .68rem;
  color: var(--text-faint);
  font-family: 'Inter', sans-serif;
}
.md-drive-body {
  padding: 16px 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1;
}
.md-upload-ok { opacity: .55; }
.md-upload-icon-ok { background: linear-gradient(135deg, #16a34a, #22c55e) !important; }
.md-upload-check {
  font-size: .78rem;
  color: #16a34a;
  font-weight: 700;
  flex-shrink: 0;
}

/* DLP mini — file upload chip */
.md-upload {
  display: flex;
  align-items: center;
  gap: 12px;
  background: #fafbfc;
  border: 1px solid rgba(11,79,126,.12);
  border-radius: 12px;
  padding: 12px 14px;
  position: relative;
  overflow: hidden;
  transition: border-color .35s, background .35s;
}
.md-upload.blocked {
  border-color: rgba(239,68,68,.5);
  background: rgba(239,68,68,.04);
}
.md-upload-icon {
  width: 36px;
  height: 36px;
  background: linear-gradient(135deg, #dc2626, #ef4444);
  border-radius: 8px;
  display: grid;
  place-items: center;
  color: #fff;
  flex-shrink: 0;
  transition: opacity .35s;
}
.md-upload.blocked .md-upload-icon { opacity: .35; }
.md-upload-info { flex: 1; min-width: 0; }
.md-upload-name {
  display: block;
  font-size: .8rem;
  font-weight: 600;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: opacity .35s;
}
.md-upload-meta {
  display: block;
  font-size: .66rem;
  color: var(--text-faint);
  margin-top: 2px;
  transition: opacity .35s;
}
.md-upload.blocked .md-upload-name,
.md-upload.blocked .md-upload-meta { opacity: .35; text-decoration: line-through; }
.md-upload-progress {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: rgba(11,79,126,.06);
}
.md-upload-bar { width: 100%; height: 100%; }
.md-upload-fill {
  display: block;
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, #0B4F7E, #B9E4FF);
  transition: width .1s linear, background .35s;
}
.md-upload.blocked .md-upload-fill {
  background: linear-gradient(90deg, #ef4444, #f87171);
}
.md-upload-block {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 40px;
  height: 40px;
  background: #ef4444;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  transform: translate(-50%, -50%) scale(0);
  opacity: 0;
  transition: transform .4s cubic-bezier(.34,1.56,.64,1), opacity .3s;
  box-shadow: 0 0 0 5px rgba(239,68,68,.12), 0 6px 20px rgba(239,68,68,.3);
  z-index: 3;
}
.md-upload-block.show {
  transform: translate(-50%, -50%) scale(1);
  opacity: 1;
}

.pf-tag-dark {
  background: #0B4F7E;
  color: #fff;
}

/* Feature highlights */
.pf-highlights {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.pf-hi {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px 0;
  font-family: 'Inter', sans-serif;
  font-size: .88rem;
  font-weight: 500;
  color: var(--text);
  border-bottom: 1px solid rgba(11,79,126,.07);
  transition: padding-left .3s, color .3s;
}
.pf-hi:last-child { border-bottom: none; }
.pf-hi:hover { padding-left: 6px; color: #0B4F7E; }
.pf-hi-icon {
  width: 28px;
  height: 28px;
  background: linear-gradient(135deg, rgba(185,228,255,.35), rgba(11,79,126,.08));
  border-radius: 8px;
  display: grid;
  place-items: center;
  color: #0B4F7E;
  flex-shrink: 0;
  transition: background .3s, transform .3s;
}
.pf-hi:hover .pf-hi-icon {
  background: #0B4F7E;
  color: #fff;
  transform: scale(1.08);
}

/* ══════════════════════════════════════════════════════════════════
   ANY APP — Universal Coverage marquee
══════════════════════════════════════════════════════════════════ */
.any-app {
  background: #fff;
  padding: 32px 0 80px;
  position: relative;
  overflow: hidden;
}
.any-app .section-title em {
  font-style: normal;
  color: #0B4F7E;
}
.any-app .section-title em::after {
  content: '';
  position: absolute;
  left: -2px;
  right: -2px;
  bottom: 4px;
  height: 12px;
  background: rgba(185,228,255,.5);
  z-index: -1;
  border-radius: 2px;
  transform: skewX(-6deg);
}
.any-app .section-title em { position: relative; display: inline-block; }

/* Marquees container */
.aa-marquees {
  margin-top: 56px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  position: relative;
}
.aa-marquees::before,
.aa-marquees::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  width: 120px;
  z-index: 3;
  pointer-events: none;
}
.aa-marquees::before {
  left: 0;
  background: linear-gradient(90deg, #fff 0%, #fff 30%, transparent 100%);
}
.aa-marquees::after {
  right: 0;
  background: linear-gradient(-90deg, #fff 0%, #fff 30%, transparent 100%);
}

/* Marquee row */
.aa-marquee {
  overflow: hidden;
  position: relative;
}
.aa-track {
  display: flex;
  gap: 20px;
  width: max-content;
  animation: aa-scroll 50s linear infinite;
  will-change: transform;
}
.aa-marquee-reverse .aa-track {
  animation: aa-scroll-rev 60s linear infinite;
}
@keyframes aa-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
@keyframes aa-scroll-rev {
  from { transform: translateX(-50%); }
  to   { transform: translateX(0); }
}

/* Logo card */
.aa-logo {
  flex-shrink: 0;
  width: 72px;
  height: 64px;
  background: #fff;
  border: 1px solid rgba(11,79,126,.08);
  border-radius: 12px;
  display: grid;
  place-items: center;
  padding: 14px;
  transition: border-color .3s, box-shadow .3s, transform .3s;
  cursor: default;
}
.aa-logo:hover {
  border-color: #0B4F7E;
  box-shadow: 0 6px 20px rgba(11,79,126,.12);
  transform: translateY(-3px);
}
.aa-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: transform .3s;
}
.aa-logo:hover img {
  transform: scale(1.1);
}

/* Footnote */
.aa-footnote {
  text-align: center;
  margin-top: 36px;
  font-family: 'Space Grotesk', sans-serif;
  font-size: .85rem;
  color: var(--text-faint);
  font-style: italic;
}

/* Pause animation on hover for legibility */
.aa-marquees:hover .aa-track {
  animation-play-state: paused;
}

@media (max-width: 700px) {
  .any-app { padding: 64px 0; }
  .aa-logo { width: 88px; height: 76px; padding: 14px; }
  .aa-marquees::before, .aa-marquees::after { width: 60px; }
}

/* ══════════════════════════════════════════════════════════════════
   PLATFORM OVERVIEW — Clean explainer
══════════════════════════════════════════════════════════════════ */
.plat-section {
  background: #fff;
  padding: clamp(64px, 8vw, 100px) 0;
  border-top: 1px solid rgba(11,79,126,.08);
  border-bottom: 1px solid rgba(11,79,126,.08);
  background-image: radial-gradient(rgba(11,79,126,.07) 1px, transparent 1px);
  background-size: 22px 22px;
}
.plat-header {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.plat-title {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(1.7rem, 3.5vw, 2.5rem);
  font-weight: 900;
  color: var(--text);
  line-height: 1.15;
  letter-spacing: -0.03em;
  margin: 20px 0 18px;
}
.plat-title em {
  font-style: normal;
  color: #0B4F7E;
}
.plat-sub {
  font-size: 1rem;
  color: var(--text-muted);
  line-height: 1.75;
  max-width: 600px;
}

/* Semicircle architecture */
.plat-arch {
  max-width: 860px;
  margin: 0 auto 36px;
}
.plat-svg {
  width: 100%;
  height: auto;
}
.pl-ring-label {
  font-family: 'Manrope', sans-serif;
  font-size: 12px;
  font-weight: 800;
  fill: #0B4F7E;
  letter-spacing: 3px;
  text-transform: uppercase;
}
.pl-ring-sub {
  font-family: 'Inter', sans-serif;
  font-size: 10.5px;
  font-weight: 500;
  fill: rgba(11,79,126,.5);
  letter-spacing: 0.3px;
}

/* Core logo overlay */
.plat-core-logo {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 120px;
  height: 60px;
  display: grid;
  place-items: center;
  pointer-events: none;
  z-index: 2;
}
.plat-core-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* Bottom bar + pills */
.plat-bottom {
  max-width: 860px;
  margin: 0 auto;
}
.plat-bar {
  background: #fff;
  border: 2px solid rgba(11,79,126,.12);
  padding: 13px 0;
  text-align: center;
  font-family: 'Manrope', sans-serif;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #0B4F7E;
}
.plat-pills {
  display: flex;
  gap: 0;
  margin-top: 6px;
}
.plat-pill {
  flex: 1;
  padding: 10px 8px;
  background: #B9E4FF;
  font-family: 'Manrope', sans-serif;
  font-size: .68rem;
  font-weight: 700;
  color: #0B4F7E;
  text-align: center;
  letter-spacing: .03em;
  text-transform: uppercase;
  border-right: 2px solid rgba(11,79,126,.08);
}
.plat-pill:last-child { border-right: none; }

@media (max-width: 700px) {
  .plat-pills { flex-wrap: wrap; }
  .plat-pill { flex: none; width: 50%; border-bottom: 2px solid rgba(11,79,126,.08); }
  .pl-ring-label { font-size: 10px; letter-spacing: 1px; }
  .pl-ring-sub { font-size: 9px; }
  .pl-core-label { font-size: 10px; }
}

/* ══════════════════════════════════════════════════════════════════
   WHY PRIBAIT — Bento feature grid (legacy)
══════════════════════════════════════════════════════════════════ */
.wg-section {
  background: #fff;
  padding: clamp(56px, 7vw, 96px) 0;
}
.wg-grid {
  display: grid;
  grid-template-columns: 1fr 1.2fr 1fr;
  grid-template-rows: auto auto;
  gap: 18px;
  max-width: 1060px;
  margin: 0 auto;
}

/* Standard card (corners) */
.wg-card {
  border-radius: 20px;
  overflow: hidden;
  transition: transform .4s cubic-bezier(.16,1,.3,1), box-shadow .4s;
}
.wg-card:hover {
  transform: translateY(-4px);
}
.wg-card-std {
  background: #fafbfc;
  border: 1px solid rgba(11,79,126,.08);
}
.wg-card-std:hover {
  box-shadow: 0 16px 40px rgba(11,79,126,.1);
  border-color: rgba(11,79,126,.18);
}
.wg-card-std .wg-card-inner {
  padding: 32px 28px 28px;
  position: relative;
}

/* Number tag */
.wg-num {
  font-family: 'Space Grotesk', sans-serif;
  font-size: .6rem;
  font-weight: 700;
  letter-spacing: .14em;
  color: #0B4F7E;
  background: rgba(185,228,255,.35);
  padding: 4px 10px;
  border-radius: 50px;
  display: inline-block;
  margin-bottom: 18px;
}

/* Accent line at bottom */
.wg-accent {
  position: absolute;
  bottom: 0;
  left: 28px;
  right: 28px;
  height: 3px;
  background: linear-gradient(90deg, #0B4F7E, #B9E4FF);
  border-radius: 2px;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .4s cubic-bezier(.16,1,.3,1);
}
.wg-card-std:hover .wg-accent { transform: scaleX(1); }

/* Hero card (center, dark) */
.wg-card-hero {
  background: linear-gradient(155deg, #0B4F7E 0%, #083D62 100%);
  grid-row: 1 / 2;
  grid-column: 2 / 3;
  position: relative;
}
.wg-card-hero::after {
  content: '';
  position: absolute;
  top: -50%;
  right: -30%;
  width: 300px;
  height: 300px;
  background: radial-gradient(circle, rgba(185,228,255,.12) 0%, transparent 60%);
  pointer-events: none;
}
.wg-card-hero:hover {
  box-shadow: 0 20px 50px rgba(11,79,126,.3);
}
.wg-card-hero .wg-card-inner {
  padding: 36px 32px 32px;
  position: relative;
  z-index: 1;
}
.wg-hero-icon {
  width: 48px;
  height: 48px;
  background: rgba(185,228,255,.15);
  border: 1px solid rgba(185,228,255,.25);
  border-radius: 14px;
  display: grid;
  place-items: center;
  color: #B9E4FF;
  margin-bottom: 20px;
}
.wg-hero-icon svg { width: 22px; height: 22px; }
.wg-card-hero h3 {
  font-family: 'Manrope', sans-serif;
  font-size: 1.3rem;
  font-weight: 900;
  color: #fff;
  margin: 0 0 12px;
  line-height: 1.2;
  letter-spacing: -0.02em;
}
.wg-card-hero p {
  font-size: .88rem;
  color: rgba(185,228,255,.65);
  line-height: 1.7;
  margin: 0;
}

/* Wide cards (bottom row) */
.wg-card-wide {
  background: #fafbfc;
  border: 1px solid rgba(11,79,126,.08);
  grid-column: span 1;
}
.wg-card-wide:first-of-type { grid-column: 1 / 2; }
.wg-card-wide:last-of-type { grid-column: 2 / 4; }
.wg-card-wide:hover {
  box-shadow: 0 16px 40px rgba(11,79,126,.1);
  border-color: rgba(11,79,126,.18);
}
.wg-card-wide .wg-card-inner {
  padding: 32px 28px 28px;
  position: relative;
}

/* Shared text styles for std + wide */
.wg-card-std h3, .wg-card-wide h3 {
  font-family: 'Manrope', sans-serif;
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--text);
  margin: 0 0 10px;
  letter-spacing: -0.01em;
}
.wg-card-std p, .wg-card-wide p {
  font-size: .86rem;
  color: var(--text-muted);
  line-height: 1.7;
  margin: 0;
}

@media (max-width: 900px) {
  .wg-grid { grid-template-columns: 1fr 1fr; }
  .wg-card-hero { grid-column: 1 / -1; }
  .wg-card-wide:last-of-type { grid-column: span 1; }
}
@media (max-width: 600px) {
  .wg-grid { grid-template-columns: 1fr; }
  .wg-card-wide:first-of-type,
  .wg-card-wide:last-of-type { grid-column: span 1; }
}

/* ══════════════════════════════════════════════════════════════════
   PRODUCT CTA — Split with floating cards
══════════════════════════════════════════════════════════════════ */
.prod-cta-split {
  background: #fff;
  padding: 40px 0 100px;
}
.pcsplit {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 48px;
  align-items: center;
  max-width: 1080px;
  margin: 0 auto;
}

/* Left text */
.pcsplit-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.pcsplit-line {
  width: 48px;
  height: 3px;
  background: linear-gradient(90deg, #0B4F7E, #B9E4FF);
  border-radius: 2px;
  margin-bottom: 24px;
}
.pcsplit-title {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(2.2rem, 4.5vw, 3.4rem);
  font-weight: 900;
  color: var(--text);
  letter-spacing: -0.04em;
  line-height: 1.08;
  margin: 0 0 18px;
}
.pcsplit-title em {
  font-style: normal;
  color: #0B4F7E;
  position: relative;
  display: inline-block;
}
.pcsplit-title em::after {
  content: '';
  position: absolute;
  left: -2px;
  right: -2px;
  bottom: 4px;
  height: 12px;
  background: rgba(185,228,255,.5);
  z-index: -1;
  border-radius: 2px;
  transform: skewX(-6deg);
}
.pcsplit-sub {
  font-size: 1.05rem;
  color: var(--text-muted);
  line-height: 1.75;
  margin: 0 0 28px;
  max-width: 380px;
}
.pcsplit-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 16px 36px;
  background: #0B4F7E;
  color: #fff;
  font-family: 'Manrope', sans-serif;
  font-size: .95rem;
  font-weight: 800;
  border-radius: 50px;
  text-decoration: none;
  transition: background .3s, transform .3s, box-shadow .3s;
  box-shadow: 0 4px 14px rgba(11,79,126,.2);
}
.pcsplit-btn:hover {
  background: #083D62;
  transform: translateY(-3px);
  box-shadow: 0 12px 32px rgba(11,79,126,.3);
}
.pcsplit-btn svg { transition: transform .3s; }
.pcsplit-btn:hover svg { transform: translateX(4px); }
.pcsplit-note {
  font-family: 'Space Grotesk', sans-serif;
  font-size: .74rem;
  font-weight: 500;
  color: var(--text-faint);
  margin-top: 14px;
  letter-spacing: .02em;
}

/* Right visual */
.pcsplit-visual {
  position: relative;
  width: 100%;
  aspect-ratio: 1.1 / 1;
  max-width: 420px;
  margin-left: auto;
}
.pcsplit-lines {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

/* Center hub */
.pcsplit-hub {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 3;
  display: grid;
  place-items: center;
}
.pcsplit-hub-pulse {
  position: absolute;
  width: 90px;
  height: 90px;
  border-radius: 50%;
  border: 1.5px solid rgba(11,79,126,.15);
  animation: pcsplit-pulse 3.5s ease-out infinite;
}
@keyframes pcsplit-pulse {
  0%   { transform: scale(.7); opacity: 0; }
  20%  { opacity: .7; }
  100% { transform: scale(1.5); opacity: 0; }
}
.pcsplit-hub-inner {
  width: 68px;
  height: 68px;
  background: linear-gradient(135deg, #0B4F7E, #083D62);
  border-radius: 20px;
  display: grid;
  place-items: center;
  box-shadow:
    0 0 0 4px rgba(185,228,255,.15),
    0 0 0 8px rgba(11,79,126,.06),
    0 12px 32px rgba(11,79,126,.25);
  position: relative;
}
.pcsplit-hub-logo {
  width: 38px;
  height: 38px;
  object-fit: contain;
  filter: brightness(0) invert(1);
}

/* Floating cards */
.pcsplit-card {
  position: absolute;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: #fff;
  border: 1px solid rgba(11,79,126,.08);
  border-radius: 14px;
  box-shadow: 0 4px 16px rgba(11,79,126,.07);
  z-index: 2;
  transition: transform .4s cubic-bezier(.16,1,.3,1), box-shadow .4s;
  cursor: default;
}
.pcsplit-card:hover {
  box-shadow: 0 12px 32px rgba(11,79,126,.14);
}
.pcsplit-card-icon {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
.pcsplit-icon-green { background: rgba(34,197,94,.1); color: #16a34a; }
.pcsplit-icon-red   { background: rgba(239,68,68,.1); color: #dc2626; }
.pcsplit-icon-navy  { background: rgba(11,79,126,.1); color: #0B4F7E; }
.pcsplit-icon-sky   { background: rgba(185,228,255,.35); color: #0B4F7E; }
.pcsplit-card-text { display: flex; flex-direction: column; min-width: 0; }
.pcsplit-card-text strong {
  font-family: 'Manrope', sans-serif;
  font-size: .76rem;
  font-weight: 800;
  color: var(--text);
  white-space: nowrap;
}
.pcsplit-card-text span {
  font-size: .66rem;
  color: var(--text-muted);
  white-space: nowrap;
  margin-top: 1px;
}

/* Card positions — 5 cards around hub */
.pcsplit-c1 { top: 4%;  left: 0;   animation: pcf1 6s ease-in-out infinite; }
.pcsplit-c2 { top: 0;   right: 2%; animation: pcf2 7s ease-in-out infinite; }
.pcsplit-c3 { top: 48%; right: 0;  animation: pcf3 5.5s ease-in-out infinite; }
.pcsplit-c4 { bottom: 4%; right: 12%; animation: pcf4 6.5s ease-in-out infinite; }
.pcsplit-c5 { bottom: 12%; left: 0; animation: pcf5 7.5s ease-in-out infinite; }

@keyframes pcf1 { 0%,100% { transform: translate(0,0); } 50% { transform: translate(3px,-5px); } }
@keyframes pcf2 { 0%,100% { transform: translate(0,0); } 50% { transform: translate(-4px,4px); } }
@keyframes pcf3 { 0%,100% { transform: translate(0,0); } 50% { transform: translate(-5px,-3px); } }
@keyframes pcf4 { 0%,100% { transform: translate(0,0); } 50% { transform: translate(3px,-4px); } }
@keyframes pcf5 { 0%,100% { transform: translate(0,0); } 50% { transform: translate(4px,3px); } }

@media (max-width: 800px) {
  .pcsplit { grid-template-columns: 1fr; text-align: center; }
  .pcsplit-text { align-items: center; }
  .pcsplit-visual { max-width: 340px; margin: 0 auto; }
}

/* ══════════════════════════════════════════════════════════════════
   PRODUCT CTA — Navy strip with animated lines (legacy)
══════════════════════════════════════════════════════════════════ */
.prod-cta-wow {
  position: relative;
  background: linear-gradient(135deg, #052C47 0%, #0B4F7E 50%, #052C47 100%);
  padding: 80px 0;
  overflow: hidden;
  margin-top: 20px;
}
.pcw-bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}
.pcw-line {
  position: absolute;
  height: 1px;
  width: 200%;
  left: -50%;
  background: linear-gradient(90deg, transparent 0%, rgba(185,228,255,.15) 25%, rgba(185,228,255,.4) 50%, rgba(185,228,255,.15) 75%, transparent 100%);
  animation: pcw-sweep 6s linear infinite;
}
.pcw-line-1 { top: 25%; animation-duration: 5s; }
.pcw-line-2 { top: 55%; animation-duration: 7s; animation-delay: 2s; opacity: .6; }
.pcw-line-3 { top: 80%; animation-duration: 9s; animation-delay: 4s; opacity: .35; }
@keyframes pcw-sweep {
  from { transform: translateX(-25%); }
  to   { transform: translateX(25%); }
}

.pcw-inner {
  text-align: center;
  max-width: 640px;
  margin: 0 auto;
}
.pcw-logo {
  width: 56px;
  height: 56px;
  object-fit: contain;
  margin-bottom: 28px;
  filter: brightness(0) invert(1);
  opacity: .7;
}
.pcw-title {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(1.8rem, 3.5vw, 2.6rem);
  font-weight: 900;
  color: #fff;
  letter-spacing: -0.03em;
  line-height: 1.15;
  margin: 0 0 32px;
}
.pcw-title em {
  font-style: normal;
  color: #B9E4FF;
}
.pcw-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 16px 38px;
  background: #fff;
  color: #0B4F7E;
  font-family: 'Manrope', sans-serif;
  font-size: .95rem;
  font-weight: 800;
  border-radius: 50px;
  text-decoration: none;
  transition: background .3s, transform .3s, box-shadow .3s;
  box-shadow: 0 4px 16px rgba(0,0,0,.15);
}
.pcw-btn:hover {
  background: #B9E4FF;
  transform: translateY(-3px);
  box-shadow: 0 12px 32px rgba(185,228,255,.3);
}
.pcw-btn svg { transition: transform .3s; }
.pcw-btn:hover svg { transform: translateX(4px); }

@media (max-width: 600px) {
  .prod-cta-wow { padding: 56px 0; }
  .pcw-btn { width: 100%; justify-content: center; }
}

/* ══════════════════════════════════════════════════════════════════
   PRODUCT CTA — Highlight strip with animated edge (legacy)
══════════════════════════════════════════════════════════════════ */
.product-cta-strip {
  background: #fff;
  padding: 80px 0 110px;
}
.pcs-card {
  max-width: 1080px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 48px;
  padding: 44px 56px 44px 64px;
  background: #fff;
  border: 1px solid rgba(11,79,126,.12);
  border-radius: 20px;
  position: relative;
  overflow: hidden;
  box-shadow:
    0 1px 3px rgba(11,79,126,.04),
    0 20px 50px rgba(11,79,126,.07);
  transition: border-color .35s, box-shadow .35s, transform .35s;
}
.pcs-card:hover {
  border-color: rgba(11,79,126,.22);
  box-shadow: 0 1px 3px rgba(11,79,126,.04), 0 28px 60px rgba(11,79,126,.12);
  transform: translateY(-3px);
}

/* Animated left edge */
.pcs-edge {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 6px;
  background: linear-gradient(180deg, #0B4F7E 0%, #1a7fc2 50%, #B9E4FF 100%);
  background-size: 100% 200%;
  animation: pcs-edge-flow 3.5s ease-in-out infinite;
}
@keyframes pcs-edge-flow {
  0%, 100% { background-position: 0% 0%; }
  50% { background-position: 0% 100%; }
}
.pcs-card::after {
  content: '';
  position: absolute;
  top: 0;
  left: 6px;
  bottom: 0;
  width: 80px;
  background: linear-gradient(90deg, rgba(185,228,255,.18), transparent);
  pointer-events: none;
}

/* Content */
.pcs-content {
  position: relative;
  min-width: 0;
}
.pcs-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'Space Grotesk', sans-serif;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #0B4F7E;
  margin-bottom: 12px;
}
.pcs-eyebrow-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #0B4F7E;
  box-shadow: 0 0 0 0 rgba(11,79,126,.5);
  animation: cm-badge-pulse 2.2s ease-out infinite;
}
.pcs-title {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(1.6rem, 2.6vw, 2.1rem);
  font-weight: 900;
  color: var(--text);
  letter-spacing: -0.025em;
  line-height: 1.18;
  margin: 0 0 10px;
}
.pcs-title em {
  font-style: normal;
  color: #0B4F7E;
  position: relative;
  display: inline-block;
}
.pcs-title em::after {
  content: '';
  position: absolute;
  left: -2px;
  right: -2px;
  bottom: 3px;
  height: 9px;
  background: rgba(185,228,255,.55);
  z-index: -1;
  border-radius: 2px;
  transform: skewX(-6deg);
}
.pcs-sub {
  font-size: .96rem;
  color: var(--text-muted);
  line-height: 1.7;
  margin: 0;
}

/* Actions */
.pcs-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}
.pcs-btn {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 14px 28px;
  font-family: 'Manrope', sans-serif;
  font-size: .9rem;
  font-weight: 800;
  border-radius: 50px;
  text-decoration: none;
  white-space: nowrap;
  transition: background .25s, color .25s, transform .25s, box-shadow .25s, border-color .25s;
}
.pcs-btn-primary {
  background: #0B4F7E;
  color: #fff;
  box-shadow: 0 6px 18px rgba(11,79,126,.22);
}
.pcs-btn-primary:hover {
  background: #083D62;
  transform: translateY(-2px);
  box-shadow: 0 10px 26px rgba(11,79,126,.32);
}
.pcs-btn-primary svg { transition: transform .25s; }
.pcs-btn-primary:hover svg { transform: translateX(3px); }
.pcs-btn-ghost {
  background: transparent;
  color: #0B4F7E;
  border: 1.5px solid rgba(11,79,126,.18);
}
.pcs-btn-ghost:hover {
  background: rgba(185,228,255,.18);
  border-color: #0B4F7E;
  transform: translateY(-2px);
}

/* Responsive */
@media (max-width: 850px) {
  .product-cta-strip { padding: 56px 0 80px; }
  .pcs-card { grid-template-columns: 1fr; gap: 28px; padding: 36px 32px 36px 40px; }
  .pcs-actions { width: 100%; }
  .pcs-btn { flex: 1; justify-content: center; }
}
@media (max-width: 600px) {
  .pcs-card { padding: 32px 24px 32px 32px; }
  .pcs-actions { flex-direction: column; }
  .pcs-btn { width: 100%; }
}

/* ══════════════════════════════════════════════════════════════════
   PRODUCT CTA — Minimal bottom bar (legacy)
══════════════════════════════════════════════════════════════════ */
.product-cta-bar {
  background: #fff;
  padding: 56px 0 80px;
}
.pctabar {
  max-width: 1080px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  padding: 28px 36px;
  background: #fff;
  border: 1px solid rgba(11,79,126,.12);
  border-radius: 16px;
  box-shadow: 0 1px 3px rgba(11,79,126,.04);
  transition: border-color .3s, box-shadow .3s;
}
.pctabar:hover {
  border-color: rgba(11,79,126,.22);
  box-shadow: 0 8px 24px rgba(11,79,126,.08);
}
.pctabar-text { flex: 1; min-width: 0; }
.pctabar-title {
  font-family: 'Manrope', sans-serif;
  font-size: 1.35rem;
  font-weight: 800;
  color: var(--text);
  letter-spacing: -0.02em;
  margin: 0 0 4px;
}
.pctabar-sub {
  font-size: .88rem;
  color: var(--text-muted);
  margin: 0;
}
.pctabar-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 13px 28px;
  background: #0B4F7E;
  color: #fff;
  font-family: 'Manrope', sans-serif;
  font-size: .88rem;
  font-weight: 800;
  border-radius: 50px;
  text-decoration: none;
  flex-shrink: 0;
  transition: background .25s, transform .25s, box-shadow .25s;
}
.pctabar-btn:hover {
  background: #083D62;
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(11,79,126,.2);
}
.pctabar-btn svg { transition: transform .25s; }
.pctabar-btn:hover svg { transform: translateX(3px); }

@media (max-width: 700px) {
  .product-cta-bar { padding: 40px 0 60px; }
  .pctabar { flex-direction: column; align-items: flex-start; padding: 24px; gap: 20px; }
  .pctabar-btn { width: 100%; justify-content: center; }
}

/* ══════════════════════════════════════════════════════════════════
   PRODUCT CTA v3 — Split editorial (legacy)
══════════════════════════════════════════════════════════════════ */
.product-cta-3 {
  background: #fff;
  padding: 100px 0 120px;
  position: relative;
}
.pcta3-row {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 80px;
  align-items: center;
  max-width: 1080px;
  margin: 0 auto;
}

/* Left text column */
.pcta3-text { position: relative; }
.pcta3-line {
  width: 56px;
  height: 3px;
  background: linear-gradient(90deg, #0B4F7E, #B9E4FF);
  border-radius: 2px;
  margin-bottom: 28px;
}
.pcta3-title {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 900;
  color: var(--text);
  line-height: 1.12;
  letter-spacing: -0.035em;
  margin-bottom: 22px;
}
.pcta3-title em {
  font-style: normal;
  color: #0B4F7E;
  position: relative;
  display: inline-block;
}
.pcta3-title em::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 4px;
  height: 10px;
  background: rgba(185,228,255,.55);
  z-index: -1;
  border-radius: 2px;
  transform: skewX(-6deg);
}
.pcta3-sub {
  font-size: 1rem;
  color: var(--text-muted);
  line-height: 1.75;
  max-width: 480px;
  margin-bottom: 32px;
}
.pcta3-btns {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
}
.pcta3-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 30px;
  font-family: 'Manrope', sans-serif;
  font-size: .92rem;
  font-weight: 800;
  border-radius: 50px;
  text-decoration: none;
  transition: transform .3s, box-shadow .3s, background .3s, color .3s;
}
.pcta3-btn-primary {
  background: #0B4F7E;
  color: #fff;
  box-shadow: 0 6px 20px rgba(11,79,126,.22);
}
.pcta3-btn-primary:hover {
  background: #083D62;
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(11,79,126,.32);
}
.pcta3-btn-primary svg { transition: transform .3s; }
.pcta3-btn-primary:hover svg { transform: translateX(3px); }
.pcta3-btn-ghost {
  background: transparent;
  color: #0B4F7E;
  border: 1.5px solid rgba(11,79,126,.18);
}
.pcta3-btn-ghost:hover {
  background: rgba(185,228,255,.18);
  border-color: #0B4F7E;
  transform: translateY(-2px);
}

/* Right visual column */
.pcta3-visual {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  max-width: 380px;
  margin-left: auto;
  display: grid;
  place-items: center;
}

/* Concentric pulse rings */
.pcta3-rings {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  pointer-events: none;
}
.pcta3-ring {
  position: absolute;
  border-radius: 50%;
  border: 1.5px solid rgba(11,79,126,.18);
  animation: pcta3-pulse 4s ease-out infinite;
}
.pcta3-ring-1 { width: 60%; height: 60%; }
.pcta3-ring-2 { width: 80%; height: 80%; animation-delay: 1.3s; border-color: rgba(11,79,126,.12); }
.pcta3-ring-3 { width: 100%; height: 100%; animation-delay: 2.6s; border-color: rgba(11,79,126,.08); }
@keyframes pcta3-pulse {
  0%   { transform: scale(.6); opacity: 0; border-color: rgba(11,79,126,.4); }
  20%  { opacity: 1; }
  100% { transform: scale(1.1); opacity: 0; border-color: rgba(185,228,255,.4); }
}

/* Core: Pribait logo */
.pcta3-core {
  position: relative;
  width: 130px;
  height: 130px;
  background: #fff;
  border-radius: 50%;
  display: grid;
  place-items: center;
  z-index: 2;
  box-shadow:
    0 0 0 1px rgba(11,79,126,.1),
    0 0 0 8px rgba(255,255,255,.7),
    0 20px 60px rgba(11,79,126,.18),
    0 0 90px rgba(185,228,255,.5);
  animation: pcta3-float 6s ease-in-out infinite;
}
@keyframes pcta3-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-5px); }
}
.pcta3-logo {
  width: 86px;
  height: 86px;
  object-fit: contain;
  filter: drop-shadow(0 4px 10px rgba(11,79,126,.18));
}

/* Counter pill (overlay top-right of visual) */
.pcta3-counter {
  position: absolute;
  bottom: 8%;
  right: -8%;
  background: #fff;
  border: 1px solid rgba(11,79,126,.12);
  border-radius: 16px;
  padding: 14px 20px;
  z-index: 3;
  box-shadow: 0 12px 32px rgba(11,79,126,.12);
  animation: pcta3-counter-float 6s ease-in-out infinite;
}
@keyframes pcta3-counter-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}
.pcta3-counter-num {
  font-family: 'Manrope', sans-serif;
  font-size: 1.85rem;
  font-weight: 900;
  color: #0B4F7E;
  letter-spacing: -0.03em;
  line-height: 1;
}
.pcta3-counter-pct {
  font-size: 1.1rem;
  margin-left: 2px;
  color: #0B4F7E;
}
.pcta3-counter-lbl {
  font-family: 'Space Grotesk', sans-serif;
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--text-muted);
  margin-top: 4px;
  text-transform: uppercase;
}

/* Responsive */
@media (max-width: 900px) {
  .pcta3-row { grid-template-columns: 1fr; gap: 60px; text-align: center; }
  .pcta3-line { margin-left: auto; margin-right: auto; }
  .pcta3-sub { margin-left: auto; margin-right: auto; }
  .pcta3-btns { justify-content: center; }
  .pcta3-visual { margin-left: auto; margin-right: auto; max-width: 320px; }
  .pcta3-counter { right: 0; }
}
@media (max-width: 600px) {
  .product-cta-3 { padding: 64px 0 80px; }
  .pcta3-counter { right: -10px; padding: 10px 14px; }
  .pcta3-counter-num { font-size: 1.5rem; }
}

/* ══════════════════════════════════════════════════════════════════
   PRODUCT CTA v2 — Premium white with motion (legacy, no longer used)
══════════════════════════════════════════════════════════════════ */
.product-cta-2 {
  position: relative;
  background: #fff;
  padding: 100px 0 120px;
  overflow: hidden;
}

/* Background grid (only in central area) */
.pcta2-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(11,79,126,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(11,79,126,.05) 1px, transparent 1px);
  background-size: 32px 32px;
  mask-image: radial-gradient(ellipse 60% 60% at 50% 50%, black 30%, transparent 80%);
  -webkit-mask-image: radial-gradient(ellipse 60% 60% at 50% 50%, black 30%, transparent 80%);
  pointer-events: none;
}

/* Floating orbs (background atmosphere) */
.pcta2-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  pointer-events: none;
}
.pcta2-orb-1 {
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(185,228,255,.55) 0%, transparent 70%);
  top: -120px;
  left: -100px;
  animation: pcta2-orb-float-1 16s ease-in-out infinite;
}
.pcta2-orb-2 {
  width: 450px;
  height: 450px;
  background: radial-gradient(circle, rgba(11,79,126,.18) 0%, transparent 70%);
  bottom: -120px;
  right: -100px;
  animation: pcta2-orb-float-2 18s ease-in-out infinite;
}
.pcta2-orb-3 {
  width: 350px;
  height: 350px;
  background: radial-gradient(circle, rgba(116,195,240,.25) 0%, transparent 70%);
  top: 30%;
  right: 25%;
  animation: pcta2-orb-float-3 20s ease-in-out infinite;
}
@keyframes pcta2-orb-float-1 {
  0%, 100% { transform: translate(0, 0); }
  50% { transform: translate(40px, 30px); }
}
@keyframes pcta2-orb-float-2 {
  0%, 100% { transform: translate(0, 0); }
  50% { transform: translate(-50px, -40px); }
}
@keyframes pcta2-orb-float-3 {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50% { transform: translate(-30px, 30px) scale(1.1); }
}

/* Card */
.pcta2-card {
  position: relative;
  max-width: 920px;
  margin: 0 auto;
  background: linear-gradient(180deg, #fff 0%, #fafbfc 100%);
  border-radius: 32px;
  padding: 72px 60px 64px;
  text-align: center;
  border: 1px solid rgba(11,79,126,.1);
  box-shadow:
    0 1px 3px rgba(11,79,126,.04),
    0 30px 80px rgba(11,79,126,.1),
    0 0 80px rgba(185,228,255,.2);
  overflow: hidden;
}
.pcta2-card::before {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: 33px;
  padding: 1.5px;
  background: linear-gradient(135deg, rgba(11,79,126,.25), rgba(185,228,255,.5), rgba(11,79,126,.15));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: .6;
  pointer-events: none;
}

/* Floating decorative shapes inside card */
.pcta2-shape {
  position: absolute;
  color: #0B4F7E;
  opacity: .07;
  pointer-events: none;
}
.pcta2-shape-1 {
  top: 40px;
  left: 40px;
  animation: pcta2-shape-1 14s ease-in-out infinite;
}
.pcta2-shape-2 {
  bottom: 40px;
  right: 60px;
  animation: pcta2-shape-2 16s ease-in-out infinite;
}
.pcta2-shape-3 {
  top: 50%;
  right: 30px;
  animation: pcta2-shape-3 12s ease-in-out infinite;
}
@keyframes pcta2-shape-1 {
  0%, 100% { transform: translate(0, 0) rotate(-8deg); }
  50% { transform: translate(8px, -10px) rotate(2deg); }
}
@keyframes pcta2-shape-2 {
  0%, 100% { transform: translate(0, 0) rotate(6deg); }
  50% { transform: translate(-10px, -8px) rotate(-4deg); }
}
@keyframes pcta2-shape-3 {
  0%, 100% { transform: translate(0, -50%) rotate(0deg); }
  50% { transform: translate(-12px, -45%) rotate(8deg); }
}

/* Card content (over shapes) */
.pcta2-content {
  position: relative;
  z-index: 2;
}

/* Badge */
.pcta2-badge {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-family: 'Space Grotesk', sans-serif;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #0B4F7E;
  background: linear-gradient(135deg, rgba(11,79,126,.06), rgba(185,228,255,.22));
  border: 1px solid rgba(11,79,126,.18);
  border-radius: 50px;
  padding: 9px 22px;
  margin-bottom: 24px;
  box-shadow: 0 4px 16px rgba(11,79,126,.06);
}
.pcta2-badge-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #0B4F7E;
  box-shadow: 0 0 0 0 rgba(11,79,126,.5);
  animation: cm-badge-pulse 2.2s ease-out infinite;
}

/* Title */
.pcta2-title {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(2rem, 4.2vw, 3.2rem);
  font-weight: 900;
  color: var(--text);
  line-height: 1.12;
  letter-spacing: -0.035em;
  margin-bottom: 22px;
}
.pcta2-title em {
  font-style: normal;
  background: linear-gradient(120deg, #0B4F7E 0%, #1a7fc2 50%, #0B4F7E 100%);
  background-size: 200% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: pcta2-shine 4s linear infinite;
}
@keyframes pcta2-shine {
  to { background-position: 200% center; }
}

/* Subtitle */
.pcta2-sub {
  font-size: 1.05rem;
  color: var(--text-muted);
  line-height: 1.75;
  max-width: 580px;
  margin: 0 auto 36px;
}

/* Buttons */
.pcta2-btns {
  display: flex;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 36px;
}
.pcta2-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 16px 36px;
  font-family: 'Manrope', sans-serif;
  font-size: .95rem;
  font-weight: 800;
  border-radius: 50px;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  transition: transform .3s, box-shadow .3s, background .3s, color .3s;
}
.pcta2-btn-primary {
  background: linear-gradient(135deg, #0B4F7E 0%, #083D62 100%);
  color: #fff;
  box-shadow: 0 8px 24px rgba(11,79,126,.25), 0 0 0 1px rgba(11,79,126,.2);
}
.pcta2-btn-primary:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 36px rgba(11,79,126,.35), 0 0 0 1px rgba(11,79,126,.3);
}
.pcta2-btn-shine {
  position: absolute;
  top: 0;
  left: -100%;
  width: 60%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.3), transparent);
  transform: skewX(-20deg);
  transition: left .7s;
}
.pcta2-btn-primary:hover .pcta2-btn-shine { left: 150%; }
.pcta2-btn-ghost {
  background: transparent;
  color: #0B4F7E;
  border: 1.5px solid rgba(11,79,126,.18);
}
.pcta2-btn-ghost:hover {
  background: rgba(185,228,255,.18);
  border-color: #0B4F7E;
  transform: translateY(-3px);
}
.pcta2-btn-ghost svg { transition: transform .3s; }
.pcta2-btn-ghost:hover svg { transform: translateX(3px); }

/* Trust row */
.pcta2-trust {
  display: flex;
  justify-content: center;
  gap: 32px;
  flex-wrap: wrap;
  padding-top: 28px;
  border-top: 1px solid rgba(11,79,126,.08);
}
.pcta2-trust-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: 'Space Grotesk', sans-serif;
  font-size: .82rem;
  font-weight: 600;
  color: var(--text-muted);
}
.pcta2-trust-item svg {
  color: #0B4F7E;
  background: rgba(185,228,255,.3);
  border-radius: 50%;
  padding: 3px;
  width: 20px;
  height: 20px;
}

/* Responsive */
@media (max-width: 768px) {
  .product-cta-2 { padding: 64px 0 80px; }
  .pcta2-card { padding: 48px 28px; border-radius: 24px; }
  .pcta2-shape { display: none; }
  .pcta2-trust { gap: 18px; }
  .pcta2-btn { width: 100%; justify-content: center; }
}

/* ══════════════════════════════════════════════════════════════════
   COMPREHENSIVE RESPONSIVE OVERRIDES
   Breakpoints: 320-479 (sm mobile), 480-639 (mobile), 640-767 (lg mobile),
                768-1023 (tablet), 1024-1439 (laptop), 1440+ (desktop)
   Only ADDS overrides; does not alter desktop styles.
============================================================= */

/* Prevent horizontal scroll globally */
html, body { overflow-x: hidden; max-width: 100%; }
img, svg, video { max-width: 100%; }

/* ---------- Tablet & below (<= 1024px) ---------- */
@media (max-width: 1024px) {
  .pricing-grid { grid-template-columns: repeat(2, 1fr); }
  .price-card.featured { transform: scale(1); }
  .sol-stats-row { grid-template-columns: repeat(2, 1fr); }
}

/* ---------- Mobile & small tablet (<= 767px) ---------- */
@media (max-width: 767px) {
  /* Global tap targets */
  .btn, .btn-primary, .btn-secondary, .btn-ghost,
  .pri-deploy-btn, .faq-tab, .sol-nav-item,
  .sol-step-dot, .sol-bridge-card,
  .hc-submit, .ctc-submit {
    min-height: 44px;
  }

  /* Pricing */
  .pricing-grid { grid-template-columns: 1fr; gap: 16px; }
  .pri-deploy-toggle { width: 100%; max-width: 320px; }
  .pri-deploy-btn {
    min-width: 0;
    padding: 11px 14px;
    font-size: 0.78rem;
    gap: 6px;
  }
  .pri-deploy-btn svg { width: 14px; height: 14px; }

  /* FAQ — tabs scrollable on very small screens */
  .faq-tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    justify-content: flex-start;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: 4px;
    margin-inline: calc(-1 * clamp(1.25rem, 4vw, 2.5rem));
    padding-inline: clamp(1.25rem, 4vw, 2.5rem);
  }
  .faq-tabs::-webkit-scrollbar { display: none; }
  .faq-tab { flex-shrink: 0; }
  .faq-search-wrap { width: 100%; }
  .faq-search-wrap input { width: 100%; }

  /* Contact */
  .hc-card { grid-template-columns: 1fr; gap: 24px; padding: 28px 22px; }
  .hc-form-row { grid-template-columns: 1fr; }
  .ctc-row { grid-template-columns: 1fr; }

  /* Product / Solutions split CTAs */
  .prod-cta-split,
  .pcsplit { grid-template-columns: 1fr; gap: 32px; text-align: center; }
  .pcsplit-text { align-items: center; }
  .pcsplit-visual { max-width: 340px; margin: 0 auto; }

  /* Solutions */
  .product-grid { grid-template-columns: 1fr; gap: 36px; }
  .sol-step-panel { grid-template-columns: 1fr; gap: 24px; }
  .sol-bridge-nav {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 10px;
  }
  .sol-bridge-card { flex: 1 1 calc(50% - 6px); min-width: 0; }

  /* Solutions step bar — hide labels, keep dots */
  .sol-step-dot-label {
    font-size: 0.6rem;
    max-width: 60px;
    white-space: normal;
    text-align: center;
    line-height: 1.2;
  }

  /* Dashboard frame (home hero demo) */
  .dashboard-frame { border-radius: 16px; }
  .df-body { grid-template-columns: 1fr; }
  .df-sidebar { display: none; }
  .df-main { padding: 12px; min-height: 160px; }
  .df-bar span { font-size: 0.55rem; padding: 3px 8px; }

  /* Home why/steps/logos */
  .why-row-top { grid-template-columns: 1fr; gap: 12px; }
  .steps-wrap { overflow: hidden; }

  /* Hero */
  .hero-inner { gap: 40px; padding-block: 8px 8px; }
  .hero-stats { gap: 20px; flex-wrap: wrap; }
  .hero-actions .btn,
  .hero-actions .btn-primary,
  .hero-actions .btn-secondary { flex: 1 1 auto; justify-content: center; }

  /* Section paddings tightened */
  .section { padding-block: clamp(56px, 12vw, 80px); }

  /* Tables become scrollable */
  .comp-table-wrap,
  table {
    max-width: 100%;
    overflow-x: auto;
    display: block;
  }
}

/* ---------- Small mobile (<= 480px) ---------- */
@media (max-width: 480px) {
  .hero-h1 { font-size: clamp(2rem, 9vw, 2.6rem); }
  .section-title { font-size: clamp(1.6rem, 7vw, 2.2rem); }
  .hero-desc { font-size: 0.95rem; }
  .hero-stats { gap: 16px; }
  .stat-num { font-size: 1.4rem; }

  /* Pricing toggle stays on one row */
  .pri-deploy-btn { padding: 10px 10px; font-size: 0.72rem; }
  .pri-deploy-btn span { white-space: nowrap; }

  /* FAQ list */
  #faqList .faq-q { padding: 16px 16px; font-size: 0.86rem; }
  #faqList .faq-a { padding: 0 16px; }
  #faqList .faq-item.open > .faq-a { padding: 4px 16px 16px; }

  /* Contact card */
  .hc-card { padding: 22px 18px; border-radius: 18px; }

  /* Solutions stats */
  .sol-stats-row { grid-template-columns: 1fr; }

  /* Solutions step bar — hide labels on very small screens */
  .sol-step-dot-label { display: none; }
  .sol-step-bar { margin-bottom: 28px; }

  /* Bridge nav becomes single column */
  .sol-bridge-card { flex: 1 1 100%; }

  /* Buttons full width */
  .hero-actions { flex-direction: column; align-items: stretch; gap: 10px; }
  .hero-actions .btn,
  .hero-actions .btn-primary,
  .hero-actions .btn-secondary { width: 100%; }
}

/* ---------- Extra small (<= 360px) — safety for 320px ---------- */
@media (max-width: 360px) {
  .container { padding-inline: 16px; }
  .hero-h1 { font-size: 1.85rem; }
  .section-title { font-size: 1.45rem; }
  .pri-deploy-btn { padding: 9px 8px; font-size: 0.68rem; }
  .pri-deploy-btn svg { display: none; }
  .faq-tab { padding: 7px 14px; font-size: 0.72rem; }
}

/* ---------- Large desktop (>= 1440px) ---------- */
@media (min-width: 1440px) {
  .container { max-width: 1240px; }
}

@media (min-width: 1680px) {
  .container { max-width: 1320px; }
}

/* Focus visibility */
@media (hover: none) {
  a:focus-visible,
  button:focus-visible,
  input:focus-visible,
  textarea:focus-visible,
  select:focus-visible {
    outline: 2px solid var(--navy, #0B4F7E);
    outline-offset: 2px;
  }
}

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

/* Hamburger button — visible polish */
@media (max-width: 960px) {
  .hamburger {
    width: 40px; height: 40px;
    border-radius: 10px;
    align-items: center; justify-content: center;
    gap: 4px; padding: 0;
    background: rgba(255,255,255,.06);
    transition: background .2s;
  }
  .hamburger:hover { background: rgba(255,255,255,.12); }
  .hamburger span { width: 18px; height: 2px; }
  .nav-pill { padding: 8px 8px 8px 16px; }
  .nav-logo-img { height: 38px; }
}

/* Mobile menu refinements */
@media (max-width: 960px) {
  .mobile-menu {
    top: calc(var(--header-h) + 12px);
    max-height: calc(100vh - var(--header-h) - 32px);
    overflow-y: auto;
    padding: 12px;
  }
  .mob-link {
    font-family: 'Manrope', sans-serif;
    font-size: 0.95rem;
    padding: 12px 14px;
    min-height: 44px;
    display: flex; align-items: center;
  }
  .mob-lang-btn {
    font-family: 'Manrope', sans-serif;
    min-height: 36px;
  }
  .mob-cta {
    margin-top: 8px;
    padding: 14px 18px;
    text-align: center;
    border-radius: 10px;
    background: linear-gradient(135deg, #0B4F7E, #1a7fc2);
    color: #fff;
    font-family: 'Manrope', sans-serif;
    font-size: 0.95rem;
    font-weight: 700;
    text-decoration: none;
    transition: transform .2s, box-shadow .2s;
  }
  .mob-cta:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(11,79,126,.3); }
}

/* Lock body scroll when mobile menu open */
body.menu-open { overflow: hidden; }

/* iPhone 13 mini (375px) as reference */
@media (max-width: 480px) {
  #siteHeader { top: 14px; padding: 0 12px; }
  .nav-pill {
    padding: 7px 8px 7px 14px !important;
    border-radius: 14px;
    height: 56px;
    box-shadow: 0 6px 24px rgba(11,79,126,.22), 0 2px 6px rgba(11,79,126,.14);
  }
  .nav-logo-img { height: 34px; }
  .hamburger { width: 38px; height: 38px; border-radius: 9px; }
  .hamburger span { width: 17px; height: 2px; }
  .mobile-menu {
    top: 82px;
    left: 12px; right: 12px;
    border-radius: 14px;
    padding: 12px;
    max-height: calc(100vh - 100px);
  }
  .mob-link { font-size: 0.92rem; padding: 12px 14px; }
  .mob-cta { padding: 14px 18px; font-size: 0.95rem; }
  .mob-lang-btn { min-height: 38px; font-size: 11px; }
}

/* Very small (≤ 380px) */
@media (max-width: 380px) {
  #siteHeader { top: 10px; padding: 0 8px; }
  .nav-pill {
    padding: 5px 5px 5px 10px !important;
    height: 52px;
    gap: 6px;
  }
  .nav-logo-img { height: 28px; }
  .hamburger { width: 34px; height: 34px; border-radius: 8px; }
  .hamburger span { width: 16px; }
  .mobile-menu {
    top: 70px;
    left: 6px; right: 6px;
    padding: 10px;
    max-height: calc(100vh - 82px);
  }
  .mob-link { font-size: 0.86rem; padding: 10px; min-height: 40px; }
  .mob-divider { margin: 2px 0; }
  .mob-cta { padding: 12px 16px; font-size: 0.88rem; }
  .mob-lang-btn { font-size: 10px; min-height: 32px; padding: 5px; }
}

/* Extra small (≤ 340px) */
@media (max-width: 340px) {
  #siteHeader { top: 8px; padding: 0 6px; }
  .nav-pill { padding: 4px 4px 4px 8px !important; height: 48px; }
  .nav-logo-img { height: 24px; }
  .hamburger { width: 30px; height: 30px; border-radius: 7px; }
  .hamburger span { width: 14px; height: 1.8px; }
  .mobile-menu {
    top: 62px;
    left: 4px; right: 4px;
    padding: 8px;
    border-radius: 10px;
  }
  .mob-link { font-size: 0.82rem; padding: 9px; }
}

/* =====================================================================
   SMALL MOBILE COMPREHENSIVE OVERRIDES (iPhone 13 mini 375px & smaller)
   Targets: 320px, 360px, 375px, 414px, 480px
   ===================================================================== */

/* ---------- TABLET VERIFY (<=768px) ---------- */
@media (max-width: 768px) {
  .sol-bridge-nav,
  .sol-bridge-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .hero-stats,
  .sol-stats-row,
  .pri-hero-stats,
  .pri-stats-row { grid-template-columns: repeat(2, 1fr) !important; }
  .why-row-top { grid-template-columns: repeat(2, 1fr) !important; }
  .product-grid,
  .pricing-grid,
  .industry-grid,
  .feature-grid { grid-template-columns: repeat(2, 1fr) !important; }
}

/* ---------- SMALL MOBILE (<=480px) ---------- */
@media (max-width: 480px) {
  /* Prevent horizontal overflow globally */
  html, body {
    overflow-x: hidden !important;
    max-width: 100% !important;
  }
  * { max-width: 100%; }
  img, svg, video, iframe { max-width: 100% !important; height: auto; }

  /* Containers & sections */
  .container,
  .container-narrow,
  .container-wide {
    padding-left: 16px !important;
    padding-right: 16px !important;
    max-width: 100% !important;
  }
  section,
  .section,
  .hero,
  .page-hero,
  .solh,
  .prod-hero,
  .pri-hero,
  .faq-hero,
  .contact-hero {
    padding: clamp(24px, 6vw, 48px) 0 !important;
  }

  /* Collapse ALL multi-column grids to 1 column */
  [class*="grid"],
  .hero-inner,
  .why-row-top,
  .steps-wrap,
  .product-grid,
  .pricing-grid,
  .industry-grid,
  .feature-grid,
  .sol-bridge-nav,
  .sol-bridge-grid,
  .hero-stats,
  .sol-stats-row,
  .pri-hero-stats,
  .pri-stats-row,
  .pri-cta-stats,
  .hc-form-row,
  .ctc-row,
  .pcsplit,
  .prod-cta-split,
  .any-app,
  .any-app-grid,
  .df-grid,
  .df-cols,
  .solh-content,
  .pdw-grid,
  .pdw-cols,
  .pdw-layout,
  .mini-demo-grid,
  .faq-grid {
    grid-template-columns: 1fr !important;
    display: grid !important;
    gap: 14px !important;
  }

  /* Hero & page titles */
  .hero-title,
  .page-hero-h1,
  .solh-title,
  .pcsplit-title,
  .sol-cta-final-title,
  .pri-cta-title,
  .prod-hero-title,
  .pri-hero-title,
  .faq-hero-title,
  .contact-hero-title,
  h1 {
    font-size: clamp(1.6rem, 6.5vw, 2.2rem) !important;
    line-height: 1.15 !important;
    letter-spacing: -0.01em !important;
  }
  h2, .section-title, .sol-section-title { font-size: clamp(1.4rem, 5.5vw, 1.9rem) !important; line-height: 1.2 !important; }
  h3 { font-size: clamp(1.1rem, 4.5vw, 1.35rem) !important; }

  /* Subtitles / body text */
  .hero-subtitle,
  .page-hero-sub,
  .solh-sub,
  .pcsplit-sub,
  .pri-cta-sub,
  .prod-hero-sub,
  .pri-hero-sub,
  .faq-hero-sub,
  .contact-hero-sub,
  .section-sub,
  .lead {
    font-size: 0.95rem !important;
    line-height: 1.5 !important;
  }
  p { font-size: 0.92rem; line-height: 1.55; }

  /* Cards padding reduction */
  .price-card,
  .faq-item,
  .sol-uc-card,
  .hc-card,
  .ctc-form-card,
  .contact-page-inner,
  .pri-cta-card,
  .industry-card,
  .feature-card,
  .sol-bridge-card,
  .sol-step-panel,
  .mini-demo,
  .why-card,
  .step-card,
  .any-app-card {
    padding: 22px !important;
    border-radius: 16px !important;
  }

  /* Buttons: min 44px, full-width primaries in hero */
  .btn,
  button,
  .hc-submit,
  .pri-deploy-btn,
  .faq-tab,
  a.btn {
    min-height: 44px !important;
    font-size: 0.92rem !important;
  }
  .hero-actions,
  .solh-actions,
  .page-hero-actions,
  .pri-hero-actions,
  .prod-hero-actions,
  .pcsplit-actions,
  .pri-cta-actions,
  .sol-cta-final-actions {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
  }
  .hero-actions a,
  .hero-actions .btn,
  .solh-actions a,
  .solh-actions .btn,
  .page-hero-actions a,
  .page-hero-actions .btn,
  .pri-hero-actions a,
  .prod-hero-actions a,
  .pcsplit-actions a,
  .pri-cta-actions a,
  .sol-cta-final-actions a {
    width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
  }

  /* Mini demos (solutions pages) */
  .mini-demo,
  .mini-demo * {
    font-size: 0.75rem !important;
  }
  .mini-demo {
    padding: 14px !important;
    min-height: auto !important;
  }
  .mini-demo .md-title,
  .mini-demo h4 { font-size: 0.85rem !important; }
  .mini-demo-body,
  .mini-demo-content { padding: 10px !important; gap: 8px !important; }

  /* Interactive demo (df-*) on index */
  .df-title { font-size: 1.2rem !important; }
  .df-panel,
  .df-side,
  .df-main { padding: 14px !important; }
  .df-msg,
  .df-bubble { font-size: 0.8rem !important; padding: 8px 10px !important; }
  .df-tab { font-size: 0.75rem !important; padding: 6px 10px !important; }

  /* Product demo window (pdw-*) */
  .prod-demo-window,
  .pdw-window {
    border-radius: 14px !important;
    min-height: auto !important;
  }
  .pdw-sidebar,
  .pdw-main,
  .pdw-header { padding: 12px !important; }
  .pdw-msg,
  .pdw-bubble { font-size: 0.78rem !important; padding: 8px 10px !important; }
  .pdw-title { font-size: 0.9rem !important; }
  .pdw-sidebar-item { font-size: 0.75rem !important; padding: 6px 8px !important; }

  /* Logos marquee */
  .logos-track { gap: 24px !important; }
  .logos-track img,
  .logos-track svg { height: 22px !important; max-height: 22px !important; }

  /* Stats / metrics */
  .hero-stats,
  .sol-stats-row,
  .pri-hero-stats,
  .pri-stats-row,
  .pri-cta-stats,
  .why-row-top {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
  .stat-num,
  .sol-stat-num,
  .pri-stat-num { font-size: 1.6rem !important; }
  .stat-label,
  .sol-stat-label,
  .pri-stat-label { font-size: 0.78rem !important; }

  /* Forms */
  .hc-form-row,
  .ctc-row {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  .hc-field,
  .ctc-field,
  .hc-input,
  .hc-textarea,
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  textarea,
  select {
    width: 100% !important;
    font-size: 16px !important; /* prevent iOS zoom */
    padding: 12px 14px !important;
  }
  .hc-submit { width: 100% !important; }
  .hc-card-full { padding: 24px !important; }
  .hc-info { text-align: center !important; }

  /* Solutions step bar */
  .sol-step-bar {
    gap: 6px !important;
    padding: 8px !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }
  .sol-step-bar .dot,
  .sol-step-dot {
    width: 10px !important;
    height: 10px !important;
    min-width: 10px !important;
  }
  .sol-step-label,
  .sol-step-bar span:not(.dot) {
    font-size: 0.7rem !important;
  }

  /* Pricing specific */
  .price-tier { font-size: 1.4rem !important; }
  .price-amt { font-size: 1.3rem !important; line-height: 1.2 !important; }
  .price-card .price-features li { font-size: 0.85rem !important; }
  .pri-deploy-toggle {
    flex-wrap: wrap !important;
    gap: 6px !important;
    padding: 6px !important;
  }
  .pri-deploy-btn {
    padding: 8px 10px !important;
    font-size: 0.78rem !important;
    min-height: 40px !important;
  }
  .pri-deploy-btn svg,
  .pri-deploy-btn img {
    width: 14px !important;
    height: 14px !important;
  }

  /* FAQ page */
  .faq-tabs {
    display: flex !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    gap: 8px !important;
    padding: 4px 16px !important;
    margin: 0 -16px !important;
    scrollbar-width: none;
  }
  .faq-tabs::-webkit-scrollbar { display: none; }
  .faq-tab {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
    font-size: 0.82rem !important;
    padding: 10px 14px !important;
  }
  .faq-search-wrap { padding: 0 !important; }
  .faq-search-wrap input {
    width: 100% !important;
    font-size: 16px !important;
    padding: 12px 14px !important;
  }
  .faq-item { padding: 16px 18px !important; }
  .faq-q { font-size: 0.95rem !important; line-height: 1.35 !important; gap: 10px !important; }
  .faq-a { font-size: 0.88rem !important; }

  /* CTA cards */
  .pri-cta-card,
  .pcsplit {
    padding: 32px 22px !important;
    border-radius: 18px !important;
  }
  .pri-cta-title,
  .pcsplit-title {
    font-size: clamp(1.4rem, 5.8vw, 1.8rem) !important;
  }

  /* Industry bridge cards */
  .sol-bridge-nav,
  .sol-bridge-grid {
    grid-template-columns: 1fr !important;
  }
  .sol-bridge-card {
    width: 100% !important;
    padding: 20px !important;
  }

  /* Platform architecture / any-app */
  .any-app,
  .any-app-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  .any-app-card { padding: 16px !important; }

  /* Nav adjustments */
  .nav-inner { padding: 10px 16px !important; }
  .brand { font-size: 1rem !important; }

  /* Footer */
  footer .container,
  .footer-grid {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
    text-align: left !important;
  }

  /* Tables */
  table { font-size: 0.82rem !important; }

  /* Remove fixed widths */
  [style*="width:"] { max-width: 100% !important; }
}

/* ---------- EXTRA SMALL (<=380px) iPhone SE / mini ---------- */
@media (max-width: 380px) {
  .container,
  .container-narrow,
  .container-wide {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .hero-title,
  .page-hero-h1,
  .solh-title,
  .prod-hero-title,
  .pri-hero-title,
  h1 {
    font-size: 1.5rem !important;
  }
  h2, .section-title { font-size: 1.3rem !important; }
  h3 { font-size: 1.05rem !important; }

  .hero-subtitle,
  .page-hero-sub,
  .solh-sub,
  .section-sub { font-size: 0.88rem !important; }

  /* Stat labels very small */
  .stat-label,
  .sol-stat-label,
  .pri-stat-label { font-size: 0.7rem !important; }
  .stat-num,
  .sol-stat-num,
  .pri-stat-num { font-size: 1.4rem !important; }

  /* Mini demos even smaller */
  .mini-demo { min-height: auto !important; padding: 12px !important; }
  .mini-demo,
  .mini-demo * { font-size: 0.7rem !important; }
  .prod-demo-window,
  .pdw-window { min-height: auto !important; }
  .pdw-msg,
  .pdw-bubble,
  .df-msg,
  .df-bubble { font-size: 0.74rem !important; }

  /* Cards tighter */
  .price-card,
  .faq-item,
  .sol-uc-card,
  .hc-card,
  .pri-cta-card,
  .industry-card,
  .feature-card,
  .sol-bridge-card { padding: 18px !important; }

  .pri-cta-card,
  .pcsplit { padding: 26px 18px !important; }
  .pri-cta-title,
  .pcsplit-title { font-size: 1.3rem !important; }

  .price-tier { font-size: 1.25rem !important; }
  .price-amt { font-size: 1.15rem !important; }

  .pri-deploy-btn {
    padding: 7px 8px !important;
    font-size: 0.72rem !important;
  }

  .faq-tab { font-size: 0.76rem !important; padding: 9px 12px !important; }

  /* Hide non-essential step labels if needed */
  .sol-step-label { display: none !important; }

  .btn, button, a.btn { font-size: 0.88rem !important; padding: 10px 14px !important; }
}


/* ══════════════════════════════════════════════════════════════════
   PRODUCT PAGE — RESPONSIVE REFINEMENTS
══════════════════════════════════════════════════════════════════ */

@media (max-width: 768px) {
  /* Hero demo window (ChatGPT mockup) — scale content */
  .prod-demo { padding: 0 0 32px !important; }
  .prod-demo-window { border-radius: 14px !important; }
  .pdw-bar { padding: 8px 12px !important; height: auto !important; }
  .pdw-url span { font-size: 0.7rem !important; }
  .pdw-pribait-logo { width: 52px !important; }

  .pdw-app { grid-template-columns: 1fr !important; }
  .pdw-side { display: none !important; }
  .pdw-chat { padding: 16px 14px !important; }
  .pdw-chat-head { font-size: 0.78rem !important; padding-bottom: 12px !important; margin-bottom: 12px !important; }
  .pdw-chat-body { gap: 10px !important; }
  .pdw-bubble, .pdw-bubble-user { font-size: 0.8rem !important; padding: 10px 14px !important; border-radius: 14px !important; }
  .pdw-msg-bot .pdw-avatar { width: 24px !important; height: 24px !important; }

  /* File upload chip */
  .pdw-input-wrap { padding: 8px 10px !important; }
  .pdw-input { padding: 8px 10px !important; border-radius: 12px !important; }
  .pdw-file { padding: 6px 8px !important; }
  .pdw-file-name { font-size: 0.7rem !important; }
  .pdw-file-meta { font-size: 0.62rem !important; }
  .pdw-file-icon { width: 28px !important; height: 28px !important; }
  .pdw-send { width: 28px !important; height: 28px !important; }

  /* Pribait alert popup */
  .pdw-alert { padding: 10px 14px !important; border-radius: 10px !important; }
  .pdw-alert-title { font-size: 0.76rem !important; }
  .pdw-alert-sub { font-size: 0.65rem !important; }

  /* DLP / DSPM / Anti-Phishing sections */
  .product-grid { grid-template-columns: 1fr !important; gap: 32px !important; }
  .product-grid-reverse > *:first-child { order: 0 !important; }
  .product-grid-reverse > *:last-child { order: 1 !important; }
  .pf-headline { font-size: clamp(1.5rem, 5vw, 2rem) !important; }
  .pf-lead { font-size: 0.92rem !important; }
  .pf-highlights { gap: 8px !important; }
  .pf-hi { font-size: 0.82rem !important; padding: 10px 0 !important; }

  /* Mini demos */
  .mini-demo { border-radius: 12px !important; }
  .md-bar { padding: 8px 12px !important; }
  .md-app { font-size: 0.7rem !important; }
  .md-drive, .md-scan, .md-phish-open { padding: 14px !important; min-height: 240px !important; }
  .md-drive-title, .md-scan-title { font-size: 0.76rem !important; }
  .md-upload { padding: 8px 10px !important; gap: 8px !important; }
  .md-upload-name { font-size: 0.72rem !important; }
  .md-upload-meta { font-size: 0.6rem !important; }
  .md-upload-icon { width: 28px !important; height: 28px !important; }
  .md-file { padding: 6px 10px !important; gap: 8px !important; }
  .md-file-name { font-size: 0.66rem !important; }
  .md-file-tag { font-size: 0.52rem !important; padding: 2px 6px !important; }
  .md-toast { right: 10px !important; bottom: 10px !important; max-width: calc(100% - 20px) !important; padding: 10px 12px !important; }
  .md-toast-title { font-size: 0.74rem !important; }
  .md-toast-sub { font-size: 0.62rem !important; }

  /* Phishing demo */
  .md-po-header { padding: 10px 14px !important; gap: 8px !important; }
  .md-po-from { font-size: 0.72rem !important; }
  .md-po-to { font-size: 0.62rem !important; }
  .md-po-time { font-size: 0.6rem !important; }
  .md-po-body { padding: 12px 14px !important; font-size: 0.76rem !important; }
  .md-po-subj { font-size: 0.82rem !important; }
  .md-po-link { font-size: 0.68rem !important; padding: 6px 8px !important; }
  .md-po-block-inner { font-size: 0.78rem !important; padding: 12px !important; }

  /* Universal Protection marquees */
  .any-app { padding: 48px 0 !important; }
  .aa-marquees { gap: 14px !important; }
  .aa-marquee { padding: 6px 0 !important; }
  .aa-track { gap: 14px !important; }
  .aa-logo { width: 48px !important; height: 48px !important; padding: 10px !important; }
  .aa-logo img { width: 26px !important; height: 26px !important; }
  .aa-footnote { font-size: 0.82rem !important; margin-top: 24px !important; padding: 0 20px !important; }

  /* Platform architecture (semicircle) */
  .plat-arch { max-width: 100% !important; padding: 0 !important; }
  .plat-svg { width: 100% !important; height: auto !important; }
  .plat-title { font-size: clamp(1.4rem, 5vw, 2rem) !important; }
  .plat-core-logo img { width: 48px !important; }
  .pl-ring-label { font-size: 11px !important; }
  .pl-ring-sub { font-size: 9px !important; }
  .plat-bottom { flex-direction: column !important; gap: 16px !important; align-items: center !important; }
  .plat-bar { font-size: 0.78rem !important; padding: 10px 20px !important; text-align: center !important; }
  .plat-pills { justify-content: center !important; gap: 6px !important; }
  .plat-pill { font-size: 0.7rem !important; padding: 5px 10px !important; }

  /* Product CTA split */
  .prod-cta-split { padding: 48px 0 !important; }
  .pcsplit { grid-template-columns: 1fr !important; gap: 40px !important; text-align: center !important; }
  .pcsplit-text { max-width: 100% !important; }
  .pcsplit-title { font-size: clamp(1.6rem, 5vw, 2.4rem) !important; }
  .pcsplit-sub { font-size: 0.9rem !important; margin-inline: auto !important; }
  .pcsplit-btn { margin-inline: auto !important; }
  .pcsplit-visual { min-height: 280px !important; max-width: 340px !important; margin: 0 auto !important; }
  .pcsplit-card { font-size: 0.7rem !important; padding: 8px 12px !important; }
  .pcsplit-card strong { font-size: 0.7rem !important; }
  .pcsplit-card span { font-size: 0.58rem !important; }
}

@media (max-width: 480px) {
  .prod-demo-window { max-width: calc(100% - 16px) !important; margin: 0 auto !important; }
  .pdw-bar { padding: 7px 10px !important; gap: 8px !important; }
  .pdw-url { font-size: 0.65rem !important; padding: 3px 10px !important; }
  .pdw-dots { display: none !important; }
  .pdw-pribait-logo { width: 44px !important; }
  .pdw-chat { padding: 12px 10px !important; min-height: 240px !important; }
  .pdw-bubble, .pdw-bubble-user { font-size: 0.74rem !important; padding: 8px 12px !important; max-width: 88% !important; }
  .pdw-file-name { font-size: 0.66rem !important; }
  .pdw-file-meta { font-size: 0.58rem !important; }

  /* Mini demos on very small */
  .md-drive, .md-scan, .md-phish-open { padding: 12px !important; min-height: 200px !important; }
  .md-file-name { font-size: 0.62rem !important; }
  .md-upload-name { font-size: 0.68rem !important; }

  /* Universal Protection — reduce logo count visual */
  .aa-logo { width: 42px !important; height: 42px !important; padding: 8px !important; }
  .aa-logo img { width: 22px !important; height: 22px !important; }
  .aa-track { gap: 10px !important; }

  /* Platform arch pills wrap better */
  .plat-pill { font-size: 0.65rem !important; padding: 4px 9px !important; }

  /* CTA floating cards */
  .pcsplit-visual { min-height: 260px !important; max-width: 300px !important; }
  .pcsplit-card { padding: 6px 10px !important; gap: 6px !important; }
  .pcsplit-card-icon { width: 24px !important; height: 24px !important; }
  .pcsplit-hub-inner { width: 48px !important; height: 48px !important; }
  .pcsplit-hub-logo { width: 40px !important; }
}

@media (max-width: 380px) {
  .pdw-url span { font-size: 0.62rem !important; }
  .pdw-chat-ver { font-size: 0.62rem !important; }
  .pdw-chat-head svg { width: 16px !important; height: 16px !important; }
  .pdw-bubble, .pdw-bubble-user { font-size: 0.7rem !important; }
  .plat-core-logo img { width: 40px !important; }
  .aa-logo { width: 38px !important; height: 38px !important; }
  .aa-logo img { width: 20px !important; height: 20px !important; }
}

/* ══════════════════════════════════════════════════════════════════
   PRODUCT 3 SECTIONS (DLP/DSPM/Anti-Phishing) — extra polish
════════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  #dlp, #dspm, #antiphishing { padding: 48px 0 !important; }
  #dlp .container, #dspm .container, #antiphishing .container { padding-inline: 16px !important; }
  #dlp .product-grid,
  #dspm .product-grid,
  #antiphishing .product-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 28px !important;
    width: 100% !important;
  }
  /* Force text-first order on reverse */
  #dspm .product-grid > .gs-left { order: 2 !important; }
  #dspm .product-grid > .prod-feature-text { order: 1 !important; }

  .prod-feature-text { width: 100% !important; max-width: 100% !important; }
  .pf-tag {
    font-size: 0.64rem !important;
    padding: 5px 12px !important;
    margin-bottom: 14px !important;
    white-space: nowrap !important;
  }
  .pf-headline {
    font-size: clamp(1.4rem, 6vw, 1.9rem) !important;
    line-height: 1.2 !important;
    margin-bottom: 14px !important;
  }
  .pf-lead {
    font-size: 0.92rem !important;
    line-height: 1.7 !important;
    max-width: 100% !important;
    margin-bottom: 20px !important;
  }
  .pf-highlights { gap: 0 !important; }
  .pf-hi {
    font-size: 0.82rem !important;
    padding: 10px 0 !important;
    gap: 10px !important;
  }
  .pf-hi-icon {
    width: 26px !important;
    height: 26px !important;
    flex-shrink: 0 !important;
  }
  .pf-hi-icon svg { width: 12px !important; height: 12px !important; }

  /* Mini demo containers */
  #dlp .mini-demo,
  #dspm .mini-demo,
  #antiphishing .mini-demo {
    width: 100% !important;
    max-width: 100% !important;
    min-height: auto !important;
  }
  #dlp .gs-right, #dspm .gs-left, #antiphishing .gs-right {
    width: 100% !important;
    max-width: 100% !important;
  }
}

@media (max-width: 480px) {
  #dlp, #dspm, #antiphishing { padding: 36px 0 !important; }
  .pf-headline { font-size: clamp(1.3rem, 7vw, 1.7rem) !important; }
  .pf-lead { font-size: 0.88rem !important; }
  .pf-hi { font-size: 0.78rem !important; padding: 8px 0 !important; }
  .pf-tag { font-size: 0.6rem !important; letter-spacing: .12em !important; }
  /* Mini demo inner content compact */
  #dlp .md-drive, #dspm .md-scan, #antiphishing .md-phish-open {
    padding: 12px !important;
    min-height: 220px !important;
  }
  #dlp .md-upload-name, #dspm .md-file-name { font-size: 0.66rem !important; }
  #dlp .md-upload-meta { font-size: 0.58rem !important; }
  #dspm .md-scan-title, #antiphishing .md-phish-open .md-po-subj { font-size: 0.78rem !important; }
  #dspm .md-scan-counter { font-size: 0.62rem !important; }
  /* Phishing email inside */
  .md-po-body p { font-size: 0.74rem !important; line-height: 1.5 !important; }
  .md-po-link { font-size: 0.66rem !important; }
}

/* ══════════════════════════════════════════════════════════════════
   FIXED-HEADER OFFSET FIXES
════════════════════════════════════════════════════════════════════ */
:target, section[id], [id] { scroll-margin-top: 110px; }

@media (max-width: 768px) {
  section[id], [id] { scroll-margin-top: 92px; }
  #home-hero { padding-top: calc(var(--header-h) + 16px) !important; }
  .page-hero { padding-top: calc(var(--header-h) + 20px) !important; }
  .solh { padding-top: calc(var(--header-h) + 20px) !important; }
  .contact-page, .contact-page-inner { padding-top: calc(var(--header-h) + 20px) !important; }
  .faq-page { padding-top: calc(var(--header-h) + 24px) !important; }
}
@media (max-width: 480px) {
  section[id], [id] { scroll-margin-top: 88px; }
  #home-hero { padding-top: calc(var(--header-h) + 12px) !important; min-height: auto !important; }
  .page-hero { padding-top: calc(var(--header-h) + 16px) !important; padding-bottom: 32px !important; }
  .solh { padding-top: calc(var(--header-h) + 16px) !important; }
  .contact-page, .contact-page-inner { padding-top: calc(var(--header-h) + 16px) !important; }
}
@media (max-width: 380px) {
  section[id], [id] { scroll-margin-top: 82px; }
  #home-hero, .page-hero, .solh, .contact-page, .contact-page-inner {
    padding-top: calc(var(--header-h) + 10px) !important;
  }
}

/* ══════════════════════════════════════════════════════════════════
   EDGE OVERFLOW FIX — TEXT NOT CUT AT SCREEN BORDERS
════════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  /* Force safe container padding */
  body .container { padding-left: 20px !important; padding-right: 20px !important; }

  /* Product feature text must respect container */
  .prod-feature-text,
  .prod-feature-text * {
    max-width: 100% !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
  }
  .pf-headline, .pf-lead, .pf-hi { padding-left: 0 !important; padding-right: 0 !important; }

  /* Highlights items — icon + text row must wrap inside */
  .pf-hi {
    flex-wrap: nowrap !important;
    word-break: normal !important;
    white-space: normal !important;
  }
  .pf-hi > *:not(.pf-hi-icon) { min-width: 0 !important; flex: 1 1 auto !important; }

  /* Mini demos must not exceed viewport */
  .mini-demo { max-width: 100% !important; }
  .md-drive-body, .md-scan-list, .md-phish-open { overflow: hidden !important; }

  /* Block any horizontal overflow at section level */
  section, .section { overflow-x: hidden !important; }
}

@media (max-width: 480px) {
  body .container { padding-left: 16px !important; padding-right: 16px !important; }
  /* Filenames in demos wrap properly */
  .md-upload-name, .md-file-name, .sol-wa-file-name, .sol-zip-file-name {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-width: 180px !important;
  }
}

/* PRODUCT PAGE CLEAN MOBILE RESET */
@media (max-width: 768px) {
  img, svg, video, canvas { max-width: 100% !important; height: auto !important; }
  .plat-svg, .pcsplit-lines { width: 100% !important; height: auto !important; }

  .page-hero { padding-top: calc(var(--header-h) + 20px) !important; padding-bottom: 40px !important; }
  .page-hero-h1 { font-size: clamp(1.6rem, 7vw, 2.2rem) !important; line-height: 1.2 !important; }
  .page-hero-sub { font-size: 0.92rem !important; line-height: 1.65 !important; }
  .page-hero-actions { flex-direction: column !important; gap: 10px !important; align-items: stretch !important; }
  .page-hero-actions .btn { width: 100% !important; justify-content: center !important; }

  .prod-demo { padding: 16px 0 40px !important; }
  .prod-demo .container { padding-inline: 16px !important; }
  .prod-demo-window { border-radius: 12px !important; box-shadow: 0 8px 24px rgba(11,79,126,.12) !important; }
  .prod-demo-window::before { display: none !important; }
  .pdw-app { display: block !important; }
  .pdw-side { display: none !important; }
  .pdw-chat { padding: 14px !important; min-height: 280px !important; }
  .pdw-bubble, .pdw-bubble-user { font-size: 0.78rem !important; line-height: 1.5 !important; padding: 9px 13px !important; max-width: 85% !important; }
  .pdw-input { padding: 8px 10px !important; border-radius: 10px !important; flex-wrap: wrap !important; gap: 6px !important; }
  .pdw-file { padding: 6px 8px !important; width: 100% !important; margin: 4px 0 !important; }
  .pdw-file-name { font-size: 0.68rem !important; }
  .pdw-file-meta { font-size: 0.58rem !important; }
  .pdw-send { width: 28px !important; height: 28px !important; }
  .pdw-alert { position: relative !important; right: auto !important; bottom: auto !important; margin: 12px auto 0 !important; max-width: 94% !important; padding: 10px 12px !important; }
  .pdw-alert-title { font-size: 0.76rem !important; }
  .pdw-alert-sub { font-size: 0.64rem !important; }

  #dlp, #dspm, #antiphishing { padding: 40px 0 !important; }
  #dlp > .container, #dspm > .container, #antiphishing > .container { padding-left: 18px !important; padding-right: 18px !important; }
  #dlp .product-grid, #antiphishing .product-grid { display: block !important; }
  #dlp .prod-feature-text, #antiphishing .prod-feature-text { margin-bottom: 28px !important; }
  #dspm .product-grid { display: flex !important; flex-direction: column !important; gap: 0 !important; }
  #dspm .product-grid > .gs-left { order: 2 !important; }
  #dspm .product-grid > .prod-feature-text { order: 1 !important; margin-bottom: 28px !important; }

  .prod-feature-text * { max-width: 100% !important; }
  .pf-tag { font-size: 0.65rem !important; padding: 5px 12px !important; margin-bottom: 12px !important; }
  .pf-headline { font-size: clamp(1.3rem, 6vw, 1.8rem) !important; margin-bottom: 12px !important; line-height: 1.2 !important; }
  .pf-lead { font-size: 0.9rem !important; margin-bottom: 18px !important; line-height: 1.65 !important; }
  .pf-hi { font-size: 0.82rem !important; padding: 10px 0 !important; gap: 10px !important; border-bottom: 1px solid rgba(11,79,126,.08) !important; }
  .pf-hi:last-child { border-bottom: none !important; }
  .pf-hi:hover { padding-left: 0 !important; }
  .pf-hi-icon { width: 24px !important; height: 24px !important; }
  .pf-hi-icon svg { width: 11px !important; height: 11px !important; }

  .mini-demo { width: 100% !important; max-width: 100% !important; border-radius: 12px !important; }
  .md-bar { padding: 8px 12px !important; gap: 8px !important; }
  .md-app { font-size: 0.7rem !important; }
  .md-drive, .md-scan { padding: 12px !important; min-height: 220px !important; }
  .md-drive-title { font-size: 0.76rem !important; }
  .md-drive-acct { font-size: 0.62rem !important; }
  .md-upload { padding: 8px 10px !important; gap: 8px !important; }
  .md-upload-icon { width: 28px !important; height: 28px !important; }
  .md-upload-info { min-width: 0 !important; flex: 1 !important; }
  .md-upload-name { font-size: 0.68rem !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
  .md-upload-meta { font-size: 0.58rem !important; }
  .md-file { padding: 6px 10px !important; gap: 8px !important; }
  .md-file-name { font-size: 0.66rem !important; min-width: 0 !important; flex: 1 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
  .md-file-tag { font-size: 0.5rem !important; padding: 2px 6px !important; }
  .md-scan-title { font-size: 0.74rem !important; }
  .md-scan-counter { font-size: 0.6rem !important; }
  .md-toast { max-width: calc(100% - 20px) !important; padding: 8px 10px !important; gap: 8px !important; }

  .md-po-header { padding: 10px 12px !important; }
  .md-po-from { font-size: 0.68rem !important; }
  .md-po-to, .md-po-time { font-size: 0.58rem !important; }
  .md-po-body { padding: 10px 12px !important; font-size: 0.7rem !important; line-height: 1.5 !important; }
  .md-po-subj { font-size: 0.8rem !important; margin-bottom: 6px !important; }
  .md-po-link { font-size: 0.62rem !important; padding: 5px 7px !important; word-break: break-all !important; }

  .any-app { padding: 40px 0 !important; }
  .any-app .container { padding-inline: 16px !important; }
  .aa-logo { width: 44px !important; height: 44px !important; padding: 8px !important; }
  .aa-logo img { width: 24px !important; height: 24px !important; }
  .aa-track { gap: 12px !important; }
  .aa-footnote { font-size: 0.8rem !important; padding: 0 20px !important; }

  #platform-overview { padding: 40px 0 !important; }
  .plat-title { font-size: clamp(1.3rem, 5.5vw, 1.8rem) !important; line-height: 1.25 !important; }
  .plat-arch { max-width: 100% !important; margin-bottom: 20px !important; }
  .plat-core-logo img { width: 40px !important; }
  .plat-bottom { flex-direction: column !important; align-items: center !important; gap: 14px !important; }
  .plat-bar { font-size: 0.74rem !important; padding: 8px 16px !important; }
  .plat-pills { flex-wrap: wrap !important; justify-content: center !important; gap: 6px !important; }
  .plat-pill { font-size: 0.65rem !important; padding: 4px 10px !important; }

  .prod-cta-split { padding: 40px 0 !important; }
  .pcsplit { display: block !important; text-align: center !important; }
  .pcsplit-text { max-width: 100% !important; margin-bottom: 28px !important; }
  .pcsplit-title { font-size: clamp(1.5rem, 6vw, 2rem) !important; line-height: 1.2 !important; }
  .pcsplit-sub { font-size: 0.9rem !important; margin-inline: auto !important; max-width: 100% !important; }
  .pcsplit-btn { display: inline-flex !important; margin: 20px auto 0 !important; }
  .pcsplit-visual { max-width: 320px !important; margin: 0 auto !important; min-height: 280px !important; }
}

@media (max-width: 380px) {
  body .container { padding-left: 14px !important; padding-right: 14px !important; }
  .page-hero-h1 { font-size: 1.5rem !important; }
  .pf-headline { font-size: 1.25rem !important; }
  .pf-lead, .page-hero-sub { font-size: 0.86rem !important; }
  .pf-hi { font-size: 0.78rem !important; }
  .pdw-bubble, .pdw-bubble-user { font-size: 0.72rem !important; }
  .aa-logo { width: 38px !important; height: 38px !important; }
  .aa-logo img { width: 20px !important; height: 20px !important; }
  .plat-pill { font-size: 0.6rem !important; padding: 3px 8px !important; }
}

/* HEADER LOGO FIX — overrides aggressive img height:auto */
@media (max-width: 960px) {
  .nav-logo-img { height: 38px !important; width: auto !important; }
  .pdw-pribait-logo { height: auto !important; }
  .md-toast-p { height: auto !important; }
}
@media (max-width: 480px) {
  .nav-logo-img { height: 34px !important; width: auto !important; }
}
@media (max-width: 380px) {
  .nav-logo-img { height: 28px !important; width: auto !important; }
}
@media (max-width: 340px) {
  .nav-logo-img { height: 24px !important; width: auto !important; }
}

/* Prevent horizontal overflow from animations on mobile */
@media (max-width: 768px) {
  .gs-left, .gs-right { transform: none !important; }
  .product-grid > *, .pcsplit > * { max-width: 100% !important; overflow: hidden !important; }
  body, html { overflow-x: hidden !important; }
  .prod-feature-text, .mini-demo, .gs-left, .gs-right { transform: translateX(0) !important; }
}

/* ══════════════════════════════════════════════════════════════════
   FOOTER RESPONSIVE
════════════════════════════════════════════════════════════════════ */
@media (max-width: 960px) {
  .footer-grid { grid-template-columns: 1fr 1fr !important; gap: 32px !important; padding: 48px 24px 32px !important; }
}
@media (max-width: 640px) {
  #site-footer { padding: 0 !important; }
  .footer-grid {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
    padding: 36px 20px 24px !important;
    text-align: center !important;
  }
  .footer-grid > div:first-child { text-align: center !important; }
  .footer-logo-link { display: inline-block !important; margin: 0 auto !important; }
  .footer-logo-img { height: 48px !important; margin: 0 auto !important; }
  .footer-brand-desc { max-width: 320px !important; margin: 12px auto 16px !important; font-size: 0.86rem !important; }
  .footer-socials { justify-content: center !important; }
  .footer-col h4 { font-size: 0.84rem !important; margin-bottom: 12px !important; }
  .footer-col ul { gap: 8px !important; }
  .footer-col li a { font-size: 0.86rem !important; }
  .footer-bottom {
    flex-direction: column !important;
    gap: 14px !important;
    padding: 20px !important;
    text-align: center !important;
  }
  .footer-links { justify-content: center !important; flex-wrap: wrap !important; gap: 14px !important; }
  .footer-links a { font-size: 0.78rem !important; }
}
@media (max-width: 380px) {
  .footer-grid { padding: 28px 16px 20px !important; gap: 22px !important; }
  .footer-logo-img { height: 42px !important; }
  .footer-brand-desc { font-size: 0.82rem !important; }
  .footer-col li a { font-size: 0.82rem !important; }
}

/* ══════════════════════════════════════════════════════════════════
   PRODUCT HERO DEMO (ChatGPT) — better mobile rendering
════════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  .prod-demo-window { margin: 0 auto !important; max-width: calc(100vw - 32px) !important; }
  .pdw-bar { padding: 6px 10px !important; gap: 6px !important; }
  .pdw-dots { display: none !important; }
  .pdw-url { font-size: 0.65rem !important; padding: 3px 8px !important; gap: 4px !important; }
  .pdw-url svg { width: 9px !important; height: 9px !important; }
  .pdw-pribait { padding: 3px 8px !important; gap: 5px !important; }
  .pdw-pribait-logo { height: auto !important; max-height: 14px !important; width: auto !important; }
  .pdw-pribait-dot { width: 5px !important; height: 5px !important; }

  .pdw-app { grid-template-columns: 1fr !important; }
  .pdw-side { display: none !important; }
  .pdw-chat { padding: 12px !important; min-height: 240px !important; }
  .pdw-chat-head { gap: 6px !important; padding-bottom: 8px !important; margin-bottom: 8px !important; font-size: 0.74rem !important; }
  .pdw-logo svg { width: 16px !important; height: 16px !important; }
  .pdw-chat-body { gap: 8px !important; }
  .pdw-msg { gap: 6px !important; }
  .pdw-avatar { width: 22px !important; height: 22px !important; }
  .pdw-avatar svg { width: 10px !important; height: 10px !important; }
  .pdw-bubble, .pdw-bubble-user {
    font-size: 0.74rem !important;
    line-height: 1.45 !important;
    padding: 8px 11px !important;
    max-width: 88% !important;
    border-radius: 12px !important;
  }
  .pdw-input-wrap { padding-top: 10px !important; }
  .pdw-input { padding: 7px 9px !important; gap: 6px !important; flex-wrap: nowrap !important; align-items: center !important; }
  .pdw-input-icons { gap: 5px !important; flex-shrink: 0 !important; }
  .pdw-input-icons svg { width: 13px !important; height: 13px !important; }
  .pdw-input-text { flex: 1 !important; min-width: 0 !important; overflow: hidden !important; }
  .pdw-file {
    padding: 5px 7px !important;
    gap: 6px !important;
    border-radius: 8px !important;
    max-width: 100% !important;
  }
  .pdw-file-icon { width: 24px !important; height: 24px !important; flex-shrink: 0 !important; }
  .pdw-file-icon svg { width: 14px !important; height: 14px !important; }
  .pdw-file-info { min-width: 0 !important; flex: 1 !important; }
  .pdw-file-name {
    font-size: 0.62rem !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  .pdw-file-meta { font-size: 0.54rem !important; }
  .pdw-file-progress { width: 100% !important; }
  .pdw-input-actions { gap: 5px !important; flex-shrink: 0 !important; }
  .pdw-input-actions svg { width: 13px !important; height: 13px !important; }
  .pdw-send { width: 26px !important; height: 26px !important; }
  .pdw-send svg { width: 11px !important; height: 11px !important; }

  /* Pribait alert popup positioning */
  .pdw-alert {
    position: relative !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    margin: 10px auto 0 !important;
    max-width: 100% !important;
    padding: 9px 12px !important;
    gap: 8px !important;
  }
  .pdw-alert-icon { width: 28px !important; height: 28px !important; flex-shrink: 0 !important; }
  .pdw-alert-icon svg, .pdw-alert-icon img { width: 16px !important; height: auto !important; }
  .pdw-alert-title { font-size: 0.72rem !important; }
  .pdw-alert-sub { font-size: 0.6rem !important; }
}

@media (max-width: 480px) {
  .prod-demo-window { max-width: calc(100vw - 24px) !important; border-radius: 12px !important; }
  .prod-demo-window::before { display: none !important; }
  .pdw-bar { padding: 5px 8px !important; }
  .pdw-url { font-size: 0.6rem !important; padding: 2px 6px !important; }
  .pdw-url span { max-width: 90px !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; display: inline-block !important; }
  .pdw-pribait-logo { max-height: 12px !important; }
  .pdw-chat { padding: 10px !important; min-height: 220px !important; }
  .pdw-bubble, .pdw-bubble-user { font-size: 0.7rem !important; padding: 7px 10px !important; max-width: 90% !important; }
  .pdw-file-name { font-size: 0.58rem !important; }
  .pdw-file-meta { font-size: 0.5rem !important; }
}

@media (max-width: 380px) {
  .pdw-url span { max-width: 70px !important; }
  .pdw-bubble, .pdw-bubble-user { font-size: 0.66rem !important; }
  .pdw-pribait { padding: 2px 6px !important; }
  .pdw-pribait-logo { max-height: 10px !important; }
}

/* ══════════════════════════════════════════════════════════════════
   HERO ACTIONS BUTTONS (Home + Product) — mobile polish
════════════════════════════════════════════════════════════════════ */
@media (max-width: 640px) {
  .hero-actions, .page-hero-actions {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 360px !important;
    margin: 0 auto !important;
  }
  .hero-actions .btn, .page-hero-actions .btn {
    width: 100% !important;
    justify-content: center !important;
    padding: 14px 22px !important;
    font-size: 0.95rem !important;
    min-height: 48px !important;
    border-radius: 12px !important;
    gap: 8px !important;
  }
}
@media (max-width: 380px) {
  .hero-actions, .page-hero-actions { max-width: 100% !important; gap: 8px !important; }
  .hero-actions .btn, .page-hero-actions .btn {
    padding: 12px 18px !important;
    font-size: 0.88rem !important;
    min-height: 44px !important;
  }
}

/* ══════════════════════════════════════════════════════════════════
   UNIVERSAL PROTECTION LOGOS MARQUEE (Product) — fully responsive
════════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  .any-app { padding: 36px 0 !important; }
  .any-app .container { padding-inline: 0 !important; }
  .any-app .prod-feature-text { padding: 0 20px !important; max-width: 100% !important; }
  .aa-marquees {
    gap: 12px !important;
    margin: 24px 0 !important;
    width: 100vw !important;
    overflow: hidden !important;
  }
  .aa-marquee { padding: 4px 0 !important; }
  .aa-marquees::before, .aa-marquees::after { width: 40px !important; }
  .aa-track { gap: 10px !important; }
  .aa-logo {
    width: 44px !important;
    height: 44px !important;
    padding: 8px !important;
    border-radius: 12px !important;
  }
  .aa-logo img { width: 24px !important; height: 24px !important; }
  .aa-footnote {
    font-size: 0.78rem !important;
    margin-top: 18px !important;
    padding: 0 24px !important;
  }
}
@media (max-width: 480px) {
  .aa-marquees { gap: 9px !important; margin: 20px 0 !important; }
  .aa-logo {
    width: 38px !important;
    height: 38px !important;
    padding: 7px !important;
    border-radius: 10px !important;
  }
  .aa-logo img { width: 20px !important; height: 20px !important; }
  .aa-track { gap: 8px !important; }
}
@media (max-width: 380px) {
  .aa-logo { width: 34px !important; height: 34px !important; padding: 6px !important; }
  .aa-logo img { width: 18px !important; height: 18px !important; }
  .aa-track { gap: 6px !important; }
}

/* ══════════════════════════════════════════════════════════════════
   PRICING PAGE — AESTHETIC POLISH
════════════════════════════════════════════════════════════════════ */

/* Cards — premium feel with subtle depth */
.pricing-grid .price-card {
  position: relative;
  background: #fff;
  border: 1px solid rgba(11,79,126,.08);
  border-radius: 20px;
  padding: 36px 28px;
  transition: transform .35s cubic-bezier(.4, 0, .2, 1), box-shadow .35s, border-color .35s;
}

.pricing-grid .price-card::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(185,228,255,.06) 0%, transparent 35%);
  pointer-events: none;
  opacity: 0;
  transition: opacity .35s;
}

.pricing-grid .price-card:hover::after { opacity: 1; }

.pricing-grid .price-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 40px rgba(11,79,126,.08);
  border-color: rgba(11,79,126,.18);
}

/* Featured card — premium presence */
.pricing-grid .price-card.featured {
  background: linear-gradient(180deg, #fff 0%, rgba(185,228,255,.08) 100%);
  border: 1.5px solid var(--navy);
  box-shadow: 0 20px 60px rgba(11,79,126,.15), 0 4px 12px rgba(11,79,126,.06);
}

.pricing-grid .price-card.featured::before {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(11,79,126,.4), rgba(185,228,255,.6), rgba(11,79,126,.4));
  z-index: -1;
  opacity: .35;
  filter: blur(8px);
}

.pricing-grid .price-card.featured:hover {
  transform: translateY(-8px);
  box-shadow: 0 28px 70px rgba(11,79,126,.18), 0 6px 16px rgba(11,79,126,.08);
}

/* Tier name — refined typography */
.price-tier {
  font-family: 'Manrope', sans-serif !important;
  font-size: 1.5rem !important;
  letter-spacing: -0.02em !important;
  color: var(--text) !important;
  font-weight: 800 !important;
  line-height: 1.1 !important;
  margin-bottom: 8px !important;
}

/* Users pill — refined */
.price-users {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  font-family: 'Manrope', sans-serif !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  color: var(--navy) !important;
  background: var(--sky-light) !important;
  border: none !important;
  padding: 5px 13px !important;
  border-radius: 100px !important;
  margin-bottom: 18px !important;
}
.price-users::before {
  content: '' !important;
  width: 5px !important; height: 5px !important;
  border-radius: 50% !important;
  background: var(--navy) !important;
  flex-shrink: 0 !important;
}

/* Most popular badge — premium */
.price-popular {
  position: absolute !important;
  top: -14px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  background: linear-gradient(135deg, #0B4F7E, #1a7fc2) !important;
  color: #fff !important;
  font-family: 'Manrope', sans-serif !important;
  font-size: 0.66rem !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  padding: 6px 16px !important;
  border-radius: 100px !important;
  white-space: nowrap !important;
  box-shadow: 0 6px 18px rgba(11,79,126,.35), 0 2px 6px rgba(11,79,126,.2) !important;
}

/* Description */
.price-desc {
  font-size: 0.88rem !important;
  color: var(--text-muted) !important;
  line-height: 1.65 !important;
  margin: 6px 0 24px !important;
  min-height: 50px !important;
}

/* Divider — subtle */
.price-divider {
  height: 1px !important;
  background: linear-gradient(90deg, transparent, rgba(11,79,126,.12), transparent) !important;
  margin: 0 0 20px !important;
}

/* Features list — refined */
.price-feats { gap: 12px !important; margin-bottom: 28px !important; flex: 1 !important; }
.price-feat {
  font-family: 'Manrope', sans-serif !important;
  font-size: 0.86rem !important;
  color: var(--text) !important;
  line-height: 1.5 !important;
  align-items: flex-start !important;
  gap: 10px !important;
}

.pf-ck {
  width: 18px !important; height: 18px !important;
  background: var(--sky-light) !important;
  border-radius: 6px !important;
  flex-shrink: 0 !important;
  margin-top: 1px !important;
}
.pf-ck svg { color: var(--navy) !important; width: 10px !important; height: 10px !important; }

/* Featured card check icons stand out */
.pricing-grid .price-card.featured .pf-ck { background: linear-gradient(135deg, #0B4F7E, #1a7fc2) !important; }
.pricing-grid .price-card.featured .pf-ck svg { color: #fff !important; }

/* Buttons */
.price-card .btn {
  display: block !important;
  text-align: center !important;
  padding: 13px 18px !important;
  font-size: 0.9rem !important;
  font-weight: 700 !important;
  border-radius: 12px !important;
  transition: all .25s var(--ease) !important;
}
.price-card .btn-outline {
  border: 1.5px solid rgba(11,79,126,.2) !important;
  color: var(--navy) !important;
}
.price-card .btn-outline:hover {
  background: var(--navy) !important;
  border-color: var(--navy) !important;
  color: #fff !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 18px rgba(11,79,126,.2) !important;
}
.price-card.featured .btn-sky {
  background: linear-gradient(135deg, #0B4F7E, #1a7fc2) !important;
  color: #fff !important;
  box-shadow: 0 6px 18px rgba(11,79,126,.25) !important;
}
.price-card.featured .btn-sky:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 24px rgba(11,79,126,.32) !important;
}

/* Hide the "Contact Sales" amt text since we have a button */
.pricing-grid .price-amt { display: none !important; }

/* Compare row — more inviting */
.pri-compare {
  margin-top: 48px !important;
  padding: 18px 24px !important;
  background: var(--gray-50) !important;
  border-radius: 100px !important;
  border: 1px solid var(--border) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  font-size: 0.86rem !important;
  color: var(--text-muted) !important;
}
.pri-compare-wrap { display: flex !important; justify-content: center !important; }

/* CTA card final — refined */
.pri-cta-card {
  border-radius: 24px !important;
  padding: 56px 40px !important;
  background:
    radial-gradient(ellipse 80% 60% at 50% 0%, rgba(185,228,255,.18) 0%, transparent 60%),
    linear-gradient(160deg, #062b46 0%, #0B4F7E 100%) !important;
  position: relative !important;
  overflow: hidden !important;
}
.pri-cta-card::after {
  content: '';
  position: absolute;
  top: -120px; right: -120px;
  width: 320px; height: 320px;
  background: radial-gradient(circle, rgba(185,228,255,.25) 0%, transparent 65%);
  pointer-events: none;
}
.pri-cta-title {
  font-family: 'Manrope', sans-serif !important;
  font-size: clamp(1.6rem, 3.5vw, 2.4rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em !important;
  line-height: 1.15 !important;
  color: #fff !important;
  margin-bottom: 14px !important;
  position: relative !important;
}
.pri-cta-sub {
  font-size: 1rem !important;
  color: rgba(255,255,255,.65) !important;
  line-height: 1.7 !important;
  margin-bottom: 30px !important;
  position: relative !important;
}

/* Mobile cards */
@media (max-width: 768px) {
  .pricing-grid .price-card { padding: 28px 22px !important; border-radius: 16px !important; }
  .price-tier { font-size: 1.3rem !important; }
  .price-desc { font-size: 0.85rem !important; min-height: auto !important; }
  .pri-cta-card { padding: 40px 24px !important; border-radius: 20px !important; }
}

/* ══════════════════════════════════════════════════════════════════
   PRICING — FINAL POLISH
════════════════════════════════════════════════════════════════════ */

/* Allow popular badge to overflow the card */
.pricing-grid .price-card { overflow: visible !important; }

/* "Most popular" badge — clean and visible */
.price-popular {
  position: absolute !important;
  top: -12px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  background: var(--navy) !important;
  color: #fff !important;
  font-family: 'Manrope', sans-serif !important;
  font-size: 0.62rem !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  padding: 6px 14px !important;
  border-radius: 100px !important;
  white-space: nowrap !important;
  box-shadow: 0 4px 12px rgba(11,79,126,.25) !important;
  z-index: 2 !important;
}

/* All 3 cards equal — featured only has subtle border accent */
.pricing-grid .price-card,
.pricing-grid .price-card.featured {
  background: #fff !important;
  border: 1px solid rgba(11,79,126,.1) !important;
  box-shadow: 0 2px 8px rgba(11,79,126,.04) !important;
}
.pricing-grid .price-card::before,
.pricing-grid .price-card::after { display: none !important; }

.pricing-grid .price-card.featured {
  border: 1.5px solid var(--navy) !important;
  box-shadow: 0 6px 20px rgba(11,79,126,.08) !important;
}

.pricing-grid .price-card:hover {
  border-color: rgba(11,79,126,.25) !important;
  box-shadow: 0 8px 24px rgba(11,79,126,.08) !important;
  transform: translateY(-3px) !important;
}
.pricing-grid .price-card.featured:hover {
  border-color: var(--navy) !important;
  box-shadow: 0 12px 32px rgba(11,79,126,.12) !important;
  transform: translateY(-4px) !important;
}

/* Identical check icons on all cards */
.pricing-grid .price-card.featured .pf-ck { background: var(--sky-light) !important; }
.pricing-grid .price-card.featured .pf-ck svg { color: var(--navy) !important; }

/* Identical buttons (only featured has darker fill) */
.pricing-grid .price-card .btn {
  width: 100% !important;
  display: block !important;
}

/* ══════════════════════════════════════════════════════════════════
   DEPLOYMENT TOGGLE — minimalist refined
════════════════════════════════════════════════════════════════════ */
.pri-deploy-toggle-wrap { display: flex; justify-content: center; margin-top: 0; }
.pri-deploy-toggle {
  position: relative !important;
  display: inline-flex !important;
  padding: 4px !important;
  background: var(--gray-50) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
  margin: 0 auto !important;
  box-shadow: none !important;
}
.pri-deploy-toggle::before {
  content: '' !important;
  position: absolute !important;
  top: 4px !important; bottom: 4px !important;
  width: calc(50% - 4px) !important;
  background: #fff !important;
  border-radius: 8px !important;
  box-shadow: 0 1px 3px rgba(11,79,126,.1), 0 1px 2px rgba(0,0,0,.04) !important;
  transition: transform .35s cubic-bezier(.4, 0, .2, 1) !important;
  transform: translateX(0) !important;
  z-index: 0 !important;
  border: 1px solid rgba(11,79,126,.06) !important;
}
.pri-deploy-toggle.cloud::before { transform: translateX(100%) !important; }

.pri-deploy-btn {
  position: relative !important;
  z-index: 1 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 9px 24px !important;
  border-radius: 8px !important;
  font-family: 'Manrope', sans-serif !important;
  font-size: 0.82rem !important;
  font-weight: 600 !important;
  color: var(--text-muted) !important;
  background: transparent !important;
  border: none !important;
  cursor: pointer !important;
  transition: color .25s !important;
  flex: 1 !important;
  justify-content: center !important;
  min-width: 150px !important;
}
.pri-deploy-btn:hover:not(.active) { color: var(--text) !important; }
.pri-deploy-btn.active { color: var(--navy) !important; font-weight: 700 !important; }
.pri-deploy-btn svg {
  color: currentColor !important;
  transition: color .25s !important;
  width: 15px !important;
  height: 15px !important;
}

@media (max-width: 480px) {
  .pri-deploy-btn { min-width: 120px !important; padding: 9px 16px !important; font-size: 0.78rem !important; }
}

/* Center "Need to compare features?" pill */
.pri-compare {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 48px auto 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  width: fit-content !important;
  max-width: 100% !important;
}
.pri-compare > * {
  display: inline-flex !important;
  align-items: center !important;
}

/* More balanced spacing for deploy toggle (equal to top + bottom paragraphs) */
.pri-deploy-toggle-wrap {
  margin: 28px auto 0 !important;
}
.pri-deploy-desc {
  margin: 28px auto 36px !important;
}

/* "Need to compare" — pill restored, centered */
.pri-compare {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 48px auto 0 !important;
  padding: 14px 24px !important;
  background: var(--gray-50) !important;
  border: 1px solid var(--border) !important;
  border-radius: 100px !important;
  width: fit-content !important;
  max-width: 100% !important;
  font-family: 'Manrope', sans-serif !important;
  font-size: 0.86rem !important;
  color: var(--text-muted) !important;
}

/* Switch toggle vertically centered between subtitle and description */
.pri-deploy-toggle-wrap { margin: 32px auto 0 !important; }
.pri-deploy-desc { margin: 32px auto 40px !important; }

/* ══════════════════════════════════════════════════════════════════
   COOKIE BANNER + PREFERENCES MODAL
════════════════════════════════════════════════════════════════════ */
.cookie-banner {
  position: fixed;
  bottom: 16px; left: 16px; right: 16px;
  z-index: 99000;
  display: flex; justify-content: center;
  pointer-events: none;
  animation: cookie-slide-up .4s cubic-bezier(.22,.61,.36,1);
}
.cookie-banner-card {
  pointer-events: auto;
  display: flex; align-items: center; gap: 24px;
  background: #fff;
  border: 1px solid rgba(11,79,126,.12);
  border-radius: 16px;
  padding: 18px 22px;
  box-shadow: 0 10px 32px rgba(11,79,126,.18), 0 4px 12px rgba(11,79,126,.08);
  max-width: 920px; width: 100%;
}
.cookie-banner-body { flex: 1; min-width: 0; }
.cookie-banner-title {
  font-family: 'Manrope', sans-serif;
  font-size: 0.92rem; font-weight: 700; color: var(--text);
  margin: 0 0 4px;
}
.cookie-banner-text {
  font-family: 'Manrope', sans-serif;
  font-size: 0.82rem; line-height: 1.55; color: var(--text-muted);
  margin: 0;
}
.cookie-banner-actions {
  display: flex; gap: 8px; flex-shrink: 0; flex-wrap: wrap;
}
.cookie-btn {
  padding: 9px 16px;
  border-radius: 9px;
  font-family: 'Manrope', sans-serif;
  font-size: 0.8rem; font-weight: 600;
  cursor: pointer;
  transition: all .2s var(--ease);
  border: 1px solid transparent;
  white-space: nowrap;
}
.cookie-btn-primary {
  background: var(--navy); color: #fff;
}
.cookie-btn-primary:hover { background: #1a7fc2; transform: translateY(-1px); }
.cookie-btn-outline {
  background: transparent; color: var(--text);
  border-color: rgba(11,79,126,.18);
}
.cookie-btn-outline:hover { border-color: var(--navy); color: var(--navy); }
.cookie-btn-ghost {
  background: transparent; color: var(--text-muted);
  text-decoration: underline;
  text-underline-offset: 3px;
  padding: 9px 8px;
}
.cookie-btn-ghost:hover { color: var(--navy); }

@keyframes cookie-slide-up {
  from { transform: translateY(100%); opacity: 0; }
  to   { transform: translateY(0); opacity: 1; }
}

/* Preferences modal */
.cookie-modal {
  position: fixed; inset: 0;
  z-index: 99001;
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
}
.cookie-modal-backdrop {
  position: absolute; inset: 0;
  background: rgba(11,15,30,.55);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.cookie-modal-card {
  position: relative;
  background: #fff;
  border-radius: 18px;
  padding: 28px;
  width: 100%; max-width: 480px;
  box-shadow: 0 20px 60px rgba(11,79,126,.25);
  animation: cookie-modal-in .35s cubic-bezier(.22,.61,.36,1);
}
@keyframes cookie-modal-in {
  from { transform: scale(.94) translateY(20px); opacity: 0; }
  to { transform: scale(1) translateY(0); opacity: 1; }
}
.cookie-modal-title {
  font-family: 'Manrope', sans-serif;
  font-size: 1.15rem; font-weight: 800; color: var(--text);
  margin: 0 0 22px;
}
.cookie-pref {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 18px;
  padding: 14px 0;
  border-bottom: 1px solid var(--border);
}
.cookie-pref:last-of-type { border-bottom: none; }
.cookie-pref-info { flex: 1; min-width: 0; }
.cookie-pref-info strong {
  display: block;
  font-family: 'Manrope', sans-serif;
  font-size: 0.88rem; font-weight: 700; color: var(--text);
  margin-bottom: 2px;
}
.cookie-pref-info p {
  font-size: 0.78rem; color: var(--text-muted); line-height: 1.5;
  margin: 0;
}
.cookie-toggle {
  position: relative; display: inline-block;
  width: 38px; height: 22px;
  flex-shrink: 0;
  cursor: pointer;
}
.cookie-toggle.disabled { cursor: not-allowed; opacity: .55; }
.cookie-toggle input { opacity: 0; width: 0; height: 0; }
.cookie-toggle-track {
  position: absolute; inset: 0;
  background: var(--gray-100);
  border-radius: 100px;
  transition: background .25s;
}
.cookie-toggle-track::before {
  content: '';
  position: absolute;
  top: 3px; left: 3px;
  width: 16px; height: 16px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(0,0,0,.15);
  transition: transform .25s cubic-bezier(.22,.61,.36,1);
}
.cookie-toggle input:checked + .cookie-toggle-track { background: var(--navy); }
.cookie-toggle input:checked + .cookie-toggle-track::before { transform: translateX(16px); }
.cookie-modal-save { width: 100%; margin-top: 20px; padding: 12px 18px; }

@media (max-width: 768px) {
  .cookie-banner-card { flex-direction: column; align-items: stretch; gap: 14px; padding: 16px; }
  .cookie-banner-actions { width: 100%; }
  .cookie-banner-actions .cookie-btn { flex: 1; text-align: center; min-height: 40px; }
  .cookie-banner-actions .cookie-btn-ghost { flex: 0 0 100%; order: 3; }
}
@media (max-width: 480px) {
  .cookie-banner { left: 8px; right: 8px; bottom: 8px; }
  .cookie-banner-card { padding: 14px; border-radius: 14px; }
  .cookie-banner-title { font-size: 0.86rem; }
  .cookie-banner-text { font-size: 0.78rem; }
}

/* ═══════════════════════════════════════════════════════════════
   iPhone 13 mini (375px) — dedicated fine-tune overrides
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 420px) {
  /* Universal Protection — inline max-width:640px would overflow */
  .prod-feature-text { max-width: 100% !important; padding: 0 4px; }
  .prod-feature-text .pf-headline { font-size: clamp(1.5rem, 7vw, 2rem); line-height: 1.15; }
  .prod-feature-text .pf-lead { font-size: 0.92rem; line-height: 1.5; }

  /* ChatGPT demo Pribait logo — avoid the 12px crush from the 380px rule */
  .pdw-pribait-logo { max-height: 22px !important; height: 22px !important; width: auto !important; }

  /* General safety — prevent any stray horizontal overflow */
  html, body { overflow-x: hidden; }
  .container { padding-left: 16px; padding-right: 16px; }

  /* Hero magic-text sizing on 375 */
  .hero-magic, .hero h1 { font-size: clamp(1.8rem, 8.5vw, 2.4rem); }

  /* Cookie banner stacking polish */
  .cookie-banner-actions { flex-direction: column; gap: 8px; }
  .cookie-banner-actions .cookie-btn { width: 100%; flex: 1 1 auto; }
}

@media (max-width: 375px) {
  .prod-feature-text .pf-headline { font-size: 1.45rem; }
  .section { padding-top: 48px; padding-bottom: 48px; }
}

/* ─── Fine-tune: ChatGPT send button, home dashboard logo, SME demo ─── */
@media (max-width: 768px) {
  .df-bar-logo { height: 22px !important; width: auto !important; opacity: .85; flex-shrink: 0; }
}
@media (max-width: 480px) {
  .pdw-send { width: 30px !important; height: 30px !important; border-radius: 50% !important; padding: 0 !important; flex-shrink: 0; }
  .pdw-send svg { width: 13px !important; height: 13px !important; }
  .df-bar-logo { height: 20px !important; }
  .sol-deploy { padding: 14px 12px !important; min-height: 0 !important; gap: 9px !important; }
  .sol-deploy-logo { height: 18px !important; }
  .sol-deploy-done-logo { height: 20px !important; }
  .sol-deploy-title { font-size: 0.78rem !important; }
  .sol-deploy-step { font-size: 0.62rem !important; padding: 3px 8px !important; }
  .sol-deploy-item { padding: 10px 11px !important; gap: 10px !important; border-radius: 9px !important; }
  .sol-deploy-check { width: 20px !important; height: 20px !important; }
  .sol-deploy-check svg { width: 10px !important; height: 10px !important; }
  .sol-deploy-name { font-size: 0.72rem !important; line-height: 1.25; }
  .sol-deploy-meta { font-size: 0.6rem !important; }
  .sol-deploy-time { font-size: 0.6rem !important; }
  .sol-deploy-done { font-size: 0.7rem !important; padding: 9px !important; }
}
@media (max-width: 380px) {
  .pdw-send { width: 28px !important; height: 28px !important; }
  .pdw-send svg { width: 12px !important; height: 12px !important; }
  .df-bar-logo { height: 18px !important; }
  .sol-deploy { padding: 12px 10px !important; }
  .sol-deploy-item { padding: 9px 10px !important; gap: 9px !important; }
  .sol-deploy-name { font-size: 0.68rem !important; }
  .sol-deploy-meta { font-size: 0.56rem !important; }
  .sol-deploy-time { font-size: 0.56rem !important; }
  .sol-deploy-title { font-size: 0.72rem !important; }
  .sol-deploy-step { font-size: 0.58rem !important; padding: 2px 7px !important; }
}

/* ─── Dashboard Doc Classification — mobile stack ─── */
@media (max-width: 560px) {
  .df-class-row {
    flex-wrap: wrap;
    row-gap: 4px;
    column-gap: 6px;
    padding: 7px 9px;
  }
  .df-class-tag {
    order: 1;
    font-size: 0.54rem;
    padding: 2px 6px;
  }
  .df-class-time {
    order: 2;
    margin-left: auto;
    font-size: 0.54rem;
  }
  .df-class-file {
    order: 3;
    flex: 1 0 100%;
    font-size: 0.58rem;
    min-width: 0;
  }
  .df-class-stats { gap: 4px; }
  .df-class-stats div { padding: 6px 3px; }
  .df-class-stats strong { font-size: 0.78rem; }
  .df-class-stats span { font-size: 0.52rem; }
}
@media (max-width: 380px) {
  .df-class-row { padding: 6px 8px; }
  .df-class-tag { font-size: 0.5rem; padding: 2px 5px; letter-spacing: .02em; }
  .df-class-time { font-size: 0.5rem; }
  .df-class-file { font-size: 0.55rem; }
  .df-class-stats strong { font-size: 0.72rem; }
  .df-class-stats span { font-size: 0.48rem; }
}

/* ═══════════════════════════════════════════════════════════════
   Newsletter inline form (blog sidebar)
   ═══════════════════════════════════════════════════════════════ */
.b2-nl-form {
  display: flex;
  gap: 6px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(185,228,255,.18);
  border-radius: 10px;
  padding: 4px;
  margin-top: 4px;
}
.b2-nl-input {
  flex: 1 1 auto;
  min-width: 0;
  background: transparent;
  border: none;
  outline: none;
  color: #fff;
  font-family: 'Manrope', sans-serif;
  font-size: .78rem;
  padding: 8px 10px;
}
.b2-nl-input::placeholder { color: rgba(185,228,255,.5); }
.b2-nl-submit {
  flex: 0 0 auto;
  border: none;
  background: #B9E4FF;
  color: #0B4F7E;
  font-family: 'Manrope', sans-serif;
  font-size: .78rem;
  font-weight: 800;
  padding: 8px 12px;
  border-radius: 7px;
  cursor: pointer;
  transition: background .2s, transform .2s;
  min-width: 42px;
}
.b2-nl-submit:hover { background: #fff; }
.b2-nl-submit:disabled { opacity: .7; cursor: wait; }
.b2-nl-feedback {
  font-size: .72rem;
  margin: 10px 0 0;
  min-height: 1em;
  line-height: 1.4;
}
.b2-nl-feedback.nl-ok { color: #9be5c7; }
.b2-nl-feedback.nl-err { color: #ff9a8f; }

@media (max-width: 480px) {
  .b2-nl-form { flex-direction: column; gap: 8px; }
  .b2-nl-submit { width: 100%; padding: 10px 12px; }
}

/* ═══════════════════════════════════════════════════════════════
   404 page
   ═══════════════════════════════════════════════════════════════ */
.nf-hero { padding-top: clamp(80px, 12vw, 140px); padding-bottom: clamp(80px, 12vw, 140px); text-align: center; }
.nf-content { max-width: 640px; margin: 0 auto; }
.nf-code {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(5rem, 18vw, 9rem);
  font-weight: 900;
  letter-spacing: -0.06em;
  line-height: 1;
  background: linear-gradient(135deg, #0B4F7E 0%, #3ea0d1 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  margin-bottom: 18px;
  user-select: none;
}
.nf-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-top: 28px;
}
@media (max-width: 480px) {
  .nf-actions { flex-direction: column; align-items: stretch; }
  .nf-actions .btn { width: 100%; text-align: center; }
}