:root{color-scheme:light;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}html{scroll-padding-top:env(safe-area-inset-top,0px)}body{margin:0;padding:0;font:14px -apple-system,BlinkMacSystemFont,sans-serif;background:#fff;color:#000}img{max-width:100%}[hidden]:not([hidden=until-found i]){display:none!important}

:root {
  --c-teal: #007B8D;
  --c-teal-dark: #005F6D;
  --c-teal-light: #E6F3F5;
  --c-teal-glow: rgba(0,123,141,0.15);
  --c-pink: #ED1E79;
  --c-pink-dark: #C91265;
  --c-pink-light: #FDE8F2;
  --c-pink-glow: rgba(237,30,121,0.12);
  --c-dark: #0A1628;
  --c-text: #1C2833;
  --c-text-muted: #5D6D7E;
  --c-bg: #FFFFFF;
  --c-surface: #F5F8FA;
  --c-border: #E2E8ED;
  --c-white: #FFFFFF;
  --c-card-shadow: 0 2px 20px rgba(0,123,141,0.06);
  --c-card-hover: 0 12px 40px rgba(0,123,141,0.12);
  --font-display: 'Outfit', system-ui, sans-serif;
  --font-body: 'Nunito Sans', system-ui, sans-serif;
  --max-w: 1200px;
  --gutter-left: max(16px, env(safe-area-inset-left, 0px));
  --gutter-right: max(16px, env(safe-area-inset-right, 0px));
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --c-teal: #1BA8B9; --c-teal-dark: #007B8D; --c-teal-light: #0C2A2E;
    --c-teal-glow: rgba(27,168,185,0.2); --c-pink: #F54B9A; --c-pink-dark: #ED1E79;
    --c-pink-light: #2A0F1D; --c-pink-glow: rgba(245,75,154,0.15);
    --c-dark: #E8EDF2; --c-text: #D0D8E0; --c-text-muted: #8899A6;
    --c-bg: #0B1622; --c-surface: #111F2E; --c-border: #1E2D3D; --c-white: #0B1622;
    --c-card-shadow: 0 2px 20px rgba(0,0,0,0.2); --c-card-hover: 0 12px 40px rgba(0,0,0,0.3);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --c-teal: #1BA8B9; --c-teal-dark: #007B8D; --c-teal-light: #0C2A2E;
  --c-teal-glow: rgba(27,168,185,0.2); --c-pink: #F54B9A; --c-pink-dark: #ED1E79;
  --c-pink-light: #2A0F1D; --c-pink-glow: rgba(245,75,154,0.15);
  --c-dark: #E8EDF2; --c-text: #D0D8E0; --c-text-muted: #8899A6;
  --c-bg: #0B1622; --c-surface: #111F2E; --c-border: #1E2D3D; --c-white: #0B1622;
  --c-card-shadow: 0 2px 20px rgba(0,0,0,0.2); --c-card-hover: 0 12px 40px rgba(0,0,0,0.3);
  color-scheme: dark;
}

body {
  background: var(--c-bg); color: var(--c-text); font-family: var(--font-body);
  font-size: 1rem; line-height: 1.7;
  padding-left: var(--gutter-left); padding-right: var(--gutter-right);
  -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
body::before {
  content: ""; position: fixed; inset: 0 0 auto;
  height: env(safe-area-inset-top, 0px); z-index: 1001; background: #0A1628;
}
*, *::before, *::after { box-sizing: border-box; }

h1,h2,h3,h4,h5 { font-family: var(--font-display); color: var(--c-dark); line-height: 1.15; text-wrap: balance; margin: 0; }
h1 { font-size: clamp(2rem, 5vw, 3.2rem); font-weight: 800; }
h2 { font-size: clamp(1.6rem, 3.5vw, 2.4rem); font-weight: 700; }
h3 { font-size: clamp(1.1rem, 2vw, 1.35rem); font-weight: 600; }
h4 { font-size: 1.05rem; font-weight: 600; }
p { margin: 0 0 1rem; }
a { color: var(--c-teal); text-decoration: none; transition: color 0.2s; }
a:hover { color: var(--c-pink); }

#app > .page { display: none; }
#app > .page.active { display: block; }
.container { max-width: var(--max-w); margin: 0 auto; width: 100%; }

/* ═══ BANDS ═══ */
.band {
  padding-block: clamp(3rem, 6vw, 5rem);
  margin-left: calc(-1 * var(--gutter-left)); margin-right: calc(-1 * var(--gutter-right));
  padding-left: var(--gutter-left); padding-right: var(--gutter-right);
}
.band--surface { background: var(--c-surface); }
.band--teal {
  background: linear-gradient(135deg, #004852 0%, #007B8D 40%, #005F6B 70%, #003D47 100%);
  color: #fff; position: relative;
}
.band--teal::before {
  content: ''; position: absolute; inset: 0;
  background: radial-gradient(ellipse at 20% 50%, rgba(237,30,121,0.1) 0%, transparent 50%),
              radial-gradient(ellipse at 80% 50%, rgba(0,155,175,0.15) 0%, transparent 50%);
  pointer-events: none;
}
.band--teal h2,.band--teal h3,.band--teal h4 { color: #fff; }
.band--dark { background: var(--c-dark); color: #E8EDF2; }

/* ═══ NAV ═══ */
.site-nav {
  position: sticky; top: env(safe-area-inset-top, 0px); z-index: 1000;
  background: rgba(255,255,255,0.88); backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px);
  border-bottom: 1px solid var(--c-border);
  margin-left: calc(-1 * var(--gutter-left)); margin-right: calc(-1 * var(--gutter-right));
  padding-left: var(--gutter-left); padding-right: var(--gutter-right);
  transition: box-shadow 0.3s, background 0.3s;
}
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .site-nav { background: rgba(11,22,34,0.88); } }
:root[data-theme="dark"] .site-nav { background: rgba(11,22,34,0.88); }
.site-nav.scrolled { box-shadow: 0 4px 30px rgba(0,123,141,0.08); }
.nav-inner {
  max-width: var(--max-w); margin: 0 auto; display: flex; align-items: center;
  justify-content: space-between; padding: 0.9rem var(--gutter-left);
  padding-right: var(--gutter-right);
}
.nav-logo {
  height: 44px; width: auto; transition: all 0.3s;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,0.1));
}
.nav-logo:hover { transform: scale(1.03); }
.nav-logo img { height: 48px; width: auto; }
.nav-links { display: flex; align-items: center; gap: 0.15rem; list-style: none; margin: 0; padding: 0; }
.nav-links a {
  color: var(--c-text); text-decoration: none; font-size: 0.88rem;
  font-weight: 500; padding: 0.4rem 0.1rem; position: relative;
  transition: color 0.3s;
}
.nav-links a::after {
  content: ''; position: absolute; bottom: 0; left: 0; width: 0; height: 2px;
  background: linear-gradient(90deg, var(--c-teal), var(--c-pink));
  transition: width 0.3s; border-radius: 2px;
}
.nav-links a:hover { color: var(--c-teal); }
.nav-links a:hover::after { width: 100%; }
.nav-links a:hover,.nav-links a.active { background: var(--c-teal-light); color: var(--c-teal); }
.nav-links .dropdown { position: relative; }
.nav-links .dropdown-menu {
  display: none; position: absolute; top: 100%; left: 0; background: var(--c-bg);
  border: 1px solid var(--c-border); border-radius: 12px; padding: 0.5rem;
  min-width: 220px; box-shadow: var(--c-card-hover); z-index: 100;
}
.nav-links .dropdown:hover .dropdown-menu { display: block; }
.nav-links .dropdown-menu a { padding: 0.5rem 0.8rem; font-size: 0.85rem; border-radius: 8px; }
.nav-cta {
  display: flex; align-items: center; gap: 0.6rem;
}
.nav-cta .btn { font-size: 0.85rem; padding: 0.45rem 1rem; }
.nav-toggle {
  display: none; background: none; border: none; cursor: pointer;
  width: 40px; height: 40px; flex-direction: column; align-items: center;
  justify-content: center; gap: 5px;
}
.nav-toggle span { display: block; width: 24px; height: 2px; background: var(--c-text); border-radius: 2px; transition: transform 0.3s, opacity 0.3s; }
.nav-toggle.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle.open span:nth-child(2) { opacity: 0; }
.nav-toggle.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 960px) {
  .nav-toggle { display: flex; }
  .nav-links {
    display: none; position: absolute; top: 72px; left: 0; right: 0;
    background: var(--c-bg); border-bottom: 1px solid var(--c-border);
    padding: 1rem var(--gutter-right) 1rem var(--gutter-left);
    flex-direction: column; align-items: stretch; gap: 0;
    box-shadow: 0 12px 40px rgba(0,0,0,0.1);
  }
  .nav-links.open { display: flex; }
  .nav-links a { padding: 0.7rem 0.8rem; }
  .nav-links .dropdown-menu { position: static; box-shadow: none; border: none; padding-left: 1rem; background: transparent; display: none; }
  .nav-links .dropdown.open .dropdown-menu { display: block; }
  .nav-cta { display: none; }
}

/* ═══ BUTTONS ═══ */
.btn {
  display: inline-flex; align-items: center; gap: 0.5rem;
  font-family: var(--font-display); font-weight: 600; font-size: 0.95rem;
  padding: 0.75rem 1.8rem; border-radius: 10px; border: 2px solid transparent;
  cursor: pointer; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  text-decoration: none; white-space: nowrap; position: relative; overflow: hidden;
}
.btn--pink { background: var(--c-pink); color: #fff; border-color: var(--c-pink); }
.btn--pink:hover { background: var(--c-pink-dark); border-color: var(--c-pink-dark); color: #fff; transform: translateY(-2px); box-shadow: 0 8px 30px var(--c-pink-glow), 0 0 60px var(--c-pink-glow); }
.btn--teal { background: var(--c-teal); color: #fff; border-color: var(--c-teal); }
.btn--teal:hover { background: var(--c-teal-dark); border-color: var(--c-teal-dark); color: #fff; transform: translateY(-2px); box-shadow: 0 8px 30px var(--c-teal-glow); }
.btn--outline { background: transparent; color: var(--c-teal); border-color: var(--c-teal); }
.btn--outline:hover { background: var(--c-teal); color: #fff; transform: translateY(-2px); }
.btn--white { background: #fff; color: var(--c-teal); border-color: #fff; }
.btn--white:hover { background: rgba(255,255,255,0.9); color: var(--c-pink); transform: translateY(-2px); box-shadow: 0 8px 25px rgba(255,255,255,0.2); }
.btn--ghost { background: transparent; color: #fff; border-color: rgba(255,255,255,0.35); }
.btn--ghost:hover { background: rgba(255,255,255,0.1); border-color: #fff; color: #fff; }
.btn--sm { padding: 0.45rem 1rem; font-size: 0.85rem; }
.btn--lg { padding: 0.9rem 2.2rem; font-size: 1.05rem; }
.btn--glow {
  animation: btn-glow 2.5s ease-in-out infinite;
}
@keyframes btn-glow {
  0%,100% { box-shadow: 0 0 20px var(--c-pink-glow), 0 0 60px rgba(237,30,121,0.05); }
  50% { box-shadow: 0 0 30px rgba(237,30,121,0.3), 0 0 80px rgba(237,30,121,0.1); }
}

/* ═══ ICONS ═══ */
.icon { display: inline-flex; width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.icon--lg { width: 32px; height: 32px; }

/* ═══ HERO WITH VIDEO ═══ */
.hero {
  margin-left: calc(-1 * var(--gutter-left)); margin-right: calc(-1 * var(--gutter-right));
  padding: 0; position: relative; overflow: hidden;
  min-height: 100vh; min-height: 100svh;
  display: flex; align-items: center;
}
.hero-video {
  position: absolute; inset: 0; z-index: 0;
  overflow: hidden;
}
.hero-video video {
  width: 100%; height: 100%; object-fit: cover;
}
.hero-overlay {
  position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(180deg, rgba(0,20,30,0.65) 0%, rgba(0,60,80,0.55) 40%, rgba(0,123,141,0.45) 70%, rgba(10,22,40,0.8) 100%),
    radial-gradient(ellipse at 20% 80%, rgba(237,30,121,0.12) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 20%, rgba(0,157,175,0.15) 0%, transparent 50%);
}

/* Hero particles */
.hero-particles { position: absolute; inset: 0; z-index: 2; pointer-events: none; overflow: hidden; }
.hero-particles span {
  position: absolute; border-radius: 50%;
  animation: float-particle linear infinite;
}
@keyframes float-particle {
  0% { transform: translateY(100vh) rotate(0deg); opacity: 0; }
  10% { opacity: 1; }
  90% { opacity: 1; }
  100% { transform: translateY(-10vh) rotate(720deg); opacity: 0; }
}

/* Animated grid lines */
.hero-grid {
  position: absolute; inset: 0; z-index: 2; pointer-events: none; opacity: 0.06;
  background-image:
    linear-gradient(rgba(255,255,255,0.3) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.3) 1px, transparent 1px);
  background-size: 80px 80px;
  animation: grid-move 20s linear infinite;
}
@keyframes grid-move {
  0% { transform: translate(0,0); }
  100% { transform: translate(80px,80px); }
}

/* Glowing orbs */
.hero-glow {
  position: absolute; border-radius: 50%; filter: blur(120px); opacity: 0.25; pointer-events: none; z-index: 2;
  animation: glow-drift 8s ease-in-out infinite alternate;
}
.hero-glow--teal { background: #007B8D; width: 500px; height: 500px; top: -15%; right: -5%; }
.hero-glow--pink { background: #ED1E79; width: 400px; height: 400px; bottom: -20%; left: -5%; animation-delay: -4s; }
@keyframes glow-drift {
  0% { transform: translate(0,0) scale(1); }
  100% { transform: translate(30px,-20px) scale(1.15); }
}

.hero-content {
  max-width: var(--max-w); margin: 0 auto; position: relative; z-index: 3;
  display: flex; flex-direction: column; align-items: center; text-align: center;
  padding: clamp(8rem, 18vw, 13rem) var(--gutter-left) clamp(4rem, 8vw, 6rem);
  padding-right: var(--gutter-right); width: 100%;
}
.hero-badge {
  display: inline-flex; align-items: center; gap: 0.5rem;
  background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.15);
  border-radius: 100px; padding: 0.35rem 1rem; font-size: 0.82rem;
  color: rgba(255,255,255,0.9); margin-bottom: 1.2rem; backdrop-filter: blur(10px);
  animation: badge-in 0.8s ease-out;
}
@keyframes badge-in { from { opacity: 0; transform: translateY(-10px); } }
.badge-dot { width: 8px; height: 8px; background: #4ADE80; border-radius: 50%; animation: pulse-dot 2s infinite; }
@keyframes pulse-dot { 0%,100% { opacity: 1; transform: scale(1); } 50% { opacity: 0.5; transform: scale(0.8); } }

.hero h1 {
  color: #fff; font-size: clamp(2.8rem, 7vw, 4.6rem); margin-bottom: 1.2rem;
  line-height: 1.04; font-weight: 900; letter-spacing: -0.02em;
  animation: title-in 1s ease-out 0.2s both;
}
@keyframes title-in { from { opacity: 0; transform: translateY(30px); } }
.hero h1 .accent {
  background: linear-gradient(135deg, #ED1E79, #FF6BB5);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
}
.hero-sub {
  color: rgba(255,255,255,0.85); font-size: clamp(1.05rem, 1.8vw, 1.25rem);
  line-height: 1.7; margin-bottom: 2rem; max-width: 620px;
  animation: sub-in 1s ease-out 0.4s both;
}
@keyframes sub-in { from { opacity: 0; transform: translateY(20px); } }
.hero-btns { display: flex; flex-wrap: wrap; gap: 0.8rem; animation: btns-in 1s ease-out 0.6s both; justify-content: center; }
@keyframes btns-in { from { opacity: 0; transform: translateY(20px); } }

.hero-trust-strip {
  display: flex; flex-wrap: wrap; gap: 1.2rem; justify-content: center;
  margin-top: 2.5rem; animation: btns-in 1s ease-out 0.8s both;
}
.trust-item {
  display: flex; align-items: center; gap: 0.5rem;
  color: rgba(255,255,255,0.8); font-size: 0.88rem; font-weight: 500;
  background: rgba(255,255,255,0.06); backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,0.1); border-radius: 100px;
  padding: 0.5rem 1.2rem; transition: all 0.3s;
}
.trust-item:hover { background: rgba(255,255,255,0.12); border-color: rgba(255,255,255,0.2); transform: translateY(-2px); }
.trust-item svg { opacity: 0.8; }


/* Scroll indicator */

/* ═══ APP SHOWCASE ═══ */
.app-showcase {
  display: flex; align-items: center; gap: 3rem; margin-top: 2rem;
}
.app-phones {
  display: flex; gap: -1rem; align-items: flex-end; flex-shrink: 0;
  position: relative;
}
.app-phone {
  width: 140px; border-radius: 20px; box-shadow: 0 20px 60px rgba(0,0,0,0.15);
  transition: all 0.5s cubic-bezier(0.4,0,0.2,1);
  transform: translateY(0);
}
.app-phone:nth-child(1) { z-index: 3; }
.app-phone:nth-child(2) { z-index: 2; margin-left: -30px; transform: translateY(15px) scale(0.95); opacity: 0.9; }
.app-phone:nth-child(3) { z-index: 1; margin-left: -30px; transform: translateY(30px) scale(0.9); opacity: 0.8; }
.app-phones:hover .app-phone:nth-child(1) { transform: translateY(-5px) rotate(-2deg); }
.app-phones:hover .app-phone:nth-child(2) { transform: translateY(5px) scale(0.97) rotate(1deg); opacity: 1; }
.app-phones:hover .app-phone:nth-child(3) { transform: translateY(15px) scale(0.94) rotate(3deg); opacity: 0.95; }
.app-features {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; flex: 1;
}
.app-feat {
  display: flex; align-items: flex-start; gap: 0.8rem;
  padding: 1rem; border-radius: 14px; background: var(--c-surface);
  border: 1px solid var(--c-border); transition: all 0.3s;
}
.app-feat:hover { border-color: var(--c-teal); transform: translateY(-2px); }
.app-feat-icon {
  width: 40px; height: 40px; border-radius: 10px; flex-shrink: 0;
  background: linear-gradient(135deg, var(--c-teal-light), var(--c-pink-light));
  display: flex; align-items: center; justify-content: center; color: var(--c-teal);
}
.app-feat h4 { font-size: 0.92rem; margin-bottom: 0.2rem; }
.app-feat p { font-size: 0.82rem; color: var(--c-text-muted); margin: 0; line-height: 1.4; }
@media (max-width: 900px) {
  .app-showcase { flex-direction: column; text-align: center; }
  .app-phones { justify-content: center; }
}
@media (max-width: 600px) {
  .app-features { grid-template-columns: 1fr; }
  .app-phone { width: 110px; }
}

.scroll-indicator {
  position: absolute; bottom: 2rem; left: 50%; transform: translateX(-50%);
  z-index: 3; display: flex; flex-direction: column; align-items: center; gap: 0.5rem;
  color: rgba(255,255,255,0.5); font-size: 0.75rem; letter-spacing: 0.1em;
  text-transform: uppercase; font-family: var(--font-display);
  animation: scroll-bounce 2s ease-in-out infinite;
}
.scroll-indicator svg { width: 20px; height: 20px; stroke: rgba(255,255,255,0.5); fill: none; stroke-width: 2; }
@keyframes scroll-bounce { 0%,100% { transform: translateX(-50%) translateY(0); } 50% { transform: translateX(-50%) translateY(8px); } }

@media (max-width: 768px) {
  .hero-content { padding-top: clamp(7rem, 16vw, 10rem); }
  .hero-trust-strip { gap: 0.6rem; }
  .trust-item { font-size: 0.78rem; padding: 0.4rem 0.9rem; }
  
/* ═══ APP SHOWCASE ═══ */
.app-showcase {
  display: flex; align-items: center; gap: 3rem; margin-top: 2rem;
}
.app-phones {
  display: flex; gap: -1rem; align-items: flex-end; flex-shrink: 0;
  position: relative;
}
.app-phone {
  width: 140px; border-radius: 20px; box-shadow: 0 20px 60px rgba(0,0,0,0.15);
  transition: all 0.5s cubic-bezier(0.4,0,0.2,1);
  transform: translateY(0);
}
.app-phone:nth-child(1) { z-index: 3; }
.app-phone:nth-child(2) { z-index: 2; margin-left: -30px; transform: translateY(15px) scale(0.95); opacity: 0.9; }
.app-phone:nth-child(3) { z-index: 1; margin-left: -30px; transform: translateY(30px) scale(0.9); opacity: 0.8; }
.app-phones:hover .app-phone:nth-child(1) { transform: translateY(-5px) rotate(-2deg); }
.app-phones:hover .app-phone:nth-child(2) { transform: translateY(5px) scale(0.97) rotate(1deg); opacity: 1; }
.app-phones:hover .app-phone:nth-child(3) { transform: translateY(15px) scale(0.94) rotate(3deg); opacity: 0.95; }
.app-features {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; flex: 1;
}
.app-feat {
  display: flex; align-items: flex-start; gap: 0.8rem;
  padding: 1rem; border-radius: 14px; background: var(--c-surface);
  border: 1px solid var(--c-border); transition: all 0.3s;
}
.app-feat:hover { border-color: var(--c-teal); transform: translateY(-2px); }
.app-feat-icon {
  width: 40px; height: 40px; border-radius: 10px; flex-shrink: 0;
  background: linear-gradient(135deg, var(--c-teal-light), var(--c-pink-light));
  display: flex; align-items: center; justify-content: center; color: var(--c-teal);
}
.app-feat h4 { font-size: 0.92rem; margin-bottom: 0.2rem; }
.app-feat p { font-size: 0.82rem; color: var(--c-text-muted); margin: 0; line-height: 1.4; }
@media (max-width: 900px) {
  .app-showcase { flex-direction: column; text-align: center; }
  .app-phones { justify-content: center; }
}
@media (max-width: 600px) {
  .app-features { grid-template-columns: 1fr; }
  .app-phone { width: 110px; }
}

.scroll-indicator { display: none; }
}

/* ═══ SECTION HEADERS ═══ */
.sh { text-align: center; max-width: 680px; margin: 0 auto 3rem; }
.sh p { color: var(--c-text-muted); font-size: 1.05rem; margin-top: 0.8rem; }
.sh-label {
  font-family: var(--font-display); font-size: 0.78rem; font-weight: 600;
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-pink);
  margin-bottom: 0.5rem; display: inline-block;
}

/* ═══ ICON BOX ═══ */
.icon-box {
  width: 56px; height: 56px;
  background: linear-gradient(135deg, var(--c-teal-light) 0%, var(--c-pink-light) 100%);
  border-radius: 14px; display: flex; align-items: center; justify-content: center;
  color: var(--c-teal); transition: all 0.4s;
}
.icon-box:hover { transform: scale(1.08) rotate(-3deg); }

/* ═══ AUDIENCE CARDS ═══ */
.audience-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem; }
.a-card {
  background: var(--c-bg); border: 1px solid var(--c-border); border-radius: 24px;
  padding: 0; transition: all 0.5s cubic-bezier(0.4,0,0.2,1); cursor: pointer;
  position: relative; overflow: hidden;
}
.a-card-header {
  padding: 2.5rem 2.5rem 1.5rem; position: relative;
  background: linear-gradient(135deg, rgba(0,123,141,0.06), rgba(237,30,121,0.03));
}
.a-card:nth-child(2) .a-card-header {
  background: linear-gradient(135deg, rgba(237,30,121,0.06), rgba(0,123,141,0.03));
}
.a-card-body { padding: 0 2.5rem 2.5rem; }
.a-card::before {
  content: ''; position: absolute; inset: 0; border-radius: 24px; padding: 2px;
  background: linear-gradient(135deg, var(--c-teal), var(--c-pink));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude; opacity: 0; transition: opacity 0.5s;
}
.a-card:hover::before { opacity: 1; }
.a-card:hover { transform: translateY(-8px); box-shadow: 0 20px 60px rgba(0,123,141,0.15), 0 8px 20px rgba(0,0,0,0.08); }
.a-card .icon-box { width: 64px; height: 64px; border-radius: 18px; }
.a-card .icon-box svg { width: 30px; height: 30px; }
.a-card:nth-child(2) .icon-box { background: linear-gradient(135deg, var(--c-pink-light) 0%, rgba(0,123,141,0.1) 100%); color: var(--c-pink); }
.a-card h3 { margin: 1.2rem 0 0.6rem; font-size: 1.35rem; }
.a-card p { color: var(--c-text-muted); font-size: 0.95rem; margin-bottom: 1.2rem; line-height: 1.6; }
.a-card .arrow-link {
  display: inline-flex; align-items: center; gap: 0.5rem; font-weight: 700;
  font-size: 1rem; color: var(--c-teal); transition: all 0.3s;
}
.a-card:nth-child(2) .arrow-link { color: var(--c-pink); }
.a-card:hover .arrow-link { gap: 0.8rem; }
.feat-list { list-style: none; padding: 0; margin: 0 0 1.5rem; display: flex; flex-direction: column; gap: 0.6rem; }
.feat-list li { display: flex; align-items: center; gap: 0.7rem; font-size: 0.95rem; }
.feat-list li .check {
  width: 22px; height: 22px; background: var(--c-teal); border-radius: 50%;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.a-card:nth-child(2) .feat-list li .check { background: var(--c-pink); }
.feat-list li .check svg { width: 12px; height: 12px; stroke: #fff; fill: none; stroke-width: 2.5; }
@media (max-width: 768px) { .audience-grid { grid-template-columns: 1fr; } .a-card h3 { font-size: 1.2rem; } }

/* ═══ STEPS ═══ */
.steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; position: relative; }
.steps::before {
  content: ''; position: absolute; top: 40px; left: 12%; right: 12%;
  height: 2px; background: linear-gradient(90deg, var(--c-teal), var(--c-pink), var(--c-teal)); opacity: 0.3;
}
.step { text-align: center; position: relative; z-index: 1; }
.step-n {
  width: 80px; height: 80px;
  background: linear-gradient(135deg, var(--c-teal), var(--c-teal-dark));
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  font-family: var(--font-display); font-size: 1.5rem; font-weight: 800; color: #fff;
  margin: 0 auto 1.2rem; box-shadow: 0 4px 20px var(--c-teal-glow);
  transition: all 0.4s;
}
.step:hover .step-n { transform: scale(1.12); box-shadow: 0 8px 30px var(--c-teal-glow); }
.step h4 { margin-bottom: 0.4rem; }
.step p { font-size: 0.88rem; color: var(--c-text-muted); }
@media (max-width: 768px) { .steps { grid-template-columns: repeat(2, 1fr); } .steps::before { display: none; } }
@media (max-width: 480px) { .steps { grid-template-columns: 1fr; } }

/* ═══ SECTOR GRID ═══ */
.sector-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; }
.s-card {
  background: var(--c-bg); border: 1px solid var(--c-border); border-radius: 16px;
  padding: 1.8rem; transition: all 0.4s; cursor: pointer; position: relative; overflow: hidden;
}
.s-card::before {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(135deg, var(--c-teal-glow), var(--c-pink-glow));
  opacity: 0; transition: opacity 0.4s;
}
.s-card:hover::before { opacity: 1; }
.s-card:hover { border-color: var(--c-teal); transform: translateY(-4px); box-shadow: var(--c-card-hover); }
.s-card > * { position: relative; z-index: 1; }
.s-card .icon-box { margin-bottom: 0.8rem; }
.s-card h4 { margin-bottom: 0.3rem; }
.s-card p { font-size: 0.86rem; color: var(--c-text-muted); margin: 0; }
@media (max-width: 768px) { .sector-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .sector-grid { grid-template-columns: 1fr; } }

/* ═══ VALUES ═══ */
.values-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1.5rem; }
.val { text-align: center; padding: 1.5rem 1rem; }
.val .icon-box { margin: 0 auto 1rem; }
.val h4 { font-size: 0.92rem; margin-bottom: 0.25rem; }
.val p { font-size: 0.8rem; color: var(--c-text-muted); margin: 0; }
@media (max-width: 768px) { .values-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 480px) { .values-grid { grid-template-columns: repeat(2, 1fr); } }

/* ═══ SPLIT ═══ */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; }
.split--rev { direction: rtl; }
.split--rev > * { direction: ltr; }
@media (max-width: 768px) { .split { grid-template-columns: 1fr; gap: 2rem; } .split-img { min-height: 320px; } .split--rev { direction: ltr; } }
.split-img {
  border-radius: 24px; overflow: hidden; position: relative; min-height: 360px;
  background: linear-gradient(135deg, var(--c-teal-light), var(--c-surface));
  isolation: isolate;
}
.split-img .split-photo {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center 35%;
}
.split-img::after {
  content: ""; position: absolute; z-index: 1; inset: 35% 0 0;
  background: linear-gradient(180deg, transparent, rgba(10,22,40,0.72));
  pointer-events: none;
}
.split-img__caption {
  position: absolute; z-index: 2; left: 1.5rem; right: 1.5rem; bottom: 1.5rem;
  display: flex; flex-direction: column; gap: 0.25rem; color: #fff;
  text-shadow: 0 1px 8px rgba(0,0,0,0.3);
}
.split-img__caption span { font-size: 0.76rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; }
.split-img__caption strong { font-size: 1.2rem; }
.portal-card {
  position: absolute; z-index: 2; left: 1.5rem; bottom: 1.5rem;
  width: min(250px, calc(100% - 3rem)); padding: 1.1rem;
  border: 1px solid rgba(255,255,255,0.75); border-radius: 16px;
  background: rgba(255,255,255,0.94); box-shadow: 0 16px 40px rgba(10,22,40,0.2);
  backdrop-filter: blur(12px);
}
.portal-card__label {
  display: block; margin-bottom: 0.35rem; color: var(--c-teal);
  font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
}
.portal-card strong { display: block; color: var(--c-dark); font-size: 1.05rem; line-height: 1.3; }
.portal-card__items { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.75rem; }
.portal-card__items span {
  padding: 0.3rem 0.5rem; border-radius: 999px;
  background: var(--c-teal-light); color: var(--c-teal-dark); font-size: 0.7rem; font-weight: 600;
}
.split-img--about {
  background-image: linear-gradient(180deg, rgba(10,22,40,0.08), rgba(10,22,40,0.45)), url("../images/samenwerken-in-de-zorg.jpg");
  background-position: center; background-size: cover;
}
.split-img--about .moving-bg { display: none; }
.split-img--about .img-placeholder { z-index: 2; background: linear-gradient(180deg, transparent 30%, rgba(10,22,40,0.24)); }
.split-img--about .img-placeholder p { color: #fff !important; }
.split-img .img-placeholder {
  position: absolute; inset: 0; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 1rem;
}
.split-img .moving-bg {
  position: absolute; inset: 0;
  background: linear-gradient(45deg, var(--c-teal-glow), transparent, var(--c-pink-glow), transparent);
  background-size: 300% 300%; animation: gradient-move 8s ease infinite;
}
@keyframes gradient-move { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }
.split-text h2 { margin-bottom: 1rem; }
.split-text p { color: var(--c-text-muted); margin-bottom: 1rem; }

/* ═══ FEATURES ROW ═══ */
.feat-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.f-card {
  padding: 2rem; background: var(--c-bg); border: 1px solid var(--c-border);
  border-radius: 16px; transition: all 0.4s;
}
.f-card:hover { transform: translateY(-4px); box-shadow: var(--c-card-hover); border-color: var(--c-teal); }
.f-card .icon-box { margin-bottom: 1rem; }
.f-card h3 { font-size: 1.1rem; margin-bottom: 0.4rem; }
.f-card p { font-size: 0.9rem; color: var(--c-text-muted); margin: 0; }
@media (max-width: 768px) { .feat-row { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .split-img { min-height: 290px; } .portal-card { left: 1rem; bottom: 1rem; padding: 0.9rem; } .split-img__caption { left: 1rem; right: 1rem; bottom: 1rem; } }

/* ═══ FAQ ═══ */
.faq-list { max-width: 800px; margin: 0 auto; display: flex; flex-direction: column; gap: 0.5rem; }
.faq-item { border: 1px solid var(--c-border); border-radius: 12px; overflow: hidden; transition: all 0.3s; }
.faq-item.open { border-color: var(--c-teal); box-shadow: 0 0 0 3px var(--c-teal-glow); }
.faq-q {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: 1.1rem 1.4rem; background: none; border: none; width: 100%;
  text-align: left; font-family: var(--font-display); font-size: 0.98rem;
  font-weight: 600; color: var(--c-dark); cursor: pointer;
}
.faq-q .faq-chevron { width: 20px; height: 20px; stroke: var(--c-teal); transition: transform 0.3s; flex-shrink: 0; }
.faq-item.open .faq-q .faq-chevron { transform: rotate(180deg); }
.faq-a { max-height: 0; overflow: hidden; transition: max-height 0.4s ease; }
.faq-item.open .faq-a { max-height: 500px; }
.faq-a-inner { padding: 0 1.4rem 1.2rem; color: var(--c-text-muted); font-size: 0.93rem; line-height: 1.7; }

/* ═══ FORMS ═══ */
.form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
.fg { display: flex; flex-direction: column; gap: 0.35rem; }
.fg.full { grid-column: 1 / -1; }
.fg label { font-family: var(--font-display); font-size: 0.86rem; font-weight: 600; color: var(--c-dark); }
.fg input,.fg select,.fg textarea {
  padding: 0.7rem 1rem; border: 1px solid var(--c-border); border-radius: 10px;
  font-family: var(--font-body); font-size: 0.95rem; color: var(--c-text); background: var(--c-bg);
  transition: border-color 0.2s, box-shadow 0.2s;
}
.fg input:focus,.fg select:focus,.fg textarea:focus { outline: none; border-color: var(--c-teal); box-shadow: 0 0 0 3px var(--c-teal-glow); }
.fg textarea { resize: vertical; min-height: 110px; }
@media (max-width: 600px) { .form-grid { grid-template-columns: 1fr; } }
.form-success {
  display: none; background: var(--c-teal-light); border: 1px solid var(--c-teal);
  border-radius: 12px; padding: 1.5rem; text-align: center; color: var(--c-teal);
}
.form-success.show { display: block; }
.priv-note { font-size: 0.78rem; color: var(--c-text-muted); margin-top: 0.6rem; line-height: 1.5; }

/* ═══ CONTACT ═══ */
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; }
@media (max-width: 768px) { .contact-grid { grid-template-columns: 1fr; } }
.c-item { display: flex; align-items: flex-start; gap: 1rem; }
.c-item .icon-box { width: 44px; height: 44px; border-radius: 12px; flex-shrink: 0; }
.c-item h4 { font-size: 0.93rem; margin-bottom: 0.1rem; }
.c-item p { font-size: 0.88rem; color: var(--c-text-muted); margin: 0; }

/* ═══ CTA BAND ═══ */
.cta-band { text-align: center; padding: clamp(3rem,6vw,5rem) 1rem; position: relative; overflow: hidden; }
.cta-band h2 { color: #fff; margin-bottom: 0.8rem; }
.cta-band p { color: rgba(255,255,255,0.82); max-width: 580px; margin: 0 auto 1.8rem; font-size: 1.02rem; }
.cta-band .btn-row { display: flex; justify-content: center; flex-wrap: wrap; gap: 0.8rem; }

/* ═══ PAGE HEADER ═══ */
.page-header {
  margin-left: calc(-1 * var(--gutter-left)); margin-right: calc(-1 * var(--gutter-right));
  padding: clamp(3.5rem,7vw,5.5rem) var(--gutter-left); padding-right: var(--gutter-right);
  background: linear-gradient(135deg, #002A33 0%, #007B8D 100%);
  text-align: center; position: relative; overflow: hidden;
}
.page-header::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse at 50% 100%, rgba(237,30,121,0.06) 0%, transparent 60%); }
.page-header > * { position: relative; z-index: 1; }
.page-header h1 { color: #fff; margin-bottom: 0.6rem; }
.page-header p { color: rgba(255,255,255,0.8); max-width: 600px; margin: 0 auto; font-size: 1.02rem; }

/* ═══ DIENSTEN GRID ═══ */
.d-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
@media (max-width: 600px) { .d-grid { grid-template-columns: 1fr; } }
.d-card {
  background: var(--c-bg); border: 1px solid var(--c-border); border-radius: 16px;
  padding: 2rem; transition: all 0.35s;
}
.d-card:hover { border-color: var(--c-teal); box-shadow: var(--c-card-hover); transform: translateY(-3px); }
.d-card .icon-box { margin-bottom: 1rem; }
.d-card h3 { margin-bottom: 0.5rem; font-size: 1.1rem; }
.d-card p { font-size: 0.9rem; color: var(--c-text-muted); margin: 0; }

/* ═══ ACADEMY ═══ */
.acad-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.2rem; }
.acad-card { background: var(--c-bg); border: 1px solid var(--c-border); border-radius: 16px; padding: 1.8rem; transition: all 0.35s; }
.acad-card:hover { border-color: var(--c-teal); box-shadow: var(--c-card-shadow); transform: translateY(-3px); }
.tag { display: inline-block; background: var(--c-pink-light); color: var(--c-pink); font-family: var(--font-display); font-size: 0.73rem; font-weight: 600; padding: 0.25rem 0.7rem; border-radius: 100px; letter-spacing: 0.02em; margin-bottom: 0.7rem; }
.tag--teal { background: var(--c-teal-light); color: var(--c-teal); }

/* ═══ EMERGENCY BAND ═══ */
.emerg { display: flex; align-items: center; justify-content: center; gap: 3rem; flex-wrap: wrap; text-align: center; }
.emerg .phone { font-family: var(--font-display); font-size: clamp(1.5rem,3vw,2.2rem); font-weight: 800; color: #fff; font-variant-numeric: tabular-nums; }

/* ═══ CARD ═══ */
.card { background: var(--c-bg); border: 1px solid var(--c-border); border-radius: 16px; padding: 2rem; }

/* ═══ ICON LIST ═══ */
.il { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0.65rem; }
.il li { display: flex; align-items: flex-start; gap: 0.7rem; font-size: 0.95rem; }
.il li .check { flex-shrink: 0; width: 22px; height: 22px; background: var(--c-teal); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-top: 0.12em; }
.il li .check svg { width: 13px; height: 13px; stroke: #fff; fill: none; stroke-width: 2.5; }

/* ═══ FOOTER ═══ */
.site-footer {
  margin-left: calc(-1 * var(--gutter-left)); margin-right: calc(-1 * var(--gutter-right));
  padding: 3rem var(--gutter-left) 1.5rem; padding-right: var(--gutter-right);
  background: #061018; color: #8899A6;
}
.ft-grid {
  max-width: var(--max-w); margin: 0 auto; display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr; gap: 2.5rem;
  padding-bottom: 2rem; border-bottom: 1px solid rgba(255,255,255,0.06);
}
.ft-brand img { height: 40px; margin-bottom: 1rem; }
.ft-brand p { font-size: 0.86rem; line-height: 1.7; max-width: 300px; }
.ft-col h4 { font-family: var(--font-display); font-size: 0.85rem; font-weight: 600; color: #fff; margin-bottom: 0.8rem; text-transform: uppercase; letter-spacing: 0.06em; }
.ft-col ul { list-style: none; padding: 0; margin: 0; }
.ft-col ul li { margin-bottom: 0.35rem; }
.ft-col ul a { font-size: 0.86rem; color: #8899A6; transition: color 0.2s; }
.ft-col ul a:hover { color: #fff; }
.ft-bottom {
  max-width: var(--max-w); margin: 1.5rem auto 0; display: flex;
  justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem;
  font-size: 0.8rem; color: #5D6D7E;
}
.ft-cert { display: flex; align-items: center; gap: 0.3rem; font-size: 0.76rem; color: #8899A6; }
.social { display: flex; gap: 0.6rem; margin-top: 1rem; }
.social a {
  width: 34px; height: 34px; background: rgba(255,255,255,0.06); border-radius: 8px;
  display: flex; align-items: center; justify-content: center; color: #8899A6; transition: all 0.2s;
}
.social a:hover { background: var(--c-teal); color: #fff; }
.social a svg { width: 16px; height: 16px; fill: currentColor; }
@media (max-width: 768px) { .ft-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .ft-grid { grid-template-columns: 1fr; } }

/* ═══ ANIMATIONS ═══ */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity 0.7s cubic-bezier(0.4,0,0.2,1), transform 0.7s cubic-bezier(0.4,0,0.2,1); }
.reveal.visible { opacity: 1; transform: translateY(0); }
.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }

/* ═══ COUNTER ANIMATION ═══ */
.counter-wrap { font-variant-numeric: tabular-nums; }

@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

.text-center { text-align: center; }
.mt-2 { margin-top: 2rem; }
.mt-3 { margin-top: 3rem; }

/* ================================================================
   ZORG VOOR BALANS — REFINED BRAND SYSTEM / 2026
   Original project preserved, with a cohesive navigation redesign.
   ================================================================ */
:root { scroll-behavior: smooth; }
html { scroll-padding-top: 110px; }
body { overflow-x: clip; }
a:focus-visible, button:focus-visible { outline: 3px solid #ED1E79; outline-offset: 4px; }
.page-header { padding-block: clamp(4.4rem,8vw,7rem); }
.sh h2 { letter-spacing: -.035em; }
.hero { min-height: calc(100svh - 106px); }
.hero-overlay { background: linear-gradient(100deg, rgba(0,27,38,.80) 0%, rgba(0,45,57,.60) 47%, rgba(0,33,45,.28) 100%), linear-gradient(0deg, rgba(0,20,30,.38), transparent 35%); }
.hero h1 { font-size:clamp(3rem,6.4vw,5.5rem); letter-spacing:-.055em; }
.hero h1 .accent { background:none; color:#ff73ad; -webkit-text-fill-color:currentColor; }
.hero-content { padding-top:clamp(6rem,10vw,9rem); padding-bottom:clamp(6rem,10vw,9rem); }
.hero-grid { opacity:.022; }
.hero-glow { opacity:.11; }
.hero-particles span { opacity:.12; }
.btn { letter-spacing:-.008em; }
.btn--glow { animation:none; }

/* Header; no emoji or icon-font symbols; only clean vector icons. */
.site-nav { position:sticky; top:0; z-index:1000; margin:0 calc(-1 * var(--gutter-right)) 0 calc(-1 * var(--gutter-left)); padding:0; background:#fff; border-bottom:1px solid #E9EEF0; box-shadow:0 1px 0 rgba(0,0,0,.02); backdrop-filter:none; -webkit-backdrop-filter:none; }
.site-nav.scrolled { box-shadow:0 14px 36px rgba(0,43,54,.09); }
.nav-topline { height:33px; overflow:hidden; background:#005d6b; color:#fff; transition:height .3s ease; }
.site-nav.scrolled .nav-topline { height:0; }
.nav-top-inner { max-width:1280px; height:33px; padding:0 22px; margin:auto; display:flex; align-items:center; justify-content:space-between; }
.nav-top-signature { font:600 10.5px/1.2 var(--font-display); letter-spacing:.065em; text-transform:uppercase; display:flex; align-items:center; gap:10px; color:rgba(255,255,255,.9); }
.nav-top-mark { width:7px; height:7px; background:#ED1E79; border-radius:50%; display:inline-block; box-shadow:0 0 0 4px rgba(237,30,121,.12); }
.nav-top-phone { display:flex; align-items:center; gap:9px; font:500 11px/1 var(--font-body); color:#fff!important; }
.nav-top-phone:hover { opacity:.8; }
.nav-top-phone svg { width:13px; height:13px; color:#fff; }
.nav-top-phone strong { font:700 11px/1 var(--font-display); }
.nav-shell { background:#fff; }
.nav-inner { max-width:1280px; width:100%; height:78px; padding:0 22px; display:flex; gap:25px; align-items:center; margin:auto; justify-content:space-between; }
.nav-brand { flex-shrink:0; min-width:0; display:flex; align-items:center; line-height:0; }
.nav-brand img { display:block; max-height:55px; height:55px; width:auto; max-width:195px; object-fit:contain; transition:transform .3s cubic-bezier(.2,.7,.3,1); }
.nav-brand:hover img { transform:translateY(-1px); }
.nav-desktop { margin-left:auto; display:flex; align-items:center; gap:2px; height:100%; }
.nav-item { display:inline-flex; align-items:center; justify-content:center; gap:5px; white-space:nowrap; padding:12px 11px; background:none; border:0; border-radius:8px; color:#263c44; font:650 12.5px/1.3 var(--font-display); cursor:pointer; transition:background .2s,color .2s; }
.nav-item:hover, .nav-item.is-current, .nav-item--drop[aria-expanded="true"] { color:#007B8D; background:#edf7f8; }
.nav-chevron { display:block; width:14px; height:14px; transition:transform .2s; }
.nav-item--drop[aria-expanded="true"] .nav-chevron { transform:rotate(180deg); }
.nav-dropdown { position:relative; display:flex; align-items:center; height:100%; }
.nav-flyout { position:absolute; top:calc(100% - 5px); left:50%; transform:translate(-50%,7px); width:295px; z-index:20; background:#fff; border:1px solid #e8eeef; border-top:3px solid #007B8D; border-radius:0 0 13px 13px; box-shadow:0 22px 55px rgba(4,43,55,.14); padding:17px 11px 12px; opacity:0; visibility:hidden; pointer-events:none; transition:opacity .2s,transform .2s,visibility .2s; }
.nav-dropdown:hover .nav-flyout, .nav-dropdown:focus-within .nav-flyout, .nav-dropdown[data-open="true"] .nav-flyout { opacity:1; visibility:visible; transform:translate(-50%,0); pointer-events:auto; }
.flyout-kicker { margin:0 10px 8px; color:#007B8D; text-transform:uppercase; letter-spacing:.12em; font:750 10px/1.3 var(--font-display); }
.nav-flyout a { display:block; padding:11px 10px; border-radius:7px; color:#233943; transition:background .2s; }
.nav-flyout a:hover { background:#edf7f8; color:#005d6b; }
.nav-flyout span { font:700 13px/1.4 var(--font-display); display:block; }
.nav-flyout small { display:block; color:#72818a; font:500 11px/1.4 var(--font-body); margin-top:2px; }
.nav-actions { display:flex; align-items:center; gap:9px; flex-shrink:0; }
.nav-login { display:inline-flex; align-items:center; gap:7px; color:#005d6b; padding:10px 9px; font:700 12px/1 var(--font-display); white-space:nowrap; }
.nav-login svg { width:17px; height:17px; }
.nav-login:hover { color:#ED1E79; }
.nav-join { display:inline-flex; align-items:center; gap:14px; padding:13px 16px; background:#ED1E79; color:#fff!important; border-radius:7px; font:700 12px/1 var(--font-display); letter-spacing:.005em; box-shadow:0 4px 12px rgba(237,30,121,.14); white-space:nowrap; transition:transform .25s,background .25s,box-shadow .25s; }
.nav-join:hover { background:#ce1467; color:#fff; transform:translateY(-1px); box-shadow:0 7px 20px rgba(237,30,121,.22); }
.nav-join svg { width:16px; height:16px; }
.nav-toggle { display:none; position:relative; flex-shrink:0; border:1px solid #e7eff0; border-radius:9px; height:44px; width:44px; padding:0; background:#fff; align-items:center; justify-content:center; flex-direction:column; gap:5px; cursor:pointer; }
.nav-toggle span { width:20px; height:2px; display:block; background:#005d6b; border-radius:2px; transition:transform .22s,opacity .22s; }
.nav-toggle.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.nav-toggle.open span:nth-child(2) { opacity:0; }
.nav-toggle.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
.nav-mobile { position:absolute; display:none; top:100%; left:0; right:0; background:#fff; border-top:1px solid #edf1f2; box-shadow:0 22px 38px rgba(0,29,40,.13); max-height:calc(100svh - 75px); overflow:auto; overscroll-behavior:contain; }
.nav-mobile.open { display:block; }
.nav-mobile-inner { padding:20px 22px 26px; max-width:820px; margin:0 auto; }
.nav-mobile-inner > a:not(.mobile-phone) { display:flex; align-items:center; justify-content:space-between; font:700 clamp(15px,3vw,19px)/1.3 var(--font-display); padding:12px 1px; border-bottom:1px solid #edf1f2; color:#113c47; }
.nav-mobile-inner > a span { color:#a1b8c0; font:700 10px/1 var(--font-display); }
.nav-mobile-inner > a:hover { color:#007B8D; }
.mobile-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; padding-top:18px; }
.mobile-actions a { min-height:46px; display:flex; align-items:center; justify-content:center; gap:10px; border-radius:7px; font:700 12px/1.3 var(--font-display); }
.mobile-actions a:first-child { border:1px solid #007B8D; color:#007B8D; }
.mobile-actions a:last-child { background:#ED1E79; color:#fff; }
.mobile-actions svg { width:15px; height:15px; }
.mobile-phone { font:600 11px/1.2 var(--font-display); margin-top:20px; display:block; color:#60717b; }
@media(max-width:1210px) { .nav-inner { gap:10px; padding:0 17px; } .nav-item { padding:11px 7px; font-size:12px; } .nav-brand img { max-height:49px; height:49px; } .nav-actions { gap:3px; } .nav-join { padding:12px 12px; gap:8px; } }
@media(max-width:1090px) { .nav-desktop,.nav-actions { display:none; } .nav-toggle { display:flex; } .nav-inner { height:74px; padding:0 22px; } .nav-brand img { height:53px; max-height:53px; } .nav-topline { height:29px; } .nav-top-inner { height:29px; } .site-nav.scrolled .nav-topline { height:0; } }
@media(max-width:560px) { .nav-inner { padding:0 16px; height:68px; } .nav-brand img { max-height:47px; height:47px; } .nav-top-inner { padding:0 16px; } .nav-top-signature { font-size:9px; letter-spacing:.012em; } .nav-top-phone span { display:none; } .nav-top-phone strong { font-size:9.5px; } .hero { min-height:calc(100svh - 96px); } }

/* Deliberate editorial style borrowed from ZVB's own visual identity. */
.intro-band { padding-top:clamp(3.2rem,6vw,5.2rem); padding-bottom:clamp(3.2rem,6vw,5.2rem); }
.intro-layout { display:grid; grid-template-columns:1fr .92fr; gap:clamp(1.5rem,7vw,8rem); align-items:center; }
.intro-heading h2 { font-size:clamp(2.2rem,4.5vw,3.9rem); font-weight:800; line-height:1.08; letter-spacing:-.06em; margin-top:8px; }
.intro-accent { color:#007B8D; }
.intro-body > p { font-size:clamp(1rem,1.8vw,1.16rem); line-height:1.8; color:#4f626a; max-width:540px; margin-bottom:1.6rem; }
.intro-links { display:flex; align-items:center; flex-wrap:wrap; gap:14px; }
.intro-links a { color:#007B8D; display:inline-flex; align-items:center; gap:10px; font:700 13px/1.3 var(--font-display); white-space:nowrap; }
.intro-links a svg { width:16px; height:16px; transition:transform .2s; }
.intro-links a:hover svg { transform:translateX(4px); }
.intro-links span:not(.intro-vertical) { color:#829299; font-size:11px; }
.intro-vertical { width:1px; height:19px; background:#dae3e6; }
.service-band { background:#f7fafb; }
.services-header { display:flex; align-items:end; justify-content:space-between; gap:25px; margin-bottom:30px; }
.services-header h2 { font-size:clamp(2rem,4vw,3.4rem); letter-spacing:-.05em; }
.services-link { color:#007B8D; display:inline-flex; align-items:center; gap:10px; font:700 13px/1.3 var(--font-display); padding:12px 0; white-space:nowrap; }
.services-link svg { width:16px; height:16px; }
.service-editorial-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.service-editorial { padding:28px 24px 26px; background:#fff; border:1px solid #e6edf0; border-radius:11px; box-shadow:0 4px 15px rgba(0,51,63,.025); transition:transform .32s ease,border .32s ease,box-shadow .32s ease; position:relative; }
.service-editorial:hover { transform:translateY(-5px); border-color:rgba(0,123,141,.32); box-shadow:0 14px 30px rgba(0,70,83,.09); }
.service-num { font:700 10px/1 var(--font-display); color:#8c9da5; letter-spacing:.1em; }
.service-icon { display:flex; justify-content:center; align-items:center; margin-top:21px; margin-bottom:20px; width:46px; height:46px; background:#edf7f8; border-radius:10px; color:#007B8D; }
.service-icon svg { width:23px; height:23px; }
.service-editorial h3 { font:700 17px/1.3 var(--font-display); margin-bottom:11px; letter-spacing:-.02em; }
.service-editorial p { font-size:13px; line-height:1.7; color:#60727c; margin:0; }
@media(max-width:920px) { .intro-layout { grid-template-columns:1fr; gap:18px; } .service-editorial-grid { grid-template-columns:repeat(2,1fr); } }
@media(max-width:600px) { .services-header { align-items:start; flex-direction:column; gap:4px; } .service-editorial-grid { grid-template-columns:1fr; } .service-editorial { padding:22px; } }

/* Original opdrachtgever logo wall; styled to stay quiet until hover. */
.partners-band { background:#fff; position:relative; overflow:hidden; }
.partners-heading { display:flex; justify-content:space-between; align-items:end; gap:45px; padding-bottom:22px; margin-bottom:23px; border-bottom:1px solid #e5ecee; }
.partners-heading h2 { letter-spacing:-.05em; font-size:clamp(2.15rem,4vw,3.7rem); }
.period { color:#ED1E79; }
.partners-heading p { color:#62757c; font-size:14px; line-height:1.75; max-width:345px; margin:0 0 4px; }
.partners-frame { position:relative; }
.partners-list { display:flex; flex-wrap:wrap; gap:11px; justify-content:center; }
.partner-card { flex:0 1 calc(16.666% - 11px); min-width:145px; min-height:125px; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:17px 10px 13px; border:1px solid #e9eff0; border-radius:9px; background:#fff; transition:border .28s,transform .28s,box-shadow .28s; }
.partner-card:hover { transform:translateY(-4px); box-shadow:0 13px 30px rgba(0,68,83,.085); border-color:rgba(0,123,141,.27); }
.partner-image { width:100%; height:60px; display:flex; align-items:center; justify-content:center; position:relative; }
.partner-image img { display:block; max-height:55px; max-width:150px; width:auto; height:auto; object-fit:contain; filter:grayscale(1); opacity:.78; transition:filter .28s,opacity .28s,transform .28s; }
.partner-card:hover .partner-image img { filter:grayscale(0); opacity:1; transform:scale(1.04); }
.partner-fallback-name { display:none; font:800 15px/1.2 var(--font-display); text-align:center; color:#007B8D; letter-spacing:-.03em; }
.partner-image.has-fallback .partner-fallback-name { display:block; }
.partner-name { margin-top:9px; color:#7c8990; font:650 11px/1.35 var(--font-display); text-align:center; white-space:normal; }
.partners-bottom { display:flex; align-items:center; gap:18px; margin-top:29px; }
.partners-rule { height:1px; flex:1; background:#e3ecee; }
.partners-bottom p { margin:0; color:#84939c; font:600 12px/1.5 var(--font-display); }
.partners-bottom a { margin-left:auto; display:inline-flex; align-items:center; gap:9px; font:750 12px/1.4 var(--font-display); color:#007B8D; white-space:nowrap; }
.partners-bottom a svg { width:16px; height:16px; }
.inst-partners { background:#f7fafb; padding-block:3.5rem; }
.inst-partners-head { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.inst-partners-head h2 { font-size:clamp(1.6rem,3vw,2.1rem); }
.inst-partners-head > a { display:inline-flex; gap:7px; align-items:center; font:750 13px/1.2 var(--font-display); }
.inst-partners-head > a svg { width:16px; height:16px; }
.inst-partner-names { display:flex; flex-wrap:wrap; gap:9px; margin-top:22px; }
.inst-partner-names span { border:1px solid #e4ebee; background:white; border-radius:6px; padding:8px 11px; font:650 11px/1.2 var(--font-display); color:#526a72; }
.emergency-phone-link { display:inline-flex; gap:10px; align-items:center; color:#fff!important; }
.emergency-phone-link svg { width:22px; height:22px; transition:transform .2s; }
.emergency-phone-link:hover svg { transform:translateX(3px); }
@media(max-width:1000px) { .partner-card { flex-basis:calc(25% - 11px); } }
@media(max-width:740px) { .partners-heading { flex-direction:column; align-items:start; gap:12px; } .partners-heading p { max-width:100%; } .partner-card { flex-basis:calc(33.333% - 11px); min-width:0; } .partners-bottom { flex-wrap:wrap; } .partners-rule { flex:0 0 50px; } .inst-partners-head { align-items:start; flex-direction:column; } }
@media(max-width:490px) { .partners-list { gap:8px; } .partner-card { flex-basis:calc(50% - 4px); min-height:118px; padding:12px 6px; } .partner-name { font-size:10px; } .partners-bottom { gap:12px; } .partners-bottom a { margin-left:0; } .partners-rule { display:none; } }
@media(prefers-reduced-motion:reduce) { .nav-flyout,.nav-toggle span,.partner-card,.partner-image img,.service-editorial { transition:none!important; } .hero-particles,.hero-grid,.hero-glow { display:none; } }

/* ═══ ZVB ACADEMY ═══ */
.academy-hero {
  position: relative;
  overflow: hidden;
  margin-inline: calc(-1 * var(--gutter-left)) calc(-1 * var(--gutter-right));
  padding: clamp(62px,8vw,112px) var(--gutter-right) clamp(58px,7vw,94px) var(--gutter-left);
  background: linear-gradient(120deg,#f3f9f9 0%,#f7f8f6 56%,#eef6f5 100%);
}
.academy-hero::before {
  position: absolute;
  top: -230px;
  right: 7%;
  width: 440px;
  height: 440px;
  border: 1px solid rgba(0,123,141,.08);
  border-radius: 50%;
  box-shadow: 0 0 0 55px rgba(0,123,141,.025),0 0 0 115px rgba(0,123,141,.02);
  content: "";
  animation: academy-orbit 18s ease-in-out infinite alternate;
}
.academy-hero__layout {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0,1.05fr) minmax(320px,.95fr);
  gap: clamp(40px,7vw,100px);
  align-items: center;
  max-width: 1200px;
}
.academy-hero__copy { position: relative; z-index: 1; }
.academy-hero__copy > * { animation: academy-enter .7s both; }
.academy-hero__copy > :nth-child(2) { animation-delay: .08s; }
.academy-hero__copy > :nth-child(3) { animation-delay: .16s; }
.academy-hero__copy > :nth-child(4) { animation-delay: .24s; }
.academy-hero__copy > :nth-child(5) { animation-delay: .32s; }
.academy-kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--c-teal);
  font: 800 10px/1.3 var(--font-display);
  letter-spacing: .16em;
}
.academy-kicker > span { width: 22px; height: 2px; background: var(--c-pink); }
.academy-hero h1 {
  margin: 20px 0 17px;
  color: #12363e;
  font-size: clamp(2.8rem,5.5vw,5rem);
  letter-spacing: -.065em;
  line-height: 1.02;
}
.academy-hero h1 em { color: var(--c-teal); font-style: normal; }
.academy-hero__copy > p {
  max-width: 570px;
  margin: 0;
  color: #5c7077;
  font-size: clamp(15px,1.45vw,17px);
  line-height: 1.8;
}
.academy-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 24px; margin-top: 28px; }
.academy-hero__actions .btn { gap: 12px; }
.academy-text-link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--c-teal);
  font: 800 13px/1.4 var(--font-display);
  text-decoration: none;
}
.academy-text-link span { transition: transform .2s ease; }
.academy-text-link:hover span { transform: translateX(4px); }
.academy-hero__note { display: flex; align-items: center; gap: 12px; margin-top: 35px; color: #697d83; font-size: 12px; line-height: 1.6; }
.academy-hero__note strong { color: #28484f; font-size: 12px; }
.academy-note-icon {
  display: grid;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  place-items: center;
  border: 1px solid #d5e6e7;
  border-radius: 50%;
  background: #fff;
  color: var(--c-teal);
}
.academy-note-icon svg { width: 19px; height: 19px; }
.academy-hero__visual { position: relative; min-width: 0; padding: 0 15px 34px 0; animation: academy-enter .85s .16s both; }
.academy-hero__visual::before { position: absolute; inset: 25px 0 0 30px; border-radius: 20px; background: #d7ebea; content: ""; }
.academy-hero__visual > img { position: relative; display: block; width: 100%; height: clamp(360px,40vw,500px); border-radius: 18px; object-fit: cover; object-position: center; box-shadow: 0 22px 65px rgba(9,54,61,.16); transition: transform .6s cubic-bezier(.2,.7,.3,1),box-shadow .6s ease; }
.academy-hero__visual:hover > img { transform: scale(1.015); box-shadow: 0 28px 75px rgba(9,54,61,.2); }
.academy-visual-card {
  position: absolute;
  right: -12px;
  bottom: 5px;
  left: -38px;
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 88px;
  padding: 16px 19px;
  border: 1px solid rgba(15,57,64,.08);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 15px 40px rgba(9,54,61,.12);
  animation: academy-float 6s ease-in-out 1s infinite;
}
.academy-visual-card__icon {
  display: grid;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  place-items: center;
  border-radius: 12px;
  background: #e8f4f4;
  color: var(--c-teal);
}
.academy-visual-card__icon svg { width: 24px; height: 24px; }
.academy-visual-card > span:nth-child(2) { display: grid; gap: 5px; }
.academy-visual-card strong { color: #24434a; font: 800 13px/1.3 var(--font-display); }
.academy-visual-card small { color: #71838a; font-size: 11px; line-height: 1.4; }
.academy-visual-arrow { margin-left: auto; color: var(--c-teal); font-size: 20px; }
.academy-visual-stamp {
  position: absolute;
  top: 28px;
  right: -24px;
  display: grid;
  width: 93px;
  height: 93px;
  place-content: center;
  border: 4px solid rgba(255,255,255,.82);
  border-radius: 50%;
  background: var(--c-pink);
  color: #fff;
  font: 800 11px/1.35 var(--font-display);
  text-align: center;
  transform: rotate(8deg);
  animation: academy-stamp 7s ease-in-out infinite;
}
.academy-promise { padding: clamp(48px,6vw,78px) 0; background: #fff; }
.academy-promise__grid { display: grid; grid-template-columns: 1.05fr 1fr auto; gap: clamp(26px,5vw,68px); align-items: center; max-width: 1120px; }
.academy-promise__intro h2 { max-width: 450px; margin: 10px 0 0; color: #173a42; font-size: clamp(1.7rem,3.3vw,2.7rem); letter-spacing: -.05em; line-height: 1.16; }
.academy-promise__grid > p { margin: 0; color: #647780; font-size: 14px; line-height: 1.85; }
.academy-promise__mark { display: grid; width: 64px; height: 64px; place-items: center; border-radius: 50%; background: #eff7f5; color: var(--c-teal); }
.academy-promise__mark svg { width: 38px; height: 38px; }
.academy-topics { background: #f5f8f8; }
.academy-section-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 36px; margin-bottom: 32px; }
.academy-section-heading h2 { max-width: 600px; margin: 9px 0 0; color: #173a42; font-size: clamp(1.8rem,3.6vw,3rem); letter-spacing: -.055em; line-height: 1.13; }
.academy-section-heading > p { max-width: 390px; margin: 0 0 3px; color: #647780; font-size: 14px; line-height: 1.75; }
.academy-topic-grid { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 15px; }
.academy-topic-card { position: relative; min-width: 0; overflow: hidden; padding: 25px 22px 26px; border-color: #e3ebec; border-radius: 14px; background: #fff; }
.academy-topic-card:hover { border-color: #bedbdd; box-shadow: 0 17px 40px rgba(8,47,55,.08); transform: translateY(-4px); }
.academy-topics.visible .academy-topic-card { animation: academy-fade-in .65s both; }
.academy-topics.visible .academy-topic-card:nth-child(2) { animation-delay: .08s; }
.academy-topics.visible .academy-topic-card:nth-child(3) { animation-delay: .16s; }
.academy-topics.visible .academy-topic-card:nth-child(4) { animation-delay: .24s; }
.academy-topic-icon { display: grid; width: 45px; height: 45px; margin-bottom: 20px; place-items: center; border-radius: 12px; }
.academy-topic-icon svg { width: 23px; height: 23px; transition: transform .35s ease; }
.academy-topic-card:hover .academy-topic-icon svg { transform: rotate(-8deg) scale(1.1); }
.academy-topic-icon--pink { background: #fff0f5; color: var(--c-pink); }
.academy-topic-icon--teal { background: #e8f4f4; color: var(--c-teal); }
.academy-topic-card .tag { margin-bottom: 10px; font-size: 10px; }
.academy-topic-card h3 { position: relative; z-index: 1; margin: 0 0 9px; color: #23434a; font-size: 17px; letter-spacing: -.025em; }
.academy-topic-card p { position: relative; z-index: 1; margin: 0; color: #6a7c82; font-size: 12px; line-height: 1.75; }
.academy-topic-index { position: absolute; right: 14px; bottom: -19px; color: rgba(0,123,141,.055); font: 900 68px/.9 var(--font-display); letter-spacing: -.08em; }
.academy-topics-note { margin: 18px 0 0; color: #73848a; font-size: 11px; line-height: 1.6; }
.academy-steps { background: #fff; }
.academy-section-heading--steps { align-items: center; }
.academy-section-heading--steps h2 { max-width: none; }
.academy-section-heading--steps > .academy-text-link { flex: 0 0 auto; margin-bottom: 5px; }
.academy-step-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0; border-top: 1px solid #e3ecee; }
.academy-step { display: flex; gap: 17px; padding: 27px 22px 10px 0; }
.academy-step + .academy-step { padding-left: 24px; border-left: 1px solid #e3ecee; }
.academy-steps.visible .academy-step { animation: academy-fade-in .65s both; }
.academy-steps.visible .academy-step:nth-child(2) { animation-delay: .1s; }
.academy-steps.visible .academy-step:nth-child(3) { animation-delay: .2s; }
.academy-step__number { display: grid; width: 38px; height: 38px; flex: 0 0 38px; place-items: center; border-radius: 50%; background: #eff7f5; color: var(--c-teal); font: 800 11px/1 var(--font-display); }
.academy-step h3 { margin: 3px 0 7px; color: #24434a; font: 800 14px/1.4 var(--font-display); }
.academy-step p { max-width: 280px; margin: 0; color: #718188; font-size: 12px; line-height: 1.7; }
.academy-quote { padding: clamp(45px,6vw,75px) 0; background: #f4f8f7; }
.academy-quote__inner { display: grid; justify-items: center; text-align: center; }
.academy-quote__mark { height: 39px; color: var(--c-pink); font: 800 70px/.9 Georgia,serif; }
.academy-quote blockquote { max-width: 780px; margin: 10px 0 15px; color: #17404a; font: 700 clamp(1.45rem,3.3vw,2.45rem)/1.35 var(--font-display); letter-spacing: -.04em; }
.academy-quote__byline { color: #718188; font: 800 10px/1.4 var(--font-display); letter-spacing: .12em; text-transform: uppercase; }
.academy-faq__layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(38px,8vw,110px); }
.academy-faq__layout > div:first-child h2 { margin: 10px 0; color: #173a42; font-size: clamp(1.8rem,3.3vw,2.7rem); letter-spacing: -.05em; }
.academy-faq__layout > div:first-child p { max-width: 300px; margin: 0 0 18px; color: #6a7c82; font-size: 13px; line-height: 1.7; }
.academy-faq__items { border-top: 1px solid #dfe9ea; }
.academy-faq__item { padding: 0; border-bottom: 1px solid #dfe9ea; }
.academy-faq__item summary { position: relative; padding: 20px 34px 20px 0; color: #24434a; cursor: pointer; font: 800 14px/1.5 var(--font-display); list-style: none; }
.academy-faq__item summary::-webkit-details-marker { display: none; }
.academy-faq__item summary::after { position: absolute; top: 19px; right: 5px; color: var(--c-teal); content: "+"; font: 400 22px/1 var(--font-display); }
.academy-faq__item[open] summary::after { content: "−"; }
.academy-faq__item p { max-width: 620px; margin: -3px 28px 20px 0; color: #687b82; font-size: 13px; line-height: 1.8; }
.academy-cta { position: relative; overflow: hidden; margin-inline: calc(-1 * var(--gutter-left)) calc(-1 * var(--gutter-right)); padding: clamp(46px,6.5vw,80px) var(--gutter-right) clamp(46px,6.5vw,80px) var(--gutter-left); background: linear-gradient(115deg,#034d5a 0%,#087e8c 100%); }
.academy-cta::after { position: absolute; top: -200px; right: 6%; width: 430px; height: 430px; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; box-shadow: 0 0 0 45px rgba(255,255,255,.035),0 0 0 95px rgba(255,255,255,.025); content: ""; }
.academy-cta__inner { position: relative; z-index: 1; display: flex; justify-content: space-between; align-items: center; gap: 48px; max-width: 1120px; }
.academy-kicker--light { color: rgba(255,255,255,.76); }
.academy-kicker--light > span { background: #ff8cb4; }
.academy-cta h2 { max-width: 580px; margin: 14px 0 12px; color: #fff; font-size: clamp(2rem,4vw,3.3rem); letter-spacing: -.06em; line-height: 1.1; }
.academy-cta p { max-width: 610px; margin: 0; color: rgba(255,255,255,.79); font-size: 14px; line-height: 1.75; }
.academy-cta__actions { display: grid; flex: 0 0 min(290px,34%); gap: 11px; }
.academy-cta__actions .btn { justify-content: center; gap: 10px; white-space: normal; text-align: center; }

@keyframes academy-enter {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes academy-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes academy-orbit {
  from { transform: translate3d(0,0,0) scale(.96); }
  to { transform: translate3d(-18px,22px,0) scale(1.04); }
}
@keyframes academy-float {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}
@keyframes academy-stamp {
  0%,100% { transform: rotate(8deg) translateY(0); }
  50% { transform: rotate(4deg) translateY(-5px); }
}

@media (max-width: 980px) {
  .academy-hero__layout { grid-template-columns: minmax(0,1fr) minmax(280px,.8fr); gap: 42px; }
  .academy-hero__visual > img { height: 390px; }
  .academy-topic-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .academy-promise__grid { grid-template-columns: 1fr 1fr; }
  .academy-promise__mark { display: none; }
}
@media (max-width: 700px) {
  .academy-hero { padding-block: 51px 45px; }
  .academy-hero__layout { grid-template-columns: 1fr; gap: 33px; }
  .academy-hero h1 { margin-top: 16px; font-size: clamp(2.65rem,10vw,4rem); }
  .academy-hero__copy > p { font-size: 15px; }
  .academy-hero__visual { width: min(100% - 24px,520px); margin-inline: auto; padding: 0 10px 28px 0; }
  .academy-hero__visual > img { height: clamp(270px,75vw,400px); }
  .academy-visual-card { right: -12px; bottom: 2px; left: -12px; min-height: 75px; padding: 12px; }
  .academy-visual-stamp { top: 16px; right: -20px; width: 78px; height: 78px; font-size: 10px; }
  .academy-promise__grid { grid-template-columns: 1fr; gap: 15px; }
  .academy-promise__intro h2 { max-width: 520px; }
  .academy-promise__grid > p { font-size: 13px; }
  .academy-section-heading { align-items: flex-start; flex-direction: column; gap: 12px; margin-bottom: 24px; }
  .academy-section-heading > p { max-width: 560px; }
  .academy-topic-grid { gap: 11px; }
  .academy-topic-card { padding: 20px 17px 23px; }
  .academy-topic-icon { margin-bottom: 15px; }
  .academy-step-grid { grid-template-columns: 1fr; }
  .academy-step { padding: 19px 0; }
  .academy-step + .academy-step { padding-left: 0; border-top: 1px solid #e3ecee; border-left: 0; }
  .academy-step p { max-width: 460px; }
  .academy-section-heading--steps { flex-direction: row; align-items: flex-end; }
  .academy-faq__layout { grid-template-columns: 1fr; gap: 25px; }
  .academy-cta__inner { align-items: flex-start; flex-direction: column; gap: 25px; }
  .academy-cta__actions { width: 100%; max-width: 400px; flex-basis: auto; }
}
@media (max-width: 420px) {
  .academy-hero__actions { align-items: flex-start; flex-direction: column; gap: 17px; }
  .academy-hero__actions .btn { width: 100%; justify-content: center; }
  .academy-hero__note { align-items: flex-start; margin-top: 25px; }
  .academy-topic-grid { grid-template-columns: 1fr; }
  .academy-topic-card { padding: 20px; }
  .academy-section-heading--steps { align-items: flex-start; flex-direction: column; }
  .academy-cta__actions .btn { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .academy-hero::before, .academy-hero__copy > *, .academy-hero__visual,
  .academy-visual-card, .academy-visual-stamp, .academy-topic-card,
  .academy-topic-icon svg, .academy-text-link span, .academy-topic-card,
  .academy-step { animation: none; transition: none; }
  .academy-hero__visual:hover > img, .academy-topic-card:hover { transform: none; }
}

/* Consistent, easy-to-scan section headings across every page. */
.sh {
  margin-bottom: clamp(2rem, 4vw, 3rem);
  padding-inline: 1rem;
}
.sh-label {
  letter-spacing: 0.14em;
}
.sh h2 {
  max-width: 22ch;
  margin-inline: auto;
  font-size: clamp(1.9rem, 4vw, 3rem);
  line-height: 1.12;
}
.sh h2::after {
  content: "";
  display: block;
  width: 3rem;
  height: 3px;
  margin: 1rem auto 0;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--c-teal), var(--c-pink));
}
.sh p {
  max-width: 58ch;
  margin-inline: auto;
  line-height: 1.75;
}
.page-header h1 {
  letter-spacing: -0.045em;
}
.page-header p {
  line-height: 1.75;
}
@media (max-width: 600px) {
  .sh {
    padding-inline: 0.25rem;
  }
}

/* New editorial sections and tighter layouts for small screens. */
:root { --zvb-shadow: 0 18px 55px rgba(8,47,55,.07); }
a, button { -webkit-tap-highlight-color: transparent; }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid var(--c-pink); outline-offset: 3px; }
.help-strip {
  background: #f6fafb;
  border-block: 1px solid #e3eef0;
  padding-block: clamp(34px,5vw,58px);
}
.help-shell {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: clamp(24px,5vw,68px);
  align-items: center;
}
.help-copy { max-width: 620px; }
.help-eyebrow {
  display: inline-flex; gap: 9px; align-items: center; color: var(--c-teal);
  font: 800 10px/1.2 var(--font-display); letter-spacing: .15em; text-transform: uppercase;
}
.help-live { width: 7px; height: 7px; border-radius: 50%; background: var(--c-pink); box-shadow: 0 0 0 5px rgba(237,30,121,.09); }
.help-copy h2 { max-width: 560px; margin: 11px 0; font-size: clamp(1.45rem,3.1vw,2.45rem); letter-spacing: -.045em; line-height: 1.17; }
.help-copy p { max-width: 540px; margin: 0; color: #576c76; line-height: 1.65; font-size: .95rem; }
.help-action {
  display: flex; gap: 16px; align-items: center; min-width: 340px; padding: 20px 24px;
  border: 1px solid #dce8eb; border-radius: 14px; background: #fff;
  box-shadow: 0 13px 42px rgba(0,62,73,.055); color: #133f49 !important;
  transition: transform .25s,box-shadow .25s,border-color .25s;
}
.help-action:hover { transform: translateY(-3px); border-color: var(--c-teal); box-shadow: 0 16px 45px rgba(0,76,88,.1); }
.help-phone-icon { display: grid; flex: none; place-items: center; width: 46px; height: 46px; border-radius: 11px; background: #e5f4f6; color: var(--c-teal); }
.help-phone-icon svg { width: 23px; height: 23px; }
.help-number { display: flex; flex-direction: column; gap: 3px; }
.help-number small { color: #687e86; font: 700 11px/1.3 var(--font-display); }
.help-number strong { color: #073e49; font: 800 clamp(17px,2vw,22px)/1.25 var(--font-display); white-space: nowrap; letter-spacing: -.03em; }
.help-arrow { margin-left: auto; color: var(--c-teal); font: 800 22px/1 var(--font-display); }
.next-step { padding-block: clamp(62px,8vw,110px); border-top: 1px solid #e8eef0; background: #fff; }
.next-step-layout {
  position: relative; display: flex; align-items: center; justify-content: space-between;
  gap: 35px; overflow: hidden; padding: clamp(30px,5.2vw,70px); border-radius: 22px; background: #f1f8f9;
}
.next-step-layout::before { position: absolute; top: 0; bottom: 0; left: 0; width: 5px; background: var(--c-teal); content: ""; }
.next-step-content { position: relative; z-index: 1; max-width: 630px; }
.next-step-content h2 { margin: 8px 0 17px; font-size: clamp(2rem,4vw,3.25rem); letter-spacing: -.05em; line-height: 1.12; }
.next-step-content p { max-width: 530px; margin: 0; color: #546971; font-size: 1rem; line-height: 1.7; }
.next-step-actions { position: relative; z-index: 1; display: flex; flex: none; flex-direction: column; align-items: flex-start; gap: 16px; }
.next-step-actions .btn { display: inline-flex; min-height: 51px; justify-content: space-between; gap: 20px; border-radius: 8px; }
.next-step-link { display: inline-flex; align-items: center; gap: 13px; color: var(--c-teal); font: 700 13px/1.3 var(--font-display); }
.news-teaser { padding-block: clamp(65px,7vw,100px); background: #fff; }
.news-teaser-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 22px; margin-bottom: 34px; }
.news-teaser-head h2, .news-intro h2 { margin-top: 5px; font-size: clamp(2rem,4vw,3.25rem); letter-spacing: -.055em; }
.news-view-all { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 5px; font: 800 13px/1.2 var(--font-display); white-space: nowrap; }
.news-view-all svg { width: 18px; height: 18px; }
.news-teaser-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; }
.news-card {
  display: flex; min-width: 0; flex-direction: column; overflow: hidden;
  border: 1px solid #e2eaec; border-radius: 17px; background: #fff;
  transition: transform .3s,box-shadow .3s,border-color .3s;
}
.news-card:hover { transform: translateY(-4px); border-color: rgba(0,123,141,.24); box-shadow: var(--zvb-shadow); }
.news-card-art { position: relative; display: flex; min-height: 145px; align-items: center; justify-content: flex-end; overflow: hidden; padding: 25px; background: #e8f5f6; }
.news-card-art::before { position: absolute; top: -175px; left: -60px; width: 280px; height: 280px; border: 1px solid rgba(0,123,141,.16); border-radius: 50%; box-shadow: 0 0 0 40px rgba(0,123,141,.035),0 0 0 90px rgba(0,123,141,.02); content: ""; }
.news-card:nth-child(2n) .news-card-art { background: #f1f6f7; }
.news-art-number { position: relative; z-index: 1; color: rgba(0,123,141,.11); font: 900 clamp(4rem,9vw,7.5rem)/.9 var(--font-display); letter-spacing: -.09em; user-select: none; }
.news-card-body { display: flex; flex: 1; flex-direction: column; padding: clamp(22px,3vw,35px); }
.news-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 18px; color: #758994; font: 700 11px/1.35 var(--font-display); }
.news-tag { padding: 6px 9px; border-radius: 4px; background: #e8f5f6; color: var(--c-teal); }
.news-card h3 { margin: 0 0 14px; font-size: clamp(1.22rem,2vw,1.7rem); letter-spacing: -.035em; line-height: 1.28; }
.news-card p { margin: 0 0 27px; color: #61767f; font-size: 14px; line-height: 1.75; }
.news-read { display: inline-flex; align-items: center; gap: 8px; margin-top: auto; color: var(--c-teal); font: 800 12.5px/1.2 var(--font-display); }
.news-read span { transition: transform .2s; }
.news-read:hover span { transform: translate(2px,-2px); }
.news-page-header { background: linear-gradient(115deg,#004e5c,var(--c-teal)); text-align: left; }
.news-page-header .container { position: relative; z-index: 1; max-width: 1200px; }
.news-page-header h1 { font-size: clamp(2.2rem,5vw,4.2rem); letter-spacing: -.06em; }
.news-page-header p { max-width: 650px; margin: 10px 0 0; text-align: left; }
.page-kicker { display: block; margin-bottom: 14px; color: rgba(255,255,255,.8); font: 800 10px/1.3 var(--font-display); letter-spacing: .17em; }
.news-intro { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; margin-bottom: 34px; }
.news-intro > p { max-width: 380px; margin: 0; color: #61747e; font-size: 14px; line-height: 1.7; }
.news-controls { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 30px; padding-bottom: 20px; border-bottom: 1px solid #e3ecee; }
.news-filter { min-height: 42px; padding: 11px 16px; border: 1px solid #dbe6e9; border-radius: 100px; background: #fff; color: #557079; cursor: pointer; font: 700 12px/1.2 var(--font-display); transition: background .2s,color .2s,border-color .2s; }
.news-filter:hover, .news-filter.active { border-color: var(--c-teal); background: var(--c-teal); color: #fff; }
.news-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; }
.news-grid .news-card--featured { display: grid; grid-column: span 2; grid-template-columns: 44% 1fr; }
.news-grid .news-card--featured .news-card-art { min-height: 280px; }
.news-grid .news-card--featured .news-art-number { font-size: clamp(6rem,12vw,10rem); }
.news-footnote { display: flex; align-items: center; gap: 18px; margin-top: 32px; }
.news-footnote-rule { height: 1px; flex: 1; background: #e3ecee; }
.news-footnote p { margin: 0; color: #74858d; font-size: 13px; }
.news-footnote a { display: inline-flex; flex: none; gap: 8px; align-items: center; margin-left: auto; color: var(--c-teal); font: 750 12px/1.4 var(--font-display); }
.news-empty { grid-column: 1 / -1; color: var(--c-text-muted); }
body.mobile-menu-is-open { overflow: hidden; }

@media (max-width: 768px) {
  .help-shell { grid-template-columns: 1fr; gap: 20px; }
  .help-action { width: 100%; }
  .next-step-layout { align-items: flex-start; flex-direction: column; gap: 24px; }
  .app-showcase { gap: 28px; }
  .app-phones { max-width: 100%; align-self: center; }
  .app-phone { width: clamp(102px,19vw,133px); max-width: 38vw; }
  .app-features { width: 100%; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-feat { min-width: 0; text-align: left; }
  .news-intro { align-items: flex-start; flex-direction: column; gap: 12px; }
  .news-intro > p { max-width: 100%; }
  .news-grid .news-card--featured { grid-template-columns: 1fr; }
  .news-grid .news-card--featured .news-card-art { min-height: 155px; }
  .ft-grid { gap: 25px; }
  .ft-bottom { gap: 16px; }
}
@media (max-width: 560px) {
  .nav-top-inner { height: 27px; padding-inline: 16px; }
  .nav-topline { height: 27px; }
  .nav-top-signature { max-width: 65%; font-size: 9px; letter-spacing: .012em; white-space: nowrap; }
  .nav-top-phone { gap: 4px; }
  .nav-top-phone span { display: none; }
  .nav-top-phone strong { font-size: 9px; }
  .nav-inner { height: 66px; padding-inline: 16px; }
  .nav-brand img { max-width: 178px; max-height: 44px; height: 44px; }
  .nav-toggle { width: 43px; height: 43px; border: 1px solid #d9e8eb; border-radius: 11px; }
  .nav-mobile { max-height: calc(100dvh - 66px); padding-bottom: env(safe-area-inset-bottom,0px); }
  .nav-mobile-inner { padding: 9px 20px 25px; }
  .nav-mobile-inner > a:not(.mobile-phone) { min-height: 46px; padding-block: 9px; font-size: 15px; }
  .mobile-actions { gap: 8px; padding-top: 18px; }
  .mobile-actions a { min-height: 48px; padding-inline: 7px; font-size: 12px; text-align: center; }
  .mobile-phone { margin-top: 16px; }
  .band { padding-block: 47px; }
  .hero { min-height: calc(100svh - 93px); max-height: 900px; }
  .hero-content { align-items: flex-start; padding: 63px 21px 75px; text-align: left; }
  .hero h1 { max-width: 100%; margin-bottom: 20px; font-size: clamp(2.23rem,9.4vw,3.35rem); letter-spacing: -.05em; line-height: 1.09; text-wrap: pretty; }
  .hero h1 br { display: none; }
  .hero-sub { max-width: 400px; margin-bottom: 24px; font-size: 15px; line-height: 1.68; }
  .hero-btns { display: grid; width: 100%; max-width: 340px; grid-template-columns: 1fr; gap: 11px; }
  .hero-btns .btn { width: 100%; min-height: 51px; justify-content: center; padding: 11px 15px; font-size: 14px; }
  .hero-video video { object-position: 55% center; }
  .hero-particles, .hero-glow, .hero-grid, .scroll-indicator { display: none !important; }
  .app-showcase { gap: 23px; }
  .app-phone { width: clamp(102px,32vw,133px); max-width: 38vw; }
  .app-phone:nth-child(2), .app-phone:nth-child(3) { margin-left: -23px; }
  .app-features { grid-template-columns: 1fr; gap: 10px; }
  .app-feat { padding: 13px 14px; }
  .help-strip { padding-block: 35px; }
  .help-copy h2 { margin: 12px 0; font-size: clamp(1.58rem,7vw,2.15rem); }
  .help-copy p { font-size: 14px; }
  .help-action { min-width: 0; gap: 12px; padding: 16px 15px; border-radius: 12px; }
  .help-phone-icon { width: 40px; height: 40px; }
  .help-number strong { font-size: clamp(17px,5vw,22px); }
  .next-step { padding-block: 52px; }
  .next-step-layout { gap: 24px; padding: 29px 23px 32px; border-radius: 14px; }
  .next-step-content h2 { margin: 9px 0 15px; font-size: clamp(1.98rem,8.2vw,2.75rem); }
  .next-step-content p { font-size: 14px; }
  .next-step-actions { width: 100%; gap: 17px; }
  .next-step-actions .btn { width: 100%; justify-content: space-between; }
  .news-teaser-head { align-items: flex-start; flex-direction: column; gap: 14px; margin-bottom: 20px; }
  .news-teaser-head h2 { font-size: clamp(1.9rem,8vw,2.55rem); }
  .news-teaser-grid, .news-grid { grid-template-columns: 1fr; gap: 13px; }
  .news-card-art { min-height: 103px; padding: 16px; }
  .news-art-number { font-size: 4.6rem; }
  .news-card-body { padding: 21px; }
  .news-card h3 { font-size: 1.28rem; line-height: 1.3; }
  .news-card p { margin-bottom: 21px; font-size: 13px; }
  .news-grid .news-card--featured { grid-column: auto; }
  .news-grid .news-card--featured .news-card-art { min-height: 118px; }
  .news-grid .news-card--featured .news-art-number { font-size: 5.2rem; }
  .news-page-header { padding-block: 48px; }
  .news-page-header h1 { font-size: clamp(2.1rem,8.5vw,3rem); }
  .news-page-header p, .news-intro > p { font-size: 14px; }
  .news-controls { gap: 8px; margin-bottom: 19px; padding-bottom: 16px; }
  .news-filter { min-height: 41px; padding: 10px 12px; font-size: 11px; }
  .news-footnote { align-items: flex-start; flex-direction: column; gap: 11px; }
  .news-footnote-rule { width: 100%; flex: auto; }
  .news-footnote a { margin-left: 0; }
  .form-grid { grid-template-columns: 1fr; gap: 14px; }
  .fg.full { grid-column: 1; }
  .fg input, .fg select, .fg textarea { width: 100%; min-height: 48px; font-size: 16px; }
  .contact-grid { grid-template-columns: 1fr; gap: 30px; }
  .c-item { min-width: 0; }
  .c-item p { overflow-wrap: anywhere; }
  .cta-band { padding-block: 54px; }
  .cta-band .btn-row { display: grid; max-width: 360px; grid-template-columns: 1fr; gap: 12px; margin-inline: auto; }
  .cta-band .btn-row .btn { width: 100%; min-width: 0; justify-content: center; text-align: center; white-space: normal; }
  .partners-heading { align-items: flex-start; flex-direction: column; gap: 13px; }
  .partners-heading p { max-width: 100%; }
  .partners-list { gap: 8px; }
  .partner-card { min-width: 0; min-height: 105px; flex-basis: calc(50% - 4px); padding: 12px 7px; }
  .partner-image img { max-width: 100%; max-height: 44px; }
  .partner-name { font-size: 10px; }
  .ft-grid { grid-template-columns: 1fr 1fr; gap: 23px 18px; padding-bottom: 24px; }
  .ft-brand { grid-column: 1 / -1; }
  .ft-bottom { display: flex; align-items: flex-start; flex-direction: column; gap: 20px; font-size: 11px; }
}
@media (max-width: 380px) {
  .nav-top-signature { max-width: 58%; font-size: 8px; }
  .hero-content { padding-inline: 17px; }
  .hero h1 { font-size: clamp(2rem,9vw,2.3rem); }
  .portal-card { max-width: calc(100% - 2rem); }
  .news-filter { padding-inline: 10px; }
  .values-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
  .val { min-width: 0; padding: 15px 9px; }
  .val h4 { font-size: 13px; overflow-wrap: anywhere; }
  .val p { font-size: 11.5px; line-height: 1.55; }
}
@media (max-width: 340px) {
  .nav-brand img { max-width: 150px; }
  .nav-toggle { width: 40px; height: 40px; }
  .nav-top-phone strong { font-size: 8px; }
  .next-step-layout { padding-inline: 18px; }
  .news-card-body { padding: 17px; }
}
@media (prefers-reduced-motion: reduce) {
  .help-action, .news-card, .news-read span { transition: none; }
  .help-action:hover, .news-card:hover { transform: none; }
}