/* Shared global header and footer refinement */
:root{--header-height:80px}
.site-header{background:rgba(247,242,234,.97);border-bottom:1px solid rgba(141,104,78,.12)}
.header-inner{height:80px}
.desktop-nav{font-size:10px;letter-spacing:.14em;font-weight:500}
.desktop-nav a{position:relative}
.desktop-nav a:after{content:"";position:absolute;left:0;right:0;bottom:-10px;height:1px;background:var(--brown);transform:scaleX(0);transform-origin:center;transition:transform .25s ease}
.desktop-nav a.active:after{transform:scaleX(1)}

.brand{display:flex;align-items:center;justify-content:center;line-height:1}
.brand-logo{display:block;width:96px;height:auto;max-height:58px;object-fit:contain}
.brand-light .brand-logo{width:108px;max-height:64px}
.brand-mark,.brand-name,.brand-sub{display:none}
.footer-brand .brand{align-items:flex-start}
.footer-brand .brand-logo{width:108px}
.service-card{transition:transform .25s ease,box-shadow .25s ease}
.service-card>img{transition:transform .3s ease}
.service-card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(60,37,22,.12)}
.service-card:hover>img{transform:scale(1.02)}
.service-card .card-copy a span{display:inline-block;transition:transform .25s ease}
.service-card:hover .card-copy a span{transform:translateX(4px)}
.services-all-link{display:block;width:max-content;margin:25px auto 0;color:var(--brown);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.14em}
.services-all-link span{display:inline-block;margin-left:4px;transition:transform .25s ease}
.services-all-link:hover span{transform:translateX(4px)}
.hero-slider{position:absolute;inset:0;overflow:hidden;touch-action:pan-y}
.hero-slide{position:absolute;inset:0;visibility:hidden;opacity:0;transition:opacity .85s ease;z-index:0}
.hero-slide.is-active{visibility:visible;opacity:1;z-index:1}
.hero-slide .hero-image{z-index:1}
.hero-slide .hero-shade{z-index:2}
.hero-slide{display:flex;align-items:center}
.hero-slide .hero-content{z-index:3;margin-top:var(--header-height);padding-top:0}
.hero h2{max-width:650px;margin:0 0 22px;font:500 clamp(3.7rem,7vw,6.8rem)/.8 var(--serif);letter-spacing:-.04em}
.hero-meta{z-index:4}
.hero-navigation{display:flex;align-items:center;gap:14px}
.hero-nav{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-width:44px;min-height:44px;padding:0;border:0;background:transparent;color:inherit;font:inherit;font-size:10px;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;transition:opacity .25s ease,transform .25s ease}
.hero-nav:hover{opacity:.68;transform:translateY(-1px)}
.hero-nav:focus-visible{outline:1px solid currentColor;outline-offset:3px}
.hero-nav span{font-size:8px}
.hero-scroll{position:absolute;right:0;top:50%;z-index:1;display:block;white-space:nowrap;color:inherit;text-transform:uppercase;letter-spacing:.17em;font-size:9px;transform:translateY(-50%);transition:opacity .25s ease,transform .25s ease}
.hero-scroll:hover{opacity:.72;transform:translateY(calc(-50% + 2px))}
.story{scroll-margin-top:90px}
@media (prefers-reduced-motion:reduce){.hero-slide{transition:none}.hero-scroll,.hero-nav{transition:none}}

@media(max-width:1100px){.header-inner{gap:12px}.desktop-nav{gap:15px}}
@media(max-width:767px){
  :root{--header-height:65px}
  .header-inner{height:65px}
  .brand-logo{width:82px;max-height:52px}
  .brand-light .brand-logo,.footer-brand .brand-logo{width:96px}
  .desktop-nav{display:none}
  .menu-toggle{display:flex}
  .mobile-nav>a{font-size:28px}
  .menu-close{min-width:44px;min-height:44px}
  .hero-meta{align-items:center}
  .hero-navigation{gap:8px}
  .hero-nav span{display:none}
  .hero-slide .hero-content{margin-top:var(--header-height)}
  .hero h1,.hero h2{font-size:clamp(2.8rem,14vw,4.6rem);line-height:.82;margin-bottom:23px}
}

@media (max-height:720px) and (min-width:768px){
  .hero h1,.hero h2{font-size:clamp(3.35rem,6.4vw,5.8rem);margin-bottom:18px}
  .hero-copy{margin-bottom:22px}
  .hero-slide .hero-content{margin-top:calc(var(--header-height) - 12px)}
}

@media (max-height:740px) and (max-width:767px){
  .hero h1,.hero h2{font-size:clamp(3rem,15vw,4.6rem);margin-bottom:17px}
  .hero-copy{margin-bottom:19px}
  .hero-slide .hero-content{margin-top:calc(var(--header-height) - 8px)}
}
