/*
 * OTEO unified production skin.
 * One quiet, premium visual system across every public route. Content and
 * interaction contracts stay in the page sources; this layer owns presentation.
 */

:root {
  --bg: #08090b;
  --cream: #f1ede4;
  --ink: #f1ede4;
  --text: #f1ede4;
  --muted: #9b9da3;
  --muted-cream: #5e5c58;
  --gold: #c8aa6e;
  --gold-dark: #8f7137;
  --blue: #3f5fd7;
  --blue-lt: #9aacf8;
  --surface: #0f1115;
  --surface-2: #15181e;
  --line: rgba(241, 237, 228, .13);
  --hair: rgba(200, 170, 110, .28);
  --radius: 10px;
  --maxw: 1360px;
  --section-y: clamp(92px, 11vw, 168px);
  --display: clamp(54px, 8vw, 122px);
  --ease: cubic-bezier(.2, .75, .2, 1);
}

html { background: var(--bg); }
body {
  background:
    radial-gradient(75% 34% at 88% -8%, rgba(63, 95, 215, .18), transparent 68%),
    var(--bg) !important;
  color: var(--ink);
}
body::after { opacity: .025 !important; mix-blend-mode: soft-light; }

/* One typographic voice: precise grotesk structure + one editorial italic. */
h1, h2, h3, .serif,
.about-title, .contact-hero-title, .section-title, .sound-head,
.contact-statement, .showcase-statement {
  font-family: var(--sans);
  font-weight: 650;
  letter-spacing: -.055em;
}
h1 em, h2 em, .contact-statement em, .showcase-statement em,
.about-title em, .contact-hero-title em {
  font-family: var(--sans);
  font-style: italic;
  font-weight: 350;
  color: var(--gold);
  letter-spacing: -.035em;
}
.wrap { max-width: var(--maxw); }
.section { padding-block: var(--section-y); }
.eyebrow,
.page-booking .svc-hero .eyebrow,
.page-calendar .agenda-hero .eyebrow {
  color: var(--gold) !important;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .24em;
}
.eyebrow::before { background: var(--gold) !important; }

/* The shell never changes personality between routes. */
.site-header,
.home-next .site-header {
  height: 76px;
  background: rgba(8, 9, 11, .82);
  border-bottom: 1px solid rgba(241, 237, 228, .1);
  -webkit-backdrop-filter: blur(18px) saturate(1.15);
  backdrop-filter: blur(18px) saturate(1.15);
}
.site-header.scrolled,
.site-header.on-light.scrolled,
.home-next .site-header.scrolled {
  background: rgba(8, 9, 11, .93);
  border-bottom-color: rgba(241, 237, 228, .14);
}
.site-header .header-inner { max-width: 1480px; }
.brand,
.home-next .brand,
.site-header.on-light .brand {
  position: relative;
  color: var(--cream);
  font-family: var(--sans) !important;
  font-size: 21px !important;
  font-weight: 850 !important;
  letter-spacing: -.055em !important;
}
.brand::after {
  content: "";
  position: absolute;
  top: 2px;
  right: -7px;
  width: 4px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--gold);
}
.header-nav { gap: 22px; }
.nav-links { gap: clamp(20px, 2.2vw, 34px); }
.nav-links a,
.home-next .nav-links a,
.site-header.on-light .nav-links a {
  color: rgba(241, 237, 228, .62);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: .17em;
}
.nav-links a:hover,
.nav-links a[aria-current="page"],
.site-header.on-light .nav-links a:hover { color: var(--cream); }
.nav-links a::after,
.home-next .nav-links a::after { background: var(--gold); }
.btn,
.hero-cta,
.v-cta,
.book,
.sync .cta,
.page-foowr .btn,
.neo-button {
  border-radius: 999px !important;
  font-family: var(--sans) !important;
  font-weight: 700;
  letter-spacing: .11em;
}
.header-cta,
.home-next .header-cta,
.site-header.on-light .header-cta {
  min-height: 42px;
  padding: 11px 18px;
  background: var(--cream);
  color: var(--bg);
  border: 1px solid var(--cream);
}
.header-cta:hover,
.home-next .header-cta:hover,
.site-header.on-light .header-cta:hover {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--bg);
}
.nav-toggle,
.site-header.on-light .nav-toggle {
  border-color: rgba(241, 237, 228, .18);
  border-radius: 999px;
}
.nav-toggle-bar,
.site-header.on-light .nav-toggle-bar { background: var(--cream); }

/* HOME — reduce template spectacle; make OTEO and real photography the event. */
.home-next {
  --neo-violet: #10141f;
  --neo-cobalt: #3f5fd7;
  --neo-orange: #c8aa6e;
  --neo-lime: #c8aa6e;
  --neo-bone: #f1ede4;
  --neo-black: #08090b;
  background: var(--bg);
}
.neo-hero {
  min-height: 100svh;
  background: #08090b;
  border-bottom: 1px solid var(--line);
}
.neo-hero::after {
  inset: 62% 0 0;
  background: linear-gradient(180deg, transparent, var(--bg) 96%);
}
.neo-hero-media,
.neo-hero-scrim {
  position: absolute;
  inset: 0;
}
.neo-hero-media { z-index: 0; overflow: hidden; background: #08090b url("./img/oteo-hero-poster-2560.jpg") center / cover no-repeat; }
.neo-hero-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 46%;
  transform: scale(1.035);
  filter: saturate(.82) contrast(1.16) brightness(.72);
}
.neo-hero-scrim {
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(8, 9, 11, .86) 0%, rgba(8, 9, 11, .42) 44%, rgba(8, 9, 11, .18) 72%, rgba(8, 9, 11, .52) 100%),
    linear-gradient(180deg, rgba(8, 9, 11, .58) 0%, transparent 32%, rgba(8, 9, 11, .2) 60%, rgba(8, 9, 11, .9) 100%);
}
.neo-hero-grid {
  z-index: 2;
  opacity: .12;
  background-size: 86px 86px;
  -webkit-mask-image: linear-gradient(90deg, black, transparent 82%);
  mask-image: linear-gradient(90deg, black, transparent 82%);
}
.neo-hero-name {
  z-index: 3;
  left: var(--gutter);
  top: 33%;
  color: rgba(241, 237, 228, .08);
  -webkit-text-stroke: 1.5px rgba(241, 237, 228, .72);
  font-size: clamp(150px, 23vw, 430px);
  text-shadow: 0 24px 90px rgba(0, 0, 0, .52);
}
.neo-hero-copy { z-index: 6; max-width: 780px; }
.neo-kicker span { color: var(--gold); }
.neo-hero-line { max-width: 13ch; font-size: clamp(42px, 5.4vw, 88px); font-weight: 520; }
.neo-hero-line em { color: var(--gold); }
.neo-button-solid { background: var(--gold); border-color: var(--gold); }
.neo-button-solid:hover { background: var(--cream); border-color: var(--cream); }
.neo-button-clear { background: rgba(8, 9, 11, .34); }
.neo-hero-index { z-index: 7; align-items: center; }
.neo-media-toggle {
  appearance: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 7px 0;
  border: 0;
  color: rgba(241, 237, 228, .82);
  background: transparent;
  font: inherit;
  letter-spacing: inherit;
  text-transform: uppercase;
  cursor: pointer;
}
.neo-media-toggle i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 0 4px rgba(200, 170, 110, .16);
}
.neo-media-toggle[aria-pressed="true"] i { background: rgba(241, 237, 228, .52); box-shadow: none; }
.neo-media-toggle:focus-visible { outline: 2px solid var(--gold); outline-offset: 5px; }

.neo-proof {
  grid-template-columns: 1fr auto;
  align-items: stretch;
  background: #0e1014;
  color: var(--cream);
  border-bottom-color: var(--line);
}
.neo-proof-summary {
  display: flex;
  align-items: center;
  gap: clamp(16px, 3vw, 46px);
  margin: 0;
  padding: 24px var(--gutter);
  color: var(--muted);
  font: 600 clamp(12px, 1.1vw, 15px)/1.4 var(--sans);
  letter-spacing: .015em;
}
.neo-proof-summary strong { color: var(--cream); font-weight: 750; }
.neo-proof-summary span { position: relative; }
.neo-proof-summary span::before {
  content: "";
  position: absolute;
  width: 3px;
  height: 3px;
  left: calc(clamp(8px, 1.5vw, 23px) * -1);
  top: 50%;
  border-radius: 50%;
  background: var(--gold);
}
.neo-proof-label, .neo-rooms-label, .neo-resume-tag { color: var(--muted); }
.neo-proof-link { background: var(--blue); color: white; }
.neo-proof-link:hover { background: var(--gold); color: var(--bg); }

.neo-work {
  background: var(--cream);
  color: var(--bg);
  border-bottom: 1px solid rgba(8, 9, 11, .16);
}
.neo-work .neo-section-id { color: var(--gold-dark); }
.neo-work-intro h2 em { color: var(--blue); }
.neo-work-deck { color: #5e5c58; }
.neo-frame { border-radius: 4px; box-shadow: 0 30px 70px rgba(13, 18, 35, .2); }
.neo-frame img { filter: saturate(.82) contrast(1.06); }
.neo-collage-word { color: var(--blue); mix-blend-mode: normal; opacity: .92; }

.neo-statement { background: #0b0d11; }
.neo-statement-copy {
  background: radial-gradient(circle at 100% 0, rgba(63, 95, 215, .24), transparent 52%);
}
.neo-statement-copy h2 em { color: var(--gold); }
.neo-statement-image img { filter: grayscale(.2) saturate(.78) contrast(1.12); }

.neo-resume { background: var(--cream); color: var(--bg); }
.neo-resume .neo-section-id,
.neo-resume-head h2 em,
.neo-resume-num,
.neo-rooms-track i { color: var(--blue); }
.neo-resume-head > p:last-child,
.neo-resume-current div > p:last-child { color: #5e5c58; }
.neo-button-dark { background: var(--bg); border-color: var(--bg); }
.neo-button-dark:hover { background: var(--blue); border-color: var(--blue); }

.neo-quote { background: #18265a; color: var(--cream); }
.neo-quote .neo-section-id { color: var(--gold); }
.neo-quote figcaption { border-top-color: rgba(241, 237, 228, .28); }
.neo-services { background: var(--bg); }
.neo-services-head h2 em,
.neo-service-num { color: var(--gold); }
.neo-service:hover { color: var(--gold); }
.neo-close { background: #0a0c11; }
.neo-close::after { background: linear-gradient(90deg, rgba(8, 9, 11, .92), rgba(8, 9, 11, .18) 70%, rgba(8, 9, 11, .58)); }
.neo-close-media img { mix-blend-mode: normal; filter: grayscale(.15) saturate(.74) contrast(1.14); opacity: .62; }
.neo-close-name { color: rgba(241, 237, 228, .075); }

/* Shared inner-route opening composition. */
.page-booking > .svc-hero,
.page-residencies > .res-hero,
.page-calendar > .agenda-hero,
.page-foowr > .label-hero,
.page-about .about-hero,
.page-rentals .rentals-hero,
.page-contact .contact-hero {
  position: relative;
  isolation: isolate;
  min-height: 74svh;
  padding-top: clamp(142px, 17vh, 196px);
  padding-bottom: clamp(70px, 9vw, 120px);
  background:
    linear-gradient(90deg, rgba(8, 9, 11, .98) 0%, rgba(8, 9, 11, .88) 48%, rgba(8, 9, 11, .34) 100%),
    radial-gradient(70% 92% at 84% 48%, rgba(63, 95, 215, .32), transparent 68%),
    #090a0d !important;
  border-bottom: 1px solid var(--line) !important;
  overflow: hidden;
}
.page-booking > .svc-hero h1,
.page-residencies > .res-hero h1,
.page-calendar > .agenda-hero h1,
.page-foowr > .label-hero h1,
.page-about .about-title,
.page-rentals .about-title,
.page-contact .contact-hero-title {
  max-width: 9ch;
  margin: .18em 0 .32em;
  color: var(--cream);
  font-family: var(--sans);
  font-size: clamp(66px, 9.4vw, 148px);
  font-weight: 680;
  line-height: .86;
  letter-spacing: -.075em;
}
.page-booking > .svc-hero h1 em,
.page-residencies > .res-hero h1 em,
.page-calendar > .agenda-hero h1 em,
.page-foowr > .label-hero h1 em { color: var(--gold) !important; }
.page-booking > .svc-hero .lead,
.page-residencies > .res-hero .lead,
.page-calendar > .agenda-hero .lead,
.page-foowr > .label-hero .lead,
.page-about .section-deck,
.page-rentals .section-deck,
.page-contact .section-deck {
  max-width: 580px;
  color: rgba(241, 237, 228, .68) !important;
  font-size: 16px;
  line-height: 1.65;
}

/* Booking hero: a real portrait, not a synthetic gradient disc. */
.page-booking > .svc-hero::before {
  width: min(54vw, 780px);
  right: -3vw;
  top: 50%;
  border: 1px solid rgba(200, 170, 110, .3);
  background: radial-gradient(circle, rgba(63, 95, 215, .24), transparent 66%);
  box-shadow: none;
}
.page-booking > .svc-hero::after {
  inset: 8% -2% 0 47%;
  background: url('./img/contact-hero-alec.jpg') right bottom / contain no-repeat;
  mix-blend-mode: normal;
  filter: grayscale(.2) saturate(.72) contrast(1.12);
  opacity: .56;
  /* Left fade + top fade (feathers the contained photo's hard top edge into the glow, ~42.5% down) */
  -webkit-mask-image: linear-gradient(90deg, transparent, black 32%), linear-gradient(180deg, transparent 41%, black 52%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent, black 32%), linear-gradient(180deg, transparent 41%, black 52%);
  mask-composite: intersect;
}
.page-residencies > .res-hero::after {
  inset: 0 0 0 48%;
  opacity: .5;
  filter: grayscale(.3) saturate(.7) contrast(1.12);
  -webkit-mask-image: linear-gradient(90deg, transparent, black 32%);
  mask-image: linear-gradient(90deg, transparent, black 32%);
}
.page-calendar > .agenda-hero::after,
.page-foowr > .label-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: min(48vw, 680px);
  aspect-ratio: 1;
  right: -10vw;
  top: 50%;
  translate: 0 -50%;
  border: 1px solid rgba(200, 170, 110, .24);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(63, 95, 215, .28), transparent 68%);
}

/* Shared content rhythm and surfaces. */
.page-booking main,
.page-residencies main,
.page-calendar main,
.page-foowr main { padding-top: 0; }
.page-booking .sec,
.page-foowr .band { padding-block: clamp(76px, 9vw, 132px); }
.page-booking .sec + .sec,
.page-foowr .band { border-top-color: var(--line); }
.page-booking .sec > .head,
.page-booking .eqp-console h2,
.page-foowr .band .head,
.page-calendar .sync .h,
.page-residencies .past-title,
.page-residencies .close-cta h3 {
  color: var(--cream);
  font-family: var(--sans);
  font-size: clamp(38px, 5.4vw, 72px);
  font-weight: 650;
  line-height: .96;
  letter-spacing: -.055em;
}
.page-booking .sec > .sub,
.page-booking .card p,
.page-booking .eqp-meta .spec,
.page-foowr .band p,
.page-residencies .v-body .desc,
.page-residencies .past-deck,
.page-calendar .slot .desc,
.page-calendar .sync .txt p { color: var(--muted); }

.page-booking .card,
.page-booking .eqp-card,
.page-booking .pkg-card,
.page-rentals .gear-card,
.page-residencies .venue,
.page-calendar .slot,
.page-foowr .demo,
.contact-form {
  border: 1px solid var(--line) !important;
  border-radius: var(--radius) !important;
  background: linear-gradient(145deg, rgba(21, 24, 30, .92), rgba(12, 14, 18, .96)) !important;
  box-shadow: none !important;
}
.page-booking .card:hover,
.page-booking .eqp-card:hover,
.page-booking .pkg-card:hover,
.page-rentals .gear-card:hover,
.page-calendar .slot:hover {
  border-color: rgba(200, 170, 110, .56) !important;
  transform: translateY(-4px);
  box-shadow: 0 22px 50px rgba(0, 0, 0, .24) !important;
}

/* Inventory is proof, not decoration: never let delayed reveal timing hide it. */
.page-booking .reveal-ready .eqp-card,
.page-booking .reveal-ready .pkg-card {
  opacity: 1 !important;
  transform: none;
}
.page-booking .reveal-ready .eqp-card:hover,
.page-booking .reveal-ready .pkg-card:hover { transform: translateY(-4px); }

.page-booking .svc-grid { grid-template-columns: repeat(3, 1fr); gap: 16px; }
.page-booking .card { min-height: 290px; padding: 30px; }
.page-booking .card .n,
.page-booking .eqp-subhead span,
.page-booking .pkg-card .tag,
.page-residencies .v-body .kicker,
.page-calendar .slot .idx,
.page-foowr .band .kicker { color: var(--gold) !important; }
.page-booking .card h3,
.page-booking .eqp-meta h3,
.page-booking .pkg-card h3,
.page-rentals .gear-name,
.page-calendar .slot .venue,
.page-residencies .v-body h2 {
  color: var(--cream);
  font-family: var(--sans);
  font-weight: 620;
  letter-spacing: -.04em;
}
.page-booking .eqp-grid { gap: 16px; }
/* Service index: editorial left-align + hero-style "— NN" eyebrow (was centered identical cards) */
.page-booking .svc-grid .card { text-align: left; }
.page-booking .svc-grid .card .n {
  display: flex;
  align-items: center;
  gap: 12px;
  justify-content: flex-start;
  font-family: var(--serif);
  font-size: 15px;
  letter-spacing: .04em;
  color: var(--gold);
  margin-bottom: 18px;
}
.page-booking .svc-grid .card .n::before {
  content: "";
  flex: 0 0 auto;
  width: 26px;
  height: 1px;
  background: var(--gold);
  opacity: .55;
}
.page-booking .svc-grid .card-cta { justify-content: flex-start; }
.page-booking .eqp-stage,
.page-rentals .gear-img {
  background:
    radial-gradient(56% 60% at 50% 45%, #f7f9fc 0%, rgba(247, 249, 252, 0) 70%),
    linear-gradient(152deg, #e6eaf2 4%, #c0c7d8 96%) !important;
}
/* Rig packages (relocated from Services to Rentals) */
.page-rentals .gear-group + .gear-group .pkg-deck,
.page-rentals .pkg-deck { color: var(--muted); font-size: 14px; line-height: 1.6; max-width: 620px; margin-top: 6px; }
.page-rentals .pkg-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 22px; }
.page-rentals .pkg-card {
  border: 1px solid var(--line); border-radius: 16px; padding: 22px 22px 20px;
  background: linear-gradient(180deg, rgba(63, 95, 215, .07), rgba(255, 255, 255, .008));
  display: flex; flex-direction: column; transition: border-color .3s ease, transform .3s ease;
}
.page-rentals .pkg-card:hover { border-color: rgba(200, 170, 110, .5); transform: translateY(-2px); }
.page-rentals .pkg-card .tag { font-family: var(--sans); font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: var(--blue-lt); opacity: .85; }
.page-rentals .pkg-card h3 { font-family: var(--sans); font-size: 22px; font-weight: 500; margin: 8px 0 6px; color: var(--cream); letter-spacing: -.01em; }
.page-rentals .pkg-card .for { color: var(--muted); font-size: 13px; line-height: 1.5; margin-bottom: 12px; }
.page-rentals .pkg-card ul { list-style: none; margin: 0 0 16px; padding: 0; flex: 1; }
.page-rentals .pkg-card li { color: var(--text); font-size: 13px; line-height: 1.8; }
.page-rentals .pkg-card li::before { content: "—"; color: var(--gold); margin-right: 8px; }
.page-rentals .pkg-req { display: inline-block; margin-top: auto; font-family: var(--sans); font-size: 10px; letter-spacing: .18em; text-transform: uppercase; color: var(--gold); text-decoration: none; }
.page-rentals .pkg-req:hover { text-decoration: underline; }
@media (max-width: 960px) { .page-rentals .pkg-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .page-rentals .pkg-grid { grid-template-columns: 1fr; } }
.page-booking .eqp-stage::before,
.page-booking .eqp-stage::after { opacity: .035; }
.page-booking .eqp-meta { padding: 22px 22px 24px; }
.page-booking .eqp-meta .brand { color: var(--gold) !important; }
.page-booking .eqp-trust { border-color: var(--line); color: var(--muted); }
.page-booking .avail-bar,
.page-calendar .sync {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(63, 95, 215, .09) !important;
}
.page-booking .avail-bar button,
.page-booking #oteo-booking-submit,
.page-foowr .demo-form button,
.page-calendar .book,
.page-residencies .v-cta.solid {
  background: var(--gold) !important;
  border-color: var(--gold) !important;
  color: var(--bg) !important;
}
.page-booking .pkg-grid { gap: 16px; }
.page-booking .book-sec { padding-block: clamp(88px, 10vw, 144px); }
.page-booking .book-panel {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: linear-gradient(145deg, rgba(63, 95, 215, .12), rgba(15, 17, 21, .98));
  padding: clamp(28px, 5vw, 64px);
}
.page-booking .book-panel .intro h2 { font-family: var(--sans); font-weight: 650; letter-spacing: -.055em; }
.page-booking #oteo-booking-form input,
.page-booking #oteo-booking-form select,
.page-booking #oteo-booking-form textarea,
.page-foowr .demo-form input,
.page-foowr .demo-form textarea {
  border-radius: 6px;
  background: rgba(0, 0, 0, .3);
  border-color: var(--line);
}

/* Résumé: large real imagery, clear evidence hierarchy. */
.page-residencies .venues { padding-top: clamp(50px, 7vw, 94px); }
.page-residencies .venue {
  gap: clamp(32px, 6vw, 88px);
  margin-bottom: 24px;
  padding: clamp(24px, 4vw, 46px);
}
.page-residencies .venue:first-child { padding-top: clamp(24px, 4vw, 46px); }
.page-residencies .v-media { border-radius: 6px !important; box-shadow: none; }
.page-residencies .v-media img { filter: grayscale(.1) saturate(.84) contrast(1.08); }
.page-residencies .v-media .badge { background: var(--gold) !important; color: var(--bg) !important; }
.page-residencies .v-body h2 { font-size: clamp(36px, 5vw, 68px); }
.page-residencies .v-body .nights { color: var(--gold); }
.page-residencies .more-res {
  padding-block: clamp(72px, 9vw, 118px);
  border-top: 1px solid var(--line);
}
.page-residencies .mr-item { border-bottom-color: var(--line); }
.page-residencies .mr-name { color: var(--cream); }

/* Agenda: one current truth, presented like a premium event card. */
.page-calendar .roster { padding-block: clamp(58px, 8vw, 104px); }
.page-calendar .slot { min-height: 320px; }
.page-calendar .slot .ph { border-right-color: var(--line); filter: grayscale(.1) saturate(.82) contrast(1.1); }
.page-calendar .slot .venue { font-size: clamp(30px, 4vw, 50px); }
.page-calendar .slot .venue .tag { color: var(--gold); border-color: rgba(200, 170, 110, .4); }
.page-calendar .sync { margin-bottom: clamp(72px, 9vw, 118px); }

/* FOOWR belongs to the same universe; the embedded player is supporting proof. */
.page-foowr .label-hero .wrap { gap: clamp(42px, 7vw, 96px); }
.page-foowr .label-hero h1 { font-size: clamp(78px, 13vw, 190px); }
.page-foowr .player-wrap { border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: var(--surface); }
.page-foowr .band-split { gap: clamp(40px, 7vw, 96px); }
.page-foowr .band-photo img,
.page-foowr .photo-strip img { border-radius: 6px; border-color: var(--line); filter: grayscale(.12) saturate(.82) contrast(1.08); }
.page-foowr .demo { padding: clamp(26px, 4vw, 48px); }

/* About, contact, rentals share the same editorial components. */
.page-about .about-hero-media { border-radius: 6px; border-color: var(--line); }
.page-about .about-hero-media img { filter: grayscale(.18) saturate(.76) contrast(1.1); }
.page-about .principle { border-top-color: var(--hair); }
.page-about .principle-num { color: var(--gold); }
.page-about .principle-name,
.page-about .room-name,
.page-about .sound-head { font-family: var(--sans); font-weight: 620; letter-spacing: -.04em; }
.page-contact .contact-hero-bg { opacity: .54; filter: grayscale(.25) saturate(.72) contrast(1.12) !important; }
.page-contact .contact-hero-bg::after { background: linear-gradient(90deg, rgba(8, 9, 11, .94), rgba(8, 9, 11, .58) 64%, rgba(8, 9, 11, .3)) !important; }
.page-contact .contact-form { padding: clamp(26px, 4vw, 46px); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.page-contact .faq-item,
.page-contact .faq-list { border-color: var(--line); }
.page-contact .faq-item summary { font-family: var(--sans); font-weight: 570; letter-spacing: -.025em; }
.page-rentals .rentals-hero { display: flex; align-items: center; }
.page-rentals .rentals-catalog { padding-top: 0; }
.page-rentals .gear-grid { gap: 16px; }
.page-rentals .gear-card { overflow: hidden; }
.page-rentals .gear-card figcaption { padding: 18px 20px 22px; }
.page-rentals .gear-cat { font-family: var(--sans); font-weight: 640; letter-spacing: -.045em; }

/* Every closing CTA and footer lands the same way. */
.contact,
.page-residencies .close-cta {
  background: #0b0d11;
  border-top: 1px solid var(--line);
}
.contact-bg { filter: grayscale(.2) saturate(.68) contrast(1.12); opacity: .48; }
.contact-glow { opacity: .28; }
.contact-statement { font-size: clamp(54px, 8vw, 118px); line-height: .9; }
.site-footer,
.neo-footer {
  margin-top: 0;
  padding-block: 34px 42px;
  background: #07080a;
  border-top: 1px solid var(--line);
  text-align: left;
}
.site-footer .footer-row,
.neo-footer .neo-footer-row { min-height: 76px; }
.site-footer .footer-brand,
.neo-footer .brand { font-family: var(--sans); font-weight: 800; letter-spacing: -.045em; }
.site-footer a,
.neo-footer a { color: var(--muted); }
.site-footer a:hover,
.neo-footer a:hover { color: var(--gold); }

@media (max-width: 1100px) {
  .page-booking .svc-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 899px) {
  .site-header,
  .home-next .site-header { height: 68px; }
  .nav-links,
  .site-header.on-light .nav-links {
    background: rgba(8, 9, 11, .98);
    border-bottom-color: var(--line);
  }
  .nav-links a,
  .site-header.on-light .nav-links a { color: var(--cream); }
  .page-booking > .svc-hero,
  .page-residencies > .res-hero,
  .page-calendar > .agenda-hero,
  .page-foowr > .label-hero,
  .page-about .about-hero,
  .page-rentals .rentals-hero,
  .page-contact .contact-hero {
    min-height: 70svh;
    padding-top: 124px;
    padding-bottom: 72px;
  }
  .page-booking > .svc-hero::after { inset: 14% -20% 0 26%; opacity: .34; }
  .page-residencies > .res-hero::after { inset: 0 -20% 0 20%; opacity: .32; }
  .page-calendar > .agenda-hero::after,
  .page-foowr > .label-hero::after { width: 82vw; right: -38vw; opacity: .7; }
  .page-booking .book-panel { grid-template-columns: 1fr; }
  .page-calendar .slot { grid-template-columns: 180px 1fr; }
}

@media (max-width: 719px) {
  :root { --gutter: 20px; --section-y: 84px; }
  .header-cta { min-height: 40px; padding: 10px 15px; font-size: 11px; }
  .header-nav { gap: 7px; }
  .neo-hero { min-height: 94svh; }
  .neo-hero-grid { background-size: 72px 72px; }
  .neo-hero-video { object-position: 50% 48%; transform: scale(1.12); }
  .neo-hero-scrim {
    background:
      linear-gradient(90deg, rgba(8, 9, 11, .58), rgba(8, 9, 11, .18) 72%, rgba(8, 9, 11, .46)),
      linear-gradient(180deg, rgba(8, 9, 11, .7), transparent 30%, rgba(8, 9, 11, .18) 54%, rgba(8, 9, 11, .94) 100%);
  }
  .neo-hero-name { left: 18px; top: 21%; font-size: 32vw; -webkit-text-stroke-width: 1px; }
  .neo-hero-copy { left: 20px; right: 20px; bottom: 28px; }
  .neo-hero-line { max-width: 12ch; font-size: clamp(36px, 10.6vw, 48px); }
  .neo-hero-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .neo-button { width: 100%; }
  .neo-media-toggle span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .neo-proof { grid-template-columns: 1fr; }
  .neo-proof-summary { flex-wrap: wrap; gap: 8px 24px; padding: 22px 20px; }
  .neo-proof-summary strong { width: 100%; }
  .neo-proof-summary span::before { left: -13px; }
  .neo-proof-link { grid-column: auto; }
  .neo-work,
  .neo-resume,
  .neo-quote,
  .neo-services { padding-inline: 20px; }
  .neo-work-intro h2,
  .neo-resume-head h2,
  .neo-services-head h2 { font-size: 52px; }
  .neo-quote-main blockquote { font-size: 40px; }
  .neo-service { grid-template-columns: 28px 1fr auto; }

  .page-booking > .svc-hero h1,
  .page-residencies > .res-hero h1,
  .page-calendar > .agenda-hero h1,
  .page-foowr > .label-hero h1,
  .page-about .about-title,
  .page-rentals .about-title,
  .page-contact .contact-hero-title { font-size: clamp(58px, 18vw, 82px); }
  .page-booking .svc-grid { grid-template-columns: 1fr; }
  .page-booking .card { min-height: auto; }
  .page-booking .eqp-grid,
  .page-booking .pkg-grid { grid-template-columns: 1fr !important; }
  .page-booking .eqp-grid-sys > .eqp-card:last-child { grid-column: auto !important; }
  .page-residencies .venue,
  .page-residencies .venue.flip { grid-template-columns: 1fr; padding: 20px; }
  .page-residencies .venue.flip .v-media { order: 0; }
  .page-residencies .v-media { aspect-ratio: 4 / 3; }
  .page-calendar .slot { grid-template-columns: 1fr; min-height: 0; }
  .page-calendar .slot .ph { min-height: 280px; border-right: 0; border-bottom: 1px solid var(--line); }
  .page-calendar .slot .body,
  .page-calendar .slot .meta { padding-inline: 22px; }
  .page-calendar .slot .book { margin: 0 22px 24px; justify-self: start; }
  .page-foowr .band-split,
  .page-foowr .demo { grid-template-columns: 1fr; }
  .page-rentals .gear-grid,
  .page-rentals .gear-grid.gear-grid-2 { grid-template-columns: 1fr; }
  .contact-form { border-radius: var(--radius) !important; }
  .site-footer .footer-row,
  .neo-footer .neo-footer-row { align-items: flex-start; flex-direction: column; gap: 22px; }
}

@media (prefers-reduced-motion: reduce) {
  .neo-frame,
  .page-booking .card,
  .page-booking .eqp-card,
  .page-booking .pkg-card,
  .page-rentals .gear-card,
  .page-calendar .slot { transition: none !important; }
}