/*
Theme Name:  Ashkan Image
Theme URI:   https://ashkanimage.com
Author:      Ashkan Image
Description: Custom editorial photography theme — dark palette, glassmorphism Z-layout, Cormorant Garamond + Raleway typography.
Version:     3.44
*/

/* =====================================================
   ASHKAN IMAGE — Master Stylesheet
   Palette: Black / Charcoal / Grey / White
   Fonts: Cormorant Garamond (display) + Raleway (body)
   ===================================================== */

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

:root {
  /* 2026 brand palette. The six values are the ones named on page 07 of the
     brand guidelines; nothing here is invented. Three notes on the mapping:

     --dark and --black both land on BLACK. The old --dark was #0F0F0F, which
     is indistinguishable from black on a screen, so panels that sat on the
     body lose nothing, while cards inside a charcoal section gain a little
     separation.

     --grey-mid was #555555 and is used only for muted body text. On black that
     is a contrast ratio of 2.8:1, well under the 4.5:1 minimum, so it was
     quietly unreadable. STONE is the darkest text tone the brand has, and it
     takes the same text to 10:1.

     --white is no longer pure white. The brand's OFF-WHITE is warm, and page 05
     specifies off-white on black as the approved pairing. */
  --black:      #000000;  /* BLACK     */
  --dark:       #000000;  /* BLACK     */
  --charcoal:   #1F1F1F;  /* CHARCOAL  */
  --grey-dark:  #3A3A3A;  /* GRAPHITE  */
  --grey-mid:   #B3B3B3;  /* STONE     */
  --grey-light: #B3B3B3;  /* STONE     */
  --grey-pale:  #D4D4D4;  /* MIST      */
  --off-white:  #EDEBE7;  /* OFF-WHITE */
  --white:      #EDEBE7;  /* OFF-WHITE */
  --font-display: 'Bodoni Moda', Georgia, serif;
  --font-body:    'Raleway', sans-serif;
  --ls-xwide: 0.25em;
  --ls-wide:  0.15em;
  --ls-med:   0.08em;
}

html { scroll-behavior: smooth; }

body {
  background: var(--black);
  color: var(--white);
  font-family: var(--font-body);
  font-weight: 300;
  line-height: 1.7;
  overflow-x: hidden;
}

a { color: inherit; text-decoration: none; }
img { display: block; width: 100%; object-fit: cover; }
ul { list-style: none; }

/* ── TYPOGRAPHY HELPERS ── */
.label {
  font-family: var(--font-body);
  font-size: 9px; font-weight: 400;
  letter-spacing: var(--ls-xwide);
  text-transform: uppercase;
  color: var(--grey-mid);
}
.display { font-family: var(--font-display); font-weight: 300; }

/* ── BUTTONS ── */
/* Used on eighteen links and one <button>, the contact form's submit.
   Without an explicit background the button picked up the browser's own
   light default, which left white text on a near-white face and made the
   label readable only on hover. */
.btn-ghost {
  display: inline-block;
  font-family: var(--font-body);
  font-size: 11px; font-weight: 500;
  letter-spacing: var(--ls-wide);
  text-transform: uppercase;
  color: var(--white);
  background: transparent;
  -webkit-appearance: none;
  appearance: none;
  border: 1px solid rgba(255,255,255,0.28);
  padding: 15px 36px;
  transition: all .25s;
  cursor: pointer;
}
.btn-ghost:hover { background: var(--white); color: var(--black); border-color: var(--white); }
.btn-ghost--dark { color: var(--black); border-color: rgba(0,0,0,0.3); }
.btn-ghost--dark:hover { background: var(--black); color: var(--white); border-color: var(--black); }

.link-arrow {
  display: inline-block;
  font-family: var(--font-body);
  font-size: 11px; font-weight: 500;
  letter-spacing: var(--ls-wide);
  text-transform: uppercase;
  color: var(--white);
  border-bottom: 1px solid rgba(255,255,255,0.35);
  padding-bottom: 3px;
  opacity: .75;
  transition: opacity .2s, letter-spacing .2s;
}
.link-arrow:hover { opacity: 1; letter-spacing: .22em; }

.btn-glass {
  display: inline-block;
  font-family: var(--font-body);
  font-size: 10px; font-weight: 500;
  letter-spacing: var(--ls-wide);
  text-transform: uppercase;
  color: var(--white);
  border: 1px solid rgba(255,255,255,.35);
  padding: 14px 32px;
  transition: all .25s;
  cursor: pointer;
}
.btn-glass:hover { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.6); }

/* ── RULE ── */
.rule { height: 1px; background: var(--grey-dark); margin: 0 56px; }

/* ═══════════════════════════════════════════
   NAVIGATION
═══════════════════════════════════════════ */
.nav {
  position: fixed; top: 0; left: 0; right: 0;
  z-index: 200;
  display: flex; align-items: center; justify-content: space-between;
  padding: 28px 56px;
  transition: padding .35s ease, background .35s ease, border-color .35s;
  border-bottom: 1px solid transparent;
}
.nav.scrolled {
  padding: 18px 56px;
  background: rgba(0,0,0,0.9);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom-color: var(--grey-dark);
}
.nav__logo img {
  height: 68px; width: auto;
  filter: invert(1) brightness(2);
  opacity: .9; transition: opacity .2s;
}
.nav__logo:hover img { opacity: 1; }
.nav__right { display: flex; align-items: center; gap: 36px; }
.nav__phone {
  font-family: var(--font-body);
  font-size: 10px; font-weight: 400;
  letter-spacing: var(--ls-wide);
  text-transform: uppercase;
  color: var(--grey-pale); transition: color .2s;
}
.nav__phone:hover { color: var(--white); }
.burger {
  display: flex; flex-direction: column; gap: 5px;
  background: none; border: none; cursor: pointer; padding: 4px;
}
.burger span {
  display: block; width: 22px; height: 1px;
  background: var(--white);
  transition: transform .3s ease, opacity .3s ease;
}
.burger.open span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.burger.open span:nth-child(2) { opacity: 0; }
.burger.open span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* ═══════════════════════════════════════════
   OVERLAY MENU
═══════════════════════════════════════════ */
/* The menu centres itself, so anything taller than the viewport was
   clipped at both ends with no way to reach it. On a 1366 by 768 screen
   the seven items at their full size came to more than the window was
   tall. It now scrolls if it has to, and the gap closes up on short
   screens before that becomes necessary. */
.overlay {
  position: fixed; inset: 0;
  background: var(--black);
  z-index: 190;
  display: flex; align-items: center; justify-content: center;
  flex-direction: column; gap: clamp(20px, 5vh, 56px);
  padding: clamp(72px, 12vh, 96px) 24px clamp(16px, 3vh, 40px);
  overflow-y: auto;
  overscroll-behavior: contain;
  opacity: 0; pointer-events: none;
  transition: opacity .4s ease;
}
.overlay.open { opacity: 1; pointer-events: all; }
.overlay__nav { text-align: center; }
.overlay__nav li + li { margin-top: 2px; }
.overlay__nav a {
  font-family: var(--font-display);
  /* Sized against the shorter of the two axes. Against width alone a
     1300px window still asked for 64px even when only 600px tall. */
  font-size: clamp(28px, min(5vw, 5.8vh), 64px);
  font-weight: 400; letter-spacing: .1em; text-transform: uppercase;
  color: var(--white);
  display: inline-block; padding: clamp(1px, 0.4vh, 5px) 0;
  position: relative; transition: color .25s;
}
.overlay__nav a::after {
  content: ''; position: absolute; bottom: 3px; left: 0;
  width: 0; height: 1px; background: var(--white);
  transition: width .3s ease;
}
.overlay__nav a:hover { color: var(--white); }
.overlay__nav a:hover::after { width: 100%; }
.overlay__nav a.active { color: var(--grey-pale); }

/* Page 18 of the brand guidelines: active item off-white, inactive graphite.
   Graphite against black is a quiet 1.6:1, which is the point of it in the
   guideline mockups, so hover and keyboard focus both lift the item back to
   off-white and the active page stays off-white throughout. */
.overlay__nav a            { color: var(--grey-dark); }
.overlay__nav a.is-active,
.overlay__nav a:focus-visible { color: var(--white); }
.overlay__nav a.is-active::after { width: 100%; }
.overlay__social { display: flex; gap: 32px; }
.overlay__social a {
  font-family: var(--font-body);
  font-size: 9px; font-weight: 400;
  letter-spacing: var(--ls-xwide); text-transform: uppercase;
  color: var(--grey-mid); transition: color .2s;
}
.overlay__social a:hover { color: var(--white); }

/* ═══════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════ */
.footer {
  border-top: 1px solid var(--grey-dark);
  padding: 44px 56px;
  display: flex; align-items: center;
  justify-content: space-between; flex-wrap: wrap; gap: 24px;
}
.footer__logo img { height: 26px; width: auto; filter: invert(1) brightness(2); opacity: .45; }
.footer__copy {
  font-family: var(--font-body);
  font-size: 9px; font-weight: 300;
  color: var(--white); letter-spacing: .1em; text-transform: uppercase;
}
.footer__links { display: flex; gap: 28px; }
.footer__links a {
  font-family: var(--font-body);
  font-size: 9px; font-weight: 400;
  letter-spacing: var(--ls-wide); text-transform: uppercase;
  color: var(--grey-mid); transition: color .2s;
}
.footer__links a:hover { color: var(--white); }

/* ═══════════════════════════════════════════
   PAGE HERO (inner pages)
═══════════════════════════════════════════ */
.page-hero {
  height: 52vh; min-height: 380px;
  display: flex; align-items: flex-end;
  padding: 0 56px 64px;
  position: relative; overflow: hidden;
}
.page-hero__bg {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
  filter: brightness(.45);
}
.page-hero__bg-img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  /* Weighted towards the top: these are portraits, and a centred crop on a
     wide hero lands on the mouth. */
  object-fit: cover; object-position: center 28%;
  /* A flat dim crushed the darker frames to black. The scrim below carries
     the legibility instead, so the photograph stays a photograph. */
  filter: brightness(.68);
  z-index: 0; display: block;
}
/* Dark where the title sits, clear where the picture is. */
.page-hero:has(.page-hero__bg-img)::after {
  content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: linear-gradient(to bottom, rgba(0,0,0,.30) 0%, rgba(0,0,0,.10) 38%, rgba(0,0,0,.72) 100%);
}
/* Sticky Book / Call bar, phones only. Note 5.
   Hidden from 761px up so tablet and desktop are untouched. z-index sits
   under the booking modal (400) and the lightbox (9000), so neither is ever
   covered, and the body carries matching bottom padding on phones so the bar
   never sits on top of the footer. */
.mobile-bar { display: none; }
@media (max-width: 760px) {
  .mobile-bar {
    display: flex; position: fixed; z-index: 300;
    left: 0; right: 0; bottom: 0;
    border-top: 1px solid var(--grey-dark);
    background: var(--black);
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  .mobile-bar__btn {
    flex: 1 1 50%;
    min-height: 52px;
    display: flex; align-items: center; justify-content: center;
    font-family: var(--font-body); font-size: 11px; font-weight: 500;
    letter-spacing: var(--ls-wide); text-transform: uppercase;
    text-decoration: none;
    color: var(--black); background: var(--white);
  }
  .mobile-bar__btn--call {
    color: var(--white); background: var(--black);
    border-left: 1px solid var(--grey-dark);
  }
  /* Keep the bar off the footer. The bar is 52px of button plus its 1px top
     border, and it grows by the safe area inset on notched phones, so the
     padding has to account for both or the last pixels of the footer end up
     underneath it. */
  body { padding-bottom: calc(53px + env(safe-area-inset-bottom, 0px)); }
}

/* A hero carrying a photograph needs more room than one carrying a colour.
   At 52vh a portrait rendered into a box four times wider than it is tall
   showed under a third of its height, so heads and lines were being cut off.
   Thirty percent more height gives the picture that room back without turning
   the hero into a full screen banner; for reference the live site runs these
   bands at around 78vh. Scoped with :has() so the hero bands that carry no
   photograph, the archives and the plain ones, are left exactly as they are. */
.page-hero:has(.page-hero__bg-img) {
  height: 67.6vh;
  min-height: 494px;
}
/* Below roughly 731px of viewport height the floor above would start winning
   over the 67.6vh and the band would eat the screen: on a 1366x768 laptop it
   came out at 78 percent of the window, worse than the cropping it was meant
   to fix. Dropping the floor on short windows lets the percentage govern, so
   the hero stays around 68 percent of the viewport everywhere, and a small
   floor remains for genuinely tiny ones. */
@media (max-height: 760px) {
  .page-hero:has(.page-hero__bg-img) { min-height: 300px; }
}
.page-hero__content { position: relative; z-index: 1; }
.page-hero__label { margin-bottom: 14px; }
.page-hero__title {
  font-family: var(--font-display);
  font-size: clamp(48px, 7vw, 100px);
  font-weight: 300; line-height: .95; color: var(--white);
}
.page-hero__title em { font-style: italic; }

/* ═══════════════════════════════════════════
   SCROLL LINE
═══════════════════════════════════════════ */
.scroll-line {
  width: 1px; height: 56px;
  background: rgba(255,255,255,.2);
  position: relative; overflow: hidden;
}
.scroll-line::after {
  content: ''; position: absolute;
  top: 0; left: 0; right: 0; height: 100%;
  background: var(--white);
  animation: runLine 2s ease infinite;
}
@keyframes runLine { 0%{transform:translateY(-100%)} 100%{transform:translateY(100%)} }

/* ═══════════════════════════════════════════
   MASONRY PORTFOLIO
═══════════════════════════════════════════ */
.masonry { columns: 3; column-gap: 3px; }
.masonry__item {
  break-inside: avoid; margin-bottom: 3px;
  position: relative; overflow: hidden; cursor: pointer;
}
.masonry__item img {
  width: 100%; display: block;
  filter: brightness(.92) grayscale(8%);
  transition: transform .7s ease, filter .4s ease;
}
.masonry__item:hover img { transform: scale(1.05); filter: brightness(1) grayscale(0%); }
.masonry__mask {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.7) 0%, transparent 55%);
  opacity: 0; transition: opacity .35s;
}
.masonry__item:hover .masonry__mask { opacity: 1; }
.masonry__caption {
  position: absolute; bottom: 18px; left: 18px; right: 18px;
  display: flex; align-items: flex-end; justify-content: space-between;
  opacity: 0; transform: translateY(6px);
  transition: opacity .3s, transform .3s;
}
.masonry__item:hover .masonry__caption { opacity: 1; transform: translateY(0); }
.masonry__caption-title {
  font-family: var(--font-display);
  font-size: 20px; font-weight: 300; font-style: italic; color: var(--white);
}
.masonry__caption-cat {
  font-family: var(--font-body);
  font-size: 9px; font-weight: 400;
  letter-spacing: var(--ls-xwide); text-transform: uppercase;
  color: rgba(255,255,255,.6);
}

/* ── PAGE SEO INTRO ── */
.page-seo-intro {
  font-family: var(--font-body);
  font-size: 15px; font-weight: 300; line-height: 1.9;
  color: var(--grey-light);
  max-width: 860px;
  padding: 40px 56px;
  border-bottom: 1px solid var(--grey-dark);
}

/* ── FILTER BAR ── */
.filter-bar {
  padding: 40px 56px 32px;
  display: flex; align-items: center; gap: 32px; flex-wrap: wrap;
  border-bottom: 1px solid var(--grey-dark);
}
.filter-btn {
  font-family: var(--font-body); font-size: 10px; font-weight: 400;
  letter-spacing: var(--ls-xwide); text-transform: uppercase;
  color: var(--grey-mid); background: none; border: none;
  cursor: pointer; padding: 6px 0;
  border-bottom: 1px solid transparent;
  transition: color .2s, border-color .2s;
}
.filter-btn:hover { color: var(--white); }
.filter-btn.active { color: var(--white); border-bottom-color: var(--white); }
.gallery { padding: 40px 56px 80px; }
.masonry__item { transition: opacity .35s, transform .35s; }

/* ═══════════════════════════════════════════
   SESSION PANELS
═══════════════════════════════════════════ */
.session-panel {
  position: relative; overflow: hidden; cursor: pointer;
  display: flex; align-items: center;
  min-height: 180px;
  border-top: 1px solid var(--grey-dark);
  transition: background .3s;
}
.session-panel:last-child { border-bottom: 1px solid var(--grey-dark); }
.session-panel__bg {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
  opacity: 0; transform: scale(1.08);
  transition: opacity .5s ease, transform .6s ease;
}
.session-panel:hover .session-panel__bg { opacity: .45; transform: scale(1); }
.session-panel__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to right, rgba(0,0,0,.92) 0%, rgba(0,0,0,.55) 60%, rgba(0,0,0,.2) 100%);
}
.session-panel__inner {
  position: relative; z-index: 2;
  display: grid; grid-template-columns: 72px 1fr auto;
  align-items: center; gap: 36px;
  padding: 40px 56px; width: 100%;
  transition: padding .25s ease;
}
.session-panel:hover .session-panel__inner { padding-left: 72px; }
.session-panel__num {
  font-family: var(--font-display);
  font-size: 40px; font-weight: 300; color: var(--grey-dark);
}
.session-panel__name {
  font-family: var(--font-display);
  font-size: clamp(22px, 2.5vw, 32px); font-weight: 300; color: var(--white);
  margin-bottom: 6px;
}
.session-panel__details {
  font-family: var(--font-body);
  font-size: 13px; font-weight: 300;
  color: var(--grey-light); letter-spacing: .03em;
}
.session-panel__cta { text-align: right; white-space: nowrap; }
.session-panel__price {
  font-family: var(--font-display);
  font-size: 26px; font-weight: 300; color: var(--grey-pale);
}
.session-panel__action {
  display: block; font-family: var(--font-body);
  font-size: 10px; font-weight: 400;
  letter-spacing: var(--ls-wide); text-transform: uppercase;
  color: var(--grey-mid); margin-top: 4px;
}

/* ═══════════════════════════════════════════
   HOMEPAGE SECTIONS
═══════════════════════════════════════════ */
.hero { position: relative; height: 100vh; min-height: 640px; overflow: hidden; }
.hero__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; transform: scale(1.04); transition: transform 1.4s cubic-bezier(.25,.46,.45,.94); z-index: 2; }
.hero__video.ready { transform: scale(1); }
.hero__bg { position: absolute; inset: 0; z-index: 1; background-size: cover; background-position: center; }
.hero__vignette { position: absolute; inset: 0; z-index: 3; background: linear-gradient(to bottom, rgba(0,0,0,.25) 0%, rgba(0,0,0,.05) 35%, rgba(0,0,0,.72) 100%); }
.hero__content { position: absolute; bottom: 72px; left: 56px; right: 56px; z-index: 4; }
.hero__eyebrow { font-family: var(--font-body); font-size: 10px; font-weight: 400; letter-spacing: var(--ls-xwide); text-transform: uppercase; color: var(--white); opacity: .6; margin-bottom: 20px; }
.hero__title { font-family: var(--font-display); font-size: clamp(60px, 9vw, 130px); font-weight: 300; line-height: .95; color: var(--white); letter-spacing: .01em; }
.hero__title em { font-style: italic; }
.hero__tagline { margin-top: 28px; font-family: var(--font-body); font-size: 11px; font-weight: 400; letter-spacing: var(--ls-wide); text-transform: uppercase; color: var(--white); opacity: .55; }
.hero__scroll { position: absolute; bottom: 76px; right: 56px; z-index: 4; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.hero__scroll span { font-family: var(--font-body); font-size: 8px; font-weight: 400; letter-spacing: var(--ls-xwide); text-transform: uppercase; color: var(--white); opacity: .4; writing-mode: vertical-rl; }
.intro { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: end; padding: 112px 56px; max-width: 1280px; margin: 0 auto; }
.intro__heading { font-family: var(--font-display); font-size: clamp(40px, 4vw, 62px); font-weight: 300; line-height: 1.1; color: var(--white); }
.intro__heading em { font-style: italic; color: var(--grey-pale); }
.intro__body { font-family: var(--font-body); font-size: 16px; font-weight: 300; line-height: 1.95; color: var(--grey-light); margin-bottom: 36px; }
.portfolio { padding: 80px 56px; }
.portfolio__header { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 40px; padding-bottom: 20px; border-bottom: 1px solid var(--grey-dark); }
.grid { display: grid; grid-template-columns: repeat(3,1fr); grid-template-rows: auto auto; gap: 3px; }
.grid__cell { position: relative; overflow: hidden; cursor: pointer; }
.grid__cell--tall { grid-row: span 2; }
.grid__cell img { width: 100%; height: 100%; min-height: 300px; object-fit: cover; filter: brightness(.92) grayscale(10%); transition: transform .7s ease, filter .4s ease; }
.grid__cell--tall img { min-height: 604px; }
.grid__cell:hover img { transform: scale(1.05); filter: brightness(1) grayscale(0%); }
.grid__mask { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,.72) 0%, transparent 55%); opacity: 0; transition: opacity .35s; }
.grid__cell:hover .grid__mask { opacity: 1; }
.grid__caption { position: absolute; bottom: 22px; left: 22px; right: 22px; display: flex; align-items: flex-end; justify-content: space-between; opacity: 0; transform: translateY(6px); transition: opacity .3s, transform .3s; }
.grid__cell:hover .grid__caption { opacity: 1; transform: translateY(0); }
.grid__caption-title { font-family: var(--font-display); font-size: 22px; font-weight: 300; font-style: italic; color: var(--white); }
.grid__caption-cat { font-family: var(--font-body); font-size: 9px; font-weight: 400; letter-spacing: var(--ls-xwide); text-transform: uppercase; color: rgba(255,255,255,.6); }
.split { display: grid; grid-template-columns: 55% 45%; min-height: 88vh; }
.split--flip { grid-template-columns: 45% 55%; }
.split__img { overflow: hidden; }
.split__img img { width: 100%; height: 100%; min-height: 560px; object-fit: cover; transition: transform .9s ease; }
.split:hover .split__img img { transform: scale(1.03); }
.split__content { background: var(--dark); display: flex; flex-direction: column; justify-content: center; padding: 88px 80px; }
.split--flip .split__content { background: var(--charcoal); }
.split__index { font-family: var(--font-display); font-size: 88px; font-weight: 300; color: var(--grey-dark); line-height: 1; margin-bottom: -10px; }
.split__eyebrow { font-family: var(--font-body); font-size: 13px; font-weight: 400; letter-spacing: .04em; color: var(--grey-pale); margin-bottom: 14px; }
.split__title { font-family: var(--font-display); font-size: clamp(40px, 3.8vw, 62px); font-weight: 300; line-height: 1.1; color: var(--white); margin-bottom: 22px; }
.split__title em { font-style: italic; }
.split__text { font-family: var(--font-body); font-size: 16px; font-weight: 300; line-height: 1.95; color: var(--grey-light); max-width: 400px; margin-bottom: 28px; }
.split__meta { border-top: 1px solid var(--grey-dark); padding-top: 22px; margin-bottom: 36px; font-family: var(--font-body); font-size: 13px; font-weight: 300; color: var(--grey-pale); letter-spacing: .05em; }
.split__features { list-style: none; margin-bottom: 36px; }
.split__features li { font-family: var(--font-body); font-size: 14px; font-weight: 300; color: var(--grey-light); padding: 8px 0; border-bottom: 1px solid var(--grey-dark); display: flex; align-items: center; gap: 12px; }
.split__features li::before { content: '—'; color: var(--grey-dark); font-size: 12px; }
.sessions__header {
  padding: 96px 56px 64px;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.sessions__header--img { padding: 140px 56px 120px; }
.sessions__header-bg-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  z-index: 0;
  display: block;
}
.sessions__header-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(0,0,0,.55) 0%, rgba(0,0,0,.7) 100%);
  z-index: 1;
  pointer-events: none;
}
.sessions__header-content { position: relative; z-index: 2; }
.sessions__heading { font-family: var(--font-display); font-size: clamp(42px,5vw,70px); font-weight: 300; font-style: italic; color: var(--white); margin-top: 16px; }
.process { background: var(--dark); }
.process__intro { padding: 96px 56px 72px; display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: end; }
.process__headline { font-family: var(--font-display); font-size: clamp(40px,5vw,72px); font-weight: 300; line-height: 1.05; color: var(--white); }
.process__headline em { font-style: italic; color: var(--grey-pale); }
.process__sub { font-family: var(--font-body); font-size: 16px; font-weight: 300; color: var(--grey-light); line-height: 1.9; }
.process__strip { display: grid; grid-template-columns: repeat(5,1fr); border-top: 1px solid var(--grey-dark); }
.process__step { padding: 56px 44px 64px; border-right: 1px solid var(--grey-dark); position: relative; overflow: hidden; transition: background .3s; }
.process__step:last-child { border-right: none; }
.process__step:hover { background: var(--charcoal); }
.process__step-num { font-family: var(--font-display); font-size: 80px; font-weight: 300; color: var(--grey-dark); line-height: 1; margin-bottom: 8px; }
.process__step-title { font-family: var(--font-body); font-size: 12px; font-weight: 500; letter-spacing: .04em; color: var(--white); margin-bottom: 16px; }
.process__step-text { font-family: var(--font-body); font-size: 14px; font-weight: 300; color: var(--grey-light); line-height: 1.9; }
.process__step::after { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: var(--white); transform: scaleX(0); transform-origin: left; transition: transform .35s ease; }
.process__step:hover::after { transform: scaleX(1); }
.process__cta { padding: 64px 56px; border-top: 1px solid var(--grey-dark); display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.process__cta-text { font-family: var(--font-display); font-size: clamp(28px,3vw,44px); font-weight: 300; font-style: italic; color: var(--white); }
.workshops { padding: 120px 56px; background: var(--charcoal); text-align: center; }
.workshops__heading { font-family: var(--font-display); font-size: clamp(44px,6vw,80px); font-weight: 300; font-style: italic; color: var(--white); margin: 16px 0 20px; }
.workshops__sub { font-family: var(--font-body); font-size: 16px; font-weight: 300; color: var(--grey-light); max-width: 540px; margin: 0 auto 64px; line-height: 1.9; }
.workshops__grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; background: var(--grey-dark); max-width: 1040px; margin: 0 auto 56px; }
.wcard { background: var(--dark); padding: 52px 44px; text-align: left; transition: background .2s; }
.wcard:hover { background: var(--charcoal); }
.wcard__eyebrow { font-family: var(--font-body); font-size: 13px; font-weight: 400; letter-spacing: .03em; color: var(--grey-pale); margin-bottom: 12px; }
.wcard__title { font-family: var(--font-display); font-size: 28px; font-weight: 300; color: var(--white); margin-bottom: 14px; }
.wcard__desc { font-family: var(--font-body); font-size: 14px; font-weight: 300; color: var(--grey-light); line-height: 1.9; margin-bottom: 24px; }
.wcard__price { font-family: var(--font-body); font-size: 12px; font-weight: 400; color: var(--grey-pale); letter-spacing: .06em; margin-bottom: 28px; }
.wcard__btn { display: inline-block; font-family: var(--font-body); font-size: 10px; font-weight: 400; letter-spacing: .14em; text-transform: uppercase; color: var(--white); border-bottom: 1px solid rgba(255,255,255,.35); padding-bottom: 3px; text-decoration: none; transition: border-color .2s, color .2s; }
.wcard__btn:hover { color: var(--grey-pale); border-color: rgba(255,255,255,.15); }
.contact-strip { padding: 120px 56px; display: grid; grid-template-columns: 1fr 1fr; gap: 80px; max-width: 1100px; margin: 0 auto; }
.contact-strip__heading { font-family: var(--font-display); font-size: clamp(38px,4vw,60px); font-weight: 300; line-height: 1.1; color: var(--white); margin: 16px 0 40px; }
.contact-strip__heading em { font-style: italic; }
.contact__list li { display: flex; gap: 24px; align-items: baseline; padding: 18px 0; border-bottom: 1px solid var(--grey-dark); }
.contact__lbl { font-family: var(--font-body); font-size: 9px; font-weight: 400; letter-spacing: var(--ls-xwide); text-transform: uppercase; color: var(--grey-mid); min-width: 72px; }
.contact__val { font-family: var(--font-body); font-size: 14px; font-weight: 300; color: var(--grey-pale); transition: color .2s; }
.contact__list a:hover .contact__val { color: var(--white); }
.contact__right { display: flex; flex-direction: column; justify-content: center; }
.contact__right p { font-family: var(--font-body); font-size: 15px; font-weight: 300; color: var(--grey-light); line-height: 2; margin-bottom: 44px; }
.book-stack { display: flex; flex-direction: column; gap: 14px; max-width: 300px; }
.contact-strip__detail { font-family: var(--font-body); font-size: 14px; font-weight: 300; color: var(--grey-light); line-height: 2; }

/* ═══════════════════════════════════════════
   ABOUT PAGE — Pixelin-inspired layout
═══════════════════════════════════════════ */

/* HERO — massive title */
.about-hero { background: var(--black); padding: 140px 56px 0; }
.about-hero__inner { }
.about-hero__title {
  font-family: var(--font-display);
  font-size: clamp(64px, 10vw, 148px);
  font-weight: 300;
  font-style: italic;
  color: var(--white);
  line-height: 1.0;
  letter-spacing: -.01em;
  margin: 0 0 56px;
}
.about-hero__rule { width: 100%; height: 1px; background: rgba(255,255,255,.15); margin-bottom: 40px; }
.about-hero__strip { display: flex; align-items: center; justify-content: space-between; padding-bottom: 80px; gap: 40px; }
.about-hero__tagline { font-family: var(--font-body); font-size: 15px; font-weight: 300; color: var(--grey-light); line-height: 1.8; max-width: 480px; }
.about-hero__cta { flex-shrink: 0; font-family: var(--font-body); font-size: 11px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--white); background: var(--charcoal); border: 1px solid rgba(255,255,255,.2); padding: 18px 32px; text-decoration: none; white-space: nowrap; transition: background .2s, border-color .2s; }
.about-hero__cta:hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.4); }

/* BODY — left text / right tall image */
.about-body { background: var(--black); display: grid; grid-template-columns: 1fr 1fr; }
.about-body__text { padding: 100px 72px 100px 56px; display: flex; flex-direction: column; justify-content: center; }
.about-body__large { font-family: var(--font-display); font-size: clamp(22px, 2.4vw, 34px); font-weight: 300; color: var(--grey-light); line-height: 1.6; }
.about-body__img img { width: 100%; height: 100%; min-height: 600px; object-fit: cover; display: block; }
.about-body__img-placeholder { width: 100%; min-height: 600px; background: var(--charcoal); }

/* STATS ROW */
.about-stats { background: var(--dark); border-top: 1px solid rgba(255,255,255,.08); border-bottom: 1px solid rgba(255,255,255,.08); }
.about-stats__inner { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr; align-items: center; padding: 64px 56px; }
.about-stats__item { text-align: center; padding: 0 24px; }
.about-stats__num { display: block; font-family: var(--font-display); font-size: clamp(44px,5vw,72px); font-weight: 300; font-style: italic; color: var(--white); line-height: 1; margin-bottom: 12px; }
.about-stats__label { font-family: var(--font-body); font-size: 10px; font-weight: 400; letter-spacing: .14em; text-transform: uppercase; color: var(--grey-pale); }
.about-stats__divider { width: 1px; height: 80px; background: rgba(255,255,255,.12); }

/* FOUNDER — image left / text right */
.about-founder { background: var(--black); display: grid; grid-template-columns: 1fr 1fr; }
.about-founder__img img { width: 100%; height: 100%; min-height: 640px; object-fit: cover; display: block; }
.about-founder__img-placeholder { min-height: 640px; background: var(--charcoal); }
.about-founder__text { padding: 100px 72px; display: flex; flex-direction: column; justify-content: center; background: var(--dark); }
.about-founder__name { font-family: var(--font-display); font-size: clamp(40px,4vw,64px); font-weight: 300; font-style: italic; color: var(--white); line-height: 1.05; margin: 12px 0 28px; }
.about-founder__rule { width: 40px; height: 1px; background: rgba(255,255,255,.25); margin-bottom: 32px; }
.about-founder__bio { font-family: var(--font-body); font-size: 15px; font-weight: 300; color: var(--grey-light); line-height: 2; }

/* TEAM */
.about-team { padding: 100px 56px; background: var(--black); }
.about-team__header { text-align: center; margin-bottom: 64px; }
.about-team__heading { font-family: var(--font-display); font-size: clamp(32px,3.5vw,52px); font-weight: 300; color: var(--white); line-height: 1.2; }
.about-team__heading em { font-style: italic; }
.about-team__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 2px; max-width: 1100px; margin: 0 auto; background: var(--grey-dark); }
.team-card { background: var(--dark); transition: background .2s; }
.team-card:hover { background: var(--charcoal); }
.team-card__photo img { width: 100%; aspect-ratio: 3/4; object-fit: cover; display: block; }
.team-card__photo--placeholder { width: 100%; aspect-ratio: 3/4; background: var(--charcoal); }
.team-card__info { padding: 32px 32px 40px; }
.team-card__name { font-family: var(--font-display); font-size: 24px; font-weight: 300; color: var(--white); margin-bottom: 6px; }
.team-card__title { font-family: var(--font-body); font-size: 10px; font-weight: 400; letter-spacing: .12em; text-transform: uppercase; color: var(--grey-pale); margin-bottom: 16px; }
.team-card__bio { font-family: var(--font-body); font-size: 13px; font-weight: 300; color: var(--grey-light); line-height: 1.9; }

/* PRESS */
.about-press { background: var(--dark); padding: 100px 56px; }
.about-press__top { display: flex; align-items: flex-end; justify-content: space-between; gap: 40px; margin-bottom: 40px; }
.about-press__heading { font-family: var(--font-display); font-size: clamp(32px,3.5vw,52px); font-weight: 300; font-style: italic; color: var(--white); line-height: 1.15; }
.about-press__link { flex-shrink: 0; font-family: var(--font-body); font-size: 11px; font-weight: 400; letter-spacing: .12em; text-transform: uppercase; color: var(--white); text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.3); padding-bottom: 4px; white-space: nowrap; transition: color .2s, border-color .2s; }
.about-press__link:hover { color: var(--grey-pale); border-color: transparent; }
.about-press__rule { width: 100%; height: 1px; background: rgba(255,255,255,.12); margin-bottom: 40px; }
.about-press__body { font-family: var(--font-body); font-size: 15px; font-weight: 300; color: var(--grey-light); line-height: 2; max-width: 640px; }

/* CTA BOTTOM */
.about-cta { background: var(--black); padding: 120px 56px; }
.about-cta__heading { font-family: var(--font-display); font-size: clamp(44px,6vw,96px); font-weight: 300; font-style: italic; color: var(--white); line-height: 1.05; max-width: 800px; margin-bottom: 48px; }
.about-cta__rule { width: 100%; height: 1px; background: rgba(255,255,255,.12); margin-bottom: 48px; }
.about-cta__actions { display: flex; align-items: center; gap: 48px; }
.about-cta__link { font-family: var(--font-body); font-size: 11px; font-weight: 400; letter-spacing: .12em; text-transform: uppercase; color: var(--grey-pale); text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.2); padding-bottom: 3px; transition: color .2s; }
.about-cta__link:hover { color: var(--white); }

/* About page responsive */
@media (max-width: 900px) {
  .about-hero { padding: 100px 28px 0; }
  .about-hero__strip { flex-direction: column; align-items: flex-start; padding-bottom: 56px; }
  .about-body { grid-template-columns: 1fr; }
  .about-body__text { padding: 72px 28px; }
  .about-body__img img, .about-body__img-placeholder { min-height: 400px; }
  .about-stats__inner { grid-template-columns: 1fr 1fr; gap: 0; padding: 48px 28px; }
  .about-stats__divider { display: none; }
  .about-stats__item { padding: 24px 0; border-bottom: 1px solid rgba(255,255,255,.08); }
  .about-founder { grid-template-columns: 1fr; }
  .about-founder__text { padding: 56px 28px; }
  .about-founder__img img, .about-founder__img-placeholder { min-height: 420px; }
  .about-team { padding: 72px 28px; }
  .about-press { padding: 72px 28px; }
  .about-press__top { flex-direction: column; align-items: flex-start; }
  .about-cta { padding: 80px 28px; }
}

/* ═══════════════════════════════════════════
   Z-LAYOUT (Sessions & Workshops)
═══════════════════════════════════════════ */
.z-session, .z-workshop {
  position: relative;
  min-height: 90vh;
  display: flex;
  align-items: center;
  overflow: hidden;
}
.z-workshop { min-height: 85vh; }
.z-session__bg, .z-workshop__bg {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
  background-attachment: fixed;
  filter: brightness(.55);
  transition: filter .4s; z-index: 0;
}
.z-session:hover .z-session__bg { filter: brightness(.65); }
.z-workshop:hover .z-workshop__bg { filter: brightness(.62); }
.z-session__vignette, .z-workshop__vignette {
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(to bottom, rgba(0,0,0,.18) 0%, rgba(0,0,0,.08) 50%, rgba(0,0,0,.35) 100%);
}
.z-session__card, .z-workshop__card {
  position: relative; z-index: 2;
  width: 48%; max-width: 620px;
  background: rgba(10,10,10,0.72);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border: 1px solid rgba(255,255,255,0.10);
  padding: 64px 60px 68px;
  margin: 80px 56px;
}
.z-session:nth-child(odd)  { justify-content: flex-end; }
.z-session:nth-child(even) { justify-content: flex-start; }
.z-workshop:nth-child(odd)  { justify-content: flex-end; }
.z-workshop:nth-child(even) { justify-content: flex-start; }
.z-session__card::before, .z-workshop__card::before {
  content: ''; position: absolute;
  top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(to right, transparent, rgba(255,255,255,.35), transparent);
}
.z-session__num, .z-workshop__num {
  font-family: var(--font-display);
  font-size: 72px; font-weight: 300;
  color: rgba(255,255,255,0.12); line-height: 1; margin-bottom: -8px;
}
.z-session__eyebrow, .z-workshop__eyebrow {
  font-family: var(--font-body);
  font-size: 13px; font-weight: 400;
  letter-spacing: .04em;
  color: rgba(255,255,255,.6); margin-bottom: 14px;
}
.z-session__name, .z-workshop__name {
  font-family: var(--font-display);
  font-size: clamp(32px, 3.2vw, 48px);
  font-weight: 300; line-height: 1.1; color: var(--white); margin-bottom: 8px;
}
.z-session__name em, .z-workshop__name em { font-style: italic; }
.z-session__price { font-family: var(--font-display); font-size: 24px; font-weight: 300; color: rgba(255,255,255,.6); margin-bottom: 24px; }
.z-workshop__price { font-family: var(--font-display); font-size: 22px; font-weight: 300; color: rgba(255,255,255,.55); margin-bottom: 28px; }
.z-session__divider, .z-workshop__divider { width: 40px; height: 1px; background: rgba(255,255,255,.25); margin-bottom: 24px; }
.z-session__desc, .z-workshop__desc {
  font-family: var(--font-body); font-size: 14px; font-weight: 300;
  line-height: 1.9; color: rgba(255,255,255,.65); margin-bottom: 24px;
}
.z-session__includes, .z-workshop__includes { list-style: none; margin-bottom: 36px; }
.z-session__includes li, .z-workshop__includes li {
  font-family: var(--font-body); font-size: 13px; font-weight: 300;
  color: rgba(255,255,255,.55);
  padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,.08);
  display: flex; gap: 12px;
}
.z-session__includes li::before, .z-workshop__includes li::before { content: '—'; color: rgba(255,255,255,.2); flex-shrink: 0; }
.z-session__actions { display: flex; gap: 16px; flex-wrap: wrap; }
.z-workshop__meta {
  font-family: var(--font-body); font-size: 13px; font-weight: 300;
  letter-spacing: .03em;
  color: rgba(255,255,255,.5); margin-bottom: 22px;
}

/* Add-ons */
.addons { padding: 88px 56px; background: var(--charcoal); }
.addons__heading { font-family: var(--font-display); font-size: clamp(32px,3.5vw,50px); font-weight: 300; font-style: italic; color: var(--white); margin: 16px 0 52px; }
.addons__grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; background: var(--grey-dark); }
.addon-card { background: var(--dark); padding: 40px 36px; transition: background .2s; }
.addon-card:hover { background: var(--charcoal); }
.addon-card__name { font-family: var(--font-display); font-size: 22px; font-weight: 300; color: var(--white); margin-bottom: 10px; }
.addon-card__price { font-family: var(--font-body); font-size: 12px; font-weight: 400; color: var(--grey-pale); letter-spacing: .05em; margin-bottom: 14px; }
.addon-card__desc { font-family: var(--font-body); font-size: 13px; font-weight: 300; color: var(--grey-mid); line-height: 1.8; }

/* FAQ */
.faq { padding: 80px 56px; max-width: 860px; }
.faq__title { font-family: var(--font-display); font-size: clamp(28px,3vw,42px); font-weight: 300; font-style: italic; color: var(--white); margin: 16px 0 44px; }
.faq__item { border-top: 1px solid var(--grey-dark); padding: 26px 0; }
.faq__item:last-child { border-bottom: 1px solid var(--grey-dark); }
.faq__q { font-family: var(--font-display); font-size: 20px; font-weight: 300; color: var(--white); margin-bottom: 12px; }
.faq__a { font-family: var(--font-body); font-size: 14px; font-weight: 300; color: var(--grey-light); line-height: 1.95; }

/* Workshops coaching section */
.coaching-section { background: var(--charcoal); padding: 100px 56px; display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.coaching-section__heading { font-family: var(--font-display); font-size: clamp(36px,4vw,58px); font-weight: 300; line-height: 1.1; color: var(--white); margin: 16px 0 28px; }
.coaching-section__heading em { font-style: italic; }
.coaching-section__body { font-family: var(--font-body); font-size: 15px; font-weight: 300; color: var(--grey-light); line-height: 1.95; margin-bottom: 36px; }
.tier-list { border-top: 1px solid var(--grey-dark); margin-bottom: 40px; }
.tier-row { display: flex; justify-content: space-between; align-items: baseline; padding: 20px 0; border-bottom: 1px solid var(--grey-dark); }
.tier-row__name { font-family: var(--font-body); font-size: 13px; font-weight: 400; color: var(--grey-pale); letter-spacing: .04em; }
.tier-row__price { font-family: var(--font-display); font-size: 22px; font-weight: 300; color: var(--white); }
.coaching-section__img { overflow: hidden; }
.coaching-section__img img { width: 100%; object-fit: cover; max-height: 560px; filter: brightness(.85) grayscale(8%); }

/* Contact page */
.contact-top { display: grid; grid-template-columns: 1fr 1fr; min-height: calc(100vh - 90px); border-bottom: 1px solid var(--grey-dark); }
.contact-form-col { padding: 88px 64px 88px 56px; border-right: 1px solid var(--grey-dark); }
.contact-form-col__heading { font-family: var(--font-display); font-size: clamp(36px,4vw,58px); font-weight: 300; line-height: 1.05; color: var(--white); margin: 16px 0 12px; }
.contact-form-col__heading em { font-style: italic; }
.contact-form-col__sub { font-family: var(--font-body); font-size: 14px; font-weight: 300; color: var(--grey-light); line-height: 1.85; margin-bottom: 44px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.form-field { margin-bottom: 28px; }
.form-field label { display: block; font-family: var(--font-body); font-size: 9px; font-weight: 400; letter-spacing: var(--ls-xwide); text-transform: uppercase; color: var(--grey-mid); margin-bottom: 10px; }
.form-field input, .form-field select, .form-field textarea { width: 100%; background: none; border: none; border-bottom: 1px solid var(--grey-dark); color: var(--white); font-family: var(--font-body); font-size: 15px; font-weight: 300; padding: 12px 0; outline: none; transition: border-color .2s; -webkit-appearance: none; appearance: none; }
.form-field input:focus, .form-field select:focus, .form-field textarea:focus { border-bottom-color: var(--white); }
.form-field textarea { resize: none; min-height: 100px; }
.form-field select { cursor: pointer; }
.form-field select option { background: var(--dark); color: var(--white); }
.form-note { font-family: var(--font-body); font-size: 11px; font-weight: 300; color: var(--grey-mid); line-height: 1.7; margin-top: 20px; }
.form-note a { color: var(--grey-pale); transition: color .2s; }
.form-note a:hover { color: var(--white); }
.contact-book-col { padding: 88px 56px 88px 64px; background: var(--charcoal); display: flex; flex-direction: column; }
.contact-book-col__heading { font-family: var(--font-display); font-size: clamp(30px,3vw,44px); font-weight: 300; font-style: italic; color: var(--white); margin: 16px 0 12px; }
.contact-book-col__sub { font-family: var(--font-body); font-size: 14px; font-weight: 300; color: var(--grey-light); line-height: 1.85; margin-bottom: 44px; }
.book-link { display: flex; align-items: center; justify-content: space-between; padding: 22px 0; border-top: 1px solid var(--grey-dark); transition: padding-left .2s; cursor: pointer; }
.book-link:last-child { border-bottom: 1px solid var(--grey-dark); }
.book-link:hover { padding-left: 8px; }
.book-link__left { flex: 1; }
.book-link__num { font-family: var(--font-display); font-size: 13px; font-weight: 300; color: var(--grey-dark); margin-bottom: 2px; }
.book-link__name { font-family: var(--font-display); font-size: clamp(18px,1.8vw,24px); font-weight: 300; color: var(--white); transition: color .2s; }
.book-link__name em { font-style: italic; }
.book-link:hover .book-link__name { color: var(--grey-pale); }
.book-link__name em { font-style: italic; }
.book-link__detail { font-family: var(--font-body); font-size: 11px; font-weight: 300; color: var(--grey-mid); margin-top: 3px; letter-spacing: .03em; }
.book-link__price { font-family: var(--font-display); font-size: 20px; font-weight: 300; color: var(--grey-pale); white-space: nowrap; margin-left: 24px; transition: color .2s; }
.book-link:hover .book-link__price { color: var(--white); }
.book-link__arrow { font-family: var(--font-body); font-size: 18px; color: var(--grey-dark); margin-left: 16px; transition: color .2s, transform .2s; }
.book-link:hover .book-link__arrow { color: var(--white); transform: translateX(4px); }
.contact-info-bar { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; border-bottom: 1px solid var(--grey-dark); }
.info-tile { padding: 52px 44px; border-right: 1px solid var(--grey-dark); }
.info-tile:last-child { border-right: none; }
.info-tile__label { font-family: var(--font-body); font-size: 9px; font-weight: 400; letter-spacing: var(--ls-xwide); text-transform: uppercase; color: var(--grey-mid); margin-bottom: 16px; }
.info-tile__value { font-family: var(--font-body); font-size: 15px; font-weight: 300; color: var(--grey-pale); line-height: 1.7; transition: color .2s; }
.info-tile a:hover .info-tile__value { color: var(--white); }
.info-tile__value a { color: var(--grey-pale); display: block; transition: color .2s; }
.info-tile__value a:hover { color: var(--white); }
.social-links { display: flex; flex-direction: column; gap: 10px; }
.social-links a { font-family: var(--font-body); font-size: 13px; font-weight: 300; color: var(--grey-mid); letter-spacing: .04em; transition: color .2s; }
.social-links a:hover { color: var(--white); }
.contact-map { border-top: 1px solid var(--grey-dark); }
.contact-map iframe { display: block; width: 100%; height: 340px; border: none; filter: grayscale(1) invert(1) contrast(.85) brightness(.7); }

/* ═══════════════════════════════════════════
   SEO INTRO SECTION
═══════════════════════════════════════════ */
.seo-intro {
  background: var(--dark);
  padding: 80px 56px;
  border-bottom: 1px solid var(--grey-dark);
}
.seo-intro__heading {
  font-family: var(--font-display);
  font-size: clamp(28px, 3vw, 44px);
  font-weight: 300; font-style: italic;
  color: var(--white);
  margin-bottom: 20px;
  max-width: 820px;
}
.seo-intro__body {
  font-family: var(--font-body);
  font-size: 15px; font-weight: 300;
  color: var(--grey-light);
  line-height: 2;
  max-width: 720px;
}

/* ═══════════════════════════════════════════
   HOMEPAGE PORTFOLIO CATEGORY GRID
═══════════════════════════════════════════ */
.cat-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 3px;
  padding: 0 56px 56px;
}
.cat-tile {
  position: relative;
  aspect-ratio: 3/4;
  overflow: hidden;
  display: block;
  cursor: pointer;
}
.cat-tile img {
  width: 100%; height: 100%;
  object-fit: cover;
  filter: brightness(.8) grayscale(10%);
  transition: transform .7s ease, filter .5s ease;
}
.cat-tile:hover img {
  transform: scale(1.06);
  filter: brightness(.95) grayscale(0%);
}
.cat-tile__placeholder {
  width: 100%; height: 100%;
  background: var(--charcoal);
}
.cat-tile__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.85) 0%, rgba(0,0,0,.1) 60%);
  transition: background .4s;
}
.cat-tile:hover .cat-tile__overlay {
  background: linear-gradient(to top, rgba(0,0,0,.9) 0%, rgba(0,0,0,.25) 100%);
}
.cat-tile__label {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 28px 20px;
  display: flex; flex-direction: column; gap: 7px;
}
.cat-tile__name {
  font-family: var(--font-display);
  font-size: clamp(15px, 1.5vw, 22px);
  font-weight: 300; font-style: italic;
  color: var(--white); line-height: 1.2;
}
.cat-tile__cta {
  font-family: var(--font-body);
  font-size: 9px; font-weight: 400;
  letter-spacing: var(--ls-wide); text-transform: uppercase;
  color: rgba(255,255,255,.55);
  opacity: 0; transform: translateY(5px);
  transition: opacity .3s, transform .3s;
}
.cat-tile:hover .cat-tile__cta {
  opacity: 1; transform: translateY(0);
}

/* ═══════════════════════════════════════════
   LIGHTBOX
═══════════════════════════════════════════ */
.lightbox {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,.97);
  display: flex; align-items: center; justify-content: center;
  opacity: 0; pointer-events: none;
  transition: opacity .3s ease;
}
.lightbox.open { opacity: 1; pointer-events: all; }
.lightbox__img-wrap {
  position: relative;
  max-width: 92vw; max-height: 92vh;
  display: flex; align-items: center; justify-content: center;
}
.lightbox__img {
  max-width: 92vw; max-height: 92vh;
  object-fit: contain; display: block;
  transform: scale(.96); opacity: 0;
  transition: transform .35s ease, opacity .35s ease;
}
.lightbox.open .lightbox__img { transform: scale(1); opacity: 1; }
.lightbox__close {
  position: fixed; top: 24px; right: 28px;
  width: 44px; height: 44px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; border: none; background: none;
  color: rgba(255,255,255,.7); font-size: 28px; line-height: 1;
  transition: color .2s;
}
.lightbox__close:hover { color: var(--white); }
.lightbox__prev, .lightbox__next {
  position: fixed; top: 50%; transform: translateY(-50%);
  width: 52px; height: 52px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; border: none; background: none;
  color: rgba(255,255,255,.5); font-size: 32px;
  transition: color .2s;
}
.lightbox__prev:hover, .lightbox__next:hover { color: var(--white); }
.lightbox__prev { left: 20px; }
.lightbox__next { right: 20px; }
.lightbox__caption {
  position: fixed; bottom: 28px; left: 50%; transform: translateX(-50%);
  font-family: var(--font-display); font-style: italic; font-weight: 300;
  font-size: 18px; color: rgba(255,255,255,.7);
  white-space: nowrap;
}
.masonry__item { cursor: zoom-in; }

/* ═══════════════════════════════════════════
   TESTIMONIALS SECTION (Google Reviews)
═══════════════════════════════════════════ */
.testimonials-section {
  padding: 100px 56px;
  background: var(--black);
  border-top: 1px solid var(--grey-dark);
}
.testimonials-section__header {
  display: flex; align-items: baseline; justify-content: space-between;
  margin-bottom: 56px; padding-bottom: 24px;
  border-bottom: 1px solid var(--grey-dark);
}
.testimonials-section__heading {
  font-family: var(--font-display);
  font-size: clamp(36px, 4vw, 60px);
  font-weight: 300; font-style: italic;
  color: var(--white);
}
/* Review cards — 5-column row */
.review-cards {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 2px;
}
.review-card {
  background: var(--black);
  border: 1px solid var(--grey-dark);
  padding: 36px 28px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  text-decoration: none;
  cursor: pointer;
  transition: border-color .3s ease, background .3s ease;
}
.review-card:hover {
  border-color: var(--grey-mid);
  background: #111;
}
.review-card__stars {
  color: #c9a84c;
  font-size: 14px;
  letter-spacing: 3px;
}
.review-card__text {
  font-family: var(--font-display);
  font-size: clamp(13px, 1vw, 15px);
  font-weight: 300;
  font-style: italic;
  line-height: 1.75;
  color: var(--grey-light);
  flex: 1;
}
.review-card__meta {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-top: 14px;
  border-top: 1px solid var(--grey-dark);
}
.review-card__name {
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--white);
}
.review-card__source {
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 300;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--grey-mid);
}

/* ═══════════════════════════════════════════
   LOCATION & CREDENTIALS SECTION
═══════════════════════════════════════════ */
.location-section {
  padding: 100px 56px;
  background: var(--charcoal);
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 80px; align-items: start;
  border-top: 1px solid var(--grey-dark);
}
.location-section__content {}
.location-section__heading {
  font-family: var(--font-display);
  font-size: clamp(32px, 3.5vw, 52px);
  font-weight: 300; line-height: 1.1; color: var(--white);
  margin-bottom: 32px;
}
.location-section__heading em { font-style: italic; }
.location-section__address {
  font-family: var(--font-body);
  font-size: 15px; font-weight: 300;
  color: var(--grey-light); line-height: 1.9;
  margin-bottom: 40px;
}
.location-creds {
  border-top: 1px solid var(--grey-dark);
  margin-bottom: 40px;
}
.location-cred-item {
  display: flex; align-items: baseline; gap: 16px;
  padding: 14px 0; border-bottom: 1px solid var(--grey-dark);
  font-family: var(--font-body); font-size: 14px; font-weight: 300;
  color: var(--grey-light);
}
.location-cred-item::before { content: '—'; color: var(--grey-dark); flex-shrink: 0; }
.location-section__map {
  overflow: hidden;
  border: 1px solid var(--grey-dark);
  display: flex; flex-direction: column;
}
/* Studio photos — shown above the map when uploaded */
.studio-photos {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2px; flex-shrink: 0;
}
.studio-photos:has(.studio-photo__second) {
  grid-template-columns: 1fr 1fr;
}
.studio-photo__main,
.studio-photo__second {
  width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block;
}
.location-section__map:has(.studio-photos) iframe {
  flex: 1; min-height: 220px;
}
.location-section__map iframe {
  display: block; width: 100%; height: 420px; border: none;
  filter: grayscale(1) invert(1) contrast(.85) brightness(.7);
}

/* ═══════════════════════════════════════════
   SESSIONS OVERVIEW GRID (top of sessions page)
═══════════════════════════════════════════ */
.sessions-overview {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 1px; background: var(--grey-dark);
  border-bottom: 1px solid var(--grey-dark);
}
.session-thumb {
  background: var(--dark);
  padding: 36px 32px;
  display: flex; flex-direction: column; gap: 10px;
  transition: background .2s; text-decoration: none; color: inherit;
}
.session-thumb:hover { background: var(--charcoal); }
.session-thumb__num {
  font-family: var(--font-display);
  font-size: 40px; font-weight: 300; color: var(--grey-dark);
  line-height: 1; margin-bottom: -4px;
}
.session-thumb__name {
  font-family: var(--font-display);
  font-size: clamp(18px, 2vw, 26px); font-weight: 300; color: var(--white);
}
.session-thumb__price {
  font-family: var(--font-body);
  font-size: 12px; font-weight: 400;
  color: var(--grey-pale); letter-spacing: .05em;
}
.session-thumb__detail {
  font-family: var(--font-body);
  font-size: 12px; font-weight: 300;
  color: var(--grey-mid); line-height: 1.6;
}

/* ═══════════════════════════════════════════
   COMMERCIAL STRIP (portfolio page)
═══════════════════════════════════════════ */
.commercial-strip {
  background: var(--dark);
  border-top: 1px solid var(--grey-dark);
  padding: 80px 56px;
  display: flex; align-items: center;
  justify-content: space-between; gap: 48px;
}
.commercial-strip__text {}
.commercial-strip__eyebrow { margin-bottom: 16px; }
.commercial-strip__heading {
  font-family: var(--font-display);
  font-size: clamp(30px, 3.5vw, 52px);
  font-weight: 300; line-height: 1.1; color: var(--white);
  margin-bottom: 16px;
}
.commercial-strip__heading em { font-style: italic; }
.commercial-strip__body {
  font-family: var(--font-body);
  font-size: 15px; font-weight: 300;
  color: var(--grey-light); line-height: 1.9;
  max-width: 520px;
}
.commercial-strip__cta { flex-shrink: 0; }

/* ═══════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════ */
/* ═══════════════════════════════════════════
   FINE ART PRINTS — Homepage Preview
═══════════════════════════════════════════ */
.prints-preview {
  padding: 100px 56px;
  border-top: 1px solid var(--grey-dark);
}
.prints-preview__header {
  display: flex; align-items: flex-start; justify-content: space-between;
  margin-bottom: 24px;
}
.prints-preview__heading {
  font-family: var(--font-display);
  font-size: clamp(36px, 4vw, 60px);
  font-weight: 300; font-style: italic; color: var(--white);
}
.prints-preview__sub {
  font-family: var(--font-body);
  font-size: 15px; font-weight: 300; line-height: 1.9;
  color: var(--grey-light); max-width: 680px;
  margin-bottom: 56px;
}
.prints-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 3px;
}
.print-tile {
  position: relative; aspect-ratio: 3/4;
  overflow: hidden; display: block; cursor: pointer;
}
.print-tile img {
  width: 100%; height: 100%; object-fit: cover;
  filter: brightness(.75) grayscale(15%);
  transition: transform .7s ease, filter .5s ease;
}
.print-tile:hover img { transform: scale(1.05); filter: brightness(.9) grayscale(0%); }
.print-tile__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.88) 0%, transparent 55%);
}
.print-tile__label {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 24px 20px;
  display: flex; flex-direction: column; gap: 5px;
}
.print-tile__name {
  font-family: var(--font-display);
  font-size: clamp(16px, 1.6vw, 22px);
  font-weight: 300; font-style: italic; color: var(--white);
}
.print-tile__sub {
  font-family: var(--font-body);
  font-size: 9px; font-weight: 400;
  letter-spacing: var(--ls-wide); text-transform: uppercase;
  color: rgba(255,255,255,.5);
}

/* ═══════════════════════════════════════════
   FINE ART PRINTS — Dedicated Page
═══════════════════════════════════════════ */
/* ═══════════════════════════════════════════
   SERIES BOXES GRID
═══════════════════════════════════════════ */
.series-boxes-section { padding: 0 56px 80px; }
.series-boxes-header { padding: 56px 0 40px; border-bottom: 1px solid var(--grey-dark); margin-bottom: 3px; }
.series-boxes-heading {
  font-family: var(--font-display);
  font-size: clamp(36px, 4vw, 60px);
  font-weight: 300; font-style: italic; color: var(--white);
}
/* ── SERIES BOX GRID ────────────────────── */
.series-boxes-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 3px;
}
.series-box {
  background: #191919; cursor: pointer; overflow: hidden;
  transition: background .3s;
}
.series-box:hover { background: #1f1f1f; }
.series-box--upcoming { opacity: .7; }
.series-box__mat {
  position: relative; padding: 16px 16px 0; overflow: hidden;
}
.series-box__img {
  width: 100%; aspect-ratio: 4/5; object-fit: cover; display: block;
  transition: transform .7s cubic-bezier(.25,.46,.45,.94);
}
.series-box:hover .series-box__img { transform: scale(1.04); }
.series-box__placeholder {
  aspect-ratio: 3/4; background: #282828;
  display: flex; align-items: center; justify-content: center;
}
.series-box__placeholder span {
  font-family: var(--font-display); font-style: italic;
  font-size: clamp(18px, 2vw, 28px); color: #383838; font-weight: 300;
  text-align: center; padding: 20px;
}
.series-box__hover {
  position: absolute; inset: 16px 16px 0;
  background: rgba(0,0,0,.55);
  display: flex; align-items: center; justify-content: center;
  opacity: 0; transition: opacity .35s;
}
.series-box:hover .series-box__hover { opacity: 1; }
.series-box__hover span {
  font-family: var(--font-body); font-size: 10px; font-weight: 400;
  letter-spacing: var(--ls-xwide); text-transform: uppercase; color: var(--white);
  border-bottom: 1px solid rgba(255,255,255,.4); padding-bottom: 4px;
}
.series-box__meta { padding: 14px 16px 20px; }
.series-box__edition {
  display: block; font-family: var(--font-body); font-size: 9px; font-weight: 400;
  letter-spacing: var(--ls-xwide); text-transform: uppercase; color: var(--grey-mid);
  margin-bottom: 8px;
}
.series-box__name {
  font-family: var(--font-display);
  font-size: clamp(20px, 2vw, 30px);
  font-weight: 300; font-style: italic; color: var(--white); line-height: 1.2; margin: 0;
}

/* ── SERIES MODAL ───────────────────────── */
.series-modal {
  position: fixed; inset: 0; z-index: 9000;
  background: rgba(0,0,0,.92);
  display: none; align-items: center; justify-content: center;
  padding: 24px;
}
.series-modal.is-open { display: flex; }
.series-modal__panel {
  background: var(--black); border: 1px solid var(--grey-dark);
  width: 100%; max-width: 1300px; height: 90vh;
  position: relative; display: flex; flex-direction: column;
  overflow: hidden;
}
.series-modal__close {
  position: absolute; top: 16px; right: 20px; z-index: 10;
  background: none; border: none; color: var(--grey-light);
  font-size: 20px; cursor: pointer; line-height: 1;
  transition: color .2s; padding: 4px 8px;
}
.series-modal__close:hover { color: var(--white); }
.series-modal__layout {
  display: grid; grid-template-columns: 3fr 2fr;
  flex: 1; overflow: hidden;
}
/* LEFT — image viewer */
.series-modal__left {
  display: flex; flex-direction: column;
  overflow: hidden; border-right: 1px solid var(--grey-dark);
  background: #0d0d0d;
}
.series-modal__featured {
  flex: 1; overflow: hidden; position: relative;
  display: flex; align-items: center; justify-content: center;
  min-height: 0;
}
.series-modal__feat-img {
  max-width: 100%; max-height: 100%;
  object-fit: contain; display: block;
  transition: opacity .25s;
}
.series-modal__img-prev,
.series-modal__img-next {
  position: absolute; top: 50%; transform: translateY(-50%);
  background: rgba(0,0,0,.5); border: none; color: var(--white);
  font-size: 28px; line-height: 1; padding: 12px 16px;
  cursor: pointer; opacity: 0; transition: opacity .2s;
  z-index: 2;
}
.series-modal__img-prev { left: 0; }
.series-modal__img-next { right: 0; }
.series-modal__left:hover .series-modal__img-prev,
.series-modal__left:hover .series-modal__img-next { opacity: 1; }
.series-modal__img-prev:hover,
.series-modal__img-next:hover { background: rgba(0,0,0,.85); }
.series-modal__thumbs-wrap {
  flex-shrink: 0; overflow-x: auto; background: #0a0a0a;
  border-top: 1px solid var(--grey-dark);
  scrollbar-width: thin; scrollbar-color: var(--grey-dark) transparent;
}
.series-modal__thumbs {
  display: flex; gap: 2px; padding: 6px;
  min-width: min-content;
}
.series-modal__thumb {
  flex-shrink: 0; border: 2px solid transparent;
  padding: 0; background: none; cursor: pointer;
  transition: border-color .2s;
}
.series-modal__thumb img {
  width: 76px; height: 76px; object-fit: cover; display: block;
  opacity: .65; transition: opacity .2s;
}
.series-modal__thumb:hover img { opacity: .9; }
.series-modal__thumb.active { border-color: var(--white); }
.series-modal__thumb.active img { opacity: 1; }
/* RIGHT — info + shop */
.series-modal__right {
  overflow-y: auto; padding: 48px 40px;
  scrollbar-width: thin; scrollbar-color: var(--grey-dark) transparent;
}
.series-modal__series-label { color: var(--grey-mid); margin-bottom: 16px; }
.series-modal__name {
  font-family: var(--font-display);
  font-size: clamp(24px, 2.5vw, 40px);
  font-weight: 300; font-style: italic; color: var(--white);
  margin-bottom: 12px; line-height: 1.15;
}
.series-modal__tag {
  font-family: var(--font-body); font-size: 13px; font-weight: 300;
  color: var(--grey-light); line-height: 1.6; margin-bottom: 24px;
}
.series-modal__desc {
  font-family: var(--font-body); font-size: 14px; font-weight: 300;
  line-height: 1.9; color: var(--grey-mid); margin-bottom: 0;
}
/* Shop widget (within modal) */
.series-modal__shop {
  margin-top: 36px; padding-top: 32px; border-top: 1px solid var(--grey-dark);
}
.series-modal__edition {
  font-family: var(--font-body); font-size: 10px; font-weight: 400;
  letter-spacing: var(--ls-xwide); text-transform: uppercase; color: #c9a96e;
  margin-bottom: 24px; display: block;
}
.print-shop__field { margin-bottom: 18px; }
.print-shop__label {
  display: block; font-family: var(--font-body); font-size: 10px; font-weight: 400;
  letter-spacing: var(--ls-wide); text-transform: uppercase; color: var(--grey-mid);
  margin-bottom: 10px;
}
.print-shop__select {
  width: 100%; appearance: none; -webkit-appearance: none;
  background: #161616 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23888' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 16px center;
  border: 1px solid var(--grey-dark); color: var(--white);
  font-family: var(--font-body); font-size: 13px; font-weight: 300;
  padding: 13px 44px 13px 16px; cursor: pointer; transition: border-color .2s;
}
.print-shop__select:hover,
.print-shop__select:focus { border-color: var(--grey-mid); outline: none; }
.print-shop__btn {
  display: block; width: 100%; text-align: center;
  font-family: var(--font-body); font-size: 11px; font-weight: 400;
  letter-spacing: var(--ls-xwide); text-transform: uppercase;
  color: var(--black); background: var(--white);
  padding: 18px 32px; margin-top: 24px;
  transition: background .2s, color .2s; cursor: pointer; text-decoration: none;
}
.print-shop__btn:hover { background: var(--grey-light); }
.print-shop__note {
  font-family: var(--font-body); font-size: 11px; font-weight: 300;
  color: var(--grey-mid); text-align: center; margin-top: 12px; line-height: 1.6;
}
.print-shop__coming-soon {
  font-family: var(--font-body); font-size: 14px; font-weight: 300;
  color: var(--grey-light); line-height: 1.8; margin-top: 36px;
  padding-top: 32px; border-top: 1px solid var(--grey-dark);
}
.print-quality {
  background: var(--charcoal); padding: 100px 56px;
  border-top: 1px solid var(--grey-dark);
}
.print-quality__heading {
  font-family: var(--font-display);
  font-size: clamp(36px, 4vw, 56px);
  font-weight: 300; font-style: italic; color: var(--white); margin-bottom: 24px;
}
.print-quality__body {
  font-family: var(--font-body); font-size: 15px; font-weight: 300;
  line-height: 1.9; color: var(--grey-light); max-width: 720px; margin-bottom: 64px;
}
.print-quality__grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--grey-dark);
}
.print-quality__item { padding: 40px 32px 40px 0; border-right: 1px solid var(--grey-dark); margin-right: 32px; }
.print-quality__item:last-child { border-right: none; margin-right: 0; }
.print-quality__item-title {
  font-family: var(--font-body); font-size: 10px; font-weight: 400;
  letter-spacing: var(--ls-xwide); text-transform: uppercase; color: var(--white); margin-bottom: 16px;
}
.print-quality__item p {
  font-family: var(--font-body); font-size: 13px; font-weight: 300; line-height: 1.8; color: var(--grey-light);
}
.print-cta { padding: 100px 56px; text-align: center; border-top: 1px solid var(--grey-dark); }
.print-cta__heading {
  font-family: var(--font-display);
  font-size: clamp(36px, 4vw, 60px);
  font-weight: 300; font-style: italic; color: var(--white); margin-bottom: 24px;
}
.print-cta__body {
  font-family: var(--font-body); font-size: 15px; font-weight: 300; line-height: 1.9;
  color: var(--grey-light); max-width: 560px; margin: 0 auto 48px;
}
.print-cta__actions { display: flex; align-items: center; justify-content: center; gap: 40px; flex-wrap: wrap; }
.link-subtle {
  font-family: var(--font-body); font-size: 10px; font-weight: 400;
  letter-spacing: var(--ls-wide); text-transform: uppercase; color: var(--grey-mid);
  border-bottom: 1px solid var(--grey-dark); padding-bottom: 2px;
  transition: color .2s, border-color .2s;
}
.link-subtle:hover { color: var(--white); border-color: var(--white); }

@media (max-width: 960px) {
  .nav, .nav.scrolled { padding: 22px 28px; }
  .rule { margin: 0 28px; }
  .page-hero { padding: 0 28px 48px; }
  .footer { flex-direction: column; padding: 36px 28px; text-align: center; }
  .footer__links { flex-wrap: wrap; justify-content: center; }
  .masonry { columns: 2; }
  .filter-bar { padding: 32px 28px 24px; gap: 24px; }
  .gallery { padding: 32px 28px 60px; }
  .session-panel__inner { grid-template-columns: 44px 1fr auto; gap: 20px; padding: 32px 28px; }
  .session-panel:hover .session-panel__inner { padding-left: 40px; }
  .hero__content { left: 28px; right: 56px; bottom: 56px; } .hero__scroll { right: 28px; }
  .intro { grid-template-columns: 1fr; padding: 72px 28px; gap: 36px; }
  .portfolio { padding: 60px 28px; } .grid { grid-template-columns: 1fr 1fr; }
  .grid__cell--tall { grid-row: span 1; } .grid__cell img, .grid__cell--tall img { min-height: 240px; }
  .split, .split--flip { grid-template-columns: 1fr; } .split__content { padding: 60px 28px; }
  .split--flip .split__img { order: -1; } .sessions__header { padding: 72px 28px 48px; } .sessions__header--img { padding: 100px 28px 80px; }
  .process__intro { grid-template-columns: 1fr; padding: 72px 28px 56px; gap: 36px; }
  .process__strip { grid-template-columns: 1fr 1fr; } .process__step:nth-child(2n) { border-right: none; }
  .process__step:nth-child(n+3) { border-top: 1px solid var(--grey-dark); }
  .process__cta { flex-direction: column; text-align: center; padding: 48px 28px; }
  .workshops { padding: 80px 28px; } .workshops__grid { grid-template-columns: 1fr; }
  .contact-strip { grid-template-columns: 1fr; padding: 80px 28px; gap: 56px; }
  .z-session { min-height: auto; }
  .z-session__card, .z-workshop__card { width: 100%; max-width: 100%; margin: 60px 28px; padding: 48px 32px; }
  .z-session:nth-child(odd), .z-session:nth-child(even) { justify-content: flex-start; }
  .z-workshop:nth-child(odd), .z-workshop:nth-child(even) { justify-content: flex-start; }
  .z-session__bg, .z-workshop__bg { background-attachment: scroll; }
  .addons { padding: 60px 28px; } .addons__grid { grid-template-columns: 1fr 1fr; }
  .faq { padding: 60px 28px; }
  .coaching-section { grid-template-columns: 1fr; padding: 72px 28px; gap: 48px; }
  .coaching-section__img { order: -1; }
  .contact-top { grid-template-columns: 1fr; }
  .contact-form-col { padding: 72px 28px 60px; border-right: none; border-bottom: 1px solid var(--grey-dark); }
  .contact-book-col { padding: 64px 28px 72px; }
  .form-row { grid-template-columns: 1fr; gap: 0; }
  .contact-info-bar { grid-template-columns: 1fr 1fr; }
  .info-tile:nth-child(2n) { border-right: none; }
  .info-tile:nth-child(n+3) { border-top: 1px solid var(--grey-dark); }
  .seo-intro { padding: 60px 28px; }
  .cat-grid { grid-template-columns: repeat(2, 1fr); padding: 0 28px 48px; }
  .cat-grid .cat-tile:last-child { grid-column: span 2; aspect-ratio: 2/1; }
  .testimonials-section { padding: 72px 28px; }
  .review-cards { grid-template-columns: repeat(2, 1fr); }
  .location-section { grid-template-columns: 1fr; padding: 72px 28px; gap: 48px; }
  .sessions-overview { grid-template-columns: repeat(2, 1fr); }
  .commercial-strip { flex-direction: column; align-items: flex-start; padding: 60px 28px; }
}
@media (max-width: 560px) {
  .review-cards { grid-template-columns: 1fr; }
  .nav__phone { display: none; }
  .masonry { columns: 1; }
  .filter-bar { gap: 16px; }
  .session-panel__num { display: none; }
  .session-panel__inner { grid-template-columns: 1fr auto; gap: 16px; }
  .hero__title { font-size: clamp(48px,14vw,80px); }
  .grid { grid-template-columns: 1fr; }
  .process__strip { grid-template-columns: 1fr; } .process__step { border-right: none; border-top: 1px solid var(--grey-dark); }
  .z-session__card, .z-workshop__card { margin: 40px 16px; padding: 36px 24px; }
  .addons__grid { grid-template-columns: 1fr; }
  .contact-info-bar { grid-template-columns: 1fr; }
  .info-tile { border-right: none; border-top: 1px solid var(--grey-dark); }
  .info-tile:first-child { border-top: none; }
  .sessions-overview { grid-template-columns: 1fr; }
  .cat-grid { grid-template-columns: repeat(2, 1fr); gap: 2px; }
  .nav__logo img { height: 52px; }
  .page-seo-intro { padding: 32px 28px; }
  .series-boxes-section { padding: 0 0 60px; }
  .series-boxes-header { padding: 40px 24px 28px; }
  .series-boxes-grid { grid-template-columns: 1fr 1fr; gap: 2px; }
  .series-box__mat { padding: 10px 10px 0; }
  .series-box__hover { inset: 10px 10px 0; }
  .series-box__meta { padding: 10px 10px 14px; }
  .series-box__name { font-size: 14px; }
  .series-modal { padding: 0; }
  .series-modal__panel { width: 100%; height: 100vh; border: none; }
  .series-modal__layout { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
  .series-modal__left { border-right: none; border-bottom: 1px solid var(--grey-dark); max-height: 55vh; }
  .series-modal__right { padding: 28px 24px 48px; }
  .series-modal__thumb img { width: 60px; height: 60px; }
  .print-quality__grid { grid-template-columns: 1fr; }
  .print-cta { padding: 72px 28px; }
  .prints-preview { padding: 80px 28px; }
  .prints-grid { grid-template-columns: 1fr 1fr; gap: 3px; }
}

/* ══════════════════════════════════════════════
   AWARDS & RECOGNITION (About page)
══════════════════════════════════════════════ */
.about-awards {
  background: var(--black);
  padding: 96px 48px;
  border-top: 1px solid rgba(255,255,255,.08);
}
.about-awards__inner {
  max-width: 860px;
  margin: 0 auto;
}
.about-awards__heading {
  font-family: var(--font-serif);
  font-size: clamp(28px, 4vw, 44px);
  font-weight: 300;
  color: var(--white);
  margin-bottom: 56px;
  line-height: 1.15;
}
.about-awards__heading em {
  font-style: italic;
  color: rgba(255,255,255,.55);
}
.about-awards__list {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.award-row {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 0 40px;
  align-items: start;
  padding: 28px 0;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.award-row:first-child { border-top: 1px solid rgba(255,255,255,.08); }
.award-row__year {
  font-family: var(--font-sans);
  font-size: 12px;
  letter-spacing: .12em;
  color: rgba(255,255,255,.4);
  text-transform: uppercase;
  padding-top: 3px;
}
.award-row__body {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.award-row__name {
  font-family: var(--font-serif);
  font-size: clamp(17px, 2.2vw, 22px);
  font-weight: 300;
  color: var(--white);
  line-height: 1.25;
}
.award-row__detail {
  font-family: var(--font-sans);
  font-size: 12px;
  letter-spacing: .06em;
  color: rgba(255,255,255,.4);
}
@media (max-width: 600px) {
  .about-awards { padding: 72px 28px; }
  .award-row { grid-template-columns: 1fr; gap: 6px 0; }
  .award-row__year { padding-top: 0; }
}

/* ══════════════════════════════════════════════
   NAV CART ICON (WooCommerce)
══════════════════════════════════════════════ */
.nav__cart {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white);
  text-decoration: none;
  margin-left: 14px;
  width: 28px;
  height: 28px;
  transition: opacity .2s;
}
.nav__cart:hover { opacity: .75; }
.nav__cart-icon {
  width: 22px;
  height: 22px;
  display: block;
}
.nav__cart-count {
  position: absolute;
  top: -5px;
  right: -7px;
  background: #c9a96e;
  color: #000;
  font-family: var(--font-sans, 'Raleway', sans-serif);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0;
  min-width: 16px;
  height: 16px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 3px;
  line-height: 1;
}

/* ══════════════════════════════════════════════
   WOOCOMMERCE PAGE WRAPPER
══════════════════════════════════════════════ */
.woo-wrap {
  background: var(--black);
  min-height: 60vh;
  padding: 80px 0 120px;
}
.woo-wrap__inner {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 32px;
  color: var(--white);
}

/* ── WooCommerce Reset for dark theme ── */
.woo-wrap__inner * { box-sizing: border-box; }

/* Notices */
.woo-wrap__inner .woocommerce-message,
.woo-wrap__inner .woocommerce-info,
.woo-wrap__inner .woocommerce-error {
  background: rgba(255,255,255,.06);
  border-top: 4px solid #c9a96e;
  color: var(--white);
  padding: 16px 24px;
  margin-bottom: 32px;
  list-style: none;
  font-family: var(--font-sans, 'Raleway', sans-serif);
  font-size: 14px;
}
.woo-wrap__inner .woocommerce-error { border-top-color: #e55; }

/* Page headings */
.woo-wrap__inner h1,
.woo-wrap__inner h2,
.woo-wrap__inner h3 {
  font-family: var(--font-serif, 'Bodoni Moda', serif);
  color: var(--white);
  font-weight: 300;
  margin-bottom: 24px;
}

/* Cart table */
.woo-wrap__inner .shop_table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 40px;
  font-family: var(--font-sans, 'Raleway', sans-serif);
  font-size: 14px;
}
.woo-wrap__inner .shop_table th {
  text-align: left;
  padding: 12px 16px;
  color: rgba(255,255,255,.5);
  font-weight: 400;
  letter-spacing: .1em;
  text-transform: uppercase;
  font-size: 11px;
  border-bottom: 1px solid rgba(255,255,255,.1);
}
.woo-wrap__inner .shop_table td {
  padding: 20px 16px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  color: var(--white);
  vertical-align: middle;
}
.woo-wrap__inner .shop_table .product-name a { color: var(--white); text-decoration: none; }
.woo-wrap__inner .shop_table .product-name a:hover { opacity: .7; }
.woo-wrap__inner .shop_table .product-thumbnail img { width: 80px; height: 80px; object-fit: cover; }

/* Cart item meta (Series, Finish) */
.woo-wrap__inner .wc-item-meta,
.woo-wrap__inner .woocommerce-cart-form .cart_item .variation { color: rgba(255,255,255,.6); font-size: 12px; margin-top: 4px; }
.woo-wrap__inner .wc-item-meta dt,
.woo-wrap__inner .wc-item-meta dd { display: inline; margin: 0; }
.woo-wrap__inner .wc-item-meta dd::before { content: ': '; }
.woo-wrap__inner .wc-item-meta li { margin-bottom: 2px; }

/* Quantity input */
.woo-wrap__inner .quantity .qty {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.15);
  color: var(--white);
  padding: 8px 12px;
  width: 64px;
  text-align: center;
  font-family: var(--font-sans, 'Raleway', sans-serif);
  font-size: 14px;
}

/* Update/remove buttons */
.woo-wrap__inner .button,
.woo-wrap__inner button[type="submit"] {
  background: transparent;
  border: 1px solid rgba(255,255,255,.4);
  color: var(--white);
  padding: 12px 28px;
  font-family: var(--font-sans, 'Raleway', sans-serif);
  font-size: 11px;
  letter-spacing: .15em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background .2s, border-color .2s;
  text-decoration: none;
  display: inline-block;
}
.woo-wrap__inner .button:hover,
.woo-wrap__inner button[type="submit"]:hover {
  background: rgba(255,255,255,.08);
  border-color: var(--white);
}

/* Checkout / proceed button */
.woo-wrap__inner .checkout-button,
.woo-wrap__inner .wc-proceed-to-checkout .checkout-button {
  background: #c9a96e !important;
  border-color: #c9a96e !important;
  color: #000 !important;
  padding: 16px 40px;
  font-weight: 600;
  letter-spacing: .12em;
  width: 100%;
  text-align: center;
  margin-top: 12px;
}
.woo-wrap__inner .checkout-button:hover {
  background: #b8956a !important;
  border-color: #b8956a !important;
}

/* Cart totals box */
.woo-wrap__inner .cart_totals,
.woo-wrap__inner .order-total {
  background: rgba(255,255,255,.04);
  padding: 24px;
  border: 1px solid rgba(255,255,255,.1);
}
.woo-wrap__inner .cart_totals h2 { font-size: 18px; margin-bottom: 16px; }
.woo-wrap__inner .cart_totals .shop_table th,
.woo-wrap__inner .cart_totals .shop_table td { padding: 10px 0; }
.woo-wrap__inner .order-total td strong { color: #c9a96e; font-size: 18px; }

/* Coupon / input fields */
.woo-wrap__inner input[type="text"],
.woo-wrap__inner input[type="email"],
.woo-wrap__inner input[type="tel"],
.woo-wrap__inner input[type="number"],
.woo-wrap__inner input[type="password"],
.woo-wrap__inner select,
.woo-wrap__inner textarea {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.18);
  color: var(--white);
  padding: 12px 16px;
  width: 100%;
  font-family: var(--font-sans, 'Raleway', sans-serif);
  font-size: 14px;
  margin-bottom: 16px;
}
.woo-wrap__inner input::placeholder,
.woo-wrap__inner textarea::placeholder { color: rgba(255,255,255,.35); }
.woo-wrap__inner label { color: rgba(255,255,255,.7); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 6px; display: block; }

/* Checkout form layout */
.woo-wrap__inner .woocommerce-checkout #customer_details { display: grid; grid-template-columns: 1fr 1fr; gap: 0 40px; }
@media (max-width: 640px) { .woo-wrap__inner .woocommerce-checkout #customer_details { grid-template-columns: 1fr; } }

/* Payment box */
.woo-wrap__inner #payment {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.1);
  padding: 24px;
  margin-top: 32px;
}
.woo-wrap__inner #payment ul.payment_methods li label { color: var(--white); text-transform: none; font-size: 14px; letter-spacing: 0; }
.woo-wrap__inner #payment .payment_box { background: rgba(255,255,255,.06); color: rgba(255,255,255,.8); padding: 16px; font-size: 13px; margin-top: 8px; }
.woo-wrap__inner #payment .place-order .button { background: #c9a96e; border-color: #c9a96e; color: #000; width: 100%; text-align: center; padding: 18px; font-size: 13px; }
.woo-wrap__inner #payment .place-order .button:hover { background: #b8956a; border-color: #b8956a; }

/* Remove link */
.woo-wrap__inner .product-remove a.remove { color: rgba(255,255,255,.4) !important; font-size: 20px; text-decoration: none; line-height: 1; }
.woo-wrap__inner .product-remove a.remove:hover { color: #e55 !important; }

/* Empty cart */
.woo-wrap__inner .cart-empty { font-family: var(--font-serif, 'Bodoni Moda', serif); font-size: 22px; font-weight: 300; color: rgba(255,255,255,.6); margin-bottom: 24px; }
.woo-wrap__inner .return-to-shop .button { margin-top: 0; }


/* ═══════════════════════════════════════════
   CORE TEMPLATES
   Styles for page.php, single.php, archive.php,
   search.php, index.php and 404.php. Added when
   those templates were introduced; before that
   anything outside the seven page-*.php files
   had no template and no styling at all.
   ═══════════════════════════════════════════ */

/* ── Long-form content (pages and posts) ── */
.entry { padding: 80px 56px 120px; }
.entry__inner {
  max-width: 760px; margin: 0 auto;
  font-family: var(--font-body);
  font-size: 16px; font-weight: 300; line-height: 1.85;
  color: var(--grey-pale);
}
.entry__inner > * + * { margin-top: 26px; }
.entry__inner h2,
.entry__inner h3,
.entry__inner h4 {
  font-family: var(--font-display);
  font-weight: 300; color: var(--white);
  line-height: 1.2; margin-top: 56px;
}
.entry__inner h2 { font-size: clamp(28px, 3.4vw, 40px); }
.entry__inner h3 { font-size: clamp(22px, 2.6vw, 30px); }
.entry__inner h4 { font-size: 20px; }
.entry__inner h5,
.entry__inner h6 {
  font-family: var(--font-body); color: var(--white);
  font-size: 12px; font-weight: 500;
  letter-spacing: var(--ls-wide); text-transform: uppercase;
  margin-top: 44px;
}
.entry__inner a { color: var(--white); border-bottom: 1px solid rgba(255,255,255,.35); transition: border-color .2s; }
.entry__inner a:hover { border-bottom-color: var(--white); }
.entry__inner strong { color: var(--white); font-weight: 500; }
.entry__inner em { font-style: italic; }
/* the global reset removes list markers, restore them inside content */
.entry__inner ul,
.entry__inner ol { padding-left: 22px; }
.entry__inner ul { list-style: disc; }
.entry__inner ol { list-style: decimal; }
.entry__inner li { margin-bottom: 10px; }
.entry__inner li::marker { color: var(--grey-mid); }
.entry__inner blockquote {
  border-left: 2px solid var(--grey-dark);
  padding-left: 28px; margin-left: 0;
  font-family: var(--font-display); font-style: italic;
  font-size: 22px; line-height: 1.5; color: var(--white);
}
.entry__inner img,
.entry__inner figure img { width: 100%; height: auto; display: block; }
/* Photographs carry the blog, so they get more room than a paragraph break. */
.entry__figure { margin: 0; }
.entry__inner > * + .entry__figure,
.entry__inner > .entry__figure + * { margin-top: 48px; }
/* The old audition page repeated its booking button after every section
   rather than only at the end, because a visitor decides at different points:
   after the price, after the add-ons, after the questions. Migrating the copy
   without those buttons moved the only way to book to the bottom of a long
   page. */
.entry__book { margin: 44px 0; text-align: center; }
.entry__book .btn-ghost { padding: 16px 38px; }

/* Vimeo reels sit in the copy the same way a photograph does. The wrapper
   holds the shape so the iframe cannot push the page sideways on a phone. */
.entry__video { margin: 0; }
.entry__inner > * + .entry__video,
.entry__inner > .entry__video + * { margin-top: 48px; }
.entry__video__frame {
  position: relative; width: 100%; aspect-ratio: 16 / 9;
  background: var(--charcoal); overflow: hidden;
}
.entry__video__frame iframe {
  position: absolute; inset: 0;
  width: 100%; height: 100%; border: 0; display: block;
}
.entry__inner figcaption {
  font-size: 11px; letter-spacing: var(--ls-med);
  text-transform: uppercase; color: var(--grey-mid);
  margin-top: 10px; text-align: center;
}
.entry__inner hr { border: 0; height: 1px; background: var(--grey-dark); margin: 56px 0; }
.entry__inner code {
  font-family: Consolas, Monaco, monospace; font-size: 13px;
  background: var(--charcoal); padding: 2px 6px;
}
.entry__inner pre {
  background: var(--charcoal); padding: 20px; overflow-x: auto;
  font-family: Consolas, Monaco, monospace; font-size: 13px;
}
.entry__inner table { width: 100%; border-collapse: collapse; font-size: 14px; }
.entry__inner th,
.entry__inner td { border: 1px solid var(--grey-dark); padding: 10px 14px; text-align: left; }
.entry__inner th { color: var(--white); font-weight: 500; }
.entry__pagination { margin-top: 48px; display: flex; gap: 12px; align-items: center; }

/* WooCommerce cart and checkout land on page.php, give them a heading */
.woo-wrap__title {
  font-family: var(--font-display); font-weight: 300;
  font-size: clamp(32px, 4vw, 52px); color: var(--white);
  margin-bottom: 40px;
}

/* ── Post listings (archive, search, blog index) ── */
.listing { padding: 72px 56px 120px; }
.listing__intro {
  max-width: 760px; margin: 0 auto 56px;
  color: var(--grey-light); font-size: 15px; line-height: 1.8;
}
.listing__grid {
  display: grid; gap: 48px 36px;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
}
.listing__empty {
  text-align: center; color: var(--grey-light);
  padding: 80px 0; font-size: 16px;
}

.card__media { display: block; overflow: hidden; background: var(--charcoal); }
.card__img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; transition: transform .6s ease; }
.card__img--empty { display: block; aspect-ratio: 3 / 2; background: var(--charcoal); }
.card__media:hover .card__img { transform: scale(1.04); }
.card__body { padding-top: 20px; }
.card__meta { margin-bottom: 10px; }
.card__title {
  font-family: var(--font-display); font-weight: 300;
  font-size: 24px; line-height: 1.25; color: var(--white);
  margin-bottom: 12px;
}
.card__title a:hover { opacity: .72; }
.card__excerpt { color: var(--grey-light); font-size: 14px; line-height: 1.75; margin-bottom: 16px; }
.card__more {
  font-size: 10px; font-weight: 500;
  letter-spacing: var(--ls-wide); text-transform: uppercase;
  color: var(--white); border-bottom: 1px solid rgba(255,255,255,.3);
  padding-bottom: 3px; transition: border-color .2s;
}
.card__more:hover { border-bottom-color: var(--white); }

/* pagination produced by the_posts_pagination() */
.pagination { margin-top: 72px; display: flex; justify-content: center; }
.pagination .nav-links { display: flex; gap: 8px; flex-wrap: wrap; }
.pagination .page-numbers {
  font-family: var(--font-body); font-size: 11px; font-weight: 500;
  letter-spacing: var(--ls-med); text-transform: uppercase;
  color: var(--grey-light); border: 1px solid var(--grey-dark);
  padding: 11px 17px; transition: all .2s;
}
.pagination .page-numbers:hover,
.pagination .page-numbers.current {
  color: var(--black); background: var(--white); border-color: var(--white);
}

/* ── Single post extras ── */
.page-hero--post .page-hero__title--post { font-size: clamp(32px, 4.4vw, 62px); line-height: 1.08; }
.page-hero--archive { height: auto; min-height: 340px; padding-top: 150px; }
.post-nav {
  max-width: 760px; margin: 88px auto 0; padding-top: 40px;
  border-top: 1px solid var(--grey-dark);
  display: flex; justify-content: space-between; gap: 32px;
}
.post-nav__side { max-width: 46%; }
.post-nav__side--right { text-align: right; margin-left: auto; }
.post-nav__link {
  display: block; margin-top: 8px;
  font-family: var(--font-display); font-size: 18px;
  color: var(--white); line-height: 1.35; transition: opacity .2s;
}
.post-nav__link:hover { opacity: .7; }

/* ── 404 ── */
.notfound { padding: 140px 56px 160px; text-align: center; }
.notfound__label { margin-bottom: 22px; }
.notfound__title {
  font-family: var(--font-display); font-size: clamp(40px, 5vw, 72px);
  font-weight: 300; font-style: italic; color: var(--white); margin-bottom: 20px;
}
.notfound__text { color: var(--grey-light); font-size: 15px; margin-bottom: 40px; }
.notfound__links { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }

@media (max-width: 900px) {
  .entry   { padding: 56px 28px 88px; }
  .listing { padding: 48px 28px 88px; }
  .listing__grid { gap: 40px 24px; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
  .notfound { padding: 96px 28px 120px; }
  .post-nav { flex-direction: column; gap: 28px; }
  .post-nav__side, .post-nav__side--right { max-width: 100%; text-align: left; margin-left: 0; }
  .entry__inner h2 { margin-top: 44px; }
}

/* ═══════════════════════════════════════════
   TOUCH TARGETS

   Measured on a phone: the menu button was 30 by 21 and the cart icon 28 by
   28, both well under the 44 by 44 a thumb needs, and they are the two
   controls every mobile visitor has to hit. The close button on the booking
   modal and the links in the social lists were the same story.

   The fix is hit area only. Each control keeps the size it is drawn at, and
   an invisible box centred on it takes the tap, so nothing in the layout
   moves and the design is unchanged.
   ═══════════════════════════════════════════ */
.burger,
.nav__cart,
.acuity-modal__close { position: relative; }

.burger::after,
.nav__cart::after,
.acuity-modal__close::after {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 44px; height: 44px;
}

/* Inline links in the social lists collapsed to a ten pixel tall box. */
.social-links a,
.footer__social a {
  display: inline-block;
  padding: 8px 0;
}
.social-links { gap: 2px; }

@media (max-width: 900px) {
  /* The portfolio filters sat at 24px tall. */
  .filter-btn { padding: 12px 0; }
}

/* ═══════════════════════════════════════════
   CLOSING CALL TO ACTION

   Pages and posts used to end on the last paragraph. On most of them there
   was no link in the body at all, so a visitor who read to the bottom had
   nowhere to go.
   ═══════════════════════════════════════════ */
.entry-cta {
  border-top: 1px solid var(--grey-dark);
  padding: clamp(56px, 9vw, 104px) 24px clamp(64px, 10vw, 120px);
  text-align: center;
}
.entry-cta__inner { max-width: 640px; margin: 0 auto; }
.entry-cta__label { margin-bottom: 18px; }
.entry-cta__title {
  font-family: var(--font-display);
  font-size: clamp(30px, 4.6vw, 52px);
  font-weight: 300; line-height: 1.05;
  color: var(--white);
  margin-bottom: 18px;
}
.entry-cta__title em { font-style: italic; }
.entry-cta__text {
  color: var(--grey-light);
  font-size: 15px; line-height: 1.75;
  margin-bottom: 34px;
}
.entry-cta__actions {
  display: flex; flex-wrap: wrap; gap: 14px;
  align-items: center; justify-content: center;
}
.entry-cta__phone {
  margin-top: 26px;
  font-size: 12px; letter-spacing: var(--ls-med);
  text-transform: uppercase; color: var(--grey-mid);
}
.entry-cta__phone a { color: var(--white); border-bottom: 1px solid rgba(255,255,255,.35); }
.entry-cta__phone a:hover { border-bottom-color: var(--white); }

@media (max-width: 560px) {
  .entry-cta__actions { flex-direction: column; align-items: stretch; }
  .entry-cta__actions .btn-ghost { text-align: center; }
}

/* ═══════════════════════════════════════════
   ACUITY BOOKING MODAL
   ═══════════════════════════════════════════ */
.acuity-modal {
  position: fixed; inset: 0; z-index: 400;
  background: rgba(0,0,0,.88);
  display: flex; align-items: center; justify-content: center;
  padding: 40px 24px;
}
.acuity-modal:not([hidden]) {
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}
.acuity-modal__panel {
  width: 100%; max-width: 980px; height: 100%; max-height: 860px;
  background: var(--white);
  display: flex; flex-direction: column;
  box-shadow: 0 30px 80px rgba(0,0,0,.6);
}
.acuity-modal__bar {
  flex: 0 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 22px;
  background: var(--black); color: var(--white);
}
.acuity-modal__title { color: var(--grey-light); margin: 0; }
.acuity-modal__close {
  background: none; border: 0; cursor: pointer;
  color: var(--white); font-size: 30px; line-height: 1;
  padding: 0 4px; transition: opacity .2s;
}
.acuity-modal__close:hover { opacity: .6; }
.acuity-modal__body { position: relative; flex: 1 1 auto; min-height: 0; }
.acuity-modal__frame { width: 100%; height: 100%; border: 0; display: block; }
.acuity-modal__loading {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: var(--white); color: var(--grey-mid);
  font-family: var(--font-body); font-size: 12px;
  letter-spacing: var(--ls-wide); text-transform: uppercase;
}

@media (max-width: 900px) {
  .acuity-modal { padding: 0; }
  .acuity-modal__panel { max-width: 100%; max-height: 100%; }
}
/* Closed, but still laid out.
   display:none would give the iframe a zero-sized box, and Acuity decides
   its layout from the width it is handed. Keeping the box means the
   calendar can be fetched while the visitor is still moving towards the
   button, and the click only has to reveal what is already there.
   visibility:hidden also takes it out of the accessibility tree, and
   pointer-events:none keeps it from swallowing clicks on the page. */
.acuity-modal[hidden] {
  display: flex !important;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}
.acuity-modal__loading[hidden] { display: none !important; }

/* ── Contact page: general Acuity scheduler ── */
.contact-scheduler { padding: 96px 56px 0; }
.contact-scheduler__head { max-width: 640px; margin-bottom: 36px; }
.contact-scheduler__heading {
  font-family: var(--font-display); font-weight: 300;
  font-size: clamp(30px, 4vw, 48px); line-height: 1.1;
  color: var(--white); margin: 12px 0 14px;
}
.contact-scheduler__heading em { font-style: italic; }
.contact-scheduler__sub { color: var(--grey-light); font-size: 15px; line-height: 1.75; }
.contact-scheduler__frame {
  background: var(--white);
  border: 1px solid var(--grey-dark);
  overflow: hidden;
}
.contact-scheduler__frame iframe { display: block; width: 100%; border: 0; }
@media (max-width: 900px) {
  .contact-scheduler { padding: 64px 28px 0; }
}

/* ══════════════════════════════════════════════
   GIFT CARDS

   Note 8 of the developer notes. The grid follows the add-ons block on the
   Sessions page, a one pixel gap over a light background so the cards read as
   panels rather than boxes, but it auto fits instead of locking to four
   columns, because there are five cards and Ashkan may add a sixth.
══════════════════════════════════════════════ */
.giftcards { padding: 88px 56px; background: var(--charcoal); }
.giftcards__heading {
  font-family: var(--font-display);
  font-size: clamp(32px,3.5vw,50px); font-weight: 300; font-style: italic;
  color: var(--white); margin: 16px 0 52px;
}
.giftcards__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1px; background: var(--grey-dark);
}
.giftcard {
  background: var(--dark);
  padding: 40px 36px;
  display: flex; flex-direction: column;
  transition: background .2s;
}
.giftcard:hover { background: var(--charcoal); }
.giftcard__name {
  font-family: var(--font-display);
  font-size: 24px; font-weight: 300; color: var(--white);
  margin-bottom: 8px;
}
.giftcard__price {
  font-family: var(--font-body);
  font-size: 12px; font-weight: 400; letter-spacing: var(--ls-med);
  color: var(--grey-pale);
  margin-bottom: 14px;
}
.giftcard__price del { opacity: .5; margin-right: 6px; }
.giftcard__desc {
  font-family: var(--font-body);
  font-size: 13px; font-weight: 300; line-height: 1.8;
  color: var(--grey-mid);
  margin: 0 0 28px;
  flex: 1 1 auto;
}
.giftcard__btn {
  display: inline-block; align-self: flex-start;
  font-family: var(--font-body);
  font-size: 10px; font-weight: 500;
  letter-spacing: var(--ls-wide); text-transform: uppercase;
  color: var(--white);
  border: 1px solid rgba(255,255,255,.35);
  padding: 14px 30px;
  transition: all .25s;
}
.giftcard__btn:hover { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.6); }
.giftcard__more { margin-top: 18px; align-self: flex-start; font-size: 10px; }
.giftcards__empty {
  font-family: var(--font-body); font-size: 14px; font-weight: 300;
  color: var(--grey-light);
}
.giftcards__empty a { color: var(--white); border-bottom: 1px solid rgba(255,255,255,.35); }

/* ── HOW IT WORKS ── */
.giftsteps { padding: 88px 56px; background: var(--black); }
.giftsteps__heading {
  font-family: var(--font-display);
  font-size: clamp(32px,3.5vw,50px); font-weight: 300; font-style: italic;
  color: var(--white); margin: 16px 0 52px;
}
.giftsteps__list {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 48px;
}
.giftstep__n {
  display: block;
  font-family: var(--font-body);
  font-size: 11px; font-weight: 500; letter-spacing: var(--ls-wide);
  color: var(--grey-mid); margin-bottom: 14px;
}
.giftstep__title {
  font-family: var(--font-display);
  font-size: 22px; font-weight: 300; color: var(--white);
  margin: 0 0 10px;
}
.giftstep__desc {
  font-family: var(--font-body);
  font-size: 13px; font-weight: 300; line-height: 1.8;
  color: var(--grey-light); margin: 0;
}
.giftsteps__note {
  font-family: var(--font-body);
  font-size: 13px; font-weight: 300; line-height: 1.9;
  color: var(--grey-light);
  margin: 52px 0 0; max-width: 720px;
}
.giftsteps__note .link-arrow { margin-left: 10px; }

@media (max-width: 900px) {
  .giftcards, .giftsteps { padding: 60px 28px; }
  .giftsteps__list { grid-template-columns: 1fr; gap: 36px; }
}
@media (max-width: 560px) {
  .giftcards__grid { grid-template-columns: 1fr; }
}

/* ── GIFT NUDGE ON THE SESSIONS PAGE ── */
.giftnudge { padding: 88px 56px; background: var(--dark); border-top: 1px solid var(--grey-dark); }
.giftnudge__heading {
  font-family: var(--font-display);
  font-size: clamp(28px,3vw,42px); font-weight: 300; font-style: italic;
  color: var(--white); margin: 16px 0 18px;
}
.giftnudge__desc {
  font-family: var(--font-body);
  font-size: 14px; font-weight: 300; line-height: 1.9;
  color: var(--grey-light); max-width: 620px; margin: 0 0 30px;
}
@media (max-width: 900px) { .giftnudge { padding: 60px 28px; } }

/* ── INSTAGRAM STRIP ──
   Note 7. Sits above the footer. The band only renders once an account is
   connected, so these rules go unused until then. */
.igstrip { padding: 72px 56px 64px; background: var(--dark); border-top: 1px solid var(--grey-dark); text-align: center; }
.igstrip__head { margin-bottom: 36px; }
.igstrip__heading {
  font-family: var(--font-display);
  font-size: clamp(26px,2.6vw,38px); font-weight: 300; font-style: italic;
  color: var(--white); margin: 14px 0 0;
}
.igstrip__feed { margin: 0 auto; max-width: 1400px; }
.igstrip__link { margin-top: 32px; }
@media (max-width: 900px) { .igstrip { padding: 52px 28px 48px; } }