/* =========================================================
   PLANZ MARKETING — stylesheet
   Tipografía: Archivo (grotesk bold, como el "zeta" del logo)
               + Instrument Serif Italic (como el "plan" del logo)
   Paleta: verde de marca #4ba632 sobre fondo oscuro
   ========================================================= */

:root{
  --bg: #0b0f0a;
  --bg-alt: #10140d;
  --surface: #171b13;
  --surface-2: #1e2318;
  --border: #2a2f22;
  --text: #f5f6f0;
  --muted: #a8ac9d;
  --green: #4ba632;
  --green-light: #86d65f;
  --green-dark: #2f6b1e;
  --cream: #f3efe2;
  --cream-2: #e9e3cf;
  --ink: #14170f;
  --radius: 18px;
  --radius-sm: 10px;
  --maxw: 1240px;
  --shadow: 0 20px 50px -20px rgba(0,0,0,.6);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--bg);
  color:var(--text);
  font-family:'Archivo',system-ui,sans-serif;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,video{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
.container{max-width:var(--maxw);margin:0 auto;padding:0 28px}
.accent{
  font-family:'Instrument Serif',Georgia,serif;
  font-style:italic;
  color:var(--green-light);
  font-weight:400;
  text-shadow:0 0 28px rgba(134,214,95,.55);
}
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:12.5px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--green-light);
}
.eyebrow::before{
  content:"";
  width:7px;height:7px;border-radius:50%;
  background:var(--green);
  box-shadow:0 0 0 4px rgba(75,166,50,.25);
}
.section{padding:120px 0}
.section-head{max-width:680px;margin-bottom:56px}
.section-head h2{font-size:clamp(28px,4vw,44px);font-weight:800;line-height:1.15;letter-spacing:-.01em}
.section-head p{margin-top:14px;color:var(--muted);font-size:17px}
.placeholder{
  color:var(--green-light);
  font-weight:700;
  border-bottom:1.5px dashed rgba(134,214,95,.5);
  cursor:help;
}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:15px 26px;
  border-radius:999px;
  font-weight:700;
  font-size:14.5px;
  letter-spacing:.01em;
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
  white-space:nowrap;
}
.btn-primary{
  background:var(--green);
  color:#0b0f0a;
  box-shadow:0 10px 30px -8px rgba(75,166,50,.55), 0 0 0 0 rgba(134,214,95,.6);
  animation:btn-pulse 2.6s ease-in-out infinite;
}
.btn-primary:hover{transform:translateY(-2px) scale(1.03);background:var(--green-light);animation-play-state:paused}
@keyframes btn-pulse{
  0%,100%{box-shadow:0 10px 30px -8px rgba(75,166,50,.55), 0 0 0 0 rgba(134,214,95,.35)}
  50%{box-shadow:0 10px 34px -6px rgba(75,166,50,.7), 0 0 0 8px rgba(134,214,95,0)}
}
.btn-ghost{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);
  color:var(--text);
}
.btn-ghost:hover{background:rgba(255,255,255,.12)}
.btn svg{width:16px;height:16px}

/* ---------- header ---------- */
header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  padding:14px 0;
  transition:background .3s ease, padding .3s ease, border-color .3s ease;
  border-bottom:1px solid transparent;
}
header.scrolled{
  background:rgba(11,15,10,.86);
  backdrop-filter:blur(14px);
  padding:10px 0;
  border-bottom-color:var(--border);
}
header .container{display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:10px}
.brand img{height:52px;width:auto;transition:height .3s ease}
header.scrolled .brand img{height:42px}
.brand span{font-weight:800;font-size:15px;letter-spacing:.02em}
nav.main-nav{display:flex;align-items:center;gap:6px}
nav.main-nav a{
  padding:9px 14px;border-radius:999px;font-size:14px;font-weight:600;color:var(--muted);
  transition:color .2s, background .2s;
}
nav.main-nav a:hover{color:var(--text);background:rgba(255,255,255,.06)}
.header-actions{display:flex;align-items:center;gap:10px}
.menu-toggle{display:none;width:40px;height:40px;border-radius:10px;background:rgba(255,255,255,.06);align-items:center;justify-content:center}
.menu-toggle span,.menu-toggle span::before,.menu-toggle span::after{
  content:"";display:block;width:18px;height:2px;background:var(--text);position:relative;transition:.2s;
}
.menu-toggle span::before{position:absolute;top:-6px}
.menu-toggle span::after{position:absolute;top:6px}

/* ---------- scroll progress bar ---------- */
.scroll-progress{
  position:fixed;top:0;left:0;height:3px;width:0%;
  background:linear-gradient(90deg,var(--green),var(--green-light));
  z-index:200;
  box-shadow:0 0 12px rgba(134,214,95,.8);
  transition:width .08s linear;
}

/* ---------- hero ---------- */
.hero{
  position:relative;
  min-height:100vh;
  display:flex;
  align-items:center;
  padding-top:120px;
  padding-bottom:70px;
  overflow:hidden;
  background:var(--bg);
}

/* mosaico de fondo: filas horizontales de miniaturas + cifras, cada fila en una dirección */
.hero-grid{
  position:absolute;inset:0;
  overflow:hidden;
  filter:saturate(.8) brightness(.62);
  display:flex;
  flex-direction:column;
  gap:7px;
  padding:7px;
}
.hero-row{
  flex:1;
  overflow:hidden;
  min-height:0;
}
.hero-row-track{
  display:flex;
  gap:7px;
  height:100%;
  width:max-content;
  will-change:transform;
}
.hero-row.left .hero-row-track{animation:rowLeft 26s linear infinite}
.hero-row.right .hero-row-track{animation:rowRight 26s linear infinite}
@keyframes rowLeft{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}
@keyframes rowRight{
  from{transform:translateX(-50%)}
  to{transform:translateX(0)}
}
.cell{
  height:100%;
  aspect-ratio:3/4;
  flex:none;
  border-radius:8px;
  overflow:hidden;
  position:relative;
}
.img-tile{background-size:cover;background-position:center}
.stat-tile{
  display:flex;align-items:center;justify-content:center;
  font-family:'Inter',system-ui,sans-serif;
  font-weight:800;
  font-variant-numeric:tabular-nums;
  font-size:clamp(18px,2.4vw,30px);
  letter-spacing:-.01em;
}
.stat-tile.a{background:var(--green);color:#0b0f0a}
.stat-tile.b{background:#0e2e0a;color:var(--green-light)}
.stat-tile.c{background:#1c2417;color:#e8f2df}

/* floating glow blobs */
.glow-blob{
  position:absolute;
  border-radius:50%;
  filter:blur(70px);
  opacity:.55;
  pointer-events:none;
  z-index:1;
  animation:drift 16s ease-in-out infinite;
}
.glow-blob.g1{width:520px;height:520px;background:radial-gradient(circle,var(--green) 0%,transparent 70%);top:-160px;left:-120px;animation-duration:18s}
.glow-blob.g2{width:420px;height:420px;background:radial-gradient(circle,var(--green-light) 0%,transparent 70%);bottom:-140px;right:-100px;animation-duration:14s;animation-delay:-4s}
.glow-blob.g3{width:340px;height:340px;background:radial-gradient(circle,var(--green) 0%,transparent 70%);top:38%;left:46%;animation-duration:20s;animation-delay:-8s;opacity:.35}
@keyframes drift{
  0%,100%{transform:translate(0,0) scale(1)}
  33%{transform:translate(30px,-24px) scale(1.08)}
  66%{transform:translate(-24px,20px) scale(.96)}
}

.hero-scrim{
  position:absolute;inset:0;
  z-index:1;
  background:
    radial-gradient(ellipse 70% 55% at 50% 42%, rgba(11,15,10,.55) 0%, rgba(11,15,10,.88) 62%, rgba(11,15,10,.97) 100%),
    linear-gradient(180deg, rgba(11,15,10,.55) 0%, rgba(11,15,10,.4) 30%, rgba(11,15,10,.9) 100%);
}
.hero-content{position:relative;z-index:2;width:100%;text-align:center}
.hero-tag{
  display:inline-flex;align-items:center;gap:8px;margin-bottom:26px;padding:9px 18px;border-radius:999px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);
  font-size:12.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  backdrop-filter:blur(6px);
}
.hero-tag-btn{
  color:var(--text);
  cursor:pointer;
  position:relative;
  animation:tagGlow 2.4s ease-in-out infinite;
  transition:transform .25s ease, background .25s ease, border-color .25s ease;
}
.hero-tag-btn:hover{
  transform:translateY(-2px) scale(1.03);
  background:rgba(75,166,50,.14);
  border-color:rgba(134,214,95,.55);
}
.hero-tag-btn svg{color:var(--green-light)}
.hero-tag-dot{
  width:7px;height:7px;border-radius:50%;
  background:var(--green);
  box-shadow:0 0 0 0 rgba(134,214,95,.7);
  animation:dotPulse 2.4s ease-in-out infinite;
}
@keyframes tagGlow{
  0%,100%{box-shadow:0 0 0 0 rgba(75,166,50,0), 0 0 18px 0 rgba(75,166,50,.15)}
  50%{box-shadow:0 0 0 4px rgba(75,166,50,.12), 0 0 32px 4px rgba(134,214,95,.45)}
}
@keyframes dotPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(134,214,95,.6)}
  50%{box-shadow:0 0 0 6px rgba(134,214,95,0)}
}
.hero h1{
  font-size:clamp(42px,7.4vw,96px);
  font-weight:800;
  line-height:1.02;
  letter-spacing:-.02em;
}
.hero h1 em{
  font-family:'Instrument Serif',Georgia,serif;
  font-style:italic;
  font-weight:400;
  color:var(--green-light);
  display:inline-block;
  text-shadow:0 0 40px rgba(134,214,95,.6), 0 0 80px rgba(134,214,95,.25);
}
.hero .lede{
  max-width:560px;margin:26px auto 38px;
  color:#d7dacf;font-size:17px;
}
.hero-ctas{display:flex;justify-content:center;gap:14px;flex-wrap:wrap}
.hero-stats{
  position:relative;z-index:2;
  margin-top:70px;
  display:flex;flex-wrap:wrap;justify-content:center;gap:10px;
}
.hero-stats .stat{
  display:flex;align-items:baseline;gap:8px;
  padding:12px 20px;
  border-radius:999px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.1);
  backdrop-filter:blur(6px);
  font-size:13.5px;
}
.hero-stats .stat b{font-size:15px;color:var(--green-light);font-weight:800}
.hero-stats .stat span{color:var(--muted);letter-spacing:.04em;text-transform:uppercase;font-weight:600;font-size:11.5px}

/* ---------- marquee / logos ---------- */
.logos-band{padding:8px 0 56px;border-bottom:1px solid var(--border);background:transparent;overflow:hidden}
.logos-band .label{text-align:center;color:var(--muted);font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin-bottom:36px}
.marquee{
  width:100%;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%);
}
.marquee-track{
  display:flex;
  align-items:center;
  gap:64px;
  width:max-content;
  animation:marquee 22s linear infinite;
}
.marquee:hover .marquee-track{animation-play-state:paused}
@keyframes marquee{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}
.logo-chip{display:flex;flex-direction:column;align-items:center;gap:10px;opacity:.85;transition:opacity .2s, transform .2s;flex:none}
.logo-chip:hover{opacity:1;transform:translateY(-2px) scale(1.04)}
.logo-chip img{height:64px;width:64px;object-fit:contain;border-radius:50%;background:transparent;filter:drop-shadow(0 4px 10px rgba(0,0,0,.4))}
.logo-chip.square img{border-radius:0;object-fit:contain}
.logo-chip span{font-size:12.5px;color:var(--muted);font-weight:600;white-space:nowrap}
.logo-chip.text-logo{height:64px;justify-content:center}
.logo-chip.text-logo .wordmark{
  font-size:20px;
  color:#dfe4d6;
  white-space:nowrap;
  filter:drop-shadow(0 4px 10px rgba(0,0,0,.4));
}
.brand-mark{display:flex;align-items:center;gap:8px}
.brand-mark svg{flex:none;filter:drop-shadow(0 2px 6px rgba(0,0,0,.35))}

/* ---------- servicios ---------- */
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.service-card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:36px 30px;
  transition:transform .3s ease, border-color .3s ease, box-shadow .3s ease;
}
.service-card:hover{transform:translateY(-8px) scale(1.015);border-color:var(--green-dark);box-shadow:0 0 40px -10px rgba(75,166,50,.4)}
.service-icon{
  width:56px;height:56px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle,rgba(75,166,50,.22),rgba(75,166,50,.05));
  border:1px solid rgba(75,166,50,.35);
  margin-bottom:22px;
  transition:transform .3s ease, box-shadow .3s ease;
}
.service-card:hover .service-icon{transform:scale(1.1) rotate(-6deg);box-shadow:0 0 24px rgba(75,166,50,.5)}
.service-icon svg{width:24px;height:24px;stroke:var(--green-light)}
.service-card h3{font-size:20px;font-weight:800;margin-bottom:6px}
.service-card .rule{width:34px;height:2px;background:var(--green);margin:14px 0}
.service-card p{color:var(--muted);font-size:15px}

/* ---------- casos ---------- */
.case{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:64px;
  align-items:center;
  padding:70px 0;
  border-bottom:1px solid var(--border);
}
.case:last-child{border-bottom:none}
.case.reverse{direction:rtl}
.case.reverse > *{direction:ltr}
.case-media{
  position:relative;
  display:grid;
  grid-template-columns:1.35fr 1fr;
  gap:14px;
  align-items:end;
}
.tile{
  position:relative;
  border-radius:var(--radius);
  overflow:hidden;
  background:var(--surface);
  border:1px solid var(--border);
  box-shadow:var(--shadow);
  aspect-ratio:9/16;
  transition:transform .4s ease, box-shadow .4s ease;
}
.tile:hover{
  transform:translateY(-6px) scale(1.015);
  box-shadow:var(--shadow), 0 0 0 1px rgba(134,214,95,.5), 0 0 40px rgba(75,166,50,.35);
}
.tile.small{aspect-ratio:9/16;transform:translateY(28px)}
.tile.small:hover{transform:translateY(22px) scale(1.03)}
.tile img,.tile video{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.tile:hover img,.tile:hover video{transform:scale(1.05)}
.tile .play{
  position:absolute;inset:0;margin:auto;width:52px;height:52px;border-radius:50%;
  background:rgba(11,15,10,.55);backdrop-filter:blur(3px);
  display:flex;align-items:center;justify-content:center;
  border:1px solid rgba(255,255,255,.35);
  opacity:0;transition:opacity .2s;
}
.tile:hover .play{opacity:1}
.tile .play svg{width:18px;height:18px;fill:#fff;margin-left:2px}
.tile .badge{
  position:absolute;top:12px;left:12px;
  padding:5px 10px;border-radius:999px;
  background:rgba(11,15,10,.65);backdrop-filter:blur(4px);
  font-size:11px;font-weight:700;letter-spacing:.04em;color:var(--green-light);
  border:1px solid rgba(255,255,255,.15);
}
.case-body .kicker{color:var(--muted);font-size:12.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px}
.case-body .kicker b{color:var(--green-light)}
.case-body h3{font-size:clamp(26px,3.2vw,38px);font-weight:800;margin-bottom:16px;letter-spacing:-.01em}
.case-body p.desc{color:var(--muted);font-size:16px;margin-bottom:28px;max-width:480px}
.case-stats{display:flex;gap:34px;padding-top:26px;border-top:1px solid var(--border);flex-wrap:wrap}
.case-stats .s b{display:block;font-size:26px;font-weight:800;color:var(--green-light)}
.case-stats .s span{font-size:11.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-weight:700}

/* ---------- más casos en marcha ---------- */
.more-cases-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:24px;
  max-width:720px;
}
.mini-case{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:16px;transition:transform .25s ease, border-color .25s ease}
.mini-case:hover{transform:translateY(-4px);border-color:var(--green-dark)}
.mini-case-img{border-radius:10px;overflow:hidden;aspect-ratio:16/10;margin-bottom:16px;background:var(--surface-2)}
.mini-case-img img{width:100%;height:100%;object-fit:cover}
.mini-label{color:var(--green-light);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:8px}
.mini-case h4{font-size:18px;font-weight:800;margin-bottom:10px}
.mini-case p.desc{color:var(--muted);font-size:14px}

/* ---------- método ---------- */
.method{background:var(--cream);color:var(--ink)}
.method .eyebrow{color:var(--green-dark)}
.method .eyebrow::before{background:var(--green-dark);box-shadow:0 0 0 4px rgba(47,107,30,.18)}
.method h2{
  font-size:clamp(24px,3.4vw,38px);
  font-weight:800;
  line-height:1.25;
  letter-spacing:-.01em;
  max-width:720px;
  color:var(--ink);
}
.method h2 em{
  font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-weight:400;color:var(--green-dark);
}
.method-grid{
  margin-top:44px;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
}
.method-card{
  background:#fff;
  border-radius:14px;
  padding:24px 20px;
  box-shadow:0 2px 14px rgba(30,35,20,.05);
  transition:transform .25s ease, box-shadow .25s ease;
}
.method-card:hover{transform:translateY(-4px);box-shadow:0 10px 24px rgba(30,35,20,.09)}
.method-card .icon{
  width:38px;height:38px;border-radius:10px;
  background:#eef1e6;
  display:flex;align-items:center;justify-content:center;
  color:var(--green-dark);
  margin-bottom:16px;
}
.method-card .icon svg{width:19px;height:19px}
.method-card h4{font-size:15.5px;font-weight:800;margin-bottom:8px;color:var(--ink)}
.method-card p{font-size:13.5px;color:#6b7062;line-height:1.5}

/* ---------- faq ---------- */
.faq-list{max-width:760px}
.faq-item{border-bottom:1px solid var(--border)}
.faq-q{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:26px 4px;text-align:left;font-size:17px;font-weight:700;
}
.faq-q .plus{
  flex:none;width:30px;height:30px;border-radius:50%;border:1px solid var(--border);
  display:flex;align-items:center;justify-content:center;position:relative;transition:transform .25s;
}
.faq-q .plus::before,.faq-q .plus::after{content:"";position:absolute;background:var(--green-light)}
.faq-q .plus::before{width:12px;height:2px}
.faq-q .plus::after{width:2px;height:12px}
.faq-item.open .faq-q .plus{transform:rotate(45deg);background:var(--green);border-color:var(--green)}
.faq-item.open .faq-q .plus::before,.faq-item.open .faq-q .plus::after{background:#0b0f0a}
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease}
.faq-a p{padding:0 4px 26px;color:var(--muted);font-size:15.5px;max-width:640px}

/* ---------- contacto ---------- */
.contact{
  background:linear-gradient(180deg,var(--bg) 0%, #0e1309 100%);
  text-align:center;
}
.contact .eyebrow{justify-content:center;width:100%}
.contact h2{font-size:clamp(30px,5vw,52px);font-weight:800;margin:18px auto 16px;letter-spacing:-.01em}
.contact .lede{color:var(--muted);max-width:520px;margin:0 auto 40px;font-size:16px}
.contact-toggle{display:inline-flex;padding:6px;border-radius:999px;background:var(--surface);border:1px solid var(--border);margin-bottom:44px;gap:4px}
.contact-toggle button{padding:11px 22px;border-radius:999px;font-weight:700;font-size:14px;color:var(--muted)}
.contact-toggle button.active{background:var(--green);color:#0b0f0a}
.contact-panel{max-width:720px;margin:0 auto;text-align:left;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;transition:max-width .3s ease}
.contact-panel.wide{max-width:960px}
#my-cal-inline{height:600px;overflow:auto}
@media (max-width:640px){#my-cal-inline{height:520px}}
.cal-embed{
  min-height:480px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:14px;
  padding:50px 30px;color:var(--muted);text-align:center;
}
.cal-embed svg{width:38px;height:38px;stroke:var(--green-light)}
.cal-embed code{background:var(--surface-2);padding:3px 8px;border-radius:6px;font-size:13px;color:var(--green-light)}
#cal-booking{min-height:480px;width:100%}
.contact-form{padding:36px}
.contact-form .row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
.contact-form label{display:block;font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.contact-form input,.contact-form textarea{
  width:100%;padding:13px 14px;border-radius:10px;background:var(--bg);
  border:1px solid var(--border);color:var(--text);font-family:inherit;font-size:14.5px;
}
.contact-form input:focus,.contact-form textarea:focus{outline:none;border-color:var(--green)}
.contact-form textarea{min-height:120px;resize:vertical}
.contact-form .full{margin-bottom:16px}
.contact-form button{width:100%;margin-top:6px;justify-content:center}
.form-note{font-size:12.5px;color:var(--muted);margin-top:14px;text-align:center}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--border);padding:56px 0 30px;background:var(--bg-alt)}
.footer-top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:40px;margin-bottom:44px}
.footer-brand .brand{margin-bottom:14px}
.footer-brand p{color:var(--muted);font-size:14px;max-width:280px}
.footer-cols{display:flex;gap:64px;flex-wrap:wrap}
.footer-col h5{font-size:12.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:16px}
.footer-col a{display:block;padding:6px 0;font-size:14.5px;color:#d7dacf}
.footer-col a:hover{color:var(--green-light)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;padding-top:26px;border-top:1px solid var(--border);color:var(--muted);font-size:13px}
.footer-social{display:flex;gap:10px}
.footer-social a{width:38px;height:38px;border-radius:50%;border:1px solid var(--border);display:flex;align-items:center;justify-content:center}
.footer-social a:hover{border-color:var(--green)}
.footer-social svg{width:16px;height:16px}

/* ---------- modal vídeo demo ---------- */
.video-modal{
  position:fixed;inset:0;z-index:300;
  display:flex;align-items:center;justify-content:center;
  padding:24px;
  opacity:0;visibility:hidden;
  transition:opacity .3s ease, visibility .3s ease;
}
.video-modal.open{opacity:1;visibility:visible}
.video-modal-backdrop{
  position:absolute;inset:0;
  background:rgba(5,7,4,.86);
  backdrop-filter:blur(6px);
}
.video-modal-panel{
  position:relative;
  width:100%;max-width:960px;
  background:#000;
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 30px 80px -20px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.08);
  transform:scale(.94);
  transition:transform .3s ease;
}
.video-modal.open .video-modal-panel{transform:scale(1)}
.video-modal-panel video{width:100%;max-height:80vh;display:block;background:#000}
.video-modal-close{
  position:absolute;top:12px;right:12px;z-index:2;
  width:38px;height:38px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:rgba(11,15,10,.6);border:1px solid rgba(255,255,255,.2);
  color:#fff;backdrop-filter:blur(4px);
  transition:background .2s ease, transform .2s ease;
}
.video-modal-close:hover{background:rgba(75,166,50,.7);transform:scale(1.06)}

/* ---------- reveal animation ---------- */
[data-reveal]{opacity:0;transform:translateY(24px);transition:opacity .7s ease, transform .7s ease}
[data-reveal].in{opacity:1;transform:none}

/* ---------- responsive ---------- */
@media (max-width:980px){
  nav.main-nav{display:none}
  .menu-toggle{display:flex}
  .services-grid{grid-template-columns:1fr}
  .case{grid-template-columns:1fr;gap:36px}
  .case.reverse{direction:ltr}
  .case-media{max-width:420px;margin:0 auto}
  .method-grid{grid-template-columns:repeat(2,1fr)}
  .more-cases-grid{grid-template-columns:1fr}
  .footer-top{flex-direction:column}
}
@media (max-width:600px){
  .section{padding:80px 0}
  .contact-form .row{grid-template-columns:1fr}
  .method-grid{grid-template-columns:1fr}
  .hero-stats{gap:8px}
  .hero-stats .stat{padding:10px 14px}
  .logos-row{gap:26px}
}

/* mobile nav drawer */
.mobile-nav{
  position:fixed;inset:0;z-index:99;
  background:var(--bg);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;
  transform:translateY(-100%);transition:transform .35s ease;
}
.mobile-nav.open{transform:translateY(0)}
.mobile-nav a{font-size:24px;font-weight:800}
.mobile-nav .btn{margin-top:16px}

/* ---------- chatbot widget ---------- */
:root{
  --lilac: #a78bfa;
  --lilac-light: #cbb8ff;
  --lilac-dark: #7c5cf0;
}
.pz-chat-widget{position:fixed;right:22px;bottom:22px;z-index:240;display:flex;flex-direction:column;align-items:flex-end;gap:12px}

.pz-fab{
  position:relative;width:66px;height:66px;border-radius:50%;
  background:linear-gradient(155deg,var(--lilac-light),var(--lilac-dark));
  border:1px solid rgba(255,255,255,.25);
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  box-shadow:0 10px 30px rgba(124,92,240,.45);
}
.pz-fab-glow{
  position:absolute;inset:-14px;border-radius:50%;
  background:radial-gradient(circle,rgba(167,139,250,.55),rgba(167,139,250,0) 70%);
  animation:pzGlowPulse 2.6s ease-in-out infinite;
  z-index:-1;
}
@keyframes pzGlowPulse{
  0%,100%{transform:scale(.9);opacity:.75}
  50%{transform:scale(1.25);opacity:1}
}
.pz-mascot{width:38px;height:38px;position:relative;animation:pzIdle 3.6s ease-in-out infinite}
@keyframes pzIdle{
  0%,100%{transform:translateY(0) rotate(0deg)}
  25%{transform:translateY(-2px) rotate(-4deg)}
  50%{transform:translateY(1px) rotate(0deg)}
  75%{transform:translateY(-2px) rotate(4deg)}
}
.pz-fab:hover .pz-mascot{animation-duration:1s}
.pz-fab .pz-eye{animation:pzBlink 4.5s ease-in-out infinite}
@keyframes pzBlink{
  0%,92%,100%{transform:scaleY(1)}
  95%{transform:scaleY(.1)}
}

.pz-bubble{
  max-width:220px;padding:11px 14px;border-radius:14px 14px 4px 14px;
  background:var(--surface);border:1px solid var(--border);
  font-size:13.5px;line-height:1.4;color:var(--text);
  box-shadow:0 8px 24px rgba(0,0,0,.35);
  opacity:0;transform:translateY(8px) scale(.96);
  transition:opacity .3s ease, transform .3s ease;
  pointer-events:none;
}
.pz-bubble.show{opacity:1;transform:translateY(0) scale(1)}

.pz-panel{
  position:absolute;bottom:80px;right:0;
  width:340px;max-width:calc(100vw - 32px);
  background:var(--surface);border:1px solid var(--border);border-radius:20px;
  box-shadow:0 24px 60px rgba(0,0,0,.5);
  display:flex;flex-direction:column;overflow:hidden;
  opacity:0;transform:translateY(16px) scale(.97);pointer-events:none;
  transition:opacity .25s ease, transform .25s ease;
}
.pz-panel.open{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}
.pz-panel-header{
  display:flex;align-items:center;gap:10px;padding:14px 14px;
  background:linear-gradient(120deg,var(--lilac-dark),var(--lilac));
  color:#fff;
}
.pz-panel-mascot{width:34px;height:34px;flex:none;border-radius:50%;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center}
.pz-panel-mascot svg{width:22px;height:22px}
.pz-panel-header strong{display:block;font-size:14.5px}
.pz-panel-header span{display:block;font-size:11.5px;opacity:.85}
.pz-panel-close{margin-left:auto;width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.16);color:#fff;font-size:18px;line-height:1;display:flex;align-items:center;justify-content:center}
.pz-panel-close:hover{background:rgba(255,255,255,.28)}
.pz-panel-messages{padding:14px;display:flex;flex-direction:column;gap:10px;height:340px;overflow-y:auto;background:var(--bg-alt)}
.pz-msg{max-width:82%;padding:9px 12px;border-radius:14px;font-size:13.5px;line-height:1.45}
.pz-msg.bot{align-self:flex-start;background:var(--surface-2);border:1px solid var(--border);border-bottom-left-radius:4px;color:var(--text)}
.pz-msg.user{align-self:flex-end;background:var(--lilac-dark);color:#fff;border-bottom-right-radius:4px}
.pz-msg.typing{display:flex;gap:4px;align-items:center;padding:11px 14px}
.pz-msg.typing span{width:6px;height:6px;border-radius:50%;background:var(--muted);animation:pzTyping 1.1s ease-in-out infinite}
.pz-msg.typing span:nth-child(2){animation-delay:.15s}
.pz-msg.typing span:nth-child(3){animation-delay:.3s}
@keyframes pzTyping{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
.pz-panel-form{display:flex;gap:8px;padding:12px;border-top:1px solid var(--border);background:var(--surface)}
.pz-panel-form input{
  flex:1;padding:11px 13px;border-radius:10px;background:var(--bg);
  border:1px solid var(--border);color:var(--text);font-family:inherit;font-size:13.5px;
}
.pz-panel-form input:focus{outline:none;border-color:var(--lilac)}
.pz-panel-form button{
  width:40px;height:40px;flex:none;border-radius:10px;
  background:var(--lilac-dark);display:flex;align-items:center;justify-content:center;color:#fff;
}
.pz-panel-form button:hover{background:var(--lilac)}
.pz-panel-form button svg{width:17px;height:17px}

@media (max-width:600px){
  .pz-chat-widget{right:14px;bottom:14px}
  .pz-panel{right:-4px;width:calc(100vw - 24px)}
  .pz-bubble{max-width:180px}
}