/* ==========================================================================
   v2: homepage redesign preview (Oct 2026)
   One palette: glacier, violet, sky on ice white, plus one deep-ink room
   for the work. Arches wear a polished silver frame with an LED backlight,
   like the arched mirror in the studio. Soft glass against one sharp ink drip.
   Scoped to body.v2 so pages that don't opt in are untouched.
   ========================================================================== */

@font-face{font-family:'Clash Display';font-weight:500;font-display:swap;src:url('/assets/fonts/clash-display-500.woff2') format('woff2')}
@font-face{font-family:'Clash Display';font-weight:600;font-display:swap;src:url('/assets/fonts/clash-display-600.woff2') format('woff2')}
@font-face{font-family:'Satoshi';font-weight:400;font-display:swap;src:url('/assets/fonts/satoshi-400.woff2') format('woff2')}
@font-face{font-family:'Satoshi';font-weight:500;font-display:swap;src:url('/assets/fonts/satoshi-500.woff2') format('woff2')}
@font-face{font-family:'Satoshi';font-weight:700;font-display:swap;src:url('/assets/fonts/satoshi-700.woff2') format('woff2')}

/* Animatable values (light angle on the silver frames, the gallery room light) */
@property --v2-ang { syntax: '<angle>'; inherits: true; initial-value: 210deg; }
@property --room-glow { syntax: '<color>'; inherits: true; initial-value: #5B7CFF; }
@property --lx { syntax: '<percentage>'; inherits: true; initial-value: 30%; }
@property --ly { syntax: '<percentage>'; inherits: true; initial-value: 30%; }

/* ---------- Palette and type ---------- */
body.v2 {
  --v2-ink: #0B0D1F;
  --v2-ink-2: #3B3F5C;
  --v2-muted: #737894;
  --v2-line: #E4E6F0;
  --v2-ice: #F3F5FD;
  --v2-room: #0A0C1A;
  --v2-violet: #7A5CFF;
  --v2-peri: #5B7CFF;
  --v2-sky: #4FB2F5;
  --v2-glacier: #9EE8FF;
  --v2-accent: #5B5CF6;
  --v2-aurora: linear-gradient(120deg, #7A5CFF 0%, #5B7CFF 48%, #4FB2F5 100%);
  --v2-aurora-text: linear-gradient(100deg, #6A4FF6 0%, #4C6FFB 52%, #3FA3EE 100%);
  --v2-chrome: conic-gradient(from var(--v2-ang), #FFFFFF, #9AA3B8 10%, #F7F8FB 20%, #5E677F 33%, #DDE2EC 45%, #FFFFFF 55%, #8C95AB 68%, #EEF1F6 80%, #6B748C 91%, #FFFFFF);
  --v2-display: 'Clash Display', 'Satoshi', system-ui, sans-serif;
  --v2-body: 'Satoshi', system-ui, -apple-system, sans-serif;
  --v2-ease: cubic-bezier(.22, 1, .36, 1);
  --v2-spring: cubic-bezier(.34, 1.56, .64, 1);
  --v2-arch: 999px 999px 18px 18px;
  --v2-gutter: max(24px, calc((100% - var(--max-width)) / 2 + 24px));

  /* Re-point the site's theme variables so existing components turn light */
  --bg-primary: #FFFFFF;
  --bg-secondary: var(--v2-ice);
  --bg-card: #FFFFFF;
  --bg-input: #FFFFFF;
  --bg-tint: #FFFFFF;
  --text-primary: var(--v2-ink);
  --text-secondary: var(--v2-ink-2);
  --text-muted: var(--v2-muted);
  --accent: var(--v2-accent);
  --border: var(--v2-line);
  --border-light: var(--v2-line);
  --font-headline: var(--v2-display);
  --font-body: var(--v2-body);
  --section-padding: 120px;

  background: #FFFFFF;
  color: var(--v2-ink);
  font-family: var(--v2-body);
  -webkit-font-smoothing: antialiased;
}
body.v2::before { display: none; }
body.v2 h1, body.v2 h2, body.v2 h3 { font-family: var(--v2-display); font-weight: 600; letter-spacing: -0.015em; color: var(--v2-ink); }
body.v2 h2 { font-size: clamp(34px, 4.4vw, 54px); line-height: 1.02; letter-spacing: -0.025em; }
body.v2 p { color: var(--v2-ink-2); font-size: 17.5px; line-height: 1.65; }
body.v2 ::selection { background: rgba(91, 92, 246, .18); }
body.v2 .section { background: #FFFFFF; border-top: 0; }
body.v2 .section--alt { background: var(--v2-ice); }
body.v2 :focus-visible { outline: 2px solid var(--v2-accent); outline-offset: 3px; border-radius: 999px; }
body.v2 [id] { scroll-margin-top: 96px; }

/* Section labels: number + word, like a gallery wall card */
body.v2 .v2-label {
  display: inline-flex; align-items: center; gap: 10px; margin-bottom: 16px;
  font-family: var(--v2-body); font-weight: 700; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--v2-ink-2);
}
body.v2 .v2-label::before { content: ''; width: 22px; height: 2px; border-radius: 2px; background: var(--v2-aurora); }
body.v2 .v2-room .v2-label { color: #AEB3CF; }

/* Notes in Bobby's own voice, marked with the two overlapping circles */
body.v2 .v2-note { position: relative; max-width: 46ch; margin: 16px 0 0; padding-left: 32px; font-size: 16px; line-height: 1.6; }
body.v2 .v2-note::before {
  content: ''; position: absolute; left: 0; top: 5px; width: 22px; height: 15px;
  background:
    radial-gradient(circle at 7px 7px, #7A5CFF 0 6.5px, transparent 7px),
    radial-gradient(circle at 14px 8.5px, #4FB2F5 0 6.5px, transparent 7px);
  filter: saturate(1.1);
}
body.v2 .v2-room .v2-note { color: #AEB3CF; }

/* Text links: underline grows into aurora on hover */
body.v2 .v2-link {
  display: inline-flex; align-items: center; gap: 8px; white-space: nowrap;
  font-weight: 600; font-size: 15.5px; color: var(--v2-ink); text-decoration: none; padding-bottom: 4px;
  background:
    linear-gradient(90deg, #7A5CFF, #5B7CFF, #4FB2F5) left bottom / 0% 2px no-repeat,
    linear-gradient(currentColor, currentColor) left bottom / 100% 1px no-repeat;
  transition: gap .35s var(--v2-ease), background-size .5s var(--v2-ease);
}
body.v2 .v2-link:hover { gap: 13px; background-size: 100% 2px, 100% 1px; }
body.v2 .v2-room .v2-link { color: #F3F4FA; }
body.v2 .v2-next { margin-top: 28px; }
body.v2 .v2-next-row { margin-top: 44px; }

/* ==========================================================================
   Buttons: glass that responds. Light follows the pointer, presses squish
   and spring back, a ripple of light on tap.
   ========================================================================== */
body.v2 .hero__cta,
body.v2 .header__nav a.v2-nav__book,
body.v2 .mobile-nav a.v2-mnav__book,
body.v2 .v2-dock a.v2-dock__book,
body.v2 .footer__cta-btn,
body.v2 .hero__cta-ghost,
body.v2 .btn--secondary {
  position: relative; isolation: isolate; overflow: hidden;
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  border-radius: 999px; font-family: var(--v2-body); letter-spacing: .005em; text-transform: none; cursor: pointer;
  -webkit-tap-highlight-color: transparent; user-select: none; -webkit-user-select: none;
  transition: transform .5s var(--v2-spring), box-shadow .35s var(--v2-ease), border-color .3s var(--v2-ease), background-color .3s var(--v2-ease);
}
/* pointer light */
body.v2 .hero__cta::before,
body.v2 .header__nav a.v2-nav__book::before,
body.v2 .mobile-nav a.v2-mnav__book::before,
body.v2 .v2-dock a.v2-dock__book::before,
body.v2 .footer__cta-btn::before,
body.v2 .hero__cta-ghost::before,
body.v2 .btn--secondary::before {
  content: ''; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none;
  background: radial-gradient(120px circle at var(--mx, 50%) var(--my, 0%), rgba(255, 255, 255, .55), transparent 70%);
  opacity: 0; transition: opacity .35s var(--v2-ease);
}
/* sheen sweep */
body.v2 .hero__cta::after,
body.v2 .header__nav a.v2-nav__book::after,
body.v2 .v2-dock a.v2-dock__book::after,
body.v2 .footer__cta-btn::after {
  content: ''; position: absolute; top: 0; bottom: 0; left: -60%; width: 45%; z-index: -1; pointer-events: none;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .5), transparent);
  transform: skewX(-18deg) translateX(0); opacity: 0;
}
@media (hover: hover) {
  body.v2 .hero__cta:hover::before, body.v2 .header__nav a.v2-nav__book:hover::before, body.v2 .v2-dock a.v2-dock__book:hover::before,
  body.v2 .footer__cta-btn:hover::before, body.v2 .hero__cta-ghost:hover::before, body.v2 .btn--secondary:hover::before { opacity: 1; }
  body.v2 .hero__cta:hover::after, body.v2 .header__nav a.v2-nav__book:hover::after, body.v2 .v2-dock a.v2-dock__book:hover::after,
  body.v2 .footer__cta-btn:hover::after { animation: v2-sheen .9s var(--v2-ease); }
  body.v2 .hero__cta:hover, body.v2 .footer__cta-btn:hover, body.v2 .hero__cta-ghost:hover, body.v2 .btn--secondary:hover { transform: translateY(-2px); }
}
@keyframes v2-sheen { from { opacity: 1; transform: skewX(-18deg) translateX(0); } to { opacity: 0; transform: skewX(-18deg) translateX(420%); } }
body.v2 .hero__cta:active, body.v2 .header__nav a.v2-nav__book:active, body.v2 .mobile-nav a.v2-mnav__book:active,
body.v2 .v2-dock a.v2-dock__book:active, body.v2 .footer__cta-btn:active, body.v2 .hero__cta-ghost:active, body.v2 .btn--secondary:active {
  transform: scale(.955); transition-duration: .12s;
}
body.v2 .hero__cta svg, body.v2 .footer__cta-btn svg, body.v2 .v2-dock__book svg { transition: transform .45s var(--v2-spring); }
body.v2 .hero__cta:hover svg, body.v2 .footer__cta-btn:hover svg, body.v2 .v2-dock__book:hover svg { transform: translateX(4px); }
/* tap ripple (added by v2.js) */
.v2-ripple {
  position: absolute; z-index: -1; width: 16px; height: 16px; margin: -8px 0 0 -8px; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, rgba(255, 255, 255, .85), rgba(255, 255, 255, 0) 70%);
  animation: v2-ripple .7s var(--v2-ease) forwards;
}
@keyframes v2-ripple { from { transform: scale(0); opacity: 1; } to { transform: scale(22); opacity: 0; } }

/* Primary: aurora glass */
body.v2 .hero__cta,
body.v2 .header__nav a.v2-nav__book,
body.v2 .mobile-nav a.v2-mnav__book,
body.v2 .v2-dock a.v2-dock__book,
body.v2 .footer__cta-btn {
  color: #fff; font-weight: 700;
  background: linear-gradient(180deg, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0) 55%), var(--v2-aurora);
  border: 1px solid rgba(255, 255, 255, .55);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .6), inset 0 -10px 18px -10px rgba(40, 30, 150, .4), 0 14px 32px -14px rgba(91, 92, 246, .75);
}
@media (hover: hover) {
  body.v2 .hero__cta:hover, body.v2 .header__nav a.v2-nav__book:hover, body.v2 .v2-dock a.v2-dock__book:hover, body.v2 .footer__cta-btn:hover {
    color: #fff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7), inset 0 -10px 18px -10px rgba(40, 30, 150, .4), 0 20px 44px -14px rgba(91, 92, 246, .9), 0 0 0 4px rgba(122, 92, 255, .12);
  }
}
body.v2 .hero__cta, body.v2 .footer__cta-btn { padding: 19px 30px; font-size: 16px; }

/* Secondary: clear glass */
body.v2 .hero__cta-ghost,
body.v2 .btn--secondary {
  height: auto; padding: 17px 28px; font-weight: 600; font-size: 15.5px; color: var(--v2-ink);
  background: linear-gradient(180deg, rgba(255, 255, 255, .92), rgba(238, 242, 255, .6));
  border: 1px solid rgba(255, 255, 255, .95);
  box-shadow: inset 0 1px 0 #fff, 0 0 0 1px rgba(70, 80, 170, .12), 0 10px 26px -16px rgba(60, 70, 170, .5);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
}
body.v2 .hero__cta-ghost::before, body.v2 .btn--secondary::before {
  background: radial-gradient(140px circle at var(--mx, 50%) var(--my, 0%), rgba(122, 92, 255, .16), transparent 70%);
}
@media (hover: hover) {
  body.v2 .hero__cta-ghost:hover, body.v2 .btn--secondary:hover {
    color: var(--v2-ink); background: linear-gradient(180deg, #fff, rgba(238, 242, 255, .7));
    box-shadow: inset 0 1px 0 #fff, 0 0 0 1px rgba(91, 92, 246, .3), 0 16px 32px -16px rgba(60, 70, 170, .6);
  }
}
/* Dark glass inside the gallery room */
body.v2 .v2-room .btn--secondary {
  color: #fff; background: linear-gradient(180deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, .05));
  border: 1px solid rgba(255, 255, 255, .26); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), 0 14px 30px -18px rgba(120, 140, 255, .6);
}
body.v2 .v2-room .btn--secondary::before { background: radial-gradient(140px circle at var(--mx, 50%) var(--my, 0%), rgba(158, 232, 255, .3), transparent 70%); }

/* ==========================================================================
   Header: floating glass bar with the overlapping-circles mark
   ========================================================================== */
body.v2 .header,
body.v2 .header.header--scrolled { background: transparent; border: 0; padding: 14px 16px 0; -webkit-backdrop-filter: none; backdrop-filter: none; }
body.v2 .header__inner {
  max-width: 1240px; height: 68px; padding: 0 10px 0 20px;
  background: rgba(255, 255, 255, .72); border: 1px solid rgba(255, 255, 255, .9); border-radius: 999px;
  -webkit-backdrop-filter: blur(20px) saturate(180%); backdrop-filter: blur(20px) saturate(180%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 12px 40px -18px rgba(11, 13, 31, .28), 0 0 0 1px rgba(11, 13, 31, .04);
  transition: background .4s var(--v2-ease), box-shadow .4s var(--v2-ease);
}
body.v2 .header--scrolled .header__inner { background: rgba(255, 255, 255, .86); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 16px 44px -18px rgba(11, 13, 31, .36), 0 0 0 1px rgba(11, 13, 31, .05); }
body.v2 .header__logo.v2-brand { display: inline-flex; align-items: center; gap: 12px; text-transform: none; letter-spacing: 0; font-size: inherit; color: var(--v2-ink); text-decoration: none; }
.v2-brand__mark { width: 36px; height: 27px; flex-shrink: 0; overflow: visible; }
/* The two circles drift together as you scroll and meet when you reach booking (on the same wavelength) */
.v2-brand__mark circle { transition: transform 1s var(--v2-spring); }
.v2-brand__mark .v2-mk-a { transform: translate(calc(var(--merge, 0) * 4px), calc(var(--merge, 0) * 1px)); }
.v2-brand__mark .v2-mk-b { transform: translate(calc(var(--merge, 0) * -4px), calc(var(--merge, 0) * -1px)); }
.v2-brand:hover .v2-brand__mark, body.v2.v2-intune .v2-brand__mark { --merge: 1.4; }
.v2-brand__text { display: flex; flex-direction: column; line-height: 1; }
.v2-brand__name { font-family: var(--v2-display); font-weight: 600; font-size: 20px; letter-spacing: -0.01em; color: var(--v2-ink); }
.v2-brand__sub { margin-top: 5px; font-family: var(--v2-body); font-weight: 500; font-size: 10.5px; letter-spacing: .2em; text-transform: uppercase; color: var(--v2-muted); }

body.v2 .header__nav { gap: 2px; }
body.v2 .header__nav > a,
body.v2 .nav-dropdown__trigger {
  color: var(--v2-ink-2); font-family: var(--v2-body); font-weight: 500; font-size: 15px; letter-spacing: 0;
  padding: 10px 14px; border-radius: 999px; transition: background .25s var(--v2-ease), color .25s var(--v2-ease);
}
body.v2 .header__nav > a::after { display: none; }
body.v2 .header__nav > a:hover,
body.v2 .nav-dropdown__trigger:hover { color: var(--v2-ink); background: rgba(91, 92, 246, .07); }
body.v2 .header__nav a.v2-nav__book { margin-left: 10px; padding: 13px 22px; font-size: 15px; }
body.v2 .nav-dropdown__menu-inner {
  background: rgba(255, 255, 255, .92); border: 1px solid var(--v2-line); border-radius: 18px; padding: 8px;
  -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); box-shadow: 0 24px 50px -22px rgba(11, 13, 31, .3);
}
body.v2 .nav-dropdown__menu-inner a { color: var(--v2-ink-2); border-radius: 12px; }
body.v2 .nav-dropdown__menu-inner a:hover { background: var(--v2-ice); color: var(--v2-ink); }

/* Phone menu */
body.v2 .header__hamburger { width: 46px; height: 46px; border-radius: 50%; background: rgba(91, 92, 246, .07); transition: transform .4s var(--v2-spring); }
body.v2 .header__hamburger:active { transform: scale(.9); }
body.v2 .header__hamburger span { background: var(--v2-ink); width: 18px; left: 14px; height: 1.6px; border-radius: 2px; }
body.v2 .header__hamburger span:nth-child(1) { top: 17px; }
body.v2 .header__hamburger span:nth-child(2) { top: 22.5px; }
body.v2 .header__hamburger span:nth-child(3) { top: 28px; }
body.v2 .header__hamburger.active span:nth-child(1),
body.v2 .header__hamburger.active span:nth-child(3) { top: 22.5px; }
body.v2 .mobile-nav {
  background:
    radial-gradient(closest-side at 12% 18%, rgba(122, 92, 255, .14), transparent),
    radial-gradient(closest-side at 92% 78%, rgba(79, 178, 245, .16), transparent),
    rgba(255, 255, 255, .97);
  -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);
  padding: 112px 24px calc(28px + env(safe-area-inset-bottom, 0px)); gap: 0; align-items: stretch;
}
.v2-mnav__primary { display: flex; flex-direction: column; gap: 4px; }
body.v2 .v2-mnav__primary a { font-family: var(--v2-display); font-weight: 600; font-size: 38px; line-height: 1.15; letter-spacing: -0.015em; color: var(--v2-ink); padding: 4px 0; }
.v2-mnav__more { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 30px; padding-top: 26px; border-top: 1px solid var(--v2-line); }
body.v2 .v2-mnav__more a { font-family: var(--v2-body); font-weight: 500; font-size: 15px; color: var(--v2-ink-2); padding: 9px 14px; border-radius: 999px; background: rgba(255, 255, 255, .8); border: 1px solid var(--v2-line); }
body.v2 .mobile-nav a.v2-mnav__book { margin-top: auto; height: 58px; font-size: 17px; }

/* ==========================================================================
   Hero: the front room. The arch steps over the threshold into the gallery.
   ========================================================================== */
body.v2 .hero {
  min-height: auto; background: #FFFFFF;
  display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); align-items: center; gap: 48px;
  max-width: none; margin: 0; padding: 164px var(--v2-gutter) 0;
  position: relative; z-index: 2; overflow-x: clip; overflow-y: visible;
}
body.v2 .hero::before, body.v2 .hero::after { display: none; }
body.v2 .hero__video, body.v2 .hero__overlay, body.v2 .hero__scroll-cue { display: none; }
.v2-aura {
  position: absolute; inset: -10% -5% 0; pointer-events: none; z-index: 0;
  background:
    radial-gradient(closest-side at 18% 46%, rgba(122, 92, 255, .14), transparent),
    radial-gradient(closest-side at 50% 30%, rgba(91, 124, 255, .1), transparent),
    radial-gradient(closest-side at 80% 50%, rgba(79, 178, 245, .16), transparent);
  filter: blur(30px);
}
@media (prefers-reduced-motion: no-preference) { .v2-aura { animation: v2-breathe 10s ease-in-out infinite alternate; } }
@keyframes v2-breathe { to { transform: scale(1.06); opacity: .8; } }

body.v2 .hero__content { position: relative; z-index: 1; max-width: none; padding: 0 0 120px; margin: 0; width: auto; text-align: left; }
body.v2 .hero__eyebrow {
  display: inline-flex; align-items: center; gap: 10px; padding: 0; background: none; border: 0;
  font-family: var(--v2-body); font-weight: 600; font-size: 12.5px; letter-spacing: .18em; text-transform: uppercase; color: var(--v2-ink-2);
}
body.v2 .hero__eyebrow::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--v2-aurora); box-shadow: 0 0 0 4px rgba(122, 92, 255, .14); }
@media (prefers-reduced-motion: no-preference) { body.v2 .hero__eyebrow::before { animation: v2-pulse 2.6s ease-in-out infinite; } }
@keyframes v2-pulse { 50% { box-shadow: 0 0 0 7px rgba(122, 92, 255, 0); } }
body.v2 .hero__headline {
  position: relative; z-index: 0;
  font-family: var(--v2-display); font-weight: 600; font-size: clamp(46px, 5.6vw, 82px); line-height: .98; letter-spacing: -0.032em;
  color: var(--v2-ink); margin: 26px 0 22px; text-shadow: none;
}
body.v2 .hero__headline em {
  position: relative; display: inline-block; font-style: normal;
  background: var(--v2-aurora-text); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent;
}
@media (prefers-reduced-motion: no-preference) { body.v2 .hero__headline em { animation: v2-drift 9s ease-in-out infinite alternate; } }
@keyframes v2-drift { to { background-position: 100% 0; } }
/* The one paint drip: runs from "Color Realism" down behind the next line */
body.v2 .v2-drip svg.drips { position: absolute; left: 0; top: 0; z-index: -1; overflow: visible; pointer-events: none; }
body.v2 .v2-drip .drip { transform: scaleY(1); }
body.v2 .v2-drip .droplet { opacity: 0; transform-box: fill-box; transform-origin: center; }
@media (prefers-reduced-motion: no-preference) {
  body.v2 .v2-drip .drip { transform: scaleY(0); }
  body.v2 .v2-drip.drips-in .drip { transform: scaleY(1); transition: transform var(--t) cubic-bezier(.45, .05, .25, 1) var(--d); }
  body.v2 .v2-drip.no-anim .drip { transition: none; }
  body.v2 .v2-drip.drips-in .droplet { animation: v2-fall 1.2s cubic-bezier(.55, 0, .9, .4) var(--d) both; }
}
@keyframes v2-fall { 0% { opacity: 1; transform: translateY(0) scale(.6); } 15% { opacity: 1; transform: translateY(2px) scale(1); } 100% { opacity: 0; transform: translateY(var(--fall)) scaleY(1.25); } }

body.v2 .hero__subhead { color: var(--v2-ink-2); font-size: 19px; line-height: 1.5; max-width: 32ch; text-shadow: none; }
body.v2 .hero__actions { margin-top: 34px; display: flex; flex-wrap: wrap; gap: 12px; }
body.v2 .hero__proof { margin-top: 30px; display: flex; flex-wrap: wrap; gap: 6px 22px; }
body.v2 .hero__proof span {
  display: inline-flex; align-items: center; gap: 9px; color: var(--v2-ink-2); font-size: 14.5px; font-weight: 500; letter-spacing: .01em; text-transform: none;
  padding: 0; border: 0; background: none;
}
body.v2 .hero__proof span::after { display: none; }
body.v2 .hero__proof span::before { content: ''; display: block; position: static; width: 5px; height: 5px; border-radius: 50%; background: var(--v2-aurora); }

/* Hero entrance: everything glides in, in order */
@media (prefers-reduced-motion: no-preference) {
  body.v2 .hero__content > * { animation: v2-rise 1s var(--v2-ease) both; }
  body.v2 .hero__content > :nth-child(2) { animation-delay: .08s; }
  body.v2 .hero__content > :nth-child(3) { animation-delay: .18s; }
  body.v2 .hero__content > :nth-child(4) { animation-delay: .26s; }
  body.v2 .hero__content > :nth-child(5) { animation-delay: .34s; }
  .v2-hero__art { animation: v2-rise-art 1.3s var(--v2-ease) .15s both; }
}
@keyframes v2-rise { from { opacity: 0; transform: translateY(22px); filter: blur(6px); } to { opacity: 1; transform: none; filter: none; } }
@keyframes v2-rise-art { from { opacity: 0; transform: translateY(40px) scale(.96); filter: blur(10px); } to { opacity: 1; transform: none; filter: none; } }

/* Hero art: chromatic disc, silver arch, overlapping into the gallery below */
.v2-hero__art {
  position: relative; z-index: 3; margin: 0 0 -110px; align-self: end; justify-self: center; width: min(100%, 480px);
  perspective: 1000px;
}

/* ==========================================================================
   The arch: polished silver frame with an LED backlight, like the studio mirror
   ========================================================================== */
body.v2 .v2-arch {
  position: relative; z-index: 1; display: block; aspect-ratio: 4 / 5; overflow: hidden; isolation: isolate;
  border-radius: var(--v2-arch); border: 9px solid transparent;
  background: linear-gradient(var(--v2-room), var(--v2-room)) padding-box, var(--v2-chrome) border-box;
  box-shadow:
    0 0 0 1px rgba(11, 13, 31, .08),
    0 0 50px -6px rgba(158, 232, 255, .55),
    0 0 110px -10px rgba(122, 92, 255, .4),
    0 50px 90px -40px rgba(11, 13, 31, .55);
  transform: rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));
  transition: transform .8s var(--v2-ease), --v2-ang 1.2s var(--v2-ease);
}
.v2-arch::after {
  content: ''; position: absolute; inset: 0; border-radius: 999px 999px 11px 11px; pointer-events: none; z-index: 2;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .25), inset 0 40px 60px -40px rgba(255, 255, 255, .35);
}
.v2-arch img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 999px 999px 11px 11px; transition: transform 1s var(--v2-ease); }
.v2-arch:hover img { transform: scale(1.04); }
.v2-glow { position: relative; }

/* A soft spectrum orb behind the hero arch, like the frosted acrylic clock.
   No rim, no outline: just color that fades into the room. */
.v2-disc {
  position: absolute; z-index: -1; width: 125%; aspect-ratio: 1; right: -46%; top: -14%; border-radius: 50%;
  pointer-events: none;
  background: conic-gradient(from 210deg, #B9A8FF, #8FB0FF, #9EE8FF, #CFC4FF, #7A9CFF, #B9A8FF);
  -webkit-mask: radial-gradient(closest-side, #000 52%, rgba(0, 0, 0, .55) 72%, transparent 100%);
  mask: radial-gradient(closest-side, #000 52%, rgba(0, 0, 0, .55) 72%, transparent 100%);
  opacity: .75; filter: saturate(1.05);
  transform: translate(var(--px, 0px), var(--py, 0px)); transition: transform 1s var(--v2-ease);
}
.v2-disc::after {
  content: ''; position: absolute; inset: 0; border-radius: 50%;
  background: radial-gradient(circle at 34% 30%, rgba(255, 255, 255, .85), rgba(255, 255, 255, 0) 46%);
}
@media (prefers-reduced-motion: no-preference) { .v2-disc { animation: v2-turn 120s linear infinite; } .v2-disc::after { animation: v2-turn 120s linear infinite reverse; } }
@keyframes v2-turn { to { rotate: 360deg; } }

.v2-hero__chip {
  position: absolute; left: 50%; bottom: -22px; transform: translateX(-50%); z-index: 4; white-space: nowrap;
  display: inline-flex; align-items: center; gap: 8px; padding: 12px 18px; border-radius: 999px;
  font-size: 14px; font-weight: 500; color: var(--v2-ink); text-decoration: none;
  background: rgba(255, 255, 255, .9); border: 1px solid rgba(255, 255, 255, .95);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  box-shadow: inset 0 1px 0 #fff, 0 0 0 1px rgba(70, 80, 170, .1), 0 14px 34px -14px rgba(11, 13, 31, .5);
  transition: transform .5s var(--v2-spring), box-shadow .3s var(--v2-ease);
}
.v2-hero__chip:hover { transform: translateX(-50%) translateY(-3px); box-shadow: inset 0 1px 0 #fff, 0 0 0 1px rgba(91, 92, 246, .3), 0 20px 40px -14px rgba(11, 13, 31, .55); }
.v2-hero__chip:active { transform: translateX(-50%) scale(.95); transition-duration: .12s; }
.v2-hero__chip b { font-weight: 700; background: var(--v2-aurora-text); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* ==========================================================================
   The back room: selected work on deep ink. The room takes on the color
   of whichever piece you are looking at.
   ========================================================================== */
body.v2 .v2-room {
  --text-primary: #F3F4FA; --text-secondary: #AEB3CF; --text-muted: #8A8EA8; --border: rgba(255, 255, 255, .1);
  background: var(--v2-room); margin: 0 12px; border-radius: 36px; padding-top: 168px;
  position: relative; overflow: hidden; isolation: isolate;
}
.v2-room__light {
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(55% 45% at var(--lx) var(--ly), color-mix(in srgb, var(--room-glow) 34%, transparent), transparent 72%),
    radial-gradient(40% 35% at 85% 0%, rgba(122, 92, 255, .2), transparent 70%);
  transition: --room-glow 1.4s var(--v2-ease), --lx 1.6s var(--v2-ease), --ly 1.6s var(--v2-ease);
}
body.v2 .v2-room::after {
  content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none; opacity: .07; mix-blend-mode: overlay;
  background: url('/assets/grain.png') repeat; background-size: 220px;
}
body.v2 .v2-room .container { position: relative; z-index: 1; }
body.v2 .v2-room h2 { color: #F3F4FA; margin: 0; }
body.v2 .v2-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 44px; }
body.v2 .v2-room__more { display: none; }

body.v2 .v2-room .portfolio-grid--featured { display: grid; gap: 16px; grid-template-columns: 2fr 1fr 1fr 1fr; grid-template-rows: auto auto; }
body.v2 .v2-room .portfolio-item {
  aspect-ratio: 4 / 5; border-radius: 18px; overflow: visible; position: relative; isolation: isolate; background: transparent; box-shadow: none;
  transition: transform .6s var(--v2-spring);
}
body.v2 .v2-room .portfolio-item--hero { grid-column: 1; grid-row: 1 / span 2; aspect-ratio: auto; }
body.v2 .v2-room .portfolio-item img { border-radius: 18px; transition: transform .9s var(--v2-ease), filter .6s var(--v2-ease); }
body.v2 .v2-room .portfolio-item::before {
  content: ''; position: absolute; inset: 16% 12% -4%; z-index: -1; border-radius: 18px;
  background: var(--glow, #5B7CFF); filter: blur(30px); opacity: .22; transition: opacity .6s var(--v2-ease), transform .6s var(--v2-ease);
}
body.v2 .v2-room .portfolio-item::after { content: ''; position: absolute; inset: 0; border-radius: 18px; pointer-events: none; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08); }
@media (hover: hover) {
  body.v2 .v2-room .portfolio-grid--featured:hover .portfolio-item:not(:hover) img { filter: brightness(.62) saturate(.8); }
  body.v2 .v2-room .portfolio-item:hover { transform: translateY(-6px); }
  body.v2 .v2-room .portfolio-item:hover::before { opacity: .75; transform: scale(1.06); }
}
body.v2 .v2-room .portfolio-item .portfolio-item__overlay {
  display: block; left: 12px; right: auto; bottom: 12px; max-width: calc(100% - 24px); padding: 9px 14px; border-radius: 14px;
  background: rgba(10, 12, 26, .55); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border: 1px solid rgba(255, 255, 255, .12);
  opacity: 0; transform: translateY(6px);
}
body.v2 .v2-room .portfolio-item:hover .portfolio-item__overlay,
body.v2 .v2-room .portfolio-item--hero .portfolio-item__overlay { opacity: 1; transform: none; }
body.v2 .v2-room .portfolio-item__title { font-family: var(--v2-body); font-weight: 700; font-size: 14px; color: #fff; margin: 0; }
body.v2 .v2-room .portfolio-item__meta { font-size: 12px; color: #B9BDD6; margin-top: 2px; }

/* ---------- Press: proof right after the work ---------- */
body.v2 .press-strip { background: #FFFFFF; border: 0; padding: 60px 0 20px; }
body.v2 .press-strip__label { color: var(--v2-muted); letter-spacing: .2em; }
body.v2 .press-strip__logo--invert, body.v2 .press-strip__logo--inkppl { filter: none; }
body.v2 .press-strip__item { transition: transform .5s var(--v2-spring); }
body.v2 .press-strip__item:hover { transform: translateY(-3px); }
body.v2 .press-strip__pub { color: var(--v2-ink); }
body.v2 .press-strip__desc { color: var(--v2-muted); }

/* ==========================================================================
   Pets: one silver arch, the fresh photo overlapping in front of it
   ========================================================================== */
body.v2 .pet-feature { gap: 72px; align-items: center; }
body.v2 .pet-feature__text h2 { margin-bottom: 18px; }
body.v2 .pet-feature__text .btn { margin-top: 30px; }
body.v2 .pet-feature__text .v2-note { margin: 22px 0 0; }
body.v2 .pet-feature__pair.v2-pair { display: block; position: relative; width: min(100%, 470px); justify-self: end; padding: 0 0 44px 74px; perspective: 1000px; }
body.v2 .v2-pair figure { margin: 0; position: relative; }
body.v2 .v2-pair__main { isolation: isolate; }
body.v2 .v2-pair__main a.v2-arch { aspect-ratio: 4 / 5; }
body.v2 .v2-pair__inset { position: absolute !important; left: 0; bottom: 0; width: 40%; z-index: 3; }
body.v2 .v2-pair__inset a {
  display: block; aspect-ratio: 4 / 5; border-radius: 18px; overflow: hidden; border: 5px solid #fff;
  box-shadow: 0 0 0 1px rgba(11, 13, 31, .06), 0 24px 50px -22px rgba(11, 13, 31, .55);
  transform: rotate(-4deg); transition: transform .6s var(--v2-spring);
}
body.v2 .v2-pair__inset a:hover { transform: rotate(0) translateY(-6px) scale(1.03); }
body.v2 .v2-pair img { width: 100%; height: 100%; object-fit: cover; display: block; }
body.v2 .v2-tag {
  position: absolute; z-index: 3; margin: 0; padding: 7px 12px; border-radius: 999px;
  font-size: 12.5px; font-weight: 700; letter-spacing: .02em; color: #fff;
  background: rgba(10, 12, 26, .5); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border: 1px solid rgba(255, 255, 255, .2);
}
body.v2 .v2-pair__main .v2-tag { right: 22px; bottom: 22px; }
body.v2 .v2-pair__inset .v2-tag { left: 14px; top: -12px; color: var(--v2-ink); background: rgba(255, 255, 255, .94); border-color: var(--v2-line); transform: rotate(-4deg); }

/* ---------- The artist ---------- */
body.v2 .v2-calm { background: var(--v2-ice); overflow: hidden; overflow: clip; position: relative; }
body.v2 .v2-calm::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(115deg, rgba(122, 92, 255, .07), rgba(255, 255, 255, 0) 45%, rgba(79, 178, 245, .08));
}
body.v2 .artist-approach { gap: 80px; position: relative; }
.v2-approach-art { position: relative; width: min(100%, 420px); isolation: isolate; perspective: 1000px; }
body.v2 .artist-approach__image {
  position: relative; aspect-ratio: 4 / 5; max-width: 420px; overflow: hidden;
  border-radius: var(--v2-arch); border: 9px solid transparent;
  background: linear-gradient(var(--v2-ice), var(--v2-ice)) padding-box, var(--v2-chrome) border-box;
  box-shadow: 0 0 0 1px rgba(11, 13, 31, .08), 0 0 50px -6px rgba(158, 232, 255, .55), 0 0 110px -10px rgba(122, 92, 255, .35), 0 50px 90px -40px rgba(11, 13, 31, .5);
  transition: --v2-ang 1.2s var(--v2-ease);
}
body.v2 .artist-approach__image img { width: 100%; height: 100%; object-fit: cover; border-radius: 999px 999px 11px 11px; aspect-ratio: auto; }
body.v2 .artist-approach__text h2 { margin-bottom: 22px; }

/* ---------- Reviews: one large voice, two beside it ---------- */
body.v2 .v2-reviews-head { max-width: 680px; margin: 0 0 48px; }
body.v2 .v2-reviews-head h2 { margin-bottom: 12px; }
body.v2 .eyebrow-reviews { display: none; }
body.v2 .reviews-grid { gap: 20px !important; position: relative; }
body.v2 .reviews-grid > div {
  position: relative; display: flex; flex-direction: column; overflow: hidden;
  background: #FFFFFF; border: 1px solid var(--v2-line); border-radius: 26px; padding: 32px 30px 28px;
  transition: transform .6s var(--v2-spring), box-shadow .4s var(--v2-ease), border-color .4s var(--v2-ease);
}
@media (hover: hover) {
  body.v2 .reviews-grid > div:hover { transform: translateY(-4px); border-color: rgba(91, 92, 246, .25); box-shadow: 0 30px 60px -36px rgba(60, 70, 170, .45); }
}
body.v2 .reviews-grid > div > div:first-child {
  background: var(--v2-aurora-text); -webkit-background-clip: text; background-clip: text; color: transparent !important; width: fit-content;
}
body.v2 .reviews-grid > div > div:nth-of-type(2) { margin-top: auto; }
@media (min-width: 769px) {
  body.v2 .reviews-grid { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) !important; }
  body.v2 .reviews-grid > div:nth-child(2) {
    grid-column: 1; grid-row: 1 / span 2; padding: 48px 46px 42px; border-color: transparent;
    background: linear-gradient(150deg, rgba(122, 92, 255, .09), rgba(243, 245, 253, 0) 40%, rgba(79, 178, 245, .1)), var(--v2-ice);
  }
  body.v2 .reviews-grid > div:nth-child(2) > p:first-of-type { font-family: var(--v2-display); font-weight: 500; font-size: 23px !important; line-height: 1.45 !important; letter-spacing: -0.01em; color: var(--v2-ink) !important; }
  body.v2 .reviews-grid > div:nth-child(1) { grid-column: 2; grid-row: 1; }
  body.v2 .reviews-grid > div:nth-child(3) { grid-column: 2; grid-row: 2; }
}

/* ---------- Process: four steps, then the natural moment to act ---------- */
body.v2 .section--tint { position: relative; }
body.v2 .v2-process h2 { margin-bottom: 52px; }
body.v2 .process-steps { counter-reset: v2step; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; max-width: none; padding-left: 0; }
body.v2 .process-steps::before { display: none; }
body.v2 .process-step { counter-increment: v2step; position: relative; min-height: 0; padding: 30px 8px 0 0; border-top: 1px solid var(--v2-line); background: none; }
body.v2 .process-step::before {
  content: counter(v2step, decimal-leading-zero); position: static; display: block; margin-bottom: 18px;
  font-family: var(--v2-display); font-weight: 600; font-size: 40px; line-height: 1; letter-spacing: -0.02em;
  background: var(--v2-aurora-text); -webkit-background-clip: text; background-clip: text; color: transparent;
}
body.v2 .process-step::after {
  content: ''; display: block; position: absolute; top: -1px; left: 0; width: 100%; height: 2px; bottom: auto;
  background: var(--v2-aurora); transform: scaleX(0); transform-origin: left; transition: transform 1.1s var(--v2-ease);
  border-radius: 0;
}
body.v2 .v2-process.visible .process-step::after { transform: scaleX(1); }
body.v2 .v2-process.visible .process-step:nth-child(2)::after { transition-delay: .2s; }
body.v2 .v2-process.visible .process-step:nth-child(3)::after { transition-delay: .4s; }
body.v2 .v2-process.visible .process-step:nth-child(4)::after { transition-delay: .6s; }
body.v2 .process-step h3 { font-size: 21px; margin-bottom: 10px; }
body.v2 .process-step p { font-size: 16px; line-height: 1.6; margin: 0; }
.v2-process__end { display: flex; align-items: center; gap: 28px; margin-top: 56px; padding-top: 36px; border-top: 1px solid var(--v2-line); }
body.v2 .v2-process__end p { margin: 0; max-width: 52ch; font-size: 15.5px; color: var(--v2-muted); }
body.v2 .v2-process__end .hero__cta { width: auto; flex-shrink: 0; }

/* ---------- Questions ---------- */
body.v2 .v2-faq { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); grid-template-rows: auto auto 1fr; column-gap: 72px; align-items: start; }
body.v2 .v2-faq > .v2-faq__head { grid-column: 1; grid-row: 1; }
body.v2 .v2-faq__head h2 { margin-bottom: 26px; }
body.v2 .v2-faq > .faq-list { grid-column: 2; grid-row: 1 / span 3; max-width: none; border-top: 1px solid var(--v2-line); }
body.v2 .v2-faq > .mt-4:not(.home-reading) { grid-column: 1; grid-row: 2; margin-top: 0; }
body.v2 .v2-faq > .home-reading { grid-column: 1; grid-row: 3; margin-top: 28px; font-size: 15px; line-height: 1.8; max-width: 36ch; color: var(--v2-muted); }
body.v2 .faq-item { border-color: var(--v2-line); transition: background .4s var(--v2-ease); }
body.v2 .faq-question { color: var(--v2-ink); font-family: var(--v2-display); font-weight: 500; font-size: 20px; padding: 26px 0; transition: color .3s var(--v2-ease), padding .5s var(--v2-spring); }
@media (hover: hover) { body.v2 .faq-question:hover { color: var(--v2-accent); padding-left: 8px; } }
body.v2 .faq-icon { width: 30px; height: 30px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 1px var(--v2-line); transition: transform .5s var(--v2-spring), background .3s; }
body.v2 .faq-icon::before { width: 12px; height: 1.6px; top: 14.2px; left: 9px; background: var(--v2-ink); }
body.v2 .faq-icon::after { width: 1.6px; height: 12px; top: 9px; left: 14.2px; background: var(--v2-ink); }
body.v2 .faq-item.active .faq-icon { transform: rotate(135deg); background: var(--v2-aurora); box-shadow: none; }
body.v2 .faq-item.active .faq-icon::before, body.v2 .faq-item.active .faq-icon::after { background: #fff; transform: none; }
body.v2 .faq-answer p { font-size: 16.5px; }
body.v2 .faq-answer a, body.v2 .home-reading a { color: var(--v2-accent) !important; }

/* ==========================================================================
   Footer: the last room, with a slow wave of light
   ========================================================================== */
body.v2 .footer {
  --text-primary: #F3F4FA; --text-secondary: #AEB3CF; --text-muted: #8A8EA8; --border: rgba(255, 255, 255, .1);
  background: var(--v2-room); margin: 12px; border-radius: 36px 36px 0 0; overflow: hidden;
}
body.v2 .footer::before { display: none; }
body.v2 .footer h2, body.v2 .footer__cta-title { color: #F3F4FA; }
body.v2 .footer p { color: #AEB3CF; }
body.v2 .footer__cta { position: relative; background: transparent; padding: 104px 0 96px; border-bottom: 1px solid rgba(255, 255, 255, .08); }
body.v2 .footer__cta-inner { position: relative; z-index: 1; }
body.v2 .footer__cta-title { font-family: var(--v2-display); font-weight: 600; font-size: clamp(34px, 4.6vw, 60px); line-height: 1.02; letter-spacing: -0.025em; }
body.v2 .footer__cta-text { max-width: 700px; }
.v2-wave { position: absolute; left: 0; right: 0; bottom: -4%; width: 100%; height: 46%; opacity: .4; pointer-events: none; filter: blur(14px); }
@media (prefers-reduced-motion: no-preference) {
  .v2-wave path { animation: v2-tide 14s ease-in-out infinite alternate; }
  .v2-wave path + path { animation-duration: 18s; animation-direction: alternate-reverse; }
}
@keyframes v2-tide { to { transform: translateX(-4%) translateY(6px); } }
.v2-foot { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.4fr); gap: 56px; padding-top: 64px; padding-bottom: 48px; }
.v2-foot__name { font-family: var(--v2-display); font-weight: 600; font-size: 24px; color: #F3F4FA; text-decoration: none; }
body.v2 .v2-foot__tagline { margin: 12px 0 18px; font-size: 15px; line-height: 1.6; color: #8A8EA8; max-width: 34ch; }
.v2-foot__contact { display: flex; flex-wrap: wrap; gap: 8px; }
.v2-foot__contact a { font-size: 14px; color: #D5D8EA; text-decoration: none; padding: 8px 14px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .12); background: rgba(255, 255, 255, .03); transition: border-color .3s var(--v2-ease), background .3s var(--v2-ease); }
.v2-foot__contact a:hover { border-color: rgba(255, 255, 255, .3); background: rgba(255, 255, 255, .06); }
.v2-foot__nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; }
.v2-foot__main { gap: 12px 26px; }
.v2-foot__main a { font-family: var(--v2-display); font-weight: 500; font-size: 17px; color: #F3F4FA; text-decoration: none; transition: color .25s; }
.v2-foot__main a:hover { color: var(--v2-glacier); }
.v2-foot__more { gap: 10px 22px; margin-top: 28px !important; padding-top: 24px !important; border-top: 1px solid rgba(255, 255, 255, .08); }
.v2-foot__more li { display: inline-flex; align-items: center; }
.v2-foot__more a { font-size: 14px; color: #8A8EA8; text-decoration: none; transition: color .25s; }
.v2-foot__more a:hover { color: #F3F4FA; }
.v2-foot__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 24px; padding-top: 22px; padding-bottom: 28px; position: relative; font-size: 12.5px; color: #6E7290; }
.v2-foot__bottom::before { content: ''; position: absolute; top: 0; left: 24px; right: 24px; border-top: 1px solid rgba(255, 255, 255, .08); }
.v2-foot__bottom address { font-style: normal; }
.v2-foot__bottom a { color: inherit; text-decoration: none; }
.v2-foot__bottom a:hover { color: #D5D8EA; }
.v2-foot__legal { display: inline-flex; gap: 18px; }

/* ==========================================================================
   The floating guide: where you are, where to go next, one tap to book.
   Shown after the hero, hidden over the footer (app.js toggles .visible).
   ========================================================================== */
body.v2 .mobile-sticky-cta.v2-dock {
  display: flex; align-items: center; gap: 4px;
  position: fixed; z-index: 90; left: 50%; right: auto; bottom: calc(18px + env(safe-area-inset-bottom, 0px)); width: auto; height: auto;
  padding: 6px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .9); border-top: 1px solid rgba(255, 255, 255, .9);
  background: rgba(255, 255, 255, .78);
  -webkit-backdrop-filter: blur(22px) saturate(180%); backdrop-filter: blur(22px) saturate(180%);
  box-shadow: inset 0 1px 0 #fff, 0 0 0 1px rgba(11, 13, 31, .05), 0 22px 50px -20px rgba(11, 13, 31, .45);
  transform: translate(-50%, 160%); opacity: 0;
  transition: transform .7s var(--v2-spring), opacity .4s var(--v2-ease);
}
body.v2 .mobile-sticky-cta.v2-dock.visible { transform: translate(-50%, 0); opacity: 1; }
body.v2 .v2-dock a { width: auto; height: auto; background: none; border-radius: 999px; font-family: var(--v2-body); letter-spacing: 0; text-decoration: none; }
body.v2 .v2-dock a.v2-dock__book { order: 3; flex-shrink: 0; white-space: nowrap; height: 46px; padding: 0 20px 0 22px; font-size: 15px; gap: 8px; }
.v2-dock__chapters { order: 1; position: relative; display: flex; align-items: center; gap: 0; padding-right: 4px; }
body.v2 .v2-dock__chapters a {
  position: relative; z-index: 1; display: inline-flex; align-items: baseline; gap: 6px; padding: 13px 14px;
  font-size: 14px; font-weight: 500; color: var(--v2-ink-2); white-space: nowrap; transition: color .3s var(--v2-ease);
}
body.v2 .v2-dock__chapters a b { font-size: 10.5px; font-weight: 700; letter-spacing: .08em; color: var(--v2-muted); transition: color .3s var(--v2-ease); }
body.v2 .v2-dock__chapters a:hover { color: var(--v2-ink); }
body.v2 .v2-dock__chapters a.is-active { color: var(--v2-ink); font-weight: 700; }
body.v2 .v2-dock__chapters a.is-active b { color: var(--v2-accent); }
.v2-dock__pill {
  position: absolute; z-index: 0; top: 50%; left: 0; height: 40px; width: 0; margin-top: -20px; border-radius: 999px; pointer-events: none;
  background: linear-gradient(180deg, #fff, rgba(238, 242, 255, .8)); box-shadow: inset 0 1px 0 #fff, 0 0 0 1px rgba(91, 92, 246, .16), 0 6px 16px -8px rgba(60, 70, 170, .5);
  transition: transform .6s var(--v2-spring), width .6s var(--v2-spring), opacity .3s;
}
body.v2 .v2-dock a.v2-dock__next { display: none; order: 2; }
.v2-dock__progress {
  position: absolute; left: 26px; right: 26px; bottom: -1px; height: 2px; border-radius: 2px; pointer-events: none;
  background: var(--v2-aurora); transform-origin: left; transform: scaleX(var(--p, 0));
}

/* ==========================================================================
   Gliding reveals
   ========================================================================== */
@media (prefers-reduced-motion: no-preference) {
  body.v2 .reveal { opacity: 0; transform: translateY(36px); transition: opacity 1s var(--v2-ease), transform 1.1s var(--v2-ease); }
  body.v2 .reveal.visible { opacity: 1; transform: none; }
  body.v2 .v2-room.reveal .portfolio-item { opacity: 0; transform: translateY(24px) scale(.97); transition: opacity .9s var(--v2-ease), transform 1s var(--v2-ease); }
  body.v2 .v2-room.reveal.visible .portfolio-item { opacity: 1; transform: none; }
  body.v2 .v2-room.reveal.visible .portfolio-item:nth-child(2) { transition-delay: .08s; }
  body.v2 .v2-room.reveal.visible .portfolio-item:nth-child(3) { transition-delay: .14s; }
  body.v2 .v2-room.reveal.visible .portfolio-item:nth-child(4) { transition-delay: .2s; }
  body.v2 .v2-room.reveal.visible .portfolio-item:nth-child(5) { transition-delay: .26s; }
  body.v2 .v2-room.reveal.visible .portfolio-item:nth-child(6) { transition-delay: .32s; }
  body.v2 .v2-room.reveal.visible .portfolio-item:nth-child(7) { transition-delay: .38s; }
  body.v2 .v2-room.reveal.visible .portfolio-item:hover { transition: transform .6s var(--v2-spring); transition-delay: 0s; }
}
/* The gallery room itself is always visible: the hero arch steps into it */
body.v2 .v2-room.reveal { opacity: 1; transform: none; }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1100px) {
  body.v2 .header__nav > a, body.v2 .nav-dropdown__trigger { padding: 10px 10px; font-size: 14.5px; }
  body.v2 .v2-dock__chapters a { padding: 13px 10px; font-size: 13.5px; }
}
@media (max-width: 960px) {
  body.v2 .process-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 40px; }
  body.v2 .v2-room .portfolio-grid--featured { grid-template-columns: 1fr 1fr; grid-template-rows: none; }
  body.v2 .v2-room .portfolio-item--hero { grid-column: 1 / -1; grid-row: auto; aspect-ratio: 4 / 5; }
  body.v2 .v2-faq { grid-template-columns: 1fr; grid-template-rows: none; }
  body.v2 .v2-faq > .v2-faq__head, body.v2 .v2-faq > .faq-list, body.v2 .v2-faq > .mt-4:not(.home-reading), body.v2 .v2-faq > .home-reading { grid-column: 1; grid-row: auto; }
  body.v2 .v2-faq > .faq-list { margin-bottom: 28px; }
  .v2-foot { grid-template-columns: 1fr; gap: 40px; }
  /* Guide becomes: next chapter + book */
  body.v2 .mobile-sticky-cta.v2-dock { left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom, 0px)); transform: translateY(160%); }
  body.v2 .mobile-sticky-cta.v2-dock.visible { transform: translateY(0); }
  .v2-dock__chapters { display: none; }
  body.v2 .v2-dock a.v2-dock__next {
    display: flex; flex: 1; min-width: 0; align-items: center; gap: 10px; height: 46px; padding: 0 12px 0 10px;
    font-size: 14.5px; font-weight: 500; color: var(--v2-ink-2);
  }
  body.v2 .v2-dock a.v2-dock__next b { color: var(--v2-ink); font-weight: 700; }
  .v2-dock__next-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .v2-dock__ring {
    flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%;
    background: conic-gradient(#7A5CFF, #4FB2F5 calc(var(--p, 0) * 360deg), rgba(91, 92, 246, .14) 0);
    -webkit-mask: radial-gradient(circle, transparent 9px, #000 9.5px); mask: radial-gradient(circle, transparent 9px, #000 9.5px);
  }
  body.v2 .v2-dock a.v2-dock__book { padding: 0 18px; }
  .v2-dock__progress { display: none; }
}
@media (max-width: 768px) {
  body.v2 { --section-padding: 88px; }
  body.v2 p { font-size: 16.5px; }
  body.v2 .header { padding: 10px 10px 0; }
  body.v2 .header__inner { height: 60px; padding: 0 7px 0 16px; }
  .v2-brand__mark { width: 32px; height: 24px; }
  .v2-brand__name { font-size: 18px; }
  .v2-brand__sub { font-size: 9.5px; letter-spacing: .18em; margin-top: 4px; }

  body.v2 .hero { grid-template-columns: 1fr; gap: 12px; padding: 118px 20px 0; }
  body.v2 .hero__content { padding-bottom: 32px; }
  body.v2 .hero__headline { font-size: clamp(42px, 12vw, 58px); }
  body.v2 .hero__subhead { font-size: 17px; }
  body.v2 .hero__actions { flex-direction: column; }
  body.v2 .hero__actions a { width: 100%; justify-content: center; text-align: center; }
  .v2-hero__art { width: min(76%, 330px); margin-bottom: -84px; }
  body.v2 .v2-arch, body.v2 .artist-approach__image { border-width: 7px; }

  body.v2 .v2-room { margin: 0 8px; border-radius: 26px; padding-top: 140px; }
  body.v2 .v2-head .v2-link { display: none; }
  body.v2 .v2-head { margin-bottom: 28px; }
  body.v2 .v2-room__more { display: block; }
  body.v2 .v2-room .portfolio-grid--featured { gap: 10px; }
  body.v2 .v2-room .portfolio-item, body.v2 .v2-room .portfolio-item img, body.v2 .v2-room .portfolio-item::after { border-radius: 14px; }
  body.v2 .v2-room .portfolio-item:not(.portfolio-item--hero) .portfolio-item__overlay { display: none; }

  body.v2 .pet-feature { gap: 44px; }
  body.v2 .pet-feature__pair.v2-pair { justify-self: center; width: min(100%, 360px); padding: 0 0 34px 58px; }

  body.v2 .artist-approach { gap: 40px; }
  .v2-approach-art { width: min(80%, 330px); margin: 0 auto; }
  body.v2 .artist-approach__image { max-width: none; margin: 0; }

  body.v2 .reviews-grid > div { padding: 28px 24px 24px; }

  body.v2 .v2-process h2 { margin-bottom: 36px; }
  .v2-process__end { flex-direction: column; align-items: stretch; gap: 18px; margin-top: 44px; }
  body.v2 .v2-process__end .hero__cta { width: 100%; }

  body.v2 .footer { margin: 8px 8px 0; border-radius: 26px 26px 0 0; padding-bottom: 84px; }
  body.v2 .footer__cta { padding: 64px 0 60px; }
  body.v2 .footer__cta-inner, .v2-foot, .v2-foot__bottom { padding-left: 22px; padding-right: 22px; }
  .v2-foot { padding-top: 48px; padding-bottom: 36px; }
  .v2-foot__main { gap: 10px 22px; }
  .v2-foot__main a { font-size: 18px; }
  .v2-wave { height: 34%; bottom: -4%; }
  .v2-foot__bottom { flex-direction: column; }
  .v2-foot__bottom::before { left: 22px; right: 22px; }
}
@media (max-width: 560px) {
  body.v2 .process-steps { grid-template-columns: 1fr; row-gap: 32px; }
}
@media (max-width: 380px) {
  body.v2 .v2-mnav__primary a { font-size: 32px; }
  body.v2 .v2-dock a.v2-dock__book { padding: 0 14px; font-size: 14px; }
  body.v2 .v2-dock a.v2-dock__book svg { display: none; }
}

/* ==========================================================================
   Round 6: a place you don't want to leave
   ========================================================================== */

/* The aura builds as you scroll: faint at the top, fuller by the end */
.v2-sky {
  position: fixed; inset: -12vh -12vw; z-index: -1; pointer-events: none;
  background:
    radial-gradient(38% 32% at 12% 18%, rgba(122, 92, 255, .32), transparent 70%),
    radial-gradient(42% 38% at 88% 30%, rgba(79, 178, 245, .3), transparent 70%),
    radial-gradient(48% 40% at 35% 92%, rgba(158, 232, 255, .38), transparent 70%),
    radial-gradient(34% 30% at 78% 84%, rgba(185, 168, 255, .34), transparent 70%);
  opacity: var(--sky, .14);
  transform: translate3d(0, calc(var(--sky, 0) * -10vh), 0) scale(calc(1 + var(--sky, 0) * .1));
  transition: opacity .6s linear;
}
body.v2 .hero, body.v2 .section:not(.v2-room), body.v2 .press-strip { background: transparent; }
/* Calm rooms with soft edges instead of hard section breaks */
body.v2 .section--alt, body.v2 .v2-calm {
  margin: 0 12px; border-radius: 36px;
  background: rgba(255, 255, 255, .58); border: 1px solid rgba(255, 255, 255, .9);
  box-shadow: inset 0 1px 0 #fff, 0 40px 80px -60px rgba(60, 70, 170, .35);
}
body.v2 .v2-calm::before { border-radius: inherit; }
body.v2 .v2-pets, body.v2 .v2-process { position: relative; }
body.v2 .v2-pets::before, body.v2 .v2-process::before {
  content: ''; position: absolute; top: 0; left: 50%; width: min(1100px, 86%); height: 1px; transform: translateX(-50%); pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(91, 92, 246, .22), rgba(79, 178, 245, .22), transparent);
}
body.v2 .v2-reviews + style + .v2-process { margin-top: 0; }
body.v2 .v2-questions { margin-bottom: 12px; }

/* Glass bubble buttons: a bright crescent on top, color deeper at the bottom, light rim */
body.v2 .hero__cta,
body.v2 .header__nav a.v2-nav__book,
body.v2 .mobile-nav a.v2-mnav__book,
body.v2 .v2-dock a.v2-dock__book,
body.v2 .footer__cta-btn {
  background:
    radial-gradient(120% 75% at 50% -22%, rgba(255, 255, 255, .62), rgba(255, 255, 255, 0) 58%),
    linear-gradient(120deg, rgba(122, 92, 255, .93) 0%, rgba(91, 124, 255, .93) 48%, rgba(79, 178, 245, .93) 100%);
  border: 1px solid rgba(255, 255, 255, .5);
  box-shadow:
    inset 0 1.5px 0 rgba(255, 255, 255, .8),
    inset 0 0 0 1px rgba(255, 255, 255, .22),
    inset 0 -9px 16px -7px rgba(35, 25, 140, .5),
    0 1px 1px rgba(40, 30, 140, .15),
    0 16px 34px -14px rgba(91, 92, 246, .8);
  -webkit-backdrop-filter: blur(14px) saturate(160%); backdrop-filter: blur(14px) saturate(160%);
}
body.v2 .hero__cta-ghost,
body.v2 .section:not(.v2-room) .btn--secondary {
  background:
    radial-gradient(120% 80% at 50% -28%, #FFFFFF, rgba(255, 255, 255, .55) 58%),
    linear-gradient(180deg, rgba(255, 255, 255, .5), rgba(226, 232, 255, .55));
  box-shadow: inset 0 1.5px 0 #fff, inset 0 -7px 14px -8px rgba(122, 92, 255, .3), 0 0 0 1px rgba(70, 80, 170, .12), 0 12px 28px -16px rgba(60, 70, 170, .5);
  -webkit-backdrop-filter: blur(16px) saturate(160%); backdrop-filter: blur(16px) saturate(160%);
}

/* Good to know: the quiet answers to "why not yet?" */
.v2-ease { list-style: none; margin: 26px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.v2-ease li {
  display: inline-flex; align-items: center; gap: 9px; padding: 9px 15px 9px 11px; border-radius: 999px;
  font-size: 14px; font-weight: 500; color: #D5D8EA;
  background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .12);
}
.v2-ease li::before {
  content: ''; width: 16px; height: 11px; flex-shrink: 0;
  background: radial-gradient(circle at 5px 5.5px, #7A5CFF 0 4.6px, transparent 5px), radial-gradient(circle at 10.5px 5.5px, rgba(79, 178, 245, .9) 0 4.6px, transparent 5px);
}

/* The signature: a big name at the very end, with the circles meeting and one more drip */
.v2-sign {
  position: relative; display: flex; align-items: center; justify-content: center; gap: clamp(12px, 2vw, 28px);
  padding: 30px 24px 84px; overflow: hidden;
}
.v2-sign__mark { width: clamp(64px, 9vw, 140px); height: auto; overflow: visible; flex-shrink: 0; }
.v2-sign__mark circle { transition: transform 1.8s var(--v2-spring) .2s; }
.v2-sign__mark circle:first-child { transform: translate(-7px, -2px); }
.v2-sign__mark circle:last-child { transform: translate(7px, 2px); }
.v2-sign.is-in .v2-sign__mark circle:first-child { transform: translate(3.5px, 1.5px); }
.v2-sign.is-in .v2-sign__mark circle:last-child { transform: translate(-3.5px, -1.5px); }
.v2-sign__name {
  position: relative; z-index: 0; display: inline-block; white-space: nowrap;
  font-family: var(--v2-display); font-weight: 600; font-size: clamp(46px, 10.5vw, 168px); line-height: .92; letter-spacing: -0.045em;
  background: linear-gradient(100deg, #C2B4FF 0%, #93B2FF 50%, #A8EEFF 100%); -webkit-background-clip: text; background-clip: text; color: transparent;
}
@media (max-width: 600px) {
  .v2-sign { flex-direction: column; gap: 14px; padding: 18px 16px 64px; }
  .v2-sign__name { font-size: clamp(40px, 12.5vw, 64px); }
}

/* ==========================================================================
   Round 7: the circles. They tuck behind the name, and two large kinetic
   discs turn slowly high in the background (a nod to Felipe Pantone):
   fine colored stripes on each disc make a moving moiré where they overlap.
   ========================================================================== */
body.v2 .header__logo.v2-brand { gap: 0; }
.v2-brand__mark { position: relative; z-index: 0; align-self: flex-start; width: 34px; height: 25px; margin: -5px -12px 0 0; opacity: .85; }
.v2-brand__text { position: relative; z-index: 1; }
.v2-sign { gap: 0; }
.v2-sign__mark { position: relative; z-index: 0; width: clamp(80px, 12.5vw, 196px); margin-right: calc(clamp(80px, 12.5vw, 196px) * -.3); opacity: .92; }
.v2-sign__name { z-index: 1; }
@media (max-width: 768px) { .v2-brand__mark { width: 31px; height: 23px; margin: -5px -11px 0 0; } }
@media (max-width: 600px) { .v2-sign__mark { margin: 0 0 -26px; } }

.v2-orbs { position: fixed; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
/* The same light, drawn again on top in "screen" mode: invisible on white,
   a soft glow where it drifts over the dark panels */
.v2-burst {
  position: absolute; aspect-ratio: 1; border-radius: 50%;
  -webkit-mask: radial-gradient(closest-side, #000 0%, rgba(0, 0, 0, .7) 35%, transparent 100%);
  mask: radial-gradient(closest-side, #000 0%, rgba(0, 0, 0, .7) 35%, transparent 100%);
}
/* Soft rays of color bursting from one point, turning slowly */
.v2-burst--a {
  width: min(90vmin, 860px); top: calc(min(90vmin, 860px) * -.38); right: calc(min(90vmin, 860px) * -.3);
  background:
    repeating-conic-gradient(from 0deg, rgba(255, 255, 255, 0) 0deg, rgba(255, 255, 255, .55) 4deg, rgba(255, 255, 255, 0) 11deg),
    conic-gradient(from 20deg, #7A5CFF, #5B7CFF, #4FB2F5, #9EE8FF, #B9A8FF, #7A5CFF);
  filter: blur(10px); opacity: .34;
  transform: rotate(calc(var(--spin, 0) * 1deg));
}
.v2-burst--b {
  width: min(60vmin, 560px); top: calc(min(60vmin, 560px) * -.1); right: calc(min(60vmin, 560px) * .05);
  background:
    radial-gradient(closest-side, rgba(255, 255, 255, .8), rgba(255, 255, 255, 0) 60%),
    conic-gradient(from 200deg, #9EE8FF, #B9A8FF, #7A5CFF, #4FB2F5, #9EE8FF);
  filter: blur(26px); opacity: .32;
  transform: rotate(calc(var(--spin, 0) * -1.4deg));
}
@media (prefers-reduced-motion: no-preference) {
  .v2-burst--a { animation: v2-turn 120s linear infinite; }
  .v2-burst--b { animation: v2-turn 80s linear infinite reverse, v2-breathe 9s ease-in-out infinite alternate; }
}
@media (max-width: 768px) {
  .v2-burst--a { width: 130vmin; top: -60vmin; right: -60vmin; }
  .v2-burst--b { width: 80vmin; top: -20vmin; right: -20vmin; }
}

/* Finer arch frame: a thin polished silver edge instead of a thick band */
body.v2 .v2-arch, body.v2 .artist-approach__image { border-width: 3px; }
.v2-arch img, body.v2 .artist-approach__image img { border-radius: 999px 999px 15px 15px; }
.v2-arch::after { border-radius: 999px 999px 15px 15px; }

/* The ribbon: a clean twisting band of light lines under the last call to
   action. A pulse of light runs along it into the Start button, which lights
   up when it arrives. Anticipation, then the reward. */
.v2-wave.v2-ribbon { top: auto; bottom: 0; height: 78%; opacity: 1; filter: none; overflow: visible; }
.v2-ribbon path { fill: none; vector-effect: non-scaling-stroke; animation: none; }
.v2-ribbon__glow { stroke: url(#v2-wave-g); stroke-width: 34; stroke-linecap: round; opacity: .22; filter: blur(16px); }
.v2-ribbon__line { stroke: url(#v2-wave-g); stroke-width: 1.2; opacity: .5; }
.v2-ribbon__line:nth-child(6) { stroke-width: 1.8; opacity: .85; }
.v2-ribbon__pulse {
  stroke: #E9F7FF; stroke-width: 2.6; stroke-linecap: round; stroke-dasharray: 70 930; stroke-dashoffset: 1000; opacity: 0;
  filter: drop-shadow(0 0 6px rgba(158, 232, 255, .95)) drop-shadow(0 0 16px rgba(122, 92, 255, .8));
}
@media (prefers-reduced-motion: no-preference) {
  .v2-ribbon__lines { animation: v2-ribbon-drift 9s ease-in-out infinite alternate; }
  .v2-ribbon__pulse { animation: v2-pulse-run 5s cubic-bezier(.55, .05, .45, .95) infinite; }
  body.v2 .footer__cta-btn { animation: v2-arrive 5s ease-out infinite; }
}
@keyframes v2-ribbon-drift { to { transform: translateY(8px); } }
@keyframes v2-pulse-run {
  0% { stroke-dashoffset: 1000; opacity: 0; }
  8% { opacity: 1; }
  78% { opacity: 1; }
  88%, 100% { stroke-dashoffset: 30; opacity: 0; }
}
@keyframes v2-arrive {
  0%, 80% { box-shadow: inset 0 1.5px 0 rgba(255, 255, 255, .8), inset 0 0 0 1px rgba(255, 255, 255, .22), inset 0 -9px 16px -7px rgba(35, 25, 140, .5), 0 16px 34px -14px rgba(91, 92, 246, .8), 0 0 0 0 rgba(158, 232, 255, 0); }
  86% { box-shadow: inset 0 1.5px 0 rgba(255, 255, 255, .9), inset 0 0 0 1px rgba(255, 255, 255, .4), inset 0 -9px 16px -7px rgba(35, 25, 140, .5), 0 16px 44px -10px rgba(122, 140, 255, 1), 0 0 0 6px rgba(158, 232, 255, .35); }
  100% { box-shadow: inset 0 1.5px 0 rgba(255, 255, 255, .8), inset 0 0 0 1px rgba(255, 255, 255, .22), inset 0 -9px 16px -7px rgba(35, 25, 140, .5), 0 16px 34px -14px rgba(91, 92, 246, .8), 0 0 0 14px rgba(158, 232, 255, 0); }
}
@media (max-width: 768px) { .v2-wave.v2-ribbon { height: 34%; width: 300%; left: -150%; right: auto; bottom: 2%; } }

/* ==========================================================================
   Round 9: the top left. The two circles get their own room beside the name
   (no collision), a glass lens where they overlap, and a soft aura that
   breathes behind the whole mark. The nav Booking button gets a turning
   aurora rim, a live dot and an arrow that slides.
   ========================================================================== */
body.v2 .header__logo.v2-brand { position: relative; gap: 12px; isolation: isolate; }
body.v2 .header__logo.v2-brand::before {
  content: ''; position: absolute; z-index: -1; pointer-events: none;
  left: -34px; top: 50%; width: 230px; height: 86px; translate: 0 -50%; border-radius: 50%;
  background:
    radial-gradient(closest-side at 22% 50%, rgba(122, 92, 255, .55), transparent),
    radial-gradient(closest-side at 42% 62%, rgba(79, 178, 245, .45), transparent),
    radial-gradient(closest-side at 64% 34%, rgba(158, 232, 255, .5), transparent),
    radial-gradient(closest-side at 86% 60%, rgba(185, 168, 255, .35), transparent);
  filter: blur(16px); opacity: .7;
}
@keyframes v2-aura { to { transform: translateX(14px) scale(1.1); opacity: .7; } }
.v2-brand__orb { position: relative; display: inline-flex; flex-shrink: 0; }
.v2-brand__mark { position: static; align-self: center; width: 44px; height: 32px; margin: 0; opacity: 1; overflow: visible; filter: drop-shadow(0 4px 8px rgba(91, 92, 246, .35)); }
.v2-brand__mark circle { transform-box: view-box; }
.v2-brand__text { position: relative; z-index: 1; }
@media (max-width: 768px) {
  .v2-brand__mark { width: 38px; height: 28px; margin: 0; }
  body.v2 .header__logo.v2-brand { gap: 10px; }
  body.v2 .header__logo.v2-brand::before { left: -26px; width: 180px; height: 70px; }
}

/* Booking button: same glass as the rest, with an arrow that slides */
body.v2 .header__nav a.v2-nav__book { gap: 8px; padding: 13px 18px 13px 20px; margin-left: 12px; }
@media (hover: hover) { body.v2 .header__nav a.v2-nav__book:hover { transform: translateY(-1px); } }
.v2-nav__arrow { width: 15px; height: 15px; transition: transform .45s var(--v2-spring); }
body.v2 .header__nav a.v2-nav__book:hover .v2-nav__arrow { transform: translateX(3px); }
@media (prefers-reduced-motion: reduce) {
  body.v2 .header__logo.v2-brand::before { animation: none; }
}

/* Cleaner drips: glossy highlight down each stem */
body.v2 .v2-drip .drip-glint { fill: rgba(255, 255, 255, .75); }

/* Dark rooms: deep iridescent indigo rather than near-black */
body.v2 .v2-room, body.v2 .footer {
  background:
    radial-gradient(70% 50% at 0% 0%, rgba(122, 92, 255, .42), transparent 70%),
    radial-gradient(60% 45% at 100% 100%, rgba(79, 178, 245, .34), transparent 72%),
    radial-gradient(50% 40% at 100% 20%, rgba(185, 168, 255, .18), transparent 70%),
    radial-gradient(45% 35% at 10% 85%, rgba(158, 232, 255, .14), transparent 70%),
    linear-gradient(160deg, #1D1A4E 0%, #15163C 48%, #112244 100%);
}
body.v2 .footer { position: relative; }
body.v2 .v2-room .portfolio-item::after { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14); }

/* Drips on more words: the word itself carries the aurora color */
body.v2 .v2-word-drip {
  position: relative; display: inline-block; isolation: isolate;
  background: var(--v2-aurora-text); -webkit-background-clip: text; background-clip: text; color: transparent;
}
body.v2 .footer .v2-word-drip { background-image: linear-gradient(100deg, #C2B4FF, #93B2FF 50%, #A8EEFF); }

/* room under headlines that drip, so the drips never cross the text below */
body.v2 h2:has(.v2-word-drip) { margin-bottom: .62em; }
.v2-nowrap { white-space: nowrap; }

/* ==========================================================================
   Round 10: glass bubble buttons. Each button reads as a piece of liquid
   glass: a soft gloss cap on top, light gathering at the bottom edge,
   a bright rim, and the page showing faintly through.
   ========================================================================== */
body.v2 .hero__cta,
body.v2 .header__nav a.v2-nav__book,
body.v2 .mobile-nav a.v2-mnav__book,
body.v2 .v2-dock a.v2-dock__book,
body.v2 .footer__cta-btn {
  background:
    radial-gradient(78% 58% at 50% 2%, rgba(255, 255, 255, .7), rgba(255, 255, 255, .16) 62%, rgba(255, 255, 255, 0) 64%),
    radial-gradient(60% 75% at 50% 118%, rgba(170, 240, 255, .85), rgba(170, 240, 255, 0) 62%),
    linear-gradient(115deg, rgba(122, 92, 255, .84) 0%, rgba(91, 124, 255, .8) 50%, rgba(79, 178, 245, .84) 100%);
  border: 1px solid rgba(255, 255, 255, .7);
  text-shadow: 0 1px 1px rgba(40, 30, 140, .35);
  box-shadow:
    inset 0 1.5px 1px rgba(255, 255, 255, .95),
    inset 0 -1.5px 1px rgba(220, 248, 255, .7),
    inset 0 0 0 1px rgba(255, 255, 255, .18),
    inset 0 -12px 20px -12px rgba(190, 245, 255, .9),
    0 1px 2px rgba(40, 30, 140, .2),
    0 18px 38px -16px rgba(91, 92, 246, .75);
  -webkit-backdrop-filter: blur(16px) saturate(180%); backdrop-filter: blur(16px) saturate(180%);
}
@media (hover: hover) {
  body.v2 .hero__cta:hover, body.v2 .header__nav a.v2-nav__book:hover, body.v2 .v2-dock a.v2-dock__book:hover, body.v2 .footer__cta-btn:hover {
    box-shadow:
      inset 0 1.5px 1px #fff, inset 0 -1.5px 1px rgba(220, 248, 255, .85), inset 0 0 0 1px rgba(255, 255, 255, .25),
      inset 0 -14px 22px -12px rgba(200, 248, 255, 1), 0 1px 2px rgba(40, 30, 140, .2),
      0 24px 48px -16px rgba(91, 92, 246, .9), 0 0 0 5px rgba(158, 232, 255, .16);
  }
}
/* clear glass bubbles for the secondary buttons */
body.v2 .hero__cta-ghost,
body.v2 .section:not(.v2-room) .btn--secondary {
  background:
    radial-gradient(80% 60% at 50% 0%, rgba(255, 255, 255, .95), rgba(255, 255, 255, .35) 60%, rgba(255, 255, 255, 0) 63%),
    radial-gradient(60% 80% at 50% 120%, rgba(158, 232, 255, .55), rgba(158, 232, 255, 0) 60%),
    radial-gradient(40% 70% at 0% 50%, rgba(185, 168, 255, .3), transparent 70%),
    rgba(255, 255, 255, .34);
  border: 1px solid rgba(255, 255, 255, .95);
  box-shadow:
    inset 0 1.5px 1px #fff, inset 0 -1.5px 1px rgba(255, 255, 255, .8),
    inset 0 -10px 18px -12px rgba(122, 92, 255, .35),
    0 0 0 1px rgba(70, 80, 170, .1), 0 14px 30px -16px rgba(60, 70, 170, .45);
  -webkit-backdrop-filter: blur(14px) saturate(190%); backdrop-filter: blur(14px) saturate(190%);
}
body.v2 .v2-room .btn--secondary {
  background:
    radial-gradient(80% 60% at 50% 0%, rgba(255, 255, 255, .34), rgba(255, 255, 255, .06) 60%, rgba(255, 255, 255, 0) 63%),
    radial-gradient(60% 80% at 50% 120%, rgba(158, 232, 255, .4), transparent 60%),
    rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .4);
  box-shadow: inset 0 1.5px 1px rgba(255, 255, 255, .6), inset 0 -1.5px 1px rgba(200, 245, 255, .35), 0 16px 32px -18px rgba(120, 140, 255, .7);
}

/* ==========================================================================
   Flow and snap: the page settles gently on each chapter, and each one
   glides up into place as you arrive.
   ========================================================================== */
html:has(body.v2) { scroll-padding-top: 96px; }
@media (prefers-reduced-motion: no-preference) {
  html:has(body.v2) { scroll-snap-type: y proximity; }
  body.v2 .hero, body.v2 [data-chapter], body.v2 .footer { scroll-snap-align: start; }
  @supports (animation-timeline: view()) {
    body.v2 .v2-room, body.v2 .section--alt, body.v2 .footer {
      animation: v2-card-in linear both; animation-timeline: view(); animation-range: entry 0% entry 75%;
    }
    body.v2 .v2-pets > .container, body.v2 .v2-reviews > .container, body.v2 .v2-process > .container {
      animation: v2-glide linear both; animation-timeline: view(); animation-range: entry 5% cover 32%;
    }
    body.v2 .reveal { opacity: 1; transform: none; transition: none; }
  }
}
@keyframes v2-card-in { from { transform: translateY(70px) scale(.94); opacity: .35; } to { transform: none; opacity: 1; } }
@keyframes v2-glide { from { transform: translateY(56px); opacity: 0; filter: blur(6px); } to { transform: none; opacity: 1; filter: none; } }

/* ==========================================================================
   Round 11: edit pass. Four signatures carry the page (the drip, the two
   circles, glass buttons, the arch); everything else steps back.
   ========================================================================== */
/* no sheen sweep on buttons: the pointer light and the press are enough */
body.v2 .hero__cta::after, body.v2 .header__nav a.v2-nav__book::after,
body.v2 .v2-dock a.v2-dock__book::after, body.v2 .footer__cta-btn::after { content: none; }

/* Reviews: glass cards, like the buttons; the featured voice opens with the circles */
body.v2 .reviews-grid > div {
  background: linear-gradient(180deg, rgba(255, 255, 255, .78), rgba(255, 255, 255, .5));
  border: 1px solid rgba(255, 255, 255, .95);
  box-shadow: inset 0 1.5px 0 #fff, 0 0 0 1px rgba(70, 80, 170, .07), 0 24px 50px -34px rgba(60, 70, 170, .4);
  -webkit-backdrop-filter: blur(16px) saturate(170%); backdrop-filter: blur(16px) saturate(170%);
}
body.v2 .reviews-grid > div > div:first-child { font-size: 13px !important; letter-spacing: 3px !important; margin-bottom: 18px !important; }
body.v2 .reviews-grid > div > div:nth-of-type(2) { width: 28px !important; height: 2px !important; border-radius: 2px; opacity: 1 !important; background: var(--v2-aurora) !important; }
.v2-quote-mark { display: none; }
@media (min-width: 769px) {
  body.v2 .reviews-grid > div:nth-child(2) {
    border-color: rgba(255, 255, 255, .95);
    background:
      radial-gradient(70% 60% at 0% 0%, rgba(122, 92, 255, .12), transparent 70%),
      radial-gradient(60% 60% at 100% 100%, rgba(79, 178, 245, .14), transparent 70%),
      linear-gradient(180deg, rgba(255, 255, 255, .85), rgba(255, 255, 255, .55));
  }
  body.v2 .reviews-grid > div:nth-child(2) > p:first-of-type {
    font-family: var(--v2-body); font-weight: 500; font-size: 21px !important; line-height: 1.6 !important; letter-spacing: -0.005em;
  }
  body.v2 .reviews-grid > div:nth-child(2) .v2-quote-mark { display: block; width: 44px; height: 32px; margin: 0 0 22px; }
  body.v2 .reviews-grid > div:nth-child(2) .v2-quote-mark circle:last-child { mix-blend-mode: multiply; }
  body.v2 .reviews-grid > div:nth-child(2) > div:first-of-type { display: none; }
}

/* FAQ: the toggles become small glass bubbles */
body.v2 .faq-icon {
  background: radial-gradient(80% 60% at 50% 0%, #fff, rgba(255, 255, 255, .4) 62%, rgba(255, 255, 255, 0) 65%), radial-gradient(60% 80% at 50% 120%, rgba(158, 232, 255, .6), transparent 60%), rgba(255, 255, 255, .5);
  box-shadow: inset 0 1px 0 #fff, 0 0 0 1px rgba(70, 80, 170, .12), 0 6px 14px -8px rgba(60, 70, 170, .5);
}
body.v2 .faq-item.active .faq-icon {
  background: radial-gradient(78% 58% at 50% 2%, rgba(255, 255, 255, .7), rgba(255, 255, 255, .16) 62%, rgba(255, 255, 255, 0) 64%), linear-gradient(115deg, #7A5CFF, #5B7CFF 50%, #4FB2F5);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 6px 14px -6px rgba(91, 92, 246, .7);
}

/* Signature: the two circles grow large and see-through, sitting behind
   the name so they overlap it without covering a letter */
.v2-sign { isolation: isolate; overflow: visible; overflow-x: clip; }
.v2-sign__mark {
  position: absolute; z-index: 0; left: 50%; top: 44%; width: clamp(200px, 27vw, 420px); height: auto; margin: 0;
  translate: -50% -50%; opacity: .26; filter: blur(1px); pointer-events: none;
}
.v2-sign__name { position: relative; z-index: 1; filter: drop-shadow(0 2px 14px rgba(10, 12, 40, .55)); }
@media (max-width: 600px) { .v2-sign__mark { margin: 0; top: 40%; width: min(56vw, 240px); } }

/* ==========================================================================
   Round 13: the circles step apart on a diagonal everywhere (a stagger,
   less overlap), and the "good to know" points sit in an even grid.
   ========================================================================== */
body.v2 .v2-note::before {
  width: 24px; height: 18px; top: 3px;
  background:
    radial-gradient(circle at 7px 6.5px, #7A5CFF 0 6px, transparent 6.5px),
    radial-gradient(circle at 16.5px 11.5px, rgba(79, 178, 245, .92) 0 6px, transparent 6.5px);
}
body.v2 .hero__proof span::before {
  width: 11px; height: 9px; border-radius: 0;
  background:
    radial-gradient(circle at 3px 3px, #7A5CFF 0 2.6px, transparent 3px),
    radial-gradient(circle at 7.6px 6px, rgba(79, 178, 245, .92) 0 2.6px, transparent 3px);
}
.v2-ease { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; max-width: 520px; }
.v2-ease li {
  display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 18px; line-height: 1.3;
  font-size: 14.5px; color: #E2E5F5;
  background: linear-gradient(180deg, rgba(255, 255, 255, .09), rgba(255, 255, 255, .03));
  border: 1px solid rgba(255, 255, 255, .14); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12);
}
.v2-ease li::before {
  width: 19px; height: 15px;
  background:
    radial-gradient(circle at 5.5px 5.5px, #8F78FF 0 5px, transparent 5.5px),
    radial-gradient(circle at 13.5px 9.5px, rgba(110, 196, 255, .95) 0 5px, transparent 5.5px);
}
@media (max-width: 600px) { .v2-ease li { padding: 13px 14px; gap: 10px; font-size: 14px; } }

/* ==========================================================================
   Round 14: motion craft. Headlines rise out of a mask word by word, images
   fill their frames like liquid, the hero drifts with the scroll, the main
   buttons lean toward the pointer, and a glass "View" lens follows over work.
   ========================================================================== */
.v2-w { display: inline-block; clip-path: inset(-.25em -.12em -.22em -.12em); }
.v2-wi { display: inline-block; }
@media (prefers-reduced-motion: no-preference) {
  html.v2-js body.v2 .hero__content > .hero__headline { animation: none; }
  html.v2-js body.v2 .hero__headline:not(.v2-split) { opacity: 0; animation: v2-failsafe 0s 2.5s forwards; }
  .v2-split .v2-wi { translate: 0 112%; transition: translate 1.05s cubic-bezier(.19, 1, .22, 1) calc(var(--i, 0) * 65ms + .05s); }
  .v2-split.is-in .v2-wi { translate: 0 0; }
  .v2-split .v2-wi-drip { opacity: 0; translate: 0 .35em; filter: blur(10px);
    transition: opacity .9s var(--v2-ease) calc(var(--i, 0) * 65ms + .1s), translate 1.1s cubic-bezier(.19, 1, .22, 1) calc(var(--i, 0) * 65ms + .1s), filter .9s var(--v2-ease) calc(var(--i, 0) * 65ms + .1s); }
  .v2-split.is-in .v2-wi-drip { opacity: 1; translate: 0 0; filter: none; }

  /* frames fill with the image from the bottom, like liquid rising */
  html.v2-js body.v2 .v2-arch img, html.v2-js body.v2 .artist-approach__image img {
    clip-path: inset(100% 0 0 0); scale: 1.18;
    transition: clip-path 1.25s cubic-bezier(.77, 0, .18, 1) .1s, scale 1.9s cubic-bezier(.19, 1, .22, 1) .1s, transform 1s var(--v2-ease);
  }
  html.v2-js body.v2 .is-in.v2-arch img, html.v2-js body.v2 .is-in.artist-approach__image img { clip-path: inset(0 0 0 0); scale: 1; }
  html.v2-js body.v2 .hero .v2-arch img { transition-delay: .45s, .45s, 0s; }

  /* gallery pieces unveil in sequence */
  body.v2 .v2-room.reveal .portfolio-item img { clip-path: inset(100% 0 0 0 round 18px); scale: 1.14;
    transition: clip-path 1.1s cubic-bezier(.77, 0, .18, 1), scale 1.7s cubic-bezier(.19, 1, .22, 1), transform .9s var(--v2-ease), filter .6s var(--v2-ease); }
  body.v2 .v2-room.reveal.visible .portfolio-item img { clip-path: inset(0 0 0 0 round 18px); scale: 1; }
  body.v2 .v2-room.reveal.visible .portfolio-item:nth-child(2) img { transition-delay: .09s, .09s, 0s, 0s; }
  body.v2 .v2-room.reveal.visible .portfolio-item:nth-child(3) img { transition-delay: .18s, .18s, 0s, 0s; }
  body.v2 .v2-room.reveal.visible .portfolio-item:nth-child(4) img { transition-delay: .27s, .27s, 0s, 0s; }
  body.v2 .v2-room.reveal.visible .portfolio-item:nth-child(5) img { transition-delay: .36s, .36s, 0s, 0s; }
  body.v2 .v2-room.reveal.visible .portfolio-item:nth-child(6) img { transition-delay: .45s, .45s, 0s, 0s; }
  body.v2 .v2-room.reveal.visible .portfolio-item:nth-child(7) img { transition-delay: .54s, .54s, 0s, 0s; }

  /* section labels: the short line draws itself */
  body.v2 .v2-label::before { transform-origin: left center; scale: 0 1; transition: scale .9s cubic-bezier(.19, 1, .22, 1) .15s; }
  body.v2 .visible .v2-label::before, body.v2 .v2-label:has(+ .v2-split.is-in)::before { scale: 1 1; }

  /* footer signature wipes in left to right, then the drips fall */
  html.v2-js .v2-sign__name { clip-path: inset(-30% 100% -140% -6%); transition: clip-path 1.5s cubic-bezier(.77, 0, .18, 1); }
  html.v2-js .v2-sign.is-in .v2-sign__name { clip-path: inset(-30% -6% -140% -6%); }

  /* main buttons ease back after leaning toward the pointer */
  body.v2 .hero__cta, body.v2 .footer__cta-btn, body.v2 .header__nav a.v2-nav__book { transition: transform .5s var(--v2-spring), box-shadow .35s var(--v2-ease), translate .6s var(--v2-spring); }

  /* scroll-linked depth in the hero */
  @supports (animation-timeline: scroll()) {
    body.v2 .hero__content { animation: v2-hero-drift linear both; animation-timeline: scroll(root); animation-range: 0 85vh; }
    body.v2 .v2-disc { animation: v2-disc-drift linear both; animation-timeline: scroll(root); animation-range: 0 100vh; }
  }
}
@keyframes v2-failsafe { to { opacity: 1; } }
@keyframes v2-hero-drift { to { translate: 0 -70px; opacity: .25; } }
@keyframes v2-disc-drift { to { translate: 0 -120px; scale: 1.15; } }

/* glass "View" lens that follows the pointer over the work */
.v2-cursor {
  position: fixed; left: 0; top: 0; z-index: 120; width: 0; height: 0; pointer-events: none;
}
.v2-cursor span {
  position: absolute; left: -44px; top: -44px; width: 88px; height: 88px; border-radius: 50%;
  display: grid; place-items: center; font: 600 13px/1 var(--v2-body); letter-spacing: .06em; color: #fff;
  background:
    radial-gradient(80% 60% at 50% 0%, rgba(255, 255, 255, .55), rgba(255, 255, 255, .1) 60%, rgba(255, 255, 255, 0) 63%),
    radial-gradient(60% 80% at 50% 120%, rgba(158, 232, 255, .55), transparent 60%),
    rgba(91, 92, 246, .28);
  border: 1px solid rgba(255, 255, 255, .6);
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, .8), 0 14px 30px -12px rgba(20, 20, 60, .5);
  -webkit-backdrop-filter: blur(8px) saturate(180%); backdrop-filter: blur(8px) saturate(180%);
  scale: .2; opacity: 0; transition: scale .45s var(--v2-spring), opacity .3s var(--v2-ease);
}
.v2-cursor.is-on span { scale: 1; opacity: 1; }
@media (hover: hover) and (pointer: fine) { body.v2 .v2-room .portfolio-item, body.v2 .v2-arch { cursor: none; } }