/* v4.1 composition. Shared behaviours remain in atelier.css.
   Original logo #008295; deep petrol surfaces, warm paper, no photo assets.
   Image slots have intrinsic aspect ratios: never stretched to text height. */
:root {
  --petrol:#008295;
  --petrol-text:#005560;
  --deep-petrol:#082f34;
  --paper:#eee9df;
  --soft:#e3dbce;
  --ink:#202421;
  --muted:#50554f;
  --dark:#0b1111;
  --header:112px;
  --space:clamp(80px,8vw,150px);
  scroll-padding-top:calc(var(--header) + 74px);
}
body { background:var(--paper); }
.proto-header { background:var(--dark); color:var(--paper); }
.proto-header__inner { align-items:center; gap:36px; }
.proto-brand { width:134px; align-self:flex-start; position:relative; z-index:3; transition:width 180ms ease-out; }
.proto-brand img { width:100%; height:auto; }
/* The original logo's petrol area is square (599 × 599 within 599 × 731).
   Match that square to the fixed header height after scrolling: only the black
   FOTOGRAFIE strip overhangs. Keep the original image and header geometry intact. */
.proto-header.is-compact .proto-brand { width:var(--header); }
@media(prefers-reduced-motion:reduce) {
  .proto-brand { transition:none; }
}
.proto-nav { gap:clamp(22px,2vw,36px); }
.proto-nav>a,.proto-nav-trigger,.proto-nav-label>a {
  font-size:18px; letter-spacing:.035em;
}
.proto-nav-panel { background:#142b2c; padding:22px 26px; width:310px; box-shadow:0 18px 28px #0002; }
.proto-nav-panel a { font-size:18px; padding-block:14px; }
.proto-nav [aria-current=page],.proto-nav-trigger:hover,.proto-header a:hover { color:#a6d8da; }
.proto-menu-toggle { color:inherit; font-size:18px; }
.eyebrow,.proto-kicker { font-size:18px; letter-spacing:.07em; line-height:1.6; }
.proto-button,.button,.proto-text-link,.text-link {
  font-size:18px; letter-spacing:.03em; line-height:1.5;
}
.proto-button,.button { background:var(--deep-petrol); padding:20px 28px; min-height:62px; }
.proto-button:hover,.button:hover { background:#005560; }
.actions a:not(.proto-button):not(.button),.category-grid a,.gallery-links a { font-size:18px; }
.form-field>label,.form-field--checkbox label,.form-hint,.form-status,
.contact-v3-form__grid>div>p:last-child,.contact-directions__note,
.contact-map__notice p,.contact-map__controls,.legal-index,.legal-copy p,.legal-copy li,
.proto-footer__contact,.proto-footer__nav,.proto-footer__social,.proto-footer__bottom,
.proto-footer strong { font-size:18px; }
.proto-footer strong { letter-spacing:.035em; }
.proto-footer__brand img { width:104px; }
.proto-footer__brand p { font-size:34px; }
.proto-footer__bottom { padding-right:66px; }
.proto-footer__grid { grid-template-columns:1.05fr 1.35fr .9fr .8fr; gap:clamp(28px,3vw,58px); }
.proto-footer { background:var(--dark); }
/* v4.5: footer-only contact and social links; no changes to header navigation. */
.proto-footer__contact > .proto-footer__phone { font-weight:700; }
.proto-footer__social > .proto-footer__social-link {
  display:flex;
  align-items:center;
  gap:10px;
  width:fit-content;
  max-width:100%;
  min-height:40px;
  margin-bottom:2px;
}
.proto-footer__social-link svg { flex:none; width:20px; height:20px; }
.proto-footer__social-link:focus-visible {
  outline:2px solid currentColor;
  outline-offset:4px;
}
/* Only the imported legal copy has fourth-level headings and long source URLs. */
.privacy-copy h4 { font:650 18px/1.6 var(--body); margin-block:24px 14px; }
.privacy-copy a { overflow-wrap:anywhere; }
/* Legal contents only: track the adjacent article, below the hanging logo. */
@media screen and (min-width:1121px) {
  .legal-layout > .legal-index {
    position:sticky;
    top:calc(var(--header) + 74px);
    align-self:start;
    max-height:calc(100vh - var(--header) - 98px);
    max-height:calc(100dvh - var(--header) - 98px);
    overflow-y:auto;
    scrollbar-width:thin;
    padding-inline-end:12px;
  }
  .legal-layout > .legal-index a:focus-visible { outline-offset:-2px; }
}
@media screen and (max-width:1120px) {
  .legal-layout > .legal-index { display:none; }
}
.proto-contact-closer { background:var(--deep-petrol); }
.dark,.statement { background:var(--dark); }
.dark .eyebrow,.statement .eyebrow,.proto-contact-closer .eyebrow { color:#a6d8da; }
.dark a:hover { color:#a6d8da; }
.dark .proto-button,.home-opening .button,.page-opening .proto-button { background:var(--paper); color:var(--dark); }

/* Large, hanging brand mark and split opening: no text over a face. */
.home-opening,.page-opening {
  background:var(--deep-petrol); color:var(--paper);
  padding:clamp(96px,7.2vw,140px) 0 clamp(82px,7vw,134px);
}
.page-opening.legal-opening { background:var(--paper); color:var(--ink); padding-bottom:64px; }
.page-opening .eyebrow,.home-opening .eyebrow { color:#acd4d4; }
.page-opening.legal-opening .eyebrow { color:var(--petrol-text); }
.opening-grid { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:clamp(48px,7vw,128px); }
.opening-heading { min-width:0; container-type:inline-size; }
.home-opening h1,.has-media h1 {
  font-size:clamp(60px,14.3cqw,104px); line-height:1.04;
  max-width:15ch; text-wrap:balance;
}
.home-opening h1 { max-width:13ch; }
.has-media.long-opening h1 { font-size:clamp(52px,12.5cqw,84px); max-width:19ch; }
.page-opening:not(.has-media) .opening-grid { display:block; }
.page-opening:not(.has-media) h1 { max-width:22ch; }
/* AGB only: use the available heading width, not the generic 22ch measure. */
.page-agb .page-opening.legal-opening h1 { max-width:none; text-wrap:wrap; }
.page-opening:not(.has-media) .opening-copy { max-width:66ch; }
.opening-copy { margin-top:34px; }
.opening-copy>p:first-child { font-size:22px; line-height:1.7; }
.home-opening__action { margin-top:42px; }
.home-opening .button:hover,.page-opening .proto-button:hover { background:#fff; color:var(--petrol-text); }
.home-opening a:hover,.page-opening a:hover { color:#acd4d4; }
.opening-grid>.planned-image { align-self:center; }

/* The label is part of the development image slot, not an image caption.
   It is removed when the approved original replaces this figure. */
.planned-image {
  --image-ratio:4/5;
  margin:0; width:100%; aspect-ratio:var(--image-ratio);
  min-width:0; display:grid; place-items:center;
  background:#c6bcac; color:#28302c; border:1px solid #9a9586;
  padding:clamp(22px,3vw,48px); overflow:visible;
  container-type:inline-size;
}
.planned-image figcaption {
  text-align:center; width:100%; max-width:29ch; font:400 18px/1.65 var(--body);
}
.planned-image__label { display:block; margin-bottom:18px; font-size:18px; color:#3c4c47; }
.planned-image strong { display:block; font-size:20px; line-height:1.6; font-weight:500; }
.planned-image__format { display:block; font-size:18px; margin-top:24px; color:#4c5750; }
.planned-image[data-ratio="16/9"] { padding:18px; }
.planned-image[data-ratio="16/9"] .planned-image__format { display:none; }
.planned-image[data-ratio="16/9"] .planned-image__label:after { content:" · 16:9"; }
@container(max-width:360px) {
  .planned-image figcaption { max-width:none; }
  .planned-image .planned-image__label { font-size:18px; line-height:1.4; margin-bottom:12px; }
  .planned-image .planned-image__label:after { content:" · " attr(data-format); }
  .planned-image .planned-image__format { display:none; }
  .planned-image strong { font-size:18px; line-height:1.5; }
}
.home-opening .planned-image,.page-opening .planned-image,.dark .planned-image {
  background:#173e42; color:#eee9df; border-color:#466367;
}
.home-opening .planned-image__label,.page-opening .planned-image__label,
.home-opening .planned-image__format,.page-opening .planned-image__format,
.dark .planned-image__label,.dark .planned-image__format { color:#bcd0cb; }
.planned-image + .eyebrow { margin-top:32px; }

/* Editorial rhythm: one consistent reading measure, images stay proportional. */
.picture-grid { display:grid; grid-template-columns:1fr 1fr; gap:clamp(48px,7vw,128px); align-items:start; }
.picture-copy { min-width:0; }
.picture-copy h2 { font-size:clamp(48px,4.1vw,72px); margin-bottom:34px; max-width:19ch; }
.picture-copy .reading { max-width:55ch; }
.picture-media { min-width:0; display:grid; gap:30px; align-self:stretch; align-content:start; }
.picture-media:not(:has(>.planned-image:nth-child(2))) { display:block; }
.picture-chapter:nth-of-type(even) .picture-media { grid-column:1; grid-row:1; }
.picture-chapter:nth-of-type(even) .picture-copy { grid-column:2; grid-row:1; }
.picture-media:has(>.planned-image:nth-child(2)) { grid-template-columns:1fr 1fr; }
.picture-media:has(>.planned-image:nth-child(2))>.planned-image:first-child { grid-column:1/-1; }
.picture-media:has(>.planned-image:nth-child(2))>.planned-image:not(:first-child) { padding:20px; }
.picture-media>.planned-image:only-child { position:sticky; top:calc(var(--header) + 64px); }
.home-introduction .chapter-grid { grid-template-columns:.85fr 1.15fr; }
.home-introduction h2 { max-width:11ch; }
.home-offerings { background:var(--dark); color:var(--paper); }
.offering-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(30px,3vw,54px); }
.offering-grid article { display:block; min-width:0; }
.offering-grid .eyebrow { color:#a6d8da; }
.offering-grid .planned-image { background:#263536; color:var(--paper); border-color:#4d5b57; }
.offering-grid .planned-image__label,.offering-grid .planned-image__format { color:#c0c9c0; }
.offering-grid .planned-image strong { font-size:18px; }
.offering-grid .planned-image { padding:24px; }
.offering-grid h2 { font-size:clamp(44px,3.5vw,66px); margin-bottom:28px; }
.offering-grid .reading { font-size:20px; }
.offering-grid a:hover { color:#a6d8da; }
.statement blockquote { max-width:29ch; }
.portrait-statement { background:var(--paper); }
.booking { background:var(--soft); }
.booking .reading>p:first-child { font-size:23px; font-family:var(--body); }

/* Gallery overview follows the four equal square entries in the mock-up. */
.category-grid { gap:72px 70px; }
.category-grid h2 { margin-top:28px; margin-bottom:22px; }
.category-grid .planned-image { aspect-ratio:1; }
.gallery-story,.gallery-slots { padding-block:var(--space); }
.gallery-slot-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:start; gap:34px; margin-top:68px; }
.gallery-slot-grid .planned-image { padding:26px; }
.gallery-slot-grid .planned-image strong { font-size:18px; }
.gallery-slots h2:empty { display:none; }
.gallery-slots .gallery-slot-grid { margin-top:0; }
.topic-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:64px; }
.topic-grid h3 { margin-top:26px; font-size:40px; }
.topic-grid p { font-size:20px; }
.topic-grid .planned-image { aspect-ratio:1; }
@media(min-width:1600px) {
  .topic-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:36px; }
  .topic-grid .planned-image { padding:24px; }
  .topic-grid .planned-image strong { font-size:18px; }
}

/* Dark contact information block, as in the contact mock-up. */
.contact-v3-form { background:var(--paper); }
.contact-v3-channels { background:var(--dark); color:var(--paper); }
.contact-v3-channels .proto-kicker { color:#a6d8da; }
.contact-v3-channels__grid { gap:clamp(40px,5vw,85px); }
.contact-v3-channels a:hover { color:#a6d8da; }
.contact-v3-channels .proto-button { background:var(--paper); color:var(--dark); }
.contact-v3-mail { font-size:20px; }
.contact-v3-phone { font-size:24px; }
.contact-directions { background:var(--soft); }
.contact-map { background:var(--paper); border:1px solid #b9b2a3; }
.contact-map__controls button { color:var(--ink); }
.form-field input:not([type=checkbox]),.form-field select,.form-field textarea { background:#f6f2eb; border-color:#a09b8f; }
.faq-v3 details { border-color:#bdb5a6; }
.proto-to-top { border:1px solid #6a7975; width:48px; height:48px; }

@media(min-width:1121px) and (max-width:1340px) {
  .proto-nav { gap:22px; }
  .proto-header__inner { gap:26px; }
  .proto-nav>a,.proto-nav-trigger,.proto-nav-label>a { font-size:18px; letter-spacing:0; }
  .proto-brand { width:124px; }
}
@media(max-width:1120px) {
  :root { --header:96px; }
  .proto-brand { width:112px; }
  .proto-nav { background:var(--dark); padding-top:58px; }
  .proto-nav-panel { background:var(--dark); width:100%; padding:2px 0 20px 20px; box-shadow:none; }
  .proto-nav>a,.proto-nav-trigger,.proto-nav-label>a { font-size:26px; letter-spacing:0; }
  .proto-nav-panel a { font-size:20px; }
  .proto-nav-contact>.proto-button { font-size:18px; background:var(--petrol); color:white; }
  .proto-nav-contact>.proto-button:hover { background:#005560; }
  .proto-nav-phone { font-size:26px; }
  .opening-grid { gap:48px; grid-template-columns:1fr 1fr; }
  .has-media h1,.home-opening h1 { font-size:clamp(54px,14cqw,80px); }
  .has-media.long-opening h1 { font-size:clamp(46px,11.7cqw,72px); }
  .opening-copy>p:first-child { font-size:20px; }
  .picture-grid { gap:48px; }
  .picture-copy h2 { font-size:50px; }
  .offering-grid { grid-template-columns:1fr; gap:68px; }
  .offering-grid article { display:grid; grid-template-columns:1fr 1.15fr; gap:0 52px; align-items:start; }
  .offering-grid .planned-image { grid-row:1/5; grid-column:1; }
  .offering-grid .eyebrow { grid-column:2; margin-top:0; }
  .offering-grid h2 { grid-column:2; font-size:54px; }
  .offering-grid .reading { grid-row:auto; grid-column:2; font-size:20px; }
  .gallery-slot-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .proto-footer__grid { grid-template-columns:1fr 1fr; gap:64px 70px; }
  .proto-footer__contact,.proto-footer__nav,.proto-footer__social { font-size:18px; }
}
@media(max-width:900px) {
  .opening-grid { grid-template-columns:1fr; gap:54px; }
  .home-opening h1,.has-media h1 { font-size:clamp(58px,12cqw,90px); max-width:18ch; }
  .home-opening h1 { max-width:13ch; }
  .has-media.long-opening h1 { font-size:clamp(48px,10cqw,80px); }
  .opening-grid>.planned-image { width:100%; max-width:620px; justify-self:end; }
  .opening-copy { max-width:58ch; }
  .picture-grid { grid-template-columns:1fr; gap:42px; }
  .picture-chapter:nth-of-type(even) .picture-media,.picture-chapter:nth-of-type(even) .picture-copy { grid-row:auto; grid-column:auto; }
  .picture-media { max-width:620px; width:100%; }
  .picture-media>.planned-image:only-child { position:static; }
  .home-introduction .chapter-grid { grid-template-columns:1fr; }
  .picture-copy .reading { max-width:62ch; }
  .category-grid { gap:54px 40px; }
  .category-grid h2 { font-size:54px; }
  .gallery-slot-grid { gap:26px; }
  .gallery-slot-grid .planned-image { padding:24px; }
}
@media(max-width:700px) {
  /* Keep the long compound word intact at ordinary mobile text sizes.
     The existing discretionary hyphen remains available for enlarged text. */
  .page-agb .page-opening.legal-opening h1 { font-size:clamp(2rem,11.8cqw,3.125rem); }
  :root { --header:88px; --space:76px; --gutter:24px; }
  .proto-brand { width:104px; }
  .proto-menu-toggle { font-size:18px; }
  .proto-nav { padding-top:58px; }
  .proto-nav>a,.proto-nav-trigger,.proto-nav-label>a { font-size:24px; }
  .proto-nav-phone { font-size:24px; }
  .proto-nav-contact { margin-top:24px; }
  .proto-nav-contact>.proto-button { font-size:18px; padding-inline:16px; }
  .proto-button,.button { font-size:18px; padding:18px 22px; gap:14px; min-height:60px; text-transform:none; letter-spacing:0; }
  .proto-text-link,.text-link { font-size:18px; text-transform:none; letter-spacing:0; }
  .eyebrow,.proto-kicker { font-size:18px; letter-spacing:.035em; }
  .home-opening,.page-opening { padding:92px 0 60px; }
  .home-opening h1,.has-media h1 { font-size:clamp(51px,16cqw,62px); max-width:16ch; }
  .home-opening h1 { max-width:12ch; }
  .has-media.long-opening h1 { font-size:clamp(44px,13.4cqw,54px); }
  .home-opening .eyebrow { margin-bottom:28px; }
  .home-opening__action { margin-top:32px; }
  .opening-grid { gap:46px; }
  .planned-image { padding:26px; }
  .planned-image strong { font-size:18px; }
  .planned-image__label { margin-bottom:14px; }
  .planned-image__format { margin-top:20px; }
  .opening-grid>.planned-image { max-width:none; }
  .opening-copy { margin-top:28px; }
  .opening-copy>p:first-child { font-size:20px; }
  .picture-copy h2 { font-size:44px; margin-bottom:30px; }
  .picture-grid { gap:36px; }
  .picture-media:has(>.planned-image:nth-child(2)) { grid-template-columns:1fr; gap:28px; }
  .picture-media:has(>.planned-image:nth-child(2))>.planned-image:first-child { grid-column:auto; }
  .offering-grid article { display:block; }
  .offering-grid .planned-image { margin-bottom:30px; }
  .offering-grid h2 { font-size:48px; }
  .offering-grid .reading { font-size:18px; }
  .topic-grid,.gallery-slot-grid { grid-template-columns:1fr; gap:38px; }
  .topic-grid h3 { font-size:36px; margin-bottom:20px; }
  .topic-grid p { font-size:18px; }
  .category-grid { grid-template-columns:1fr; gap:54px; }
  .category-grid h2 { font-size:50px; }
  .category-grid a { font-size:18px; }
  .gallery-slot-grid { margin-top:40px; }
  .gallery-links a { font-size:18px; }
  .booking .reading>p:first-child { font-size:21px; }
  .proto-footer__grid { gap:48px 26px; }
  .proto-footer__brand img { width:88px; }
  .proto-footer__brand p { font-size:30px; }
  .proto-footer__brand { gap:26px; }
  .proto-footer strong { font-size:18px; letter-spacing:0; }
  .proto-footer__bottom { font-size:18px; }
  .proto-footer__contact,.proto-footer__nav,.proto-footer__social { font-size:18px; }
  .proto-to-top { width:44px; height:44px; }
  .legal-copy p,.legal-copy li,.legal-index { font-size:18px; }
}
@media(max-width:359px) {
  :root { --gutter:20px; }
  .proto-brand { width:96px; }
  .proto-nav-phone { font-size:22px; }
  .proto-footer__grid { grid-template-columns:1fr; }
  .proto-footer__brand p { font-size:28px; }
  .proto-footer__brand { gap:20px; }
  .home-opening h1 { font-size:52px; }
  .picture-copy h2 { font-size:40px; }
  .proto-button,.button { padding-inline:18px; }
}
@media print {
  .home-opening,.page-opening,.dark,.statement,.home-offerings,.contact-v3-channels { background:white; color:black; }
  .planned-image { break-inside:avoid; border:1px solid #777; }
  .opening-grid,.picture-grid { display:block; }
}