/* SHARED COMPONENTS | Structured production CSS | 2026-10-26 */
:root{--site-max-width:1600px;--site-edge:12px;--site-header-height:68px;--site-header-top:12px;--site-header-radius:22px;--site-gutter:clamp(22px,4vw,64px)}

/* Common page shell */
.page,.site-shell{width:min(calc(100% - (var(--site-edge) * 2)),var(--site-max-width));margin:0 auto 12px;border-radius:0 0 34px 34px;overflow:hidden;background:var(--cream)}

/* Common header geometry */
.site-header,.header.site-header,.sub-header.site-header{position:fixed;z-index:100;left:50%;right:auto;top:var(--site-header-top);width:min(calc(100% - (var(--site-edge) * 2)),var(--site-max-width));height:var(--site-header-height);min-height:var(--site-header-height);transform:translateX(-50%);translate:none;display:flex;align-items:center;justify-content:space-between;padding:0 var(--site-gutter);border:1px solid transparent;border-radius:var(--site-header-radius);color:var(--ink);transition:background-color .35s,box-shadow .35s,border-color .35s}
.sub-header.site-header,.header.site-header.is-scrolled{height:var(--site-header-height);border-color:rgba(255,255,255,.33);background:rgba(251,247,234,.92);backdrop-filter:blur(14px);box-shadow:0 10px 35px rgba(16,40,34,.075)}
.header.site-header:not(.is-scrolled){background:transparent;box-shadow:none}

/* Shared brand identity */
.site-header .site-brand{display:flex;align-items:center;gap:12px;min-width:0;color:inherit;text-decoration:none}
.site-header .brand-shop-name,.site-header .site-brand strong{font:600 clamp(20px,1.7vw,28px)/1.15 var(--serif);letter-spacing:.12em;white-space:nowrap}
.site-header .brand-origin,.site-header .site-brand small{display:block;margin:3px 0 0;padding-left:12px;border-left:1px solid currentColor;font:500 9px/1.4 var(--serif);letter-spacing:.12em;white-space:nowrap;opacity:.68}

/* Desktop navigation */
.site-header .site-nav{display:flex;align-items:center;justify-content:flex-end;gap:clamp(13px,1.4vw,24px);margin-left:auto}
.site-header .site-nav a{position:relative;color:inherit;text-decoration:none;white-space:nowrap;font:600 clamp(10px,.72vw,12px)/1.3 var(--sans);letter-spacing:.055em}
.site-header .site-nav a:not(.desktop-nav-contact)::after{content:"";position:absolute;left:0;right:100%;bottom:-6px;height:1px;background:currentColor;transition:right .25s}
.site-header .site-nav a:not(.desktop-nav-contact):hover::after{right:0}
.site-header .site-nav .desktop-nav-contact{padding:12px 17px;border-radius:999px;background:var(--ink);color:#fff!important}

/* Shared hamburger: the 48px box itself is vertically centered in the header. */
.site-header .site-menu-toggle{position:static;display:none;flex:0 0 48px;width:48px;height:48px;margin:0 0 0 auto;padding:0;transform:none;border:0;background:transparent;color:inherit;cursor:pointer;align-content:center;justify-content:center;gap:4px;transition:transform .2s ease}
.site-header .site-menu-toggle:hover{transform:translateY(-1px)}
.site-header .site-menu-toggle:active{transform:scale(.94)}
.site-header .site-menu-toggle span{display:block;font:9px/1 Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;transition:opacity .2s ease}
.site-header .site-menu-toggle i{display:block;width:28px;height:2px;margin:0 auto;background:currentColor;transform-origin:center;transition:transform .32s cubic-bezier(.22,1,.36,1),opacity .2s ease}
body.site-menu-open .site-header .site-menu-toggle i:nth-of-type(1){transform:translateY(6px) rotate(45deg)}
body.site-menu-open .site-header .site-menu-toggle i:nth-of-type(2){opacity:0;transform:scaleX(0)}
body.site-menu-open .site-header .site-menu-toggle i:nth-of-type(3){transform:translateY(-6px) rotate(-45deg)}

/* Shared expanded menu */
body.site-menu-open{overflow:hidden}
.site-menu-panel{position:fixed;z-index:140;inset:auto;left:50%;top:calc(var(--site-header-top) + var(--site-header-height) + 12px);width:min(calc(100% - (var(--site-edge) * 2)),var(--site-max-width));height:min(720px,calc(100vh - 104px));transform:translate(-50%,-14px) scale(.985);transform-origin:top center;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);visibility:hidden;opacity:0;pointer-events:none;background:var(--paper);border:1px solid rgba(255,255,255,.53);border-radius:34px;box-shadow:0 28px 80px rgba(7,20,15,.33);overflow:hidden;transition:opacity .3s ease,transform .42s cubic-bezier(.22,1,.36,1),visibility .42s}
body.site-menu-open .site-menu-panel{visibility:visible;opacity:1;pointer-events:auto;transform:translate(-50%,0) scale(1)}
.site-menu-main{padding:clamp(58px,6vw,96px);display:flex;flex-direction:column;justify-content:center}
.site-menu-main>small{margin-bottom:24px;font:700 10px Arial,sans-serif;letter-spacing:.22em;color:var(--vermilion)}
.site-menu-main nav{display:grid}
.site-menu-main a{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line);font:500 clamp(1.35rem,2.45vw,2.8rem)/1.3 var(--serif);text-decoration:none;opacity:0;transform:translateX(-18px);transition:opacity .34s ease,transform .42s cubic-bezier(.22,1,.36,1),color .2s ease}
body.site-menu-open .site-menu-main a{opacity:1;transform:translateX(0)}
body.site-menu-open .site-menu-main a:nth-child(1){transition-delay:.04s}
body.site-menu-open .site-menu-main a:nth-child(2){transition-delay:.07s}
body.site-menu-open .site-menu-main a:nth-child(3){transition-delay:.10s}
body.site-menu-open .site-menu-main a:nth-child(4){transition-delay:.13s}
body.site-menu-open .site-menu-main a:nth-child(5){transition-delay:.16s}
body.site-menu-open .site-menu-main a:nth-child(6){transition-delay:.19s}
body.site-menu-open .site-menu-main a:nth-child(7){transition-delay:.22s}
body.site-menu-open .site-menu-main a:nth-child(8){transition-delay:.25s}
.site-menu-main a span{font:10px Arial,sans-serif;letter-spacing:.15em}
.site-menu-side{position:relative;display:flex;align-items:end;justify-content:center;background:var(--ink);overflow:hidden}
.site-menu-side img{width:min(82%,520px);max-height:100%;object-fit:contain;object-position:bottom;filter:drop-shadow(0 25px 25px rgba(0,0,0,.5))}
.site-menu-side p{position:absolute;left:9%;top:9%;color:#fff;font:500 20px/1.8 var(--serif)}
.site-menu-panel .site-menu-close{position:absolute;z-index:2;right:28px;top:26px;width:50px;height:50px;border:1px solid currentColor;border-radius:50%;background:transparent;color:#fff;font-size:24px;line-height:1;cursor:pointer}

/* Shared footer */
.site-footer,footer.site-footer,.sub-footer.site-footer{width:min(calc(100% - (var(--site-edge) * 2)),var(--site-max-width));margin:0 auto;display:grid;grid-template-columns:1.2fr 1fr auto;align-items:center;gap:40px;padding:70px var(--site-gutter) 86px;border-top:1px solid rgba(255,255,255,.16);color:#fff}
.site-footer .site-footer-brand{display:flex;align-items:center;gap:12px;width:max-content;color:#fff;text-decoration:none}
.site-footer .site-footer-brand .brand-shop-name,.site-footer .site-footer-brand strong{font:600 23px/1.2 var(--serif);letter-spacing:.08em;white-space:nowrap}
.site-footer .site-footer-brand .brand-origin,.site-footer .site-footer-brand small{display:block;margin:0;padding-left:12px;border-left:1px solid rgba(255,255,255,.4);font:500 9px/1.4 var(--serif);letter-spacing:.12em;white-space:nowrap;opacity:.72}
.site-footer>p{margin:0;font-size:12px}
.site-footer nav{display:grid;gap:8px}
.site-footer nav a{color:#fff;text-decoration:none;font:11px Arial,sans-serif;letter-spacing:.12em}

@media(max-width:1100px){.site-header .site-nav{display:none}.site-header .site-menu-toggle{display:grid}}

@media(max-width:900px){
  :root{--site-edge:8px;--site-header-top:8px;--site-header-radius:18px;--site-gutter:18px}
  .page,.site-shell{width:100%;margin-bottom:0;border-radius:0}
  .site-header,.header.site-header,.sub-header.site-header{left:50%;right:auto;top:var(--site-header-top);width:calc(100% - (var(--site-edge) * 2));height:var(--site-header-height);transform:translateX(-50%);border-radius:var(--site-header-radius);background:rgba(251,247,234,.92);backdrop-filter:blur(14px)}
  .site-menu-panel{top:calc(var(--site-header-top) + var(--site-header-height) + 10px);width:calc(100% - (var(--site-edge) * 2));height:calc(100vh - 98px);grid-template-columns:1fr;border-radius:26px}
  .site-menu-side{display:none}
  .site-menu-main{padding:74px 26px 30px;overflow-y:auto}
  .site-menu-main a{font-size:clamp(1.25rem,5.7vw,2rem)}
  .site-menu-panel .site-menu-close{right:18px;top:16px;color:var(--ink)}
  .site-footer,footer.site-footer,.sub-footer.site-footer{width:100%;grid-template-columns:1fr 1fr}
  .site-footer .site-footer-brand{display:flex;grid-column:1/-1}
}

@media(max-width:600px){
  .site-header .brand-shop-name,.site-header .site-brand strong{font-size:19px;letter-spacing:.08em}
  .site-header .brand-origin,.site-header .site-brand small{display:none!important}
  .site-footer,footer.site-footer,.sub-footer.site-footer{grid-template-columns:1fr;gap:30px;padding:52px 22px 70px}
  .site-footer .site-footer-brand{grid-column:auto}
  .site-footer .site-footer-brand .brand-shop-name,.site-footer .site-footer-brand strong{font-size:19px;letter-spacing:.08em}
  .site-footer .site-footer-brand .brand-origin,.site-footer .site-footer-brand small{display:none}
}

@media(prefers-reduced-motion:reduce){
  .site-header .site-menu-toggle,.site-header .site-menu-toggle i,.site-menu-panel,.site-menu-main a{transition:none!important}
}