/*
Theme Name: Atelier Azumi
Theme URI: https://atelierazumi.com
Author: MIKI TV / 合同会社未來商會
Description: Couture house theme for Atelier Azumi. Film-first hero, chronological collection archive, editorial lookbook. Built for WordPress.org (self-hosted).
Version: 1.2.0
Requires at least: 6.2
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: atelier-azumi
Tags: portfolio, fashion, video, one-column, custom-menu
*/

/* ============================================================
   00 — TOKENS
   ============================================================ */
:root{
  --ink:#111111;          /* primary text — near black, never pure #000 */
  --ink-2:#3E3E3E;        /* secondary text */
  --ink-3:#7A7A7A;        /* captions, metadata */
  --noir:#0C0C0C;         /* dark bands — drawer, contact */
  --paper:#FFFFFF;        /* page */
  --matte:#F6F5F3;        /* behind images while they load */
  --accent:#111111;       /* hairlines and hovers. For a gilt house, set #A98A52 */
  --line:rgb(0 0 0 / 13%);
  --line-strong:rgb(0 0 0 / 26%);
  --line-inv:rgb(255 255 255 / 22%);

  /* Didot on macOS, Bodoni Moda everywhere else — the same Didone skeleton. */
  --display:"Didot","Didot LT STD","HTL Didot","Bodoni Moda","Bodoni 72",Didot,"Bodoni MT",Georgia,serif;
  /* Futura on macOS and licensed installs, Jost as the geometric stand-in elsewhere. */
  --sans:"Futura","Futura PT","Futura Std","Jost","Century Gothic","Noto Sans JP",sans-serif;

  --ease:cubic-bezier(.23,1,.32,1);
  --ease-io:cubic-bezier(.77,0,.175,1);

  --gutter:clamp(1.25rem,4.6vw,5rem);
  --header-h:88px;
  --maxw:1840px;
}

/* ============================================================
   01 — RESET / BASE
   ============================================================ */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--paper);scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video{max-width:100%;display:block}
a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
:focus-visible{outline:1px solid var(--accent);outline-offset:5px}
h1,h2,h3,h4,p,figure,ul,ol{margin:0;padding:0}
ul,ol{list-style:none}
::selection{background:var(--ink);color:var(--paper)}

.shell{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
.shell--wide{max-width:none;padding-inline:var(--gutter)}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:-9999px;top:0;z-index:999;background:var(--ink);color:var(--paper);padding:12px 20px;font-size:10px;letter-spacing:.16em;text-transform:uppercase}
.skip-link:focus{left:12px;top:12px}

/* ---- type primitives ---- */
.eyebrow{font-size:9.5px;font-weight:400;letter-spacing:.24em;text-transform:uppercase;line-height:1.5;color:inherit}
.eyebrow--gold{color:var(--ink-3)}
.display{font-family:var(--display);font-weight:400;letter-spacing:-.012em;line-height:.86;font-optical-sizing:auto}
.d1{font-size:clamp(3.2rem,7.4vw,8.2rem)}
.d2{font-size:clamp(2.5rem,5vw,5.6rem)}
.d3{font-size:clamp(1.8rem,3vw,3.2rem)}
.lede{font-family:var(--display);font-style:italic;font-weight:400;font-size:clamp(1.1rem,1.85vw,1.75rem);line-height:1.5;color:var(--ink-2)}
.body-sm{font-size:13px;line-height:1.95;letter-spacing:.005em;color:var(--ink-2)}
.rule-gold{width:46px;height:1px;background:var(--accent);border:0;margin:0}

/* signature: the thread — a hairline that draws itself */
.thread{display:block;height:1px;background:var(--line-strong);transform-origin:left center;transform:scaleX(0);transition:transform 1.1s var(--ease-io)}
.is-in .thread,.thread.is-in{transform:scaleX(1)}
.thread-dot{display:inline-block;width:6px;height:6px;border:1px solid var(--ink-3);border-radius:50%;vertical-align:middle;margin:0 9px 2px 0;position:relative}
.thread-dot::after{content:"";position:absolute;inset:1.5px;background:var(--ink-3);border-radius:50%}

/* ---- scroll reveal ---- */
.reveal{opacity:0;transform:translateY(14px);transition:opacity .85s var(--ease),transform .85s var(--ease)}
.reveal.is-in{opacity:1;transform:none}
.reveal[data-delay="1"]{transition-delay:.07s}
.reveal[data-delay="2"]{transition-delay:.14s}
.reveal[data-delay="3"]{transition-delay:.21s}
.reveal[data-delay="4"]{transition-delay:.28s}

/* ============================================================
   02 — HEADER
   ============================================================ */
.site-header{position:fixed;inset:0 0 auto;z-index:60;height:var(--header-h);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;padding-inline:var(--gutter);color:var(--ink);transition:background .5s var(--ease),color .5s var(--ease),border-color .5s var(--ease),height .4s var(--ease);border-bottom:1px solid transparent}
.site-header--paper{background:rgb(255 255 255 / 94%);-webkit-backdrop-filter:saturate(140%) blur(16px);backdrop-filter:saturate(140%) blur(16px);border-bottom-color:var(--line)}
.site-header--over{color:#fff;background:transparent;border-bottom-color:transparent}
.site-header--over.is-stuck{background:rgb(255 255 255 / 94%);-webkit-backdrop-filter:saturate(140%) blur(16px);backdrop-filter:saturate(140%) blur(16px);color:var(--ink);border-bottom-color:var(--line);height:68px}

.header__left{justify-self:start}
.header__right{justify-self:end}

.nav-toggle{display:inline-flex;align-items:center;gap:.7rem;font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;padding-block:6px}
.nav-toggle__bars{position:relative;display:inline-block;width:17px;height:9px;flex:0 0 auto}
.nav-toggle__bars span{position:absolute;left:0;right:0;height:1px;background:currentColor;transition:transform .45s var(--ease)}
.nav-toggle__bars span:nth-child(1){top:0}
.nav-toggle__bars span:nth-child(2){top:4px}
.nav-toggle__bars span:nth-child(3){top:8px}
.nav-toggle:hover .nav-toggle__bars span:nth-child(1){transform:translateY(-1px)}
.nav-toggle:hover .nav-toggle__bars span:nth-child(3){transform:translateY(1px)}
.is-open .nav-toggle__bars span:nth-child(1){transform:translateY(4px) rotate(9deg)}
.is-open .nav-toggle__bars span:nth-child(2){opacity:0}
.is-open .nav-toggle__bars span:nth-child(3){transform:translateY(-4px) rotate(-9deg)}

.wordmark{justify-self:center;display:inline-flex;align-items:center}
.wordmark img{width:clamp(158px,15vw,264px);height:auto;object-fit:contain;transition:filter .5s var(--ease),width .4s var(--ease)}
.site-header--over:not(.is-stuck) .wordmark img{filter:brightness(0) invert(1)}
.aa-hero-wordmark .site-header--over:not(.is-stuck) .wordmark{opacity:0;pointer-events:none;transform:translateY(-6px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.wordmark__text{font-family:var(--display);font-size:clamp(15px,1.6vw,21px);letter-spacing:.3em;text-transform:uppercase;font-weight:400}

.header-cta{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;border-bottom:1px solid currentColor;padding-bottom:4px;transition:opacity .3s var(--ease)}
.header-cta:hover{opacity:.55}

.drawer{position:fixed;inset:0;z-index:55;pointer-events:none}
.drawer::before{content:"";position:absolute;inset:0;background:rgb(0 0 0 / 34%);opacity:0;transition:opacity .5s var(--ease)}
.drawer.is-open{pointer-events:auto}
.drawer.is-open::before{opacity:1}
.drawer__panel{position:absolute;inset:0 auto 0 0;width:min(440px,86vw);background:var(--noir);color:#fff;padding:calc(var(--header-h) + 2.4rem) clamp(1.6rem,3vw,3rem) 2.5rem;display:flex;flex-direction:column;transform:translateX(-100%);transition:transform .62s var(--ease-io);overflow-y:auto}
.drawer.is-open .drawer__panel{transform:none}
.drawer__eyebrow{color:rgb(255 255 255 / 55%);margin-bottom:2.2rem}
.drawer__list a{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;border-top:1px solid var(--line-inv);padding:.95rem 0;font-family:var(--display);font-weight:400;font-size:clamp(1.7rem,3.6vw,2.3rem);line-height:1.05;letter-spacing:-.01em;transition:padding-left .45s var(--ease)}
.drawer__list a:hover{padding-left:.5rem}
.drawer__list a span{font-family:var(--sans);font-size:9px;letter-spacing:.18em;color:rgb(255 255 255 / 45%)}
.drawer__foot{margin-top:auto;padding-top:2.4rem;font-size:9px;letter-spacing:.18em;text-transform:uppercase;text-decoration:underline;text-underline-offset:6px;color:rgb(255 255 255 / 75%)}

/* ============================================================
   03 — HERO (film-first)  — 4 modes for 9:16 source footage
   ============================================================ */
.hero{position:relative;height:100svh;min-height:600px;overflow:hidden;background:var(--noir);color:var(--paper)}
.hero__media{position:absolute;inset:0}
.hero__media video,.hero__media img{width:100%;height:100%;object-fit:cover;object-position:var(--focal,50% 45%)}
.hero__wash{position:absolute;inset:0;pointer-events:none;background:
  linear-gradient(180deg,rgb(0 0 0 / 52%) 0%,rgb(0 0 0 / 18%) 18%,transparent 34%,transparent 48%,rgb(0 0 0 / 58%) 100%),
  linear-gradient(90deg,rgb(0 0 0 / 34%),transparent 62%)}
.hero__grain{position:absolute;inset:0;pointer-events:none;opacity:.045;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}

.hero__copy{position:absolute;z-index:3;left:var(--gutter);bottom:clamp(5rem,11vh,8.5rem);max-width:min(72vw,760px)}
.hero__copy .eyebrow{font-family:var(--display);font-size:clamp(12px,1.05vw,15px);font-weight:400;letter-spacing:.2em;opacity:.92}
.hero__copy h1{margin-top:clamp(.9rem,2vw,1.8rem)}
.hero__copy h1 em{display:block;font-style:italic;font-size:.56em;letter-spacing:-.02em;margin-top:.12em}
.hero__cta{display:inline-flex;align-items:center;gap:.85rem;margin-top:clamp(1.8rem,3.4vw,2.9rem);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;border-bottom:1px solid currentColor;padding-bottom:8px}
.hero__cta i{font-style:normal;font-size:14px;line-height:1;transition:transform .35s var(--ease)}
.hero__cta:hover i{transform:translateY(3px)}
.hero__foot{position:absolute;z-index:3;left:var(--gutter);bottom:1.9rem;font-size:8px;letter-spacing:.2em;text-transform:uppercase;opacity:.72}
.hero__sound{position:absolute;z-index:3;right:var(--gutter);bottom:1.9rem;font-size:8px;letter-spacing:.2em;text-transform:uppercase;opacity:.72;border-bottom:1px solid currentColor;padding-bottom:3px}

/* --- MODE A: cover — the default. 16:9 master on desktop, 9:16 reel on mobile. --- */
.hero--cover .hero__media video{object-fit:cover;object-position:var(--focal,50% 42%)}
.hero--cover .hero__copy{max-width:min(58vw,820px)}
/* Ultra-wide monitors: hold the frame, don't let type drift to the far edge. */
@media(min-width:2000px){
  .hero--cover .hero__copy{left:max(var(--gutter),calc(50vw - 940px))}
  .hero--cover .hero__foot{left:max(var(--gutter),calc(50vw - 940px))}
}

/* --- MODE B: cinema (9:16 kept whole, centred on a black canvas, hairline frame) --- */
.hero--cinema{background:var(--noir)}
.hero--cinema .hero__media{display:flex;align-items:center;justify-content:center}
.hero--cinema .hero__stage{position:relative;height:calc(100svh - 8rem);aspect-ratio:9/16;max-width:min(38vw,460px);overflow:hidden;box-shadow:0 40px 120px -40px rgb(0 0 0 / 55%)}
.hero--cinema .hero__stage video,.hero--cinema .hero__stage img{width:100%;height:100%;object-fit:cover}
.hero--cinema .hero__stage::after{content:"";position:absolute;inset:0;border:1px solid rgb(255 255 255 / 30%);pointer-events:none}
.hero--cinema .hero__ambient{position:absolute;inset:-6%;z-index:0;filter:blur(58px) saturate(115%);opacity:.34;transform:scale(1.15)}
.hero--cinema .hero__ambient video,.hero--cinema .hero__ambient img{width:100%;height:100%;object-fit:cover}
.hero--cinema .hero__wash{background:linear-gradient(180deg,rgb(0 0 0 / 55%) 0%,rgb(0 0 0 / 12%) 34%,rgb(0 0 0 / 12%) 66%,rgb(0 0 0 / 62%) 100%)}
.hero--cinema .hero__copy{max-width:min(30vw,420px);bottom:auto;top:50%;transform:translateY(-50%)}
.hero--cinema .hero__copy .d1{font-size:clamp(2.6rem,4.4vw,5rem)}

/* --- MODE C: split (video in the right column, type breathes on white) --- */
.hero--split{background:var(--paper);color:var(--ink);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.78fr);align-items:stretch}
.hero--split .hero__media{position:relative;inset:auto;grid-column:2;height:100svh}
.hero--split .hero__media video,.hero--split .hero__media img{object-position:50% 40%}
.hero--split .hero__wash,.hero--split .hero__grain{display:none}
.hero--split .hero__type{grid-column:1;grid-row:1;display:flex;flex-direction:column;justify-content:center;padding:var(--header-h) clamp(2rem,5vw,5.5rem) 3rem var(--gutter)}
.hero--split .hero__copy{position:static;max-width:none}
.hero--split .hero__copy .d1{font-size:clamp(3rem,5.4vw,6.4rem)}
.hero--split .hero__foot{color:var(--ink);opacity:.6}
.hero--split .hero__sound{color:var(--paper)}

/* --- MODE D: triptych (three reels become one 16:9 field) --- */
.hero--triptych .hero__media{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--noir)}
.hero--triptych .hero__panel{position:relative;overflow:hidden}
.hero--triptych .hero__panel video,.hero--triptych .hero__panel img{width:100%;height:100%;object-fit:cover}
.hero--triptych .hero__panel::after{content:"";position:absolute;inset:0;background:rgb(0 0 0 / 14%);transition:background .6s var(--ease)}
.hero--triptych .hero__panel:hover::after{background:rgb(0 0 0 / 0%)}
.hero--triptych .hero__wash{background:linear-gradient(180deg,rgb(0 0 0 / 46%) 0%,transparent 30%,transparent 54%,rgb(0 0 0 / 66%) 100%)}

/* ============================================================
   04 — ARCHIVE INDEX (home + collections)
   ============================================================ */
.archive-intro{padding-top:calc(var(--header-h) + clamp(3.5rem,8vw,8rem));padding-bottom:clamp(3rem,6vw,6rem)}
.archive-intro .d1{margin-top:clamp(1.2rem,2.6vw,2.6rem)}
.archive-intro__meta{margin-top:clamp(2.6rem,5vw,5rem);margin-left:min(40vw,580px);border-top:1px solid var(--line-strong);padding-top:1rem;display:grid;grid-template-columns:1fr 1.4fr;gap:2rem}
.archive-intro__meta p{font-size:10px;letter-spacing:.14em;text-transform:uppercase;line-height:1.7}

.collection-row{padding-block:clamp(1.1rem,2.1vw,2.1rem)}
.collection-row:first-child{padding-top:clamp(2.2rem,4vw,4rem)}
.collection-row--continued{padding-top:clamp(.5rem,.9vw,.9rem)}
.collection-row--continued .collection-row__head{margin-bottom:clamp(.65rem,1.1vw,1rem)}
.collection-row__head{margin-bottom:clamp(.85rem,1.5vw,1.4rem)}
.collection-row__title{display:flex;align-items:baseline;gap:clamp(.7rem,1.4vw,1.4rem);flex-wrap:wrap}
.collection-row__title h2{font-family:var(--display);font-weight:400;font-size:clamp(1.7rem,3.3vw,3.7rem);letter-spacing:.004em;line-height:1;text-transform:uppercase}
.collection-row__title h2 a{transition:opacity .35s var(--ease)}
.collection-row__title h2 a:hover{opacity:.45}
.collection-row__season{font-family:var(--display);font-weight:400;font-size:clamp(1.7rem,3.3vw,3.7rem);letter-spacing:.035em;line-height:1;color:var(--ink-3);text-transform:uppercase;white-space:nowrap}

/* ---- feature row: one wide plate, three portraits beneath (Wedding) ---- */
.feature-row__lead{display:block;overflow:hidden;background:var(--matte);margin-bottom:clamp(.5rem,.85vw,.85rem)}
.feature-row__lead img{width:100%;aspect-ratio:16/9;object-fit:cover;transition:transform 1.1s var(--ease)}
.feature-row__lead:hover img{transform:scale(1.02)}
.feature-row__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.5rem,.85vw,.85rem)}


/* ---- magazine row: the mastheads carry the section, set as type ---- */
.magazine-row{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;border-top:1px solid var(--line-strong)}
.magazine-row span{display:grid;place-items:center;text-align:center;min-height:clamp(6.5rem,13vw,12rem);border-bottom:1px solid var(--line-strong);font-family:var(--display);font-weight:400;font-size:clamp(1.4rem,3vw,3.4rem);line-height:1;letter-spacing:-.008em;text-transform:uppercase;padding:1rem;transition:color .4s var(--ease)}
.magazine-row span+span{border-left:1px solid var(--line-strong)}

/* ---- grid row: named appearances, four across ---- */
.grid-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(.5rem,.85vw,.85rem)}
.grid-row figcaption{padding-top:.6rem;font-size:8.5px;letter-spacing:.17em;text-transform:uppercase;color:var(--ink-3)}

/* horizontal drag rail */
.rail{position:relative}
.rail__track{display:flex;gap:clamp(.5rem,.85vw,.85rem);overflow-x:auto;scroll-snap-type:x proximity;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none;cursor:grab}
.rail__track::-webkit-scrollbar{display:none}
.rail__track.is-dragging{cursor:grabbing;scroll-snap-type:none;scroll-behavior:auto}
.rail__track.is-dragging a{pointer-events:none}
.rail__item{flex:0 0 calc(33.333% - .57rem);scroll-snap-align:start}

/* A plate with a second view swaps to it on hover. A plate with only one view
   has nothing to swap to, so it leans in instead — never fading out to nothing. */
.plate{position:relative;overflow:hidden;background:var(--matte)}
.plate img,.plate video{display:block;width:100%;aspect-ratio:3/5;object-fit:cover}
.plate--film{background:var(--noir)}
.plate--film::after{content:"";position:absolute;left:14px;bottom:14px;width:7px;height:7px;border-radius:50%;background:#fff;box-shadow:0 0 0 4px rgb(255 255 255 / 22%);animation:aa-pulse 2.6s var(--ease) infinite}
@keyframes aa-pulse{0%,100%{box-shadow:0 0 0 4px rgb(255 255 255 / 22%)}50%{box-shadow:0 0 0 7px rgb(255 255 255 / 8%)}}
.plate .plate-front{transition:opacity .55s var(--ease),transform 1s var(--ease)}
.plate-alt{position:absolute;inset:0;height:100%;opacity:0;transition:opacity .55s var(--ease),transform 1s var(--ease)}
a:hover .plate--pair .plate-front{opacity:0}
a:hover .plate--pair .plate-alt{opacity:1}
a:hover .plate--single .plate-front{transform:scale(1.08)}
@media(hover:none){
  .plate-alt{display:none}
  a:hover .plate--pair .plate-front{opacity:1}
}

.rail__arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:44px;height:44px;border-radius:50%;background:#fff;border:1px solid var(--line-strong);display:grid;place-items:center;color:var(--ink);opacity:.85;transition:opacity .35s var(--ease),box-shadow .3s var(--ease),transform .3s var(--ease)}
.rail__arrow svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:1.4}
.rail__arrow--prev{left:calc(var(--gutter) * -0.5)}
.rail__arrow--next{right:calc(var(--gutter) * -0.5)}

.rail__arrow:hover{box-shadow:0 6px 22px -8px rgb(0 0 0 / 35%);transform:translateY(-50%) scale(1.07)}
.rail__arrow[disabled]{opacity:0;pointer-events:none}


/* ============================================================
   05 — SINGLE COLLECTION (Elie Saab structure)
   ============================================================ */
.coll-hero{position:relative;height:100svh;min-height:560px;overflow:hidden;background:var(--noir);color:var(--paper)}
.coll-hero__title{position:absolute;z-index:3;left:var(--gutter);bottom:clamp(4rem,9vh,7rem);max-width:min(80vw,900px)}
.coll-hero__title h1{margin-top:.7rem}
.coll-hero__title .eyebrow{font-family:var(--display);font-size:clamp(12px,1.05vw,15px);font-weight:400;letter-spacing:.2em}

.coll-meta{padding-block:clamp(3.4rem,7vw,7.5rem);display:grid;grid-template-columns:minmax(150px,.5fr) minmax(0,1.3fr) minmax(160px,.55fr);gap:clamp(1.6rem,4vw,4.5rem);align-items:start}
.coll-meta__side{display:flex;flex-direction:column;gap:.5rem;font-family:var(--display);font-size:clamp(13px,1.1vw,17px);letter-spacing:.14em;text-transform:uppercase}
.coll-meta__side span:last-child{color:var(--ink-3)}
.coll-meta__note{max-width:300px}

.lookbook{padding-bottom:clamp(5rem,10vw,11rem)}
/* Three to a row, in order: 1 left, 2 centre, 3 right. No stagger, no offsets. */
.lookbook__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-flow:row;gap:clamp(1rem,2.2vw,2.6rem) clamp(.9rem,1.8vw,2rem)}
.look-card{grid-column:auto;margin-top:0}
.look-card--wide{grid-column:span 2}
.look-card--offset,.look-card--right{grid-column:auto;margin-top:0}

.coll-nav{border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr}
.coll-nav a{padding:clamp(2.4rem,5vw,4.5rem) 0;display:block}
.coll-nav a:last-child{text-align:right}
.coll-nav a+a{border-left:1px solid var(--line);padding-left:2rem}
.coll-nav .d3{margin-top:.7rem;transition:color .4s var(--ease)}
.coll-nav a:hover .d3{color:var(--accent)}

/* ============================================================
   06 — SINGLE LOOK
   ============================================================ */
.look{padding-top:calc(var(--header-h) + clamp(1.5rem,3vw,3rem));padding-bottom:clamp(5rem,10vw,10rem)}
.look__back{font-size:9px;letter-spacing:.18em;text-transform:uppercase;opacity:.7;transition:opacity .3s var(--ease)}
.look__back:hover{opacity:1;color:var(--accent)}
.look__layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(280px,.62fr);gap:clamp(2rem,6vw,7rem);margin-top:clamp(1.8rem,4vw,4rem)}
.look__stage{position:relative;background:var(--paper);overflow:hidden;aspect-ratio:3/5}
.look__stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .55s var(--ease)}
.look__stage img.is-active{opacity:1}
.look__arrow{position:absolute;top:50%;transform:translateY(-50%);width:46px;height:46px;display:grid;place-items:center;background:rgb(255 255 255 / 88%);font-size:15px;transition:background .3s var(--ease)}
.look__arrow:hover{background:var(--paper)}
.look__arrow--prev{left:0}
.look__arrow--next{right:0}
.look__count{position:absolute;right:0;bottom:0;background:rgb(0 0 0 / 72%);color:var(--paper);font-size:8px;letter-spacing:.17em;padding:9px 13px}
.look__thumbs{display:grid;grid-template-columns:repeat(5,1fr);gap:.5rem;margin-top:.6rem}
.look__thumbs button{opacity:.42;transition:opacity .3s var(--ease)}
.look__thumbs button.is-active,.look__thumbs button:hover{opacity:1}
.look__thumbs button.is-active img{outline:1px solid var(--accent);outline-offset:3px}
.look__thumbs img{width:100%;aspect-ratio:3/5;object-fit:cover}
.look__info{position:sticky;top:calc(var(--header-h) + 1.5rem);align-self:start}
.look__info h1{margin-top:.9rem}
.look__info .rule-gold{margin:clamp(2rem,4vw,3.4rem) 0 1.1rem}
.look__enquire{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:2.4rem;border-bottom:1px solid var(--accent);padding-bottom:9px;font-size:9px;letter-spacing:.17em;text-transform:uppercase;transition:color .3s var(--ease)}
.look__enquire:hover{color:var(--accent)}

/* ============================================================
   07 — GENERIC PAGE / EDITORIAL
   ============================================================ */
.page-head{padding-top:calc(var(--header-h) + clamp(3.5rem,8vw,8rem));padding-bottom:clamp(2rem,4vw,4rem)}
.entry{max-width:760px;margin-left:min(24vw,360px);padding-bottom:clamp(5rem,10vw,10rem)}

/* ---- news listing ---- */
.news-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.6rem,3vw,3rem) clamp(.9rem,1.8vw,2rem);padding-bottom:clamp(3rem,6vw,6rem)}
.news-card a{display:block}
.news-card .plate{margin-bottom:1.1rem}
.news-card__date{margin-bottom:.5rem}
.news-card__title{font-family:var(--display);font-weight:400;font-size:clamp(1.15rem,1.7vw,1.6rem);line-height:1.2;letter-spacing:-.008em;margin-bottom:.5rem}
.news-card a:hover .news-card__title{color:var(--ink-3)}
.news-card__excerpt{color:var(--ink-2)}
.pagination{padding-bottom:clamp(4rem,8vw,8rem)}
.pagination .nav-links{display:flex;gap:1.2rem;font-family:var(--sans);font-size:11px;letter-spacing:.22em;text-transform:uppercase}
.pagination .current{color:var(--ink-3)}
.entry p{font-size:14px;line-height:1.95;margin-bottom:1.5em}
.entry h2{font-family:var(--display);font-weight:300;font-size:clamp(1.8rem,3vw,2.8rem);letter-spacing:-.03em;margin:2.4em 0 .7em}
.entry h3{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3);margin:2.2em 0 .8em}
.entry img{margin-block:2.4rem}
.entry a{border-bottom:1px solid var(--accent);padding-bottom:1px}
.entry blockquote{font-family:var(--display);font-style:italic;font-size:clamp(1.3rem,2.2vw,2rem);line-height:1.45;margin:2.6rem 0;padding-left:1.6rem;border-left:1px solid var(--accent)}

/* contact band */
.band-contact{background:var(--noir);color:#fff;padding-block:clamp(3.4rem,7vw,7rem);margin-inline:calc(var(--gutter)*-1);padding-inline:var(--gutter)}
.band-contact .thread-dot{border-color:rgb(255 255 255 / 55%)}
.band-contact .thread-dot::after{background:rgb(255 255 255 / 55%)}
.band-contact .d2{margin-top:.8rem}
/* ---- centred contact: title, form, then one hairline row of details ---- */
.band-contact--centred{text-align:center}
.band-contact--centred .eyebrow{display:block}
.band-contact__sub{margin-top:1.1rem;font-family:var(--display);font-size:clamp(1rem,1.4vw,1.35rem);color:rgb(255 255 255 / 72%)}
.band-contact--centred .enquiry{max-width:760px;margin-inline:auto;border-top:1px solid var(--line-inv)}
.band-contact--centred .enquiry__heading{text-align:center}
.band-contact--centred .enquiry__form{max-width:100%}
.band-contact--centred .enquiry__send{align-self:center;min-width:min(320px,100%)}
.band-contact--centred .enquiry input,.band-contact--centred .enquiry select,.band-contact--centred .enquiry textarea{text-align:left}
.contact-line{display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:.6rem clamp(1.2rem,2.6vw,2.6rem);max-width:900px;margin:clamp(2.6rem,5vw,4.2rem) auto 0;border-top:1px solid var(--line-inv);padding-top:clamp(1.4rem,2.4vw,2rem);font-family:var(--display);font-size:clamp(.95rem,1.2vw,1.2rem);line-height:1.5}
.contact-line a{border-bottom:1px solid rgb(255 255 255 / 28%);padding-bottom:2px;transition:border-color .35s var(--ease)}
.contact-line a:hover{border-bottom-color:#fff}
.contact-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.5rem,3vw,3.5rem);margin-top:clamp(2.4rem,5vw,4.5rem);border-top:1px solid var(--line-inv);padding-top:1.4rem}
.contact-grid h3{font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;color:rgb(255 255 255 / 50%);margin-bottom:1rem;font-weight:400}
.contact-grid li{margin-bottom:.55rem;font-family:var(--display);font-size:clamp(1rem,1.3vw,1.3rem);line-height:1.45}
.contact-grid a{border-bottom:1px solid rgb(255 255 255 / 28%);padding-bottom:2px;transition:border-color .35s var(--ease)}
.contact-grid a:hover{border-bottom-color:#fff}
/* ---- enquiry form: hairline fields on the noir band ---- */
.enquiry{margin-top:clamp(2.6rem,5vw,4.6rem);border-top:1px solid var(--line-inv);padding-top:clamp(1.8rem,3vw,2.8rem)}
.enquiry__heading{font-family:var(--sans);font-weight:400;font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:rgb(255 255 255 / 62%);margin-bottom:1.6rem}
.enquiry__note{font-family:var(--display);font-size:clamp(1.05rem,1.5vw,1.45rem);margin-bottom:1.4rem;color:#fff}
.enquiry__trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.enquiry__form{display:flex;flex-direction:column;gap:clamp(.6rem,1vw,.9rem);max-width:1100px}
.enquiry__row{display:grid;gap:clamp(.6rem,1vw,.9rem)}
.enquiry__row--three{grid-template-columns:minmax(0,.62fr) minmax(0,1fr) minmax(0,1fr)}
.enquiry__row--two{grid-template-columns:repeat(2,minmax(0,1fr))}
.field{display:block}
.enquiry input,.enquiry select,.enquiry textarea{width:100%;font-family:var(--sans);font-size:12.5px;letter-spacing:.06em;color:#fff;background:transparent;border:1px solid rgb(255 255 255 / 28%);border-radius:0;padding:14px 16px;transition:border-color .35s var(--ease),background .35s var(--ease)}
.enquiry textarea{resize:vertical;min-height:150px;line-height:1.7}
.enquiry input::placeholder,.enquiry textarea::placeholder{color:rgb(255 255 255 / 58%)}
.enquiry input:hover,.enquiry select:hover,.enquiry textarea:hover{border-color:rgb(255 255 255 / 48%)}
.enquiry input:focus,.enquiry select:focus,.enquiry textarea:focus{outline:none;border-color:#fff;background:rgb(255 255 255 / 5%)}
.enquiry select{appearance:none;-webkit-appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%23ffffff' stroke-width='1.2'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center;background-size:11px;padding-right:40px}
.enquiry select option{background:var(--noir);color:#fff}
.enquiry__send{margin-top:clamp(.4rem,.8vw,.8rem);align-self:stretch;background:#fff;color:var(--noir);font-size:10px;letter-spacing:.28em;text-transform:uppercase;padding:18px 20px;transition:opacity .3s var(--ease)}
.enquiry__send:hover{opacity:.82}

.band-contact__cta{display:flex;justify-content:space-between;align-items:baseline;gap:2rem;margin-top:clamp(2.4rem,5vw,4rem);border-bottom:1px solid rgb(255 255 255 / 45%);padding-bottom:12px;font-family:var(--display);font-size:clamp(1.35rem,2.5vw,2.5rem);letter-spacing:.004em;text-transform:uppercase}
.band-contact__cta span{font-size:.66em;transition:transform .35s var(--ease)}
.band-contact__cta:hover span{transform:translate(5px,-5px)}

/* press ribbon */
.press-ribbon{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line-strong)}
.press-ribbon span{display:grid;place-items:center;text-align:center;min-height:clamp(7rem,16vw,15rem);border-bottom:1px solid var(--line-strong);font-family:var(--display);font-weight:300;font-size:clamp(1.7rem,3.6vw,4.4rem);line-height:.85;letter-spacing:-.04em}
.press-ribbon span+span{border-left:1px solid var(--line-strong)}

/* ============================================================
   08 — FOOTER
   ============================================================ */
.site-footer{border-top:1px solid var(--line);padding:clamp(2.6rem,5vw,4.6rem) var(--gutter) 1.8rem;display:grid;grid-template-columns:1.1fr 1fr auto;gap:2rem;align-items:end}
.site-footer nav{display:flex;flex-wrap:wrap;gap:.9rem 2rem}
.site-footer a,.site-footer p{font-size:8px;letter-spacing:.18em;text-transform:uppercase;margin:0}
.site-footer a:hover{color:var(--accent)}
.site-footer p{text-align:right;opacity:.7}


/* ---- About / the House ---- */
.about-lead{padding-top:calc(var(--header-h) + clamp(3rem,7vw,7rem));padding-bottom:clamp(2.5rem,5vw,5rem)}
.about-lead h1{margin-top:1.1rem;max-width:16ch}
.about-lead .lede{max-width:46ch;margin-top:clamp(1.6rem,3vw,2.6rem)}
.band-wide{margin:clamp(2rem,5vw,5rem) 0}
.band-wide img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}
.about-body>*+*{margin-top:1rem}
.about-body h2{font-family:var(--display);font-weight:400;font-size:clamp(1.8rem,3.6vw,3rem);line-height:1.06;letter-spacing:-.015em;margin-top:clamp(2.5rem,6vw,6rem);padding-top:clamp(2.5rem,6vw,6rem);border-top:1px solid var(--line)}
.about-body h3{font-family:var(--sans);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-3);margin-top:2rem;margin-bottom:.9rem}
.about-body ul{list-style:none}
.about-body li{padding:.42rem 0;border-bottom:1px solid var(--line)}
.two-col{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,6vw,7rem);padding:clamp(2.5rem,6vw,6rem) 0;border-top:1px solid var(--line)}
.two-col h2{margin-bottom:1.2rem}
.two-col p+p{margin-top:1rem}
.about-sec{padding:clamp(2.5rem,6vw,6rem) 0;border-top:1px solid var(--line)}
.about-sec>.eyebrow{margin-bottom:1.1rem}
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1.2rem,3vw,3rem);margin-top:clamp(2rem,4vw,3.4rem)}
.step__n{font-family:var(--sans);font-size:10px;letter-spacing:.24em;color:var(--accent);margin-bottom:.7rem}
.step h3{font-family:var(--display);font-weight:400;font-size:clamp(1.05rem,1.5vw,1.4rem);margin-bottom:.6rem}
.lists{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(2rem,5vw,5rem);margin-top:clamp(1.6rem,3vw,2.6rem)}
.lists h3{font-family:var(--sans);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-3);margin-bottom:1rem}
.lists ul{list-style:none}
.lists li{padding:.42rem 0;border-bottom:1px solid var(--line)}
.founder{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:clamp(2rem,6vw,6rem);align-items:start;padding:clamp(3rem,7vw,7rem) 0;border-top:1px solid var(--line)}
.founder__portrait img{width:100%;aspect-ratio:3/5;object-fit:cover;display:block}
.founder__portrait figcaption{margin-top:.9rem;font-family:var(--sans);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2)}
.cv{margin-top:clamp(2rem,4vw,3rem);border-top:1px solid var(--line)}
.cv__row{display:grid;grid-template-columns:110px minmax(0,1fr);gap:clamp(1rem,3vw,2.6rem);padding:1.3rem 0;border-bottom:1px solid var(--line)}
.cv__year{font-family:var(--sans);font-size:10px;letter-spacing:.2em;color:var(--ink-3);padding-top:.35rem}
.cv__house{font-family:var(--display);font-size:clamp(1.05rem,1.5vw,1.35rem);margin-bottom:.35rem}
.eyebrow--spaced{margin-top:2.6rem}
.namelist{display:flex;flex-wrap:wrap;row-gap:.35rem;margin-top:1.1rem;max-width:54ch;list-style:none}
.namelist li{padding:0;border-bottom:0;white-space:nowrap;font-family:var(--display);font-size:clamp(.95rem,1.15vw,1.1rem)}
.namelist li:not(:last-child)::after{content:"\00B7";margin:0 .62rem;color:var(--ink-3)}
.about-cta{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:clamp(2.5rem,5vw,4.5rem) 0;border-top:1px solid var(--line);font-family:var(--sans);font-size:10px;letter-spacing:.22em;text-transform:uppercase}

/* ============================================================
   09 — RESPONSIVE
   ============================================================ */
/* desktop-first refinements */
@media(min-width:1700px){
  .lookbook__grid{gap:clamp(1.4rem,2.4vw,3rem) clamp(1.1rem,2vw,2.4rem)}
}

@media(max-width:1279px) and (min-width:761px){
  .lookbook__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .look-card,.look-card--wide,.look-card--offset,.look-card--right{grid-column:auto;margin-top:0}
  .news-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid-row{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:960px) and (min-width:761px){
  .rail__item{flex-basis:calc(50% - .43rem)}
  .feature-row__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:760px){
  :root{--header-h:66px}
  .site-nav,.header-cta{display:none}
  .nav-toggle{display:block}
  .wordmark img{width:min(46vw,178px)}

  .hero{min-height:560px}
  .hero__copy{left:1.25rem;right:1.25rem;bottom:6.2rem;max-width:none}
  .hero--cinema .hero__stage{max-width:none;width:100%;height:100svh;aspect-ratio:auto}
  .hero--cinema .hero__ambient{display:none}
  .hero--cinema .hero__copy{position:absolute;top:auto;bottom:6.2rem;transform:none;max-width:none}
  .hero--split{display:block;height:auto;background:var(--noir);color:var(--paper)}
  .hero--split .hero__media{height:78svh}
  .hero--split .hero__type{padding:2.4rem 1.25rem 3rem}
  .hero--split .hero__foot{position:static;margin-top:2rem;color:var(--paper)}
  .hero--triptych .hero__media{grid-template-columns:1fr}
  .hero--triptych .hero__panel:nth-child(n+2){display:none}

  .archive-intro__meta{margin-left:0;display:block}
  .archive-intro__meta p+p{margin-top:.9rem}
  .rail__item{flex-basis:calc(78% - .43rem)}
  .rail__arrow{display:none}
  .magazine-row{grid-auto-flow:row}
  .magazine-row span+span{border-left:0}
  .enquiry__row--three,.enquiry__row--two{grid-template-columns:1fr}
  .contact-grid{grid-template-columns:1fr}
  .feature-row__grid{display:flex;gap:clamp(.5rem,2vw,.85rem);overflow-x:auto;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none}
  .feature-row__grid::-webkit-scrollbar{display:none}
  .feature-row__grid>a{flex:0 0 calc(78% - .43rem);scroll-snap-align:start}
  .grid-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .news-grid{grid-template-columns:1fr;gap:2.4rem}
  .contact-grid{gap:1.9rem}
  .two-col,.founder,.lists{grid-template-columns:1fr;gap:2.2rem}
  .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cv__row{grid-template-columns:1fr;gap:.5rem}

  .coll-meta{grid-template-columns:1fr;gap:1.6rem}
  .coll-meta__side{flex-direction:row;gap:1.2rem}
  .lookbook__grid{grid-template-columns:repeat(2,1fr);gap:1rem}
  .look-card,.look-card--wide,.look-card--offset,.look-card--right{grid-column:span 1;margin-top:0}
  .coll-nav{grid-template-columns:1fr}
  .coll-nav a:last-child{text-align:left}
  .coll-nav a+a{border-left:0;border-top:1px solid var(--line);padding-left:0}

  .look__layout{grid-template-columns:1fr;gap:2rem}
  .look__info{position:static}
  .look__thumbs{grid-template-columns:repeat(4,1fr)}

  .entry{margin-left:0}
  .band-contact__cta{margin-left:0}
  .press-ribbon{grid-template-columns:1fr}
  .press-ribbon span+span{border-left:0}
  .press-ribbon span{justify-content:start;text-align:left;padding-left:1rem;min-height:6.5rem}
  .site-footer{grid-template-columns:1fr;align-items:start}
  .site-footer p{text-align:left}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
  .reveal{opacity:1;transform:none}
  .thread{transform:scaleX(1)}
}

/* WP core alignment classes */
.alignwide{width:min(100%,1180px)}
.alignfull{width:100vw;margin-left:calc(50% - 50vw)}
.aligncenter{margin-inline:auto;display:block}
.wp-caption-text,.wp-element-caption{font-size:8px;letter-spacing:.16em;text-transform:uppercase;margin-top:.6rem;opacity:.7}