/* ============================================================
   FARO ELÉCTRICO — Valparaíso · arena + cobre · editorial costero
   ============================================================ */

:root{
  --bg:#FBF6EE;
  --surface:#F3E9DA;
  --fg:#2A1C12;
  --muted:#7A6651;
  --accent:#C2491D;        /* relleno / bordes / texto grande */
  --accent-ink:#9E3A16;    /* texto chico sobre surface (AA) */
  --accent-lt:#E8743E;     /* acento legible sobre fondo oscuro fg (AA) */
  --line:#E4D6C2;
  --wsp:#25D366;
  --demobar-h:34px;

  --maxw:1180px;
  --pad:clamp(20px,5vw,72px);
  --r:18px;
  --r-lg:26px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-soft:cubic-bezier(.4,0,.2,1);

  --shadow:0 18px 50px -28px rgba(42,28,18,.45);
  --shadow-soft:0 10px 30px -22px rgba(42,28,18,.4);

  font-synthesis:none;
  -webkit-text-size-adjust:100%;
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }

html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }

body{
  background:var(--bg);
  color:var(--fg);
  font-family:"Plus Jakarta Sans",system-ui,sans-serif;
  font-size:clamp(15px,1.05vw,17px);
  line-height:1.65;
  font-weight:400;
  overflow-x:hidden;
  padding-top:var(--demobar-h);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

h1,h2,h3,h4,h5{
  font-family:"Fraunces",Georgia,serif;
  font-weight:600;
  line-height:1.04;
  letter-spacing:-.01em;
  color:var(--fg);
}

a{ color:inherit; text-decoration:none; }
img,svg{ display:block; max-width:100%; }

::selection{ background:var(--accent); color:#fff; }

:focus-visible{
  outline:3px solid var(--accent);
  outline-offset:3px;
  border-radius:6px;
}

/* ---------- KICKER ---------- */
.kicker{
  font-family:"Plus Jakarta Sans",sans-serif;
  font-weight:600;
  font-size:.78rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--accent-ink);
  display:inline-flex;
  align-items:center;
  gap:.6em;
  margin-bottom:1.1rem;
}
.kicker::before{
  content:"";
  width:26px; height:2px;
  background:var(--accent);
  border-radius:2px;
}
.kicker--light{ color:#F3D9C4; }
.kicker--light::before{ background:#F3D9C4; }

/* ============================================================
   DEMO BAR
   ============================================================ */
.demobar{
  position:fixed; top:0; left:0; right:0; z-index:120;
  height:var(--demobar-h);
  display:flex; align-items:center; justify-content:center; gap:.5em;
  background:var(--fg);
  color:var(--bg);
  font-size:.74rem; font-weight:500; letter-spacing:.01em;
  padding:0 14px;
  white-space:nowrap; overflow:hidden;
  transition:background .3s var(--ease);
}
.demobar u{ text-underline-offset:2px; text-decoration-color:var(--accent-lt); }
.demobar:hover{ background:#3a2818; }
.demobar__dot{
  width:8px; height:8px; border-radius:50%;
  background:var(--accent-lt);
  box-shadow:0 0 0 0 rgba(194,73,29,.6);
  animation:pulse 2.2s var(--ease) infinite;
}
.demobar__arrow{ color:var(--accent-lt); font-weight:700; transition:transform .3s var(--ease); }
.demobar:hover .demobar__arrow{ transform:translateX(4px); }
@keyframes pulse{
  0%{ box-shadow:0 0 0 0 rgba(194,73,29,.55); }
  70%{ box-shadow:0 0 0 7px rgba(194,73,29,0); }
  100%{ box-shadow:0 0 0 0 rgba(194,73,29,0); }
}

/* ============================================================
   NAV
   ============================================================ */
.nav{
  position:fixed; top:var(--demobar-h); left:0; right:0; z-index:100;
  display:flex; align-items:center; justify-content:space-between;
  padding:14px var(--pad);
  background:rgba(251,246,238,.78);
  backdrop-filter:saturate(160%) blur(14px);
  -webkit-backdrop-filter:saturate(160%) blur(14px);
  border-bottom:1px solid transparent;
  transition:border-color .35s var(--ease), background .35s var(--ease), padding .35s var(--ease);
}
.nav.is-stuck{
  border-bottom-color:var(--line);
  padding-top:10px; padding-bottom:10px;
}
.nav__brand{ display:flex; align-items:center; gap:.6rem; }
.nav__mark{ width:30px; height:30px; color:var(--accent); flex:none; }
.nav__mark svg{ width:100%; height:100%; }
.nav__word{
  font-family:"Fraunces",serif;
  font-weight:500; font-size:1.18rem; line-height:1;
  letter-spacing:-.01em;
}
.nav__word b{ font-weight:600; color:var(--accent-ink); }

.nav__links{ display:flex; align-items:center; gap:2rem; }
.nav__links a{
  font-size:.92rem; font-weight:500; color:var(--fg);
  position:relative; padding:.2rem 0;
  transition:color .25s var(--ease);
}
.nav__links a:not(.nav__cta)::after{
  content:""; position:absolute; left:0; bottom:-3px;
  width:100%; height:2px; background:var(--accent);
  transform:scaleX(0); transform-origin:left;
  transition:transform .3s var(--ease);
}
.nav__links a:not(.nav__cta):hover{ color:var(--accent-ink); }
.nav__links a:not(.nav__cta):hover::after{ transform:scaleX(1); }
.nav__cta{
  background:var(--accent); color:#fff !important;
  padding:.55rem 1.2rem; border-radius:999px;
  font-weight:600;
  box-shadow:var(--shadow-soft);
  transition:transform .25s var(--ease), background .25s var(--ease);
}
.nav__cta:hover{ background:var(--accent-ink); transform:translateY(-2px); }

.nav__burger{
  display:none; flex-direction:column; gap:6px;
  width:42px; height:42px; border:1px solid var(--line);
  border-radius:12px; background:var(--surface); cursor:pointer;
  align-items:center; justify-content:center;
}
.nav__burger span{
  width:18px; height:2px; background:var(--fg); border-radius:2px;
  transition:transform .3s var(--ease), opacity .3s var(--ease);
}
.nav__burger[aria-expanded="true"] span:first-child{ transform:translateY(4px) rotate(45deg); }
.nav__burger[aria-expanded="true"] span:last-child{ transform:translateY(-4px) rotate(-45deg); }

/* ============================================================
   BUTTONS
   ============================================================ */
.btn{
  display:inline-flex; align-items:center; gap:.55rem;
  font-family:"Plus Jakarta Sans",sans-serif;
  font-weight:600; font-size:.98rem;
  padding:.85rem 1.5rem; border-radius:999px;
  cursor:pointer; border:none;
  transition:transform .25s var(--ease), background .25s var(--ease), box-shadow .25s var(--ease), color .25s var(--ease);
}
.btn svg{ width:18px; height:18px; }
.btn--solid{
  background:var(--accent); color:#fff;
  box-shadow:0 14px 30px -16px rgba(194,73,29,.8);
}
.btn--solid:hover{ background:var(--accent-ink); transform:translateY(-3px); box-shadow:0 18px 36px -16px rgba(194,73,29,.9); }
.btn--solid svg{ transition:transform .25s var(--ease); }
.btn--solid:hover svg{ transform:translateX(4px); }
.btn--ghost{
  background:transparent; color:var(--fg);
  box-shadow:inset 0 0 0 1.5px var(--line);
}
.btn--ghost:hover{ box-shadow:inset 0 0 0 1.5px var(--accent); color:var(--accent-ink); transform:translateY(-3px); }
.btn--wsp{ background:var(--wsp); color:#053b1e; }
.btn--wsp:hover{ background:#1fc15c; transform:translateY(-3px); }

/* ============================================================
   HERO
   ============================================================ */
.hero{
  position:relative;
  min-height:100svh;
  display:flex; align-items:center;
  padding:clamp(120px,16vh,180px) var(--pad) clamp(70px,10vh,120px);
  overflow:hidden;
}
.hero__bg{ position:absolute; inset:0; z-index:0; }
.hero__mesh{
  position:absolute; inset:-20%;
  background:
    radial-gradient(60% 50% at 78% 18%, rgba(194,73,29,.16), transparent 70%),
    radial-gradient(50% 60% at 12% 88%, rgba(122,102,81,.18), transparent 70%),
    radial-gradient(40% 40% at 85% 80%, rgba(243,217,162,.35), transparent 70%);
}
.hero__beam{
  position:absolute; top:8%; right:-10%;
  width:70vw; height:70vw; max-width:760px; max-height:760px;
  background:conic-gradient(from 200deg at 50% 50%,
    transparent 0deg, rgba(194,73,29,.14) 18deg, transparent 36deg,
    transparent 320deg, rgba(243,217,162,.3) 340deg, transparent 360deg);
  border-radius:50%;
  filter:blur(2px);
  animation:beamspin 26s linear infinite;
}
@keyframes beamspin{ to{ transform:rotate(360deg); } }
.hero__grain{
  position:absolute; inset:0; opacity:.5; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.05'/%3E%3C/svg%3E");
}

.hero__wrap{
  position:relative; z-index:1;
  width:100%; max-width:var(--maxw); margin:0 auto;
  display:grid; grid-template-columns:1.15fr .85fr;
  gap:clamp(32px,5vw,72px); align-items:center;
}
.hero__eyebrow{
  display:inline-flex; align-items:center; gap:.6rem;
  font-size:.82rem; font-weight:600; letter-spacing:.04em;
  color:var(--accent-ink);
  background:var(--surface);
  border:1px solid var(--line);
  padding:.45rem 1rem; border-radius:999px;
  margin-bottom:1.4rem;
}
.hero__pulse{
  width:8px; height:8px; border-radius:50%; background:var(--accent);
  box-shadow:0 0 0 0 rgba(194,73,29,.6);
  animation:pulse 2s var(--ease) infinite;
}
.hero__title{
  font-size:clamp(2.6rem,6.4vw,5rem);
  letter-spacing:-.025em; line-height:.98;
  margin-bottom:1.5rem;
}
.hero__title em{
  font-style:italic; font-weight:500;
  color:var(--accent);
}
.hero__lead{
  font-size:clamp(1.02rem,1.5vw,1.22rem);
  color:var(--muted); max-width:46ch;
  margin-bottom:2rem;
}
.hero__actions{ display:flex; flex-wrap:wrap; gap:.9rem; margin-bottom:2.6rem; }
.hero__facts{
  display:flex; flex-wrap:wrap; gap:clamp(1.4rem,3vw,2.8rem);
  list-style:none;
}
.hero__facts li{ display:flex; flex-direction:column; }
.hero__facts b{
  font-family:"Fraunces",serif; font-weight:600;
  font-size:1.7rem; color:var(--accent-ink); line-height:1;
}
.hero__facts span{ font-size:.82rem; color:var(--muted); margin-top:.35rem; }

/* lighthouse panel */
.hero__panel{ display:flex; flex-direction:column; align-items:center; gap:1rem; }
.lighthouse{
  position:relative;
  width:min(320px,80%);
  aspect-ratio:240/320;
  background:
    radial-gradient(70% 60% at 50% 20%, rgba(243,217,162,.55), transparent 72%),
    linear-gradient(160deg,var(--surface),#EFE2CE);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  box-shadow:var(--shadow);
  padding:18px;
  display:grid; place-items:center;
}
.lighthouse svg{ width:100%; height:100%; filter:drop-shadow(0 12px 18px rgba(42,28,18,.18)); }
.lighthouse__spark{
  position:absolute; border-radius:50%;
  background:var(--accent);
  opacity:.8;
  animation:spark 3.4s var(--ease) infinite;
}
.lighthouse__spark--1{ width:7px; height:7px; top:22%; right:14%; }
.lighthouse__spark--2{ width:5px; height:5px; top:34%; right:24%; animation-delay:1.1s; background:#F3D9A2; }
@keyframes spark{
  0%,100%{ transform:scale(.4); opacity:0; }
  40%{ transform:scale(1); opacity:.9; }
}
.hero__panelnote{
  font-size:.82rem; color:var(--muted); letter-spacing:.04em;
}

.hero__scroll{
  position:absolute; left:50%; bottom:26px; transform:translateX(-50%);
  z-index:2; width:26px; height:42px;
  border:2px solid var(--muted); border-radius:14px;
  display:grid; place-items:start center; padding-top:7px;
}
.hero__scroll span{
  width:4px; height:8px; border-radius:3px; background:var(--accent);
  animation:scrolldot 1.8s var(--ease) infinite;
}
@keyframes scrolldot{
  0%{ transform:translateY(0); opacity:1; }
  70%{ transform:translateY(12px); opacity:0; }
  100%{ opacity:0; }
}

/* ============================================================
   MARQUEE
   ============================================================ */
.marquee{
  background:var(--fg); color:var(--bg);
  overflow:hidden; padding:.85rem 0;
  border-top:1px solid var(--accent);
}
.marquee__track{
  display:flex; align-items:center; gap:1.6rem; width:max-content;
  animation:marquee 32s linear infinite;
  font-family:"Fraunces",serif; font-size:1.05rem; font-weight:500;
}
.marquee__track span{ white-space:nowrap; }
.marquee__track i{ color:var(--accent-lt); font-style:normal; }
@keyframes marquee{ to{ transform:translateX(-50%); } }

/* ============================================================
   ABOUT
   ============================================================ */
.about{ padding:clamp(64px,11vh,128px) var(--pad); }
.about__grid{
  max-width:var(--maxw); margin:0 auto;
  display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(36px,6vw,80px);
  align-items:center;
}
.about__media{ position:relative; }
.about__card{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  padding:clamp(24px,4vw,44px);
  box-shadow:var(--shadow);
}
.about__card svg{ width:100%; height:auto; border-radius:14px; }
.about__badge{
  position:absolute; bottom:-18px; right:-8px;
  display:flex; align-items:center; gap:.55rem;
  background:var(--fg); color:var(--bg);
  padding:.7rem 1.1rem; border-radius:999px;
  font-size:.82rem; font-weight:600;
  box-shadow:var(--shadow);
}
.about__badge svg{ width:18px; height:18px; color:var(--accent); flex:none; }

.about__title{
  font-size:clamp(1.9rem,3.4vw,2.9rem);
  margin-bottom:1.3rem;
}
.about__lead{
  font-size:1.1rem; color:var(--fg); margin-bottom:1.1rem;
}
.about__text{ color:var(--muted); margin-bottom:1.8rem; }
.about__list{ list-style:none; display:flex; flex-direction:column; gap:.95rem; }
.about__list li{
  display:flex; align-items:center; gap:.85rem;
  font-weight:500; font-size:.98rem;
}
.about__ic{
  width:38px; height:38px; flex:none;
  display:grid; place-items:center;
  background:var(--surface); border:1px solid var(--line);
  border-radius:12px; color:var(--accent);
}
.about__ic svg{ width:20px; height:20px; }

/* ============================================================
   SERVICES
   ============================================================ */
.services{
  padding:clamp(64px,11vh,128px) var(--pad);
  background:linear-gradient(180deg,var(--bg),var(--surface));
}
.services__head{ max-width:680px; margin:0 auto clamp(40px,6vw,64px); text-align:center; }
.services__head .kicker{ justify-content:center; }
.services__title{ font-size:clamp(1.9rem,3.8vw,3rem); margin-bottom:1rem; }
.services__sub{ color:var(--muted); }

.services__grid{
  max-width:var(--maxw); margin:0 auto;
  display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(18px,2.4vw,28px);
}
.svc{
  background:var(--bg);
  border:1px solid var(--line);
  border-radius:var(--r);
  padding:clamp(24px,2.8vw,34px);
  display:flex; flex-direction:column;
  box-shadow:var(--shadow-soft);
  transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s var(--ease);
  position:relative; overflow:hidden;
}
.svc::after{
  content:""; position:absolute; inset:0 0 auto 0; height:3px;
  background:var(--accent); transform:scaleX(0); transform-origin:left;
  transition:transform .4s var(--ease);
}
.svc:hover{ transform:translateY(-6px); box-shadow:var(--shadow); border-color:#D8C5A9; }
.svc:hover::after{ transform:scaleX(1); }
.svc__ic{
  width:54px; height:54px; border-radius:14px;
  background:var(--surface); border:1px solid var(--line);
  display:grid; place-items:center; color:var(--accent);
  margin-bottom:1.3rem;
  transition:background .4s var(--ease), color .4s var(--ease);
}
.svc__ic svg{ width:28px; height:28px; }
.svc:hover .svc__ic{ background:var(--accent); color:#fff; }
.svc h3{ font-size:1.32rem; margin-bottom:.6rem; }
.svc p{ color:var(--muted); font-size:.96rem; margin-bottom:1.3rem; flex:1; }
.svc__price{
  font-family:"Fraunces",serif; font-weight:600; font-size:1.05rem;
  color:var(--accent-ink);
  padding-top:.9rem; border-top:1px solid var(--line);
}
.svc--accent{
  background:var(--fg); border-color:var(--fg);
}
.svc--accent h3{ color:var(--bg); }
.svc--accent p{ color:#D6C4AE; }
.svc--accent .svc__ic{ background:var(--accent); color:#fff; border-color:var(--accent); }
.svc--accent .svc__price{ color:#F3D9A2; border-top-color:rgba(255,255,255,.14); }
.svc--accent:hover .svc__ic{ background:#fff; color:var(--accent); }
.svc--accent::after{ background:#F3D9A2; }

/* ============================================================
   TRUST
   ============================================================ */
.trust{
  background:var(--fg); color:var(--bg);
  padding:clamp(70px,12vh,140px) var(--pad);
  position:relative; overflow:hidden;
}
.trust::before{
  content:""; position:absolute; top:-30%; right:-10%;
  width:50vw; height:50vw; max-width:560px; max-height:560px;
  background:radial-gradient(circle,rgba(194,73,29,.22),transparent 68%);
  pointer-events:none;
}
.trust__inner{ position:relative; max-width:var(--maxw); margin:0 auto; }
.trust__head{ max-width:620px; margin-bottom:clamp(36px,5vw,60px); }
.trust__title{ font-size:clamp(1.9rem,3.8vw,3rem); color:var(--bg); }

.trust__cols{
  display:grid; grid-template-columns:1.2fr .8fr; gap:clamp(32px,5vw,64px);
  align-items:start;
}
.steps{ list-style:none; display:flex; flex-direction:column; gap:1.6rem; }
.steps li{ display:flex; gap:1.2rem; align-items:flex-start; }
.steps__n{
  font-family:"Fraunces",serif; font-weight:600; font-size:1.2rem;
  width:48px; height:48px; flex:none;
  display:grid; place-items:center;
  border:1.5px solid rgba(243,217,162,.4);
  color:#F3D9A2; border-radius:14px;
}
.steps h4{ color:var(--bg); font-size:1.22rem; margin-bottom:.3rem; }
.steps p{ color:#C9B79F; font-size:.96rem; }

.quote{
  background:rgba(251,246,238,.06);
  border:1px solid rgba(243,217,162,.18);
  border-radius:var(--r-lg);
  padding:clamp(26px,3vw,38px);
  backdrop-filter:blur(2px);
}
.quote__mark{ width:42px; height:42px; color:var(--accent); margin-bottom:.6rem; }
.quote__text{
  font-family:"Fraunces",serif; font-size:1.2rem; line-height:1.45;
  color:var(--bg); margin-bottom:1.4rem;
}
.quote__by{ display:flex; flex-direction:column; line-height:1.3; }
.quote__by b{ color:var(--bg); }
.quote__by span{ color:#C9B79F; font-size:.85rem; }
.quote__stars{ display:flex; gap:.2rem; margin-top:.9rem; }
.quote__stars svg{ width:18px; height:18px; color:#F3D9A2; }

.trust__stats{
  list-style:none;
  display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem;
  margin-top:clamp(44px,6vw,72px);
  padding-top:clamp(36px,4vw,52px);
  border-top:1px solid rgba(243,217,162,.18);
}
.trust__stats li{ display:flex; flex-direction:column; }
.trust__stats b{
  font-family:"Fraunces",serif; font-weight:600; font-size:clamp(1.6rem,2.6vw,2.2rem);
  color:#F3D9A2; line-height:1;
}
.trust__stats span{ color:#C9B79F; font-size:.85rem; margin-top:.5rem; }

/* ============================================================
   PLACE
   ============================================================ */
.place{ padding:clamp(64px,11vh,128px) var(--pad); }
.place__grid{
  max-width:var(--maxw); margin:0 auto;
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(36px,6vw,72px);
  align-items:center;
}
.place__title{ font-size:clamp(1.9rem,3.6vw,2.8rem); margin-bottom:1.2rem; }
.place__lead{ color:var(--muted); margin-bottom:2rem; }
.place__rows{ display:flex; flex-direction:column; gap:1.3rem; }
.place__row{ display:flex; gap:1rem; align-items:flex-start; }
.place__ic{
  width:44px; height:44px; flex:none;
  display:grid; place-items:center;
  background:var(--surface); border:1px solid var(--line);
  border-radius:14px; color:var(--accent);
}
.place__ic svg{ width:22px; height:22px; }
.place__row b{ font-weight:600; display:block; margin-bottom:.15rem; }
.place__row p{ color:var(--muted); font-size:.94rem; }

.place__map{ position:relative; }
.mapcard{
  position:relative;
  border:1px solid var(--line); border-radius:var(--r-lg);
  overflow:hidden; box-shadow:var(--shadow);
}
.mapcard svg{ width:100%; height:auto; }
.mapcard__tag{
  position:absolute; left:18px; bottom:18px;
  background:var(--bg); color:var(--accent-ink);
  font-size:.8rem; font-weight:600;
  padding:.45rem .9rem; border-radius:999px;
  border:1px solid var(--line);
  box-shadow:var(--shadow-soft);
}

/* ============================================================
   COTIZA
   ============================================================ */
.cotiza{
  background:var(--surface);
  padding:clamp(64px,11vh,128px) var(--pad);
}
.cotiza__inner{
  max-width:var(--maxw); margin:0 auto;
  display:grid; grid-template-columns:1fr 1.05fr; gap:clamp(36px,6vw,72px);
  align-items:start;
}
.cotiza__title{ font-size:clamp(1.9rem,3.6vw,2.8rem); margin-bottom:1.1rem; }
.cotiza__lead{ color:var(--muted); margin-bottom:1.8rem; }
.cotiza__wsp{ box-shadow:0 14px 30px -18px rgba(37,211,102,.8); }

.form{
  background:var(--bg);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  padding:clamp(24px,3vw,40px);
  box-shadow:var(--shadow);
  display:flex; flex-direction:column; gap:1rem;
}
.form__row{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.field{ display:flex; flex-direction:column; gap:.4rem; }
.field span{ font-size:.85rem; font-weight:600; color:var(--fg); }
.field input,.field select,.field textarea{
  font-family:inherit; font-size:.96rem; color:var(--fg);
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:12px;
  padding:.78rem .95rem;
  transition:border-color .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease);
  width:100%;
}
.field textarea{ resize:vertical; min-height:90px; }
.field input::placeholder,.field textarea::placeholder{ color:#6E5E48; }
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none; border-color:var(--accent);
  background:var(--bg);
  box-shadow:0 0 0 3px rgba(194,73,29,.14);
}
.form__submit{ justify-content:center; margin-top:.4rem; }
.form__msg{
  font-size:.92rem; font-weight:600; min-height:1px;
}
.form__msg.is-ok{ color:var(--accent-ink); }
.form__msg.is-err{ color:#9E3A16; }
.form__demo{ font-size:.78rem; color:var(--muted); text-align:center; }

/* ============================================================
   DIGITAL BEE CTA
   ============================================================ */
.dbcta{
  padding:clamp(64px,10vh,120px) var(--pad);
  background:
    radial-gradient(60% 80% at 50% 0%, rgba(194,73,29,.12), transparent 70%),
    var(--bg);
}
.dbcta__inner{
  max-width:740px; margin:0 auto; text-align:center;
  background:var(--fg); color:var(--bg);
  border-radius:var(--r-lg);
  padding:clamp(40px,6vw,72px) clamp(28px,5vw,60px);
  box-shadow:var(--shadow);
  position:relative; overflow:hidden;
}
.dbcta__inner::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(40% 60% at 80% 10%, rgba(243,217,162,.18), transparent 70%);
  pointer-events:none;
}
.dbcta__kick{
  position:relative;
  font-size:.78rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:#F3D9A2; margin-bottom:1rem;
}
.dbcta__title{ position:relative; font-size:clamp(2rem,4vw,3rem); color:var(--bg); margin-bottom:1rem; }
.dbcta__text{ position:relative; color:#D6C4AE; max-width:48ch; margin:0 auto 2rem; }
.dbcta__btn{ position:relative; }

/* ============================================================
   FOOTER
   ============================================================ */
.foot{
  background:var(--surface);
  border-top:1px solid var(--line);
  padding:clamp(48px,7vw,80px) var(--pad) 28px;
}
.foot__grid{
  max-width:var(--maxw); margin:0 auto;
  display:grid; grid-template-columns:1.6fr 1fr 1.4fr; gap:clamp(28px,5vw,60px);
}
.foot__brand .nav__word{ font-size:1.3rem; }
.foot__brand .nav__mark{ display:inline-block; width:26px; height:26px; vertical-align:middle; margin-right:.4rem; color:var(--accent); }
.foot__brand p{ color:var(--muted); font-size:.92rem; margin-top:.9rem; max-width:30ch; }
.foot__col h5{
  font-family:"Plus Jakarta Sans",sans-serif; font-weight:600;
  font-size:.82rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--accent-ink); margin-bottom:1rem;
}
.foot__col a,.foot__col span{
  display:block; color:var(--muted); font-size:.94rem; margin-bottom:.6rem;
  transition:color .25s var(--ease);
}
.foot__col a:hover{ color:var(--accent-ink); }
.foot__bar{
  max-width:var(--maxw); margin:clamp(36px,5vw,56px) auto 0;
  padding-top:22px; border-top:1px solid var(--line);
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:.6rem;
  font-size:.82rem; color:var(--muted);
}

/* ============================================================
   WHATSAPP FLOAT
   ============================================================ */
.wsp{
  position:fixed; right:20px; bottom:20px; z-index:90;
  width:58px; height:58px; border-radius:50%;
  background:var(--wsp); color:#fff;
  display:grid; place-items:center;
  box-shadow:0 12px 30px -8px rgba(37,211,102,.6);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.wsp svg{ width:30px; height:30px; }
.wsp::after{
  content:""; position:absolute; inset:0; border-radius:50%;
  box-shadow:0 0 0 0 rgba(37,211,102,.5);
  animation:pulse 2.6s var(--ease) infinite;
}
.wsp:hover{ transform:scale(1.08); box-shadow:0 16px 36px -8px rgba(37,211,102,.75); }

/* ============================================================
   REVEALS (FOUC-safe: solo bajo js-on)
   ============================================================ */
.js-on .reveal{
  opacity:0; transform:translateY(26px);
  transition:opacity .7s var(--ease), transform .7s var(--ease);
  will-change:opacity,transform;
}
.js-on .reveal.is-in{ opacity:1; transform:none; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:980px){
  .hero__wrap{ grid-template-columns:1fr; }
  .hero__panel{ order:-1; }
  .lighthouse{ width:min(240px,60%); }
  .about__grid,.place__grid,.cotiza__cols{ grid-template-columns:1fr; }
  .services__grid{ grid-template-columns:repeat(2,1fr); }
  .trust__cols{ grid-template-columns:1fr; }
  .trust__stats{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:768px){
  .nav__links{
    position:fixed; inset:calc(var(--demobar-h) + 64px) 12px auto 12px;
    flex-direction:column; align-items:stretch; gap:.4rem;
    background:var(--bg); border:1px solid var(--line);
    border-radius:var(--r); padding:1rem;
    box-shadow:var(--shadow);
    transform:translateY(-12px); opacity:0; pointer-events:none;
    transition:opacity .3s var(--ease), transform .3s var(--ease);
  }
  .nav__links.is-open{ transform:none; opacity:1; pointer-events:auto; }
  .nav__links a{ padding:.6rem .4rem; }
  .nav__cta{ text-align:center; }
  .nav__burger{ display:flex; }

  .about__grid,.place__grid,.cotiza__inner{ grid-template-columns:1fr; }
  .form__row{ grid-template-columns:1fr; }
  .foot__grid{ grid-template-columns:1fr; }
  .foot__bar{ flex-direction:column; }
  .about__badge{ position:static; margin-top:1.2rem; display:inline-flex; }
}
@media (max-width:540px){
  .services__grid{ grid-template-columns:1fr; }
  .trust__stats{ grid-template-columns:1fr 1fr; }
  .hero__facts{ gap:1.2rem 1.8rem; }
}

/* ============================================================
   REDUCED MOTION
   ============================================================ */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  .js-on .reveal{ opacity:1 !important; transform:none !important; }
  .hero__beam,.marquee__track{ animation:none !important; }
}
