/* ============================================================
   style.css — Hoja de estilos compartida de empujon.es
   ------------------------------------------------------------
   Extraído tal cual del <style> que antes vivía dentro de
   index.php, para poder reutilizarlo desde varias páginas
   (index.php y, a partir de ahora, /google-business-profile/)
   sin duplicar el CSS en cada archivo.

   IMPORTANTE: las reglas originales (hasta el comentario
   "NUEVO — Página Google Business Profile") NO se han modificado
   ni una coma respecto al index.php original. Todo lo añadido
   para la nueva página está debajo de ese comentario, como
   reglas nuevas que no tocan ninguna clase existente.
   ============================================================ */

:root{
  --ink:#141414;
  --ink-soft:#666B6E;
  --cream:#FFFBF2;
  --cream-strong:#FFF3CC;
  --white:#FFFFFF;
  --orange:#FFA600;
  --orange-deep:#E8940A;
  --teal:#0F8B8D;
  --border:#ECE6D6;
  --radius:16px;
  --max:1160px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:'Plus Jakarta Sans',sans-serif;
  color:var(--ink);
  background:var(--white);
  line-height:1.6;
}
h1,h2,h3{margin:0;line-height:1.15;font-weight:800;letter-spacing:-.01em;}
a{color:inherit;text-decoration:none;}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px;}
:focus-visible{outline:3px solid var(--teal);outline-offset:3px;}
::selection{background:var(--cream-strong);}

.eyebrow{
  display:inline-block;font-size:13px;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:var(--orange-deep);margin-bottom:10px;
}

/* NAV */
header.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--border);}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 24px;max-width:var(--max);margin:0 auto;}
.nav-links{display:flex;gap:32px;align-items:center;}
.nav-links a{font-weight:600;font-size:15px;color:var(--ink);padding-bottom:4px;border-bottom:2px solid transparent;transition:border-color .15s ease, color .15s ease;}
.nav-links a:hover{color:var(--orange-deep);}
.nav-cta{background:var(--orange);color:var(--white);padding:10px 22px;border-radius:999px;font-weight:700;font-size:14px;white-space:nowrap;transition:background .15s ease, transform .15s ease;}
.nav-cta:hover{background:var(--orange-deep);transform:translateY(-1px);}
.btn-primary{
  display:inline-flex;align-items:center;gap:8px;background:var(--orange);color:var(--white);
  padding:15px 28px;border-radius:999px;font-weight:700;font-size:16px;border:none;cursor:pointer;
  transition:background .15s ease, transform .15s ease;
}
.btn-primary:hover{background:var(--orange-deep);transform:translateY(-2px);}
.btn-outline{
  display:inline-flex;align-items:center;gap:8px;background:var(--white);color:var(--ink);
  padding:14px 27px;border-radius:999px;font-weight:700;font-size:16px;border:1.5px solid var(--border);cursor:pointer;
  transition:border-color .15s ease, transform .15s ease;
}
.btn-outline:hover{border-color:var(--ink);transform:translateY(-2px);}

/* HERO */
.hero{padding:76px 0 90px;background:linear-gradient(180deg,var(--cream) 0%, var(--white) 78%);}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:52px;align-items:center;}
.hero h1{font-size:clamp(34px,4.6vw,52px);}
.hero h1 .hl{color:var(--orange);}
.hero p.lead{font-size:18px;color:var(--ink-soft);max-width:50ch;margin:20px 0 30px;}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;}
.hero-badge{
  margin-top:28px;display:inline-flex;align-items:center;gap:10px;background:var(--white);
  border:1px solid var(--border);border-radius:999px;padding:8px 16px 8px 8px;font-size:13px;font-weight:600;color:var(--ink-soft);
}
.hero-badge .dot{width:8px;height:8px;border-radius:50%;background:var(--orange);}
.hero-art{
  background:var(--white);border:1px solid var(--border);border-radius:24px;
  padding:36px;display:flex;align-items:center;justify-content:center;
  box-shadow:0 24px 60px -30px rgba(20,20,20,.18);
}
.hero-art img{width:100%;max-width:280px;height:auto;}

/* SECTIONS */
.section{padding:88px 0;}
.section-head{max-width:640px;margin:0 auto 48px;text-align:center;}
.section-head h2{font-size:clamp(28px,3.2vw,38px);}
.section-head p{color:var(--ink-soft);font-size:16px;margin-top:12px;}

/* SERVICE PILLARS (solid orange icon) */
.grid-pillars{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;}
.pillar{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);padding:28px 24px;transition:transform .18s ease, box-shadow .18s ease;}
.pillar:hover{transform:translateY(-4px);box-shadow:0 16px 34px -22px rgba(20,20,20,.22);}
.pillar .icon-sq{
  width:46px;height:46px;border-radius:12px;background:var(--orange);
  display:flex;align-items:center;justify-content:center;margin-bottom:18px;
}
.pillar .icon-sq svg{width:24px;height:24px;stroke:var(--white);}
.pillar h3{font-size:18px;margin-bottom:8px;}
.pillar p{margin:0 0 12px;color:var(--ink-soft);font-size:14.5px;}
.pillar ul{margin:0;padding-left:18px;color:var(--ink-soft);font-size:13.5px;}
.pillar ul li{margin-bottom:5px;}
.pillar ul li:last-child{margin-bottom:0;}

/* WHY US (soft cream icon) */
.why{background:var(--cream);}
.grid-why{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:22px;}
.why-card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);padding:30px 26px;text-align:center;}
.why-card .icon-soft{
  width:56px;height:56px;border-radius:14px;background:var(--cream-strong);
  display:flex;align-items:center;justify-content:center;margin:0 auto 18px;
}
.why-card .icon-soft svg{width:26px;height:26px;stroke:var(--orange-deep);}
.why-card h3{font-size:18px;margin-bottom:10px;}
.why-card p{margin:0;color:var(--ink-soft);font-size:14.5px;}

/* PROCESS */
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;}
.step{position:relative;padding-top:6px;}
.step-num{
  width:34px;height:34px;border-radius:50%;background:var(--ink);color:var(--white);
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:14px;margin-bottom:16px;
}
.step h3{font-size:16.5px;margin-bottom:6px;}
.step p{margin:0;color:var(--ink-soft);font-size:13.5px;}

/* TRABAJOS Y COLABORACIONES */
.grid-trabajos{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:22px;}
.trabajo-card{
  background:var(--white);border:1px solid var(--border);border-radius:var(--radius);
  overflow:hidden;transition:transform .18s ease, box-shadow .18s ease;
}
.trabajo-card:hover{transform:translateY(-4px);box-shadow:0 16px 34px -22px rgba(20,20,20,.22);}
.trabajo-foto{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;background:var(--cream);}
.trabajo-info{padding:18px 20px;}
.trabajo-info h3{font-size:16.5px;margin-bottom:6px;}
.trabajo-info p{margin:0;color:var(--ink-soft);font-size:14px;}

/* Placeholder "próximamente" mientras no hay fotos reales subidas */
.trabajo-card.proximamente{
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  aspect-ratio:4/3;border:1.5px dashed var(--border);background:var(--cream);gap:10px;padding:20px;
}
.trabajo-card.proximamente svg{width:30px;height:30px;stroke:var(--orange-deep);}
.trabajo-card.proximamente span{font-size:13.5px;color:var(--ink-soft);font-weight:600;}

/* ABOUT */
.about{background:var(--white);}
.about-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:center;}
.about-copy p{color:var(--ink-soft);font-size:15.5px;margin-bottom:16px;}
.stat-chip{
  display:inline-flex;align-items:baseline;gap:8px;background:var(--cream);
  border:1px solid var(--border);border-radius:14px;padding:14px 20px;margin-top:8px;
}
.stat-chip .num{font-size:26px;font-weight:800;color:var(--orange-deep);}
.stat-chip .label{font-size:13.5px;color:var(--ink-soft);font-weight:600;}
.grid-values{display:grid;grid-template-columns:1fr;gap:16px;}
.value-card{background:var(--cream);border:1px solid var(--border);border-radius:var(--radius);padding:22px 24px;}
.value-card h3{font-size:16.5px;margin-bottom:6px;}
.value-card p{margin:0;color:var(--ink-soft);font-size:14.5px;}

/* CTA BANNER */
.cta-banner{
  background:var(--cream-strong);border-radius:24px;padding:56px 40px;text-align:center;
}
.cta-banner h2{font-size:clamp(24px,3vw,32px);margin-bottom:12px;}
.cta-banner p{color:var(--ink-soft);font-size:16px;margin-bottom:26px;}

/* CONTACT */
.contact{background:var(--cream);}
.contact-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:start;}
form{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);padding:32px;}
.field{margin-bottom:18px;}
label{display:block;font-size:13px;font-weight:700;margin-bottom:7px;color:var(--ink);}
input[type=text],input[type=email],input[type=tel],textarea{
  width:100%;padding:12px 14px;border-radius:10px;border:1.5px solid var(--border);
  font-family:'Plus Jakarta Sans',sans-serif;font-size:15px;background:var(--white);color:var(--ink);
}
textarea{resize:vertical;min-height:96px;}
input:focus,textarea:focus{border-color:var(--orange);outline:none;box-shadow:0 0 0 3px rgba(255,166,0,.15);}
.checkline{display:flex;align-items:flex-start;gap:10px;font-size:13px;color:var(--ink-soft);margin-bottom:22px;}
.checkline input{margin-top:3px;}
.submit-btn{width:100%;justify-content:center;}
.form-note{font-size:12px;color:var(--ink-soft);margin-top:14px;text-align:center;}
#formMsg{margin-top:14px;font-size:14px;font-weight:600;display:none;}
#formMsg.ok{color:#1E8E6B;display:block;}
#formMsg.error{color:#C23B22;display:block;}

.info-card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);padding:28px;margin-bottom:18px;}
.info-row{display:flex;gap:14px;margin-bottom:18px;}
.info-row:last-child{margin-bottom:0;}
.info-row .icon-soft{
  width:42px;height:42px;flex:none;border-radius:11px;background:var(--cream-strong);
  display:flex;align-items:center;justify-content:center;
}
.info-row .icon-soft svg{width:19px;height:19px;stroke:var(--orange-deep);}
.info-row h4{font-size:14.5px;margin:0 0 3px;font-weight:700;}
.info-row p{margin:0;color:var(--ink-soft);font-size:14px;}

/* FOOTER */
footer{background:var(--cream);border-top:1px solid var(--border);padding:48px 0 28px;}
.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:32px;margin-bottom:32px;}
.footer-brand p{color:var(--ink-soft);font-size:14px;margin-top:12px;max-width:32ch;}
.footer-col h4{font-size:14px;margin-bottom:14px;}
.footer-col a{display:block;color:var(--ink-soft);font-size:14px;margin-bottom:10px;}
.footer-col a:hover{color:var(--orange-deep);}
.footer-bottom{border-top:1px solid var(--border);padding-top:20px;font-size:12.5px;color:var(--ink-soft);display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;}

@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr;}
  .hero-art{order:-1;max-width:260px;margin:0 auto;}
  .about-grid{grid-template-columns:1fr;}
  .contact-grid{grid-template-columns:1fr;}
  .steps{grid-template-columns:repeat(2,1fr);}
  .footer-grid{grid-template-columns:1fr;}
  .nav-links{display:none;}
}

@media (prefers-reduced-motion: reduce){*{transition:none !important;animation:none !important;}}

.reveal{opacity:0;transform:translateY(14px);transition:opacity .5s ease, transform .5s ease;}
.reveal.in{opacity:1;transform:none;}

/* ============================================================
   NUEVO — Página Google Business Profile (2026-09-30)
   ------------------------------------------------------------
   Todo lo de aquí abajo son reglas NUEVAS. No se ha modificado
   ninguna clase de las de arriba: solo se añaden clases nuevas,
   con nombres que no chocan con ninguna existente.
   ============================================================ */

/* Enlace "Ver planes →" dentro de una .pillar (se usa en la tarjeta
   "Google My Business" de la home para conectar con la nueva página) */
.pillar-link{
  display:inline-flex;align-items:center;gap:6px;margin-top:14px;
  font-weight:700;font-size:13.5px;color:var(--orange-deep);
}
.pillar-link svg{width:14px;height:14px;stroke:var(--orange-deep);transition:transform .15s ease;}
.pillar-link:hover svg{transform:translateX(3px);}

/* Visual del hero de la página GBP: círculo de iconos en vez de foto,
   coherente con el resto del sitio (que tampoco usa fotografía real) */
.gbp-hero-visual{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;
  padding:20px;
}
.gbp-hero-visual .gbp-badge-row{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;}
.gbp-hero-visual .gbp-badge{
  width:64px;height:64px;border-radius:16px;background:var(--cream-strong);
  display:flex;align-items:center;justify-content:center;
}
.gbp-hero-visual .gbp-badge svg{width:30px;height:30px;stroke:var(--orange-deep);}
.gbp-hero-visual p{margin:0;font-size:13px;color:var(--ink-soft);text-align:center;max-width:26ch;}

/* Intro: 4 conceptos (Información actualizada / Reseñas / Publicaciones / Visibilidad local) */
.grid-concepts{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;}
.concept-card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);padding:26px 22px;text-align:center;}
.concept-card .icon-soft{
  width:52px;height:52px;border-radius:13px;background:var(--cream-strong);
  display:flex;align-items:center;justify-content:center;margin:0 auto 16px;
}
.concept-card .icon-soft svg{width:24px;height:24px;stroke:var(--orange-deep);}
.concept-card h3{font-size:16px;margin-bottom:6px;}
.concept-card p{margin:0;color:var(--ink-soft);font-size:14px;}

/* Planes (3 tarjetas de precio) */
.grid-planes{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch;}
.plan-card{
  background:var(--white);border:1.5px solid var(--border);border-radius:20px;
  padding:32px 26px;display:flex;flex-direction:column;position:relative;
}
.plan-card.destacado{border-color:var(--orange);box-shadow:0 20px 44px -26px rgba(232,148,10,.35);}
.plan-card .plan-tag{
  position:absolute;top:-13px;left:50%;transform:translateX(-50%);
  background:var(--orange);color:var(--white);font-size:12px;font-weight:700;
  padding:5px 16px;border-radius:999px;white-space:nowrap;
}
.plan-card h3{font-size:20px;margin-bottom:6px;}
.plan-card .plan-precio{display:flex;align-items:baseline;gap:6px;margin:8px 0 18px;}
.plan-card .plan-precio .num{font-size:34px;font-weight:800;color:var(--ink);}
.plan-card .plan-precio .periodo{font-size:14px;color:var(--ink-soft);font-weight:600;}
.plan-card .plan-desc{color:var(--ink-soft);font-size:14px;margin-bottom:18px;}
.plan-card ul{list-style:none;margin:0 0 24px;padding:0;flex:1;}
.plan-card ul li{
  display:flex;align-items:flex-start;gap:9px;font-size:14px;color:var(--ink);
  margin-bottom:11px;
}
.plan-card ul li svg{width:16px;height:16px;stroke:var(--orange-deep);flex:none;margin-top:2px;}
.plan-card .btn-outline,.plan-card .btn-primary{width:100%;justify-content:center;}

/* Tabla comparativa — responsive sin scroll horizontal:
   en escritorio es una tabla normal; en móvil cada fila se
   convierte en un bloque con la etiqueta de la columna delante. */
.tabla-comparativa{width:100%;border-collapse:collapse;background:var(--white);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;}
.tabla-comparativa th,.tabla-comparativa td{padding:14px 16px;text-align:left;font-size:14px;border-bottom:1px solid var(--border);}
.tabla-comparativa thead th{background:var(--cream);font-weight:700;color:var(--ink);}
.tabla-comparativa tbody th{font-weight:700;color:var(--ink-soft);width:38%;}
.tabla-comparativa tbody tr:last-child td,.tabla-comparativa tbody tr:last-child th{border-bottom:none;}
.tabla-comparativa td{text-align:center;color:var(--ink-soft);}

/* Tabla de extras (2 columnas, no necesita modo responsive especial) */
.tabla-extras{width:100%;border-collapse:collapse;background:var(--white);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;}
.tabla-extras th,.tabla-extras td{padding:13px 18px;text-align:left;font-size:14px;border-bottom:1px solid var(--border);}
.tabla-extras thead th{background:var(--cream);font-weight:700;}
.tabla-extras td:last-child,.tabla-extras th:last-child{text-align:right;font-weight:700;color:var(--ink);white-space:nowrap;}
.tabla-extras tbody tr:last-child td{border-bottom:none;}

@media (max-width:760px){
  .tabla-comparativa thead{display:none;}
  .tabla-comparativa tbody tr{display:block;border-bottom:1px solid var(--border);padding:14px 16px;}
  .tabla-comparativa tbody tr:last-child{border-bottom:none;}
  .tabla-comparativa tbody th{
    display:block;width:auto;border-bottom:none;padding:0 0 8px;font-size:13px;
    text-transform:uppercase;letter-spacing:.03em;color:var(--orange-deep);
  }
  .tabla-comparativa tbody td{
    display:flex;justify-content:space-between;align-items:center;border-bottom:none;padding:6px 0;text-align:left;
  }
  .tabla-comparativa tbody td::before{content:attr(data-plan);font-weight:700;color:var(--ink);}
}

/* FAQ / aclaración de límites */
.faq-list{display:grid;gap:14px;}
.faq-item{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);padding:20px 24px;}
.faq-item h3{font-size:15.5px;margin-bottom:8px;}
.faq-item p{margin:0;color:var(--ink-soft);font-size:14.5px;}

.disclaimer-box{
  background:var(--cream);border:1px solid var(--border);border-radius:var(--radius);
  padding:20px 24px;font-size:13.5px;color:var(--ink-soft);
}
.disclaimer-box strong{color:var(--ink);}

@media (max-width:900px){
  .grid-planes{grid-template-columns:1fr;}
  .plan-card.destacado{order:-1;}
}