.kansai-app{
  --brand:#E31E26; --ink:#111; --muted:#666; --bg:#fff; --soft:#f6f7f9;
  --ring: rgba(227,30,38,.35); --shadow:0 12px 30px rgba(0,0,0,.08);
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial,sans-serif;
  color:var(--ink); background:var(--bg);
}
.kansai-app *{box-sizing:border-box}
.kansai-app a{color:var(--brand);text-decoration:none}
.kansai-app img{max-width:100%;height:auto;display:block}

.kansai-app .wrap{max-width:1200px;margin:0 auto;padding:0 16px}

/* Header */
.kansai-app .site-header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid #eee}
.kansai-app .nav{display:flex;align-items:center;justify-content:space-between;height:64px;gap:16px}
.kansai-app .brand{display:flex;align-items:center;gap:12px}
.kansai-app .brand img{
  height: 48px;          /* altura suficiente */
  width: auto;           /* que escale proporcional */
  object-fit: contain;   /* que no recorte */
  border-radius: 0;      /* si no querés esquinas redondeadas */
  display: block;
}

.kansai-app .brand strong{font-weight:800;letter-spacing:.2px}
.kansai-app .menu{display:flex;gap:18px;align-items:center}
.kansai-app .menu a{font-weight:600;color:#222}
.kansai-app .cta-whatsapp{display:inline-flex;align-items:center;gap:8px;background:#25D366;color:#fff;padding:10px 14px;border-radius:999px;font-weight:700}

/* Hero */
.kansai-app .hero{position:relative;isolation:isolate;background:#000;color:#fff}
.kansai-app .hero-viewport{position:relative;height:min(78vh,760px);min-height:520px;overflow:hidden}
.kansai-app .slide{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transform:scale(1.04);transition:opacity .8s ease,transform 1.2s ease}
.kansai-app .slide.active{opacity:1;transform:scale(1)}
.kansai-app .hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.25) 40%,rgba(0,0,0,.55))}
.kansai-app .hero-content{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:20px}
.kansai-app .eyebrow{display:inline-block;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);padding:6px 10px;border-radius:999px;font-size:12px;text-transform:uppercase;letter-spacing:.16em;margin-bottom:10px}
.kansai-app h1{font-size:clamp(32px,4.5vw,56px);line-height:1.02;margin:.1em 0}
.kansai-app .hero p{font-size:clamp(16px,2.2vw,20px);opacity:.9;margin:.2em 0 1em}
.kansai-app .btn{display:inline-flex;align-items:center;gap:10px;background:var(--brand);color:#fff;padding:12px 18px;border-radius:12px;font-weight:800;box-shadow:var(--shadow)}

/* Secciones */
.kansai-app section{padding:56px 0}
.kansai-app .section-head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:22px}
.kansai-app .section-head h2{font-size:clamp(24px,3.2vw,36px);margin:0}
.kansai-app .badge{display:inline-block;background:var(--soft);border:1px solid #e7e8ea;padding:4px 8px;border-radius:999px;font-size:12px;color:#444}

/* Grid + Cards */
.kansai-app .grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.kansai-app .card{grid-column:span 12;background:#fff;border:1px solid #eee;border-radius:18px;overflow:hidden;box-shadow:var(--shadow)}
@media(min-width:720px){.kansai-app .card{grid-column:span 6}}
@media(min-width:1024px){.kansai-app .card{grid-column:span 4}}
.kansai-app .card .media{aspect-ratio:16/9;background:#ddd}
.kansai-app .card .body{padding:16px}
.kansai-app .price{font-weight:800;font-size:22px;margin:6px 0}
.kansai-app .actions{display:flex;gap:10px;flex-wrap:wrap}
.kansai-app .tab{background:#fff;border:1px solid #e8e8e8;border-radius:999px;padding:8px 12px}

/* Beneficios */
.kansai-app .benefits{background:var(--soft)}
.kansai-app .benefit{background:#fff;border:1px solid #eee;border-radius:16px;padding:18px;display:flex;gap:12px;align-items:flex-start}

/* Sucursales */
.kansai-app .tabs{display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap}
.kansai-app .locations{display:grid;grid-template-columns:repeat(12,1fr);gap:14px}
.kansai-app .loc{grid-column:span 12;border:1px dashed #ddd;border-radius:14px;padding:12px;background:#fff}
@media(min-width:900px){.kansai-app .loc{grid-column:span 6}}

/* Form */
.kansai-app .form{background:#fff;border:1px solid #eee;border-radius:20px;padding:18px;box-shadow:var(--shadow)}
.kansai-app label{font-weight:600;font-size:14px}
.kansai-app .field{display:grid;gap:6px}
.kansai-app input,.kansai-app select,.kansai-app textarea{padding:10px 12px;border:1px solid #e1e4ea;border-radius:12px;outline:none}
.kansai-app input:focus,.kansai-app select:focus,.kansai-app textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--ring)}
.kansai-app .btn-whatsapp{
  background:#25D366; color:#fff; border-radius:12px; padding:12px 18px;
  font-weight:800; display:inline-flex; align-items:center; gap:10px; box-shadow:var(--shadow);
}
/* ==== Footer (Treos) ==== */
.kansai-app footer{
  background:#0b0b0c;
  color:#d7d7db;
  padding:48px 0 28px;
  border-top:1px solid rgba(255,255,255,.06);
}

.kansai-app footer .wrap{max-width:1200px}

.kansai-app footer .fgrid{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  gap:18px;
}

.kansai-app footer .fcol{
  grid-column:span 12;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.06);
  border-radius:16px;
  padding:18px;
  box-shadow:0 8px 24px rgba(0,0,0,.25);
}
@media(min-width:900px){
  .kansai-app footer .fcol{grid-column:span 4}
}

.kansai-app footer h4{
  margin:0 0 8px;
  font-weight:800;
  color:#fff;
  letter-spacing:.2px;
}

.kansai-app footer p,
.kansai-app footer li{
  margin:.35em 0;
  color:#c5c8ce;
  line-height:1.55;
}

.kansai-app footer ul{
  list-style:none;
  padding:0;
  margin:8px 0 0;
}
.kansai-app footer ul li{
  position:relative;
  padding-left:18px;
}
.kansai-app footer ul li::before{
  content:"•";
  position:absolute; left:0; top:0; color:#9aa0a6;
}

.kansai-app footer a{
  color:#fff;
  text-decoration:none;
  border-bottom:1px dashed rgba(255,255,255,.25);
}
.kansai-app footer a:hover{
  border-bottom-color:transparent;
  opacity:.95;
}

.kansai-app .footer-row{
  margin-top:22px;
  padding-top:16px;
  border-top:1px solid rgba(255,255,255,.08);
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:space-between;
  color:#a7acb4;
  font-size:14px;
}

/* Botón WhatsApp en footer */
.kansai-app .footer-whatsapp{
  display:inline-flex; align-items:center; gap:10px;
  background:#25D366; color:#0b0b0c;
  padding:10px 14px; border-radius:999px; font-weight:800;
  box-shadow:0 10px 24px rgba(0,0,0,.25);
}
.kansai-app .footer-whatsapp:hover{filter:brightness(1.05)}
/* ===== Header base ===== */
.site-header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid #eee}
.site-header .wrap{max-width:1200px;margin:0 auto;padding:12px 16px;display:flex;align-items:center;gap:16px}
.brand img{height:28px;display:block}

/* ===== Header limpio ===== */
.site-header{
  position: sticky; top: 0; z-index: 1000;
  background:#fff; border-bottom:1px solid #eee;
}
.site-header .wrap{
  max-width:1200px; margin:0 auto; padding:10px 16px;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
}
.brand img{height:28px; display:block}

/* Anclas del menú: sin subrayado ni color rojo del tema */
.site-nav .menu a{ 
  text-decoration:none !important; color:#111 !important; font-weight:600;
}

/* Botón hamburguesa */
.hamburger{
  margin-left:auto; display:none;
  width:42px; height:42px; border:1px solid #e6e6e6; border-radius:12px;
  background:#fff; align-items:center; justify-content:center; gap:4px; cursor:pointer;
}
.hamburger__bar{width:20px; height:2px; background:#111; transition:transform .25s,opacity .25s}
.hamburger.is-open .hamburger__bar:nth-child(1){transform:translateY(6px) rotate(45deg)}
.hamburger.is-open .hamburger__bar:nth-child(2){opacity:0}
.hamburger.is-open .hamburger__bar:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* Nav desktop */
.site-nav{ margin-left:auto; display:flex; align-items:center; gap:20px }
.site-nav .menu{ list-style:none; display:flex; gap:20px; margin:0; padding:0 }
.wa-btn{ padding:10px 14px; border-radius:999px; background:#22c55e; color:#fff !important; font-weight:700; display:inline-block }

/* ===== Mobile ===== */
@media (max-width: 960px){
  .hamburger{ display:flex }
  /* panel deslizable fullscreen bajo el header */
  .site-nav{
    position:fixed; left:0; right:0; top:56px; bottom:0;
    background:#fff; padding:12px 16px 24px;
    display:block; overflow:auto;
    opacity:0; visibility:hidden; transform:translateY(-8px);
    transition:opacity .2s ease, visibility .2s ease, transform .2s ease;
    box-shadow:0 12px 30px rgba(0,0,0,.08);
  }
  .site-nav.is-open{ opacity:1; visibility:visible; transform:none }

  .site-nav .menu{ display:block }
  .site-nav .menu li{ margin:0; padding:0; border-bottom:1px solid #eee }
  .site-nav .menu a{ display:block; padding:14px 6px }

  .wa-btn{ display:block; margin:12px 6px 0 }
  body.nav-lock{ overflow:hidden } /* bloquea scroll del body */
}

/* Evita que un <a> suelto (WhatsApp) quede subrayado/rojo */
.site-header a{ text-decoration:none; }


.hev-badge {
  position: absolute;
  top: 12px;
  left: 12px;
  background: linear-gradient(135deg,#4CAF50,#2E7D32);
  color: #fff;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 12px;
  box-shadow: 0 2px 6px rgba(0,0,0,.2);
  text-transform: uppercase;
  letter-spacing: .5px;
}

