/* ==========================================================================
   NOVA WEBSITE DESIGNS — GLOBAL STYLESHEET
   Shared design system used by every page (index, about, services, faq, contact)
   Sections: Tokens > Reset > Base Type > Layout > Components > Page Sections > Motion > Responsive
   ========================================================================== */

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

/* ---------- 1. DESIGN TOKENS ---------- */
:root{
  /* Backgrounds */
  --bg-void:#05060d;
  --bg-base:#0a0c1a;
  --bg-alt:#0d1024;
  --bg-elevated:#12142a;
  --bg-card: rgba(148,163,255,0.045);
  --bg-card-strong: rgba(148,163,255,0.075);
  --bg-card-hover: rgba(148,163,255,0.09);

  /* Borders */
  --border-subtle: rgba(168,178,255,0.14);
  --border-strong: rgba(168,178,255,0.30);
  --border-hover: rgba(180,150,255,0.45);
  --border-card-rest: rgba(255,255,255,0.07);
  --border-frame: rgba(150,130,255,0.20);

  /* Text */
  --text-primary:#f5f6fb;
  --text-secondary:#a7adc9;
  --text-tertiary:#6d7392;
  --text-on-gradient:#ffffff;

  /* Accents */
  --blue-500:#4d7dff;
  --blue-400:#7599ff;
  --violet-500:#9257ff;
  --violet-400:#b385ff;
  --gradient-brand: linear-gradient(120deg,#3f6bff 0%,#7c5cff 52%,#a855f7 100%);
  --gradient-brand-hover: linear-gradient(120deg,#5c8dff 0%,#9273ff 52%,#bd6ef5 100%);
  --gradient-text: linear-gradient(120deg,#7fa3ff 0%,#b083ff 60%,#d19bff 100%);
  --gradient-border: linear-gradient(120deg,#4d7dff,#9257ff);
  --glow-blue: rgba(77,125,255,0.30);
  --glow-violet: rgba(146,87,255,0.28);

  /* Feedback */
  --success:#34d399;
  --success-bg: rgba(52,211,153,0.10);
  --error:#f87171;
  --error-bg: rgba(248,113,113,0.10);

  /* Radius */
  --radius-sm:10px;
  --radius-md:14px;
  --radius-lg:22px;
  --radius-xl:30px;
  --radius-pill:999px;

  /* Shadow */
  --shadow-card: 0 24px 60px -30px rgba(0,0,0,0.65);
  --shadow-card-hover: 0 30px 70px -28px rgba(20,10,60,0.55), 0 0 32px -6px rgba(146,87,255,0.25);
  --shadow-glow-sm: 0 0 0 1px var(--border-subtle);

  /* Layout */
  --container-xl: 1340px;
  --container-lg: 980px;
  --container-md: 760px;
  --header-h: 98px;

  /* Motion */
  --ease: cubic-bezier(.4,0,.2,1);
  --t-fast: 160ms var(--ease);
  --t-base: 280ms var(--ease);
  --t-slow: 520ms var(--ease);

  /* Font */
  --font-sans: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-heading: 'Space Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* ---------- 2. RESET ---------- */
*,*::before,*::after{ box-sizing:border-box; }
*{ margin:0; padding:0; }
html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  overflow-x:hidden;
}
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
}
[id]{ scroll-margin-top: calc(var(--header-h) + 24px); }
/* Keep the fixed header from covering focused/scrolled-to controls
   (keyboard focus, browser find-in-page, programmatic scrollIntoView). */
input, textarea, select, button, a, [tabindex]{
  scroll-margin-top: calc(var(--header-h) + 20px);
}
body{
  background:var(--bg-void);
  color:var(--text-primary);
  font-family:var(--font-sans);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
  cursor:default;
}
img,video{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; cursor:pointer; }
button{ font-family:inherit; cursor:pointer; }
ul,ol{ list-style:none; }
input,textarea,select{ font-family:inherit; font-size:inherit; color:inherit; }
input[type="text"],input[type="email"],input[type="tel"],input[type="url"],textarea{ cursor:text; }
select{ cursor:default; }
svg{ display:block; }
fieldset{ border:0; padding:0; margin:0; min-width:0; }
legend{ padding:0; width:100%; }

/* Focus visibility — accessible everywhere */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible{
  outline: 2px solid var(--blue-400);
  outline-offset: 3px;
  border-radius: 4px;
}

.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

.skip-link{
  position:absolute;
  left:1rem; top:-60px;
  background:var(--bg-elevated);
  color:var(--text-primary);
  padding:.75rem 1.25rem;
  border-radius:var(--radius-sm);
  border:1px solid var(--border-strong);
  z-index:200;
  transition: top var(--t-fast);
}
.skip-link:focus{ top:1rem; }

/* ---------- 3. TYPOGRAPHY ---------- */
h1,h2,h3,h4{
  font-family:var(--font-heading);
  font-weight:700;
  line-height:1.12;
  letter-spacing:-0.015em;
  color:var(--text-primary);
}
h1{ font-size:clamp(2.4rem, 4.6vw + 1rem, 4.25rem); }
h2{ font-size:clamp(1.9rem, 2.6vw + 1rem, 2.75rem); }
h3{ font-size:clamp(1.2rem, 1vw + 1rem, 1.5rem); font-weight:600; letter-spacing:-0.01em;}
h4{ font-size:1.05rem; font-weight:600; }

p{ color:var(--text-secondary); }
.lede{
  font-size:clamp(1.05rem,.4vw + 1rem,1.25rem);
  color:var(--text-secondary);
  line-height:1.65;
}

.text-primary{ color:var(--text-primary); }
.text-secondary{ color:var(--text-secondary); }
.text-tertiary{ color:var(--text-tertiary); }

.gradient-text{
  background:var(--gradient-text);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--blue-400);
}
.eyebrow::before{
  content:"";
  width:7px; height:7px;
  border-radius:50%;
  background:var(--gradient-brand);
  box-shadow:0 0 12px var(--glow-blue);
  flex-shrink:0;
}
.eyebrow .cursor{
  display:inline-block;
  width:2px; height:.9em;
  background:var(--gradient-brand);
  margin-left:.15rem;
  animation: blink 1.1s steps(1) infinite;
}
@media (prefers-reduced-motion: reduce){
  .eyebrow .cursor{ animation:none; opacity:.7; }
}
@keyframes blink{ 0%,45%{opacity:1;} 46%,100%{opacity:0;} }

/* ---------- 4. LAYOUT ---------- */
.container{
  width:100%;
  max-width:var(--container-xl);
  margin-inline:auto;
  padding-inline:1.5rem;
}
.container-lg{ max-width:var(--container-lg); margin-inline:auto; padding-inline:1.5rem; }
.container-md{ max-width:var(--container-md); margin-inline:auto; padding-inline:1.5rem; }

.section{
  padding-block: clamp(3rem, 3.2vw, 3.75rem);
  position:relative;
}
.section-alt{ background:var(--bg-alt); }
.section-tight{ padding-block: clamp(2.25rem,2.2vw,2.5rem); }

.section-head{
  max-width:660px;
  margin-bottom: clamp(1.5rem,3vw,2.25rem);
}
/* Centered section heads keep the eyebrow centered with the main heading. */
.section-head.center{
  max-width:none;
  margin-inline:auto;
  text-align:center;
}
.section-head.center .eyebrow{ display:flex; justify-content:center; text-align:center; }
.section-head.center > h2,
.section-head.center > .lede{
  max-width:660px;
  margin-inline:auto;
}
.section-head h2{ margin-top:.6rem; }
.section-head .lede{ margin-top:.9rem; }

.grid{ display:grid; gap:1.5rem; }
.grid-2{ grid-template-columns:repeat(2,1fr); }
.grid-3{ grid-template-columns:repeat(3,1fr); }
.grid-4{ grid-template-columns:repeat(4,1fr); }

.stack{ display:flex; flex-direction:column; }
.cluster{ display:flex; align-items:center; flex-wrap:wrap; gap:.75rem 1rem; }

.divider{
  height:1px;
  position:relative;
  background:linear-gradient(90deg, transparent, rgba(77,125,255,.5) 25%, rgba(168,120,255,.55) 50%, rgba(77,125,255,.5) 75%, transparent);
  border:0;
  margin-inline:auto;
  max-width:var(--container-xl);
}
.divider::after{
  content:"";
  position:absolute; inset:-8px 0;
  background:linear-gradient(90deg, transparent, rgba(120,100,255,.14) 50%, transparent);
  filter:blur(6px);
  pointer-events:none;
}

/* ambient background glow used behind sections */
.glow-field{ position:relative; isolation:isolate; }
.glow-field::before{
  content:"";
  position:absolute; inset:-10% -10% auto -10%;
  height:640px;
  background:
    radial-gradient(480px 320px at 12% 20%, var(--glow-blue), transparent 70%),
    radial-gradient(520px 360px at 88% 30%, var(--glow-violet), transparent 70%);
  opacity:.55;
  filter:blur(10px);
  z-index:-1;
  pointer-events:none;
}

/* ---------- 5. BUTTONS ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;
  padding: .95rem 1.7rem;
  font-size:.98rem;
  font-weight:700;
  border-radius:var(--radius-md);
  border:1px solid transparent;
  transition: transform var(--t-fast), box-shadow var(--t-fast), background var(--t-fast), border-color var(--t-fast), opacity var(--t-fast);
  white-space:nowrap;
  min-height:52px;
}
.btn:active{ transform: translateY(1px); }

.btn-primary{
  position:relative;
  overflow:hidden;
  background:var(--gradient-brand);
  color:#fff;
  box-shadow: 0 16px 40px -14px var(--glow-violet);
}
.btn-primary::after{
  content:"";
  position:absolute; top:0; left:-75%; width:50%; height:100%;
  background:linear-gradient(120deg, transparent, rgba(255,255,255,0.45), transparent);
  transform:skewX(-20deg);
  pointer-events:none;
}
.btn-primary:hover::after{ animation: btnShine .9s ease; }
@keyframes btnShine{ to{ left:125%; } }
.btn-primary:hover{
  background:var(--gradient-brand-hover);
  box-shadow: 0 20px 46px -12px var(--glow-violet);
  transform: translateY(-2px);
}

.btn-secondary{
  background:rgba(255,255,255,0.02);
  color:var(--text-primary);
  border-color:var(--border-strong);
}
.btn-secondary:hover{
  border-color:var(--border-hover);
  background:rgba(146,87,255,0.08);
  transform: translateY(-2px);
}

.btn-ghost{
  background:transparent;
  color:var(--blue-400);
  padding:.6rem .2rem;
  min-height:auto;
  font-weight:700;
}
.btn-ghost::after{
  content:"→";
  margin-left:.4rem;
  transition: transform var(--t-fast);
  display:inline-block;
}
.btn-ghost:hover::after{ transform:translateX(4px); }

.btn-block{ width:100%; }
.btn-lg{ padding:1.05rem 2rem; font-size:1.02rem; }

/* ---------- 6. CARDS ---------- */
.card{
  background:var(--bg-card);
  border:1px solid var(--border-card-rest);
  border-radius:var(--radius-lg);
  padding: 1.4rem;
  cursor:default;
  transition: transform var(--t-base), border-color var(--t-base), background var(--t-base), box-shadow var(--t-base);
}
.card:hover{
  transform: translateY(-4px);
  border-color:var(--border-hover);
  background:var(--bg-card-hover);
  box-shadow: var(--shadow-card-hover);
}
.card-compact{ padding:1.4rem 1.5rem; }
.card-compact .icon-tile{ width:46px; height:46px; margin-bottom:.8rem; }
.card-compact .icon-tile svg{ width:20px; height:20px; }
.card-compact h3{ font-size:1.02rem; }
.card-compact p{ margin-top:.4rem; font-size:.87rem; }

.icon-tile{
  width:56px; height:56px;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background: radial-gradient(circle at 35% 30%, var(--blue-400), var(--violet-500));
  border:none;
  color:#fff;
  margin-bottom:1.1rem;
  flex-shrink:0;
  box-shadow: 0 0 0 4px rgba(146,87,255,.12), 0 10px 26px -8px var(--glow-violet);
  transition: box-shadow var(--t-base), transform var(--t-base);
  animation: badgeBreathe 2.6s ease-in-out infinite;
}
@keyframes badgeBreathe{
  0%,100%{ box-shadow: 0 0 0 4px rgba(146,87,255,.12), 0 10px 26px -8px var(--glow-violet); }
  50%{ box-shadow: 0 0 0 7px rgba(146,87,255,.16), 0 14px 32px -6px var(--glow-violet); }
}
.grid-4 > *:nth-child(2) .icon-tile, .grid-3 > *:nth-child(2) .icon-tile, .process-list > *:nth-child(2) .step-icon,
.values-grid > *:nth-child(2) .icon-tile, .policy-grid > *:nth-child(2) .icon-tile{ animation-delay:.5s; }
.grid-4 > *:nth-child(3) .icon-tile, .grid-3 > *:nth-child(3) .icon-tile, .process-list > *:nth-child(3) .step-icon,
.values-grid > *:nth-child(3) .icon-tile, .policy-grid > *:nth-child(3) .icon-tile{ animation-delay:1s; }
.grid-4 > *:nth-child(4) .icon-tile, .process-list > *:nth-child(4) .step-icon,
.values-grid > *:nth-child(4) .icon-tile, .policy-grid > *:nth-child(4) .icon-tile{ animation-delay:1.5s; }
.icon-tile svg{ filter: drop-shadow(0 1px 1px rgba(0,0,0,.15)); }
.card:hover .icon-tile,
.value-item:hover .icon-tile,
.policy-card:hover .icon-tile{
  box-shadow: 0 0 0 6px rgba(146,87,255,.18), 0 14px 34px -8px var(--glow-violet);
  transform:translateY(-2px) scale(1.04);
}
.icon-tile svg{ width:22px; height:22px; }

.pill{
  display:inline-flex;
  align-items:center;
  padding:.4rem .85rem;
  font-size:.82rem;
  font-weight:600;
  color:var(--text-secondary);
  background:rgba(255,255,255,0.03);
  border:1px solid var(--border-card-rest);
  border-radius:var(--radius-pill);
  cursor:default;
  transition: border-color var(--t-fast), background var(--t-fast), color var(--t-fast), transform var(--t-fast), box-shadow var(--t-fast);
}
a.pill{ cursor:pointer; }
.pill svg{ flex-shrink:0; }
.pill:hover{
  border-color:var(--border-hover);
  background:rgba(146,87,255,0.1);
  color:var(--text-primary);
  transform:translateY(-2px);
  box-shadow: 0 10px 24px -12px var(--glow-violet);
}
.pill-row{ display:flex; flex-wrap:wrap; gap:.55rem; }
.pill-row-center{ justify-content:center; }

.tag{
  display:inline-flex;
  align-items:center;
  padding:.3rem .7rem;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  border-radius:var(--radius-pill);
  background: rgba(146,87,255,0.14);
  color:var(--violet-400);
  border:1px solid rgba(146,87,255,0.30);
}

.note-card{
  border-radius:var(--radius-md);
  border:1px solid var(--border-card-rest);
  background:rgba(255,255,255,0.02);
  padding:1.1rem 1.3rem;
  font-size:.92rem;
  color:var(--text-secondary);
  cursor:default;
  transition: border-color var(--t-base), background var(--t-base), box-shadow var(--t-base), transform var(--t-base);
}
.note-card:hover{
  border-color:var(--border-hover);
  background:var(--bg-card-hover);
  box-shadow: 0 16px 34px -18px var(--glow-violet);
  transform:translateY(-2px);
}
.note-card strong{ color:var(--text-primary); }

.highlight-line{
  border-left:2px solid transparent;
  border-image: var(--gradient-brand) 1;
  padding-left:1rem;
  font-weight:700;
  color:var(--text-primary);
  font-size:1.05rem;
}

/* checklist used for package inclusions */
.check-list{ display:flex; flex-direction:column; gap:.65rem; margin-top:1.3rem; }
.check-list li{
  display:flex;
  align-items:flex-start;
  gap:.65rem;
  color:var(--text-secondary);
  font-size:.96rem;
  line-height:1.5;
}
.check-list li svg{
  flex-shrink:0;
  width:19px; height:19px;
  margin-top:.14rem;
  color:var(--blue-400);
}

/* ---------- 7. HEADER / NAV ---------- */
.site-header{
  position:fixed;
  inset-inline:0;
  top:0;
  z-index:100;
  height:var(--header-h);
  display:flex;
  align-items:center;
  background:rgba(6,7,16,0.35);
  backdrop-filter: blur(14px) saturate(140%);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  border-bottom:1px solid rgba(130,120,255,0.12);
  transition: background var(--t-base), border-color var(--t-base);
}
.site-header.is-scrolled{
  background:rgba(7,8,18,0.78);
  border-bottom-color:var(--border-subtle);
}
.site-header .container{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
}

.brand{
  display:flex;
  align-items:center;
  gap:.85rem;
  font-family:var(--font-heading);
  font-weight:700;
  font-size:1.28rem;
  color:var(--text-primary);
  flex-shrink:0;
}
.brand img{
  height:64px; width:auto;
  object-fit:contain;
  flex-shrink:0;
}
.brand span{
  letter-spacing:.01em;
  background: linear-gradient(100deg, #eef1ff 0%, #b9c6ff 28%, #9fa8ff 48%, #c398ff 70%, #e2b8ff 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.footer-brand .brand{ font-size:1.3rem; }
.footer-brand .brand img{ height:68px; }

.nav-desktop{
  display:flex;
  align-items:center;
  gap:2.1rem;
}
.nav-desktop a{
  font-size:.94rem;
  font-weight:600;
  color:var(--text-secondary);
  position:relative;
  padding:.3rem 0;
  transition:color var(--t-fast), text-shadow var(--t-fast);
}
.nav-desktop a::after{
  content:"";
  position:absolute; left:0; right:0; bottom:-6px;
  height:2px;
  background:var(--gradient-brand);
  border-radius:2px;
  transform:scaleX(0);
  opacity:0;
  transition: transform var(--t-base), opacity var(--t-base);
}
.nav-desktop a:hover{
  color:var(--text-primary);
  text-shadow: 0 0 18px rgba(146,87,255,0.45);
}
.nav-desktop a:hover::after{
  transform:scaleX(1);
  opacity:1;
}
.nav-desktop a[aria-current="page"]{ color:var(--text-primary); }
.nav-desktop a[aria-current="page"]::after{
  transform:scaleX(1);
  opacity:1;
}
@media (prefers-reduced-motion: reduce){
  .nav-desktop a::after{ transition:none; }
  .nav-desktop a:hover{ text-shadow:none; }
  .footer-col a:hover{ text-shadow:none; }
}

.nav-actions{ display:flex; align-items:center; gap:1rem; }
.nav-actions .btn{ padding:.7rem 1.3rem; min-height:44px; font-size:.9rem; }

.nav-toggle{
  display:none;
  align-items:center; justify-content:center;
  width:44px; height:44px;
  background:transparent;
  border:1px solid var(--border-subtle);
  border-radius:var(--radius-sm);
  color:var(--text-primary);
}
.nav-toggle svg{ width:20px; height:20px; overflow:visible; }
.nav-toggle .l1,.nav-toggle .l2,.nav-toggle .l3{
  transform-origin:center;
  transition: transform var(--t-base), opacity var(--t-base);
}
.nav-toggle[aria-expanded="true"] .l1{ transform:translateY(6px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .l2{ opacity:0; }
.nav-toggle[aria-expanded="true"] .l3{ transform:translateY(-6px) rotate(-45deg); }
@media (prefers-reduced-motion: reduce){
  .nav-toggle .l1,.nav-toggle .l2,.nav-toggle .l3{ transition:none; }
}

.mobile-nav{
  position:fixed;
  inset:var(--header-h) 0 0 0;
  z-index:99;
  background:rgba(6,7,16,0.98);
  backdrop-filter: blur(16px);
  transform:translateY(-8px);
  opacity:0;
  pointer-events:none;
  transition: opacity var(--t-base), transform var(--t-base);
  overflow-y:auto;
}
.mobile-nav.is-open{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}
.mobile-nav .container{
  padding-top:2rem;
  padding-bottom:2.5rem;
  display:flex;
  flex-direction:column;
  gap:.35rem;
}
.mobile-nav a{
  font-size:1.4rem;
  font-weight:700;
  color:var(--text-primary);
  padding:.85rem 0;
  border-bottom:1px solid var(--border-subtle);
}
.mobile-nav a[aria-current="page"]{
  background:var(--gradient-text);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.mobile-nav .nav-actions{
  margin-top:1.5rem;
  flex-direction:column;
  align-items:stretch;
}

@media (max-width: 900px){
  .nav-desktop, .nav-actions.desktop-only{ display:none; }
  .nav-toggle{ display:flex; }
  .brand{ font-size:1.08rem; gap:.6rem; }
  .brand img{ height:50px; }
}
@media (min-width: 901px){
  .mobile-nav{ display:none; }
}

/* ---------- 8. HERO ---------- */
.hero{
  position:relative;
  min-height:min(680px, 92svh);
  display:flex;
  align-items:center;
  padding-top:var(--header-h);
  overflow:hidden;
  isolation:isolate;
}
.hero-media{
  position:absolute; inset:0;
  z-index:-2;
  background:#050308;
}
.hero-media video,
.hero-media img{
  width:100%; height:100%;
  object-fit:cover;
  object-position:center 65%;
}
.hero-overlay{
  position:absolute; inset:0;
  z-index:-1;
  background:
    radial-gradient(720px 460px at 18% 15%, rgba(77,125,255,0.32), transparent 60%),
    radial-gradient(640px 500px at 85% 75%, rgba(146,87,255,0.28), transparent 62%),
    linear-gradient(180deg, rgba(5,6,13,0.76) 0%, rgba(5,6,13,0.70) 35%, rgba(5,6,13,0.85) 100%);
}
.hero-inner{
  padding-block: clamp(2.25rem,5vw,3.25rem);
  width:min(1120px, 94%);
  max-width:none;
  margin-inline:auto;
  text-align:center;
}
.hero h1{ margin-top:1.1rem; }
.hero .hero-line{ display:block; }
.hero .lede{ margin-top:1.2rem; max-width:980px; margin-inline:auto; }
.hero-ctas{ display:flex; flex-wrap:wrap; justify-content:center; gap:1rem; margin-top:1.75rem; }
.hero-inner > .eyebrow{ justify-content:center; }
.hero-benefits{
  margin-top:2rem;
  display:flex;
  flex-wrap:wrap;
  gap:.6rem 1.6rem;
  font-size:.88rem;
  font-weight:600;
  color:var(--text-secondary);
}
.hero-benefits span{ display:flex; align-items:center; gap:.5rem; }
.hero-benefits span::before{
  content:"";
  width:5px; height:5px; border-radius:50%;
  background:var(--blue-400);
}

/* page hero (non-video, inner pages) */
.page-hero{
  padding-top: calc(var(--header-h) + clamp(3.5rem,7vw,5.5rem));
  padding-bottom: clamp(2.5rem,5vw,4rem);
  position:relative;
}
.page-hero .eyebrow{ margin-bottom:1rem; }
.page-hero .lede{ margin-top:1.1rem; max-width:640px; }

.hero-centered{
  text-align:center;
  max-width:800px;
  margin-inline:auto;
}
.hero-centered h1{ margin-top:.9rem; margin-bottom:1.75rem; }
.hero-centered .lede{ max-width:none; margin-inline:auto; }
.hero-centered .btn{ margin-inline:auto; }

/* Minimal intro-centering, used where only alignment should change
   (existing spacing/typography must stay exactly as-is). */
.intro-centered{
  text-align:center;
  max-width:none;
  margin-inline:auto;
}
.intro-centered .eyebrow{ display:flex; justify-content:center; text-align:center; }
.intro-centered > h1,
.intro-centered > h2,
.intro-centered > .lede{
  max-width:760px;
  margin-inline:auto;
}
.intro-centered .lede{ max-width:760px; }

.intro-left{ max-width:800px; }
.intro-left .lede{ max-width:none; }

/* ---------- 9. PROCESS STEPS ---------- */
.process-list{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1.5rem;
  counter-reset: step;
  margin-top:1rem;
}
.process-step{
  position:relative;
  padding:1.4rem 1.4rem 1.3rem;
  border:1px solid var(--border-card-rest);
  border-radius:var(--radius-lg);
  background:var(--bg-card);
  cursor:default;
  transition: transform var(--t-base), border-color var(--t-base), background var(--t-base), box-shadow var(--t-base);
}
.process-step:hover{
  transform: translateY(-4px);
  border-color:var(--border-hover);
  background:var(--bg-card-hover);
  box-shadow: var(--shadow-card-hover);
}
.process-step .step-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:.5rem;
}
.process-step .step-icon{
  width:44px; height:44px;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background: radial-gradient(circle at 35% 30%, var(--blue-400), var(--violet-500));
  border:none;
  color:#fff;
  flex-shrink:0;
  box-shadow: 0 0 0 4px rgba(146,87,255,.12), 0 8px 20px -6px var(--glow-violet);
  transition: box-shadow var(--t-base), transform var(--t-base);
  animation: badgeBreathe 2.6s ease-in-out infinite;
}
.process-step:hover .step-icon{
  box-shadow: 0 0 0 6px rgba(146,87,255,.18), 0 12px 28px -6px var(--glow-violet);
  transform: scale(1.06);
}
.process-step .step-icon svg{ width:19px; height:19px; filter: drop-shadow(0 1px 1px rgba(0,0,0,.15)); }
.process-step .step-num{
  font-family:var(--font-heading);
  font-size:2.6rem;
  font-weight:700;
  line-height:1;
  background:var(--gradient-text);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  opacity:.95;
}
.process-step h3{
  margin-top:1rem;
  color:#fff;
}
.process-step p{ margin-top:.68rem; font-size:.95rem; }
.process-connector{
  display:none;
}
@media (min-width: 901px){
  .process-list{ position:relative; }
}

/* ---------- 10. FAQ ACCORDION ---------- */
.faq-group{ margin-bottom: clamp(2rem,4vw,3rem); }
.faq-group-title{
  display:flex;
  align-items:center;
  gap:.6rem;
  font-size:.82rem;
  font-weight:800;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--violet-400);
  margin-bottom:1rem;
  padding-bottom:.75rem;
  border-bottom:1px solid var(--border-subtle);
}
.faq-group-title svg{ width:17px; height:17px; flex-shrink:0; }
.faq-item{
  border:1px solid var(--border-card-rest);
  border-radius:var(--radius-md);
  background:var(--bg-card);
  margin-bottom:.85rem;
  overflow:hidden;
  cursor:default;
  transition: border-color var(--t-base), background var(--t-base);
}
.faq-item:hover{
  border-color:var(--border-hover);
}
.faq-item.is-open{
  border-color:var(--border-hover);
  background:var(--bg-card-strong);
  box-shadow: 0 0 24px -8px rgba(146,87,255,0.28);
}
.faq-question{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:1.2rem 1.4rem;
  background:transparent;
  border:0;
  text-align:left;
  color:var(--text-primary);
  font-size:1rem;
  font-weight:700;
}
.faq-icon{
  flex-shrink:0;
  width:28px; height:28px;
  border-radius:50%;
  border:1px solid var(--border-strong);
  display:flex; align-items:center; justify-content:center;
  position:relative;
  transition: transform var(--t-base), border-color var(--t-base), background var(--t-base);
}
.faq-icon::before,.faq-icon::after{
  content:"";
  position:absolute;
  background:var(--text-secondary);
  transition: transform var(--t-base), opacity var(--t-base), background var(--t-base);
}
.faq-icon::before{ width:10px; height:2px; }
.faq-icon::after{ width:2px; height:10px; }
.faq-item.is-open .faq-icon{ background:var(--gradient-brand); border-color:transparent; }
.faq-item.is-open .faq-icon::before,
.faq-item.is-open .faq-icon::after{ background:#fff; }
.faq-item.is-open .faq-icon::after{ transform:scaleY(0); }

.faq-answer{
  display:grid;
  grid-template-rows:0fr;
  transition: grid-template-rows var(--t-slow);
}
.faq-item.is-open .faq-answer{ grid-template-rows:1fr; }
.faq-answer-inner{ overflow:hidden; }
.faq-answer p{
  padding:0 1.4rem 1.3rem;
  font-size:.96rem;
  line-height:1.65;
  color:var(--text-secondary);
}
@media (prefers-reduced-motion: reduce){
  .faq-answer{ transition:none; }
}

/* ---------- 11. FORMS ---------- */
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1.3rem 1.5rem; }
.field{ display:flex; flex-direction:column; gap:.5rem; }
.field.full{ grid-column:1 / -1; }
.field label,
.field legend{
  font-size:.88rem;
  font-weight:700;
  color:var(--text-primary);
}
.field .optional-tag{
  font-weight:500;
  color:var(--text-tertiary);
  text-transform:none;
  letter-spacing:0;
  font-size:.82rem;
}
.field .helper{ font-size:.82rem; color:var(--text-tertiary); }
.field input[type="text"],
.field input[type="email"],
.field input[type="tel"],
.field input[type="url"],
.field textarea,
.field select{
  width:100%;
  padding:.9rem 1rem;
  background:rgba(255,255,255,0.03);
  border:1px solid var(--border-subtle);
  border-radius:var(--radius-sm);
  color:var(--text-primary);
  transition: border-color var(--t-fast), background var(--t-fast);
}
.field select{ appearance:none; -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23a7adc9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 1rem center;
  padding-right:2.6rem;
}
.field textarea{ min-height:120px; resize:vertical; line-height:1.5; }
.field input::placeholder,
.field textarea::placeholder{ color:var(--text-tertiary); }
.field input:focus,
.field textarea:focus,
.field select:focus{
  outline:none;
  border-color:var(--border-hover);
  background:rgba(255,255,255,0.05);
}
.field.has-error input,
.field.has-error textarea,
.field.has-error select{
  border-color:var(--error);
  background:var(--error-bg);
}
.field-error{
  display:none;
  align-items:center;
  gap:.4rem;
  font-size:.82rem;
  color:var(--error);
  font-weight:600;
}
.field.has-error .field-error{ display:flex; }

.radio-row{ display:flex; flex-wrap:wrap; gap:.7rem; }
.radio-option{
  display:flex;
  align-items:center;
  gap:.55rem;
  padding:.75rem 1.1rem;
  border:1px solid var(--border-subtle);
  border-radius:var(--radius-sm);
  background:rgba(255,255,255,0.02);
  font-size:.9rem;
  font-weight:600;
  color:var(--text-secondary);
  cursor:pointer;
  transition: border-color var(--t-fast), background var(--t-fast), color var(--t-fast);
}
.radio-option input{ accent-color:var(--blue-400); width:16px; height:16px; }
.radio-option:has(input:checked){
  border-color:var(--border-hover);
  background:rgba(146,87,255,0.10);
  color:var(--text-primary);
}
.radio-option:has(input:focus-visible){ outline:2px solid var(--blue-400); outline-offset:2px; }

.form-note{
  font-size:.85rem;
  color:var(--text-tertiary);
  margin-top:1.1rem;
  text-align:center;
}

.form-panel{
  background:var(--bg-card);
  border:1px solid var(--border-card-rest);
  border-radius:var(--radius-xl);
  padding: clamp(1.6rem,4vw,2.75rem);
}

.state-panel{
  display:none;
  text-align:center;
  padding: clamp(2.5rem,6vw,4rem) 1rem;
}
.state-panel.is-visible{ display:block; }
.state-icon{
  width:76px; height:76px;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  margin:0 auto 1.5rem;
}
.state-icon svg{ width:34px; height:34px; }
.state-panel--success .state-icon{ background:var(--success-bg); color:var(--success); border:1px solid rgba(52,211,153,.35); }
.state-panel--error .state-icon{ background:var(--error-bg); color:var(--error); border:1px solid rgba(248,113,113,.35); }
.state-panel h3{ font-size:1.6rem; }
.state-panel p{ margin-top:.75rem; max-width:460px; margin-inline:auto; }
.state-panel .btn{ margin-top:1.75rem; }

/* ---------- 12. FOOTER ---------- */
.site-footer{
  border-top:1px solid var(--border-subtle);
  padding-block: clamp(3rem,5vw,4rem) 2rem;
  background:var(--bg-base);
}
.footer-top{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr;
  gap:2.5rem;
  padding-bottom:2.5rem;
}
.footer-brand{ max-width:320px; }
.footer-brand .brand{ margin-bottom:.9rem; }
.footer-brand p{ font-size:.92rem; }
.footer-brand .location{ margin-top:.85rem; font-size:.86rem; color:var(--text-tertiary); }

.footer-col h4{ font-size:.82rem; letter-spacing:.08em; text-transform:uppercase; color:var(--text-tertiary); margin-bottom:1rem; font-weight:700;}
.footer-col ul{ display:flex; flex-direction:column; gap:.7rem; }
.footer-col a{ font-size:.92rem; color:var(--text-secondary); cursor:pointer; transition:color var(--t-fast), text-shadow var(--t-fast); }
.footer-col a:hover{ color:var(--blue-400); text-shadow: 0 0 14px rgba(146,87,255,0.35); }

.footer-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:1rem;
  padding-top:1.75rem;
  border-top:1px solid var(--border-subtle);
  font-size:.84rem;
  color:var(--text-tertiary);
}
.footer-bottom .mascot-line{
  display:flex; align-items:center; gap:.5rem;
}

/* ---------- 13. MOTION / REVEAL ---------- */
/* Visible by default — progressive enhancement. The 'js-reveal' class is set
   synchronously in <head> only once JS is confirmed running, so pages never
   depend on JS to show their content (no-JS / blocked-script visitors still
   see everything, just without the entrance animation). */
[data-reveal]{
  opacity:1;
  transform:none;
  transition: opacity .7s var(--ease), transform .7s var(--ease);
}
.js-reveal [data-reveal]{ opacity:0; transform:translateY(18px); }
[data-reveal].is-visible{ opacity:1; transform:translateY(0); }
[data-reveal-group] > *{ transition-delay: calc(var(--i, 0) * 70ms); }

@media (prefers-reduced-motion: reduce){
  [data-reveal]{ opacity:1; transform:none; transition:none; }
  .card, .btn, .value-item, .policy-card, .device-laptop, .device-tablet, .device-phone, .icon-tile, .price-card, .faq-preview-item, .process-step, .step-icon, .mascot-panel, .note-card, .pill, .photo-premium, .collage-frame, .faq-item{ transition:none; }
  .icon-tile, .step-icon, .btn-primary::after{ animation:none; }
}

/* ---------- 14. MISC PAGE COMPONENTS ---------- */
.badge-figure{
  display:flex;
  align-items:center;
  justify-content:center;
}
.badge-figure img{
  width:100%;
  height:auto;
  max-width:420px;
  filter: drop-shadow(0 30px 60px rgba(77,45,255,0.28));
}
.badge-figure.mascot-hover{
  border-radius:var(--radius-lg);
  border:1px solid transparent;
  cursor:default;
  transition: border-color var(--t-base), box-shadow var(--t-base), transform var(--t-base);
}
.badge-figure.mascot-hover:hover{
  border-color:var(--border-hover);
  box-shadow: 0 0 30px -8px var(--glow-violet);
  transform: translateY(-2px);
}
.badge-figure.mascot-hover img{ transition: filter var(--t-base); }
.badge-figure.mascot-hover:hover img{ filter: drop-shadow(0 34px 64px rgba(77,45,255,0.4)); }
@media (prefers-reduced-motion: reduce){
  .badge-figure.mascot-hover,
  .badge-figure.mascot-hover img{ transition:none; }
}
.mascot-panel{
  background:var(--bg-card);
  border:1px solid var(--border-card-rest);
  border-radius:var(--radius-xl);
  padding: clamp(1.75rem,3vw,2.5rem);
  text-align:center;
  cursor:default;
  transition: transform var(--t-base), border-color var(--t-base), background var(--t-base), box-shadow var(--t-base);
}
.mascot-panel:hover{
  transform: translateY(-4px);
  border-color:var(--border-hover);
  background:var(--bg-card-hover);
  box-shadow: var(--shadow-card-hover);
}
.mascot-panel .badge-figure img{ max-width:220px; }

.values-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:1.4rem; }
.value-item{
  padding:1.4rem;
  border:1px solid var(--border-card-rest);
  border-radius:var(--radius-lg);
  background:var(--bg-card);
  cursor:default;
  transition: transform var(--t-base), border-color var(--t-base), background var(--t-base), box-shadow var(--t-base);
}
.value-item:hover{
  transform: translateY(-4px);
  border-color:var(--border-hover);
  background:var(--bg-card-hover);
  box-shadow: var(--shadow-card-hover);
}
.value-item h3{ font-size:1.1rem; }
.value-item p{ margin-top:.5rem; font-size:.94rem; }

.split{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap: clamp(2rem,5vw,4rem);
  align-items:center;
}
.split.split-top{ align-items:flex-start; }
.what-we-build-split{ align-items:flex-start; }
.meet-nova-section{ padding-block: clamp(2.5rem, 2.7vw, 3.1rem); }
.meet-nova-split{ align-items:flex-start; }
.meet-nova-copy{ text-align:left; padding-top:.2rem; }
.meet-nova-copy .eyebrow{ display:flex; width:fit-content; margin-left:0; margin-right:0; justify-content:flex-start; text-align:left; }
.meet-nova-copy h2{ width:100%; max-width:590px; margin-left:0; margin-right:0; padding-left:0; text-align:left; }
.meet-nova-copy .lede{ margin-left:0; margin-right:0; max-width:590px; text-align:left !important; }
.meet-nova-support{ font-size:clamp(.9rem, 1vw, .98rem); line-height:1.5; margin-top:.45rem !important; }
.meet-nova-approval{ font-size:clamp(.88rem, .95vw, .96rem); line-height:1.45; margin-top:.75rem !important; }
.split.about-hero-split{ grid-template-columns: 1.7fr 1fr; }
.split.reverse .split-media{ order:2; }

.callout-row{ display:flex; flex-wrap:wrap; gap:.9rem; margin-top:1.6rem; }
.callout-chip{
  padding:.6rem 1.1rem;
  border-radius:var(--radius-pill);
  border:1px solid var(--border-card-rest);
  background:rgba(255,255,255,.02);
  font-size:.86rem;
  font-weight:700;
  color:var(--text-primary);
  display:inline-block;
  cursor:default;
  transition: border-color var(--t-fast), background var(--t-fast), transform var(--t-fast), box-shadow var(--t-fast);
}
.callout-chip:hover{
  border-color:var(--border-hover);
  background:rgba(146,87,255,0.1);
  transform:translateY(-2px);
  box-shadow: 0 10px 24px -12px var(--glow-violet);
}
@media (prefers-reduced-motion: reduce){
  .callout-chip{ transition:none; }
}

.mini-pill-row{
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
  margin-top:1rem;
}
.mini-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.46rem .78rem;
  border-radius:999px;
  border:1px solid rgba(116,144,255,.24);
  background:rgba(255,255,255,.035);
  color:var(--text-secondary);
  font-size:.76rem;
  font-weight:700;
  letter-spacing:.02em;
  box-shadow:0 10px 24px -18px rgba(77,125,255,.35);
  animation:pillFloat 4.4s ease-in-out infinite;
}
.mini-pill:nth-child(2){ animation-delay:.55s; }
.mini-pill:nth-child(3){ animation-delay:1.1s; }
@keyframes pillFloat{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-2px); }
}
@media (prefers-reduced-motion: reduce){
  .mini-pill{ animation:none; }
}


.deposit-callout{
  margin-top:.85rem;
  padding:.7rem .9rem;
  border:1px solid rgba(116,144,255,.24);
  border-radius:var(--radius-md);
  background:rgba(77,125,255,.06);
  font-size:.84rem;
  color:var(--text-secondary);
}
.deposit-callout strong{ color:var(--text-primary); }
.deposit-callout span{ color:var(--text-tertiary); }
.deposit-summary{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:.55rem;
  margin-top:.9rem;
}
.deposit-summary > div{
  padding:.62rem .72rem;
  border:1px solid var(--border-subtle);
  border-radius:var(--radius-md);
  background:rgba(255,255,255,.025);
  display:flex;
  flex-direction:column;
  gap:.2rem;
}
.deposit-summary span{ font-size:.72rem; color:var(--text-tertiary); }
.deposit-summary strong{ font-size:.88rem; color:var(--text-primary); }
@media (max-width:900px){
  .deposit-summary{ grid-template-columns:1fr; }
}

/* Pricing cards */
.pricing-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1.75rem; align-items:stretch; }

.price-card{
  position:relative;
  display:flex;
  flex-direction:column;
  padding: clamp(1.8rem,3vw,2.5rem);
  border-radius:var(--radius-xl);
  border:1px solid var(--border-card-rest);
  background:var(--bg-card);
  cursor:default;
  transition: transform var(--t-base), border-color var(--t-base), background var(--t-base), box-shadow var(--t-base);
}
.price-card:hover{
  transform: translateY(-4px);
  border-color:var(--border-hover);
  background:var(--bg-card-hover);
  box-shadow: var(--shadow-card-hover);
}
@media (prefers-reduced-motion: reduce){
  .price-card{ transition:none; }
}
.price-card .tag{ align-self:flex-start; margin-bottom:1.1rem; }
.price-card .price{
  display:flex;
  align-items:baseline;
  gap:.4rem;
  margin-top:.4rem;
}
.price-card .price .amount{
  font-family:var(--font-heading);
  font-size:2.75rem;
  font-weight:700;
  letter-spacing:-.02em;
  background:var(--gradient-text);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.price-card .price .unit{ color:var(--text-tertiary); font-size:.92rem; font-weight:600; }
.price-card .desc{ margin-top:1rem; font-size:.96rem; }
.price-card .example{
  margin-top:1.4rem;
  padding-top:1.2rem;
  border-top:1px solid var(--border-subtle);
  font-size:.85rem;
}
.price-card .example .label{ color:var(--text-tertiary); font-weight:700; text-transform:uppercase; letter-spacing:.06em; font-size:.72rem; display:block; margin-bottom:.4rem;}
.price-card .ideal-for{ margin-top:1rem; font-size:.85rem; color:var(--text-tertiary); }
.price-card .btn{ margin-top:1.6rem; }


.larger-project-cta{
  display:flex;
  justify-content:center;
  margin-top:1.5rem;
}
.larger-project-cta .btn{
  padding:.7rem 1.05rem;
  min-height:auto;
  font-size:.9rem;
}
.addon-banner{
  margin-top:1.75rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.5rem;
  flex-wrap:wrap;
  padding:1.5rem 1.9rem;
  border-radius:var(--radius-lg);
  border:1px dashed var(--border-strong);
  background:linear-gradient(120deg, rgba(77,125,255,.08), rgba(146,87,255,.08));
  cursor:default;
  box-sizing:border-box;
  max-width:100%;
  transition: border-color var(--t-base), box-shadow var(--t-base), transform var(--t-base);
}
.addon-banner > div{ flex:1 1 320px; min-width:0; }
.addon-banner:hover{
  border-color:var(--border-hover);
  box-shadow: 0 16px 34px -18px var(--glow-violet);
  transform:translateY(-2px);
}
@media (prefers-reduced-motion: reduce){
  .addon-banner{ transition:none; }
}
.addon-banner .addon-price{
  font-weight:800;
  font-size:1.15rem;
  color:var(--text-primary);
}
.addon-breakdown{ display:flex; gap:1.5rem; flex-wrap:wrap; margin-top:.6rem; font-size:.85rem; color:var(--text-tertiary); }
.addon-breakdown strong{ color:var(--text-secondary); }
.price-highlight{
  font-family:var(--font-heading);
  font-weight:700;
  background:var(--gradient-text);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.logo-compact{
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:2.5rem;
  align-items:center;
  padding:1.75rem;
}
.logo-compact-prices{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem 1.5rem;
  margin-top:.9rem;
  font-size:.95rem;
  color:var(--text-secondary);
}
.logo-compact .check-list{ gap:.5rem; }
.logo-compact .check-list li{ font-size:.9rem; }
@media (max-width:780px){
  .logo-compact{ grid-template-columns:1fr; gap:1.5rem; }
}

/* Contact page two-column layout */
.contact-layout{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:clamp(2rem,4vw,3.5rem);
  align-items:start;
}
.contact-intro-visual{
  align-self:start;
}
.contact-hero-panel{
  position:relative;
  border-radius:var(--radius-xl);
  overflow:hidden;
  border:1px solid var(--border-frame);
  box-shadow: 0 30px 60px -26px rgba(20,10,60,0.55);
  min-height:520px;
  display:flex;
  align-items:flex-end;
  cursor:default;
  transition: border-color var(--t-base), box-shadow var(--t-base), transform var(--t-base);
}
.contact-hero-panel:hover{
  border-color:var(--border-hover);
  box-shadow: 0 30px 60px -24px rgba(20,10,60,0.6), 0 0 32px -8px var(--glow-violet);
  transform: translateY(-2px);
}
.contact-hero-bg{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  object-position:center 55%;
  z-index:0;
}
.contact-hero-overlay{
  position:absolute; inset:0;
  z-index:1;
  background:
    linear-gradient(180deg, rgba(6,7,16,0.55) 0%, rgba(6,7,16,0.75) 55%, rgba(6,7,16,0.94) 100%),
    linear-gradient(120deg, rgba(63,107,255,0.22), rgba(168,85,247,0.22));
}
.contact-hero-content{
  position:relative;
  z-index:2;
  padding: clamp(1.75rem,3vw,2.75rem);
}
.contact-hero-content .lede{ color:#dfe3f5; }
@media (max-width: 900px){
  .contact-hero-panel{ min-height:420px; }
}
@media (max-width: 560px){
  .contact-hero-panel{ min-height:360px; }
}
.reassurance-box{
  margin-top:1.75rem;
  display:flex;
  gap:.85rem;
  padding:1.1rem 1.3rem;
  border-radius:var(--radius-md);
  border:1px solid var(--border-card-rest);
  background:var(--bg-card);
}
.reassurance-box svg{ width:22px; height:22px; color:var(--blue-400); flex-shrink:0; margin-top:.1rem; }
.reassurance-box p{ font-size:.9rem; margin:0; }
.contact-hero-content .reassurance-box{
  background:rgba(8,10,22,0.55);
  border-color:rgba(168,178,255,0.22);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.contact-hero-content .reassurance-box p{ color:#eef0fb; }
@media (max-width: 900px){
  .contact-layout{ grid-template-columns:1fr; }
}

/* Compact "at a glance" icon strip on pricing cards */
.glance-strip{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:.6rem;
  margin-top:1.4rem;
  padding-top:1.4rem;
  border-top:1px solid var(--border-subtle);
}
.glance-item{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.4rem;
  text-align:center;
  padding:.7rem .4rem;
  border-radius:var(--radius-sm);
  background:rgba(255,255,255,0.02);
}
.glance-item svg{ width:19px; height:19px; color:var(--blue-400); }
.glance-item span{ font-size:.72rem; font-weight:700; color:var(--text-secondary); line-height:1.3; }
.policy-grid{
  display:flex;
  flex-wrap:nowrap;
  overflow-x:auto;
  overflow-y:hidden;
  gap:1.4rem;
  padding-bottom:.75rem;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  scrollbar-width:none;
  flex:1;
  min-width:0;
}
.policy-grid::-webkit-scrollbar{ display:none; height:0; }
.policy-grid > *{
  scroll-snap-align:start;
  flex:0 0 42%;
  min-width:0;
}
.policy-card.span-2{ flex-basis:min(660px, 90%); }
@media (prefers-reduced-motion: reduce){
  .policy-grid{ scroll-behavior:auto; }
}
@media (max-width: 680px){
  .policy-grid > *{ flex-basis:86%; }
}

.scroll-row-wrap{
  display:flex;
  align-items:center;
  gap:.75rem;
}
.scroll-row-wrap > [id]{ flex:1; min-width:0; }
.scroll-arrow{
  flex-shrink:0;
  width:44px;
  height:44px;
  border-radius:50%;
  border:1px solid rgba(146,87,255,0.4);
  background:rgba(146,87,255,0.12);
  color:var(--text-primary);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow: 0 0 0 1px rgba(146,87,255,0.06), 0 8px 20px -10px var(--glow-violet);
  transition: border-color var(--t-fast), background var(--t-fast), color var(--t-fast), box-shadow var(--t-fast), opacity var(--t-fast);
}
.scroll-arrow svg{ width:20px; height:20px; }
.scroll-arrow:hover{
  border-color:rgba(180,150,255,0.75);
  background:rgba(146,87,255,0.22);
  color:#fff;
  box-shadow: 0 0 0 1px rgba(146,87,255,0.12), 0 14px 30px -12px var(--glow-violet);
}
.scroll-arrow:focus-visible{
  outline:2px solid var(--border-hover);
  outline-offset:2px;
}
.scroll-arrow.is-disabled{
  opacity:.35;
  pointer-events:none;
}
@media (max-width: 680px){
  .section{ padding-block: clamp(1.875rem, 8vw, 2.5rem); }
  .section-tight{ padding-block: clamp(1.5rem, 6vw, 2rem); }
}
.policy-card{
  padding:1.4rem;
  border-radius:var(--radius-lg);
  border:1px solid var(--border-card-rest);
  background:var(--bg-card);
  cursor:default;
  transition: transform var(--t-base), border-color var(--t-base), background var(--t-base), box-shadow var(--t-base);
}
.policy-card:hover{
  transform: translateY(-4px);
  border-color:var(--border-hover);
  background:var(--bg-card-hover);
  box-shadow: var(--shadow-card-hover);
}
.policy-card h3{ font-size:1.05rem; }
.policy-card p{ margin-top:.55rem; font-size:.9rem; }
.policy-card ul{ margin-top:.8rem; display:flex; flex-direction:column; gap:.4rem; }
.policy-card ul li{ font-size:.87rem; color:var(--text-tertiary); padding-left:1rem; position:relative; }
.policy-card ul li::before{ content:"–"; position:absolute; left:0; color:var(--text-tertiary); }

.policy-card-media{
  display:flex;
  flex-direction:column;
  gap:1.25rem;
  padding:1.75rem;
}
.policy-media-photo{ order:-1; min-height:200px; max-height:240px; }
.policy-card .highlight-line{ margin-top:1rem; font-size:.98rem; }

/* Payment flow visual */
.payment-flow{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:.5rem;
  margin-top:1.6rem;
}
.payment-flow .flow-step{
  padding:.75rem 1.1rem;
  border-radius:var(--radius-pill);
  border:1px solid var(--border-subtle);
  background:rgba(255,255,255,.02);
  font-size:.84rem;
  font-weight:700;
  color:var(--text-secondary);
}
.payment-flow .flow-arrow{ color:var(--text-tertiary); font-size:1rem; }

/* CTA band */
.cta-band{
  border-radius:var(--radius-xl);
  border:1px solid var(--border-subtle);
  background:
    radial-gradient(600px 300px at 20% 0%, rgba(77,125,255,.16), transparent 65%),
    radial-gradient(600px 300px at 90% 100%, rgba(146,87,255,.16), transparent 65%),
    var(--bg-elevated);
  padding: clamp(2.5rem,5vw,3.75rem);
  text-align:center;
}
.cta-band h2{ max-width:640px; margin-inline:auto; }
.cta-band p{ max-width:520px; margin-inline:auto; margin-top:.9rem; }
.cta-band .hero-ctas{ justify-content:center; margin-top:2rem; }

/* FAQ preview list (home) */
.faq-preview-list{ display:flex; flex-direction:column; gap:.75rem; }
.faq-preview-item{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:1.15rem 1.4rem;
  border:1px solid var(--border-subtle);
  border-radius:var(--radius-md);
  background:var(--bg-card);
  font-weight:700;
  font-size:.98rem;
  transition: border-color var(--t-fast), background var(--t-fast), transform var(--t-fast);
}
.faq-preview-item:hover{ border-color:var(--border-hover); background:var(--bg-card-hover); transform:translateX(4px); }
.faq-preview-item svg{ flex-shrink:0; width:18px; height:18px; color:var(--blue-400); }

/* ---------- 16. DEVICE FRAMES (wrap real screenshots of the live site) ---------- */
/* Laptop / tablet / phone illustrated frames — used for supporting visuals
   and, on the Services page, wrap real screenshots of the live site. */
.device-frame{ position:relative; }
.device-laptop{
  width:100%;
  background:#0c0e1c;
  border:1px solid var(--border-strong);
  border-radius:14px 14px 4px 4px;
  padding:10px 10px 0;
  box-shadow:var(--shadow-card);
  cursor:default;
  transition: transform var(--t-base);
}
.device-laptop:hover{ transform:translateY(-4px); }
.device-laptop .device-screen{
  border-radius:6px;
  overflow:hidden;
  background:var(--bg-elevated);
  aspect-ratio:16/10;
}
.device-laptop .device-screen img{ width:100%; height:100%; object-fit:cover; object-position:top; }
.device-laptop-base{
  height:12px;
  margin-top:8px;
  background:linear-gradient(180deg, #14162a, #0a0b16);
  border-radius:0 0 10px 10px;
  position:relative;
}
.device-laptop-base::after{
  content:"";
  position:absolute; left:50%; top:0; transform:translateX(-50%);
  width:14%; height:4px;
  background:rgba(255,255,255,0.08);
  border-radius:0 0 4px 4px;
}

.device-tablet{
  width:100%;
  background:#0c0e1c;
  border:1px solid var(--border-strong);
  border-radius:20px;
  padding:14px 10px;
  box-shadow:var(--shadow-card);
  cursor:default;
  transition: transform var(--t-base);
}
.device-tablet:hover{ transform:translateY(-4px); }
.device-tablet .device-screen{ border-radius:8px; overflow:hidden; background:var(--bg-elevated); aspect-ratio:3/4; }
.device-tablet .device-screen img{ width:100%; height:100%; object-fit:cover; object-position:top; }

.device-phone{
  width:100%;
  background:#0c0e1c;
  border:1px solid var(--border-strong);
  border-radius:26px;
  padding:12px 8px;
  box-shadow:var(--shadow-card);
  cursor:default;
  transition: transform var(--t-base);
}
.device-phone:hover{ transform:translateY(-4px); }
.device-phone .device-screen{ border-radius:14px; overflow:hidden; background:var(--bg-elevated); aspect-ratio:9/17.5; position:relative; }
.device-phone .device-screen img{ width:100%; height:100%; object-fit:cover; object-position:top; }
.device-phone .device-screen::before{
  content:"";
  position:absolute; top:8px; left:50%; transform:translateX(-50%);
  width:34%; height:5px; border-radius:var(--radius-pill);
  background:rgba(0,0,0,0.55);
  z-index:2;
}

.device-showcase{
  display:grid;
  grid-template-columns:1.3fr .85fr .55fr;
  gap:1.75rem;
  align-items:end;
  max-width:78%;
  margin-inline:auto;
}
.device-showcase .device-tablet{ margin-bottom:1.5rem; }
.device-showcase .device-phone{ margin-bottom:.5rem; }

/* ---------- 17. SUPPORTING GRAPHIC ACCENTS ---------- */
.grid-accent{
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(168,178,255,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(168,178,255,0.05) 1px, transparent 1px);
  background-size:42px 42px;
  -webkit-mask-image:radial-gradient(600px 400px at 50% 0%, #000, transparent 75%);
  mask-image:radial-gradient(600px 400px at 50% 0%, #000, transparent 75%);
  pointer-events:none;
  z-index:-1;
}
.dot-accent{
  position:absolute;
  inset:0;
  background-image:radial-gradient(rgba(168,178,255,0.14) 1.4px, transparent 1.4px);
  background-size:22px 22px;
  -webkit-mask-image:radial-gradient(420px 320px at 100% 0%, #000, transparent 70%);
  mask-image:radial-gradient(420px 320px at 100% 0%, #000, transparent 70%);
  pointer-events:none;
  z-index:-1;
}

/* ---------- 18. PHOTOGRAPHY ---------- */
.photo{
  border-radius:var(--radius-lg);
  overflow:hidden;
  border:1px solid var(--border-frame);
  box-shadow: 0 20px 46px -22px rgba(10,6,40,0.6);
  position:relative;
}
.photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.photo::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, transparent 60%, rgba(6,7,16,0.28));
  pointer-events:none;
}

/* Editorial homepage collage: one anchor (wide top spanning 2 cols), one tall
   vertical (right column, full height), two smaller supporting images
   (bottom-left pair) — built from natural photo orientations. */
.collage{
  display:grid;
  grid-template-columns: 0.55fr 0.45fr;
  grid-template-rows: 1fr 1fr;
  gap:10px;
  aspect-ratio: 1.12/1;
}
.collage .photo-anchor{ grid-column:1; grid-row:1; }
.collage .photo-sub-a{ grid-column:1; grid-row:2; }
.collage .photo-tall{ grid-column:2; grid-row:1 / 3; }
.collage .photo{ border:0; box-shadow:none; border-radius:var(--radius-md); }

/* One subtle permanent frame around the whole collage, rather than a glow
   on every individual photo — the collage should read as one unit. */
.collage-frame{
  padding:12px;
  border-radius:calc(var(--radius-lg) + 8px);
  border:1px solid var(--border-frame);
  background:var(--bg-elevated);
  box-shadow: 0 24px 60px -28px rgba(10,6,40,0.6);
  cursor:default;
  transition: border-color var(--t-base), box-shadow var(--t-base), transform var(--t-base);
}
.collage-frame:hover{
  border-color:var(--border-hover);
  box-shadow: 0 24px 60px -24px rgba(10,6,40,0.6), 0 0 32px -8px var(--glow-violet);
  transform: translateY(-2px);
}

.photo-frame-split{
  aspect-ratio: 4/3.1;
}
.photo-frame-tall{
  aspect-ratio: 0.95/1;
}

/* Subtle permanent frame for major standalone photography (About image,
   etc.) — a thin low-opacity line, not a glowing hover-style border. */
.photo-premium{
  padding:3px;
  border-radius:calc(var(--radius-lg) + 3px);
  border:1px solid var(--border-frame);
  background:var(--bg-elevated);
  box-shadow: 0 22px 50px -26px rgba(10,6,40,0.55);
  cursor:default;
  transition: border-color var(--t-base), box-shadow var(--t-base), transform var(--t-base);
  overflow:hidden;
}
.photo-premium:hover{
  border-color:var(--border-hover);
  box-shadow: 0 22px 50px -22px rgba(10,6,40,0.55), 0 0 30px -8px var(--glow-violet);
  transform: translateY(-2px);
}
.photo-premium .photo{ border:0; box-shadow:none; }
.photo-premium .photo img{ transition: transform var(--t-slow); }
.photo-premium:hover .photo img{ transform: scale(1.015); }
@media (prefers-reduced-motion: reduce){
  .photo-premium .photo img{ transition:none; }
  .photo-premium:hover .photo img{ transform:none; }
}
@media (max-width: 1080px){
  .grid-4{ grid-template-columns:repeat(2,1fr); }
  .process-list{ grid-template-columns:repeat(2,1fr); }
  .device-showcase{ grid-template-columns:1.2fr .8fr; }
  .device-showcase .device-phone{ display:none; }
}

@media (min-width: 681px) and (max-width: 1080px){
  .story-grid{
    display:flex;
    grid-template-columns:none;
    flex-wrap:nowrap;
    overflow-x:auto;
    overflow-y:hidden;
    max-width:100%;
    overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    gap:1.25rem;
    padding-bottom:.6rem;
    scrollbar-width:none;
    align-items:stretch;
  }
  .story-grid::-webkit-scrollbar{ display:none; height:0; }
  .story-grid > *{
    scroll-snap-align:start;
    flex:0 0 58%;
    min-width:0;
  }
}

@media (max-width: 900px){
  .grid-3{ grid-template-columns:repeat(2,1fr); }
  .footer-top{ grid-template-columns:1fr 1fr; }
  .footer-brand{ grid-column:1 / -1; max-width:none; }  .split{ grid-template-columns:1fr; }
  .split.about-hero-split{ grid-template-columns:1fr; }
  .about-hero-split .photo-premium{ max-width:320px; margin-inline:auto; }
  .split.reverse .split-media{ order:0; }
  .pricing-grid{ grid-template-columns:1fr; }
  .device-showcase{
    display:flex;
    grid-template-columns:none;
    max-width:100%;
    margin-inline:0;
    overflow-x:auto;
    overflow-y:hidden;
    align-items:stretch;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
    gap:1rem;
    padding-bottom:.6rem;
    scrollbar-width:none;
  }
  .device-showcase::-webkit-scrollbar{ display:none; height:0; }
  .device-showcase > *{
    scroll-snap-align:start;
    flex:0 0 88%;
    min-width:0;
    margin-bottom:0 !important;
  }
  .device-showcase .device-tablet,
  .device-showcase .device-phone{ display:block; }
  .device-laptop .device-screen img,
  .device-tablet .device-screen img,
  .device-phone .device-screen img{ object-fit:contain; }
}

@media (max-width: 680px){
  .grid-2,.grid-3{ grid-template-columns:1fr; }
  .grid-4:not(.benefits-grid){ grid-template-columns:1fr; }
  .form-grid{ grid-template-columns:1fr; }
  .footer-top{ grid-template-columns:1fr; gap:2rem; }
  .footer-bottom{ flex-direction:column; align-items:flex-start; }
  .hero{ min-height:auto; padding-bottom:3rem; }
  .hero-media img, .hero-media video{ object-position: 72% center; }
  .addon-banner{ flex-direction:column; align-items:flex-start; }
  .cta-band{ padding: 2.25rem 1.5rem; }
  .collage{ grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr; aspect-ratio:1/1; gap:8px; }
  .collage .photo-anchor{ grid-column:1; grid-row:1; }
  .collage .photo-sub-a{ grid-column:2; grid-row:1; }
  .collage .photo-tall{ grid-column:1 / 3; grid-row:2; }
  .collage .photo-tall img{ object-position: center 25%; }

  /* ---------- Mobile-only swipeable card rows ---------- */
  .grid-4.benefits-grid,
  .pricing-grid,
  .process-list,
  .values-grid,
  .story-grid,
  .svc-intro-grid{
    display:flex;
    grid-template-columns:none;
    flex-wrap:nowrap;
    overflow-x:auto;
    overflow-y:hidden;
    max-width:100%;
    overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    gap:.85rem;
    padding-bottom:.6rem;
    scrollbar-width:none;
    align-items:stretch;
  }
  .grid-4.benefits-grid::-webkit-scrollbar,
  .pricing-grid::-webkit-scrollbar,
  .process-list::-webkit-scrollbar,
  .values-grid::-webkit-scrollbar,
  .story-grid::-webkit-scrollbar,
  .svc-intro-grid::-webkit-scrollbar{ display:none; height:0; }

  .grid-4.benefits-grid > *,
  .process-list > *,
  .values-grid > *,
  .story-grid > *,
  .svc-intro-grid > *{
    scroll-snap-align:start;
    flex:0 0 86%;
    min-width:0;
  }
  .pricing-grid > *{
    scroll-snap-align:start;
    flex:0 0 90%;
    min-width:0;
  }
}

@media (max-width: 680px) and (prefers-reduced-motion: reduce){
  .grid-4.benefits-grid,
  .pricing-grid,
  .process-list,
  .values-grid,
  .story-grid,
  .svc-intro-grid,
  .policy-grid{ scroll-behavior:auto; }
}

@media (max-width: 480px){
  .container,.container-lg,.container-md{ padding-inline:1.15rem; }
  .btn{ padding:.9rem 1.35rem; }
}

/* Desktop hero refinement: keep the widened two-line copy, but restore
   breathing room and center the video within the usable hero area below
   the fixed header. Mobile will be handled separately. */
@media (min-width: 901px){
  .hero{
    min-height:min(740px, 94svh);
  }
  .hero-media{
    top:var(--header-h);
    bottom:0;
    left:0;
    right:0;
  }
  .hero-media video,
  .hero-media img{
    object-position:center center;
  }
  .hero-overlay{
    top:var(--header-h);
  }
}

/* Desktop content rhythm refinement: add a little breathing room inside
   section heading stacks without materially increasing overall page length. */
@media (min-width: 901px){
  .section-head h2{
    margin-top:1rem;
  }
  .section-head .lede{
    margin-top:1.2rem;
  }
  .section .eyebrow + h2{
    margin-top:1.12rem !important;
  }
  .section h2 + .lede{
    margin-top:1.32rem !important;
  }
  .section-head{
    margin-bottom: clamp(1.85rem,3.3vw,2.55rem);
  }
  .process-step h3 + p,
  .price-card .desc + .desc,
  .collage-copy p + p{
    margin-top:.88rem;
  }
}

/* Desktop pricing CTA alignment: keep package buttons on the same baseline
   while preserving comfortable breathing room above them. */
@media (min-width: 901px){
  #home-pricing-grid .price-card .check-list{
    margin-bottom:1.6rem;
  }
  #home-pricing-grid .price-card .btn{
    margin-top:auto !important;
  }

  #svc-pricing-grid .price-card .ideal-for{
    margin-bottom:.7rem;
  }
  #svc-pricing-grid .price-card .mini-pill-row{
    margin-bottom:1rem;
  }
  #svc-pricing-grid .price-card .btn{
    margin-top:auto;
  }
}

/* About + Services desktop spacing refinement */
@media (min-width: 901px){
  body.page-about .page-hero .eyebrow,
  body.page-services .page-hero .eyebrow{
    margin-bottom:1.2rem;
  }
  body.page-services .page-hero{
    padding-top: calc(var(--header-h) + 2.35rem);
    padding-bottom: 2.2rem;
  }
  body.page-about .page-hero h1,
  body.page-services .page-hero h1{
    margin-top:0;
  }
  body.page-about .page-hero .lede{
    margin-top:1.35rem;
  }
  body.page-about .section-head h2,
  body.page-services .section-head h2,
  body.page-services .intro-centered h2{
    margin-top:1.2rem !important;
  }
  body.page-services .intro-centered h1{
    margin-top:1.2rem;
  }
  body.page-about .section-head,
  body.page-services .section-head{
    margin-bottom:2.65rem;
  }
  body.page-services .page-hero .scroll-row-wrap{
    margin-top:1.85rem !important;
  }
  body.page-services #logo-design .logo-compact{
    margin-top:1.9rem !important;
  }
  body.page-about .story-grid .card h3 + p,
  body.page-services .svc-intro-grid .card h3 + p,
  body.page-services .logo-compact h3 + p{
    margin-top:.9rem !important;
  }
  body.page-about .value-item h3{
    margin-top:1rem;
  }
  body.page-about .value-item h3 + p,
  body.page-services .policy-card h3 + p{
    margin-top:.8rem;
  }
}


/* Inner-page top-section spacing normalization: keep the first visible
   content the same distance from the fixed header boundary as standard
   section content is from its divider. */
@media (min-width: 901px){
  .page-hero{
    padding-top: calc(var(--header-h) + 3rem);
  }
  body.page-services .page-hero{
    padding-top: calc(var(--header-h) + 2.35rem);
  }
  body.page-contact main > .section:first-child{
    padding-top: calc(var(--header-h) + 3rem) !important;
  }
}

/* About desktop: keep the What Matters section compact enough to scan
   without sacrificing the improved heading rhythm elsewhere. */
@media (min-width: 901px){
  body.page-about .about-values-section{
    padding-block:1.85rem;
  }
  body.page-about .about-values-section .section-head{
    margin-bottom:1.35rem;
  }
  body.page-about .about-values-section .values-grid{
    gap:.85rem;
  }
  body.page-about .about-values-section .value-item{
    padding:.85rem 1rem;
  }
  body.page-about .about-values-section .value-item .icon-tile{
    width:34px;
    height:34px;
  }
  body.page-about .about-values-section .value-item .icon-tile svg{
    width:16px;
    height:16px;
  }
  body.page-about .about-values-section .value-item h3{
    margin-top:.55rem;
    font-size:1.02rem;
  }
  body.page-about .about-values-section .value-item h3 + p{
    margin-top:.42rem;
    line-height:1.42;
    font-size:.9rem;
  }
}


/* Desktop-only Services "Good to Know" compaction. Keep mobile unchanged. */
@media (min-width: 901px){
  body.page-services .good-to-know-section{
    padding-block:2.35rem;
  }
  body.page-services .good-to-know-section .section-head{
    margin-bottom:1.85rem;
  }
  body.page-services .good-to-know-section .policy-grid{
    gap:1rem;
    padding-bottom:.35rem;
  }
  body.page-services .good-to-know-section .policy-card{
    padding:1.05rem 1.15rem;
  }
  body.page-services .good-to-know-section .policy-card .icon-tile{
    width:40px;
    height:40px;
    margin-bottom:.65rem;
  }
  body.page-services .good-to-know-section .policy-card h3{
    font-size:1rem;
  }
  body.page-services .good-to-know-section .policy-card h3 + p{
    margin-top:.55rem !important;
  }
  body.page-services .good-to-know-section .policy-card p{
    font-size:.84rem;
    line-height:1.48;
  }
  body.page-services .good-to-know-section .payment-flow{
    gap:.35rem;
    margin-top:.7rem !important;
  }
  body.page-services .good-to-know-section .payment-flow .flow-step{
    padding:.5rem .72rem;
    font-size:.74rem;
  }
  body.page-services .good-to-know-section .policy-card > p[style*="font-size:.85rem"]{
    margin-top:.65rem !important;
    font-size:.78rem !important;
    line-height:1.42;
  }
  body.page-services .good-to-know-section .note-card{
    margin-top:1.7rem !important;
    padding:1.2rem !important;
  }
  body.page-services .good-to-know-section .note-card p{
    margin-top:.45rem !important;
  }
  body.page-services .good-to-know-section .note-card .btn{
    margin-top:.9rem !important;
  }
}

/* Deposit clarity */
.deposit-callout{
  display:inline-block;
  padding:.58rem .85rem;
  border:1px solid rgba(116,144,255,.25);
  border-radius:999px;
  background:rgba(77,125,255,.07);
  color:var(--text-secondary);
  font-size:.8rem;
  line-height:1.35;
}
.deposit-callout strong{ color:var(--text-primary); }
.deposit-summary{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:.55rem;
  margin-top:.9rem;
}
.deposit-summary span{
  padding:.68rem .72rem;
  border:1px solid var(--border-subtle);
  border-radius:var(--radius-md);
  background:rgba(255,255,255,.025);
  color:var(--text-tertiary);
  font-size:.78rem;
  line-height:1.4;
  text-align:center;
}
.deposit-summary strong{
  color:var(--text-primary);
  font-size:.8rem;
}
@media (max-width:900px){
  .deposit-summary{ grid-template-columns:1fr; }
}