@font-face{font-family:'Satoshi';src:url('/assets/fonts/satoshi-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Satoshi';src:url('/assets/fonts/satoshi-900.woff2') format('woff2');font-weight:900;font-style:normal;font-display:swap}
/* ═══ v2: scroll-driven journey hero + homepage polish (Oct 2026 preview) ═══ */
/* overflow-x:hidden on html/body makes them scroll containers and breaks position:sticky; clip does not. */
html, body { overflow-x: clip !important; overflow-y: visible !important; }
body.menu-open { overflow: hidden !important; }
.jy { position:relative; background:var(--black); color:var(--cream); font-family:'Satoshi','Inter',sans-serif; }
.jy-stage { position:sticky; top:0; height:100dvh; overflow:hidden; background:var(--black); z-index:1; }
.jy-media, .jy-layer, .jy-layer picture, .jy-poster, .jy-video { position:absolute; inset:0; width:100%; height:100%; }
.jy-layer { opacity:0; transition:opacity .25s linear; will-change:opacity; }
.jy-layer[data-active="true"] { opacity:1; }
.jy-poster, .jy-video { object-fit:cover; object-position:center center; display:block; }
.jy-video { opacity:0; transition:opacity .35s ease; }
.jy-layer[data-painted="true"] .jy-video { opacity:1; }
.jy-stage::after { content:''; position:absolute; inset:0; background:linear-gradient(to bottom, rgba(8,8,10,.55) 0%, rgba(8,8,10,0) 22%, rgba(8,8,10,0) 70%, rgba(8,8,10,.6) 100%); pointer-events:none; }
.jy-progress { position:absolute; top:0; left:0; right:0; height:2px; background:rgba(255,255,255,.12); z-index:3; }
.jy-progress span { display:block; height:100%; width:100%; background:var(--gold); transform:scaleX(var(--p,0)); transform-origin:left; }
.jy-route { position:absolute; left:clamp(20px,5vw,72px); bottom:max(22px, env(safe-area-inset-bottom)); z-index:3; display:flex; gap:1.4rem; font-family:'Inter',sans-serif; font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; }
.jy-route button { background:none; border:0; padding:0 0 .25rem; color:var(--soft); cursor:pointer; font:inherit; letter-spacing:inherit; text-transform:inherit; border-bottom:1px solid transparent; transition:color .2s, border-color .2s; }
.jy-route button:hover, .jy-route button[aria-current="step"] { color:var(--cream); }
.jy-route button[aria-current="step"] { border-bottom-color:var(--gold); }
.jy-story { position:relative; z-index:2; margin-top:-100dvh; pointer-events:none; }
.jy-chapter { min-height:calc(var(--w,1.5) * 100dvh); position:relative; }
.jy-pin { position:sticky; top:0; min-height:100dvh; display:flex; align-items:center; padding:clamp(5rem,9vw,8rem) clamp(20px,5vw,72px); pointer-events:none; }
.jy-chapter[data-align="right"] .jy-pin { justify-content:flex-end; }
.jy-copy { position:relative; width:min(40rem,48vw); pointer-events:auto; opacity:var(--fade,1); }
.jy-copy::before { content:''; position:absolute; inset:-4rem -6rem; z-index:-1; pointer-events:none; background:radial-gradient(ellipse at center, rgba(8,8,10,.92) 0%, rgba(8,8,10,.7) 45%, rgba(8,8,10,.25) 70%, transparent 85%); }
.jy-kicker { font-family:'Inter',sans-serif; font-size:.74rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--gold); margin:0 0 1rem; }
.jy-title { font-family:'Satoshi','Inter',sans-serif; font-weight:900; font-size:clamp(2.5rem,5vw,5.4rem); line-height:.94; letter-spacing:-.045em; color:var(--cream); margin:0; max-width:13ch; text-wrap:balance; text-shadow:0 2px 24px rgba(8,8,10,.55); }
.jy-body { font-family:'Inter',sans-serif; color:var(--text); font-size:clamp(1rem,1.3vw,1.18rem); line-height:1.55; max-width:42ch; margin:1.4rem 0 0; text-shadow:0 1px 12px rgba(8,8,10,.7); }
.jy-tags { display:flex; flex-wrap:wrap; gap:.55rem; margin:1.4rem 0 0; padding:0; list-style:none; }
.jy-tags li { font-family:'Inter',sans-serif; font-size:.76rem; letter-spacing:.04em; padding:.45rem .7rem; border:1px solid rgba(255,255,255,.22); border-radius:var(--r-sm); background:rgba(8,8,10,.55); backdrop-filter:blur(6px); color:var(--cream); }
.jy-actions { display:flex; flex-wrap:wrap; gap:.9rem 1.4rem; align-items:center; margin-top:2rem; }
.jy-call { font-family:'Inter',sans-serif; color:var(--gold); font-size:.92rem; font-weight:600; border-bottom:1px solid var(--gold); padding-bottom:.2rem; }
.jy-call:hover { color:var(--gold-light); }
/* step mode helpers: a bouncing "scroll" pill and chapter dots (mobile), a one-time scroll hint (desktop) */
.jy-hint { position:absolute; left:50%; bottom:max(20px, env(safe-area-inset-bottom)); transform:translateX(-50%) translateY(6px); z-index:4; display:inline-flex; align-items:center; gap:.5rem; padding:.7rem 1.05rem; border-radius:999px; background:rgba(8,8,10,.62); border:1px solid rgba(255,255,255,.2); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); color:var(--cream); font:600 .78rem/1 'Inter',sans-serif; letter-spacing:.08em; text-transform:uppercase; opacity:0; pointer-events:none; transition:opacity .35s ease, transform .35s ease; cursor:pointer; white-space:nowrap; }
.jy[data-hint="on"] .jy-hint { opacity:1; pointer-events:auto; transform:translateX(-50%) translateY(0); }
.jy-hint svg { width:15px; height:15px; animation:jy-bob 1.3s ease-in-out infinite; }
@keyframes jy-bob { 0%,100% { transform:translateY(-1px); } 50% { transform:translateY(4px); } }
@keyframes jy-bob-up { 0%,100% { transform:translateY(1px); } 50% { transform:translateY(-4px); } }
.jy-dots { position:absolute; right:12px; top:50%; transform:translateY(-50%); z-index:3; display:none; flex-direction:column; gap:11px; }
.jy-dots span { width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.35); transition:background .3s, transform .3s; }
.jy-dots span[aria-current] { background:var(--gold); transform:scale(1.55); }
@media (max-width:860px) {
  .jy-route { display:none; }
  .jy-pin, .jy-chapter[data-align="right"] .jy-pin { align-items:flex-end; justify-content:flex-start; padding:5.5rem clamp(18px,4vw,28px) calc(8rem + env(safe-area-inset-bottom)); }
  .jy-copy { width:min(100%,36rem); }
  .jy-copy::before { inset:-5rem -2rem -6rem; background:linear-gradient(to bottom, transparent 0%, rgba(8,8,10,.82) 28%, rgba(8,8,10,.82) 72%, transparent 100%); }
  .jy-title { font-size:clamp(2.2rem,10vw,3.8rem); max-width:14ch; }
  /* step mode: one flick = one chapter. journey.js lands each flick on the next chapter (CSS scroll-snap fought it, so none here), the clip plays through, the pill invites the next flick. */
  .jy-chapter { min-height:100dvh; }
  .jy-dots { display:flex; }
  .jy-copy { opacity:0; transform:translateY(14px); transition:opacity .55s ease, transform .55s ease; }
  .jy-chapter:first-child .jy-copy, .jy-chapter[data-active="true"] .jy-copy { opacity:1; transform:none; }
  /* sits just above the fixed Call / Text / Book bar (.mab = 69px + safe area) */
  .jy-hint { bottom:calc(76px + env(safe-area-inset-bottom)); padding:.6rem 1rem; font-size:.8rem; }
  .jy-hint svg { scale:1 -1; animation-name:jy-bob-up; } /* chevron points up to match "swipe up" */
}
/* short phones (SE class, or Safari with its toolbars up): tighter copy so the pill and the action bar never cover it */
@media (max-width:860px) and (max-height:640px) {
  .jy-title { font-size:clamp(1.8rem,8vw,2.6rem); }
  .jy-body { font-size:.95rem; margin-top:.9rem; max-width:none; }
  .jy-tags { display:none; }
  .jy-actions { margin-top:1.1rem; gap:.6rem 1.2rem; }
  .jy-pin, .jy-chapter[data-align="right"] .jy-pin { padding-top:4.5rem; }
}
/* nav floats over the film, solidifies on scroll */
.nav.nav-over:not(.scrolled) { background:transparent; border-bottom-color:transparent; backdrop-filter:none; -webkit-backdrop-filter:none; }
/* Why people choose us: the old side panel as a row under the film */
.why { background:var(--dark); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.why-inner { display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(20px,3vw,40px); padding-top:clamp(28px,4vw,44px); padding-bottom:clamp(28px,4vw,44px); }
.why-item { display:flex; gap:14px; align-items:flex-start; }
.why-item h4, .why-item h3 { font-size:var(--fs-sm); font-family:'Inter',sans-serif; font-weight:600; color:var(--cream); margin-bottom:3px; }
.why-item p { font-size:var(--fs-xs); color:var(--muted); margin:0; line-height:1.55; }
.why-item p a { color:var(--gold); }
@media (max-width:768px) { .why-inner { grid-template-columns:1fr; gap:18px; } }
/* polish below the film */
#services .services-grid { border:1px solid var(--border); gap:1px; background:var(--border); border-radius:var(--r-lg); overflow:hidden; }
#services .service-card { background:var(--black); }
#services .service-card:hover { background:var(--dark); }
.pricing-teaser { border-top:1px solid var(--border); border-bottom:1px solid var(--border); background:linear-gradient(135deg, var(--gold-wash), transparent 60%); }
.gallery-item { border-radius:var(--r-sm); }
.gallery-grid { gap:8px; }
.booking-cta { background:var(--dark); }
@media (prefers-reduced-motion: reduce) { .jy-layer, .jy-video { transition:none; } }

/* ═══ before / after compare (real photos, drag the handle) ═══ */
.cmp { cursor:ew-resize; }
.cmp picture, .cmp img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:none !important; transform:none !important; }
.cmp-before { position:absolute; inset:0; clip-path:inset(0 calc(100% - var(--x)) 0 0); }
.cmp-line { position:absolute; top:0; bottom:0; left:var(--x); width:2px; background:var(--gold); transform:translateX(-1px); pointer-events:none; box-shadow:0 0 0 1px rgba(0,0,0,.35); }
.cmp-knob { position:absolute; top:50%; left:50%; width:44px; height:44px; transform:translate(-50%,-50%); border-radius:50%; background:var(--gold); color:#0a0a0a; display:flex; align-items:center; justify-content:center; box-shadow:0 8px 24px rgba(0,0,0,.5); }
.cmp-tag { position:absolute; top:14px; font-size:var(--fs-xs); letter-spacing:.14em; text-transform:uppercase; font-weight:600; padding:5px 9px; background:rgba(8,8,10,.7); backdrop-filter:blur(6px); color:var(--cream); border-radius:var(--r-sm); pointer-events:none; }
.cmp-tag-b { left:14px; } .cmp-tag-a { right:14px; color:var(--gold); }
.cmp-range { position:absolute; inset:0; width:100%; height:100%; margin:0; opacity:0; cursor:ew-resize; -webkit-appearance:none; appearance:none; touch-action:pan-y; z-index:2; }
.cmp-cap { position:absolute; left:0; right:0; bottom:0; padding:var(--sp-5) var(--sp-4) var(--sp-4); background:linear-gradient(transparent, rgba(0,0,0,.85)); pointer-events:none; }
.cmp-cap span { font-size:var(--fs-xs); letter-spacing:.14em; text-transform:uppercase; color:var(--gold); font-weight:600; }
.cmp-cap p { font-family:'Playfair Display',serif; font-size:1rem; color:var(--cream); margin:3px 0 0; }
.cmp:focus-within { outline:2px solid var(--gold); outline-offset:2px; }

/* ═══ sedan / SUV price toggle ═══ */
.size-toggle { display:flex; align-items:center; justify-content:center; gap:8px; flex-wrap:wrap; margin-top:var(--sp-6); }
.size-toggle-label { font-size:var(--fs-xs); letter-spacing:.14em; text-transform:uppercase; color:var(--soft); margin-right:4px; }
.size-toggle button { font:inherit; font-size:var(--fs-sm); font-weight:600; color:var(--muted); background:var(--surface); border:1px solid var(--border2); padding:10px 16px; border-radius:var(--r-full); cursor:pointer; transition:all .25s var(--ease); }
.size-toggle button:hover { color:var(--cream); border-color:var(--gold); }
.size-toggle button.on { background:var(--gold); color:#0a0a0a; border-color:var(--gold); }
.price-hint { transition:opacity .2s; }