/* =========================================================================
   CITRON — design stage stylesheet (one file for all 13 screens)
   Token values are CANDIDATES measured from the reference PNGs, not final
   brand values. See plan/01_design-plan.md §1.
   Naming: l- layout / c- component / p- page / is- state / u- utility
   ========================================================================= */

/* ---------- Fonts (OFL, self-hosted: no request to external services) ---------- */
@font-face { font-family: "Playfair Display"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/playfair-display-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Source Serif 4"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/source-serif-4-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Source Serif 4"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/source-serif-4-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Source Serif 4"; font-style: italic; font-weight: 400; font-display: swap; src: url("../fonts/source-serif-4-latin-400-italic.woff2") format("woff2"); }
@font-face { font-family: "DM Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/dm-sans-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "DM Sans"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/dm-sans-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "DM Sans"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/dm-sans-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "DM Sans"; font-style: italic; font-weight: 400; font-display: swap; src: url("../fonts/dm-sans-latin-400-italic.woff2") format("woff2"); }

/* ---------- Tokens (candidates) ---------- */
:root {
  /* color — measured from reference PNGs */
  --c-bg: #FAF5F1;
  --c-surface: #FCF8F4;
  --c-surface-2: #FCFAF9;
  --c-ink: #15120F;
  --c-ink-muted: #5A534C;
  --c-line: #E5E2DF;
  --c-yellow-strong: #FDCF3E;
  --c-yellow: #FDDC8B;
  --c-yellow-soft: #FDE8B2;
  --c-yellow-tint: #FDF2D3;
  --c-yellow-border: #FDE5A2;
  --c-required: #D93537;
  --c-overlay: 53 35 14;          /* #35230E as RGB channels for gradients */
  --c-on-photo: #FFFFFF;

  /* type */
  --ff-display: "Playfair Display", Georgia, "Times New Roman", serif;   /* big headings (2026-11-12) */
  --ff-serif: "Source Serif 4", "Iowan Old Style", Georgia, serif;          /* logo, prices, quotes, leads */
  --ff-sans: "DM Sans", "Helvetica Neue", Arial, sans-serif;
  /* Playfair Display capitals are about 8% taller than Source Serif 4: 60px / 44px keep the old
     capital height of 64px / 48px (2026-11-12) */
  --fs-display: clamp(2.5rem, 1.4rem + 3.6vw, 3.75rem);
  --fs-h2: clamp(2rem, 1.3rem + 2.3vw, 2.75rem);
  --fs-h3: clamp(1.5rem, 1.25rem + .8vw, 1.875rem);
  --fs-lead: clamp(1.25rem, 1.05rem + .8vw, 1.75rem);
  --fs-body: 1.0625rem;
  --fs-small: .875rem;
  --fs-eyebrow: .8125rem;
  --lh-tight: 1.15;            /* headings: room for g/p/y above an accented capital (É, À) */
  --lh-body: 1.55;

  /* shape & space */
  --r-photo: 20px;
  --r-card: 20px;
  --r-input: 10px;
  --r-pill: 999px;
  /* widths (approved 2026-11-08, checked against a 1512px screen):
     wide blocks (hero, landscape strip, final CTA) = screen edge + --edge, max 1600px
     content cards = wide area inset by --inset on each side, max 1400px
     1512px screen -> wide blocks 24px from each edge, content 56px from each edge */
  --edge: 24px;
  --inset: 32px;
  --gutter: calc(var(--edge) + var(--inset));
  --container: 1400px;         /* content */
  --container-wide: 1600px;    /* hero, landscape strip, final CTA */
  /* vertical rhythm (approved 2026-11-08). Use these on every page.
     --space-section : visual distance between sections (last text/photo -> first text/photo)
     --space-strip   : same, around the landscape strip (a little wider, as a divider)
     --pad-card      : inner padding of cards, the reviews band, the final CTA band,
                       and top/bottom padding of card-less sections (.l-section)
     --gap-stack     : the gap between two padded boxes, derived so that
                       pad-card + gap-stack + pad-card = space-section */
  --space-section: 120px;
  --space-strip: 140px;
  --pad-card: 48px;
  --gap-stack: calc(var(--space-section) - var(--pad-card) * 2);
  --space-block: 32px;         /* between blocks inside one section (lower pages) */
  --shadow: 0 1px 2px rgb(80 60 40 / .04), 0 8px 24px rgb(80 60 40 / .06);
  --accent-w: 56px;
  --accent-h: 4px;
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
  margin: 0;
  background: var(--c-bg);
  color: var(--c-ink);
  font-family: var(--ff-sans);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
h1, h2, h3, h4 { margin: 0; font-family: var(--ff-display); font-weight: 500; line-height: var(--lh-tight); letter-spacing: -.01em; text-wrap: balance; }
p { margin: 0; }
p + p { margin-top: .8em; }
ul { margin: 0; padding: 0; list-style: none; }
:focus-visible { outline: 3px solid var(--c-ink); outline-offset: 3px; border-radius: 4px; }
[id] { scroll-margin-top: 24px; }

.u-nowrap { white-space: nowrap; }
.u-phrase { display: inline-block; }   /* one sentence of a two-sentence heading */
.u-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.c-skip { position: absolute; left: 16px; top: -100px; z-index: 100; padding: 10px 18px; background: var(--c-yellow); border-radius: var(--r-pill); font-weight: 700; text-decoration: none; }
.c-skip:focus { top: 12px; }

/* ---------- Layout ---------- */
.l-container { width: 100%; max-width: calc(var(--container) + var(--gutter) * 2); margin-inline: auto; padding-inline: var(--gutter); }
.l-container--wide { max-width: calc(var(--container-wide) + var(--edge) * 2); padding-inline: var(--edge); }
.l-container--wide > * { width: min(var(--container), 100% - var(--inset) * 2); margin-inline: auto; }
.l-container--wide > .u-wide { width: 100%; }
.l-stack > * + * { margin-top: var(--gap-stack); }
/* photo-edged blocks (hero, landscape strip) have no inner padding, so their neighbours get the padding back as margin */
.l-stack > .p-hero + * { margin-top: calc(var(--space-section) - var(--pad-card)); }
.l-stack > .p-strip,
.l-stack > .p-strip + * { margin-top: calc(var(--space-strip) - var(--pad-card)); }
.l-section { padding-block: var(--pad-card); }   /* card-less section: same vertical padding as a card */
.l-main { padding-bottom: var(--gap-stack); }    /* + footer padding-top = space-section after the last card */
.l-main--sub { padding-top: var(--gap-stack); }  /* lower pages: header -> first section */
.l-main--sub .l-stack > .l-section:first-child { padding-top: 0; }
.l-flow > * + * { margin-top: var(--space-block); }

/* ---------- Design-stage markers (removed in the theme stage) ---------- */
.c-tbd {
  display: inline-block;
  padding: .05em .55em;
  border: 1.5px dashed currentColor;
  border-radius: 6px;
  font-family: var(--ff-sans);
  font-size: .8em;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--c-ink-muted);
  vertical-align: middle;
  white-space: nowrap;
}
.c-verify {
  display: inline-block;
  margin-left: .5em;
  padding: .1em .55em;
  border-radius: var(--r-pill);
  background: var(--c-yellow-strong);
  color: var(--c-ink);
  font-family: var(--ff-sans);
  font-size: .72rem;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 0;
  vertical-align: middle;
}
.c-temp {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 2;
  padding: .2em .7em;
  border-radius: var(--r-pill);
  background: rgb(21 18 15 / .78);
  color: #fff;
  font-size: .8rem;
  font-weight: 700;
  line-height: 1.4;
}

/* ---------- Photo ---------- */
.c-photo { position: relative; margin: 0; overflow: hidden; border-radius: var(--r-photo); background: var(--c-line); }
.c-photo img { width: 100%; height: 100%; object-fit: cover; }

/* ---------- Eyebrow + accent line ---------- */
.c-eyebrow {
  font-family: var(--ff-sans);
  font-size: var(--fs-eyebrow);
  font-weight: 700;
  letter-spacing: .3em;
  text-transform: uppercase;
}
.c-accent::after {
  content: "";
  display: block;
  width: var(--accent-w);
  height: var(--accent-h);
  margin-top: 22px;
  border-radius: 2px;
  background: var(--c-yellow-strong);
}
.c-eyebrow + h2, .c-eyebrow + h1 { margin-top: 14px; }

/* ---------- Buttons ---------- */
.c-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55em;
  min-height: 48px;
  padding: .7em 1.6em;
  border: 0;
  border-radius: var(--r-pill);
  background: var(--c-yellow);
  color: var(--c-ink);
  font-family: var(--ff-sans);
  font-size: 1.0625rem;
  font-weight: 700;
  letter-spacing: .02em;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .15s ease;
}
.c-btn:hover { background: var(--c-yellow-strong); }
.c-btn--strong { background: var(--c-yellow-strong); }
.c-btn--strong:hover { background: #F7C224; }
.c-btn--sm { min-height: 44px; padding: .5em 1.2em; font-size: .9375rem; font-weight: 500; }
.c-btn .c-icon { width: 1.05em; height: 1.05em; }
.c-textlink {
  display: inline-flex;
  align-items: center;
  gap: .4em;
  min-height: 44px;
  font-weight: 700;
  letter-spacing: .06em;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .3em;
}
.c-icon { width: 24px; height: 24px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.c-icon-circle {
  display: inline-grid;
  place-items: center;
  flex: none;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--c-yellow-soft);
}
.c-icon-circle .c-icon { width: 26px; height: 26px; }

/* ---------- Panels (rounded section cards) ---------- */
.c-panel {
  border-radius: var(--r-card);
  background: var(--c-surface);
  box-shadow: var(--shadow);
  padding: var(--pad-card);
}

/* ---------- Language bar ---------- */
.c-langbar { padding-block: 10px; }
.c-langbar .l-container { display: flex; justify-content: flex-end; max-width: calc(var(--container-wide) + var(--edge) * 2); padding-inline: var(--edge); }
.c-lang { display: flex; align-items: center; gap: 12px; font-size: .8125rem; }
.c-lang__label { font-weight: 700; letter-spacing: .2em; color: var(--c-ink-muted); }
.c-lang__list { display: flex; gap: 2px; padding: 3px; border: 1px solid var(--c-line); border-radius: var(--r-pill); background: var(--c-surface-2); }
.c-lang__item {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 12px;
  border-radius: var(--r-pill);
  font-weight: 500;
  text-decoration: none;
  color: var(--c-ink);
}
.c-lang__item[aria-current="true"] { background: var(--c-yellow); font-weight: 700; }
.c-lang__item:not([href]) { color: var(--c-ink-muted); cursor: default; }

/* ---------- Header ---------- */
.c-header { display: flex; align-items: center; gap: 32px; min-height: 88px; }
.c-logo { display: inline-flex; align-items: baseline; gap: 14px; text-decoration: none; white-space: nowrap; }
.c-logo__mark { font-family: var(--ff-serif); font-size: 1.875rem; font-weight: 600; letter-spacing: .14em; line-height: 1; }
.c-logo__tag { font-size: .9375rem; }
.c-nav { margin-left: auto; }
.c-nav__list { display: flex; gap: 6px; }
.c-nav__link {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 14px;
  font-size: .9375rem;
  font-weight: 500;
  text-decoration: none;
}
.c-nav__link::after {
  content: "";
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 4px;
  height: 3px;
  border-radius: 2px;
  background: transparent;
}
.c-nav__link:hover::after { background: var(--c-line); }
.c-nav__link[aria-current="page"]::after { background: var(--c-yellow-strong); }
.c-nav__link[aria-current="page"] { font-weight: 700; }
.c-header__cta[aria-current="page"] { background: var(--c-yellow-strong); box-shadow: inset 0 0 0 2px var(--c-ink); }

/* mobile menu (no JavaScript: details/summary) */
.c-menu { display: none; position: relative; }
.c-menu > summary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 14px;
  border: 1px solid currentColor;
  border-radius: var(--r-pill);
  font-size: .9375rem;
  font-weight: 700;
  list-style: none;
  cursor: pointer;
}
.c-menu > summary::-webkit-details-marker { display: none; }
.c-menu__panel {
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  z-index: 20;
  min-width: 220px;
  padding: 10px;
  border-radius: 16px;
  background: var(--c-surface-2);
  color: var(--c-ink);
  box-shadow: 0 12px 32px rgb(40 30 20 / .18);
}
.c-menu__panel .c-nav__list { flex-direction: column; gap: 0; }
.c-menu__panel .c-nav__link { width: 100%; min-height: 48px; font-size: 1rem; }
.c-menu__panel .c-nav__link::after { left: 14px; right: auto; width: 32px; bottom: 8px; }

/* header on top of a photo (Home hero) */
.c-header--overlay { color: var(--c-on-photo); }
.c-header--overlay .c-logo { text-shadow: 0 1px 3px rgb(0 0 0 / .45); }
.c-header--overlay .c-nav--desktop .c-nav__list,
.c-header--overlay .c-menu > summary {
  background: rgb(var(--c-overlay) / .5);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.c-header--overlay .c-nav--desktop .c-nav__list { gap: 0; padding: 2px 6px; border-radius: var(--r-pill); }
.c-header--overlay .c-nav--desktop .c-nav__link { text-shadow: 0 1px 2px rgb(0 0 0 / .5); }
.c-header--overlay .c-menu > summary { border-color: rgb(255 255 255 / .6); }
.c-header--overlay .c-nav--desktop .c-nav__link:hover::after { background: rgb(255 255 255 / .5); }
.c-header--overlay .c-header__cta { color: var(--c-ink); }

/* ---------- Footer: logo left, the three legal links on the same line right; © below ---------- */
.c-footer { border-top: 1px solid var(--c-line); padding-block: var(--pad-card) 24px; }
.c-footer__inner { display: flex; align-items: center; justify-content: space-between; gap: 12px 48px; }
.c-footer__brand { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; white-space: normal; }
.c-footer .c-logo__mark { font-size: 1.625rem; }
.c-footer__tag { color: var(--c-ink-muted); font-size: .9375rem; }
.c-footer__links { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; column-gap: 32px; }   /* no separator: the gap tells them apart */
.c-footer__links a { display: inline-flex; align-items: center; min-height: 44px; font-size: .9375rem; text-decoration: none; }
.c-footer__links a:hover, .c-footer__links a[aria-current="page"] { text-decoration: underline; text-underline-offset: .25em; }
.c-footer__bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 24px; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--c-line); }
.c-footer__copy { font-size: .8125rem; color: var(--c-ink-muted); }

/* ---------- Back to top: the last block of the content, centred, above the footer.
   .l-section gives it the same space above and below as any section (--space-section). ---------- */
.c-btn--outline { background: transparent; box-shadow: inset 0 0 0 1.5px var(--c-line), inset 0 0 0 1.5px rgb(21 18 15 / .18); }
.c-btn--outline:hover { background: var(--c-yellow-tint); }
.c-totop-wrap { display: flex; justify-content: center; }
.c-totop .c-icon { width: 1.1em; height: 1.1em; stroke-width: 2; }

/* =========================================================================
   H01 Home
   ========================================================================= */

/* Hero */
.p-hero {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  min-height: clamp(600px, 58vw, 820px);
  padding: 0 56px 64px;
  overflow: hidden;
  border-radius: var(--r-card);
  color: var(--c-on-photo);
  background: #2b1d0c;
}
.p-hero__photo { position: absolute; inset: 0; z-index: -2; margin: 0; }
.p-hero__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 70% 40%; }
.p-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg, rgb(var(--c-overlay) / .9) 0%, rgb(var(--c-overlay) / .72) 34%, rgb(var(--c-overlay) / .18) 58%, rgb(var(--c-overlay) / 0) 72%);
}
.p-hero .c-header { padding-inline: 0; }
.p-hero__body { max-width: 660px; margin-top: auto; padding-top: 56px; }   /* room for "Private photography" on one line */
.p-hero__body > :not(.p-hero__title) { max-width: 560px; }
.p-hero__title { font-size: var(--fs-display); }
.p-hero__lead { margin-top: 24px; font-family: var(--ff-serif); font-size: var(--fs-lead); font-weight: 600; line-height: 1.25; }
.p-hero__text { margin-top: 20px; font-size: 1.125rem; line-height: 1.5; }
.p-hero__text p + p { margin-top: .5em; }
.p-hero__cities { margin-top: 24px; font-size: .9375rem; font-weight: 700; letter-spacing: .3em; }
.p-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; margin-top: 32px; }
.p-hero__actions .c-btn { font-size: 1.125rem; padding-inline: 1.5em; }
.p-hero__actions .c-textlink { color: var(--c-on-photo); font-size: .9375rem; }

/* About (two-column text + photo) */
.p-about { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 40px; align-items: center; }
.p-about__title { margin-top: 14px; font-size: var(--fs-h2); }
.p-about__text { margin-top: 28px; }
.p-about__photo { aspect-ratio: 556 / 492; }

/* Our Work */
.p-work { display: grid; grid-template-columns: minmax(0, 2.6fr) minmax(0, 7.4fr); gap: 32px; align-items: center; }
.p-work__title { margin-top: 14px; font-size: var(--fs-h2); }
/* side-column titles shrink with their column on narrower screens (1512px: unchanged),
   so a long word (photographer, L’hospitalité) does not end up alone on a line */
@media (min-width: 901px) {
  .p-about > :first-child, .p-work__intro { container-type: inline-size; }
  .p-about__title { font-size: min(var(--fs-h2), 9cqi); }
  .p-work__title { font-size: min(var(--fs-h2), 12.8cqi); }
}
.p-work__text { margin-top: 28px; font-size: 1.1875rem; line-height: 1.45; }
.p-work__text p + p { margin-top: 1em; }
.p-work__intro .c-btn { margin-top: 28px; }
.p-work__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.p-work__grid .c-photo { aspect-ratio: 352 / 268; }

/* Wide landscape strip */
.p-strip { aspect-ratio: 1040 / 150; }
.p-strip img { object-position: 50% 50%; }

/* Destinations */
.p-dest__head { display: grid; grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr); gap: 32px; align-items: center; }
.p-dest__head::before { content: ""; grid-column: 2; grid-row: 1; align-self: stretch; background: var(--c-line); }
.p-dest__title { margin-top: 14px; font-size: var(--fs-h2); }
.p-dest__intro { grid-column: 3; grid-row: 1; }
.p-dest__titlewrap { grid-column: 1; grid-row: 1; }
.p-dest__cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-top: 40px; }

.p-dest__cards > li { display: flex; }
.c-city-card {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: var(--r-card);
  background: var(--c-surface);
  box-shadow: var(--shadow);
  text-decoration: none;
  transition: transform .2s ease;
}
.c-city-card:hover { transform: translateY(-2px); }
@media (prefers-reduced-motion: reduce) { .c-city-card { transition: none; } .c-city-card:hover { transform: none; } }
.c-city-card .c-photo { border-radius: 0; aspect-ratio: 252 / 188; }
.c-city-card__body { padding: 22px 24px 28px; }
.c-city-card__name { display: flex; align-items: center; gap: 12px; font-size: var(--fs-h3); }
.c-city-card__name .c-icon-circle { width: 44px; height: 44px; }
.c-city-card__name .c-icon { width: 24px; height: 24px; }
.c-city-card__lead { margin-top: 18px; }
.c-city-card__text { margin-top: 14px; font-size: .9375rem; color: var(--c-ink); }

/* Sessions */
.p-sessions__head { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .82fr); align-items: start; min-height: 300px; }
.p-sessions__intro { position: relative; z-index: 1; padding-top: 24px; }
.p-sessions__title { margin-top: 0; font-size: var(--fs-h2); }
.p-sessions__intro .c-accent::after { margin-top: 0; margin-bottom: 22px; }
.p-sessions__sub { margin-top: 14px; font-family: var(--ff-serif); font-size: var(--fs-lead); font-weight: 600; }
.p-sessions__text { margin-top: 12px; max-width: 560px; }
.p-sessions__photo {
  margin: 0 0 0 -80px;
  height: 340px;
  border-radius: 0 var(--r-card) 0 0;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 34%), linear-gradient(0deg, transparent 0%, #000 40%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent 0%, #000 34%), linear-gradient(0deg, transparent 0%, #000 40%);
  mask-composite: intersect;
}
.p-sessions__cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: -20px; position: relative; z-index: 1; }

.c-session {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 6px 6px 28px;
  border-radius: var(--r-card);
  background: var(--c-surface);
  box-shadow: var(--shadow);
}
.c-session .c-photo { aspect-ratio: 322 / 172; border-radius: 16px; }
.c-session__body { display: flex; flex-direction: column; flex: 1; padding: 22px 26px 0; }
.c-session__time { font-size: clamp(2rem, 1.6rem + 1vw, 2.5rem); }
.c-session__name { margin-top: 6px; font-family: var(--ff-display); font-size: 1.375rem; font-weight: 500; line-height: var(--lh-tight); letter-spacing: -.01em; text-wrap: balance; }
.c-session__name.c-accent::after { margin-top: 14px; width: 40px; }
.c-session__text { margin-top: 16px; }
.c-session__meta { display: flex; align-items: center; gap: 16px; margin-top: auto; padding-top: 24px; }
.c-session__price { font-family: var(--ff-serif); font-size: 2rem; font-weight: 700; line-height: 1; }
.c-session__meta-sep { width: 1px; align-self: stretch; background: var(--c-ink); opacity: .4; }
.c-session__photos { font-family: var(--ff-serif); font-size: 1rem; line-height: 1.2; }
.c-session__details { margin: 12px 0 0; padding: 0; list-style: none; }
.c-session__details li + li { margin-top: 2px; }
.p-sessions__note { margin-top: 20px; text-align: center; font-size: var(--fs-small); color: var(--c-ink-muted); }
.p-sessions__note a { color: var(--c-ink); text-decoration: underline; text-underline-offset: 3px; }
.c-session .c-btn { margin: 20px auto 0; width: min(100%, 252px); }
.c-session--featured { background: var(--c-yellow-tint); box-shadow: inset 0 0 0 2px var(--c-yellow-border), var(--shadow); }
.c-session__badge {
  position: absolute;
  top: -18px;
  left: 50%;
  translate: -50% 0;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 18px;
  border-radius: var(--r-pill);
  background: var(--c-yellow-strong);
  font-size: .9375rem;
  font-weight: 700;
  white-space: nowrap;
}
.c-session__badge .c-icon { width: 18px; height: 18px; fill: currentColor; stroke: none; }

/* How it works */
.p-how__title { margin-top: 14px; font-size: var(--fs-h2); }
.p-how__eyebrow.c-accent::after { margin-top: 18px; }
.p-how__steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; margin: 36px 0 0; padding: 0; list-style: none; }
.c-step { position: relative; }
.c-step .c-icon-circle { width: 88px; height: 88px; }
.c-step .c-icon-circle .c-icon { width: 40px; height: 40px; stroke-width: 1.5; }
.c-step__title { margin-top: 22px; font-size: 1.75rem; }
.c-step__text { margin-top: 14px; }
.c-step__next { position: absolute; right: -30px; top: 108px; width: 22px; height: 22px; }

/* Reviews band (whole band links to R01) */
.p-reviews-band {
  position: relative;
  isolation: isolate;
  display: block;
  padding: var(--pad-card);
  overflow: hidden;
  border-radius: var(--r-card);
  background: #2b1d0c;
  color: var(--c-on-photo);
  text-decoration: none;
}
.p-reviews-band__photo { position: absolute; inset: 0; z-index: -2; margin: 0; }
.p-reviews-band__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 50%; }
.p-reviews-band::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg, rgb(var(--c-overlay) / .92) 0%, rgb(var(--c-overlay) / .78) 40%, rgb(var(--c-overlay) / .1) 72%);
}
.p-reviews-band__title { margin-top: 14px; max-width: 560px; font-size: var(--fs-h2); }
.p-reviews-band__text { margin-top: 16px; max-width: 520px; font-size: 1.1875rem; font-style: italic; line-height: 1.45; }
.p-reviews-band__ratings { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; margin-top: 24px; font-size: 1.1875rem; }
.p-reviews-band__ratings li + li { padding-left: 28px; border-left: 1px solid rgb(255 255 255 / .6); }

/* Special moments */
.p-special { position: relative; overflow: hidden; }
.p-special__title { font-size: var(--fs-h2); }
.p-special__sub { margin-top: 22px; font-size: .9375rem; font-weight: 700; letter-spacing: .26em; text-transform: uppercase; }
.p-special__text { margin-top: 8px; }
.p-special__cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 28px; }
.c-moment {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 0 0 24px;
  overflow: hidden;
  border-radius: var(--r-card);
  background: var(--c-surface-2);
  box-shadow: var(--shadow);
}
.c-moment .c-photo { aspect-ratio: 326 / 184; border-radius: var(--r-card) var(--r-card) 0 0; }
.c-moment__head { display: flex; align-items: center; gap: 12px; padding: 18px 24px 0; }
.c-moment__head .c-icon-circle { width: 44px; height: 44px; }
.c-moment__head .c-icon { width: 24px; height: 24px; }
.c-moment__title { font-size: 1.5rem; }
.c-moment__text { flex: 1; padding: 14px 24px 0; font-size: .9375rem; }
.c-moment__link {
  align-self: flex-end;
  display: inline-grid;
  place-items: center;
  width: 44px;
  height: 44px;
  margin: 12px 20px 0 0;
  border-radius: 50%;
  background: var(--c-yellow);
}
.c-moment__link:hover { background: var(--c-yellow-strong); }
.c-moment__link .c-icon { width: 20px; height: 20px; stroke-width: 2; }

/* FAQ (Home excerpt) */
.p-faq__title { margin-top: 14px; font-size: var(--fs-h2); }
.p-faq__list { margin-top: 28px; }
.p-faq__more { display: flex; justify-content: center; margin-top: 36px; }
.p-faq__more .c-btn { min-width: 280px; }

.c-faq__item {
  position: relative;
  display: flow-root;
  border: 1px solid var(--c-line);
  border-radius: 16px;
  background: var(--c-surface-2);
}
.c-faq__item + .c-faq__item { margin-top: 8px; }
.c-faq__q {
  display: block;
  min-height: 56px;
  padding: 15px 64px 15px 22px;
  font-weight: 700;
  line-height: 1.4;
  list-style: none;
  cursor: pointer;
}
.c-faq__q::-webkit-details-marker { display: none; }
.c-faq__chev { position: absolute; right: 20px; top: 16px; width: 24px; height: 24px; stroke-width: 2; transition: rotate .2s ease; }
.c-faq__item[open] .c-faq__chev { rotate: 180deg; }
@media (prefers-reduced-motion: reduce) { .c-faq__chev { transition: none; } }
.c-faq__a { padding: 0 64px 18px 22px; }
.c-faq__a > p { padding-left: 16px; border-left: 1px solid var(--c-ink); font-size: .9375rem; }
.c-faq__a > * + * { margin-top: 10px; }
.c-faq__a a { text-decoration: underline; text-underline-offset: 3px; }
.c-faq__a > .c-fee-table { margin-left: 17px; width: calc(100% - 17px); }
/* wide: question left, answer right (as in the Home reference) */
@media (min-width: 900px) {
  .c-faq--split .c-faq__item[open] .c-faq__q { float: left; width: 42%; padding-right: 24px; }
  .c-faq--split .c-faq__item[open] .c-faq__a { margin-left: 42%; padding: 13px 64px 13px 0; }
  .c-faq--split .c-faq__item[open] .c-faq__a > p { padding-left: 24px; }
}

/* Final CTA band */
.p-cta {
  position: relative;
  isolation: isolate;
  padding: var(--pad-card);
  overflow: hidden;
  border-radius: var(--r-card);
  background: #2b1d0c;
  color: var(--c-on-photo);
}
.p-cta__photo { position: absolute; inset: 0; z-index: -2; margin: 0; }
.p-cta__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 55%; }
.p-cta::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg, rgb(var(--c-overlay) / .92) 0%, rgb(var(--c-overlay) / .74) 40%, rgb(var(--c-overlay) / .05) 70%);
}
.p-cta__title { max-width: 520px; font-size: var(--fs-h2); }
.p-cta__text { margin-top: 20px; max-width: 480px; font-size: 1.0625rem; }
.p-cta .c-btn { margin-top: 32px; font-size: 1.125rem; }

/* For travel partners */
.p-partners { display: grid; grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1.75fr); gap: 40px; }
.p-partners::before { content: ""; grid-column: 2; grid-row: 1; background: var(--c-line); }
.p-partners__head { grid-column: 1; grid-row: 1; }
.p-partners__title { margin-top: 24px; font-size: var(--fs-h2); }
.p-partners__body { grid-column: 3; grid-row: 1; }
.p-partners__list { margin-top: 28px; }
.p-partners__list li { display: flex; align-items: center; gap: 22px; }
.p-partners__list li + li { margin-top: 14px; }
.p-partners__list .c-icon-circle { width: 52px; height: 52px; }
.p-partners__feature { font-family: var(--ff-serif); font-size: 1.375rem; font-weight: 700; line-height: 1.2; }
.p-partners__feature small { display: block; margin-top: 2px; font-family: var(--ff-sans); font-size: .9375rem; font-weight: 400; }
.p-partners__body .c-btn { margin-top: 32px; min-width: 320px; font-size: 1.125rem; }

/* =========================================================================
   Responsive
   ========================================================================= */
@media (max-width: 1100px) {
  :root { --inset: 16px; --space-section: 96px; --space-strip: 112px; --pad-card: 36px; }
  .c-header { gap: 16px; }
  .c-nav__link { padding: 0 10px; }
  .c-logo__tag { display: none; }
  .p-dest__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .c-step__next { display: none; }
  .c-footer__inner { flex-direction: column; align-items: flex-start; }
  .c-footer__links { justify-content: flex-start; column-gap: 28px; }
}

@media (max-width: 900px) {
  .c-nav--desktop { display: none; }
  .c-menu { display: block; margin-left: auto; }
  .p-hero { padding: 0 32px 40px; min-height: 0; }
  .p-hero::before { background: linear-gradient(0deg, rgb(var(--c-overlay) / .92) 0%, rgb(var(--c-overlay) / .7) 55%, rgb(var(--c-overlay) / .25) 100%); }
  .p-hero__body { padding-top: 160px; }
  .p-about, .p-work { grid-template-columns: 1fr; }
  .p-dest__head { grid-template-columns: 1fr; gap: 20px; }
  .p-dest__head::before { display: none; }
  .p-dest__intro { grid-column: 1; grid-row: 2; }
  .p-sessions__head { grid-template-columns: 1fr; min-height: 0; }
  .p-sessions__photo { order: -1; margin: 0; height: 220px; border-radius: var(--r-card); -webkit-mask-image: none; mask-image: none; }
  .p-sessions__intro { padding-top: 28px; }
  .p-sessions__cards { grid-template-columns: 1fr; gap: 32px; margin-top: 40px; max-width: 560px; margin-inline: auto; }
  .p-how__steps { grid-template-columns: 1fr; gap: 32px; }
  .p-special__cards { grid-template-columns: 1fr; max-width: 560px; }
  .p-partners { grid-template-columns: 1fr; gap: 28px; }
  .p-partners::before { display: none; }
  .p-partners__body { grid-column: 1; grid-row: 2; }
}

@media (max-width: 600px) {
  :root { --edge: 16px; --inset: 0px; --space-section: 72px; --space-strip: 88px; --pad-card: 24px; --space-block: 24px;
          /* headings follow the phone width (390px: 37px / 30px), so long words do not stand alone on a line */
          --fs-display: clamp(2rem, 9.4vw, 2.75rem); --fs-h2: clamp(1.625rem, 7.6vw, 2.125rem); }
  .p-hero__title { font-size: clamp(1.75rem, 8.6vw, 2.75rem); }   /* "Private photography" on one line */
  .c-header { min-height: 72px; }
  .c-logo__mark { font-size: 1.5rem; }
  .c-header .c-header__cta { padding-inline: .9em; font-size: .875rem; }
  .c-lang__label { display: none; }
  .p-hero { padding: 0 20px 32px; }
  .p-hero .c-header { flex-wrap: wrap; row-gap: 0; }
  .p-hero__body { padding-top: 120px; }
  .p-hero__actions .c-btn { width: 100%; }
  .p-work__grid { gap: 8px; }
  .p-strip { aspect-ratio: 2 / 1; }
  .c-moment__title { font-size: 1.25rem; }
  /* hero: logo readable on any photo, cities on one line */
  .c-header--overlay .c-logo {
    padding: 6px 14px;
    border-radius: var(--r-pill);
    background: rgb(var(--c-overlay) / .5);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
  }
  .p-hero__cities { font-size: clamp(.75rem, 3.4vw, .9375rem); letter-spacing: .12em; white-space: nowrap; }
  /* destinations: 2 x 2, shorter photos, both sentences kept */
  .p-dest__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 24px; }
  .c-city-card .c-photo { aspect-ratio: 2 / 1; }
  .c-city-card__body { padding: 14px 14px 16px; }
  .c-city-card__name { gap: 8px; font-size: 1.125rem; }
  .c-city-card__name .c-icon-circle { width: 32px; height: 32px; }
  .c-city-card__name .c-icon { width: 18px; height: 18px; }
  .c-city-card__lead { margin-top: 10px; font-size: .875rem; line-height: 1.4; }
  .c-city-card__text { margin-top: 8px; font-size: .8125rem; line-height: 1.4; }
  /* sessions: price label on one line */
  .c-session__meta { flex-wrap: wrap; row-gap: 8px; }
  .c-session__price { font-size: 1.5rem; }
  /* how it works: small icon left of the step title */
  .p-how__steps { gap: 24px; margin-top: 24px; }
  .c-step { display: grid; grid-template-columns: 44px minmax(0, 1fr); column-gap: 14px; align-items: center; }
  .c-step .c-icon-circle { width: 44px; height: 44px; }
  .c-step .c-icon-circle .c-icon { width: 22px; height: 22px; }
  .c-step__title { margin-top: 0; font-size: 1.375rem; }
  .c-step__text { grid-column: 1 / -1; margin-top: 12px; }
  .p-reviews-band::before, .p-cta::before { background: rgb(var(--c-overlay) / .72); }
  .p-reviews-band__ratings li + li { padding-left: 0; border-left: 0; }
  .p-reviews-band__ratings { flex-direction: column; align-items: flex-start; }
  .c-faq__a { padding-right: 22px; }
  .p-faq__more .c-btn, .p-partners__body .c-btn { width: 100%; min-width: 0; }
  .p-cta .c-btn { width: 100%; }
}

/* very narrow phones: Book a Session stays reachable inside the menu (and in the fixed header).
   The French and Spanish labels are longer, so their header button steps aside up to 440px. */
@media (max-width: 400px) {
  .c-header .c-header__cta { display: none; }
}
@media (max-width: 440px) {
  html:is(:lang(fr), :lang(es)) .c-header .c-header__cta { display: none; }
}


/* =========================================================================
   Lower pages (G01–G04, B01, B02, R01, F01, P01, L01–L03)
   Spacing uses only the shared tokens: --space-section (via .l-stack/.l-section),
   --pad-card, --gap-stack, --space-block (.l-flow).
   ========================================================================= */

/* header on a light background */
.l-header { padding-top: 4px; }
.c-langbar--content .l-container { max-width: calc(var(--container) + var(--gutter) * 2); padding-inline: var(--gutter); }

/* generic two-column text + photo */
.c-split { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 40px; align-items: center; }
.c-split__title { margin-top: 14px; font-size: var(--fs-h2); }
.c-split__text { margin-top: 24px; font-size: 1.125rem; }
.c-split__title--flush { margin-top: 0; }

/* page hero: title left, photo right fading into the page */
.c-page-hero { position: relative; display: flex; align-items: center; min-height: clamp(300px, 27vw, 400px); }
.c-page-hero__photo {
  position: absolute;
  inset: 0 0 0 32%;
  margin: 0;
  overflow: hidden;
  border-radius: var(--r-card);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 32%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 32%);
}
.c-page-hero__photo img { width: 100%; height: 100%; object-fit: cover; }
.c-page-hero__body { position: relative; z-index: 1; max-width: 600px; padding-block: 24px; }
.c-page-hero__title { font-size: var(--fs-display); }
.c-page-hero__sub { margin-top: 20px; font-size: 1.25rem; line-height: 1.4; }
.c-page-hero .c-btn { margin-top: 28px; }
.c-page-hero .c-eyebrow + .c-page-hero__title { margin-top: 22px; }
.c-page-hero__cities { margin-top: 20px; font-size: .875rem; font-weight: 700; letter-spacing: .3em; }
.c-page-hero--card { padding-inline: var(--pad-card); border-radius: var(--r-card); background: var(--c-surface); box-shadow: var(--shadow); overflow: hidden; }
.c-page-hero--card .c-page-hero__photo { border-radius: 0; }

/* city tabs */
.c-city-tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; padding: 6px; border: 1px solid var(--c-line); border-radius: var(--r-pill); background: var(--c-surface-2); }
.c-city-tabs a {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 56px;
  border-radius: var(--r-pill);
  font-family: var(--ff-serif);
  font-size: 1.375rem;
  font-weight: 700;
  text-decoration: none;
}
.c-city-tabs a:hover { background: var(--c-yellow-tint); }
.c-city-tabs a[aria-current="page"] { background: var(--c-yellow); }
.c-city-tabs .c-icon { width: 28px; height: 28px; }

/* gallery: every photo whole, at its own aspect ratio, in columns (3 wide, 2 at 1100px and below).
   assets/js/citron.js deals the photos into .c-masonry__col columns in best-first order;
   without the script the same photos flow in CSS columns. */
.c-masonry { --gallery-gap: 12px; columns: 3; column-gap: var(--gallery-gap); }
.c-masonry > .c-photo { break-inside: avoid; margin-bottom: var(--gallery-gap); }
.c-masonry.is-laid { display: flex; align-items: flex-start; gap: var(--gallery-gap); columns: auto; }
.c-masonry__col { display: flex; flex: 1; flex-direction: column; gap: var(--gallery-gap); min-width: 0; }
.c-masonry .c-photo img { height: auto; }
@media (max-width: 1100px) { .c-masonry { columns: 2; } }
.c-more > summary { display: flex; width: fit-content; margin-inline: auto; list-style: none; cursor: pointer; }
.c-more > summary::-webkit-details-marker { display: none; }
.c-more__count { font-weight: 400; }
.c-more[open] { margin-top: var(--gallery-gap, 12px); }
.c-more[open] > summary { display: none; }

/* explore another city + availability */
.c-explore { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 16px 28px; }
.c-explore__title { padding-right: 28px; border-right: 1px solid var(--c-line); font-size: var(--fs-h3); }
.c-explore__list { display: flex; flex-wrap: wrap; gap: 10px; }
.c-pill {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 0 20px;
  border-radius: var(--r-pill);
  background: var(--c-yellow-tint);
  font-family: var(--ff-serif);
  font-size: 1.0625rem;
  font-weight: 700;
  text-decoration: none;
}
.c-pill:hover { background: var(--c-yellow); }
.c-pill .c-icon { width: 22px; height: 22px; }
.c-center { display: flex; justify-content: center; }
.c-center .c-btn { min-width: min(100%, 400px); font-size: 1.125rem; }

/* ---------- Forms (B01, P01). Design stage: look only, nothing is sent ---------- */
.c-form { display: grid; gap: 24px; }
.c-field { display: grid; gap: 10px; min-width: 0; margin: 0; padding: 0; border: 0; }
.c-field__label { padding: 0; font-size: 1.0625rem; font-weight: 700; }
.c-req { margin-left: .2em; color: var(--c-required); }
.c-opt { margin-left: .2em; font-weight: 400; }
.c-field__help { font-size: .875rem; color: var(--c-ink-muted); }
.c-field-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; }
.c-input, .c-select, .c-textarea {
  width: 100%;
  min-height: 48px;
  padding: 10px 14px;
  border: 1px solid #D3CFCB;
  border-radius: var(--r-input);
  background: #FFFDFB;
  color: var(--c-ink);
  font: inherit;
  font-size: 1rem;
}
.c-input::placeholder, .c-textarea::placeholder { color: #8A827A; }
.c-input:focus-visible, .c-select:focus-visible, .c-textarea:focus-visible { outline: 3px solid var(--c-ink); outline-offset: 1px; }
.c-textarea { min-height: 128px; resize: vertical; line-height: 1.5; }
.c-select {
  -webkit-appearance: none;
  appearance: none;
  padding-right: 44px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2315120F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 20px;
}
.c-select--short { max-width: 200px; }

/* date field: a text field for YYYY-MM-DD; assets/js/citron.js adds the button and the calendar */
.c-date { position: relative; }
.c-field-row > .c-field:last-child .c-cal { left: auto; right: 0; }
.c-date.is-ready .c-date__input { padding-right: 52px; }
.c-date__btn {
  position: absolute;
  right: 6px;
  top: 50%;
  translate: 0 -50%;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--c-ink);
  cursor: pointer;
}
.c-date__btn:hover, .c-date__btn[aria-expanded="true"] { background: var(--c-yellow-tint); }
.c-date__btn .c-icon { width: 20px; height: 20px; }
.c-field__error:empty { display: none; }
/* sending the forms (theme): status line, the field nobody sees, and the "received" panel */
.c-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.c-form__status { padding: 12px 16px; border-radius: var(--r-input); background: var(--c-yellow-tint); font-size: .9375rem; }
.c-form__status[hidden] { display: none; }
.c-form__status.is-error { background: #FBE9E8; color: #8A1F1F; }
.c-form__status ul { margin: 8px 0 0; padding-left: 1.2em; list-style: disc; }
.c-form__status a { text-decoration: underline; text-underline-offset: 3px; }
.c-form__status .c-btn { margin-top: 10px; }
.c-form-done { display: grid; justify-items: center; gap: 14px; padding: var(--pad-card); border-radius: var(--r-card); background: var(--c-surface); box-shadow: var(--shadow); text-align: center; }
.c-form-done[hidden] { display: none; }
.c-form-done__title { font-size: var(--fs-h3); }
.c-form-done__ref { font-size: .875rem; color: var(--c-ink-muted); }
.c-form[hidden] { display: none; }
.c-form__submit[aria-disabled="true"] { opacity: .6; cursor: progress; }
.c-field__error { font-size: .875rem; font-weight: 700; color: var(--c-required); }
.c-input[aria-invalid="true"] { border-color: var(--c-required); }
.c-cal {
  position: absolute;
  left: 0;
  top: calc(100% + 8px);
  z-index: 30;
  width: 312px;
  max-width: calc(100vw - 2 * var(--edge));
  padding: 12px;
  border-radius: 16px;
  background: var(--c-surface-2);
  box-shadow: 0 0 0 1px var(--c-line), 0 16px 40px rgb(40 30 20 / .18);
  font-family: var(--ff-sans);
}
.c-cal[hidden] { display: none; }
.c-cal__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.c-cal__title { font-family: var(--ff-serif); font-size: 1.0625rem; font-weight: 700; text-transform: capitalize; }
.c-cal__nav { display: grid; place-items: center; width: 40px; height: 40px; border: 0; border-radius: 50%; background: transparent; color: var(--c-ink); cursor: pointer; }
.c-cal__nav:hover:not(:disabled) { background: var(--c-yellow-tint); }
.c-cal__nav:disabled { opacity: .3; cursor: default; }
.c-cal__nav .c-icon { width: 18px; height: 18px; stroke-width: 2; }
.c-cal__grid { width: 100%; margin-top: 6px; border-collapse: collapse; table-layout: fixed; }
.c-cal__grid th { padding: 4px 0; font-size: .75rem; font-weight: 700; color: var(--c-ink-muted); text-align: center; }
.c-cal__grid td { padding: 1px; text-align: center; }
.c-cal__day {
  width: 100%;
  aspect-ratio: 1;
  max-height: 40px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--c-ink);
  font: inherit;
  font-size: .9375rem;
  cursor: pointer;
}
.c-cal__day:hover:not(:disabled) { background: var(--c-yellow-tint); }
.c-cal__day[aria-current="date"] { box-shadow: inset 0 0 0 1.5px var(--c-yellow-strong); font-weight: 700; }
.c-cal__grid td[aria-selected="true"] .c-cal__day { background: var(--c-yellow-strong); font-weight: 700; }
.c-cal__day:disabled { color: var(--c-ink-muted); opacity: .45; cursor: default; }
.c-cal__day:focus-visible { outline: 3px solid var(--c-ink); outline-offset: 0; }
.c-cal__foot { display: flex; justify-content: space-between; gap: 8px; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--c-line); }
.c-cal__foot button { min-height: 40px; padding: 0 12px; border: 0; border-radius: var(--r-pill); background: transparent; color: var(--c-ink); font: inherit; font-size: .875rem; font-weight: 700; cursor: pointer; }
.c-cal__foot button:hover { background: var(--c-yellow-tint); }
.c-cal__foot .c-cal__close { margin-left: auto; }
.c-guests__extra { display: none; padding: 8px 12px; border-radius: var(--r-input); background: var(--c-yellow-tint); color: var(--c-ink); }
.c-guests:has(option[data-extra]:checked) .c-guests__extra { display: block; }
.c-field__help a { color: var(--c-ink); text-decoration: underline; text-underline-offset: 3px; }
.c-input-group { display: flex; align-items: stretch; border: 1px solid #D3CFCB; border-radius: var(--r-input); background: #FFFDFB; }
.c-input-group:focus-within { outline: 3px solid var(--c-ink); outline-offset: 1px; }
.c-input-group__icon { display: grid; place-items: center; width: 52px; border-right: 1px solid #D3CFCB; }
.c-input-group .c-input { border: 0; background: transparent; }
.c-input-group .c-input:focus-visible { outline: 0; }

/* radio choices as pills */
.c-choices { display: grid; grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)); gap: 10px; }
.c-choice { position: relative; display: block; }
.c-choice input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.c-choice__box {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 0 16px;
  border: 1px solid #D3CFCB;
  border-radius: var(--r-pill);
  background: var(--c-surface-2);
  font-size: 1rem;
}
.c-choice__box::before { content: ""; flex: none; width: 18px; height: 18px; border: 1.5px solid var(--c-ink); border-radius: 50%; background: #fff; box-shadow: inset 0 0 0 3px #fff; }
.c-choice input:checked + .c-choice__box { border-color: var(--c-yellow-strong); background: var(--c-yellow-soft); }
.c-choice input:checked + .c-choice__box::before { background: var(--c-ink); }
.c-choice input:focus-visible + .c-choice__box { outline: 3px solid var(--c-ink); outline-offset: 2px; }
/* the two big "How can we help?" buttons */
.c-choices--seg { --cols: 2; }
.c-choices--duration { --cols: 3; }
.c-choices--seg .c-choice__box { justify-content: center; min-height: 56px; font-size: 1.125rem; font-weight: 700; }
.c-choices--seg .c-choice__box::before { display: none; }
.c-choices--seg input:checked + .c-choice__box { background: var(--c-yellow); }
/* labels that differ between Book a session / General enquiry (CSS only) */
.c-form:has(input[name="type"][value="general"]:checked) [data-when="booking"] { display: none; }
.c-form:not(:has(input[name="type"][value="general"]:checked)) [data-when="general"] { display: none; }
.c-form__submit { width: 100%; min-height: 60px; font-family: var(--ff-serif); font-size: 1.5rem; letter-spacing: .02em; }
.c-form__note { text-align: center; font-style: italic; }

/* ---------- B01 ---------- */
.p-contact { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 24px; align-items: start; }
.p-contact__aside { padding: 0; overflow: hidden; }
.p-contact__aside .c-photo { border-radius: 0; aspect-ratio: 1 / 1; }
.p-contact__steps { padding: var(--pad-card); }
.p-contact__steps h2 { font-size: var(--fs-h3); }
.p-contact__steps ol { margin: 28px 0 0; padding: 0; list-style: none; }
.p-contact__steps li { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 16px; }
.p-contact__steps li + li { margin-top: 28px; }
.p-contact__steps h3 { font-size: 1.25rem; }
.p-contact__steps p { margin-top: 6px; font-size: .9375rem; }
.p-contact__aside .p-contact__foot { aspect-ratio: 2 / 1; }

/* ---------- B02 ---------- */
.p-sent { text-align: center; }
.c-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 28px;
  border-radius: var(--r-pill);
  background: var(--c-yellow-strong);
  font-size: 1.25rem;
  font-weight: 700;
  letter-spacing: .06em;
}
.c-badge .c-icon { stroke-width: 2.4; }
.c-accent--center::after { margin-inline: auto; }
.c-rule { display: block; width: var(--accent-w); height: var(--accent-h); margin-inline: auto; border-radius: 2px; background: var(--c-yellow-strong); }
.c-page-hero__photo .c-temp { left: auto; right: 12px; }
.p-sent__title { font-size: var(--fs-display); }
.p-sent__sub { margin-top: 16px; font-family: var(--ff-serif); font-size: var(--fs-lead); font-style: italic; }
.p-sent__collage { position: relative; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 3fr); align-items: center; text-align: left; }
.p-sent__main { aspect-ratio: 3 / 2; }
.p-sent__polaroids { display: grid; gap: 18px; margin-left: -48px; }
.c-polaroid { position: relative; z-index: 1; margin: 0; padding: 10px; background: #fff; box-shadow: 0 10px 28px rgb(40 30 20 / .22); rotate: 2.5deg; }
.c-polaroid:nth-child(2) { rotate: -2deg; margin-left: 24px; }
.c-polaroid .c-photo { border-radius: 2px; aspect-ratio: 4 / 3; }
.c-stamp {
  position: absolute;
  right: 4%;
  bottom: -18px;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 22px;
  background: #FFFDF6;
  box-shadow: 0 6px 18px rgb(40 30 20 / .18);
  rotate: -4deg;
  font-family: var(--ff-serif);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.1;
}
.c-stamp .c-icon { width: 40px; height: 40px; }
.c-status { padding: 28px 32px; border: 1px solid var(--c-line); border-left: 8px solid var(--c-yellow-strong); border-radius: 16px; background: var(--c-surface-2); }
.c-status__text { font-size: clamp(1.125rem, 1rem + .6vw, 1.5rem); line-height: 1.35; }
.c-status__steps { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px 28px; margin: 22px 0 0; padding: 0; list-style: none; font-size: 1.125rem; }
.c-status__steps li { display: flex; align-items: center; gap: 12px; }
.c-status__num { display: inline-grid; place-items: center; width: 48px; height: 48px; border: 2px solid var(--c-ink-muted); border-radius: 50%; font-weight: 700; }
.c-status__steps li:first-child .c-status__num { border-color: var(--c-yellow-strong); }
.c-status__arrow { width: 40px; color: var(--c-ink-muted); }
.p-sent__actions { display: grid; justify-items: center; gap: 10px; }
.p-sent__actions .c-btn { min-width: min(100%, 420px); font-size: 1.25rem; }

/* ---------- R01 ---------- */
.p-reviews-band--hero { cursor: default; }
.c-quote-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.c-quote { display: flex; flex-direction: column; gap: 20px; padding: 28px 32px; border-radius: var(--r-card); background: var(--c-surface-2); box-shadow: var(--shadow); }
.c-quote__head { display: flex; align-items: flex-start; gap: 18px; }
.c-quote__mark { display: grid; place-items: center; flex: none; width: 44px; height: 44px; border-radius: 50%; background: var(--c-yellow-soft); font-family: var(--ff-serif); font-size: 2rem; font-weight: 700; line-height: 1; padding-top: 10px; }
.c-quote__text { margin: 0; font-family: var(--ff-serif); font-size: 1.5rem; font-style: italic; line-height: 1.3; }
.c-quote-grid--full { display: block; columns: 2; column-gap: 14px; }
.c-quote-grid--full > .c-quote { break-inside: avoid; margin-bottom: 14px; }
.c-quote__body { margin: 0; font-size: 1rem; line-height: 1.7; }
.c-quote__body p + p { margin-top: .9em; }
.c-quote__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; padding-top: 18px; border-top: 1px solid var(--c-line); }
.c-quote--full .c-quote__meta { margin-top: 0; }
.c-quote__source { font-size: .9375rem; }
.c-quote__lang { font-size: .8125rem; color: var(--c-ink-muted); }
.p-reviews__photo { aspect-ratio: 592 / 262; }
.c-quote__platform { padding: .2em .8em; border-radius: var(--r-pill); background: var(--c-yellow-soft); }
.c-quote__name { font-family: var(--ff-serif); font-weight: 700; }
.c-quote__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-top: auto; }
.c-quote__meta > * + *::before { content: ""; display: inline-block; width: 1px; height: 1.2em; margin-right: 14px; background: var(--c-ink-muted); vertical-align: middle; }
.p-review-links { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 14px; align-items: stretch; }
.p-review-links .c-photo { min-height: 240px; }
.p-review-links__list { display: flex; flex-direction: column; justify-content: center; padding: 8px var(--pad-card); border-radius: var(--r-card); background: var(--c-surface-2); box-shadow: var(--shadow); }
.p-review-links__item { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px 20px; padding-block: 24px; }
.p-review-links__action { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.p-review-links__item + .p-review-links__item { border-top: 1px solid var(--c-line); }
.p-review-links__item h3 { font-size: 1.5rem; }
.p-review-links__item p { margin-top: 4px; font-size: 1.125rem; }
.c-btn[aria-disabled="true"] { cursor: not-allowed; opacity: .75; }

/* ---------- F01 ---------- */
.c-search { position: relative; }
.c-search .c-icon { position: absolute; left: 20px; top: 50%; translate: 0 -50%; pointer-events: none; }
.c-search .c-input { min-height: 56px; padding-left: 56px; border-radius: var(--r-pill); font-size: 1.125rem; }
.c-tabs { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.c-search__clear {
  position: absolute;
  right: 8px;
  top: 50%;
  translate: 0 -50%;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--c-ink);
  cursor: pointer;
}
.c-search__clear:hover { background: var(--c-yellow-tint); }
.c-search__clear[hidden] { display: none; }
.c-search .c-search__clear .c-icon { position: static; translate: none; width: 20px; height: 20px; stroke-width: 2; }
.c-search input[type="search"] { padding-right: 56px; }
.c-search input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }   /* our own × instead */
.c-faq__item[hidden], .c-faq__empty[hidden] { display: none; }
.c-faq__empty { padding: 18px 22px; border: 1px dashed var(--c-line); border-radius: 16px; text-align: center; }
.c-faq__empty a { font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.c-tab { min-height: 52px; border: 1px solid var(--c-line); border-radius: var(--r-pill); background: var(--c-surface-2); color: var(--c-ink); font: inherit; font-size: 1.125rem; font-weight: 700; cursor: pointer; }
.c-tab:hover, .c-tab[aria-pressed="true"] { background: var(--c-yellow); border-color: var(--c-yellow); }
.c-photo-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.c-photo-row .c-photo { aspect-ratio: 335 / 225; }

/* ---------- P01 ---------- */
.c-partner-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.c-partner-card { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 20px; align-items: start; padding: 28px 32px; border: 1px solid var(--c-line); border-radius: var(--r-card); background: var(--c-surface-2); }
.c-partner-card .c-icon-circle { width: 72px; height: 72px; }
.c-partner-card .c-icon-circle .c-icon { width: 34px; height: 34px; }
.c-partner-card__num { font-weight: 700; }
.c-partner-card h3 { margin-top: 4px; font-size: 1.625rem; }
.c-partner-card p { margin-top: 8px; }
.c-band { padding: 24px var(--pad-card); border-radius: var(--r-card); background: var(--c-yellow-soft); text-align: center; }
.c-band h3 { font-size: var(--fs-h3); }
.c-band p { margin-top: 6px; }
.p-partner-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.9fr); gap: 40px; align-items: start; }
.p-partner-form__intro .c-photo { margin-top: 28px; aspect-ratio: 4 / 3; }

/* ---------- L01–L03 ---------- */
.p-legal { max-width: 880px; margin-inline: auto; }
.p-legal__title { font-size: var(--fs-h2); }
.p-legal__sub { margin-top: 16px; font-size: 1.125rem; }
.p-legal__updated { margin-top: 12px; font-size: .9375rem; color: var(--c-ink-muted); }
.p-legal__official { margin-top: 16px; padding: 10px 14px; border-left: 3px solid var(--c-yellow-strong); background: var(--c-yellow-tint); font-size: .9375rem; }
.p-legal__section { padding-top: 28px; border-top: 1px solid var(--c-line); }
.p-legal__section h2 { font-family: var(--ff-sans); font-size: 1.25rem; font-weight: 700; }
.p-legal__section p { margin-top: 10px; }
.p-legal__back { display: inline-flex; }
.p-legal__section ul, .p-legal__section ol { margin: 10px 0 0; padding-left: 1.4em; }
.p-legal__section ul { list-style: disc; }
.p-legal__section li + li { margin-top: 4px; }
.p-legal__section a, .p-legal__list a { text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.p-legal__list { margin: 12px 0 0; }
.p-legal__label { font-weight: 700; }
.p-legal__label + ul { margin-top: 4px; }
.p-legal__list > div { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 4px 24px; padding-block: 12px; border-top: 1px dashed var(--c-line); }
.p-legal__list > div:first-child { border-top: 0; padding-top: 0; }
.p-legal__list dt { font-weight: 700; }
.p-legal__list dd { margin: 0; }
.p-legal__section .c-fee-table { margin-top: 12px; }

/* ---------- Cancellation fee table (F01, L02) ---------- */
.c-fee-table { width: 100%; border-collapse: collapse; font-size: .9375rem; }
.c-fee-table th, .c-fee-table td { padding: 8px 12px; border-bottom: 1px solid var(--c-line); text-align: left; font-weight: 400; }
.c-fee-table thead th { font-size: var(--fs-small); font-weight: 700; color: var(--c-ink-muted); }
.c-fee-table td { width: 1%; white-space: nowrap; text-align: right; font-weight: 700; }
.c-fee-table thead th:last-child { text-align: right; }

/* ---------- Lower pages: responsive ---------- */
@media (max-width: 900px) {
  .c-split, .p-contact, .p-partner-form, .p-review-links { grid-template-columns: 1fr; }
  .c-page-hero { display: block; min-height: 0; }
  .c-page-hero__photo { position: relative; inset: auto; height: 220px; -webkit-mask-image: none; mask-image: none; }
  .c-page-hero__body { padding-block: 24px 0; }
  .c-page-hero--card { padding: 0; }
  .c-page-hero--card .c-page-hero__body { padding: 24px var(--pad-card) var(--pad-card); }
  .p-contact__aside { order: 2; }
  .c-quote-grid, .c-partner-cards { grid-template-columns: 1fr; }
  .c-quote-grid--full { columns: 1; }
  .p-sent__collage { grid-template-columns: 1fr; }
  .p-sent__polaroids { grid-template-columns: 1fr 1fr; margin: 18px 0 0; }
  .c-polaroid:nth-child(2) { margin-left: 0; }
  .c-stamp { position: static; justify-self: end; margin-top: 18px; }
}
@media (max-width: 600px) {
  .c-city-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); border-radius: 22px; }
  .c-city-tabs a { min-height: 48px; font-size: 1.125rem; }
  .c-masonry { --gallery-gap: 8px; }
  .c-more[open] { margin-top: 8px; }
  .c-more > summary { width: 100%; justify-content: center; }
  /* booking form: the two type buttons keep their label on one line */
  .c-choices--seg .c-choice__box { padding: 0 8px; font-size: 1rem; white-space: nowrap; }
  .c-choices--seg .c-icon { display: none; }
  .p-review-links__item { grid-template-columns: 1fr; }
  .p-review-links__action { align-items: flex-start; }
  .c-explore__title { width: 100%; padding-right: 0; border-right: 0; text-align: center; }
  .c-explore__list { justify-content: center; }
  .c-field-row { grid-template-columns: 1fr; }
  .c-choices { --cols: 2; }
  .c-choices--duration { --cols: 1; }
  .c-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .c-tabs > :first-child { grid-column: 1 / -1; }   /* All on its own row, then 2 x 2 */
  .c-photo-row { gap: 8px; }
  .c-photo-row .c-photo { aspect-ratio: 1 / 1; }
  .c-quote { padding: 24px; }
  .c-quote__text { font-size: 1.25rem; }
  .p-legal__list > div { grid-template-columns: 1fr; }
  .c-faq__a > .c-fee-table { margin-left: 0; width: 100%; }
  .c-fee-table th, .c-fee-table td { padding-inline: 8px; }
  .c-partner-card { grid-template-columns: 52px minmax(0, 1fr); padding: 24px; }
  .c-partner-card .c-icon-circle { width: 52px; height: 52px; }
  .c-partner-card .c-icon-circle .c-icon { width: 26px; height: 26px; }
  .c-status { padding: 22px; }
  .c-status__arrow { display: none; }
  .c-badge { font-size: 1.0625rem; }
}

/* very narrow phones: the two type buttons stack, icons come back */
@media (max-width: 380px) {
  .c-choices--seg { --cols: 1; }
  .c-choices--seg .c-icon { display: inline; }
}


/* =========================================================================
   Motion (2026-11-09): calm, slow, small; never in the way of the photos.
   - Blocks with [data-reveal] (or children of [data-reveal-children]) fade in from 20px
     below as they enter the screen, once. They are hidden only while the class
     "js-motion" is on <html>, which the page head sets when assets/js/citron.js can run.
   - "Reduce motion": everything is shown at once and nothing moves.
   ========================================================================= */
.js-motion :is([data-reveal], [data-reveal-children] > *):not(.is-in) { opacity: 0; translate: 0 20px; }
.js-motion .is-revealing { transition: opacity .9s cubic-bezier(.2, .6, .2, 1), translate .9s cubic-bezier(.2, .6, .2, 1) !important; }
@media print {
  .js-motion :is([data-reveal], [data-reveal-children] > *) { opacity: 1 !important; translate: none !important; }
}

/* hero media: a photo now; a short silent looping MP4 can replace the <img> later
   (<video autoplay muted loop playsinline poster="…">), with the same sizing */
:is(.p-hero__photo, .c-page-hero__photo, .p-reviews-band__photo) > video { display: block; width: 100%; height: 100%; object-fit: cover; }

/* fixed header after scrolling (assets/js/citron.js adds .is-stuck) */
.c-header.is-stuck {
  position: fixed;
  inset: 0 0 auto;
  z-index: 50;
  flex-wrap: nowrap;
  gap: 24px;
  min-height: 64px;
  padding-inline: max(var(--gutter), calc((100% - var(--container)) / 2));
  color: var(--c-ink);
  background: rgb(250 245 241 / .92);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  box-shadow: 0 1px 0 var(--c-line), 0 8px 24px rgb(80 60 40 / .08);
}
.c-header.is-stuck .c-logo__mark { font-size: 1.5rem; }
.c-header.is-stuck .c-logo__tag { display: none; }
.c-header.is-stuck .c-header__cta { display: inline-flex; }
.c-header__cta-short { display: none; }
.c-hlang { display: none; position: relative; }
.c-header.is-stuck .c-hlang { display: block; }
.c-hlang__btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 40px;
  padding: 0 10px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-pill);
  background: var(--c-surface-2);
  color: var(--c-ink);
  font: inherit;
  font-size: .8125rem;
  font-weight: 700;
  letter-spacing: .04em;
  cursor: pointer;
}
.c-hlang__btn .c-icon { width: 14px; height: 14px; stroke-width: 2; transition: rotate .2s ease; }
.c-hlang__btn[aria-expanded="true"] .c-icon { rotate: 180deg; }
.c-hlang__list {
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  z-index: 60;
  min-width: 160px;
  margin: 0;
  padding: 6px;
  border-radius: 14px;
  background: var(--c-surface-2);
  box-shadow: 0 12px 32px rgb(40 30 20 / .18);
}
.c-hlang__list[hidden] { display: none; }
.c-hlang__item { display: flex; align-items: center; min-height: 44px; padding: 0 14px; border-radius: 10px; font-size: .9375rem; text-decoration: none; }
.c-hlang__item:hover, .c-hlang__item:focus-visible { background: var(--c-yellow-tint); }
.c-hlang__item[aria-current="true"] { font-weight: 700; background: var(--c-yellow); }
.c-menu__lang { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 8px; padding: 8px 6px 2px; border-top: 1px solid var(--c-line); }
.c-menu__lang-item { display: inline-flex; align-items: center; min-height: 44px; padding: 0 12px; border-radius: var(--r-pill); font-size: .9375rem; text-decoration: none; }
.c-menu__lang-item[aria-current="true"] { font-weight: 700; background: var(--c-yellow); }
@media (max-width: 1100px) {   /* fixed header up to tablets: the short label (Book / Réserver / Reservar) */
  .c-header.is-stuck .c-header__cta-full { display: none; }
  .c-header.is-stuck .c-header__cta-short { display: inline; }
}
@media (max-width: 440px) {
  .c-header.is-stuck .c-header__cta .c-icon { display: none; }
  .c-header.is-stuck .c-hlang__btn { padding: 0 8px; }
}
@media (max-width: 380px) {   /* only the two letters (EN) when it is tight */
  .c-header.is-stuck .c-hlang__btn .c-icon { display: none; }
}
.p-hero.has-stuck-header { z-index: 50; }
.c-header--overlay.is-stuck .c-logo { padding: 0; text-shadow: none; background: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
.c-header--overlay.is-stuck .c-nav--desktop .c-nav__list,
.c-header--overlay.is-stuck .c-menu > summary { background: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
.c-header--overlay.is-stuck .c-nav--desktop .c-nav__link { text-shadow: none; }
.c-header--overlay.is-stuck .c-nav--desktop .c-nav__link:hover::after { background: var(--c-line); }
.c-header--overlay.is-stuck .c-menu > summary { border-color: currentColor; }
@media (max-width: 900px) {
  .c-header.is-stuck .c-header__cta { margin-left: auto; }
  .c-header.is-stuck .c-menu { margin-left: 0; }
  .c-header.is-stuck { gap: 12px; }
}
@media (max-width: 600px) {
  .c-header.is-stuck { gap: 10px; min-height: 56px; }
  .c-header.is-stuck .c-logo__mark { font-size: 1.25rem; }
  .c-header.is-stuck .c-header__cta { min-height: 40px; padding-inline: .9em; font-size: .8125rem; }
}

@media (prefers-reduced-motion: no-preference) {
  /* hero: the photo moves slowly closer (8s); the words follow a little later */
  @keyframes c-hero-zoom { from { transform: scale(1); } to { transform: scale(1.05); } }
  @keyframes c-rise { from { opacity: 0; translate: 0 16px; } to { opacity: 1; translate: none; } }
  :is(.p-hero__photo, .c-page-hero__photo, .p-reviews-band--hero .p-reviews-band__photo) > img {
    animation: c-hero-zoom 8s cubic-bezier(.25, .1, .25, 1) both;
  }
  :is(.p-hero__body, .c-page-hero__body) > *,
  .p-reviews-band--hero > :not(.p-reviews-band__photo) {
    animation: c-rise 1s cubic-bezier(.2, .6, .2, 1) .3s both;
  }
  :is(.p-hero__body, .c-page-hero__body) > :nth-child(2), .p-reviews-band--hero > :nth-child(3) { animation-delay: .45s; }
  :is(.p-hero__body, .c-page-hero__body) > :nth-child(3), .p-reviews-band--hero > :nth-child(4) { animation-delay: .6s; }
  :is(.p-hero__body, .c-page-hero__body) > :nth-child(4), .p-reviews-band--hero > :nth-child(5) { animation-delay: .75s; }
  :is(.p-hero__body, .c-page-hero__body) > :nth-child(n+5) { animation-delay: .9s; }

  /* header slides down when it becomes fixed */
  @keyframes c-header-in { from { translate: 0 -100%; } to { translate: none; } }
  .c-header.is-stuck { animation: c-header-in .45s cubic-bezier(.2, .6, .2, 1) both; }

  /* B01: switching Book a session / General enquiry */
  @keyframes c-fade { from { opacity: 0; translate: 0 6px; } to { opacity: 1; translate: none; } }
  .c-form [data-when] { animation: c-fade .4s ease both; }
  .c-choice__box { transition: background-color .25s ease, border-color .25s ease; }
  .c-guests__extra { animation: c-fade .4s ease both; }
  .c-faq__item.is-shown { animation: c-fade .35s ease both; }   /* FAQ filter: questions coming back */

  /* pointer devices only: photos move slightly closer inside their frame, buttons lift */
  @media (hover: hover) and (pointer: fine) {
    .c-city-card .c-photo img, .c-moment .c-photo img, .c-masonry .c-photo img { transition: transform .9s cubic-bezier(.2, .6, .2, 1); }
    .c-city-card:hover .c-photo img,
    .c-moment:hover .c-photo img,
    .c-masonry .c-photo:hover img { transform: scale(1.04); }
    .c-btn { transition: background-color .15s ease, transform .25s ease, box-shadow .25s ease; }
    .c-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgb(80 60 40 / .14); }
    .c-btn:active { transform: none; }
  }
}

@media (prefers-reduced-motion: reduce) {
  .js-motion :is([data-reveal], [data-reveal-children] > *) { opacity: 1 !important; translate: none !important; }
  .c-faq__chev { transition: none; }
}