/* Atelier layer: a calmer gallery feel on top of the base styles.
   Fluid type, hairline rules, rounded image cards inset from the page edge,
   pill buttons with rolling labels, numbered chapters. Original code. */
:root{
  --wrap:1360px;
  --pad:clamp(1.25rem,4.6vw,4.75rem);
  --gutter:clamp(.6rem,1.15vw,1.25rem);           /* inset of rounded panels from the viewport edge */
  --radius:clamp(14px,2.3vw,36px);
  --radius-s:clamp(8px,1vw,14px);
  --nav-h:80px;
  --hair:color-mix(in srgb,currentColor 24%,transparent);
  --ease-roll:cubic-bezier(.77,0,.175,1);
  --ease-rise:cubic-bezier(.165,.84,.44,1);
  /* fluid type scale */
  --t-h1:clamp(3rem,1.35rem + 7.2vw,8.75rem);
  --t-h1s:clamp(2.6rem,1.4rem + 5vw,6.5rem);
  --t-h2:clamp(2.35rem,1.45rem + 3.9vw,5.4rem);
  --t-h3:clamp(1.6rem,1.25rem + 1.3vw,2.5rem);
  --t-lede:clamp(1.3rem,1.05rem + 1.05vw,2rem);
  --t-label:.72rem;
}

/* ---------- Type ---------- */
h1,h2,h3{font-weight:500;letter-spacing:-.012em}
h1{font-size:var(--t-h1);line-height:.98}
h2{font-size:var(--t-h2);line-height:1.02}
h3{font-size:var(--t-h3);line-height:1.08}
h1 .accent,h2 .accent,h3 .accent{font-style:normal}
.lede{font-size:var(--t-lede);line-height:1.3;letter-spacing:-.005em}
.eyebrow{font:600 var(--t-label)/1.3 var(--sans);letter-spacing:.16em;display:flex;gap:.9rem;margin-bottom:1.4rem}
.eyebrow::before{content:none}
.eyebrow::after{content:"";flex:1;height:1px;width:auto;background:currentColor;opacity:.3}
.center .eyebrow,.hero .eyebrow,.editorial .eyebrow{justify-content:center}
.center .eyebrow::after,.hero .eyebrow::after,.editorial .eyebrow::after{content:none}
.hero .eyebrow::before{content:none}
/* numbered chapters on the home page */
body{counter-reset:chapter}
.chapter{counter-increment:chapter}
.chapter .eyebrow:first-of-type::before{content:counter(chapter,decimal-leading-zero);width:auto;height:auto;background:none;font:500 1rem/1 var(--serif);letter-spacing:.06em;text-transform:none}

/* ---------- Utility bar + header ---------- */
.topbar{background:var(--ivory);color:var(--muted);font:600 .7rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;border-bottom:1px solid var(--line)}
.topbar .wrap{min-height:36px}
.topbar a{color:var(--charcoal)}
.topbar a:hover{color:var(--taupe-deep)}
.site-header{background:color-mix(in srgb,var(--ivory) 90%,transparent);border-bottom:1px solid transparent;transition:transform .6s var(--ease-expo),border-color .4s,background .4s}
.site-header.scrolled{box-shadow:none;border-bottom-color:var(--line)}
.nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:center}
.nav .menu-btn{display:inline-flex;justify-self:start;width:auto;gap:.75rem;padding:0 .25rem;border:0;background:none;font:600 var(--t-label)/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--charcoal)}
.brand{justify-self:center}
.brand img{height:54px}
.nav .nav-cta{justify-self:end;display:none;min-height:42px;padding:.7rem 1.3rem}
@media(min-width:560px){.nav .nav-cta{display:inline-flex}}
.burger{position:relative;display:block;width:26px;height:9px}
.burger i{position:absolute;left:0;right:0;height:1px;background:currentColor;transition:transform .7s var(--ease-roll)}
.burger i:first-child{top:0;transform-origin:left}
.burger i:last-child{bottom:0;transform-origin:right}
.menu-btn:hover .burger i:first-child{transform:scaleX(.55)}
.menu-btn:hover .burger i:last-child{transform:scaleX(.55)}
.burger.x i{top:50%;bottom:auto;transform-origin:center}
.burger.x i:first-child{transform:rotate(45deg)}
.burger.x i:last-child{transform:rotate(-45deg)}
.menu-close:hover .burger.x i:first-child{transform:rotate(135deg)}
.menu-close:hover .burger.x i:last-child{transform:rotate(45deg)}

/* ---------- Rolling label (hover): word slides up, copy rises from below ---------- */
.roll{position:relative;display:inline-block;overflow:hidden;vertical-align:middle;line-height:1.3}
.roll>span{display:block;transition:transform .8s var(--ease-roll)}
.roll::after{content:attr(data-t);content:attr(data-t) / "";position:absolute;left:0;right:0;top:100%;text-align:inherit;transition:transform .8s var(--ease-roll)}
:is(a,button):is(:hover,:focus-visible) .roll>span,
:is(a,button):is(:hover,:focus-visible) .roll::after{transform:translateY(-100%)}

/* ---------- Pill buttons ---------- */
.btn{border-radius:999px;font:600 var(--t-label)/1 var(--sans);letter-spacing:.16em;padding:.95rem 1.75rem}
.btn::before{border-radius:50% 50% 0 0/80% 80% 0 0;transition:transform .8s var(--ease-roll),border-radius .8s var(--ease-roll)}
.btn:hover::before{border-radius:0}
.btn-ghost{border-color:var(--hair)}
.btn-ghost:hover{border-color:currentColor}
.text-link{font-size:var(--t-label);letter-spacing:.16em;display:inline-flex}

/* ---------- Rounded panels: hero, dark/cream sections, editorial, footer ---------- */
.hero-card{margin:0 var(--gutter);border-radius:var(--radius);min-height:max(560px,min(calc(100svh - 132px),920px))}
.hero-card.hero-sm{min-height:clamp(380px,62vh,640px)}
.hero::after{background:linear-gradient(180deg,rgba(var(--overlay),.28) 0%,rgba(var(--overlay),.18) 40%,rgba(var(--overlay),.72) 100%)}
.hero .wrap{display:flex;flex-direction:column;align-items:center;text-align:center;padding-bottom:clamp(2.25rem,5vw,4rem)}
.hero h1{max-width:14ch;margin-bottom:.2em}
.hero-sm h1{font-size:var(--t-h1s);max-width:16ch}
.hero .tagline{margin-left:auto;margin-right:auto;font-size:clamp(1.2rem,1rem + .9vw,1.7rem)}
.hero .btn-row{justify-content:center}
.hero-progress{display:flex;align-items:center;gap:1rem;max-width:none;margin-top:2.25rem}
.hp-bars{display:flex;gap:.5rem;width:clamp(150px,18vw,240px)}
.hp-num{font:500 .95rem/1 var(--serif);color:rgba(247,244,238,.85);min-width:1.4em}

.section.bg-navy,.section.bg-cream,.section.bg-forest,.section.bg-stone{margin:var(--gutter);border-radius:var(--radius)}
.bg-stone{background:var(--sand)}
.hogs h2{font-size:clamp(3.4rem,1.5rem + 9vw,11rem);line-height:1;font-style:normal;color:var(--taupe-deep);margin:0}

/* ---------- Grid + spacing ---------- */
.section{padding:clamp(4.5rem,10vw,9rem) 0}
.section.tight{padding:clamp(3.25rem,7vw,6rem) 0}
.section-head{margin-bottom:clamp(2.75rem,6vw,5rem)}
@media(min-width:900px){
  .split{grid-template-columns:repeat(12,1fr);column-gap:clamp(1rem,2vw,2rem)}
  .split>:first-child{grid-column:1/span 6;grid-row:1}
  .split>:last-child{grid-column:8/span 5;grid-row:1}
  .split.rev>:first-child{grid-column:7/span 6;order:0}
  .split.rev>:last-child{grid-column:1/span 5}
  .barber-grid{grid-template-columns:repeat(12,1fr);column-gap:clamp(1rem,2vw,2rem)}
  .barber-grid>:first-child{grid-column:1/span 5}
  .barber-grid>:last-child{grid-column:6/span 7}
}

/* ---------- Images: rounded, no frame chrome ---------- */
.frame-wrap{padding:0!important}
.frame-wrap::before{content:none}
.frame,.subscribe .mask,.video,.editorial .mask,.person .mask{border-radius:var(--radius);overflow:hidden}
.video{border:0}
.events a,.configurator,.partner .ph{border-radius:var(--radius-s);overflow:hidden}
.events a{border:0}
.configurator{border:0}

/* Quick links: hairline list, circle icon, text glides on hover */
.quick{background:transparent;border-bottom:1px solid var(--line)}
.quick a:hover{background:transparent}
.quick a>span:last-child{transition:transform .8s var(--ease-roll)}
.quick a:hover>span:last-child{transform:translateX(.6rem)}
.quick .ico{border-radius:50%;border-color:var(--hair);color:var(--charcoal);transition:background .5s,color .5s,border-color .5s,transform .8s var(--ease-roll)}
.quick a:hover .ico{background:var(--charcoal);border-color:var(--charcoal);color:var(--ivory);transform:rotate(-12deg)}

/* Location cards: image-led, hairline label row, numbered */
.cards{counter-reset:card;gap:clamp(1.5rem,2.4vw,2.5rem)}
.card{background:none;border:0}
.card figure{border-radius:var(--radius);overflow:hidden}
.card img{aspect-ratio:4/5}
.card .body{padding:1.5rem 0 0}
.card .loc{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--hair);padding-top:.9rem;margin-bottom:1rem;font:600 var(--t-label)/1.3 var(--sans);letter-spacing:.16em;color:var(--taupe-deep)}
.card .loc::after{counter-increment:card;content:counter(card,decimal-leading-zero);font:500 1rem/1 var(--serif);letter-spacing:.06em}
.card h3{font-size:clamp(1.8rem,1.3rem + 1.6vw,2.7rem)}
/* Zoom-in figure reveal: frame grows to size while the photo settles */
.card .grow{transform:scale(.86);transition:transform 1.6s var(--ease-rise);transition-delay:calc(var(--i,0) * 110ms)}
.card .grow img{transform:scale(1.35);transition:transform 2s var(--ease-rise)}
.card.in .grow{transform:none}
.card.in .grow img{transform:scale(1)}
.card.in:hover .grow img{transform:scale(1.05);transition-duration:1.4s}

/* Partners + staff: drop the boxes, keep the type */
.partner{background:none;border:0}
.partner .ph{background:var(--paper)}
.partner .body{padding:1.1rem 0 0;border-top:1px solid var(--hair);margin-top:1rem}
.person .mask{margin-bottom:1.1rem}
.person img{margin-bottom:0}

/* Editorial chapter: a rounded card that grows to full width as it scrolls in */
.editorial{margin:var(--gutter) var(--gutter)}
.editorial .mask{transform:scale(calc(.9 + .1 * var(--g,1)));transform-origin:center bottom}
.editorial .mask::after{background:linear-gradient(180deg,rgba(var(--overlay),.2) 0%,rgba(var(--overlay),.2) 40%,rgba(var(--overlay),.78) 100%)}
.editorial img{height:clamp(460px,86vh,900px)}
.editorial .cap{text-align:center}
.editorial .eyebrow{color:var(--champagne)}
.editorial h2{margin:0 auto;max-width:16ch;font-size:var(--t-h2)}
[data-parallax] picture{display:block;transform:translate3d(0,var(--py,0%),0) scale(1.12)}

/* Forms + lists */
.form input,.form textarea,.form select{border-radius:var(--radius-s)}
.info-list li{border-bottom-color:var(--hair)}
.open-badge{border-radius:999px}

/* Brands strip: hairlines only */
.marquee{background:var(--dove);border-color:var(--greige)}
.marquee img{mix-blend-mode:multiply}

/* ---------- Footer: a dark rounded panel with a dash-joined colophon ---------- */
.site-footer{margin:var(--gutter);border-radius:var(--radius);background:var(--charcoal)}
.site-footer h2{font:600 var(--t-label)/1.3 var(--sans);letter-spacing:.16em;color:var(--champagne);padding-bottom:.8rem;border-bottom:1px solid rgba(236,231,223,.16)}
.socials a{border-radius:50%}
.foot-bottom{align-items:center;font-size:.8rem}
.colophon{display:flex;flex-wrap:wrap;gap:.4rem .6rem}
.colophon a+a::before{content:"—";content:"—" / "";margin-right:.6rem;color:rgba(236,231,223,.45)}
@media(max-width:799px){.site-footer{margin-bottom:calc(var(--gutter) + 4px)}}

/* ---------- Menu: big hairline-separated entries, numbered, alternating ---------- */
.menu-overlay .mo-top{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:calc(var(--nav-h) + 36px)}
.menu-close{justify-self:start;width:auto;height:48px;display:inline-flex;align-items:center;gap:.75rem;border:0;padding:0 .25rem;font:600 var(--t-label)/1 var(--sans);letter-spacing:.16em;text-transform:uppercase}
.mo-logo{height:54px;width:auto}
.menu-overlay .mo-list{counter-reset:mo;display:flex;flex-direction:column;justify-content:center;padding:0 var(--pad)}
.menu-overlay .mo-list li{border-bottom:1px solid rgba(236,231,223,.14)}
.menu-overlay .mo-list li:first-child{border-top:1px solid rgba(236,231,223,.14)}
.menu-overlay .mo-list a{display:flex;align-items:center;gap:clamp(.9rem,2vw,2rem);padding:clamp(.3rem,1.1vh,.75rem) 0;font:500 clamp(1.75rem,min(5.4vw,6.1vh),4.75rem)/1.06 var(--serif);letter-spacing:-.012em}
.menu-overlay .mo-list a::before{counter-increment:mo;content:counter(mo,decimal-leading-zero);font:600 .7rem/1 var(--sans);letter-spacing:.14em;color:var(--champagne);align-self:flex-start;margin-top:.7em;flex:none}
.mo-label{display:inline-block;transition:transform .9s var(--ease-roll)}
.mo-desc{margin-left:auto;font:600 var(--t-label)/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--mist-2);opacity:0;transform:translateX(-1rem);transition:opacity .5s,transform .9s var(--ease-roll)}
.mo-thumb{flex:none;width:clamp(84px,9vw,150px);aspect-ratio:3/2;border-radius:var(--radius-s);overflow:hidden;opacity:0;transform:scale(.6);transition:opacity .5s,transform .9s var(--ease-roll)}
.mo-thumb img{width:100%;height:100%;object-fit:cover}
.menu-overlay .mo-list a:is(:hover,:focus-visible) .mo-label{transform:translateX(1.25rem)}
.menu-overlay .mo-list a:is(:hover,:focus-visible) :is(.mo-desc,.mo-thumb){opacity:1;transform:none}
.menu-overlay .mo-list a[aria-current="page"] .mo-label{color:var(--champagne)}
@media(min-width:1024px){
  .menu-overlay .mo-list li:nth-child(even) a{flex-direction:row-reverse}
  .menu-overlay .mo-list li:nth-child(even) .mo-desc{margin-left:0;margin-right:auto;transform:translateX(1rem)}
  .menu-overlay .mo-list li:nth-child(even) a:is(:hover,:focus-visible) .mo-label{transform:translateX(-1.25rem)}
}
@media(max-width:699px),(hover:none){.mo-desc,.mo-thumb{display:none}}
.menu-overlay .mo-foot{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1.25rem;font-size:.85rem}

/* ---------- Scroll reveals: text blocks rise line by line ---------- */
.reveal{transform:translate3d(0,clamp(2rem,4vw,3.5rem),0);transition:opacity 1.1s var(--ease-rise),transform 1.2s var(--ease-rise);transition-delay:calc(var(--i,0) * 110ms)}
.reveal.kids{opacity:1;transform:none}
.reveal.kids>:not(.rule){opacity:0;transform:translate3d(0,clamp(1.5rem,3vw,2.75rem),0);transition:opacity 1.1s var(--ease-rise),transform 1.2s var(--ease-rise);transition-delay:calc(var(--i,0) * 110ms + var(--k,0) * 70ms)}
.reveal.kids.in>:not(.rule){opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  .reveal.kids>*,.card .grow,.card .grow img,[data-parallax] picture,.editorial .mask{opacity:1!important;transform:none!important}
  .roll::after{display:none}
  .roll>span{transform:none!important}
}
.no-js .card .grow,.no-js .card .grow img{transform:none}

/* Keep caption clear of the card edge while it grows; keep hours on one line on phones */
.editorial .cap{bottom:clamp(2.25rem,6vw,4.5rem)}
.hours td+td{white-space:nowrap;padding-left:1rem}
@media(max-width:420px){.hours{font-size:.9rem}}

/* ---------- Logo prominence: larger centered header mark that shrinks on scroll, hero lockup ---------- */
.site-header{--nh:clamp(84px,4.6rem + 2.6vw,116px);--lh:clamp(62px,3.4rem + 2.2vw,90px);--nh-s:clamp(62px,3.4rem + .9vw,76px);--lh-s:clamp(44px,2.4rem + .8vw,56px)}
.site-header .nav{height:var(--nh);transition:height .6s var(--ease-expo)}
.site-header .brand img{height:var(--lh);width:auto;transition:height .6s var(--ease-expo)}
/* keep the header's in-flow footprint constant while it shrinks, so the page never jumps */
.site-header{margin-bottom:0;transition:transform .6s var(--ease-expo),border-color .4s,background .4s,margin-bottom .6s var(--ease-expo)}
.site-header.scrolled{margin-bottom:calc(var(--nh) - var(--nh-s))}
.site-header.scrolled .nav{height:var(--nh-s)}
.site-header.scrolled .brand img{height:var(--lh-s)}
.mo-logo{height:clamp(62px,3.4rem + 2.2vw,90px)}
.menu-overlay .mo-top{height:calc(clamp(84px,4.6rem + 2.6vw,116px) + 36px)}
.foot-brand img{width:clamp(140px,12vw,180px);height:auto}
.hero-card{min-height:max(560px,min(calc(100svh - 36px - clamp(84px,4.6rem + 2.6vw,116px) - var(--gutter)),920px))}
.hero-logo{margin:0 auto clamp(1.1rem,2.4vw,2rem)}
.hero-logo img{width:clamp(150px,7.5rem + 12vw,340px);height:auto;filter:drop-shadow(0 2px 22px rgba(var(--overlay),.5))}
.hero-home::after{background:radial-gradient(ellipse 60% 48% at 50% 46%,rgba(var(--overlay),.44),rgba(var(--overlay),0) 72%),linear-gradient(180deg,rgba(var(--overlay),.3) 0%,rgba(var(--overlay),.18) 40%,rgba(var(--overlay),.74) 100%)}
.hero-home h1{font-size:clamp(2.4rem,1.2rem + 4.4vw,5.6rem);max-width:none}
@media(max-width:559px){.hero-home .tagline{margin-bottom:1.5rem}}
.hero .hero-logo picture{position:static;inset:auto;z-index:auto;display:block}
.hero .hero-logo img{width:clamp(150px,7.5rem + 12vw,340px);height:auto;object-fit:contain}
.menu-overlay .mo-foot .btn-gold{color:var(--charcoal-deep)}
/* Lookbook: Yosemite shoot backdrop — giant sequoias: keep the model (centred) and both trunks in frame; deeper scrim under the caption */
.editorial img.lookbook-bg{object-position:34% 6%}
.editorial .mask:has(.lookbook-bg)::after{background:linear-gradient(180deg,rgba(var(--overlay),.1) 0%,rgba(var(--overlay),.12) 34%,rgba(var(--overlay),.6) 64%,rgba(var(--overlay),.9) 100%)}
@media (max-width:640px){.editorial img.lookbook-bg{object-position:25% 12%}}
.editorial .cap .btn-row{justify-content:center;margin-top:1.6rem}

/* ---------- Menu overlay: robust on short / scaled screens ----------
   The rows are overflow:hidden (line mask for the rise-in) inside a flex column; an overflow-hidden
   flex item has min-height 0, so on short viewports every row was squeezed to a sliver. Rows never
   shrink now, the overlay scrolls when the content is taller than the window, and type scales by min(vw,vh). */
.menu-overlay{overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.menu-overlay .mo-top,.menu-overlay .mo-foot{flex:none}
.menu-overlay .mo-list{flex:1 0 auto;overflow:visible;justify-content:safe center;padding-top:clamp(.25rem,1.5vh,1rem);padding-bottom:clamp(.25rem,1.5vh,1rem)}
.menu-overlay .mo-list li{flex:none;min-height:2.75rem}
.menu-overlay .mo-list a{min-height:2.75rem;padding:clamp(.3rem,1vh,.8rem) 0;font-size:clamp(1.3rem,min(max(5.4vw,1.75rem),4.5vh),4.75rem);line-height:1.14}
.menu-overlay .mo-list a::before{margin-top:.55em}
@media (max-height:820px){
  .menu-overlay .mo-top{height:clamp(64px,15vh,124px)}
  .menu-overlay .mo-logo{height:clamp(40px,9vh,72px)}
  .menu-overlay .mo-foot{padding-top:.75rem;padding-bottom:1rem}
}
/* The rise-in always ends fully visible: .settled (set on transitionend or a timeout) pins the final state */
.menu-overlay.settled li a{transform:none!important;transition:color .3s}
.menu-overlay.settled .mo-foot{opacity:1!important}
@media (prefers-reduced-motion:reduce){.menu-overlay li a{transform:none!important}.menu-overlay .mo-foot{transition:none!important}}

/* ---------- GO HOGS album: swipeable photo strip + lightbox ---------- */
.hogs .hg{margin-top:clamp(1.75rem,4vw,3rem)}
.hg-viewport{overflow:hidden}
.hg-strip{--h:clamp(220px,min(32vw,46vh),440px);position:relative;display:flex;gap:clamp(.6rem,1.2vw,1rem);list-style:none;margin:0;padding:0 var(--pad) .25rem;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding-inline:var(--pad);overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.hg-strip::-webkit-scrollbar{display:none}
.hg-strip:focus-visible{outline:2px solid var(--focus,#8a6d3b);outline-offset:4px}
.hg-item{flex:none;height:var(--h);aspect-ratio:var(--ar);max-width:86vw;scroll-snap-align:start;border-radius:var(--radius-s,6px);overflow:hidden;background:rgba(0,0,0,.06)}
@media(min-width:1500px){.hg-strip{justify-content:safe center}}
.hg-link{display:block;width:100%;height:100%;cursor:zoom-in}
.hg-link img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease-expo,cubic-bezier(.16,1,.3,1)),filter .6s}
.hg-link:is(:hover,:focus-visible) img{transform:scale(1.035)}
.hg-link:focus-visible{outline:2px solid var(--focus,#8a6d3b);outline-offset:-4px}
.hg-ctrl{display:flex;align-items:center;justify-content:center;gap:1.25rem;margin-top:1.25rem}
.hg-btn{width:48px;height:48px;border-radius:50%;border:1px solid var(--line,rgba(0,0,0,.2));background:transparent;color:var(--charcoal);display:grid;place-items:center;cursor:pointer;transition:background .3s,color .3s,opacity .3s}
.hg-btn svg{width:20px;height:20px}
.hg-btn:hover{background:var(--charcoal);color:var(--ivory)}
.hg-btn[disabled]{opacity:.35;pointer-events:none}
.hg-count{font:600 var(--t-label,.72rem)/1 var(--sans);letter-spacing:.16em;color:var(--taupe-deep);min-width:5.5em;text-align:center}
.hg-count b{color:var(--charcoal);font-weight:600}
.no-js .hg-ctrl{display:none}
.hg-box{position:fixed;inset:0;width:100vw;height:100vh;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:rgba(20,18,16,.96);color:var(--ivory)}
.hg-box::backdrop{background:rgba(20,18,16,.9)}
.hg-box[open]{display:grid;place-items:center;animation:hg-in .35s var(--ease-out,ease-out)}
@keyframes hg-in{from{opacity:0}}
.hg-box figure{margin:0;display:grid;justify-items:center;gap:.9rem;padding:clamp(3.5rem,8vh,5rem) clamp(1rem,7vw,6rem) 1.25rem}
.hg-box img{max-width:100%;max-height:calc(100dvh - 9rem);width:auto;height:auto;object-fit:contain;border-radius:4px}
.hg-box-n{font:600 var(--t-label,.72rem)/1 var(--sans);letter-spacing:.16em;color:var(--mist-2,#cfc8bd)}
.hg-box-btn{position:absolute;width:48px;height:48px;border-radius:50%;border:1px solid rgba(236,231,223,.35);background:rgba(20,18,16,.4);color:var(--ivory);display:grid;place-items:center;cursor:pointer}
.hg-box-btn svg{width:20px;height:20px}
.hg-box-btn:hover{background:var(--ivory);color:var(--charcoal)}
.hg-box-close{top:clamp(.75rem,2vw,1.5rem);right:clamp(.75rem,2vw,1.5rem)}
.hg-box-prev{left:clamp(.5rem,2vw,1.5rem);top:50%;transform:translateY(-50%)}
.hg-box-next{right:clamp(.5rem,2vw,1.5rem);top:50%;transform:translateY(-50%)}
@media(max-width:599px){.hg-box-prev,.hg-box-next{top:auto;bottom:1rem;transform:none}.hg-box figure{padding-bottom:4.5rem}}
@media (prefers-reduced-motion:reduce){.hg-strip{scroll-behavior:auto}.hg-link img{transition:none}.hg-box[open]{animation:none}}

/* ---------- Shoe designer: direct embed ---------- */
.configurator{display:block;width:100%;height:80vh;height:80svh;min-height:640px;max-height:1100px;border:0;background:var(--paper,#fff)}
.configurator-alt{margin:1rem 0 0;text-align:center;font-size:.9rem;color:var(--taupe-deep)}
.configurator-alt a{color:var(--charcoal);text-decoration:underline;text-underline-offset:.2em}

/* ---------- Hero copy in the original site's typeface (Cinzel 400 + Source Sans, as on the GoDaddy site) ---------- */
.hero h1,.hero h1 .accent{font-family:'Cinzel',Georgia,serif;font-weight:400;font-style:normal;letter-spacing:.045em;line-height:1.14;text-wrap:balance}
.hero-home h1{font-size:clamp(1.9rem,.9rem + 3.7vw,4.5rem);max-width:none}
.hero-sm h1{font-size:clamp(1.8rem,1rem + 2.9vw,3.7rem);max-width:22ch}
.hero .eyebrow{font-family:'Cinzel',Georgia,serif;font-weight:500;letter-spacing:.2em}
.hero .tagline{font-family:'Source Sans 3','Source Sans Pro',Arial,sans-serif;font-weight:400;font-style:normal;letter-spacing:.09em;line-height:1.45;font-size:clamp(1.02rem,.9rem + .55vw,1.5rem)}

/* ---------- Sitewide type (owner request, 28 Oct 2026): every page uses the homepage-hero pairing.
   Cinzel (display caps) for headings, eyebrows, numerals and menu titles; Source Sans 3 for body, UI, captions and forms.
   No italics anywhere: there are no italic font files, synthesis is off, and every element is forced upright.
   Accent words that used to be italic (span.accent) keep a colour accent instead. ---------- */
html{font-synthesis:none}
*,*::before,*::after{font-style:normal!important}
:root{
  --t-h1:clamp(2rem,1rem + 3.6vw,4.5rem);
  --t-h1s:clamp(1.8rem,1rem + 2.9vw,3.7rem);
  --t-h2:clamp(1.55rem,1rem + 2.2vw,3.25rem);
  --t-h3:clamp(1.12rem,.98rem + .55vw,1.55rem);
  --t-lede:clamp(1.08rem,.98rem + .5vw,1.4rem);
}
h1,h2,h3,h4{font-family:var(--serif);font-weight:400;letter-spacing:.035em;line-height:1.16;text-wrap:balance;overflow-wrap:break-word}
h3,h4{font-weight:500;letter-spacing:.03em;line-height:1.22}
.accent{color:var(--accent-ink,var(--bronze))}
.hero,.editorial,.site-footer,.menu-overlay,.pg-dark,.lb-cover,.hg-box{--accent-ink:var(--champagne)}
p .accent,li .accent{color:inherit;font-weight:600}
.lede{font-family:var(--sans);font-weight:300;letter-spacing:.01em;line-height:1.5}
.eyebrow,.hero .eyebrow{font-family:var(--serif);font-weight:500;letter-spacing:.2em}
.menu-overlay .mo-list a{font-family:var(--serif);font-weight:400;letter-spacing:.04em;font-size:clamp(1.15rem,min(max(4.4vw,1.4rem),4vh),3.75rem);line-height:1.18}
.hogs h2{font-size:clamp(2.5rem,1rem + 6.4vw,7.5rem);letter-spacing:.06em;line-height:1.02}
.editorial h2{max-width:20ch}
input,textarea,select,button{font-family:var(--sans)}