* { margin: 0; box-sizing: border-box;
    cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="26" height="26"><path d="M13 1 C15.8 4 16.8 7.5 16.8 11.5 L16.8 15.5 L9.2 15.5 L9.2 11.5 C9.2 7.5 10.2 4 13 1 Z" fill="%23f2eeff"/><path d="M9.2 12.5 L5.8 17.5 L9.2 16.3 Z" fill="%23f2eeff"/><path d="M16.8 12.5 L20.2 17.5 L16.8 16.3 Z" fill="%23f2eeff"/><circle cx="13" cy="9.2" r="1.7" fill="%237a50ff"/><path d="M11.4 16.2 C12 19.5 12.5 20.8 13 23 C13.5 20.8 14 19.5 14.6 16.2 Z" fill="%23a88bff"/></svg>') 13 1, auto;
  }
  body { font-family: system-ui, sans-serif; color: #f5f1e8; background: #06060a; }
  .track-wrap { height: 460vh; }
  .track-sticky { position: -webkit-sticky; position: sticky; top: 0; height: 100vh; overflow: hidden; }
  .track { display: flex; width: 400vw; height: 100%; will-change: transform; }
  .panel { width: 100vw; height: 100%; position: relative; flex-shrink: 0; }
  #world {
    position: fixed; inset: 0; width: 100%; height: 100%;
    object-fit: cover; z-index: 0;
    transform: scale(1.06);      /* headroom for parallax pan */
    will-change: transform;
    filter: brightness(.48) saturate(.85) contrast(1.08) sepia(.12);
  }
  #pulse {
    position: fixed; inset: 0; z-index: 1; pointer-events: none;
    mix-blend-mode: screen; opacity: 0; will-change: opacity;
    background: radial-gradient(circle at 50% 46%,
      rgba(226,206,255,.85) 0%, rgba(150,110,255,.35) 9%, transparent 22%);
  }
  .vignette {
    position: fixed; inset: 0; z-index: 1; pointer-events: none;
    background:
      radial-gradient(120% 90% at 50% 42%, transparent 30%, rgba(4,4,8,.75) 100%),
      linear-gradient(to top, rgba(4,4,8,.8), transparent 40%),
      linear-gradient(to bottom, rgba(4,4,8,.55), transparent 30%);
  }
  .grain {
    position: fixed; inset: 0; z-index: 1; pointer-events: none;
    opacity: .06; mix-blend-mode: overlay;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="180" height="180"><filter id="n"><feTurbulence type="fractalNoise" baseFrequency="0.9" numOctaves="2"/></filter><rect width="180" height="180" filter="url(%23n)"/></svg>');
  }
  .fade-in {
    position: fixed; inset: 0; z-index: 5; pointer-events: none;
    background: #06060a;
    animation: unveil 1s ease .1s forwards;
  }
  @keyframes unveil { to { opacity: 0; visibility: hidden; } }
  #title > * {
    animation: rise 1.2s cubic-bezier(.16,1,.3,1) both;
  }
  #title > :nth-child(1) { animation-delay: .25s; }
  #title > :nth-child(2) { animation-delay: .4s; }
  #title > :nth-child(3) { animation-delay: .6s; }
  #title > :nth-child(4) { animation-delay: .7s; }
  #title > :nth-child(5) { animation-delay: .85s; }
  @keyframes rise {
    from { opacity: 0; transform: translateY(26px); filter: blur(5px); }
  }
  #scrubbar {
    position: absolute; z-index: 3; left: 0; bottom: 0;
    width: 100%; height: 2px; pointer-events: none;
    background: linear-gradient(to right, rgba(185,162,255,.9), rgba(122,80,255,.9));
    transform-origin: left; transform: scaleX(.5);
  }
  @media (prefers-reduced-motion: reduce) {
    .fade-in, #scrubbar { display: none; }
    #title > * { animation: none; opacity: 1; }
  }
  header > div { will-change: transform; }
  nav {
    position: fixed; top: 0; left: 0; right: 0; z-index: 8;
    display: flex; justify-content: space-between; align-items: center;
    padding: 1.75rem 3rem;
  }
  nav .logo img {
    height: 6rem; width: auto; display: block;
    margin: -.75rem 0;   /* keep the big mark from inflating the nav bar */
    filter: drop-shadow(0 0 16px rgba(122,80,255,.6));
    animation: heartbeat 2.4s ease-in-out infinite;
  }
  @keyframes heartbeat {
    0%, 100% { transform: scale(1);    filter: drop-shadow(0 0 12px rgba(122,80,255,.45)); }
    14%      { transform: scale(1.07); filter: drop-shadow(0 0 26px rgba(122,80,255,.9)); }
    28%      { transform: scale(1);    filter: drop-shadow(0 0 14px rgba(122,80,255,.5)); }
    42%      { transform: scale(1.05); filter: drop-shadow(0 0 22px rgba(122,80,255,.75)); }
    56%      { transform: scale(1);    filter: drop-shadow(0 0 12px rgba(122,80,255,.45)); }
  }
  @media (prefers-reduced-motion: reduce) {
    nav .logo img { animation: none; }
  }
  #navLinks { display: flex; align-items: center; }
  nav a {
    color: #f5f1e8; text-decoration: none; margin-left: 2.5rem; white-space: nowrap;
    font-size: .72rem; letter-spacing: .28em; text-transform: uppercase;
    opacity: .6; transition: opacity .3s, color .3s;
  }
  nav a:hover { opacity: 1; color: #a88bff; }
  header {
    position: absolute; inset: 0; z-index: 2;
    display: grid; place-content: center; text-align: center;
    pointer-events: none;
    text-shadow: 0 2px 30px rgba(0,0,0,.8);
  }
  header .eyebrow {
    font-size: .95rem; letter-spacing: .5em; text-transform: uppercase;
    color: #b9a2ff; font-weight: 700; margin-bottom: 1.4rem;
    text-shadow: 0 1px 8px rgba(0,0,0,.9);
  }
  header h1 em {
    font-style: normal; text-shadow: none;
    background: linear-gradient(100deg, #7a50ff 0%, #d3c6ff 40%, #8b62ff 65%, #6a3df5 100%);
    -webkit-background-clip: text; background-clip: text; color: transparent;
  }
  .cta {
    pointer-events: auto; display: inline-block; margin-top: 2.2rem;
    padding: .95rem 2.6rem; border: 1px solid rgba(168,139,255,.6);
    border-radius: 999px; color: #f5f1e8; text-decoration: none;
    font-size: .72rem; letter-spacing: .3em; text-transform: uppercase;
    background: rgba(122,80,255,.12); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
    transition: background .3s, border-color .3s, box-shadow .3s;
  }
  .cta { position: relative; overflow: hidden; }
  .nav-cta {
    margin-top: 0; margin-left: 2.5rem; padding: .7rem 1.8rem;
    opacity: 1; font-size: .72rem; letter-spacing: .28em;
  }
  .cta::after {
    content: ''; position: absolute; inset: 0;
    background: linear-gradient(105deg, transparent 35%, rgba(255,255,255,.28) 50%, transparent 65%);
    transform: translateX(-100%);
  }
  .cta:hover::after { transition: transform .7s ease; transform: translateX(100%); }
  .cta:hover {
    background: rgba(122,80,255,.3); border-color: #a88bff;
    box-shadow: 0 0 30px rgba(122,80,255,.35);
  }
  .contact {
    position: relative; z-index: 2; text-align: center;
    padding: 2rem 1rem 1.6rem;
    font-size: .68rem; letter-spacing: .22em; opacity: .45;
  }
  nav .logo { display: block; margin-left: 0; opacity: 1; }
  /* ---- glass panels over the same background ---- */
  #how-it-works, #calculator, #features {
    z-index: 2; overflow-y: auto;
    display: grid; align-content: center; justify-items: center;
    padding: clamp(9rem, 17vh, 11.5rem) clamp(1.5rem, 5vw, 5rem) 3rem;
    background: radial-gradient(85% 75% at 50% 45%, rgba(6,6,10,.45), rgba(6,6,10,.1));
  }
  /* booking + AI demo are click-only overlays, not part of the journey */
  #booking, #demo {
    position: fixed; inset: 0; z-index: 10;
    display: none; overflow-y: auto;
    align-content: center; justify-items: center;
    padding: clamp(7.5rem, 14vh, 10rem) clamp(1.5rem, 5vw, 5rem) 3rem;
    background: rgba(4,4,8,.86);
    backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  }
  #booking.open, #demo.open { display: grid; animation: overlayin .45s ease both; }
  @keyframes overlayin { from { opacity: 0; } }
  body.overlay-open { overflow: hidden; }
  .overlay-close {
    position: fixed; top: 1.4rem; right: 1.6rem; z-index: 11;
    padding: .55rem 1.2rem; border-radius: 999px;
    border: 1px solid rgba(168,139,255,.45); background: rgba(6,6,10,.6);
    color: #f5f1e8; font: 700 .62rem/1 system-ui, sans-serif;
    letter-spacing: .28em; text-transform: uppercase;
    backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); transition: border-color .3s, box-shadow .3s;
  }
  .overlay-close:hover { border-color: #a88bff; box-shadow: 0 0 20px rgba(122,80,255,.35); }
  #how-it-works .inner {
    width: 100%; max-width: 1080px;
    display: grid; grid-template-columns: 1fr 1.25fr;
    gap: clamp(2.5rem, 5vw, 5rem);
    padding: clamp(2rem, 4vw, 3.5rem);
    background: rgba(8,8,14,.42);
    backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
    border: 1px solid rgba(185,162,255,.18); border-radius: 6px;
    box-shadow: 0 30px 80px rgba(0,0,0,.45);
  }
  #how-it-works .eyebrow, #calculator .eyebrow, #features .eyebrow, #booking .eyebrow, #demo .eyebrow, #testimonials .eyebrow {
    font-size: .72rem; letter-spacing: .5em; text-transform: uppercase;
    color: #b9a2ff; font-weight: 700; margin-bottom: 1.2rem;
  }
  #how-it-works h2, #calculator h2, #features h2, #booking h2, #demo h2, #testimonials h2 {
    font-family: Didot, "Bodoni MT", "Playfair Display", Georgia, serif;
    font-size: clamp(1.9rem, 3.4vw, 3rem); font-weight: 700;
    letter-spacing: .04em; line-height: 1.12;
  }
  #how-it-works h2 em, #calculator h2 em, #features h2 em, #booking h2 em, #demo h2 em, #testimonials h2 em {
    font-style: normal;
    background: linear-gradient(100deg, #7a50ff 0%, #d3c6ff 40%, #8b62ff 65%, #6a3df5 100%);
    -webkit-background-clip: text; background-clip: text; color: transparent;
  }
  /* ---- calculator ---- */
  #calculator .calc-inner {
    width: 100%; max-width: 980px; text-align: center;
    padding: clamp(2rem, 4vw, 3rem);
    background: rgba(8,8,14,.42);
    backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
    border: 1px solid rgba(185,162,255,.18); border-radius: 6px;
    box-shadow: 0 30px 80px rgba(0,0,0,.45);
  }
  #calculator .note {
    margin-top: .9rem; font-size: .68rem; letter-spacing: .24em;
    text-transform: uppercase; opacity: .5;
  }
  .calc-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem;
    margin-top: 2.2rem; text-align: center;
  }
  .calc-grid .tile {
    border: 1px solid rgba(185,162,255,.22); border-radius: 6px;
    padding: 1.6rem 1.8rem; display: flex; flex-direction: column;
    justify-content: center; gap: 1.1rem; background: rgba(12,10,22,.35);
  }
  .calc-grid label {
    font-size: .7rem; font-weight: 700; letter-spacing: .2em;
    text-transform: uppercase; opacity: .85; line-height: 1.7;
  }
  .calc-grid output {
    font-family: Didot, "Bodoni MT", "Playfair Display", Georgia, serif;
    font-size: 1.9rem; font-weight: 700; color: #d3c6ff;
  }
  .tile.total {
    background: linear-gradient(135deg, rgba(94,23,235,.75), rgba(139,85,247,.55));
    border-color: rgba(211,198,255,.5);
  }
  .tile.total .label { font-size: .7rem; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; }
  .tile.total output { color: #fff; font-size: clamp(2rem, 3.2vw, 2.9rem); text-shadow: 0 2px 20px rgba(0,0,0,.4); }
  input[type=range] {
    -webkit-appearance: none; appearance: none; width: 100%; height: 2px;
    border-radius: 2px; background: rgba(211,198,255,.35); outline: none;
  }
  input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none; appearance: none;
    width: 18px; height: 18px; border-radius: 50%;
    background: linear-gradient(135deg, #8b62ff, #5e17eb);
    border: 2px solid #f2eeff; box-shadow: 0 0 12px rgba(122,80,255,.8);
  }
  input[type=range]::-moz-range-thumb {
    width: 16px; height: 16px; border-radius: 50%;
    background: linear-gradient(135deg, #8b62ff, #5e17eb);
    border: 2px solid #f2eeff; box-shadow: 0 0 12px rgba(122,80,255,.8);
  }
  @media (max-width: 720px) { .calc-grid { grid-template-columns: 1fr; } }
  .demo-cta { margin-top: 2.2rem; text-align: center; }
  .demo-cta .cta { margin-top: 0; padding: .7rem 1.8rem; font-size: .72rem; letter-spacing: .28em; }
  .steps {
    margin-top: clamp(2.2rem, 5vh, 3.5rem);
    border-left: 1px solid rgba(185,162,255,.28);
  }
  .steps .step { position: relative; padding: 0 3.4rem 1.7rem 1.7rem; }
  .steps .ic {
    position: absolute; right: .3rem; top: 50%; transform: translateY(-58%);
    width: 34px; height: 34px; color: #b9a2ff; opacity: .92;
    filter: drop-shadow(0 0 9px rgba(122,80,255,.55));
  }
  .steps .step:last-child { padding-bottom: .2rem; }
  .steps .step::before {
    content: ''; position: absolute; left: -4px; top: .5rem;
    width: 7px; height: 7px; border-radius: 50%;
    background: #b9a2ff; box-shadow: 0 0 10px rgba(185,162,255,.9);
  }
  .steps .n {
    font-family: Didot, "Bodoni MT", "Playfair Display", Georgia, serif;
    font-size: 1.15rem; color: #b9a2ff; opacity: .9;
    display: inline-block; margin-right: .6rem;
  }
  .steps h3 {
    display: inline; font-size: .74rem; font-weight: 700;
    letter-spacing: .2em; text-transform: uppercase; line-height: 1.7;
  }
  .steps p { margin-top: .35rem; font-size: .82rem; opacity: .55; letter-spacing: .04em; }
  @media (max-width: 900px) {
    #how-it-works .inner { grid-template-columns: 1fr; gap: 2rem; }
  }
  .benefits { border-top: 1px solid rgba(185,162,255,.16); }
  .benefits details { border-bottom: 1px solid rgba(185,162,255,.16); }
  .benefits summary {
    list-style: none; display: flex; justify-content: space-between; align-items: center;
    gap: 2rem; padding: 1.6rem .2rem;
    font-size: clamp(.9rem, 1.6vw, 1.15rem); font-weight: 700;
    letter-spacing: .14em; text-transform: uppercase;
    transition: color .3s;
  }
  .benefits summary::-webkit-details-marker { display: none; }
  .benefits summary::after {
    content: '\2726'; flex-shrink: 0; color: #b9a2ff;
    transition: transform .35s ease; font-size: .9rem;
    animation: spark 2s ease-in-out infinite;
  }
  @keyframes spark {
    0%, 100% { opacity: .45; text-shadow: 0 0 2px rgba(185,162,255,.3); }
    50%      { opacity: 1;   text-shadow: 0 0 12px rgba(185,162,255,.95); }
  }
  .benefits details[open] summary::after { animation: none; opacity: 1; }
  @media (prefers-reduced-motion: reduce) {
    .benefits summary::after { animation: none; opacity: 1; }
  }
  .benefits details[open] summary { color: #b9a2ff; }
  .benefits details[open] summary::after { transform: rotate(135deg); }
  .benefits details p {
    padding: 0 .2rem 1.7rem; max-width: 62ch;
    font-size: .95rem; line-height: 1.7; opacity: .65; letter-spacing: .03em;
  }
  .benefits details p strong { color: #b9a2ff; font-weight: 600; }
  @media (max-width: 720px) { .steps { grid-template-columns: 1fr; gap: 2rem; } }
  .contact a { color: #f5f1e8; text-decoration: none; }
  .contact a:hover { color: #a88bff; }
  .contact .legal { margin-top: .55rem; opacity: .8; font-size: .62rem; }
  header h1 {
    font-family: Didot, "Bodoni MT", "Playfair Display", Georgia, serif;
    font-size: clamp(1.9rem, 4.4vw, 3.9rem); font-weight: 700;
    letter-spacing: .02em; line-height: 1.12; max-width: 18ch; margin: 0 auto;
    text-shadow: 0 2px 10px rgba(0,0,0,.95), 0 8px 45px rgba(0,0,0,.85);
  }
  header p {
    margin-top: 1.3rem; opacity: .85; font-weight: 600;
    font-size: .74rem; letter-spacing: .32em; text-transform: uppercase;
    text-shadow: 0 1px 8px rgba(0,0,0,.9);
  }
  header p.sub {
    max-width: 52ch; margin: 1.4rem auto 0; font-weight: 400; text-transform: none;
    font-size: clamp(.95rem, 1.35vw, 1.15rem); letter-spacing: 0; line-height: 1.55; opacity: .9;
  }
  header .rule {
    width: 3.5rem; height: 1px; margin: 1.6rem auto 0;
    background: linear-gradient(to right, transparent, #a88bff, transparent);
  }

  /* ---- features ---- */
  #features .feat-inner {
    width: 100%; max-width: 1120px;
    display: grid; grid-template-columns: 1fr 1.25fr;
    gap: clamp(2rem, 4vw, 3.5rem);
    padding: clamp(2rem, 4vw, 3rem);
    background: rgba(8,8,14,.42);
    backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
    border: 1px solid rgba(185,162,255,.18); border-radius: 6px;
    box-shadow: 0 30px 80px rgba(0,0,0,.45);
  }
  #features .note {
    margin-top: .9rem; font-size: .68rem; letter-spacing: .24em;
    text-transform: uppercase; opacity: .5;
  }
  .vid-wrap { position: relative; margin-top: 1.8rem; }
  #features video {
    width: 100%; display: block; border-radius: 6px; aspect-ratio: 16 / 9;
    border: 1px solid rgba(185,162,255,.28);
    box-shadow: 0 16px 50px rgba(0,0,0,.5);
  }
  #vidSound {
    position: absolute; right: .7rem; bottom: .7rem;
    padding: .45rem 1rem; border-radius: 999px;
    border: 1px solid rgba(168,139,255,.5); background: rgba(6,6,10,.62);
    color: #f5f1e8; font: 700 .58rem/1 system-ui, sans-serif;
    letter-spacing: .22em; text-transform: uppercase;
    backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); transition: border-color .3s, box-shadow .3s;
  }
  #vidSound:hover { border-color: #a88bff; box-shadow: 0 0 16px rgba(122,80,255,.4); }
  .feat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.8rem; align-content: center; }
  .feat-grid .feat { border-top: 1px solid rgba(185,162,255,.16); padding: .85rem 0; }
  .feat-grid h3 {
    font-size: .68rem; font-weight: 700; letter-spacing: .18em;
    text-transform: uppercase; color: #b9a2ff;
  }
  .feat-grid p { margin-top: .3rem; font-size: .78rem; line-height: 1.55; opacity: .6; }
  #features .demo-cta { text-align: center; margin-top: 1.6rem; }
  @media (max-width: 900px) {
    #features .feat-inner { grid-template-columns: 1fr; }
    .feat-grid { grid-template-columns: 1fr; }
  }

  /* ---- rotating testimonial (hero, bottom-left) ---- */

  /* ---- booking ---- */
  #booking .book-inner {
    width: 100%; max-width: 1320px; text-align: center;
    padding: clamp(1.6rem, 3vw, 2.5rem);
    background: rgba(10,8,18,.55);
    backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
    border: 1px solid rgba(185,162,255,.45); border-radius: 8px;
    box-shadow:
      0 0 0 1px rgba(122,80,255,.15),
      0 0 70px rgba(122,80,255,.28),
      0 30px 80px rgba(0,0,0,.5);
  }
  #booking .note {
    margin-top: .8rem; font-size: .68rem; letter-spacing: .24em;
    text-transform: uppercase; opacity: .5;
  }
  #booking { align-content: start; }   /* tall widget: pin under the nav, never behind it */
  #booking iframe {
    width: 100%; height: min(66vh, 720px); border: 0;
    margin-top: 1.4rem; border-radius: 6px; background: #fff;
  }

  /* ---- responsive: tablet ---- */
  @media (max-width: 1024px) {
    nav { padding: 1.25rem 1.5rem; }
    nav a { margin-left: 1.4rem; letter-spacing: .2em; }
    .nav-cta { margin-left: 1.4rem; padding: .6rem 1.3rem; }
    nav .logo img { height: 4.5rem; margin: -.5rem 0; }
    #how-it-works, #calculator, #features {
      padding-top: clamp(6rem, 12vh, 8rem);
    }
  }
  /* ---- responsive: phone — the journey becomes a normal vertical page ---- */
  @media (max-width: 768px) {
    .track-wrap { height: auto; }
    .track-sticky { position: static; height: auto; overflow: visible; }
    .track { display: block; width: 100%; height: auto; transform: none !important; }
    .panel { width: 100%; height: auto; }
    .panel.hero { height: 100vh; height: 100svh; }
    #how-it-works, #calculator, #features {
      min-height: 0; overflow: visible;
      padding: 4.5rem 1rem;
      background: none;
    }
    #booking, #demo { padding: 5rem 1rem 2rem; }
    .overlay-close { top: 1rem; right: 1rem; }
    #scrubbar { display: none; }
    nav { padding: .9rem 1rem; }
    nav .logo img { height: 4.4rem; margin: -.45rem 0; }
    nav { background: linear-gradient(rgba(6,6,10,.75), transparent); }
    header { padding: 0 1.25rem; }
    header .eyebrow { font-size: .68rem; letter-spacing: .3em; }
    header p { font-size: .62rem; letter-spacing: .2em; }
    header p.sub { font-size: .92rem; letter-spacing: 0; padding: 0 .5rem; }
    #how-it-works .inner, #features .feat-inner, #calculator .calc-inner, #booking .book-inner {
      padding: 1.4rem 1.2rem;
    }
    .calc-grid { gap: .9rem; margin-top: 1.6rem; }
    .calc-grid .tile { padding: 1.2rem 1.2rem; }
    .tile.total output { font-size: 1.7rem; }
    .benefits summary { letter-spacing: .1em; padding: 1.2rem .1rem; }
    #booking iframe { height: 68vh; height: 68svh; }
    #features .demo-cta, #how-it-works .demo-cta { text-align: center; }
    #features .feat-left .eyebrow, #features .feat-left h2, #features .feat-left .note { text-align: center; }
    .feat-grid h3 { text-align: center; }
    .contact { padding: 1.6rem 1.25rem 1.4rem; }
    .contact .legal { line-height: 2; }
    }

  /* ---- burger + overlay menu ---- */
  #burger {
    display: none; position: relative; z-index: 8;
    width: 34px; height: 26px; background: none; border: 0; padding: 0;
  }
  #burger span {
    position: absolute; left: 0; width: 100%; height: 2px; border-radius: 2px;
    background: #f2eeff; transition: transform .3s ease, opacity .3s ease, top .3s ease;
  }
  #burger span:nth-child(1) { top: 2px; }
  #burger span:nth-child(2) { top: 12px; }
  #burger span:nth-child(3) { top: 22px; }
  #burger.open span:nth-child(1) { top: 12px; transform: rotate(45deg); }
  #burger.open span:nth-child(2) { opacity: 0; }
  #burger.open span:nth-child(3) { top: 12px; transform: rotate(-45deg); }
  #mobileMenu {
    position: fixed; inset: 0; z-index: 7;
    display: grid; place-content: center; gap: 2.4rem; text-align: center;
    background: rgba(6,6,10,.93);
    backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
    opacity: 0; pointer-events: none; transition: opacity .35s ease;
  }
  #mobileMenu.open { opacity: 1; pointer-events: auto; }
  #mobileMenu a {
    color: #f5f1e8; text-decoration: none; font-weight: 700;
    font-size: 1rem; letter-spacing: .32em; text-transform: uppercase;
  }
  #mobileMenu a:hover { color: #a88bff; }
  #mobileMenu .cta { margin-top: .6rem; justify-self: center; }
  @media (max-width: 1024px) {
    #navLinks { display: none; }
    #burger { display: block; }
  }
  /* ---- back button ---- */
  #backBtn {
    position: fixed; left: 1.6rem; bottom: 1.4rem; z-index: 6;
    padding: .55rem 1.2rem; border-radius: 999px;
    border: 1px solid rgba(168,139,255,.45); background: rgba(6,6,10,.5);
    color: #f5f1e8; font: 700 .62rem/1 system-ui, sans-serif;
    letter-spacing: .28em; text-transform: uppercase;
    backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); transition: border-color .3s, box-shadow .3s;
  }
  #backBtn:hover { border-color: #a88bff; box-shadow: 0 0 20px rgba(122,80,255,.35); }
  @media (max-width: 768px) { #backBtn { left: 1rem; bottom: 1rem; } }

  /* ---- industries strip (features) ---- */
  .industries {
    grid-column: 1 / -1; margin-top: .5rem;
    border-top: 1px solid rgba(185,162,255,.16); padding-top: 1.6rem;
    text-align: center;
  }
  .industries .strip-label {
    font-size: .62rem; font-weight: 700; letter-spacing: .3em;
    text-transform: uppercase; opacity: .5; margin-bottom: 1.4rem;
  }
  .ind-row { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
  .ind { flex: 1 1 0; min-width: 90px; }
  .ind svg {
    width: 34px; height: 34px; color: #f5f1e8;
    filter: drop-shadow(0 0 9px rgba(122,80,255,.55));
    animation: indblink 2.6s ease-in-out infinite;
    transition: color .35s, filter .35s;
  }
  .ind:nth-child(2) svg { animation-delay: .35s; }
  .ind:nth-child(3) svg { animation-delay: .7s; }
  .ind:nth-child(4) svg { animation-delay: 1.05s; }
  .ind:nth-child(5) svg { animation-delay: 1.4s; }
  @keyframes indblink {
    0%, 100% { opacity: .5; filter: drop-shadow(0 0 4px rgba(122,80,255,.3)); }
    50%      { opacity: 1;  filter: drop-shadow(0 0 14px rgba(122,80,255,.9)); }
  }
  .ind:hover svg {
    animation: none; opacity: 1; color: #a88bff;
    filter: drop-shadow(0 0 18px rgba(122,80,255,1));
  }
  .ind div { transition: color .35s, opacity .35s; }
  .ind:hover div { opacity: 1; color: #a88bff; }
  @media (prefers-reduced-motion: reduce) { .ind svg { animation: none; opacity: 1; } }
  .ind div {
    margin-top: .55rem; font-size: .6rem; font-weight: 700;
    letter-spacing: .22em; text-transform: uppercase; opacity: .75;
  }

  /* ---- social icons ---- */
  .socials { display: flex; align-items: center; gap: 1.15rem; margin-left: 2.2rem; }
  .socials a { margin-left: 0; opacity: .55; transition: opacity .3s, color .3s; color: #f5f1e8; }
  .socials a:hover { opacity: 1; color: #a88bff; }
  .socials svg { width: 17px; height: 17px; display: block; }
  #mobileMenu .socials { justify-content: center; margin: .6rem 0 0; gap: 1.8rem; }
  #mobileMenu .socials svg { width: 23px; height: 23px; }

  /* ---- post-booking confirmation ---- */
  #booked { display: none; margin-top: 1.4rem; }
  #booked.show { display: block; animation: rise 1s cubic-bezier(.16,1,.3,1) both; }
  #booked h3 {
    font-family: Didot, "Bodoni MT", "Playfair Display", Georgia, serif;
    font-size: clamp(1.6rem, 3vw, 2.4rem); font-weight: 700; letter-spacing: .03em;
  }
  #booked h3 em {
    font-style: normal;
    background: linear-gradient(100deg, #7a50ff 0%, #d3c6ff 40%, #8b62ff 65%, #6a3df5 100%);
    -webkit-background-clip: text; background-clip: text; color: transparent;
  }
  #booked .booked-msg { display: none; }
  #booked.done video { display: none; }
  #booked.done .booked-msg { display: block; animation: rise 1s cubic-bezier(.16,1,.3,1) both; }
  #booked .booked-msg { margin-top: 1.3rem; }
  #booked .booked-note {
    margin: .7rem 0 1.2rem; font-size: .74rem; font-weight: 600;
    letter-spacing: .24em; text-transform: uppercase; opacity: .6;
  }
  #booked video {
    pointer-events: none; aspect-ratio: 9 / 16;
    width: 100%; max-width: 360px; max-height: min(64vh, 640px); display: block; margin: 0 auto; border-radius: 6px;
    border: 1px solid rgba(185,162,255,.35);
    box-shadow: 0 0 50px rgba(122,80,255,.25), 0 20px 60px rgba(0,0,0,.5);
  }
  #booking.confirmed iframe { display: none; }


  /* ---- AI agent demo panel ---- */
  #demo .demo-inner {
    width: 100%; max-width: 960px; text-align: center;
    padding: clamp(1.8rem, 3.5vw, 2.8rem);
    background: rgba(8,8,14,.42);
    backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
    border: 1px solid rgba(185,162,255,.18); border-radius: 6px;
    box-shadow: 0 30px 80px rgba(0,0,0,.45);
  }
  #demo .note {
    margin-top: .8rem; font-size: .68rem; letter-spacing: .24em;
    text-transform: uppercase; opacity: .5;
  }
  #widgetSlot {
    margin-top: 1.6rem; min-height: min(48vh, 460px);
    border: 1px dashed rgba(185,162,255,.35); border-radius: 6px;
    display: grid; place-content: center;
  }
  #widgetSlot span {
    font-size: .68rem; font-weight: 700; letter-spacing: .3em;
    text-transform: uppercase; opacity: .4;
  }
  /* ---- flashy CTA ---- */
  .cta-flash {
    border-color: #a88bff;
    background: linear-gradient(120deg, rgba(94,23,235,.6) 0%, rgba(168,139,255,.35) 30%, rgba(94,23,235,.6) 60%, rgba(168,139,255,.35) 100%);
    background-size: 220% 100%;
    animation: flashslide 3.2s linear infinite, flashglow 2.2s ease-in-out infinite;
  }
  /* ---- intro / preloader ---- */
  #intro {
    position: fixed; inset: 0; z-index: 30;
    display: grid; place-content: center; justify-items: center;
    background:
      radial-gradient(42% 34% at 50% 44%, rgba(94,23,235,.14), transparent 70%),
      #06060a;
    touch-action: none;
    transition: opacity .7s ease .1s; opacity: 1;
  }
  #intro.done { opacity: 0; pointer-events: none; }
  #intro img {
    height: 7.5rem; width: auto;
    filter: drop-shadow(0 0 18px rgba(122,80,255,.55));
    animation: introglow 2.6s ease-in-out infinite;
  }
  @keyframes introglow {
    0%, 100% { transform: scale(1);     filter: drop-shadow(0 0 14px rgba(122,80,255,.4)); }
    50%      { transform: scale(1.035); filter: drop-shadow(0 0 30px rgba(122,80,255,.85)); }
  }
  .intro-bar {
    width: min(240px, 58vw); height: 2px; margin-top: 2.6rem;
    border-radius: 999px; background: rgba(185,162,255,.14); overflow: hidden;
  }
  .intro-bar i {
    display: block; height: 100%; border-radius: inherit;
    background: linear-gradient(90deg, #7a50ff, #d3c6ff 55%, #8b62ff);
    box-shadow: 0 0 12px rgba(122,80,255,.6);
    transform: scaleX(0); transform-origin: left;
    animation: introfill 2s cubic-bezier(.65,0,.35,1) .15s forwards;
  }
  @keyframes introfill { to { transform: scaleX(1); } }
  #intro p {
    margin-top: 1.7rem; max-width: min(82vw, 46ch); text-align: center;
    font-size: .62rem; font-weight: 700; letter-spacing: .3em;
    text-transform: uppercase; line-height: 2; color: #cfc4f0;
    opacity: 0; animation: introfade .9s ease .55s forwards;
  }
  @keyframes introfade { to { opacity: .75; } }
  @media (prefers-reduced-motion: reduce) {
    #intro img { animation: none; }
    .intro-bar i { animation-duration: .01s; animation-delay: 0s; }
  }
  @keyframes flashslide { to { background-position: -220% 0; } }
  @keyframes flashglow {
    0%, 100% { box-shadow: 0 0 12px rgba(122,80,255,.35); }
    50%      { box-shadow: 0 0 34px rgba(122,80,255,.9); }
  }
  @media (prefers-reduced-motion: reduce) { .cta-flash { animation: none; } }
  #how-it-works .lede { max-width: 34rem; margin: .6rem 0 1.4rem; line-height: 1.55; opacity: .88; }

  /* ---- testimonials: 9:16 cards, sits after the scroll track ---- */
  #testimonials { position: relative; z-index: 2; text-align: center; padding: 6.5rem 1.5rem 4rem; overflow: hidden; }
  #testimonials .eyebrow { margin-bottom: 1rem; }
  #testimonials h2 { max-width: 16ch; margin: 0 auto; }
  .tm-carousel { position: relative; width: min(380px, 100%); margin: 2.8rem auto 0; }
  .tm-stack { position: relative; }
  .tm-stack::before, .tm-stack::after { content: ''; position: absolute; inset: 0; border-radius: 24px; background: rgba(122,80,255,.18); border: 1px solid rgba(185,162,255,.18); }
  .tm-stack::before { transform: rotate(-3deg) translateY(10px); }
  .tm-stack::after { transform: rotate(2.2deg) translateY(12px); background: rgba(122,80,255,.1); }
  .tm-track { position: relative; z-index: 1; aspect-ratio: 9 / 16; overflow: hidden; border-radius: 24px;
    background: linear-gradient(180deg, rgba(24,18,44,.94), rgba(12,10,22,.97));
    border: 1px solid rgba(185,162,255,.28); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 30px 80px rgba(0,0,0,.6), 0 0 60px rgba(122,80,255,.25), inset 0 1px 0 rgba(255,255,255,.12); }
  .tm-slides { display: flex; height: 100%; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; scrollbar-width: none; cursor: grab; }
  .tm-slides::-webkit-scrollbar { display: none; }
  .tm-slides.dragging { cursor: grabbing; scroll-snap-type: none; }
  .tm-slide { scroll-snap-align: start; }
  .tm-slide { flex: 0 0 100%; height: 100%; padding: 28px 28px 30px; text-align: left; display: flex; flex-direction: column; box-sizing: border-box; }
  .tm-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: auto; }
  .tm-meta { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
  .tm-result { display: inline-block; padding: 6px 12px; border-radius: 999px; font-size: .8rem; font-weight: 600; line-height: 1.3;
    color: #d3c6ff; background: rgba(122,80,255,.22); border: 1px solid rgba(168,139,255,.45); }
  .tm-verified { font-size: .72rem; color: #b9b3c9; display: flex; align-items: center; gap: 6px; }
  .tm-verified svg { width: 14px; height: 14px; }
  .tm-brand { width: 72px; height: auto; flex: none; filter: drop-shadow(0 2px 8px rgba(0,0,0,.6)); }
  .tm-qmark { font-family: Didot, "Bodoni MT", "Playfair Display", Georgia, serif; font-size: 96px; line-height: .6; color: rgba(185,162,255,.35); margin: 28px 0 6px; }
  .tm-quote { font-size: 1.05rem; line-height: 1.5; color: #f5f1e8; margin: 0; }
  .tm-quote mark { background: none; color: #fff; font-weight: 600; box-shadow: inset 0 -.35em rgba(122,80,255,.55); }
  .tm-who { display: flex; align-items: center; gap: 12px; margin-top: auto; padding-top: 24px; }
  .tm-avatar { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; flex: none; border: 2px solid rgba(185,162,255,.6); box-shadow: 0 0 0 3px rgba(122,80,255,.25); }
  .tm-name { font-size: .95rem; font-weight: 600; color: #fff; }
  .tm-role { font-size: .78rem; color: #b9b3c9; margin-top: 2px; }
  .tm-nav { display: none; position: absolute; top: 50%; transform: translateY(-50%); width: 60px; height: 60px; border-radius: 50%; cursor: pointer; z-index: 2;
    place-items: center; color: #d3c6ff; border: 1px solid rgba(168,139,255,.6);
    background: rgba(122,80,255,.14); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); transition: background .3s, box-shadow .3s; }
  .tm-nav:hover { background: rgba(122,80,255,.32); box-shadow: 0 0 30px rgba(122,80,255,.4); }
  .tm-nav svg { width: 22px; height: 22px; }
  .tm-prev { left: -96px; } .tm-next { right: -96px; }
  @media (hover: hover) and (pointer: fine) and (min-width: 700px) { .tm-nav { display: grid; } }
  .tm-dots { display: flex; justify-content: center; gap: 8px; margin-top: 34px; }
  .tm-dots button { width: 8px; height: 8px; border-radius: 50%; border: 0; background: rgba(185,162,255,.3); cursor: pointer; padding: 0; transition: width .2s; }
  .tm-dots button[aria-current="true"] { background: #b9a2ff; width: 24px; border-radius: 4px; }
  .tm-cta { margin-top: 3.5rem; }
  .tm-cta h3 { font-family: Didot, "Bodoni MT", "Playfair Display", Georgia, serif; font-weight: 600; font-size: clamp(1.5rem, 3vw, 2.2rem); line-height: 1.15; margin: 0; letter-spacing: .02em; }
  .tm-cta h3 em { font-style: italic; color: #d3c6ff; }
  .tm-cta .cta { margin-top: 1.6rem; }
  .tm-risk { margin-top: 1rem; font-size: .78rem; color: #b9b3c9; display: flex; justify-content: center; gap: 18px; flex-wrap: wrap; }
  .tm-risk span::before { content: '\2713  '; color: #b9a2ff; }
  @media (max-width: 600px) { .tm-cta .cta { padding: .9rem 1.3rem; letter-spacing: .18em; font-size: .68rem; } }
  /* journal block after the scroll track */
  .journal { position: relative; z-index: 2; max-width: 1100px; margin: 0 auto; padding: 4rem 1.5rem 1.5rem; }
  .journal h2 { font-family: Didot, "Bodoni MT", "Playfair Display", Georgia, serif; font-size: clamp(1.5rem, 3vw, 2.2rem); margin: .4rem 0 1.6rem; }
  .journal-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; }
  .journal .post { display: block; text-decoration: none; color: inherit; border: 1px solid rgba(185,162,255,.22); border-radius: 6px; overflow: hidden; background: rgba(12,10,22,.35); transition: border-color .3s, box-shadow .3s, transform .3s; }
  .journal .post:hover { border-color: #a88bff; box-shadow: 0 0 30px rgba(122,80,255,.3); transform: translateY(-3px); }
  .journal .post img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; display: block; }
  .journal .post .body { padding: 1.1rem 1.2rem 1.3rem; }
  .journal .post .date { font-size: .6rem; font-weight: 700; letter-spacing: .26em; text-transform: uppercase; color: #b9a2ff; }
  .journal .post h2 { font-size: 1.05rem; line-height: 1.3; margin: .5rem 0 .4rem; }
  .journal .post p { font-size: .8rem; margin: 0; opacity: .8; }
  @media (max-width: 860px) { .journal-grid { grid-template-columns: 1fr; } }

  /* top offer bar; nav is shifted down by exactly its height */
  :root { --promo-h: 2.5rem; }
  .promo {
    position: fixed; top: 0; left: 0; right: 0; z-index: 9;
    height: var(--promo-h); padding: 0 1.25rem;
    display: flex; align-items: center; justify-content: center; text-align: center;
    background: linear-gradient(90deg, #4a12b8, #7a50ff 48%, #9b7bff);
    color: #efeaff; text-decoration: none; text-wrap: balance;
    font-size: .68rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
    border-bottom: 1px solid rgba(255,255,255,.16);
    transition: filter .25s ease;
  }
  .promo > span { display: block; }
  .promo em { font-style: normal; color: #fff; }
  .promo:hover { filter: brightness(1.14); }
  .promo:focus-visible { outline: 2px solid #fff; outline-offset: -3px; }
  nav { top: var(--promo-h); }
  @media (max-width: 900px) {
    :root { --promo-h: 3.3rem; }
    .promo { font-size: .55rem; letter-spacing: .08em; line-height: 1.55; }
  }

  /* smooth, correctly-offset anchor scrolling.
     glide() opts out with behavior:'instant', so the two never fight. */
  html {
    scroll-behavior: smooth;
    scroll-padding-top: calc(var(--promo-h) + 5.5rem);
  }
  @media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
  }