/* Aperture: the opening, its narrow illuminated edge and a continuation line.
   This layer follows house.css. Catalogue, legal and native-dialog behaviour
   retain that foundation; the salon has its own editorial composition. */
:root {
  --paper:#F8F5EF;
  --surface:#FEFDFC;
  --raised:#ECE7DF;
  --ink:#20242A;
  --muted:#5B626B;
  --accent:#874B39;
  --line:#D2CBC1;
  --control-line:#7B756C;
  --panel:#E5DED3;
  --gutter:clamp(24px,4.4vw,70px);
  --salon-gap:clamp(24px,4.2vw,64px);
  --room-ink:#F5F0E7;
  --room-muted:#C3CBD5;
  --room-accent:#E7BBA1;
}
:root[data-theme=dark] {
  --paper:#14171D;
  --surface:#1C232D;
  --raised:#2C3745;
  --ink:#F5F0E7;
  --muted:#C3CBD5;
  --accent:#E7BBA1;
  --line:#475261;
  --control-line:#8D99A8;
  --panel:#242E3A;
}
.salon-home { overflow:clip; }
.masthead { background:transparent; }
.utility-bar { min-block-size:88px; }
.brand { font-size:18px; letter-spacing:.025em; }
.brand-registration { inset-block-start:2px; margin-inline-start:3px; font-size:8px; }
.utility-bar nav { font-size:12px; gap:32px; }
.utility-bar nav a { position:relative; }
.utility-bar nav a:hover { text-decoration-thickness:1px; }
.salon-home .eyebrow { color:var(--muted); font-size:10px; letter-spacing:.115em; }
.salon-home h1,.salon-home h2,.salon-home h3 { text-wrap:pretty; }
.salon-primary,.salon-secondary {
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  min-block-size:48px;
  max-inline-size:100%;
  font-size:12px;
  line-height:1.65;
}
.salon-primary {
  padding-block:10px;
  border-block-end:1px solid var(--ink);
  color:var(--ink);
}
.salon-secondary { color:var(--muted); }
.salon-primary svg,.salon-secondary svg { inline-size:19px; block-size:19px; }
.salon-primary:hover,.salon-secondary:hover { color:var(--accent); border-color:var(--accent); }
.salon-primary svg,.salon-secondary svg,.salon-home .text-link svg { transition:translate 180ms ease; }
.salon-primary:hover svg,.salon-secondary:hover svg,.salon-home .text-link:hover svg { translate:3px 0; }
[dir=rtl] .salon-primary:hover svg,[dir=rtl] .salon-home .text-link:hover svg { translate:-3px 0; }
.salon-primary span,.salon-secondary span { overflow-wrap:anywhere; }

/* The first composition is a room with a work set back into it, rather than
   an image beside a headline. All planes retain size before the image loads. */
.salon-hero {
  position:relative;
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  column-gap:20px;
  align-items:center;
  padding:54px var(--gutter) 64px;
  background:
    radial-gradient(ellipse 58% 92% at 90% 24%,rgba(255,255,255,.9),transparent 78%),
    linear-gradient(112deg,var(--paper) 30%,#EAE4DB 100%);
}
.salon-hero::after {
  content:"";
  position:absolute;
  inset-inline:var(--gutter);
  inset-block-end:0;
  block-size:1px;
  background:var(--line);
}
.salon-hero-copy { grid-column:1/6; position:relative; z-index:2; padding-block:42px 50px; }
.salon-hero-copy>.eyebrow { margin-block-end:30px; }
.salon-title {
  max-inline-size:100%;
  font-size:clamp(58px,5.8vw,80px);
  line-height:1.015;
  font-weight:500;
  letter-spacing:-.035em;
}
.salon-title>span { display:block; }
.salon-title>span+span { margin-block-start:4px; }
.salon-hero-body {
  margin-block-start:30px;
  max-inline-size:34ch;
  color:var(--muted);
  font-size:14px;
  line-height:1.85;
}
.salon-actions { display:flex; flex-direction:column; align-items:flex-start; gap:10px; margin-block-start:28px; }
.salon-actions .salon-primary { min-inline-size:218px; }
.salon-actions .salon-secondary { font-size:11px; gap:20px; }
.salon-scene {
  grid-column:7/-1;
  position:relative;
  display:flex;
  align-items:flex-end;
  flex-direction:column;
  min-inline-size:0;
  padding-inline-end:7%;
  padding-block:12px 32px;
}
.salon-aperture {
  position:relative;
  display:block;
  inline-size:80%;
  aspect-ratio:.735;
  z-index:1;
  isolation:isolate;
  background:#BFB6A9;
  box-shadow:18px 24px 35px -22px rgba(44,34,24,.35),0 1px 1px rgba(31,28,24,.2);
}
.salon-aperture::before {
  content:"";
  position:absolute;
  z-index:-1;
  inset-block:-22px -14px;
  inset-inline:-20px -12px;
  border:1px solid rgba(101,91,77,.18);
  background:linear-gradient(100deg,#D4CABC 0%,#F9F7F1 5%,#E7DED2 79%,#D7CFC4 100%);
  box-shadow:inset 8px 3px 15px rgba(67,51,32,.08),20px 25px 45px -26px rgba(55,44,29,.25);
}
.salon-aperture::after {
  content:"";
  position:absolute;
  inset-inline-end:-13px;
  inset-block-start:calc(100% + 14px);
  inline-size:1px;
  block-size:65px;
  background:var(--accent);
  opacity:.7;
}
.aperture-lip {
  position:absolute;
  inset:0;
  display:block;
  overflow:hidden;
  padding:14px 12px 16px 19px;
  background:linear-gradient(90deg,#C3B8A6 0%,#E9E2D8 7%,#FBF8F2 96%,#CFC4B5 100%);
  box-shadow:inset 4px 2px 7px rgba(69,50,27,.12);
}
.salon-hero-image {
  inline-size:100%;
  block-size:100%;
  max-inline-size:none;
  object-fit:cover;
  object-position:54% 50%;
  animation:aperture-reveal 650ms cubic-bezier(.22,.7,.3,1) both;
}
.salon-companion {
  position:absolute;
  z-index:2;
  inset-inline-start:-5%;
  inset-block-end:14%;
  inline-size:29%;
  aspect-ratio:.76;
  padding:9px;
  background:var(--surface);
  box-shadow:8px 12px 24px -14px rgba(46,36,24,.38);
}
.salon-companion img { inline-size:100%; block-size:100%; object-fit:cover; object-position:62% 50%; }
.scene-caption { align-self:flex-end; margin-block-start:30px; padding-inline-end:18px; color:var(--muted); font-size:10px; line-height:1.6; }
.art-placeholder { display:block; inline-size:100%; block-size:100%; min-block-size:200px; background:var(--panel); }

/* The same vertical cut returns as a detail and a fine line, with a different
   scale and alignment so the page does not repeat a row of equal cards. */
.salon-perspective {
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  column-gap:20px;
  align-items:center;
  padding:96px var(--gutter) 104px;
}
.perspective-heading { grid-column:1/6; }
.perspective-heading>.eyebrow { margin-block-end:26px; }
.perspective-heading h2 { font-size:clamp(39px,3.6vw,54px); font-weight:500; line-height:1.08; letter-spacing:-.025em; }
.perspective-heading h2 span { display:block; }
.perspective-body { grid-column:7/11; padding-block-start:42px; color:var(--muted); font-size:14px; line-height:1.95; max-inline-size:35ch; }
.perspective-detail { grid-column:12/13; align-self:start; position:relative; inline-size:100%; padding-block-start:10px; }
.perspective-detail::before { content:""; display:block; inline-size:1px; block-size:44px; background:var(--accent); margin-block-end:18px; }
.perspective-detail img { inline-size:100%; aspect-ratio:.39; object-fit:cover; object-position:66% 50%; }
.perspective-detail figcaption { margin-block-start:12px; color:var(--muted); font-size:9px; line-height:1.6; overflow-wrap:anywhere; }

.salon-selection { padding:48px var(--gutter) 112px; background:var(--surface); }
.salon-section-head { display:grid; grid-template-columns:3fr 5fr 4fr; align-items:baseline; column-gap:20px; padding-block:18px 55px; border-block-start:1px solid var(--line); }
.salon-section-head h2 { font-size:clamp(42px,4.3vw,64px); line-height:1.08; font-weight:500; letter-spacing:-.025em; }
.salon-section-head>.salon-secondary { justify-self:end; align-self:center; font-size:11px; gap:18px; }
.salon-portrait { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); column-gap:20px; align-items:center; }
.salon-portrait>.work-image-link { grid-column:1/7; aspect-ratio:.91; padding:18px; background:var(--raised); }
.work-image-link { display:block; min-inline-size:0; }
.work-image-link img { inline-size:100%; block-size:100%; object-fit:cover; }
.salon-portrait .work-image-link img { object-position:50% 50%; }
.work-image-link:hover { outline:1px solid var(--control-line); outline-offset:5px; }
.work-story { grid-column:9/-1; padding-block:28px; min-inline-size:0; }
.work-story h3,.panorama-caption h3 { font-family:Cormorant,Georgia,serif; font-size:48px; line-height:1.1; font-weight:500; letter-spacing:.015em; overflow-wrap:anywhere; }
.work-story>.eyebrow { margin-block-end:17px; }
.work-story>p:not(.eyebrow),.panorama-caption>p:not(.eyebrow) { color:var(--muted); font-size:14px; line-height:1.85; }
.work-story>p:not(.eyebrow) { margin-block-start:22px; }
.work-story>.text-link { margin-block-start:26px; }
.salon-home .text-link { gap:26px; font-size:11px; }
.salon-panorama { margin-inline-start:12.5%; margin-block-start:112px; }
.salon-panorama figure { padding-block-start:22px; border-block-start:1px solid var(--line); }
.salon-panorama .work-image-link { aspect-ratio:2.63; background:var(--panel); }
.salon-panorama .work-image-link img { object-position:50% 54%; }
.panorama-caption { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.42fr); gap:14px 8%; padding-block-start:30px; }
.panorama-caption>.eyebrow:first-child { grid-column:1; grid-row:1; }
.panorama-caption>.eyebrow:nth-child(2) { grid-column:2; grid-row:1; }
.panorama-caption>h3 { grid-column:1; grid-row:2/4; }
.panorama-caption>p:not(.eyebrow) { grid-column:2; grid-row:2; }
.panorama-caption>.text-link { grid-column:2; grid-row:3; justify-self:start; margin-block-start:4px; }

/* The viewing room always has its own deep, lit atmosphere. It is independent
   of the visitor's preference for light or dark surrounding pages. */
.salon-viewing {
  display:grid;
  grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);
  gap:var(--salon-gap);
  align-items:center;
  padding:94px var(--gutter) 104px;
  color:var(--room-ink);
  background:
    radial-gradient(ellipse 65% 82% at 5% 6%,rgba(156,180,204,.13),transparent 80%),
    linear-gradient(110deg,#24303D 0%,#19212B 48%,#11171F 100%);
}
.salon-viewing .eyebrow { color:var(--room-muted); }
.viewing-image-wall {
  position:relative;
  display:grid;
  place-items:center;
  padding:64px 6% 86px;
  min-block-size:465px;
  background:linear-gradient(100deg,rgba(111,134,156,.09),rgba(7,12,18,.24) 72%,rgba(148,169,189,.04));
  border:1px solid rgba(176,191,208,.12);
  box-shadow:inset 15px 4px 28px rgba(5,9,15,.15);
}
.viewing-image-wall::before { content:""; position:absolute; inset-block:0; inset-inline-start:16px; inline-size:1px; background:linear-gradient(transparent,rgba(231,187,161,.57) 35%,rgba(231,187,161,.2) 90%,transparent); }
.viewing-image-wall::after { content:""; position:absolute; inset-block-end:-29px; inset-inline-end:24px; inline-size:1px; block-size:60px; background:rgba(231,187,161,.64); }
.viewing-aperture { position:relative; inline-size:100%; aspect-ratio:1.49; padding:14px 15px 17px 19px; background:linear-gradient(100deg,#5B6672,#BBC0C2 5%,#DFDDD6 96%,#757B81); box-shadow:10px 18px 24px rgba(0,0,0,.32),inset 3px 1px 6px rgba(0,0,0,.2); }
.viewing-aperture img { inline-size:100%; block-size:100%; object-fit:contain; background:#161D26; }
#salon-view-error { position:absolute; inset:20px; padding:16px; color:var(--room-ink); background:#202A35; font-size:13px; line-height:1.75; }
.viewing-copy { min-inline-size:0; padding-block:10px; }
.viewing-copy>.eyebrow { margin-block-end:22px; }
.viewing-copy h2 { max-inline-size:13ch; font-size:clamp(40px,3.6vw,54px); line-height:1.08; letter-spacing:-.025em; font-weight:500; }
.viewing-work-title { margin-block-start:30px; font-size:13px; letter-spacing:.13em; }
#salon-view-description { margin-block-start:12px; max-inline-size:39ch; color:var(--room-muted); font-size:13px; line-height:1.85; }
.viewing-controls { display:flex; flex-wrap:wrap; gap:8px 22px; margin-block-start:25px; }
.viewing-controls button { position:relative; min-block-size:46px; padding:8px 0; color:var(--room-muted); border-block-end:1px solid #6E7B8B; font-size:10px; line-height:1.5; letter-spacing:.11em; }
.viewing-controls button[aria-pressed=true] { color:var(--room-ink); border-color:var(--room-accent); }
.viewing-controls button:hover { color:var(--room-accent); }
.viewing-controls button:focus-visible,.salon-viewing a:focus-visible { outline-color:var(--room-accent); }
.viewing-copy>.text-link { margin-block-start:27px; border-color:#88909A; color:var(--room-ink); }
.viewing-copy>.text-link:hover { color:var(--room-accent); border-color:var(--room-accent); }

.salon-catalogue-gate { position:relative; display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); column-gap:20px; row-gap:24px; padding:100px var(--gutter) 96px; background:var(--raised); }
.salon-catalogue-gate::before { content:""; position:absolute; inset-inline-start:var(--gutter); inset-block-start:100px; inline-size:1px; block-size:142px; background:var(--accent); }
.salon-catalogue-gate>.eyebrow { grid-column:1/4; padding-inline-start:22px; padding-block-start:8px; }
.salon-catalogue-gate h2 { grid-column:5/11; max-inline-size:14ch; font-size:clamp(48px,4.5vw,68px); line-height:1.04; letter-spacing:-.03em; font-weight:500; }
.salon-catalogue-gate>p:not(.eyebrow) { grid-column:5/10; max-inline-size:43ch; font-size:14px; line-height:1.85; color:var(--muted); }
.salon-catalogue-gate>.salon-primary { grid-column:5/10; justify-self:start; margin-block-start:2px; min-inline-size:226px; }
.salon-home .invitation { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); column-gap:var(--salon-gap); padding-block:64px 68px; }
.salon-home .invitation-head { grid-column:1/-1; }
.salon-home .invitation h2 { grid-column:1; font-size:25px; line-height:1.4; font-family:Onest,Arial,sans-serif; margin-block-start:24px; font-weight:400; }
.salon-home .contact-email { grid-column:2; justify-self:start; align-self:end; margin:18px 0 0; font-size:18px; }
.salon-home .invitation-bottom { grid-column:1/-1; column-gap:var(--salon-gap); margin-block-start:24px; }
.salon-home .footer { border-block-start:1px solid var(--line); }
.footer .brand { font-size:18px; }

/* Catalogue is visibly a different destination, with an explicit route home. */
.catalogue-intro { padding-block:34px 52px; }
.catalogue-back { display:inline-flex; align-items:center; min-block-size:44px; color:var(--muted); font-size:11px; text-decoration:underline; text-underline-offset:5px; }
.catalogue-intro>.eyebrow { margin-block-start:27px; color:var(--muted); }
.catalogue-intro h1 { margin-block:20px 22px; font-size:clamp(46px,4.5vw,64px); line-height:1.05; font-weight:500; letter-spacing:-.025em; }
.catalogue-intro>p:last-child { max-inline-size:49ch; color:var(--muted); font-size:14px; line-height:1.85; }

/* Night is a composition of separate planes, with subdued reflected light. */
[data-theme=dark] .salon-hero { background:radial-gradient(ellipse 66% 100% at 95% 8%,rgba(112,137,164,.15),transparent 75%),linear-gradient(110deg,#14171D 28%,#202B38 100%); }
[data-theme=dark] .salon-aperture { background:#3D4650; box-shadow:18px 24px 36px -14px rgba(0,0,0,.56),0 1px 1px rgba(204,219,233,.1); }
[data-theme=dark] .salon-aperture::before { border-color:#44505D; background:linear-gradient(100deg,#303C4A,#64717C 5%,#394858 81%,#273340); box-shadow:inset 8px 3px 15px rgba(0,0,0,.2),20px 25px 45px -26px rgba(0,0,0,.6); }
[data-theme=dark] .aperture-lip { background:linear-gradient(90deg,#26303B,#63717D 7%,#89949B 96%,#3E4D5C); box-shadow:inset 4px 2px 7px rgba(0,0,0,.26); }
[data-theme=dark] .salon-companion { background:#344150; box-shadow:8px 12px 24px -8px rgba(0,0,0,.45); }
[data-theme=dark] .salon-selection { background:linear-gradient(118deg,#1A212B,#1E2834); }
[data-theme=dark] .salon-catalogue-gate { background:radial-gradient(ellipse at 92% 0%,rgba(157,180,202,.08),transparent 65%),#283340; }

/* Arabic follows the same hierarchy, without mirroring the artwork. */
[dir=rtl] .utility-bar nav { font-size:16px; letter-spacing:0; }
[dir=rtl] .salon-home h1,[dir=rtl] .salon-home h2,[dir=rtl] .salon-home h3 { font-family:Naskh,Arial,sans-serif; letter-spacing:0; }
[dir=rtl] .salon-home .eyebrow { font-size:14px; letter-spacing:0; }
[dir=rtl] .salon-title { font-size:clamp(56px,5.2vw,72px); line-height:1.35; }
[dir=rtl] .salon-hero-body,[dir=rtl] .perspective-body,[dir=rtl] .work-story>p:not(.eyebrow),[dir=rtl] .panorama-caption>p:not(.eyebrow),[dir=rtl] .salon-catalogue-gate>p:not(.eyebrow) { font-size:18px; line-height:1.9; }
[dir=rtl] .salon-primary,[dir=rtl] .salon-secondary,[dir=rtl] .salon-home .text-link { font-size:16px; letter-spacing:0; }
[dir=rtl] .perspective-heading h2 { font-size:44px; line-height:1.45; }
[dir=rtl] .salon-section-head h2 { line-height:1.4; }
[dir=rtl] .viewing-copy h2 { font-size:44px; line-height:1.45; max-inline-size:18ch; }
[dir=rtl] #salon-view-description { font-size:17px; line-height:1.9; }
[dir=rtl] .salon-home .invitation h2 { font-family:Naskh,Arial,sans-serif; font-size:28px; }
[dir=rtl] .catalogue-intro h1 { font-size:54px; line-height:1.4; }
[dir=rtl] .catalogue-intro>p:last-child { font-size:18px; line-height:1.9; }
[dir=rtl] .scene-caption,[dir=rtl] .perspective-detail figcaption { font-size:13px; }

@keyframes aperture-reveal { from{clip-path:inset(0 31% 0 31%)} to{clip-path:inset(0)} }
@media(min-width:1600px) {
  .salon-hero { padding-block:64px 80px; }
  .salon-scene { padding-inline-end:9%; }
  .salon-aperture { inline-size:82%; }
}
@media(max-width:1100px) {
  :root { --gutter:32px; --salon-gap:36px; }
  .utility-bar { gap:24px; }
  .utility-bar nav { gap:22px; }
  .salon-hero { column-gap:16px; padding-block:46px 60px; }
  .salon-hero-copy { grid-column:1/7; padding-block:22px; }
  .salon-scene { grid-column:8/-1; padding-inline-end:4%; }
  .salon-aperture { inline-size:100%; }
  .salon-title { font-size:64px; }
  .salon-companion { inset-inline-start:-22%; inline-size:36%; }
  .salon-hero-body { max-inline-size:32ch; }
  .salon-perspective { padding-block:72px 80px; }
  .perspective-heading { grid-column:1/7; }
  .perspective-body { grid-column:8/-1; padding-block-start:34px; }
  .perspective-detail { display:none; }
  .salon-section-head { grid-template-columns:1fr 2fr; row-gap:14px; padding-block-end:42px; }
  .salon-section-head>.eyebrow { grid-column:1; }
  .salon-section-head h2 { grid-column:2; }
  .salon-section-head>.salon-secondary { grid-column:2; justify-self:start; }
  .salon-portrait .work-story { grid-column:8/-1; }
  .salon-portrait>.work-image-link { grid-column:1/7; }
  .salon-panorama { margin-block-start:80px; }
  .salon-viewing { grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); padding-block:76px 84px; gap:36px; }
  .viewing-image-wall { min-block-size:390px; padding:60px 7%; }
  .viewing-copy h2 { font-size:44px; }
  .salon-catalogue-gate { padding-block:80px; }
  .salon-catalogue-gate::before { inset-block-start:80px; }
  .salon-catalogue-gate h2 { grid-column:5/-1; }
  .salon-catalogue-gate>p:not(.eyebrow),.salon-catalogue-gate>.salon-primary { grid-column:5/12; }
}
@media(max-width:767px) {
  :root { --gutter:24px; --salon-gap:24px; }
  .utility-bar { min-block-size:72px; gap:14px; }
  .brand { font-size:17px; }
  .brand-registration { font-size:8px; inset-block-start:2px; }
  .header-controls { gap:4px; }
  .salon-hero { display:flex; flex-direction:column; align-items:stretch; padding-block:35px 48px; gap:42px; }
  .salon-hero-copy { padding:0; }
  .salon-hero-copy>.eyebrow { margin-block-end:23px; }
  .salon-title { font-size:clamp(44px,12vw,60px); line-height:1.025; letter-spacing:-.03em; }
  .salon-title>span+span { margin-block-start:2px; }
  .salon-hero-body { margin-block-start:24px; font-size:14px; line-height:1.85; max-inline-size:37ch; }
  .salon-actions { margin-block-start:21px; gap:3px; }
  .salon-actions .salon-primary { min-inline-size:216px; }
  .salon-actions .salon-secondary { font-size:11px; }
  .salon-scene { display:flex; align-items:flex-end; padding:20px 14px 0; inline-size:100%; }
  .salon-aperture { inline-size:calc(100% - 20px); max-inline-size:420px; aspect-ratio:.88; }
  .salon-aperture::before { inset-block:-17px -11px; inset-inline:-17px -10px; }
  .salon-aperture::after { inset-inline-end:-11px; inset-block-start:calc(100% + 11px); block-size:42px; }
  .aperture-lip { padding:11px 10px 13px 15px; }
  .salon-companion { display:none; }
  .scene-caption { margin-block-start:26px; padding-inline-end:7px; font-size:10px; }
  .salon-perspective { display:block; padding-block:55px 60px; }
  .perspective-heading>.eyebrow { margin-block-end:23px; }
  .perspective-heading h2 { max-inline-size:19ch; font-size:38px; line-height:1.12; }
  .perspective-body { margin-block-start:25px; padding:0; max-inline-size:42ch; font-size:14px; line-height:1.9; }
  .perspective-detail { display:none; }
  .salon-selection { padding-block:32px 60px; }
  .salon-section-head { display:flex; flex-direction:column; align-items:flex-start; gap:20px; padding-block:20px 30px; }
  .salon-section-head h2 { font-size:44px; line-height:1.08; }
  .salon-section-head>.salon-secondary { align-self:flex-start; font-size:11px; gap:20px; margin-block-start:-6px; }
  .salon-portrait { display:flex; flex-direction:column; align-items:stretch; }
  .salon-portrait>.work-image-link { aspect-ratio:.95; padding:12px; }
  .work-story { padding:29px 0 0; }
  .work-story h3,.panorama-caption h3 { font-size:40px; }
  .work-story>.eyebrow { margin-block-end:13px; }
  .work-story>p:not(.eyebrow) { margin-block-start:16px; }
  .work-story>.text-link { margin-block-start:20px; }
  .salon-panorama { margin-inline-start:0; margin-block-start:54px; }
  .salon-panorama figure { padding-block-start:20px; }
  .salon-panorama .work-image-link { aspect-ratio:1.7; }
  .panorama-caption { grid-template-columns:minmax(0,1fr); gap:14px; padding-block-start:25px; }
  .panorama-caption>.eyebrow:first-child { grid-column:1; grid-row:1; }
  .panorama-caption>.eyebrow:nth-child(2) { grid-column:1; grid-row:2; margin-block-start:10px; }
  .panorama-caption>h3 { grid-column:1; grid-row:3; }
  .panorama-caption>p:not(.eyebrow) { grid-column:1; grid-row:4; }
  .panorama-caption>.text-link { grid-column:1; grid-row:5; margin-block-start:4px; }
  .salon-viewing { display:flex; flex-direction:column; align-items:stretch; gap:40px; padding-block:42px 54px; }
  .viewing-image-wall { min-block-size:0; padding:44px 18px 48px; }
  .viewing-image-wall::before { inset-inline-start:9px; }
  .viewing-image-wall::after { inset-inline-end:12px; block-size:46px; inset-block-end:-23px; }
  .viewing-aperture { padding:9px 9px 11px 12px; }
  .viewing-copy { padding:0; }
  .viewing-copy>.eyebrow { margin-block-end:22px; }
  .viewing-copy h2 { font-size:41px; line-height:1.1; max-inline-size:17ch; }
  .viewing-work-title { margin-block-start:24px; font-size:13px; }
  #salon-view-description { font-size:14px; max-inline-size:42ch; }
  .viewing-controls { margin-block-start:20px; gap:8px 24px; }
  .viewing-controls button { font-size:11px; }
  .viewing-copy>.text-link { margin-block-start:22px; }
  .salon-catalogue-gate { display:flex; flex-direction:column; align-items:flex-start; gap:22px; padding-block:55px 58px; }
  .salon-catalogue-gate::before { inset-block-start:55px; block-size:52px; }
  .salon-catalogue-gate>.eyebrow { padding-block:0; padding-inline-start:18px; }
  .salon-catalogue-gate h2 { margin-block-start:8px; font-size:46px; line-height:1.07; max-inline-size:14ch; }
  .salon-catalogue-gate>p:not(.eyebrow) { font-size:14px; max-inline-size:40ch; }
  .salon-catalogue-gate>.salon-primary { margin-block-start:1px; }
  .salon-home .invitation { display:block; padding-block:44px 48px; }
  .salon-home .invitation h2 { font-size:23px; margin-block-start:22px; }
  .salon-home .contact-email { font-size:17px; margin-block-start:13px; }
  .salon-home .invitation-bottom { margin-block-start:22px; gap:20px; }
  .salon-home .invitation-bottom>div>p { font-size:14px; }
  .footer .brand { font-size:17px; }
  .footer-bottom { font-size:10px; }
  .catalogue-intro { padding-block:20px 38px; }
  .catalogue-intro>.eyebrow { margin-block-start:22px; }
  .catalogue-intro h1 { margin-block:17px 19px; font-size:44px; line-height:1.07; }
  .catalogue-intro>p:last-child { font-size:14px; }
  [dir=rtl] .salon-title { font-size:44px; line-height:1.35; }
  [dir=rtl] .salon-actions .salon-secondary,
  [dir=rtl] .salon-section-head>.salon-secondary { font-size:16px; }
  [dir=rtl] .salon-hero-body,[dir=rtl] .perspective-body { font-size:18px; }
  [dir=rtl] .perspective-heading h2 { font-size:35px; line-height:1.5; }
  [dir=rtl] .salon-section-head h2 { font-size:40px; line-height:1.4; }
  [dir=rtl] .viewing-copy h2 { font-size:36px; line-height:1.45; }
  [dir=rtl] .work-story h3,[dir=rtl] .panorama-caption h3 { font-size:40px; }
  [dir=rtl] .salon-catalogue-gate h2 { font-size:40px; line-height:1.4; }
  [dir=rtl] .salon-home .invitation h2 { font-size:26px; }
  [dir=rtl] .catalogue-intro h1 { font-size:40px; line-height:1.4; }
}
@media(max-width:360px) {
  :root { --gutter:20px; }
  .brand { font-size:16px; }
  .salon-hero { padding-block-start:29px; gap:35px; }
  .salon-title { font-size:42px; }
  .salon-hero-copy>.eyebrow { font-size:9px; }
  .salon-hero-body { font-size:14px; }
  .salon-actions .salon-primary { min-inline-size:0; inline-size:100%; }
  .salon-scene { padding-inline:10px; }
  .salon-aperture { inline-size:calc(100% - 13px); }
  .perspective-heading h2 { font-size:35px; }
  .salon-section-head h2 { font-size:40px; }
  .viewing-copy h2 { font-size:38px; }
  .salon-catalogue-gate h2 { font-size:42px; }
  [dir=rtl] .salon-title { font-size:40px; }
}
@media(prefers-reduced-motion:reduce) {
  .salon-hero-image { clip-path:none; animation:none; }
  .salon-primary svg,.salon-secondary svg,.salon-home .text-link svg { transition:none; translate:none; }
}

/* Keep the architectural opening stable when an external image request fails. */
.salon-home img.image-unavailable { opacity:0; animation:none; }
