/* =========================================================
   Dr. Vivek Gaur — Swiss Corticobasal Implants
   Static HTML/CSS/JS build — design tokens & base reset
   ========================================================= */

:root {
  --slate-50:#f8fafc; --slate-100:#f1f5f9; --slate-200:#e2e8f0; --slate-300:#cbd5e1;
  --slate-400:#94a3b8; --slate-500:#64748b; --slate-600:#475569; --slate-700:#334155;
  --slate-800:#1e293b; --slate-900:#0f172a; --slate-950:#020617;

  --amber-50:#fffbeb; --amber-100:#fef3c7; --amber-200:#fde68a; --amber-300:#fcd34d;
  --amber-400:#fbbf24; --amber-500:#f59e0b; --amber-600:#d97706; --amber-700:#b45309; --amber-900:#78350f;

  --emerald-50:#ecfdf5; --emerald-100:#d1fae5; --emerald-200:#a7f3d0; --emerald-600:#059669; --emerald-800:#065f46;
  --rose-400:#fb7185; --rose-500:#f43f5e; --rose-600:#e11d48;
  --blue-100:#dbeafe; --blue-200:#bfdbfe; --blue-800:#1e40af;

  --brand:#8f344e;
  --brand-10: rgba(143,52,78,.10);
  --brand-20: rgba(143,52,78,.20);

  --white:#ffffff;

  --radius-md:.5rem; --radius-lg:.75rem; --radius-xl:1rem; --radius-2xl:1.25rem; --radius-3xl:1.5rem; --radius-full:9999px;

  --font-sans: 'Lato', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-heading: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  --shadow-xs: 0 1px 2px 0 rgba(0,0,0,.04);
  --shadow-sm: 0 1px 3px 0 rgba(0,0,0,.08), 0 1px 2px -1px rgba(0,0,0,.06);
  --shadow-md: 0 4px 6px -1px rgba(0,0,0,.08), 0 2px 4px -2px rgba(0,0,0,.06);
  --shadow-lg: 0 10px 20px -4px rgba(0,0,0,.10), 0 4px 6px -2px rgba(0,0,0,.05);
  --shadow-xl: 0 20px 30px -8px rgba(0,0,0,.14), 0 8px 10px -6px rgba(0,0,0,.06);
  --shadow-2xl: 0 25px 50px -12px rgba(0,0,0,.25);
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html {
  font-family: var(--font-sans);
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  scrollbar-color: #020617 #f8fafc;
  scrollbar-width: thin;
}

body {
  font-family: var(--font-sans);
  color: var(--slate-900);
  background: var(--white);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  min-height: 100%;
  display: flex;
  flex-direction: column;
}

h1, h2, h3, h4, h5, h6 { font-family: var(--font-heading); font-weight: 700; line-height: 1.2; }

img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; background: none; border: none; color: inherit; }
ul { list-style: none; }
input, textarea, select { font-family: inherit; font-size: 1rem; }

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #f8fafc; }
::-webkit-scrollbar-thumb { background: #020617; border-radius: 9999px; border: 2px solid #f8fafc; }
::-webkit-scrollbar-thumb:hover { background: #1e293b; }

/* =========================================================
   Layout helpers
   ========================================================= */
.container {
  max-width: 80rem; /* 1280px */
  margin: 0 auto;
  padding: 0 1rem;
}
@media (min-width: 640px) { .container { padding: 0 1.5rem; } }
@media (min-width: 1024px) { .container { padding: 0 2rem; } }

.section { padding: 3.5rem 0; position: relative; border-bottom: 1px solid var(--slate-200); overflow: hidden; }
.section--tight { padding: 3.5rem 0; }
@media (min-width: 640px) { .section, .section--tight { padding: 5rem 0; } }
.section--bg-light { background: var(--slate-50); }
.section--bg-white { background: var(--white); }
.section--no-border { border-bottom: none; }

.section-header { text-align: center; max-width: 48rem; margin: 0 auto 2rem; }
@media (min-width: 640px) { .section-header { margin-bottom: 3rem; } }
.section-header--tight { margin-bottom: 2.5rem; }
@media (min-width: 640px) { .section-header--tight { margin-bottom: 3.5rem; } }

.eyebrow {
  display: block;
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .2em;
  font-weight: 600;
  color: var(--brand);
  font-family: var(--font-sans);
  margin-bottom: .5rem;
}

.section-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--slate-950);
  letter-spacing: -0.01em;
  line-height: 1.2;
}
@media (min-width: 480px) { .section-title { font-size: 1.875rem; } }
@media (min-width: 640px) { .section-title { font-size: 2.25rem; } }
@media (min-width: 1024px) { .section-title { font-size: 3rem; } }

.section-sub {
  color: var(--slate-600);
  font-size: .8125rem;
  line-height: 1.6;
  margin-top: .65rem;
}
@media (min-width: 480px) { .section-sub { font-size: .875rem; } }
@media (min-width: 640px) { .section-sub { font-size: 1rem; } }
@media (min-width: 1024px) { .section-sub { font-size: 1.125rem; } }

.text-center { text-align: center; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* =========================================================
   Scroll reveal animation (replaces framer-motion whileInView)
   ========================================================= */
[data-reveal] {
  opacity: 0;
  transform: translateY(15px);
  transition: opacity .5s ease, transform .5s ease;
  will-change: opacity, transform;
}
[data-reveal].is-visible { opacity: 1; transform: translateY(0); }
[data-reveal="scale"] { transform: scale(.98); }
[data-reveal="scale"].is-visible { transform: scale(1); }
[data-reveal="x"] { transform: translateX(20px); }
[data-reveal="x"].is-visible { transform: translateX(0); }

@media (prefers-reduced-motion: reduce) {
  [data-reveal] { transition: none; opacity: 1; transform: none; }
}

.fade-swap { animation: fadeSwap .3s ease; }
@keyframes fadeSwap { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

@keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: .5; } }
.pulse-dot { animation: pulse 2s cubic-bezier(.4,0,.6,1) infinite; }

@keyframes ping { 75%,100% { transform: scale(2); opacity: 0; } }
.ping-ring { animation: ping 1.6s cubic-bezier(0,0,.2,1) infinite; }

@keyframes spin { to { transform: rotate(360deg); } }
.spin { animation: spin 1s linear infinite; }

/* =========================================================
   Buttons
   ========================================================= */
.btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 3.25rem;
  padding: 0 2rem;
  background: var(--slate-950);
  color: var(--white);
  font-weight: 700;
  font-size: 1rem;
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-lg);
  transition: all .2s ease;
  white-space: nowrap;
  border: none;
}
@media (min-width: 640px) { .btn-primary { height: 3.5rem; padding: 0 2.5rem; font-size: 1.125rem; } }
.btn-primary:hover { background: var(--slate-800); box-shadow: var(--shadow-xl); transform: translateY(-2px); }
.btn-primary:active { transform: translateY(0); }
.btn-primary:disabled { opacity: .6; cursor: not-allowed; transform: none; }

.btn-block { width: 100%; }

/* badges / pills */
.badge-pill {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .25rem .75rem;
  border-radius: var(--radius-full);
  background: var(--slate-100);
  border: 1px solid var(--slate-200);
  color: var(--slate-800);
}
.badge-pill .dot { width: .5rem; height: .5rem; border-radius: 50%; background: var(--brand); }
.badge-pill span.label { font-size: .6875rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
@media (min-width: 480px) { .badge-pill span.label { font-size: .75rem; } }

.badge-check {
  display: inline-flex;
  align-items: center;
  gap: .375rem;
  font-size: .75rem;
  font-weight: 600;
  padding: .375rem .875rem;
  border-radius: var(--radius-lg);
  background: var(--white);
  color: var(--slate-800);
  border: 1px solid var(--slate-200);
  box-shadow: var(--shadow-xs);
}
@media (min-width: 640px) { .badge-check { font-size: .875rem; } }
.badge-check svg { color: var(--emerald-600); flex-shrink: 0; }

.icon { width: 1em; height: 1em; display: inline-block; vertical-align: middle; stroke-width: 2; }

/* =========================================================
   Header / Hero
   ========================================================= */
.hero {
  position: relative;
  padding: 1rem 0 3rem;
  overflow: hidden;
  background: linear-gradient(to bottom, var(--slate-50), var(--white), var(--slate-50));
  border-bottom: 1px solid var(--slate-200);
}
@media (min-width: 640px) { .hero { padding: 2rem 0 5rem; } }

.hero__glow {
  position: absolute;
  top: 0; right: 25%;
  width: 400px; height: 250px;
  background: rgba(245,158,11,.05);
  filter: blur(120px);
  border-radius: 50%;
  pointer-events: none;
  z-index: -1;
}
@media (min-width: 640px) { .hero__glow { width: 600px; height: 350px; } }

.hero__topbar {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .75rem;
  padding-bottom: .75rem;
  margin-bottom: 1.5rem;
  border-bottom: 1px solid rgba(226,232,240,.8);
}
@media (min-width: 640px) { .hero__topbar { gap: 1rem; padding-bottom: 1.5rem; margin-bottom: 3rem; } }
.hero__topbar img { height: 2rem; width: auto; object-fit: contain; }
@media (min-width: 640px) { .hero__topbar img { height: 3rem; } }
@media (min-width: 768px) { .hero__topbar img.logo1 { height: 3.5rem; } .hero__topbar img.logo2 { height: 3rem; } }
.hero__divider { width: 1px; height: 1.25rem; background: var(--slate-200); }
@media (min-width: 640px) { .hero__divider { height: 1.75rem; } }

.hero__grid {
  display: grid;
  gap: 2rem;
  align-items: center;
}
@media (min-width: 1024px) { .hero__grid { grid-template-columns: repeat(12, 1fr); gap: 3rem; } }

.hero__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 1rem;
}
@media (min-width: 1024px) {
  .hero__content { grid-column: span 6; align-items: flex-start; text-align: left; gap: 1.25rem; }
}

.hero__video-mobile { display: block; width: 100%; margin: .25rem 0; border-radius: 1rem; overflow: hidden; border: 1px solid var(--slate-200); box-shadow: var(--shadow-md); background: var(--slate-950); }
@media (min-width: 1024px) { .hero__video-mobile { display: none; } }

.hero__title {
  font-size: 1.875rem;
  font-weight: 700;
  color: var(--slate-950);
  letter-spacing: -0.01em;
  line-height: 1.15;
}
@media (min-width: 480px) { .hero__title { font-size: 2.25rem; } }
@media (min-width: 768px) { .hero__title { font-size: 3rem; } }
@media (min-width: 1024px) { .hero__title { font-size: 3.25rem; } }
.hero__title .underline-accent { text-decoration: underline; text-decoration-color: rgba(143,52,78,.6); text-decoration-thickness: 4px; text-underline-offset: 4px; }

.hero__badges { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; padding-top: .25rem; }
@media (min-width: 1024px) { .hero__badges { justify-content: flex-start; } }

.hero__desc {
  font-size: .875rem;
  color: var(--slate-600);
  line-height: 1.7;
  max-width: 36rem;
}
@media (min-width: 640px) { .hero__desc { font-size: 1rem; } }
@media (min-width: 1024px) { .hero__desc { font-size: 1.125rem; } }

.hero__cta { padding-top: .5rem; display: flex; flex-direction: column; align-items: center; gap: .75rem; }
@media (min-width: 1024px) { .hero__cta { align-items: flex-start; } }
.hero__trust { display: flex; align-items: center; gap: .5rem; font-size: .75rem; color: var(--slate-600); font-weight: 500; }
@media (min-width: 480px) { .hero__trust { font-size: .875rem; } }
.hero__trust svg { color: var(--brand); }

.hero__video-desktop { display: none; }
@media (min-width: 1024px) {
  .hero__video-desktop {
    display: block;
    grid-column: span 6;
    border-radius: 1.5rem;
    overflow: hidden;
    border: 1px solid rgba(226,232,240,.9);
    box-shadow: var(--shadow-xl);
    background: var(--slate-950);
  }
}

.bg-video-wrap { position: relative; width: 100%; aspect-ratio: 16/9; overflow: hidden; background: var(--slate-950); }
.bg-video-wrap video { width: 100%; height: 100%; object-fit: cover; }

/* =========================================================
   Trust metrics bar
   ========================================================= */
.trust-bar { background: var(--white); border-bottom: 1px solid rgba(226,232,240,.8); padding: 2rem 0; }
@media (min-width: 640px) { .trust-bar { padding: 3rem 0; } }
.trust-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem 2rem;
}
@media (min-width: 768px) { .trust-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .trust-grid { grid-template-columns: repeat(5, 1fr); gap: 2.5rem; } }
.trust-item { display: flex; flex-direction: column; text-align: left; }
.trust-item__value { font-size: 1.875rem; font-weight: 300; font-family: var(--font-heading); color: var(--slate-950); letter-spacing: -0.01em; line-height: 1; }
@media (min-width: 640px) { .trust-item__value { font-size: 2.25rem; } }
@media (min-width: 1024px) { .trust-item__value { font-size: 3rem; } }
.trust-item__label { font-size: .75rem; font-weight: 700; color: var(--slate-900); font-family: var(--font-heading); letter-spacing: .02em; padding-top: .25rem; }
@media (min-width: 640px) { .trust-item__label { font-size: .875rem; } }
.trust-item__desc { font-size: .75rem; color: var(--slate-600); }

/* =========================================================
   Generic grid helpers
   ========================================================= */
.grid-12 { display: grid; gap: 2rem; align-items: center; }
@media (min-width: 1024px) { .grid-12 { grid-template-columns: repeat(12, 1fr); gap: 3.5rem; } }
.col-span-6 { grid-column: span 6; }
.col-span-5 { grid-column: span 5; }
.col-span-7 { grid-column: span 7; }

/* =========================================================
   Case studies / Educational videos — carousels
   ========================================================= */
.carousel-desktop { display: none; }
@media (min-width: 1024px) { .carousel-desktop { display: block; } }
.carousel-mobile { }
@media (min-width: 1024px) { .carousel-mobile { display: none; } }

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

.carousel-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 2rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(226,232,240,.7);
}
.carousel-nav__status { font-size: .75rem; color: var(--slate-600); }
.carousel-nav__btns { display: flex; align-items: center; gap: .5rem; }
.carousel-nav__btn {
  width: 2.5rem; height: 2.5rem;
  border-radius: var(--radius-lg);
  border: 1px solid var(--slate-200);
  background: var(--white);
  display: flex; align-items: center; justify-content: center;
  color: var(--slate-800);
  transition: background .2s;
}
.carousel-nav__btn:hover:not(:disabled) { background: var(--slate-100); }
.carousel-nav__btn:disabled { opacity: .3; cursor: not-allowed; }

.carousel-scroll {
  display: flex;
  gap: 1rem;
  overflow-x: auto;
  padding-bottom: 1rem;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}
.carousel-scroll::-webkit-scrollbar { display: none; }
.carousel-scroll > * { flex-shrink: 0; width: 84vw; max-width: 320px; scroll-snap-align: center; }

.carousel-dots { display: flex; align-items: center; justify-content: center; gap: .375rem; margin-top: .75rem; }
.carousel-dots span { height: .375rem; width: .375rem; border-radius: var(--radius-full); background: var(--slate-300); transition: all .3s; }
.carousel-dots span.active { width: 1.25rem; background: var(--slate-950); }
.carousel-count { text-align: center; font-size: .6875rem; color: var(--slate-600); margin-top: .35rem; }

.video-embed {
  position: relative;
  width: 100%;
  overflow: hidden;
  background: var(--slate-950);
  aspect-ratio: 16/9;
  cursor: pointer;
}
.video-embed.ratio-9-16 { aspect-ratio: 9/16; }
.video-embed img.thumb { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.video-embed:hover img.thumb { transform: scale(1.05); }
.video-embed .scrim { position: absolute; inset: 0; background: linear-gradient(to top, rgba(2,6,23,.8), rgba(2,6,23,.2), transparent); transition: opacity .2s; }
.video-embed:hover .scrim { opacity: .75; }
.video-embed .play-btn {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; pointer-events: none;
}
.video-embed .play-btn span {
  width: 3rem; height: 3rem; border-radius: 50%;
  background: rgba(220,38,38,.95); color: var(--white);
  display: flex; align-items: center; justify-content: center;
  box-shadow: var(--shadow-xl);
  transition: all .3s;
}
@media (min-width: 640px) { .video-embed .play-btn span { width: 3.5rem; height: 3.5rem; } }
.video-embed:hover .play-btn span { transform: scale(1.1); background: #dc2626; }
.video-embed .caption {
  position: absolute; bottom: .625rem; left: .75rem; right: .75rem;
  color: var(--white); font-size: .6875rem; font-weight: 500;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  text-shadow: 0 1px 3px rgba(0,0,0,.4);
}
.video-embed iframe { width: 100%; height: 100%; border: 0; position: absolute; inset: 0; }

.video-card { display: flex; flex-direction: column; gap: .75rem; }
.video-card .frame { border-radius: 1rem; overflow: hidden; box-shadow: var(--shadow-md); border: 1px solid var(--slate-200); background: var(--slate-950); }
.video-card .info { padding: 0 .125rem; }
.video-card .info h3 { font-size: .875rem; font-weight: 700; color: var(--slate-950); line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
@media (min-width: 640px) { .video-card .info h3 { font-size: 1rem; } }
.video-card .info p { font-size: .75rem; color: var(--slate-600); line-height: 1.5; margin-top: .25rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

.case-card .frame { border-radius: 1rem; overflow: hidden; border: 1px solid var(--slate-200); box-shadow: var(--shadow-md); }

/* =========================================================
   Doctor bio
   ========================================================= */
.bio-mobile-header { text-align: center; margin-bottom: 1.5rem; }
@media (min-width: 1024px) { .bio-mobile-header { display: none; } }
.bio-desktop-header { display: none; }
@media (min-width: 1024px) { .bio-desktop-header { display: block; margin-bottom: 1rem; } }

.bio-collage {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: .75rem;
}
@media (min-width: 640px) { .bio-collage { gap: 1rem; } }
.bio-collage .tall { position: relative; aspect-ratio: 3/4; border-radius: 1rem; overflow: hidden; border: 1px solid var(--slate-200); background: var(--slate-100); box-shadow: var(--shadow-sm); }
.bio-collage .stack { display: flex; flex-direction: column; gap: .75rem; }
@media (min-width: 640px) { .bio-collage .stack { gap: 1rem; } }
.bio-collage .stack .box { position: relative; aspect-ratio: 4/3; border-radius: 1rem; overflow: hidden; border: 1px solid var(--slate-200); background: var(--slate-100); box-shadow: var(--shadow-sm); }
.bio-collage img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

.bio-copy { color: var(--slate-600); font-size: .8125rem; line-height: 1.7; text-align: center; }
@media (min-width: 1024px) { .bio-copy { text-align: left; } }
@media (min-width: 480px) { .bio-copy { font-size: .875rem; } }
@media (min-width: 640px) { .bio-copy { font-size: 1rem; } }
@media (min-width: 1024px) { .bio-copy { font-size: 1.125rem; } }
.bio-copy p + p { margin-top: .75rem; }

.bio-points { padding-top: .5rem; border-top: 1px solid rgba(226,232,240,.8); margin-top: 1rem; }
.bio-point { display: flex; align-items: flex-start; gap: .75rem; margin-top: 1rem; }
.bio-point .dot { width: .375rem; height: .375rem; border-radius: 50%; background: var(--amber-500); margin-top: .5rem; flex-shrink: 0; }
.bio-point.alt .dot { background: var(--slate-900); }
.bio-point h3 { font-size: .875rem; font-weight: 700; color: var(--slate-950); }
@media (min-width: 640px) { .bio-point h3 { font-size: 1rem; } }
.bio-point p { font-size: .75rem; color: var(--slate-600); line-height: 1.5; }
@media (min-width: 640px) { .bio-point p { font-size: .875rem; } }

.bio-accred { padding-top: .75rem; border-top: 1px solid var(--slate-100); margin-top: 1rem; }
.bio-accred > p { font-size: .6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--slate-600); margin-bottom: .6rem; }
.bio-accred-list { display: flex; flex-direction: column; gap: .75rem; }
@media (min-width: 640px) { .bio-accred-list { flex-direction: row; gap: 1.5rem; } }
.bio-accred-item { display: inline-flex; align-items: center; gap: .625rem; text-align: left; padding: .25rem 0; }
.bio-accred-item .logo-box { width: 2rem; height: 2rem; border-radius: .375rem; background: var(--slate-100); padding: .125rem; display: flex; align-items: center; justify-content: center; flex-shrink: 0; border: 1px solid rgba(226,232,240,.6); }
.bio-accred-item .title-row { display: flex; align-items: center; gap: .25rem; }
.bio-accred-item .title-row span.name { font-size: .75rem; font-weight: 700; color: var(--slate-900); font-family: var(--font-heading); }
@media (min-width: 640px) { .bio-accred-item .title-row span.name { font-size: .875rem; } }
.bio-accred-item .title-row svg { color: var(--brand); opacity: .7; width: .75rem; height: .75rem; }
.bio-accred-item:hover .title-row span.name { color: var(--brand); }
.bio-accred-item:hover .title-row svg { opacity: 1; }
.bio-accred-item small { font-size: .625rem; color: var(--slate-600); display: block; }

.bio-cta { padding-top: .25rem; display: flex; justify-content: center; }
@media (min-width: 1024px) { .bio-cta { justify-content: flex-start; } }

/* PDF modal */
.pdf-modal-header { display: flex; align-items: center; justify-content: space-between; padding: .875rem 1.25rem; border-bottom: 1px solid var(--slate-200); background: rgba(248,250,252,.8); }
.pdf-modal-header .left { display: flex; align-items: center; gap: .625rem; }
.pdf-modal-header .left svg { color: var(--emerald-600); flex-shrink: 0; }
.pdf-modal-header .left h3 { font-size: .875rem; font-weight: 700; color: var(--slate-950); }
@media (min-width: 640px) { .pdf-modal-header .left h3 { font-size: 1rem; } }
.pdf-modal-header .left p { font-size: .75rem; color: var(--slate-500); }
.pdf-modal-header .right { display: flex; align-items: center; gap: .5rem; }
.pdf-open-link { display: none; align-items: center; gap: .375rem; padding: .375rem .75rem; border-radius: var(--radius-lg); font-size: .75rem; font-weight: 600; color: var(--slate-700); background: var(--white); border: 1px solid var(--slate-200); }
@media (min-width: 640px) { .pdf-open-link { display: inline-flex; } }
.pdf-open-link:hover { background: var(--slate-100); }
.pdf-modal-body { flex: 1; width: 100%; background: var(--slate-100); position: relative; min-height: 60vh; }
.pdf-modal-body iframe { width: 100%; height: 100%; border: 0; position: absolute; inset: 0; }

/* =========================================================
   Candidacy
   ========================================================= */
.candidacy-list { }
@media (max-width: 767px) {
  .candidacy-list { display: flex; flex-direction: column; }
  .candidacy-item { padding: 1rem 0; border-bottom: 1px solid rgba(226,232,240,.8); display: flex; gap: 1rem; align-items: flex-start; }
  .candidacy-item:last-child { border-bottom: none; }
}
@media (min-width: 768px) {
  .candidacy-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
  .candidacy-item { padding: 1.25rem; border-radius: var(--radius-xl); background: var(--white); border: 1px solid rgba(226,232,240,.8); box-shadow: var(--shadow-xs); display: flex; gap: 1rem; align-items: flex-start; transition: border-color .2s; }
  .candidacy-item:hover { border-color: var(--slate-300); }
}
@media (min-width: 1024px) { .candidacy-list { grid-template-columns: repeat(3, 1fr); } }
.candidacy-item .num { font-size: .75rem; font-weight: 700; color: var(--brand); font-family: 'Courier New', monospace; letter-spacing: .05em; padding-top: .125rem; flex-shrink: 0; user-select: none; }
.candidacy-item h3 { font-size: 1rem; font-weight: 700; color: var(--slate-950); line-height: 1.35; }
.candidacy-item p { font-size: .75rem; color: var(--slate-600); line-height: 1.5; margin-top: .25rem; }
@media (min-width: 640px) { .candidacy-item p { font-size: .8125rem; } }

.candidacy-prompt { margin-top: 2.5rem; text-align: center; }
@media (min-width: 640px) { .candidacy-prompt { margin-top: 3.5rem; } }
.candidacy-prompt h3 { font-size: 1.125rem; font-weight: 700; color: var(--slate-950); }
@media (min-width: 640px) { .candidacy-prompt h3 { font-size: 1.25rem; } }
.candidacy-prompt p { font-size: .75rem; color: var(--slate-600); margin-top: .25rem; }
@media (min-width: 640px) { .candidacy-prompt p { font-size: .8125rem; } }
.candidacy-prompt .btn-wrap { display: flex; justify-content: center; padding-top: 1rem; }

/* =========================================================
   Clinic tour
   ========================================================= */
.tour-points { display: flex; flex-direction: column; gap: 1rem; }
@media (min-width: 640px) { .tour-points { gap: 1.5rem; } }
.tour-point { padding: 1rem 1.25rem; border-radius: var(--radius-xl); background: rgba(248,250,252,.8); border: 1px solid rgba(226,232,240,.8); }
.tour-point h3 { font-size: .875rem; font-weight: 700; color: var(--slate-950); }
@media (min-width: 640px) { .tour-point h3 { font-size: 1rem; } }
.tour-point p { font-size: .75rem; color: var(--slate-600); margin-top: .25rem; line-height: 1.5; }
@media (min-width: 640px) { .tour-point p { font-size: .875rem; } }

.facility-photos { display: flex; gap: .875rem; overflow-x: auto; padding-bottom: .5rem; scrollbar-width: none; margin-top: 2rem; }
.facility-photos::-webkit-scrollbar { display: none; }
@media (min-width: 640px) { .facility-photos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; overflow: visible; padding-bottom: 0; } }
.facility-photo { position: relative; min-width: 260px; aspect-ratio: 16/10; border-radius: 1rem; overflow: hidden; border: 1px solid var(--slate-200); background: var(--slate-100); box-shadow: var(--shadow-md); flex-shrink: 0; }
@media (min-width: 640px) { .facility-photo { min-width: 0; flex-shrink: 1; aspect-ratio: 4/3; } }
.facility-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.facility-photo:hover img { transform: scale(1.04); }
.facility-photo .scrim { position: absolute; inset: 0; background: linear-gradient(to top, rgba(2,6,23,.8), rgba(2,6,23,.2), transparent); }
.facility-photo .caption { position: absolute; bottom: .75rem; left: .875rem; right: .875rem; color: var(--white); }
.facility-photo .caption .title { font-size: .875rem; font-weight: 700; font-family: var(--font-heading); letter-spacing: -0.01em; }
.facility-photo .caption .sub { font-size: .6875rem; color: rgba(255,255,255,.8); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* =========================================================
   Corticobasal Science / Implants principles
   ========================================================= */
.principles { display: flex; flex-direction: column; }
.principle { padding-top: 1.25rem; border-top: 1px solid var(--slate-100); }
.principle:first-child { padding-top: 0; border-top: none; }
@media (min-width: 640px) { .principle { padding-top: 1.5rem; } }
.principle h3 { display: flex; align-items: baseline; gap: .625rem; font-size: 1rem; font-weight: 700; color: var(--slate-950); }
@media (min-width: 640px) { .principle h3 { font-size: 1.125rem; } }
.principle h3 .num { font-size: .75rem; font-family: 'Courier New', monospace; font-weight: 700; color: var(--brand); letter-spacing: .05em; flex-shrink: 0; user-select: none; }
.principle p { font-size: .8125rem; color: var(--slate-600); line-height: 1.5; margin-top: .25rem; padding-left: 2.1rem; }
@media (min-width: 640px) { .principle p { font-size: 1rem; padding-left: 2.25rem; } }

.science-image, .implants-image {
  position: relative; border-radius: 1rem; overflow: hidden; border: 1px solid var(--slate-200);
  background: var(--slate-100); aspect-ratio: 16/11; box-shadow: var(--shadow-sm);
}
@media (min-width: 640px) { .science-image { aspect-ratio: 4/3; } }
.science-image img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* Implants feature cards */
.implant-cards { display: none; }
@media (min-width: 1024px) { .implant-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; } }
.implant-card { display: flex; flex-direction: column; gap: 1rem; }
.implant-card .visual { position: relative; aspect-ratio: 4/3; width: 100%; border-radius: 1rem; overflow: hidden; border: 1px solid var(--slate-200); background: var(--slate-100); box-shadow: var(--shadow-md); }
.implant-card .visual img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.implant-card:hover .visual img { transform: scale(1.04); }
.implant-card .visual .scrim { position: absolute; inset: 0; background: linear-gradient(to top, rgba(2,6,23,.6), transparent, transparent); }
.implant-card .visual .tag {
  position: absolute; top: .75rem; left: .75rem; display: inline-flex; align-items: center; gap: .375rem;
  padding: .25rem .625rem; border-radius: var(--radius-full); background: rgba(2,6,23,.75); backdrop-filter: blur(2px);
  color: var(--white); font-size: .625rem; font-weight: 600; letter-spacing: .02em; border: 1px solid rgba(255,255,255,.2);
}
.implant-card .visual .tag svg { color: var(--brand); width: .75rem; height: .75rem; }
.implant-card .visual .num { position: absolute; bottom: .75rem; right: .75rem; color: rgba(255,255,255,.9); font-family: 'Courier New', monospace; font-weight: 700; font-size: .875rem; letter-spacing: .05em; }
.implant-card .info { padding: 0 .125rem; }
.implant-card .info h3 { font-size: 1rem; font-weight: 700; color: var(--slate-950); line-height: 1.35; }
@media (min-width: 640px) { .implant-card .info h3 { font-size: 1.125rem; } }
.implant-card .info p { font-size: .75rem; color: var(--slate-600); line-height: 1.5; margin-top: .25rem; }
@media (min-width: 640px) { .implant-card .info p { font-size: .875rem; } }

.implant-cards-mobile { }
@media (min-width: 1024px) { .implant-cards-mobile { display: none; } }

/* =========================================================
   Timeline
   ========================================================= */
.timeline-desktop { display: none; }
@media (min-width: 1024px) { .timeline-desktop { display: block; } }
.timeline-mobile { position: relative; display: flex; flex-direction: column; gap: 1.25rem; }
@media (min-width: 1024px) { .timeline-mobile { display: none; } }

.timeline-selector { position: relative; max-width: 56rem; margin: 0 auto 2.5rem; }
.timeline-selector .line { position: absolute; top: 1.25rem; left: 12.5%; right: 12.5%; height: 2px; background: var(--slate-200); }
.timeline-selector .steps { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.timeline-step-btn { display: flex; flex-direction: column; align-items: center; text-align: center; }
.timeline-step-btn .node {
  position: relative; z-index: 1; width: 2.5rem; height: 2.5rem; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; font-size: .75rem; font-weight: 700;
  font-family: 'Courier New', monospace; transition: all .3s;
  background: var(--white); color: var(--slate-600); border: 1px solid var(--slate-300);
}
.timeline-step-btn:hover .node { border-color: var(--slate-500); color: var(--slate-950); }
.timeline-step-btn.active .node { background: var(--slate-950); color: var(--white); box-shadow: 0 0 0 4px var(--slate-200); transform: scale(1.1); }
.timeline-step-btn .labels { margin-top: .75rem; }
.timeline-step-btn .labels .title { font-size: .875rem; font-weight: 700; font-family: var(--font-heading); color: var(--slate-600); display: block; }
.timeline-step-btn.active .labels .title { color: var(--slate-950); }
.timeline-step-btn .labels .time { font-size: .75rem; color: var(--slate-600); display: block; }

.timeline-showcase { max-width: 64rem; margin: 0 auto; border-radius: 1rem; background: var(--white); border: 1px solid rgba(226,232,240,.8); padding: 2rem 2.5rem; box-shadow: var(--shadow-sm); }
.timeline-showcase__grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 2.5rem; align-items: center; }
.timeline-showcase__text { grid-column: span 7; }
.timeline-showcase__tag { display: inline-block; padding: .125rem .625rem; border-radius: var(--radius-full); font-size: .6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; background: var(--brand-10); color: var(--brand); border: 1px solid var(--brand-20); margin-bottom: .375rem; }
.timeline-showcase__text h3 { font-size: 1.5rem; font-weight: 700; color: var(--slate-950); line-height: 1.3; }
@media (min-width: 640px) { .timeline-showcase__text h3 { font-size: 1.875rem; } }
.timeline-showcase__text p { font-size: 1rem; color: var(--slate-700); line-height: 1.6; margin-top: 1rem; }
.timeline-showcase__img { grid-column: span 5; position: relative; aspect-ratio: 4/3; border-radius: 1rem; overflow: hidden; border: 1px solid var(--slate-200); background: var(--slate-100); box-shadow: var(--shadow-md); }
.timeline-showcase__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.timeline-showcase__img:hover img { transform: scale(1.03); }
.timeline-showcase__img .scrim { position: absolute; inset: 0; background: linear-gradient(to top, rgba(2,6,23,.7), rgba(2,6,23,.1), transparent); }
.timeline-showcase__img .caption { position: absolute; bottom: .875rem; left: 1rem; right: 1rem; color: var(--white); font-size: .75rem; font-weight: 700; font-family: var(--font-heading); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.timeline-mobile .connector { position: absolute; top: 1.5rem; bottom: 5rem; left: 19px; width: 2px; background: var(--slate-200); }
.timeline-mobile-item { position: relative; padding-left: 3rem; }
.timeline-mobile-item .marker {
  position: absolute; top: .875rem; left: 0; width: 2.25rem; height: 2.25rem; border-radius: 50%;
  background: var(--slate-950); color: var(--white); font-family: 'Courier New', monospace; font-weight: 700; font-size: .75rem;
  display: flex; align-items: center; justify-content: center; box-shadow: var(--shadow-xs); z-index: 1;
}
.timeline-mobile-item .card { background: var(--white); border-radius: 1rem; border: 1px solid var(--slate-200); overflow: hidden; box-shadow: var(--shadow-xs); }
.timeline-mobile-item .card-header { width: 100%; text-align: left; padding: 1rem; display: flex; align-items: flex-start; justify-content: space-between; gap: .75rem; background: var(--white); transition: background .2s; }
.timeline-mobile-item .card-header:hover { background: rgba(248,250,252,.8); }
.timeline-mobile-item .card-header .time { font-size: .625rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--brand); display: block; }
.timeline-mobile-item .card-header h3 { font-size: 1rem; font-weight: 700; color: var(--slate-950); line-height: 1.35; margin-top: .25rem; }
.timeline-mobile-item .chevron { padding: .375rem; border-radius: 50%; background: var(--slate-100); color: var(--slate-600); flex-shrink: 0; transition: transform .2s; display: flex; }
.timeline-mobile-item.expanded .chevron { transform: rotate(180deg); }
.timeline-mobile-item .card-body { padding: 0 1rem 1.25rem; border-top: 1px solid var(--slate-100); padding-top: .875rem; display: none; }
.timeline-mobile-item.expanded .card-body { display: block; }
.timeline-mobile-item .card-body .photo { position: relative; aspect-ratio: 16/10; width: 100%; border-radius: .75rem; overflow: hidden; border: 1px solid var(--slate-200); background: var(--slate-100); box-shadow: var(--shadow-xs); margin-bottom: .875rem; }
.timeline-mobile-item .card-body .photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.timeline-mobile-item .card-body p { font-size: .75rem; color: var(--slate-700); line-height: 1.6; }
@media (min-width: 480px) { .timeline-mobile-item .card-body p { font-size: .8125rem; } }

.timeline-cta { margin-top: 3rem; text-align: center; display: flex; justify-content: center; }
@media (min-width: 640px) { .timeline-cta { margin-top: 4rem; } }

/* =========================================================
   Consultation section + form
   ========================================================= */
.consult-section { padding: 4rem 0 6rem; background: rgba(248,250,252,.8); border-top: 1px solid var(--slate-200); border-bottom: none; }
@media (min-width: 640px) { .consult-section { padding: 5rem 0 6rem; } }
.consult-grid { display: grid; gap: 2.5rem; align-items: start; }
@media (min-width: 1024px) { .consult-grid { grid-template-columns: repeat(12, 1fr); gap: 3rem; } }
.consult-left { display: none; }
@media (min-width: 1024px) { .consult-left { display: block; grid-column: span 5; } }
.consult-left h2 { font-size: 2.25rem; font-weight: 700; color: var(--slate-950); letter-spacing: -0.01em; line-height: 1.2; margin-top: .5rem; }
@media (min-width: 480px) { .consult-left h2 { font-size: 2.5rem; } }
@media (min-width: 640px) { .consult-left h2 { font-size: 3rem; } }
.consult-left p.desc { font-size: .875rem; color: var(--slate-600); line-height: 1.6; margin-top: .75rem; }
@media (min-width: 640px) { .consult-left p.desc { font-size: 1rem; } }
.consult-expect { margin-top: 1.5rem; }
.consult-expect .label { font-size: .75rem; font-weight: 700; color: var(--slate-900); text-transform: uppercase; letter-spacing: .05em; display: block; margin-bottom: .75rem; }
.consult-expect .item { display: flex; align-items: flex-start; gap: .625rem; font-size: .8125rem; color: var(--slate-700); font-weight: 500; margin-top: .625rem; }
@media (min-width: 640px) { .consult-expect .item { font-size: .875rem; } }
.consult-expect .item svg { color: var(--emerald-600); flex-shrink: 0; margin-top: .125rem; }

.consult-right { }
@media (min-width: 1024px) { .consult-right { grid-column: span 7; } }
.consult-panel { background: var(--white); border: 1px solid rgba(226,232,240,.9); box-shadow: var(--shadow-lg); border-radius: 1.25rem; padding: 1.25rem; position: relative; }
@media (min-width: 640px) { .consult-panel { padding: 1.75rem; border-radius: 1.5rem; } }
@media (min-width: 1024px) { .consult-panel { padding: 2rem; } }

.form-header { margin-bottom: 1.25rem; padding-bottom: 1rem; border-bottom: 1px solid rgba(226,232,240,.7); }
.form-header .eyebrow { margin-bottom: .25rem; }
.form-header h3 { font-size: 1.25rem; font-weight: 700; letter-spacing: -0.01em; color: var(--slate-950); }
@media (min-width: 640px) { .form-header h3 { font-size: 1.5rem; } }
.form-header p { font-size: .75rem; color: var(--slate-600); line-height: 1.5; margin-top: .25rem; }
@media (min-width: 640px) { .form-header p { font-size: .875rem; } }

.consult-form { display: grid; gap: .875rem; }
@media (min-width: 640px) { .consult-form { gap: 1rem; } }
.form-field { display: flex; flex-direction: column; gap: .375rem; }
.form-field label { font-size: .875rem; color: var(--slate-700); font-weight: 500; }
.form-field label .req { color: var(--slate-400); font-weight: 400; margin-left: .125rem; }
.form-field input, .form-field textarea {
  width: 100%; padding: 0 .875rem; border-radius: var(--radius-xl);
  background: rgba(248,250,252,.5); color: var(--slate-900);
  border: 1px solid rgba(226,232,240,.9); outline: none;
  transition: all .15s; font-size: 1rem;
}
.form-field input { height: 3.25rem; }
@media (min-width: 640px) { .form-field input { height: 3.375rem; } }
.form-field textarea { padding: .875rem; min-height: 100px; height: 110px; resize: none; }
.form-field input:hover, .form-field textarea:hover { background: rgba(248,250,252,.8); border-color: var(--slate-300); }
.form-field input:focus, .form-field textarea:focus { background: var(--white); border-color: var(--slate-800); box-shadow: 0 0 0 2px rgba(2,6,23,.05); }
.form-field input::placeholder, .form-field textarea::placeholder { color: rgba(148,163,184,.8); }
.form-field.has-error input { border-color: var(--rose-400); }
.form-field.has-error input:focus { border-color: var(--rose-500); box-shadow: 0 0 0 2px rgba(244,63,94,.1); }
.form-field .error-msg { font-size: .75rem; color: var(--rose-600); font-weight: 500; padding-top: .125rem; display: none; }
.form-field.has-error .error-msg { display: block; }

.form-submit { padding-top: .25rem; }
.privacy-note { display: flex; align-items: center; justify-content: center; gap: .375rem; font-size: .75rem; color: var(--slate-500); padding-top: .125rem; }
.privacy-note svg { color: var(--slate-400); flex-shrink: 0; }

/* =========================================================
   Footer
   ========================================================= */
.site-footer { background: var(--slate-950); color: var(--slate-400); border-top: 1px solid var(--slate-900); padding: 2.5rem 0 1.5rem; }
@media (min-width: 640px) { .site-footer { padding: 3.5rem 0 1.5rem; } }
.footer-grid-desktop { display: none; }
@media (min-width: 768px) { .footer-grid-desktop { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.5rem; margin-bottom: 2.5rem; } }
@media (min-width: 1024px) { .footer-grid-desktop { gap: 3.5rem; } }

.footer-brand { display: flex; flex-direction: column; gap: 1rem; }
.footer-brand .logo-box { display: inline-flex; align-items: center; background: var(--white); padding: .625rem; border-radius: var(--radius-xl); border: 1px solid rgba(226,232,240,.2); box-shadow: var(--shadow-xs); width: fit-content; }
.footer-brand .logo-box img { height: 2.25rem; width: auto; object-fit: contain; }
@media (min-width: 640px) { .footer-brand .logo-box img { height: 2.5rem; } }
.footer-brand p { font-size: .75rem; color: var(--slate-400); line-height: 1.6; max-width: 24rem; }
@media (min-width: 640px) { .footer-brand p { font-size: .875rem; } }
.footer-socials { display: flex; align-items: center; gap: .75rem; padding-top: .5rem; }
.footer-socials a { width: 2.75rem; height: 2.75rem; border-radius: 50%; background: var(--slate-900); border: 1px solid var(--slate-800); display: flex; align-items: center; justify-content: center; color: var(--slate-300); transition: all .2s; }
.footer-socials a:hover.yt { background: rgba(220,38,38,.2); color: #ef4444; }
.footer-socials a:hover.ig { background: rgba(219,39,119,.2); color: #f472b6; }
.footer-socials a:hover.fb { background: rgba(37,99,235,.2); color: #60a5fa; }

.footer-col-title { color: var(--white); font-size: .875rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; font-family: var(--font-heading); margin-bottom: .875rem; }
.footer-links { display: flex; flex-direction: column; gap: .125rem; font-size: .8125rem; }
.footer-links li button { color: var(--slate-400); text-align: left; min-height: 40px; display: inline-flex; align-items: center; padding: .25rem 0; transition: color .2s; }
.footer-links li button:hover { color: var(--amber-400); }

.footer-contact { display: flex; flex-direction: column; gap: .75rem; font-size: .8125rem; }
.footer-contact .row { display: flex; align-items: flex-start; gap: .75rem; }
.footer-contact .row svg { color: var(--amber-400); flex-shrink: 0; margin-top: .125rem; }
.footer-contact .loc a { color: var(--slate-300); line-height: 1.5; transition: color .2s; }
.footer-contact .loc strong { color: var(--white); font-weight: 600; display: block; }
.footer-contact .loc small { color: var(--slate-400); font-size: .75rem; display: block; margin-top: .125rem; }
.footer-contact .loc a:hover strong, .footer-contact .loc a:hover small { color: var(--amber-300); }
.footer-contact .tel a, .footer-contact .mail a { color: var(--slate-200); font-weight: 600; min-height: 44px; display: inline-flex; align-items: center; transition: color .2s; }
.footer-contact .mail a { color: var(--slate-300); font-weight: 400; }
.footer-contact .tel a:hover, .footer-contact .mail a:hover { color: var(--amber-400); }
.footer-contact .hours { color: var(--slate-400); font-size: .75rem; }

/* Footer mobile */
.footer-mobile { display: flex; flex-direction: column; gap: 1.25rem; margin-bottom: 1rem; }
@media (min-width: 768px) { .footer-mobile { display: none; } }
.footer-mobile .logo-center { display: flex; justify-content: center; }
.footer-mobile p.desc { font-size: .75rem; color: var(--slate-400); line-height: 1.6; text-align: left; }
.footer-mobile .socials-center { display: flex; align-items: center; justify-content: center; gap: 1rem; padding-top: .25rem; }

.footer-accordion { border-top: 1px solid rgba(2,6,23,.8); padding-top: .25rem; }
.footer-accordion-item { border-bottom: 1px solid rgba(30,41,59,.8); }
.footer-accordion-item:last-child { border-bottom: none; }
.footer-accordion-trigger {
  width: 100%; display: flex; align-items: center; justify-content: space-between;
  color: var(--white); font-size: .8125rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;
  font-family: var(--font-heading); padding: .875rem 0;
}
.footer-accordion-trigger svg { transition: transform .2s; }
.footer-accordion-item.open .footer-accordion-trigger svg { transform: rotate(180deg); }
.footer-accordion-content { display: none; padding-bottom: 1rem; }
.footer-accordion-item.open .footer-accordion-content { display: block; }
.footer-accordion-content .footer-links li button { min-height: 44px; width: 100%; }
.footer-accordion-content .footer-contact { text-align: left; }

.footer-bottom { padding-top: 1rem; border-top: 1px solid var(--slate-900); display: flex; flex-direction: column; align-items: center; justify-content: space-between; gap: .75rem; font-size: .75rem; color: var(--slate-400); text-align: center; }
@media (min-width: 640px) { .footer-bottom { flex-direction: row; text-align: left; padding-top: 1.5rem; } }
.footer-bottom .legal-links { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 1.5rem .25rem; font-size: .75rem; }
.footer-bottom .legal-links a { color: var(--slate-400); min-height: 44px; display: inline-flex; align-items: center; padding: .5rem .25rem; transition: color .2s; }
.footer-bottom .legal-links a:hover { color: var(--amber-400); }

/* =========================================================
   Floating CTA bar
   ========================================================= */
.floating-cta-mobile {
  display: none; position: fixed; bottom: 0; left: 0; right: 0; z-index: 50;
  background: var(--white); border-top: 1px solid var(--slate-200); box-shadow: var(--shadow-2xl);
  grid-template-columns: repeat(2, 1fr); padding-bottom: env(safe-area-inset-bottom, 0px);
  transform: translateY(100%); transition: transform .25s ease, opacity .25s ease; opacity: 0;
}
.floating-cta-mobile.visible { display: grid; transform: translateY(0); opacity: 1; }
@media (min-width: 768px) { .floating-cta-mobile { display: none !important; } }
.floating-cta-mobile button { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: .625rem .25rem; transition: background .2s; }
.floating-cta-mobile button:first-child { background: var(--white); color: var(--slate-900); border-right: 1px solid var(--slate-200); }
.floating-cta-mobile button:first-child:hover { background: var(--slate-50); }
.floating-cta-mobile button:first-child svg { color: var(--slate-900); margin-bottom: .125rem; }
.floating-cta-mobile button.book { background: var(--slate-950); color: var(--white); }
.floating-cta-mobile button.book:hover { background: var(--slate-900); }
.floating-cta-mobile button.book svg { color: var(--amber-400); margin-bottom: .125rem; }
.floating-cta-mobile span { font-size: .75rem; font-weight: 700; letter-spacing: -0.01em; }

.floating-cta-desktop {
  display: none; position: fixed; right: 1.5rem; bottom: 2rem; z-index: 50;
  flex-direction: column; align-items: flex-end; gap: .75rem;
  opacity: 0; transform: translateX(30px) scale(.9); transition: all .3s;
  pointer-events: none;
}
.floating-cta-desktop.visible { opacity: 1; transform: translateX(0) scale(1); pointer-events: auto; }
@media (min-width: 768px) { .floating-cta-desktop { display: flex; } }
.fab { width: 3.25rem; height: 3.25rem; border-radius: 50%; display: flex; align-items: center; justify-content: center; position: relative; transition: transform .15s; }
.fab:hover { transform: scale(1.1); }
.fab:active { transform: scale(.95); }
.fab .tooltip {
  display: inline-flex; align-items: center; position: absolute; right: 100%; margin-right: .75rem; top: 50%; transform: translateY(-50%);
  white-space: nowrap; padding: .375rem .75rem; border-radius: var(--radius-lg); background: var(--slate-900); color: var(--white);
  font-size: .75rem; font-weight: 600; opacity: 0; transition: opacity .2s; pointer-events: none; box-shadow: var(--shadow-md);
}
.fab:hover .tooltip { opacity: 1; }
.fab.call { background: var(--slate-900); color: var(--amber-400); border: 1px solid rgba(51,65,85,.6); box-shadow: 0 10px 20px -4px rgba(2,6,23,.3); }
.fab.call:hover { background: var(--slate-800); }
.fab.book { background: linear-gradient(to top right, #b45309, #d97706, #f59e0b); color: var(--white); border: 1px solid rgba(252,211,77,.4); box-shadow: 0 10px 20px -4px rgba(120,53,15,.35); }
.fab.book .ring { position: absolute; inset: 0; border-radius: 50%; background: rgba(245,158,11,.3); pointer-events: none; }
.fab.book svg { position: relative; z-index: 1; }

/* =========================================================
   Modal / Dialog
   ========================================================= */
.modal-overlay {
  position: fixed; inset: 0; z-index: 60; background: rgba(0,0,0,.4);
  backdrop-filter: blur(2px);
  display: none; align-items: center; justify-content: center; padding: 1rem;
  animation: fadeIn .15s ease;
}
.modal-overlay.open { display: flex; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

.modal-box {
  position: relative; width: 100%; max-width: 560px; max-height: 92vh; overflow-y: auto;
  background: var(--white); color: var(--slate-900); border: 1px solid var(--slate-200);
  box-shadow: var(--shadow-2xl); padding: 1.25rem; border-radius: 1.25rem;
  animation: modalIn .18s ease;
}
@media (min-width: 640px) { .modal-box { padding: 2rem; border-radius: 1.5rem; } }
@keyframes modalIn { from { opacity: 0; transform: scale(.96) translateY(6px); } to { opacity: 1; transform: scale(1) translateY(0); } }

.modal-box.modal-box--pdf { max-width: 56rem; height: 88vh; max-height: 88vh; display: flex; flex-direction: column; padding: 0; border-radius: 1rem; overflow: hidden; }

.modal-close {
  position: absolute; top: .875rem; right: .875rem; width: 2.75rem; height: 2.75rem; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; color: var(--slate-500); transition: all .2s; z-index: 20;
}
@media (min-width: 640px) { .modal-close { top: 1.25rem; right: 1.25rem; } }
.modal-close:hover { color: var(--slate-800); background: var(--slate-100); }

/* =========================================================
   Toast notifications (sonner replacement)
   ========================================================= */
.toast-stack { position: fixed; bottom: 1.25rem; right: 1.25rem; z-index: 999; display: flex; flex-direction: column; gap: .5rem; max-width: calc(100vw - 2rem); }
.toast {
  display: flex; align-items: flex-start; gap: .625rem; min-width: 280px; max-width: 360px;
  background: var(--white); border: 1px solid var(--slate-200); border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg); padding: .75rem .875rem; font-size: .8125rem; color: var(--slate-800);
  animation: toastIn .2s ease;
}
@keyframes toastIn { from { opacity: 0; transform: translateX(20px); } to { opacity: 1; transform: translateX(0); } }
.toast.toast--success { border-color: var(--emerald-200); }
.toast.toast--success svg { color: var(--emerald-600); }
.toast.toast--error { border-color: var(--rose-400); }
.toast.toast--error svg { color: var(--rose-600); }
.toast svg { flex-shrink: 0; margin-top: .0625rem; }
.toast .toast-title { font-weight: 700; color: var(--slate-900); }
.toast .toast-desc { color: var(--slate-600); font-size: .75rem; margin-top: .0625rem; }

/* =========================================================
   Simple content pages (thank-you / 404 / policies)
   ========================================================= */
.center-page {
  position: relative; min-height: 100svh; display: flex; flex-direction: column; justify-content: center; align-items: center;
  padding: 3rem 1rem; background: var(--slate-50); color: var(--slate-900); overflow: hidden;
}
.center-page .glow-a { position: absolute; top: 25%; left: 50%; transform: translate(-50%,-50%); width: 600px; height: 600px; background: rgba(217,249,157,0); border-radius: 50%; filter: blur(80px); pointer-events: none; }
.center-page .glow-a.emerald { background: rgba(209,250,229,.4); }
.center-page .glow-a.amber { background: rgba(254,243,199,.4); }
.center-page .glow-b { position: absolute; bottom: 2.5rem; right: 2.5rem; width: 20rem; height: 20rem; border-radius: 50%; filter: blur(80px); pointer-events: none; }
.center-page .glow-b.amber { background: rgba(254,243,199,.4); }
.center-page .glow-b.blue { background: rgba(219,234,254,.3); }

.center-card {
  position: relative; z-index: 10; width: 100%; max-width: 42rem; margin: auto;
}
.center-card .panel {
  position: relative; border-radius: 1.5rem; background: var(--white); border: 1px solid rgba(226,232,240,.8);
  padding: 1.5rem; box-shadow: var(--shadow-xl); text-align: center; overflow: hidden;
}
@media (min-width: 640px) { .center-card .panel { padding: 2.5rem; border-radius: 1.75rem; } }
.center-card .accent-bar { position: absolute; top: 0; left: 0; right: 0; height: .375rem; background: linear-gradient(to right, #10b981, #fbbf24, #d97706); }
.center-card .accent-bar.amber { background: linear-gradient(to right, #f59e0b, #fbbf24, #d97706); }
.center-card .icon-badge { width: 4rem; height: 4rem; margin: 0 auto; border-radius: 50%; background: var(--emerald-50); border: 1px solid var(--emerald-200); display: flex; align-items: center; justify-content: center; color: var(--emerald-600); box-shadow: var(--shadow-xs); }
@media (min-width: 640px) { .center-card .icon-badge { width: 5rem; height: 5rem; } }
.center-card .icon-badge.amber { background: var(--amber-50); border-color: var(--amber-200); color: var(--amber-700); border-radius: 1rem; width: 4rem; height: 4rem; margin-bottom: .25rem; }
.center-card h1 { font-size: 1.5rem; font-weight: 700; color: var(--slate-950); letter-spacing: -0.01em; margin-top: 1rem; }
@media (min-width: 640px) { .center-card h1 { font-size: 2.25rem; } }
.center-card .lede { font-size: .75rem; color: var(--slate-600); max-width: 32rem; margin: .5rem auto 0; line-height: 1.6; }
@media (min-width: 640px) { .center-card .lede { font-size: .875rem; } }
.center-card .ref-id { display: inline-flex; align-items: center; padding: .25rem .75rem; border-radius: var(--radius-md); background: var(--slate-100); border: 1px solid var(--slate-200); font-size: .6875rem; font-family: 'Courier New', monospace; font-weight: 500; color: var(--slate-600); margin-top: .5rem; }

.steps-3 { display: grid; grid-template-columns: 1fr; gap: .75rem; text-align: left; padding-top: .5rem; margin-top: 1.5rem; }
@media (min-width: 640px) { .steps-3 { grid-template-columns: repeat(3, 1fr); } }
.steps-3 .step { padding: 1rem; border-radius: var(--radius-xl); background: var(--slate-50); border: 1px solid rgba(226,232,240,.8); }
.steps-3 .step .num { width: 1.75rem; height: 1.75rem; border-radius: var(--radius-lg); display: flex; align-items: center; justify-content: center; font-size: .75rem; font-weight: 700; margin-bottom: .5rem; }
.steps-3 .step:nth-child(1) .num { background: var(--amber-100); border: 1px solid var(--amber-200); color: #92400e; }
.steps-3 .step:nth-child(2) .num { background: var(--emerald-100); border: 1px solid var(--emerald-200); color: var(--emerald-800); }
.steps-3 .step:nth-child(3) .num { background: var(--blue-100); border: 1px solid var(--blue-200); color: var(--blue-800); }
.steps-3 .step p.title { font-size: .75rem; font-weight: 700; color: var(--slate-950); }
.steps-3 .step p.desc { font-size: .6875rem; color: var(--slate-600); line-height: 1.5; margin-top: .25rem; }

.return-row { display: flex; flex-direction: column; align-items: center; justify-content: space-between; gap: 1rem; padding-top: .75rem; margin-top: 1.5rem; border-top: 1px solid var(--slate-100); }
@media (min-width: 640px) { .return-row { flex-direction: row; } }
.return-row .back-link { display: inline-flex; align-items: center; gap: .375rem; font-size: .75rem; font-weight: 500; color: var(--slate-600); transition: color .2s; }
.return-row .back-link:hover { color: var(--slate-900); }
.return-row .countdown { display: inline-flex; align-items: center; gap: .375rem; font-size: .75rem; color: var(--slate-400); }
.return-row .countdown strong { color: var(--slate-700); font-weight: 600; }

.spinner-page { min-height: 100svh; background: var(--slate-50); display: flex; align-items: center; justify-content: center; }
.spinner { width: 2rem; height: 2rem; border-radius: 50%; border: 2px solid var(--slate-300); border-top-color: var(--slate-900); }

.badge-404 { display: inline-flex; align-items: center; gap: .375rem; padding: .25rem .75rem; border-radius: var(--radius-full); background: rgba(254,243,199,.7); border: 1px solid rgba(253,230,138,.8); color: #78350f; font-size: .75rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; }
.badge-404 svg { color: #b45309; }

.policy-badge { display: inline-flex; align-items: center; gap: .375rem; color: #b45309; font-size: .75rem; font-weight: 600; letter-spacing: .02em; text-transform: uppercase; margin-top: .375rem; }
@media (min-width: 640px) { .policy-badge { font-size: .875rem; } }

.btn-dark-link {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  padding: .75rem 1.5rem; border-radius: var(--radius-xl); background: var(--slate-950); color: var(--white);
  font-weight: 600; font-size: .8125rem; box-shadow: var(--shadow-md); transition: background .2s;
}
@media (min-width: 640px) { .btn-dark-link { font-size: .875rem; } }
.btn-dark-link:hover { background: var(--slate-800); }

/* utility spacing */
.mt-space > * + * { margin-top: .5rem; }
.center-card .space-y { display: flex; flex-direction: column; gap: 1rem; }

/* screen-reader utility for dialog titles */
.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; }
