/* shared: tokens, base, top bar, pole, buttons, chips, footer, page curtain */
:root{
  --paper:#EEEBE5; --paper-2:#E4E0D8; --ink:#141312; --ink-2:#5E5A55; --line:rgba(20,19,18,.14);
  --accent:#B4432A;
  --sans:'Onest',system-ui,sans-serif; --serif:'Cormorant Garamond',Georgia,serif;
  --gut:clamp(16px,4vw,56px);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --paper:#121110; --paper-2:#1B1A18; --ink:#EDEAE4; --ink-2:#9A958E; --line:rgba(237,234,228,.14); --accent:#D2603F;
}}
:root[data-theme="dark"]{--paper:#121110; --paper-2:#1B1A18; --ink:#EDEAE4; --ink-2:#9A958E; --line:rgba(237,234,228,.14); --accent:#D2603F;}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
html.lenis{height:auto}.lenis.lenis-smooth{scroll-behavior:auto}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-weight:400;line-height:1.5;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit}
button,input,select{font:inherit;color:inherit}
em,.serif{font-family:var(--serif);font-style:italic;font-weight:500}
.label{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-2)}
.hint{font-size:14px;color:var(--ink-2)}

/* top bar */
.top{position:fixed;inset:0 0 auto;z-index:50;display:flex;justify-content:space-between;align-items:center;padding:18px var(--gut);mix-blend-mode:difference;color:#fff;pointer-events:none}
.top>*{pointer-events:auto}
.logo{font-weight:700;letter-spacing:.02em;font-size:18px;text-decoration:none}
.logo span{font-family:var(--serif);font-style:italic;font-weight:500}
.top nav{display:flex;gap:28px;font-size:14px}
.top nav a{text-decoration:none;opacity:.7;position:relative}
.top nav a:hover,.top nav a[aria-current="page"]{opacity:1}
.top nav a[aria-current="page"]::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:1px;background:currentColor}
@media (max-width:700px){.top{mix-blend-mode:normal;color:var(--ink);background:color-mix(in srgb,var(--paper) 90%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding-block:14px;border-bottom:1px solid var(--line)}.top nav{gap:16px;font-size:13px}.top nav .opt{display:none}}

/* barber-pole scroll progress */
.pole{position:fixed;right:0;top:0;bottom:0;width:4px;z-index:60;background:var(--line)}
.pole i{position:absolute;inset:0 0 auto;height:100%;transform-origin:top;transform:scaleY(0);
  background:repeating-linear-gradient(-45deg,var(--accent) 0 6px,var(--paper) 6px 12px,var(--ink) 12px 18px,var(--paper) 18px 24px);
  background-size:100% 34px;animation:poleRun 1.2s linear infinite}
@keyframes poleRun{to{background-position:0 34px}}

/* buttons & chips */
.btn{display:inline-flex;align-items:center;gap:10px;background:var(--ink);color:var(--paper);border:0;border-radius:99px;padding:14px 22px;font-weight:500;font-size:15px;text-decoration:none;cursor:pointer;transition:background .25s,color .25s}
.btn:hover{background:var(--accent);color:#fff}
.btn .arr{transition:transform .25s}
.btn:hover .arr{transform:translateX(4px)}
.btn.light{background:#fff;color:#141312}
.btn.light:hover{background:var(--accent);color:#fff}
.chip{border:1px solid var(--line);background:transparent;border-radius:99px;padding:7px 14px;font-size:13px;cursor:pointer;transition:border-color .2s,background .2s,color .2s}
.chip:hover{border-color:var(--ink)}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.chip:disabled{opacity:.3;text-decoration:line-through;cursor:not-allowed}

/* contacts & footer */
.contacts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;border-top:1px solid var(--line);padding-top:40px;margin:0 var(--gut) 40px}
.contacts>*{min-width:0}
.contacts p{margin-top:8px;font-size:16px}
@media (max-width:760px){.contacts{grid-template-columns:repeat(2,minmax(0,1fr))}}
.foot{padding:40px var(--gut) 28px;overflow:hidden}
.foot-word{font-weight:700;font-size:clamp(90px,24vw,380px);line-height:.78;letter-spacing:-.06em;white-space:nowrap}
.foot-word em{font-weight:500;color:var(--accent);letter-spacing:-.02em}
.foot small{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:24px;font-size:12px;color:var(--ink-2)}

/* page curtain (barber stripes): pure CSS in, JS out */
.curtain{position:fixed;inset:0;z-index:100;pointer-events:none;transform:scaleY(0);transform-origin:top;
  background:repeating-linear-gradient(-45deg,var(--ink) 0 40px,var(--accent) 40px 80px,var(--paper) 80px 120px,var(--accent) 120px 160px)}
.js .curtain{animation:curtOut .9s .05s cubic-bezier(.7,0,.2,1) both}
@keyframes curtOut{from{transform:scaleY(1)}to{transform:scaleY(0)}}
.curtain.leave{animation:none;transform-origin:bottom;transform:scaleY(1);transition:transform .55s cubic-bezier(.7,0,.2,1)}

@media (prefers-reduced-motion:reduce){.pole i{animation:none}.js .curtain{animation:none}*{transition-duration:.01ms!important;animation-duration:.01ms!important}}