/* Aplomb / editorial finish. Layout remains in main.css; this layer handles
   the type, surface, image treatments and transitions shared across pages. */
:root{--gold:#c9a67c;--hairline:#24272029;--ease-out:cubic-bezier(.19,1,.22,1)}
body{font-feature-settings:"kern" 1,"liga" 1}
em{font-style:italic}
.site-header{position:sticky;top:0;z-index:100;background:color-mix(in srgb,var(--paper) 94%,transparent);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);transition:background .3s,box-shadow .3s}
.site-header.is-scrolled{background:color-mix(in srgb,var(--paper) 97%,transparent);box-shadow:0 12px 36px #1918120c}
.header-nav a,.header-contact{position:relative}
.header-nav a::after,.header-contact::after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease-out)}
.header-nav a:hover::after,.header-nav a:focus-visible::after,.header-nav .current-menu-item>a::after,.header-nav a[aria-current="page"]::after,.header-contact:hover::after{transform:scaleX(1)}
.wordmark{transition:letter-spacing .4s var(--ease-out)}
.wordmark:hover{letter-spacing:-.04em}
.menu-toggle{position:relative;z-index:105}

.hero-copy{position:relative}
.hero-copy::after{content:"";position:absolute;right:clamp(24px,4vw,70px);bottom:39px;width:32px;height:32px;border-right:1px solid var(--hairline);border-bottom:1px solid var(--hairline);pointer-events:none}
.hero h1{font-weight:300}
.hero h1 em{font-weight:300}
.hero-visual::after{content:"";position:absolute;inset:17px;border:1px solid #fff6;pointer-events:none}
.hero-visual-top{position:absolute;top:34px;left:34px;right:34px;display:flex;justify-content:space-between;z-index:1;color:#f7f4ed;font-size:9px;font-weight:600;letter-spacing:.18em;text-shadow:0 1px 8px #19181288}
.hero-visual-label{bottom:35px;left:34px;right:34px;z-index:1}
.hero-rail{color:#52544e}
.eyebrow-line{background:var(--accent);height:1px}
.section-number .rule{background:linear-gradient(90deg,var(--accent),var(--line) 16%,var(--line))}

.look-image::after{content:"";position:absolute;inset:13px;border:1px solid #fff9;opacity:0;transform:scale(1.025);transition:opacity .6s,transform .75s var(--ease-out);pointer-events:none}
.look-card:hover .look-image::after,.look-card:focus-visible .look-image::after{opacity:1;transform:scale(1)}
.look-image-number{position:absolute;left:21px;top:12px;z-index:1;color:#f8f1e8b8;font-family:var(--serif);font-size:clamp(65px,6.5vw,115px);font-weight:300;line-height:1;letter-spacing:-.06em;text-shadow:0 2px 20px #1e1b1555;pointer-events:none}
.look-card .look-caption h2,.look-card .look-caption h3{transition:color .35s var(--ease-out)}
.look-card:hover .look-caption h2,.look-card:hover .look-caption h3{color:var(--accent)}
.look-card[data-reveal].reveal-pending .look-image img{transform:scale(1.11)}
.look-card[data-reveal].is-visible .look-image img{transform:scale(1)}
.look-card[data-reveal].is-visible:hover .look-image img{transform:scale(1.055)}
.reveal-pending{transform:translateY(38px);transition:opacity 1s var(--ease-out),transform 1s var(--ease-out)}
.look-card:nth-child(2)[data-reveal]{transition-delay:.1s}
.look-card:nth-child(3)[data-reveal]{transition-delay:.18s}
.text-link{transition:color .3s,border-color .3s,gap .45s var(--ease-out)}
.text-link:hover{gap:39px}
.round-link{position:relative;overflow:hidden}
.round-link::before{content:"";position:absolute;inset:0;border-radius:50%;background:var(--accent);transform:scale(0);transition:transform .45s var(--ease-out)}
.round-link>span{position:relative;z-index:1}
.round-link:hover::before{transform:scale(1)}
.round-link:hover{background:transparent;border-color:var(--accent)}
.round-link--light::before{background:#ead9c4}
.round-link--light:hover{color:#20211d}

.campaign>img{transform:scale(1.035);transition:transform 1.8s var(--ease-out)}
.campaign:hover>img{transform:scale(1)}
.campaign-shade{background:linear-gradient(90deg,#16130fbd 0%,#16130f48 47%,transparent 82%),linear-gradient(0deg,#15120e9e,transparent 60%)}
.campaign h2{font-weight:300}
.campaign-bottom{padding-bottom:72px}
.campaign-bottom .kicker{letter-spacing:.26em;color:#f0cda2}

.material{background-image:radial-gradient(ellipse at var(--light-at,70%) 47%,#e3aa6024,transparent 42%),linear-gradient(90deg,#100e0dcf,#100e0d75 47%,#100e0d17),url("../images/silk-bronze.webp");background-size:cover;background-position:var(--light-at,70%) center,center,center}
.material::before{display:none}
.material-grain{opacity:.16}
.material .kicker{color:#ebcc9f}
.material-control input::-webkit-slider-thumb{box-shadow:0 0 0 5px #fff2}
.material-control input::-moz-range-thumb{box-shadow:0 0 0 5px #fff2}

.maison-story-image,.single-look-image,.page-hero-image{position:relative;overflow:hidden}
.maison-story-image::after,.single-look-image::after,.page-hero-image::after{content:"";position:absolute;inset:16px;border:1px solid #fff8;pointer-events:none}
.maison-story-image img,.page-hero-image img{transition:transform 1.1s var(--ease-out)}
.maison-story-image:hover img,.page-hero-image:hover img{transform:scale(1.045)}
.story-card-image::after,.journal-card-image::after{content:"";position:absolute;inset:12px;border:1px solid #fff7;pointer-events:none}
.story-card h3,.journal-card h2{transition:color .35s}
.story-card:hover h3,.journal-card:hover h2{color:var(--accent)}
.breadcrumbs{gap:15px}
.breadcrumbs>span:not(:last-child){color:var(--accent)}
.article-cover img{filter:saturate(.84)}
.footer-wordmark{font-weight:300}

@media(max-width:900px){
  .mobile-menu{position:fixed;top:76px;left:0;right:0;height:calc(100dvh - 76px);padding:0;background:#20221e;color:#f5f0e6;border:0;box-shadow:0 24px 60px #1516134d;overflow-x:hidden;overflow-y:auto;scrollbar-width:none;overscroll-behavior:contain;isolation:isolate}
  .mobile-menu::-webkit-scrollbar{display:none}
  .mobile-menu::before{content:"";position:absolute;inset:0 0 0 61%;background:linear-gradient(90deg,#20221e55,#20221e22),url("../images/look-noir.webp") center 35%/cover;opacity:.72;z-index:-1}
  .mobile-menu-inner{min-height:100%;width:61%;display:flex;flex-direction:column;padding:38px 0 30px var(--gutter)}
  .mobile-menu-overline,.mobile-menu-bottom{font-size:10px;font-weight:600;letter-spacing:.18em}
  .mobile-menu-overline{color:#cba785}
  .mobile-menu-links{margin:auto 0}
  .mobile-menu-links>a,.mobile-menu-list a{display:flex;align-items:baseline;justify-content:space-between;gap:18px;padding:13px 0;color:#f5f0e6;border-bottom:1px solid #e8ded439;font-family:var(--serif);font-size:clamp(67px,7vw,104px);font-weight:300;letter-spacing:-.065em;line-height:.95;transition:color .35s,padding-left .45s var(--ease-out)}
  .mobile-menu-links>a:hover,.mobile-menu-list a:hover{color:#d5a878;padding-left:10px}
  .mobile-menu-links>a>span,.mobile-menu-list a::after{font-family:var(--sans);font-size:10px;font-weight:600;letter-spacing:.18em;color:#bdb6a9}
  .mobile-menu-list{list-style:none;margin:0;padding:0;counter-reset:menu}
  .mobile-menu-list li{counter-increment:menu}
  .mobile-menu-list a::after{content:counter(menu,decimal-leading-zero)}
  .mobile-menu-bottom{display:flex;align-items:end;justify-content:space-between;gap:18px;padding-top:28px;border-top:1px solid #e8ded439;color:#bdb6a9}
  .mobile-menu-bottom>a{font-family:var(--sans);font-size:10px;letter-spacing:.14em;color:#f5f0e6;white-space:nowrap}
  .mobile-menu-bottom>a>span{margin-left:15px;font-size:20px}
  body.menu-open{overflow:hidden}
}
@media(max-width:700px){
  .mobile-menu{top:66px;height:calc(100dvh - 66px)}
  .mobile-menu::before{inset:0;background:radial-gradient(circle at 93% 7%,#b05f4327,transparent 50%)}
  .mobile-menu::after{content:"A";position:absolute;right:0;bottom:-.2em;font:300 95vw/.8 var(--serif);color:#f5f0e608;pointer-events:none}
  .mobile-menu-inner{position:relative;z-index:1;width:100%;padding:33px var(--gutter) 28px}
  .mobile-menu-links>a,.mobile-menu-list a{font-size:clamp(70px,14vw,112px);padding:17px 0}
  .mobile-menu-bottom{display:block}
  .mobile-menu-bottom>a{display:inline-block;margin-top:21px}
  .hero-visual-top{top:27px;left:27px;right:27px}
  .hero-visual-label{left:27px;right:27px;bottom:27px}
  .hero-visual::after{inset:13px}
  .hero-copy::after{display:none}
  .look-image-number{font-size:68px;top:10px;left:13px}
  .material{background-position:var(--light-at,70%) center,center,60% center}
}
@media(max-width:480px){
  .mobile-menu-links>a,.mobile-menu-list a{font-size:68px}
  .hero-visual-top{font-size:8px}
  .hero-visual-label{font-size:8px}
  .look-image-number{font-size:58px}
  .campaign-bottom{padding-bottom:42px}
}
@view-transition{navigation:auto}
@media(prefers-reduced-motion:reduce){
  ::view-transition-old(root),::view-transition-new(root){animation:none}
  .look-card[data-reveal].reveal-pending .look-image img,.look-card[data-reveal].is-visible .look-image img{transform:none}
  .reveal-pending{opacity:1;transform:none;transition:none}
  .campaign>img,.campaign:hover>img{transform:none;transition:none}
  .maison-story-image img,.page-hero-image img,.text-link,.round-link,.look-image img{transition:none}
}
@media(prefers-reduced-motion:no-preference){
  ::view-transition-old(root){animation:.28s ease both apl-page-out}
  ::view-transition-new(root){animation:.48s var(--ease-out) both apl-page-in}
  @keyframes apl-page-out{to{opacity:0;transform:translateY(-8px)}}
  @keyframes apl-page-in{from{opacity:0;transform:translateY(18px)}}
}
