/* ==========================================================
   Barber Host · Base: reset, tipografía general y utilidades
   ========================================================== */

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--bone);font:400 16px/1.6 var(--f-body);overflow-x:hidden;-webkit-font-smoothing:antialiased}
a{color:inherit}
:focus-visible{outline:2px solid var(--yellow);outline-offset:3px}
.wrap{max-width:1240px;margin-inline:auto;padding-inline:var(--gutter)}
.eyebrow{font:500 12px/1.3 var(--f-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--yellow);display:flex;gap:12px;align-items:center}
.eyebrow .n{color:var(--mute)}
h1,h2,h3{text-wrap:balance;margin:0;font-weight:400;overflow-wrap:break-word}
p{margin:0}
.y{color:var(--yellow)}
.metal{background:linear-gradient(100deg,var(--gold) 0%,var(--gold-hi) 30%,#fff6d6 42%,var(--gold) 55%,#7d6122 78%,var(--gold) 100%);background-size:260% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:sheen 7s linear infinite}
@keyframes sheen{to{background-position:-260% 0}}

body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:100;opacity:.07;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}