/* Cal Tonet — estilos compartidos: variables de marca, base, botones, header/nav y footer */
:root{
  --cream:#FAF3E6;
  --cream-2:#F2E8D6;
  --ink:#2A1810;
  --ink-70: rgba(42,24,16,.7);
  --achiote:#B23A2E;
  --achiote-dark:#8E2A20;
  --toston:#E3A23C;
  --toston-light:#F1C877;
  --cebolla:#C46B8C;
  --aguacate:#5C7A45;
  --line: rgba(42,24,16,.12);
  --shadow: 0 20px 50px -20px rgba(42,24,16,.35);
  --radius: 26px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:'Work Sans', sans-serif;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important;}
}
h1,h2,h3,h4{font-family:'Fraunces', serif; margin:0; letter-spacing:-0.01em;}
p{line-height:1.65;}
a{color:inherit;}
img{max-width:100%; display:block;}
.wrap{max-width:1180px; margin:0 auto; padding:0 28px;}
.eyebrow{
  font-family:'Space Mono', monospace;
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:12px;
  color:var(--achiote);
  font-weight:700;
}
.btn{
  display:inline-flex; align-items:center; gap:10px;
  padding:15px 26px; border-radius:100px;
  font-family:'Work Sans'; font-weight:600; font-size:15px;
  text-decoration:none; cursor:pointer; border:none;
  transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease, background .3s ease;
  white-space:nowrap;
}
.btn:focus-visible{outline:3px solid var(--toston); outline-offset:3px;}
.btn-primary{ background:var(--achiote); color:#fff; box-shadow:0 12px 30px -10px rgba(178,58,46,.65);}
.btn-primary:hover{ transform:translateY(-3px); box-shadow:0 18px 34px -10px rgba(178,58,46,.75);}
.btn-ghost{ background:rgba(255,255,255,.14); color:#fff; border:1.5px solid rgba(255,255,255,.55); backdrop-filter:blur(6px);}
.btn-ghost:hover{ background:rgba(255,255,255,.24); transform:translateY(-3px);}
.btn-dark{ background:var(--ink); color:var(--cream);}
.btn-dark:hover{ transform:translateY(-3px); box-shadow:0 16px 30px -12px rgba(42,24,16,.5);}

/* NAV */
header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  padding:20px 0;
  padding-top: calc(20px + env(safe-area-inset-top));
  transition: background .5s ease, padding .5s ease, box-shadow .5s ease, opacity .35s ease;
  will-change: transform, opacity;
}
header.scrolled{
  background:rgba(250,243,230,.96); backdrop-filter:blur(14px);
  padding:12px 0; padding-top: calc(12px + env(safe-area-inset-top));
  box-shadow:0 6px 24px -12px rgba(42,24,16,.25);
}
header.hide{opacity:0; pointer-events:none;}
nav{ display:flex; align-items:center; justify-content:space-between; max-width:1180px; margin:0 auto; padding:0 28px;}
.logo{ font-family:'Fraunces'; font-weight:700; font-size:22px; color:#fff; letter-spacing:-.01em; display:flex; align-items:center; gap:9px; transition:color .4s ease;}
header.scrolled .logo{color:var(--ink);}
.logo .dot{width:9px; height:9px; border-radius:50%; background:var(--toston); display:inline-block;}
.nav-links{display:flex; gap:34px; list-style:none; margin:0; padding:0;}
.nav-links a{ color:rgba(255,255,255,.92); text-decoration:none; font-size:14.5px; font-weight:500; transition:color .3s ease, opacity .3s;}
header.scrolled .nav-links a{color:var(--ink-70);}
.nav-links a:hover{opacity:.7;}
.nav-cta{display:flex; gap:12px; align-items:center;}
.burger{display:none; background:none; border:none; cursor:pointer; padding:6px;}
.burger span{display:block; width:24px; height:2px; background:#fff; margin:5px 0; transition:.3s; border-radius:2px;}
header.scrolled .burger span{background:var(--ink);}

/* FOOTER */
footer{ background:var(--ink); color:rgba(250,243,230,.6); padding:56px 0 30px;}
.foot-top{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:24px; padding-bottom:40px; border-bottom:1px solid rgba(250,243,230,.14);}
.foot-logo{ font-family:'Fraunces'; font-size:24px; color:#fff; font-weight:700;}
.foot-nav{ display:flex; gap:26px; flex-wrap:wrap; list-style:none; margin:0; padding:0;}
.foot-nav a{ text-decoration:none; color:rgba(250,243,230,.6); font-size:14px; transition:.25s;}
.foot-nav a:hover{color:#fff;}
.foot-bottom{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; padding-top:24px; font-size:12.5px;}

@media (max-width:900px){
  .nav-links, .nav-cta .btn-ghost{display:none;}
  .burger{display:block;}
}


.btn{min-height:44px;}
.nav-links a{display:inline-flex; align-items:center; min-height:44px;}
.foot-nav a{display:inline-flex; align-items:center; min-height:44px;}
.burger{min-width:44px; min-height:44px;}
img{max-width:100%; height:auto;}
