/* ============================================================
   A&K Paellas — hoja de estilos única para este sitio.

   Dirección de diseño: "mesa de noche". El logo es dorado y rojo sobre negro,
   así que el sitio es oscuro y cálido, como una actividad al anochecer con la
   paellera prendida. Dos motivos, ambos sacados de su propia marca:
     · el círculo de la paellera → fotos y sellos redondos, brillos radiales;
     · el ◆ dorado y las reglas finas de sus flyers → separadores de sección.
   Paleta extraída del logo por código (PIL): dorado #dcc878, dorado oscuro
   #c8a050, rojo #c82828, y el swoosh turquesa #6d9298 (acento mínimo).
   El rojo se usa con cuentagotas — precios y la "A" — igual que en el logo.
   ============================================================ */

:root{
  --gold:#dcc878;
  --gold-deep:#c8a050;
  --gold-dim:#8a7440;
  --red:#c82828;
  --teal:#6d9298;

  --ink:#0b0906;          /* negro cálido del logo */
  --ink-2:#12100b;
  --panel:#181410;
  --panel-2:#211b14;
  --line:rgba(220,200,120,.18);
  --line-soft:rgba(220,200,120,.09);
  --cream:#f4eee1;
  --muted:#b3a894;

  --wrap:1180px;
  --r:16px;
  --r-lg:26px;
  --shadow:0 24px 60px -34px rgba(0,0,0,.9);
  --glow:0 0 0 1px var(--line), 0 30px 70px -40px rgba(200,160,80,.45);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }

body{
  margin:0;
  font-family:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:clamp(16px,.5vw + 14.6px,17.5px);
  line-height:1.65;
  color:var(--cream);
  background:var(--ink);
  overflow-x:hidden;
  padding-bottom:env(safe-area-inset-bottom);
}
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; }
h1,h2,h3{
  font-family:"Cormorant Garamond","Iowan Old Style",Georgia,serif;
  font-weight:600;
  line-height:1.08;
  letter-spacing:-.005em;
  margin:0;
}
p{ margin:0; }
ul,ol{ margin:0; padding:0; list-style:none; }
em{ font-style:italic; color:var(--gold); }
svg{ width:1em; height:1em; }

.wrap{ width:min(100% - 40px, var(--wrap)); margin-inline:auto; }
@media (max-width:560px){ .wrap{ width:min(100% - 32px, var(--wrap)); } }

.skip{
  position:absolute; left:-9999px; top:0; z-index:99;
  background:var(--gold); color:var(--ink); padding:12px 18px; border-radius:0 0 10px 0;
  font-weight:700;
}
.skip:focus{ left:0; }

:where(a,button,input,select,textarea):focus-visible{
  outline:2px solid var(--gold); outline-offset:3px; border-radius:6px;
}

/* ---------- Botones ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.6em;
  padding:.92em 1.5em; border:0; border-radius:999px; cursor:pointer;
  font:inherit; font-weight:700; font-size:.95rem; letter-spacing:.01em;
  text-decoration:none; white-space:nowrap;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
}
.btn svg{ width:1.15em; height:1.15em; flex:none; }
.btn:hover{ transform:translateY(-2px); }

.btn--gold{
  background:linear-gradient(135deg,var(--gold) 0%,var(--gold-deep) 100%);
  color:#1a1409;
  box-shadow:0 14px 34px -18px rgba(220,200,120,.75);
}
.btn--gold:hover{ box-shadow:0 20px 44px -18px rgba(220,200,120,.9); }

.btn--ghost{
  background:transparent; color:var(--cream);
  box-shadow:inset 0 0 0 1px rgba(220,200,120,.4);
}
.btn--ghost:hover{ background:rgba(220,200,120,.09); }

.btn--wa{ background:#1fa855; color:#fff; box-shadow:0 14px 34px -20px rgba(31,168,85,.9); }
.btn--wa:hover{ background:#23bd5f; }

.btn--full{ width:100%; padding-block:1.05em; font-size:1rem; }

/* ---------- Encabezados de sección ---------- */
.eyebrow{
  display:flex; align-items:center; gap:.55em;
  font-size:.74rem; font-weight:700; letter-spacing:.19em; text-transform:uppercase;
  color:var(--gold-deep); margin-bottom:1.1rem;
}
.eyebrow svg{ width:.6em; height:.6em; color:var(--gold); flex:none; }

.sec{ padding:clamp(72px,9vw,120px) 0; }
.sec__head{ max-width:640px; margin-bottom:clamp(38px,5vw,58px); }
.sec__head--center{ margin-inline:auto; text-align:center; }
.sec__head--center .eyebrow{ justify-content:center; }
.sec__head h2{ font-size:clamp(2.3rem,5.4vw,3.5rem); }
.sec__lead{ margin-top:1.1rem; color:var(--muted); font-size:1.03rem; }

/* ============================================================
   Nav
   ============================================================ */
.nav{
  position:sticky; top:0; z-index:50;
  background:rgba(11,9,6,.82);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid transparent;
  transition:border-color .25s ease, background .25s ease;
}
.nav.is-stuck{ border-bottom-color:var(--line); background:rgba(11,9,6,.95); }
.nav__in{
  width:min(100% - 40px, var(--wrap)); margin-inline:auto;
  display:flex; align-items:center; gap:16px;
  min-height:70px;
}
.nav__brand{
  display:flex; align-items:center; gap:.7rem;
  text-decoration:none; font-family:"Cormorant Garamond",Georgia,serif;
  font-size:1.35rem; letter-spacing:.02em; color:var(--cream);
  margin-right:auto;
}
.nav__brand img{ width:46px; height:46px; border-radius:50%; }
.nav__brand b{ color:var(--gold); font-weight:700; }

.nav__links{ display:flex; align-items:center; gap:clamp(14px,2vw,30px); }
.nav__links a{
  text-decoration:none; font-size:.93rem; font-weight:600; color:var(--cream);
  opacity:.86; transition:opacity .18s ease, color .18s ease;
}
.nav__links a:hover{ opacity:1; color:var(--gold); }
.nav__cta{ font-size:.88rem; padding:.7em 1.15em; opacity:1; }
.nav__cta:hover{ color:#fff; }

/* Toggle móvil — SIEMPRE pegado a la derecha (regla estándar de estos sitios) */
.nav__toggle{
  display:none; margin-left:auto; order:2;
  width:44px; height:44px; padding:0;
  background:transparent; border:1px solid var(--line); border-radius:12px;
  color:var(--cream); cursor:pointer;
  align-items:center; justify-content:center;
}
.nav__toggle svg{ width:22px; height:22px; }
.nav__toggle-close{ display:none; }
.nav__toggle[aria-expanded="true"] .nav__toggle-open{ display:none; }
.nav__toggle[aria-expanded="true"] .nav__toggle-close{ display:block; }

@media (max-width:900px){
  .nav__toggle{ display:flex; }
  .nav__links{
    order:3; width:100%;
    display:grid; gap:2px;
    max-height:0; overflow:hidden;
    transition:max-height .3s ease, padding .3s ease;
    padding:0;
  }
  .nav__links.is-open{ max-height:420px; padding:8px 0 18px; }
  .nav__links a{ padding:.65rem .2rem; font-size:1rem; }
  .nav__cta{ justify-self:start; margin-top:8px; }
  .nav__in{ flex-wrap:wrap; padding-bottom:0; }
}

/* ============================================================
   Hero
   ============================================================ */
.hero{
  position:relative; overflow:hidden;
  padding:clamp(56px,8vw,104px) 0 clamp(64px,8vw,110px);
  background:
    radial-gradient(70% 90% at 78% 30%, rgba(200,160,80,.16), transparent 62%),
    radial-gradient(50% 60% at 12% 88%, rgba(109,146,152,.10), transparent 70%),
    var(--ink);
}
/* Anillo dorado tenue = el aro del logo / el borde de la paellera */
.hero::before{
  content:""; position:absolute; z-index:0;
  width:min(150vw,1180px); aspect-ratio:1; border-radius:50%;
  right:-24%; top:-38%;
  border:1px solid rgba(220,200,120,.13);
  box-shadow:inset 0 0 0 1px rgba(220,200,120,.05);
  pointer-events:none;
}
.hero__in{
  position:relative; z-index:1;
  width:min(100% - 40px, var(--wrap)); margin-inline:auto;
  display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(32px,5vw,72px);
  align-items:center;
}
.hero h1{
  font-size:clamp(3.6rem,10.5vw,7rem);
  line-height:.92; letter-spacing:-.02em;
  background:linear-gradient(150deg,#fbf3dc 0%,var(--gold) 44%,var(--gold-deep) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero__lead{ margin-top:1.5rem; font-size:clamp(1.05rem,1.5vw,1.22rem); max-width:34ch; }
.hero__sub{
  margin-top:.85rem; color:var(--muted);
  font-family:"Cormorant Garamond",Georgia,serif; font-size:1.3rem; font-style:italic;
}
.hero__cta{ display:flex; flex-wrap:wrap; gap:12px; margin-top:2.1rem; }

.hero__facts{
  display:flex; flex-wrap:wrap; gap:clamp(20px,4vw,42px);
  margin-top:2.6rem; padding-top:1.7rem; border-top:1px solid var(--line);
}
.hero__facts li{ display:grid; }
.hero__facts b{
  font-family:"Cormorant Garamond",Georgia,serif; font-size:1.6rem; font-weight:700;
  color:var(--gold); line-height:1.1;
}
.hero__facts span{ font-size:.8rem; letter-spacing:.13em; text-transform:uppercase; color:var(--muted); }

/* Foto del chef en marco circular = la paellera */
.hero__art{ display:grid; justify-items:center; gap:1rem; }
.pan{
  margin:0; position:relative;
  width:min(100%,430px); aspect-ratio:1; border-radius:50%; overflow:hidden;
  box-shadow:0 0 0 1px rgba(220,200,120,.35), 0 0 0 12px rgba(220,200,120,.05),
             0 44px 90px -44px rgba(0,0,0,.95);
}
.pan img{ width:100%; height:100%; object-fit:cover; object-position:58% 42%; }
.pan::after{
  content:""; position:absolute; inset:0; border-radius:50%;
  background:linear-gradient(200deg,transparent 55%,rgba(11,9,6,.55) 100%);
}
.pan__cap{
  font-size:.78rem; letter-spacing:.18em; text-transform:uppercase; color:var(--gold-dim);
}

@media (max-width:880px){
  .hero__in{ grid-template-columns:1fr; }
  .hero__art{ order:-1; }
  .pan{ width:min(78%,320px); }
  .hero__lead{ max-width:none; }
}

/* ============================================================
   Franja de eventos
   ============================================================ */
.band{
  background:var(--ink-2);
  border-block:1px solid var(--line-soft);
  padding:clamp(40px,5vw,58px) 0;
}
.band__in{ display:grid; gap:clamp(22px,3vw,34px); justify-items:center; text-align:center; }
.band__quote{
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(1.5rem,3.3vw,2.3rem); line-height:1.25; color:var(--cream);
}
.band__quote span{ color:var(--gold); font-style:italic; }
.band__tags{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px; }
.band__tags li{
  padding:.42em 1.05em; border-radius:999px;
  border:1px solid var(--line); color:var(--muted);
  font-size:.82rem; font-weight:600; letter-spacing:.04em;
}

/* ============================================================
   Servicios
   ============================================================ */
.cards{
  display:grid; gap:18px;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
}
.card{
  position:relative;
  display:flex; flex-direction:column;   /* el sello inferior queda alineado entre tarjetas */
  padding:clamp(26px,3vw,34px);
  background:linear-gradient(165deg,var(--panel) 0%,var(--ink-2) 100%);
  border:1px solid var(--line-soft); border-radius:var(--r-lg);
  transition:border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
.card:hover{ border-color:var(--line); transform:translateY(-4px); box-shadow:var(--shadow); }
.card__ico{
  width:42px; height:42px; color:var(--gold); margin-bottom:1.1rem;
}
.card h3{ font-size:1.6rem; margin-bottom:.6rem; }
.card p{ color:var(--muted); font-size:.96rem; }
.card__tag{
  margin-top:auto !important; padding-top:1rem; border-top:1px solid var(--line-soft);
  font-size:.78rem !important; font-weight:700; letter-spacing:.11em; text-transform:uppercase;
  color:var(--gold-deep) !important;
}

/* ============================================================
   Ciclo de servicio
   ============================================================ */
.ciclo{
  padding:clamp(72px,9vw,120px) 0;
  background:
    radial-gradient(60% 50% at 50% 0%, rgba(200,160,80,.09), transparent 70%),
    var(--ink-2);
  border-block:1px solid var(--line-soft);
}
.ciclo__list{
  display:grid; gap:clamp(18px,2.4vw,26px);
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
}
.ciclo__item{
  position:relative; padding:clamp(26px,3vw,34px) clamp(22px,3vw,30px);
  border:1px solid var(--line-soft); border-radius:var(--r-lg);
  background:rgba(24,20,16,.6);
}
.ciclo__n{
  display:grid; place-items:center;
  width:52px; height:52px; margin-bottom:1.2rem; border-radius:50%;
  border:1px solid var(--gold-dim); color:var(--gold);
  font-family:"Cormorant Garamond",Georgia,serif; font-size:1.7rem; font-weight:700;
}
.ciclo__item h3{ font-size:1.55rem; margin-bottom:.55rem; }
.ciclo__item p{ color:var(--muted); font-size:.96rem; }

.ciclo__foot{
  display:grid; grid-template-columns:auto 1fr; gap:clamp(26px,4vw,48px);
  align-items:center;
  margin-top:clamp(38px,5vw,58px); padding-top:clamp(38px,5vw,58px);
  border-top:1px solid var(--line-soft);
}
/* La caja de charcutería es una foto de 414px re-escalada: se mantiene chica
   a propósito (max 250px) para que no se vea borrosa. */
.ciclo__pic{ margin:0; width:min(250px,42vw); }
.ciclo__pic img{
  border-radius:50%; aspect-ratio:1; object-fit:cover;
  box-shadow:0 0 0 1px rgba(220,200,120,.3), 0 0 0 10px rgba(220,200,120,.05);
}
.ciclo__foot-copy h3{ font-size:clamp(1.7rem,3vw,2.2rem); margin-bottom:.7rem; }
.ciclo__foot-copy p{ color:var(--muted); margin-bottom:1.6rem; max-width:46ch; }
@media (max-width:640px){
  .ciclo__foot{ grid-template-columns:1fr; justify-items:center; text-align:center; }
  .ciclo__foot-copy p{ margin-inline:auto; }
}

/* ============================================================
   Menú de paellas
   ============================================================ */
.sec--menu{ background:var(--ink); }
.menu{
  max-width:840px; margin-inline:auto;
  padding:clamp(30px,4vw,52px);
  border:1px solid var(--line); border-radius:var(--r-lg);
  background:linear-gradient(170deg,var(--panel) 0%,var(--ink) 100%);
  box-shadow:var(--glow);
}
.menu__note{
  text-align:center; font-size:.76rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--gold-dim); margin-bottom:2rem;
}
.menu__list{ display:grid; gap:2px; }
.menu__row{
  display:grid; grid-template-columns:auto 1fr auto; align-items:baseline; gap:.9rem;
  padding:1.15rem 0; border-bottom:1px solid var(--line-soft);
}
.menu__row:last-child{ border-bottom:0; }
.menu__name h3{ font-size:1.55rem; }
.menu__name p{ color:var(--muted); font-size:.9rem; margin-top:.25rem; }
.menu__dots{
  align-self:center; height:1px; margin-top:.4rem;
  background-image:radial-gradient(circle,var(--gold-dim) 1px,transparent 1.4px);
  background-size:7px 2px; background-repeat:repeat-x; opacity:.55;
}
.menu__price{
  font-family:"Cormorant Garamond",Georgia,serif; font-weight:700;
  font-size:clamp(1.9rem,3.4vw,2.4rem); color:var(--gold);
  line-height:1;
}
@media (max-width:520px){
  .menu__row{ grid-template-columns:1fr auto; }
  .menu__dots{ display:none; }
}

.menu__more{ margin-top:2.6rem; padding-top:2.2rem; border-top:1px solid var(--line); }
.menu__more-title{
  font-family:"Manrope",sans-serif; font-size:.76rem; font-weight:700;
  letter-spacing:.18em; text-transform:uppercase; color:var(--gold-deep);
  text-align:center; margin-bottom:1.5rem;
}
.menu__chips{ display:grid; gap:10px; grid-template-columns:repeat(auto-fit,minmax(158px,1fr)); }
.menu__chips li{
  padding:.85rem 1rem; border:1px solid var(--line-soft); border-radius:14px;
  background:rgba(33,27,20,.5);
}
.menu__chips b{ display:block; color:var(--cream); font-size:1rem; }
.menu__chips span{ display:block; color:var(--muted); font-size:.83rem; margin-top:.15rem; }
.menu__more-note{ margin-top:1.5rem; text-align:center; color:var(--muted); font-size:.88rem; }

/* ============================================================
   Vive la experiencia — 5 pasos
   ============================================================ */
.exp{
  padding:clamp(72px,9vw,120px) 0;
  background:
    radial-gradient(60% 55% at 50% 100%, rgba(109,146,152,.10), transparent 70%),
    var(--ink-2);
  border-block:1px solid var(--line-soft);
}
/* Las 5 fotos vienen del flyer y son ~240px de origen (2x LANCZOS): las
   columnas se limitan a 230px para que no se agranden y se vean borrosas. */
.exp__steps{
  display:grid; gap:clamp(16px,2vw,22px);
  grid-template-columns:repeat(auto-fit,minmax(170px,215px));
  justify-content:center;
}
/* Los cinco pasos son una secuencia: en pantalla ancha van en una sola fila
   para que se lean como el relato que son, no como una cuadrícula. */
@media (min-width:1080px){
  .exp__steps{ grid-template-columns:repeat(5,minmax(0,1fr)); }
}
.exp__step{ display:grid; gap:1rem; }
.exp__step figure{
  margin:0; border-radius:var(--r); overflow:hidden;
  border:1px solid var(--line-soft);
  box-shadow:0 20px 44px -30px rgba(0,0,0,.9);
}
.exp__step figure img{ width:100%; aspect-ratio:4/3; object-fit:cover; }
.exp__n{
  display:inline-grid; place-items:center;
  width:30px; height:30px; margin-bottom:.55rem; border-radius:50%;
  background:var(--gold); color:var(--ink);
  font-family:"Cormorant Garamond",Georgia,serif; font-weight:700; font-size:1.1rem;
}
.exp__step h3{ font-size:1.28rem; margin-bottom:.35rem; }
.exp__step p{ color:var(--muted); font-size:.88rem; }

/* ============================================================
   Formulario de reserva
   ============================================================ */
.sec--form{
  background:
    radial-gradient(55% 60% at 88% 8%, rgba(200,160,80,.12), transparent 65%),
    var(--ink);
}
.form-grid{
  display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(32px,4.5vw,64px);
  align-items:start;
}
.form-intro h2{ font-size:clamp(2.3rem,5.2vw,3.4rem); margin-bottom:1.1rem; }
.form-intro > p{ color:var(--muted); }
.form-intro__list{ display:grid; gap:1rem; margin-top:2rem; }
.form-intro__list li{
  display:grid; gap:.2rem; padding-left:1.4rem; position:relative;
}
.form-intro__list li::before{
  content:""; position:absolute; left:0; top:.62em;
  width:7px; height:7px; background:var(--gold); transform:rotate(45deg);
}
.form-intro__list b{ color:var(--cream); font-size:1rem; }
.form-intro__list span{ color:var(--muted); font-size:.88rem; }
.form-intro__pic{ margin:2.4rem 0 0; border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line-soft); }
@media (max-width:900px){
  .form-grid{ grid-template-columns:1fr; }
  .form-intro__pic{ display:none; }
}

.form-panel{
  padding:clamp(24px,3.2vw,40px);
  border:1px solid var(--line); border-radius:var(--r-lg);
  background:linear-gradient(170deg,var(--panel) 0%,var(--ink-2) 100%);
  box-shadow:var(--glow);
}
#quoteForm{ display:grid; gap:1.05rem; }
.f-row{ display:grid; grid-template-columns:1fr 1fr; gap:1.05rem; }
@media (max-width:560px){ .f-row{ grid-template-columns:1fr; } }

.f{ display:grid; gap:.45rem; }
.f > span{
  font-size:.79rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:var(--gold-deep);
  display:flex; align-items:center; gap:.6em; flex-wrap:wrap;
}
.f > span i{ font-style:normal; text-transform:none; letter-spacing:0; color:var(--muted); font-weight:500; }
.f__min{
  background:var(--red); color:#fff; border-radius:999px;
  padding:.2em .7em; font-size:.68rem; letter-spacing:.06em;
}
.f input,.f select,.f textarea{
  width:100%; font:inherit; font-size:.97rem; color:var(--cream);
  background:rgba(11,9,6,.6);
  border:1px solid var(--line-soft); border-radius:12px;
  padding:.82em .95em;
  transition:border-color .18s ease, background .18s ease;
}
.f textarea{ resize:vertical; }
.f input::placeholder,.f textarea::placeholder{ color:#6f6656; }
.f input:focus,.f select:focus,.f textarea:focus{
  border-color:var(--gold-deep); background:rgba(11,9,6,.85); outline:none;
}
.f select{
  appearance:none;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' fill='none' stroke='%23c8a050' stroke-width='2'%3E%3Cpath d='m1 1 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 1em center;
  padding-right:2.6em;
}
.f select option{ background:var(--panel); color:var(--cream); }
/* Safari/iOS deja el date input desalineado sin esto */
.f input[type="date"]{ min-height:3.1em; }
.f small{ color:var(--muted); font-size:.8rem; line-height:1.5; }

.f--alergias{
  padding:1.05rem; margin-block:.2rem;
  border:1px solid rgba(200,40,40,.32); border-radius:var(--r);
  background:rgba(200,40,40,.05);
}
.f--alergias > span{ color:#e07a6a; }

.f-error{
  display:none; color:#ff9a8a; font-size:.9rem; font-weight:600;
  padding:.7em .9em; border-radius:10px; background:rgba(200,40,40,.12);
}
.f-error.is-on{ display:block; }
.f-note{ color:var(--muted); font-size:.82rem; text-align:center; }

/* ============================================================
   CTA final + footer
   ============================================================ */
.cta{
  padding:clamp(66px,8vw,104px) 0;
  background:
    radial-gradient(60% 80% at 50% 0%, rgba(200,160,80,.14), transparent 68%),
    var(--ink-2);
  border-top:1px solid var(--line-soft);
  text-align:center;
}
.cta__in{ display:grid; justify-items:center; gap:1rem; }
.cta__logo{ width:120px; height:120px; border-radius:50%; box-shadow:0 0 0 1px var(--line); }
.cta h2{ font-size:clamp(2.1rem,4.6vw,3rem); margin-top:.6rem; }
.cta > .wrap > p{ color:var(--muted); }
.cta__row{ display:flex; flex-wrap:wrap; justify-content:center; gap:12px; margin-top:1rem; }
.cta__thanks{
  margin-top:1.6rem; font-family:"Cormorant Garamond",Georgia,serif; font-style:italic;
  font-size:1.25rem; color:var(--gold);
}

.foot{ background:var(--ink); border-top:1px solid var(--line-soft); padding:2.6rem 0; }
.foot__in{ display:grid; gap:1rem; justify-items:center; text-align:center; }
.foot__brand{ font-family:"Cormorant Garamond",Georgia,serif; font-size:1.15rem; }
.foot__brand b{ color:var(--gold); }
.foot__links{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px 24px; }
.foot__links a{
  display:inline-flex; align-items:center; gap:.5em;
  text-decoration:none; color:var(--muted); font-size:.9rem;
  transition:color .18s ease;
}
.foot__links a:hover{ color:var(--gold); }
.foot__copy{ color:#6f6656; font-size:.8rem; }

/* ---------- FAB de WhatsApp ---------- */
.wa-fab{
  position:fixed; right:18px; bottom:calc(18px + env(safe-area-inset-bottom));
  z-index:40;
  display:grid; place-items:center; width:56px; height:56px; border-radius:50%;
  background:#1fa855; color:#fff; text-decoration:none;
  box-shadow:0 14px 32px -12px rgba(0,0,0,.8);
  transition:transform .18s ease, background .18s ease;
}
.wa-fab svg{ width:29px; height:29px; }
.wa-fab:hover{ transform:scale(1.06); background:#23bd5f; }

/* ---------- Revelado al hacer scroll ---------- */
.js .reveal{ opacity:0; transform:translateY(18px); }
.js .reveal.is-visible{
  opacity:1; transform:none;
  transition:opacity .6s ease, transform .6s cubic-bezier(.22,.8,.3,1);
}
@media (prefers-reduced-motion:reduce){
  .js .reveal{ opacity:1; transform:none; }
  .btn:hover,.card:hover,.wa-fab:hover{ transform:none; }
}
