/* ---------- Skip link ---------- */
.skip-link{position:absolute;left:-9999px;top:0;z-index:400;background:var(--espresso);color:#fff;
  padding:14px 22px;font-family:var(--ui);font-weight:600;font-size:15px;border-radius:0 0 6px 0}
.skip-link:focus{left:0;outline:3px solid #f0ece6;outline-offset:-3px}

/* Visible focus for keyboard users everywhere */
:focus-visible{outline:3px solid #6a5744;outline-offset:3px;border-radius:2px}
.sec-dark :focus-visible,.on-dark :focus-visible,.hero :focus-visible,
.page-hero :focus-visible,footer :focus-visible{outline-color:#f0ece6}

/* ---------- Toolbar ---------- */
.a11y-fab{position:fixed;left:18px;bottom:20px;z-index:110;width:48px;height:48px;border-radius:50%;
  background:#17110d;color:#f0ece6;border:1.5px solid rgba(240,236,230,.25);cursor:pointer;
  display:grid;place-items:center;box-shadow:0 8px 26px rgba(23,17,13,.4);transition:transform .2s,background .2s}
.a11y-fab:hover{transform:translateY(-2px);background:#241a13}
.a11y-fab svg{width:24px;height:24px}
.a11y-fab svg{width:24px !important;height:24px !important}
@media (max-width:720px){
  .a11y-fab{bottom:calc(86px + env(safe-area-inset-bottom,0px));left:14px;width:44px;height:44px}
}

.a11y-panel{position:fixed;left:18px;bottom:78px;z-index:115;width:min(272px,calc(100vw - 36px));
  background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:16px;
  box-shadow:0 20px 50px rgba(23,17,13,.32);display:none}
.a11y-panel.open{display:block}
@media (max-width:720px){.a11y-panel{bottom:calc(140px + env(safe-area-inset-bottom,0px));left:14px}}
.a11y-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.a11y-head strong{font-family:var(--ui);font-size:14px;letter-spacing:.02em}
.a11y-head button{background:none;border:0;font-size:24px;line-height:1;cursor:pointer;color:var(--ink-dim)}
.a11y-opts{display:grid;gap:2px}
.a11y-opts label{display:flex;align-items:center;gap:10px;padding:9px 8px;border-radius:6px;cursor:pointer;
  font-family:var(--ui);font-size:14px;color:var(--ink)}
.a11y-opts label:hover{background:var(--bg-3)}
.a11y-opts input{width:17px;height:17px;accent-color:var(--espresso);cursor:pointer;flex:none}
.a11y-reset{margin-top:10px;width:100%;padding:9px;background:transparent;border:1px solid var(--line);
  border-radius:6px;cursor:pointer;font-family:var(--ui);font-size:13px;color:var(--ink-dim)}
.a11y-reset:hover{border-color:var(--espresso);color:var(--ink)}

/* ---------- Preference modes ---------- */
html.a11y-big{font-size:118%}
html.a11y-big .btn,html.a11y-big .chat-fab{font-size:1.05em}

html.a11y-contrast{--ink:#1a120c;--ink-dim:#2e231a;--accent:#2e231a;--bg:#fffdf9;--bg-2:#f2ede4;--bg-3:#e8e1d5;
  --line:rgba(26,18,12,.42);--on-dark:#ffffff;--on-dark-dim:#f0ece6;--dark:#120c08;--stone:#ffffff}
html.a11y-contrast .hero-bg img,html.a11y-contrast .page-hero-bg img{opacity:.34}
html.a11y-contrast .hero-sub,html.a11y-contrast .hero-tag{color:#fff}
html.a11y-contrast .btn{border-width:2px}

html.a11y-links a:not(.btn):not(.brand):not(.book-btn):not(.barber-card):not(.style-card){
  text-decoration:underline;text-underline-offset:3px}

html.a11y-nomotion *,html.a11y-nomotion *::before,html.a11y-nomotion *::after{
  animation-duration:.001s !important;animation-iteration-count:1 !important;
  transition-duration:.001s !important;scroll-behavior:auto !important}
html.a11y-nomotion .rv{opacity:1 !important;transform:none !important}
html.a11y-nomotion .marquee-track{animation:none !important}

html.a11y-dyslexic,html.a11y-dyslexic body,
html.a11y-dyslexic h1,html.a11y-dyslexic h2,html.a11y-dyslexic h3,html.a11y-dyslexic h4,
html.a11y-dyslexic p,html.a11y-dyslexic a,html.a11y-dyslexic button,html.a11y-dyslexic input,
html.a11y-dyslexic li,html.a11y-dyslexic span,html.a11y-dyslexic div{
  font-family:Verdana,Tahoma,"Trebuchet MS",sans-serif !important;letter-spacing:.02em !important}
html.a11y-dyslexic p,html.a11y-dyslexic li{line-height:1.85 !important;word-spacing:.1em}
html.a11y-dyslexic .wm-top,html.a11y-dyslexic .wm-bot{font-family:var(--font-logo) !important}

/* ---------- Cookie notice ---------- */
.consent{position:fixed;left:0;right:0;bottom:0;z-index:130;background:#17110d;color:#f0ece6;
  display:flex;align-items:center;justify-content:center;gap:20px;flex-wrap:wrap;
  padding:16px 22px;padding-bottom:calc(16px + env(safe-area-inset-bottom,0px));
  transform:translateY(100%);transition:transform .35s cubic-bezier(.2,.7,.3,1);
  box-shadow:0 -8px 30px rgba(23,17,13,.4)}
.consent.in{transform:none}
.consent p{margin:0;font-family:var(--ui);font-size:14px;line-height:1.5;max-width:640px;color:#e0d9d0}
.consent a{color:#fff;text-decoration:underline}
.consent-acts{display:flex;gap:10px;flex:none}
.consent button{padding:11px 22px;border-radius:6px;cursor:pointer;font-family:var(--ui);
  font-size:14px;font-weight:600;border:1.5px solid rgba(240,236,230,.4);background:transparent;color:#f0ece6}
.consent button.primary{background:#f0ece6;color:#17110d;border-color:#f0ece6}
.consent button:hover{opacity:.86}
@media (max-width:720px){
  .consent{padding:16px;padding-bottom:calc(16px + env(safe-area-inset-bottom,0px));gap:12px}
  .consent p{font-size:13px}
  .consent-acts{width:100%}
  .consent-acts button{flex:1}
  /* :has() isn't in older iOS Safari — a11y.js adds this class instead */
  body.has-consent{padding-bottom:calc(190px + env(safe-area-inset-bottom,0px))}
}