*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--c-linho-50);color:var(--c-carvao-900);font-family:var(--f-body);font-size:var(--t-body);line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video,svg{max-width:100%;display:block}
a{color:var(--c-oliva-500)}
h1,h2,h3,h4{margin:0;font-weight:400;text-wrap:balance}
p,ul,ol,figure,blockquote{margin:0}
ul,ol{padding:0;list-style:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:2px solid var(--c-ouro-500);outline-offset:3px}

/* containers */
.wrap{max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter)}
.wrap-narrow{max-width:var(--container-narrow);margin-inline:auto;padding-inline:var(--gutter)}
.section{padding-block:var(--section)}

/* tipografia */
.eyebrow{display:inline-flex;align-items:center;gap:var(--s-3);font-size:var(--t-eyebrow);font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--c-oliva-500)}
.eyebrow::before{content:"";width:40px;height:2px;background:var(--c-ouro-500);flex:none}
.eyebrow.center{justify-content:center}
.on-dark .eyebrow{color:var(--c-salvia-300)}
.h-hero{font-family:var(--f-display);font-weight:300;font-size:var(--t-hero);line-height:1.02;letter-spacing:.02em;text-transform:uppercase}
.h-sec{font-family:var(--f-display);font-weight:300;font-size:var(--t-h1);line-height:1.08;letter-spacing:.02em;text-transform:uppercase;margin-top:var(--s-4)}
.h2{font-family:var(--f-display);font-weight:400;font-size:var(--t-h2);line-height:1.15;letter-spacing:.01em}
.h3{font-family:var(--f-display);font-weight:500;font-size:var(--t-h3);line-height:1.25}
.lead{font-weight:300;font-size:var(--t-lead);line-height:1.55;max-width:62ch;color:var(--c-carvao-600);margin-top:var(--s-5)}
.on-dark .lead{color:var(--c-salvia-300)}
.script{font-family:var(--f-script);font-weight:400;text-transform:none;letter-spacing:0;font-size:1.15em;display:inline-block;transform:translateY(.1em);margin-left:-.1em;line-height:1}
.ital{font-family:var(--f-display);font-style:italic;font-weight:400}
.num{font-variant-numeric:lining-nums tabular-nums}
.small{font-size:var(--t-small)}
.muted{color:var(--c-carvao-600)}
.center{text-align:center}
.center .lead{margin-inline:auto}
.on-dark{color:var(--c-branco)}

/* movimento — o JS aplica o "from"; sem JS tudo aparece */
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition-duration:.01ms!important}}
