/*
Theme Name:   Synova Eventos
Theme URI:    https://synovaeventos.com
Author:       Synova Eventos
Author URI:   https://synovaeventos.com
Description:  Tema a medida para Synova Eventos. Portada con foto de producto, configurador de barra de snacks y envío directo a WhatsApp. Todo lo editable está en Apariencia -> Personalizar -> Synova.
Version:      2.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License:      GNU General Public License v2 or later
License URI:  https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  synova
Tags:         one-column, custom-colors, custom-logo, editor-style, full-width-template, translation-ready
*/

/* ─────────────────────────────────────────────────────────
   Los colores y las fotos se controlan desde
   Apariencia -> Personalizar -> Synova.
   Este archivo solo define la forma.
   ───────────────────────────────────────────────────────── */

/* ═══════════════════════════════════════════════════════
   SYNOVA EVENTOS — sitio v6
   Base clara · foto de producto en portada
   Display: Playfair Display 600/700 (misma familia didone
   del logotipo, pero con trazo sólido para que ningún
   texto grande se pierda).
   ═══════════════════════════════════════════════════════ */
:root{
  --crema:#F7F3EA; --crema-2:#EFE9DB; --crema-3:#E4DCC9;
  --tinta:#20231C; --tinta-70:rgba(32,35,28,.72); --tinta-45:rgba(32,35,28,.47); --tinta-22:rgba(32,35,28,.22);
  --carbon:#191B16; --carbon-2:#22251E;
  --cobre:#A85E33; --cobre-cl:#D99A6A; --cobre-luz:#EFBF93; --cobre-suave:rgba(168,94,51,.1);
  --salvia:#5F6B58; --salvia-cl:#9EA996; --salvia-suave:rgba(95,107,88,.13);
  --linea:rgba(32,35,28,.14); --linea-osc:rgba(247,243,234,.16);
  --display:"Playfair Display",Georgia,"Times New Roman",serif;
  --sans:"Jost",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --pad:clamp(1.3rem,5vw,5.5rem);
  --sec:clamp(4.5rem,11vh,8.5rem);
  --curva:cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:5.5rem}
body{background:var(--crema);color:var(--tinta);font-family:var(--sans);font-weight:300;
  font-size:clamp(15px,1.02vw,16.5px);line-height:1.72;-webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;overflow-x:hidden}
body.trabado{overflow:hidden}
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:70;opacity:.03;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E")}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit}
::selection{background:var(--cobre);color:var(--crema)}
:focus-visible{outline:2px solid var(--cobre);outline-offset:3px}

/* ── tipografía ── */
.eyebrow{font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;color:var(--salvia);font-weight:400}
.display{font-family:var(--display);font-weight:600;line-height:1.12;letter-spacing:-.008em}
h2.display{font-size:clamp(1.95rem,4.3vw,3.3rem)}
.lede{font-size:clamp(1rem,1.28vw,1.16rem);color:var(--tinta-70);max-width:48ch}
.cobre{color:var(--cobre)} .ital{font-style:italic}

/* ── telón ── */
#syn-telon{position:fixed;inset:0;z-index:200;background:var(--crema);display:grid;place-items:center;
  transition:opacity .7s ease .5s,visibility .7s .5s}
#syn-telon.fuera{opacity:0;visibility:hidden}
#syn-telon img{width:clamp(120px,17vw,175px);opacity:0;transform:translateY(10px) scale(.97);
  animation:entra 1s var(--curva) .1s forwards}
@keyframes entra{to{opacity:1;transform:none}}
#syn-telon .raya{height:1px;background:var(--cobre);width:0;margin:1.5rem auto 0;animation:crece .9s var(--curva) .55s forwards}
@keyframes crece{to{width:88px}}

/* ── cursor ── */
#syn-punto,#syn-anillo{position:fixed;top:0;left:0;pointer-events:none;z-index:150;border-radius:50%}
#syn-punto{width:5px;height:5px;background:var(--cobre);margin:-2.5px 0 0 -2.5px}
#syn-anillo{width:32px;height:32px;border:1px solid rgba(168,94,51,.45);margin:-16px 0 0 -16px;
  transition:width .35s var(--curva),height .35s var(--curva),margin .35s var(--curva),background .35s,border-color .35s}
#syn-anillo.crece{width:60px;height:60px;margin:-30px 0 0 -30px;background:rgba(168,94,51,.09);border-color:var(--cobre)}
@media (hover:none),(pointer:coarse){#syn-punto,#syn-anillo{display:none}}

#syn-avance{position:fixed;top:0;left:0;height:2px;width:0;z-index:100;
  background:linear-gradient(90deg,var(--salvia),var(--cobre),var(--cobre-luz))}

/* ── barra ── */
.barra{position:fixed;top:0;left:0;right:0;z-index:90;display:flex;align-items:center;justify-content:space-between;
  padding:.9rem var(--pad);transition:background .45s ease,padding .45s ease,box-shadow .45s ease}
.barra.fija{background:rgba(247,243,234,.94);backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);padding-top:.6rem;padding-bottom:.6rem;box-shadow:0 1px 0 var(--linea)}
.marca{display:flex;align-items:center;gap:.7rem;line-height:1}
.marca img{width:34px;height:auto;flex:0 0 auto}
.marca .nom{font-family:var(--display);font-weight:600;font-size:1rem;letter-spacing:.2em;
  color:var(--tinta);white-space:nowrap}
.menu{display:flex;align-items:center;gap:1.9rem}
.menu a.nav{font-size:.76rem;letter-spacing:.11em;text-transform:uppercase;color:var(--tinta-70);position:relative;padding-bottom:2px}
.menu a.nav::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:0;background:var(--cobre);transition:width .4s var(--curva)}
.menu a.nav:hover{color:var(--tinta)} .menu a.nav:hover::after{width:100%}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;font-weight:400;
  font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;padding:.9rem 1.6rem;cursor:pointer;
  border:1px solid var(--cobre);color:var(--cobre);background:transparent;position:relative;overflow:hidden;
  transition:color .4s ease,transform .3s var(--curva)}
.btn::before{content:"";position:absolute;inset:0;background:var(--cobre);transform:translateY(101%);transition:transform .42s var(--curva)}
.btn s{position:relative;z-index:1;text-decoration:none}
.btn:hover{color:var(--crema)} .btn:hover::before{transform:translateY(0)}
.btn.lleno{background:var(--cobre);color:var(--crema)} .btn.lleno::before{background:var(--tinta)}
.btn.oscuro{border-color:var(--tinta);color:var(--tinta);background:rgba(247,243,234,.75)}
.btn.oscuro::before{background:var(--tinta)} .btn.oscuro:hover{color:var(--crema)}

.hamb{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:.45rem}
.hamb span{display:block;width:23px;height:1.5px;background:var(--tinta);transition:transform .4s var(--curva),opacity .3s}
.hamb.on span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.hamb.on span:nth-child(2){opacity:0}
.hamb.on span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
#syn-panel{position:fixed;inset:0;z-index:85;background:var(--crema-2);display:flex;flex-direction:column;
  justify-content:center;gap:.2rem;padding:0 var(--pad);clip-path:inset(0 0 100% 0);transition:clip-path .65s var(--curva)}
#syn-panel.on{clip-path:inset(0 0 0 0)}
#syn-panel a{font-family:var(--display);font-weight:600;font-size:clamp(1.6rem,6.5vw,2.4rem);padding:.3rem 0;opacity:0;transform:translateY(16px)}
#syn-panel.on a{opacity:1;transform:none;transition:opacity .5s ease,transform .6s var(--curva)}
#syn-panel.on a:nth-child(1){transition-delay:.14s}#syn-panel.on a:nth-child(2){transition-delay:.19s}
#syn-panel.on a:nth-child(3){transition-delay:.24s}#syn-panel.on a:nth-child(4){transition-delay:.29s}
#syn-panel.on a:nth-child(5){transition-delay:.34s}#syn-panel.on a:nth-child(6){transition-delay:.39s}

/* ══════ PORTADA CON LA FOTO DETRÁS DEL TEXTO ══════ */
.portada{min-height:100svh;display:flex;align-items:center;position:relative;overflow:hidden;
  padding:8.5rem var(--pad) 6rem}
/* la foto va nítida: sin desenfoque */
.hero-foto{position:absolute;inset:-44px;background-size:cover;background-position:68% 46%;
  filter:brightness(1.03) saturate(1.02);will-change:transform;z-index:0}
/* velo general muy ligero: la foto se ve casi limpia */
.hero-velo{position:absolute;inset:0;z-index:1;pointer-events:none;background:
  linear-gradient(100deg,rgba(247,243,234,.42) 0%,rgba(247,243,234,.26) 44%,rgba(247,243,234,.08) 74%,rgba(247,243,234,0) 100%),
  linear-gradient(to top,rgba(247,243,234,.58) 0%,rgba(247,243,234,0) 34%),
  linear-gradient(to bottom,rgba(247,243,234,.55) 0%,rgba(247,243,234,0) 22%)}
.port-txt{position:relative;z-index:3;max-width:620px}
/* halo concentrado justo detrás del texto: es lo que garantiza la lectura */
.port-txt::before{content:"";position:absolute;inset:-12% -20% -10% -16%;z-index:-1;pointer-events:none;
  background:radial-gradient(ellipse at 36% 50%,rgba(247,243,234,.95) 0%,rgba(247,243,234,.9) 34%,rgba(247,243,234,.62) 58%,rgba(247,243,234,.18) 74%,rgba(247,243,234,0) 86%)}
#syn-motas{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:2}
.mota{position:absolute;border-radius:50%;background:var(--cobre-luz);filter:blur(.5px);opacity:0;animation:flota linear infinite}
@keyframes flota{0%{opacity:0;transform:translateY(30px) scale(.6)}14%{opacity:.62}72%{opacity:.34}100%{opacity:0;transform:translateY(-210px) scale(1.15)}}

.portada h1{font-family:var(--display);font-weight:700;font-size:clamp(2.3rem,5.9vw,4.3rem);
  line-height:1.06;letter-spacing:-.018em;margin:0 0 1.3rem;max-width:14ch;
  text-shadow:0 2px 30px rgba(247,243,234,1),0 2px 10px rgba(247,243,234,.95),0 1px 3px rgba(247,243,234,.9)}
.portada h1 .ln{display:block;overflow:hidden}
.portada h1 .ln i{display:block;font-style:normal;transform:translateY(105%);opacity:0}
.listo .portada h1 .ln i{transform:none;opacity:1;transition:transform 1.2s var(--curva) .35s,opacity 1s ease .35s}
.listo .portada h1 .ln:nth-child(2) i{transition-delay:.48s}
.portada h1 em{font-style:italic;color:var(--cobre)}
.portada .lede{color:var(--tinta);text-shadow:0 1px 18px rgba(247,243,234,1),0 1px 5px rgba(247,243,234,.95)}
.portada .eyebrow{color:var(--salvia);text-shadow:0 1px 12px rgba(247,243,234,1)}
.sube{opacity:0;transform:translateY(20px)}
.listo .sube{opacity:1;transform:none;transition:opacity .9s ease .75s,transform 1s var(--curva) .75s}
.listo .sube.t0{transition-delay:.18s}
.listo .sube.t2{transition-delay:.88s}.listo .sube.t3{transition-delay:1s}
.pilas{display:flex;flex-wrap:wrap;gap:.45rem;margin:1.7rem 0 1.9rem}
.pila{font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;border:1px solid rgba(32,35,28,.2);
  padding:.42rem .9rem;color:var(--tinta);background:rgba(247,243,234,.8)}
.acc{display:flex;flex-wrap:wrap;gap:.8rem}
.baja{position:absolute;bottom:1.6rem;left:var(--pad);z-index:3;display:flex;align-items:center;gap:.8rem;
  font-size:.62rem;letter-spacing:.28em;text-transform:uppercase;color:var(--tinta-45)}
.barrita{display:block;width:1px;height:34px;background:linear-gradient(var(--cobre),transparent);animation:cae 2.4s ease-in-out infinite}
@keyframes cae{0%,100%{transform:scaleY(.35);transform-origin:top;opacity:.4}50%{transform:scaleY(1);opacity:1}}

/* ── secciones ── */
section{padding:var(--sec) var(--pad);position:relative}
.lim{max-width:1240px;margin:0 auto}
.rev{opacity:0;transform:translateY(28px);transition:opacity .9s ease,transform 1s var(--curva)}
.rev.visto{opacity:1;transform:none}

/* franja */
.franja{background:var(--carbon);color:var(--crema);padding:1.9rem var(--pad)}
.franja-red{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem}
.dato b{display:block;font-family:var(--display);font-weight:600;font-size:1.6rem;color:var(--cobre-luz);line-height:1.15}
.dato span{font-size:.69rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(247,243,234,.58)}

/* quiénes somos */
.proposito{max-width:none;margin:0 auto;text-align:center}
.proposito .marca-p{font-family:var(--display);font-weight:600;font-size:clamp(1.4rem,3.4vw,2.6rem);
  line-height:1.34;letter-spacing:-.008em}
.proposito .marca-p em{font-style:italic;color:var(--cobre)}
.firma{display:flex;align-items:center;justify-content:center;gap:1rem;margin-top:2rem;
  font-size:.64rem;letter-spacing:.28em;text-transform:uppercase;color:var(--salvia)}
.firma::before,.firma::after{content:"";height:1px;width:clamp(26px,6vw,64px);background:var(--linea)}
.somos-txt{max-width:66ch;margin:3.2rem auto 0;text-align:center}
.somos-txt p{color:var(--tinta-70);font-size:clamp(1rem,1.24vw,1.1rem)}
.somos-txt p+p{margin-top:1.1rem}
.tres{display:grid;grid-template-columns:repeat(3,1fr);gap:2.2rem;margin-top:3.8rem}
.tres .ic{width:28px;height:2px;background:var(--cobre);margin-bottom:1rem}
.tres h4{font-family:var(--display);font-weight:600;font-size:1.3rem;margin-bottom:.55rem}
.tres p{font-size:.93rem;color:var(--tinta-70);line-height:1.62}

/* cinta */
.cinta{border-block:1px solid var(--linea);padding:1.3rem 0;overflow:hidden;background:var(--crema-2)}
.cinta-p{display:flex;width:max-content;animation:corre 46s linear infinite}
.cinta:hover .cinta-p{animation-play-state:paused}
@keyframes corre{to{transform:translateX(-50%)}}
.cinta-p span{font-family:var(--display);font-weight:500;font-size:clamp(1.05rem,2vw,1.6rem);white-space:nowrap;
  color:var(--tinta-45);display:flex;align-items:center;gap:2.6rem;padding-right:2.6rem}
.cinta-p span::after{content:"";width:5px;height:5px;border-radius:50%;background:var(--cobre);flex:0 0 auto}

/* ══ CONFIGURADOR ══ */
.armar{background:var(--crema-2)}
.armar-red{display:grid;grid-template-columns:1.38fr .62fr;gap:clamp(1.8rem,4vw,3.2rem);align-items:start;margin-top:2.8rem}
.bloque{background:var(--crema);border:1px solid var(--linea);padding:1.6rem;margin-bottom:1.3rem}
.bloque > h5{font-size:.65rem;letter-spacing:.22em;text-transform:uppercase;color:var(--salvia);
  margin-bottom:1.2rem;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.bloque > h5 b{font-weight:600;color:var(--cobre);font-family:var(--display);font-size:1rem;letter-spacing:0}

.paqs{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.paq{position:relative;border:1px solid var(--linea);background:var(--crema);padding:1.6rem 1.35rem;cursor:pointer;
  text-align:left;color:inherit;overflow:hidden;transition:border-color .35s,transform .35s var(--curva),box-shadow .35s}
.paq::before{content:"";position:absolute;width:260px;height:260px;border-radius:50%;pointer-events:none;
  left:var(--px,50%);top:var(--py,50%);transform:translate(-50%,-50%);opacity:0;transition:opacity .4s;
  background:radial-gradient(circle,rgba(168,94,51,.13),transparent 68%)}
.paq:hover::before{opacity:1}
.paq:hover{border-color:var(--cobre);transform:translateY(-4px);box-shadow:0 12px 28px rgba(32,35,28,.08)}
.paq.on{border-color:var(--cobre);background:linear-gradient(165deg,rgba(168,94,51,.11),rgba(168,94,51,.02))}
.paq .tk{position:absolute;top:1.1rem;right:1.1rem;width:19px;height:19px;border:1px solid var(--linea);
  border-radius:50%;display:grid;place-items:center;font-size:.64rem;color:var(--crema);transition:background .3s,border-color .3s}
.paq.on .tk{background:var(--cobre);border-color:var(--cobre)}
.paq .tk s{opacity:0;text-decoration:none;transition:opacity .25s .08s} .paq.on .tk s{opacity:1}
.paq .rt{font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:var(--salvia);display:block;margin-bottom:.55rem;position:relative}
.paq h4{font-family:var(--display);font-weight:600;font-size:1.55rem;margin-bottom:.4rem;position:relative}
.paq .pp{font-size:.86rem;color:var(--tinta-70);line-height:1.55;position:relative;min-height:4.2em}
.paq .inc{margin-top:1rem;padding-top:.9rem;border-top:1px solid var(--linea);font-size:.79rem;
  color:var(--cobre);position:relative;letter-spacing:.03em}
.paq .cinta-e{position:absolute;top:0;left:0;background:var(--cobre);color:var(--crema);font-size:.55rem;
  letter-spacing:.2em;text-transform:uppercase;padding:.32rem .7rem;z-index:1}
.paq.destacado{padding-top:2.7rem}

/* composición */
.comp{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.ccol .t{font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--tinta-45);
  min-height:2.6em;display:block;margin-bottom:.7rem;line-height:1.4}
.slots{display:flex;gap:5px;flex-wrap:wrap}
.slots i{width:11px;height:11px;border-radius:50%;background:var(--cobre);
  opacity:0;transform:scale(.4);animation:brota .4s var(--curva) forwards}
@keyframes brota{to{opacity:1;transform:scale(1)}}
.ccol .n{display:block;margin-top:.6rem;font-family:var(--display);font-weight:700;font-size:1.25rem;color:var(--cobre)}

/* invitados */
.inv-cab{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;margin-bottom:1rem;flex-wrap:wrap}
.inv-n{font-family:var(--display);font-weight:700;font-size:clamp(2rem,3.8vw,2.7rem);line-height:1;color:var(--cobre)}
.inv-n small{font-family:var(--sans);font-weight:400;font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--tinta-45);margin-left:.5rem}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:3px;background:var(--crema-3);
  outline:none;cursor:pointer;border-radius:2px}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;
  background:var(--cobre);border:4px solid var(--crema);box-shadow:0 0 0 1px var(--cobre);transition:transform .22s var(--curva)}
input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.22)}
input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--cobre);border:4px solid var(--crema);cursor:pointer}
.marcas{display:flex;justify-content:space-between;font-size:.64rem;color:var(--tinta-45);margin-top:.7rem;letter-spacing:.08em}
.multitud{display:flex;flex-wrap:wrap;gap:4px;margin-top:1.2rem;min-height:22px}
.multitud i{width:5px;height:5px;border-radius:50%;background:var(--salvia);opacity:0;transform:scale(0);animation:brota .35s var(--curva) forwards}

/* extras */
.fichas{display:flex;flex-wrap:wrap;gap:.5rem}
.fi{font-size:.84rem;font-weight:300;color:var(--tinta-70);background:var(--crema);border:1px solid var(--linea);
  padding:.6rem 1.05rem;cursor:pointer;display:inline-flex;align-items:center;gap:.5rem;
  transition:all .28s var(--curva);position:relative}
.fi::before{content:"+";color:var(--cobre);transition:transform .3s var(--curva)}
.fi:hover{border-color:var(--cobre);color:var(--tinta);transform:translateY(-2px)}
.fi.on{border-color:var(--cobre);background:var(--cobre-suave);color:var(--tinta)}
.fi.on::before{transform:rotate(45deg)}

/* — ambientación aromática: luz de vela reforzada — */
.fi.aroma{border-color:var(--cobre);border-style:dashed;color:var(--cobre);font-weight:400}
.fi.aroma::before{content:"✦";transform:none;font-size:.9rem}
.fi.aroma.on{border-style:solid;border-color:var(--cobre-cl);color:var(--tinta);
  background:linear-gradient(150deg,rgba(255,236,203,.92),rgba(239,191,147,.62) 46%,rgba(168,94,51,.2));
  animation:vela 2.8s ease-in-out infinite}
.fi.aroma.on::before{content:"✦";color:var(--cobre);animation:parpadeo 1.7s ease-in-out infinite}
@keyframes vela{
  0%,100%{box-shadow:0 0 20px rgba(239,191,147,.7),0 0 46px rgba(239,191,147,.32),0 0 4px rgba(168,94,51,.4)}
  18%{box-shadow:0 0 34px rgba(255,214,158,.95),0 0 70px rgba(239,191,147,.5),0 0 8px rgba(168,94,51,.55)}
  37%{box-shadow:0 0 14px rgba(239,191,147,.55),0 0 34px rgba(239,191,147,.22),0 0 3px rgba(168,94,51,.3)}
  58%{box-shadow:0 0 40px rgba(255,214,158,1),0 0 82px rgba(239,191,147,.55),0 0 10px rgba(168,94,51,.6)}
  76%{box-shadow:0 0 18px rgba(239,191,147,.6),0 0 40px rgba(239,191,147,.28),0 0 4px rgba(168,94,51,.35)}
}
@keyframes parpadeo{0%,100%{opacity:1;transform:scale(1)}30%{opacity:.72;transform:scale(.9)}55%{opacity:1;transform:scale(1.14)}78%{opacity:.85;transform:scale(.96)}}
.chispa{position:absolute;border-radius:50%;pointer-events:none;z-index:6;
  background:radial-gradient(circle,#FFF6E2 0%,#FFD9A0 38%,var(--cobre-cl) 62%,rgba(168,94,51,0) 78%);
  animation:chispa 1.9s ease-out forwards}
@keyframes chispa{
  0%{opacity:0;transform:translate(0,0) scale(.25)}
  10%{opacity:1;transform:translate(calc(var(--dx)*.12),calc(var(--dy)*.12)) scale(1.25)}
  60%{opacity:.85}
  100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.5)}
}
.destello{position:absolute;left:50%;top:50%;width:14px;height:14px;border-radius:50%;pointer-events:none;z-index:5;
  transform:translate(-50%,-50%);border:2px solid rgba(255,214,158,.95);animation:destello 1.05s ease-out forwards}
@keyframes destello{
  0%{opacity:1;width:14px;height:14px;border-width:3px}
  100%{opacity:0;width:290px;height:290px;border-width:1px}
}
.susurro{margin-top:1.1rem;padding:1.05rem 1.15rem;border-left:3px solid var(--cobre);background:var(--cobre-suave);
  font-size:.87rem;color:var(--tinta-70);line-height:1.62;max-width:56ch}
.susurro b{font-weight:600;color:var(--tinta);display:block;margin-bottom:.3rem;font-family:var(--display);font-size:1.08rem}

/* resumen */
.res{border:1px solid var(--cobre);background:var(--crema);padding:1.7rem;position:sticky;top:5.5rem}
.res .rt{font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--salvia)}
.res h4{font-family:var(--display);font-weight:600;font-size:1.7rem;margin:.5rem 0 1.2rem}
.rl{display:flex;justify-content:space-between;gap:1rem;font-size:.85rem;padding:.5rem 0;
  border-bottom:1px solid var(--linea);color:var(--tinta-70)}
.rl b{font-weight:400;color:var(--tinta);text-align:right}
.mini{font-size:.8rem;color:var(--tinta-70);line-height:1.6;margin-top:1rem;list-style:none}
.mini li{padding-left:1rem;position:relative}
.mini li::before{content:"";position:absolute;left:0;top:.7em;width:5px;height:1px;background:var(--cobre)}
.tot{margin-top:1.4rem;padding-top:1.2rem;border-top:1px solid var(--cobre)}
.tot .et{font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--tinta-45)}
.tot .cf{font-family:var(--display);font-weight:700;font-size:clamp(1.4rem,2.4vw,1.8rem);line-height:1.2;margin-top:.35rem;color:var(--cobre)}
.aviso-p{margin-top:1rem;padding:.9rem 1rem;border:1px solid var(--tinta-22);background:var(--crema-2);
  font-size:.78rem;color:var(--tinta-70);line-height:1.58}
.aviso-p b{font-weight:500;color:var(--tinta)}
.res .btn{width:100%;margin-top:1.1rem}

/* catálogo */
.cat-red{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:2rem 2.4rem;margin-top:2.8rem}
.ccard h4{font-family:var(--display);font-weight:600;font-size:1.3rem;padding-bottom:.6rem;margin-bottom:.85rem;
  border-bottom:2px solid var(--cobre)}
.ccard p{font-size:.91rem;color:var(--tinta-70);line-height:1.6}
.ccard .ej{margin-top:.7rem;font-size:.8rem;color:var(--tinta-45)}
.pide{margin-top:3rem;padding:2rem;border:1px solid var(--linea);background:var(--crema-2);
  display:flex;flex-wrap:wrap;gap:1.5rem;align-items:center;justify-content:space-between}
.pide p{max-width:44ch;font-size:.99rem;color:var(--tinta-70)}
.pide strong{font-weight:500;color:var(--tinta)}

/* proceso horizontal */
.proceso-wrap{position:relative;height:420vh;padding:0}
.proceso-fijo{position:sticky;top:0;height:100svh;display:flex;flex-direction:column;justify-content:center;
  overflow:hidden;padding:0 0 0 var(--pad);background:var(--crema)}
.proceso-cab{margin-bottom:2.6rem;max-width:1240px}
.proceso-pista{display:flex;gap:clamp(1.2rem,3vw,3rem);will-change:transform}
.paso{flex:0 0 clamp(245px,25vw,330px);border-top:2px solid var(--cobre);padding:1.8rem 0 0}
.paso .n{font-family:var(--display);font-weight:700;font-size:2.9rem;color:var(--cobre);opacity:.62;
  line-height:1;display:block;margin-bottom:1rem}
.paso h4{font-family:var(--display);font-weight:600;font-size:1.35rem;margin-bottom:.55rem}
.paso p{font-size:.91rem;color:var(--tinta-70);line-height:1.62}
.riel-p{height:1px;background:var(--linea);margin-top:2.6rem;max-width:1240px;position:relative}
.riel-p i{position:absolute;left:0;top:0;height:2px;background:var(--cobre);width:0}

/* galería */
.gal{display:grid;grid-template-columns:repeat(12,1fr);gap:.9rem;margin-top:2.8rem}
.gf{position:relative;overflow:hidden;background:var(--crema-3);display:flex;align-items:flex-end;
  padding:1rem;transition:transform .5s var(--curva)}
.gf:hover{transform:translateY(-4px)}
.gf span{position:relative;font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--crema);
  background:rgba(25,27,22,.75);padding:.35rem .7rem}
.gf.foto{background-size:cover;background-position:center}
.gf.vacio{border:1px dashed var(--tinta-22);background:transparent}
.gf.vacio span{background:none;color:var(--tinta-45)}
.g1{grid-column:span 7;aspect-ratio:3/2}.g2{grid-column:span 5;aspect-ratio:1/1}
.g3,.g4,.g5{grid-column:span 4;aspect-ratio:4/5}

/* promesas */
.prom{background:var(--salvia-suave)}
.lp{margin-top:2.4rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(275px,1fr));gap:0 2.8rem;list-style:none}
.lp li{padding:1.25rem 0;border-bottom:1px solid var(--linea);font-size:.99rem;display:flex;gap:.9rem;align-items:baseline;line-height:1.5}
.lp li b{font-family:var(--display);font-weight:700;color:var(--cobre);font-size:.9rem;flex:0 0 auto}

/* cotizar */
.cot-red{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(2rem,6vw,5.5rem);align-items:start}
.form{display:grid;gap:1.3rem}
.par{display:grid;grid-template-columns:1fr 1fr;gap:1.3rem}
.campo{display:flex;flex-direction:column;gap:.45rem}
.campo label{font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:var(--tinta-45)}
.campo input,.campo select,.campo textarea{background:transparent;border:0;border-bottom:1px solid var(--linea);
  color:var(--tinta);font-family:var(--sans);font-size:1rem;font-weight:300;padding:.58rem 0;transition:border-color .35s}
.campo input:focus,.campo select:focus,.campo textarea:focus{outline:none;border-bottom-color:var(--cobre)}
.campo textarea{resize:vertical;min-height:78px}
#syn-eco{border:1px solid var(--cobre);background:var(--cobre-suave);padding:.9rem 1.1rem;font-size:.86rem;
  color:var(--tinta);display:flex;align-items:center;gap:.7rem;line-height:1.5}
.pt{width:6px;height:6px;border-radius:50%;background:var(--cobre);flex:0 0 auto;animation:pulso 2.2s ease-in-out infinite}
@keyframes pulso{0%,100%{opacity:.35;transform:scale(.8)}50%{opacity:1;transform:scale(1.25)}}
.nota{font-size:.79rem;color:var(--tinta-45)}
.faq{margin-top:2.6rem;border-top:1px solid var(--linea)}
.faq details{border-bottom:1px solid var(--linea)}
.faq summary{cursor:pointer;list-style:none;padding:1.15rem 0;font-size:.97rem;display:flex;
  justify-content:space-between;gap:1rem;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--cobre);font-size:1.15rem;transition:transform .35s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq p{padding-bottom:1.2rem;color:var(--tinta-70);font-size:.91rem;max-width:58ch}

/* ══════ PIE EN TRES COLUMNAS ══════ */
footer.pie{background:var(--carbon);color:var(--crema);padding:4.2rem var(--pad) 2rem}
.pie-red{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.pie-col{padding:0 clamp(1.2rem,3vw,2.8rem)}
.pie-col:first-child{padding-left:0}
.pie-col:last-child{padding-right:0}
.pie-col + .pie-col{border-left:1px solid var(--linea-osc)}
.pie-red img{width:150px;margin-bottom:1.3rem;opacity:.94}
.pie-t{font-family:var(--display);font-weight:600;font-size:.72rem;letter-spacing:.24em;
  text-transform:uppercase;color:var(--salvia-cl);margin-bottom:1.2rem}
.enl{display:flex;flex-direction:column;gap:.6rem;font-size:.88rem;color:rgba(247,243,234,.66)}
.enl a{transition:color .3s}
.enl a:hover{color:var(--cobre-luz)}
.redes-pie{display:flex;flex-direction:column;gap:.75rem}
.rp{display:flex;align-items:center;gap:.8rem;font-size:.9rem;color:rgba(247,243,234,.72);
  transition:color .3s,transform .3s var(--curva)}
.rp svg{width:19px;height:19px;flex:0 0 auto;color:var(--cobre-cl);transition:color .3s}
.rp:hover{color:var(--crema);transform:translateX(4px)}
.rp:hover svg{color:var(--cobre-luz)}
.rp .u{color:rgba(247,243,234,.5);font-size:.82rem}
.legal{max-width:1240px;margin:3rem auto 0;padding-top:1.4rem;border-top:1px solid var(--linea-osc);
  display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;font-size:.7rem;letter-spacing:.08em;color:rgba(247,243,234,.45)}

/* responsive */
@media(max-width:1040px){
  .port-txt{max-width:100%}
  .port-txt::before{inset:-9% -12%;
    background:radial-gradient(ellipse at 44% 48%,rgba(247,243,234,.93) 0%,rgba(247,243,234,.86) 44%,rgba(247,243,234,.5) 68%,rgba(247,243,234,0) 86%)}
  .hero-velo{background:
    linear-gradient(to bottom,rgba(247,243,234,.5) 0%,rgba(247,243,234,.36) 38%,rgba(247,243,234,.5) 76%,rgba(247,243,234,.72) 100%)}
  .tres{grid-template-columns:1fr;gap:1.8rem}
  .armar-red,.cot-red{grid-template-columns:1fr}
  .res{position:static}
  .pie-red{grid-template-columns:1fr 1fr}
  .pie-col:nth-child(3){grid-column:1 / -1;border-left:0;border-top:1px solid var(--linea-osc);
    padding:2rem 0 0;margin-top:2rem}
}
@media(max-width:820px){
  .menu a.nav{display:none} .hamb{display:flex}
  .marca .nom{font-size:.88rem;letter-spacing:.16em}
  .portada{padding-top:7.5rem;min-height:92svh}
  .baja{display:none}
  .franja-red{grid-template-columns:1fr 1fr;gap:1.2rem}
  .paqs{grid-template-columns:1fr} .paq .pp{min-height:0}
  .comp{grid-template-columns:1fr 1fr;gap:1.2rem}
  .proceso-wrap{height:auto;padding:var(--sec) 0}
  .proceso-fijo{position:static;height:auto}
  .proceso-cab{padding-right:var(--pad)}
  .proceso-pista{overflow-x:auto;scroll-snap-type:x mandatory;padding:0 var(--pad) 1.4rem 0;-webkit-overflow-scrolling:touch}
  .proceso-pista::-webkit-scrollbar{display:none}
  .paso{flex:0 0 74vw;scroll-snap-align:start}
  .riel-p{display:none}
  .gal{grid-template-columns:repeat(2,1fr);gap:.6rem}
  .g1{grid-column:span 2}.g2,.g3,.g4,.g5{grid-column:span 1;aspect-ratio:1/1}
  .par{grid-template-columns:1fr}
  .marca-p br{display:none}
  .proposito{max-width:20ch}
  .pide{flex-direction:column;align-items:flex-start}
  .pie-red{grid-template-columns:1fr}
  .pie-col,.pie-col:nth-child(3){padding:2rem 0 0;margin-top:0;border-left:0;
    border-top:1px solid var(--linea-osc)}
  .pie-col:first-child{padding-top:0;border-top:0}
  .pie-red img{width:132px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .rev,.sube{opacity:1;transform:none}
  .portada h1 .ln i{transform:none;opacity:1}
  #syn-telon{display:none}
  .proceso-wrap{height:auto}.proceso-fijo{position:static;height:auto}
  .proceso-pista{overflow-x:auto}
  .chispa,.destello{display:none}
}

/* ═══════════════════════════════════════════
   PÁGINAS INTERIORES
   Blog, aviso de privacidad, términos, 404.
   ═══════════════════════════════════════════ */
.interior{max-width:760px;margin:0 auto;padding:9rem var(--pad) var(--sec)}
.interior .encabezado{margin-bottom:3rem;padding-bottom:2rem;border-bottom:1px solid var(--linea)}
.interior h1{font-family:var(--display);font-weight:700;font-size:clamp(2rem,5vw,3.2rem);line-height:1.12;letter-spacing:-.012em}
.interior .meta{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--salvia);margin-top:1rem}
.entrada{font-size:1.04rem;line-height:1.8;color:var(--tinta-70)}
.entrada > *+*{margin-top:1.3rem}
.entrada h2{font-family:var(--display);font-weight:600;font-size:1.75rem;color:var(--tinta);margin-top:2.6rem;line-height:1.2}
.entrada h3{font-family:var(--display);font-weight:600;font-size:1.35rem;color:var(--tinta);margin-top:2rem}
.entrada a{color:var(--cobre);text-decoration:underline;text-underline-offset:3px}
.entrada ul,.entrada ol{padding-left:1.3rem}
.entrada li{margin-top:.5rem}
.entrada blockquote{border-left:3px solid var(--cobre);padding-left:1.4rem;font-family:var(--display);
  font-size:1.25rem;line-height:1.4;color:var(--tinta);font-style:italic}
.entrada img{margin:2rem 0}
.entrada hr{border:0;border-top:1px solid var(--linea);margin:2.6rem 0}
.entrada table{width:100%;border-collapse:collapse;font-size:.93rem}
.entrada th,.entrada td{padding:.7rem;border-bottom:1px solid var(--linea);text-align:left}
.entrada th{font-weight:500;color:var(--tinta);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase}
.volver{display:inline-block;margin-top:3rem;font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;color:var(--cobre)}
.volver:hover{text-decoration:underline;text-underline-offset:4px}
.lista-entradas{display:grid;gap:0;margin-top:2rem}
.item-entrada{padding:2rem 0;border-bottom:1px solid var(--linea)}
.item-entrada h2{font-family:var(--display);font-weight:600;font-size:1.5rem;line-height:1.2}
.item-entrada h2 a:hover{color:var(--cobre)}
.item-entrada p{margin-top:.7rem;color:var(--tinta-70);font-size:.95rem}
.paginacion{margin-top:2.5rem;display:flex;gap:1rem;font-size:.8rem}
.error404 .interior{text-align:center;padding-top:11rem}
.error404 .cifra{font-family:var(--display);font-weight:700;font-size:clamp(5rem,16vw,10rem);color:var(--cobre);opacity:.32;line-height:1}
.saltar{position:absolute;left:-9999px;top:0;background:var(--cobre);color:var(--crema);padding:.8rem 1.2rem;z-index:999}
.saltar:focus{left:1rem;top:1rem}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}

/* barra de administración de WordPress */
@media screen and (min-width:783px){body.admin-bar .barra{top:32px}body.admin-bar #syn-avance{top:32px}}
@media screen and (max-width:782px){body.admin-bar .barra{top:46px}}