:root{
  --bg:#FFFFFF;
  --ink:#111111;
  --ink-2:#2B2B2B;
  --brand:#00A860;
  --brand-2:#C9DA2A;
  --wash:#F9F9F9;
  --radius:18px;
  --shadow:0 12px 28px rgba(0,0,0,.08);
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;color:var(--ink);background:var(--bg);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,'Helvetica Neue',Arial,sans-serif;line-height:1.55}
.container{width:min(1080px,92%);margin:auto}
h1,h2,h3,h4{font-family:Montserrat,Inter,sans-serif;margin:0 0 .6rem}
h1{font-size:clamp(2rem,4vw,3rem);line-height:1.15;letter-spacing:-.01em}
h2{font-size:clamp(1.6rem,3vw,2.2rem)}
h3{font-size:1.25rem}
p{margin:.5rem 0 1rem;color:var(--ink-2)}

.btn{display:inline-block;background:var(--brand);color:#fff;padding:.9rem 1.2rem;border-radius:12px;text-decoration:none;font-weight:700;box-shadow:var(--shadow);border:0;cursor:pointer}
.btn:hover{filter:brightness(.95)}
.btn.ghost{background:transparent;color:var(--ink);border:2px solid var(--ink);box-shadow:none}
.btn.small{padding:.5rem .9rem;border-radius:10px}

.site-header{position:sticky;top:0;background:#ffffffc8;backdrop-filter:blur(8px);border-bottom:1px solid #ececec;z-index:10}
.nav{display:flex;align-items:center;justify-content:space-between;padding:.8rem 0}
.brand{display:flex;align-items:center;gap:.6rem;color:var(--ink);text-decoration:none;font-weight:900;font-family:Montserrat;letter-spacing:.04em}
.brand-logo{height:36px;aspect-ratio:auto;display:block}
.nav-links{display:flex;gap:1rem;align-items:center}
.nav-links a{color:var(--ink);text-decoration:none;font-weight:700}
.menu-btn{display:none;background:transparent;border:0;font-size:1.5rem}

.hero{padding:3.2rem 0;background:linear-gradient(180deg,#fff,var(--wash))}
.grid-2{display:grid;grid-template-columns:1.1fr .9fr;gap:2rem}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.hero-copy .badges{list-style:none;padding:0;margin:1rem 0 0;display:flex;gap:1rem;flex-wrap:wrap;color:var(--ink-2)}
.owl-card{border:1px solid #e7e7e7;border-radius:16px;background:#fff;box-shadow:var(--shadow);padding:1rem;text-align:center}
.owl-card img{max-width:100%;height:auto;display:block;margin:auto}
.caption{font-size:.85rem;color:var(--ink-2);margin-top:.6rem}

.section{padding:3rem 0}
.section.alt{background:var(--wash)}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.card{padding:1.2rem;border-radius:var(--radius);background:#fff;border:1px solid #e7e7e7;box-shadow:var(--shadow)}
.feature{padding:1.2rem;background:#fff;border:1px solid #e7e7e7;border-radius:var(--radius)}
.pill{display:inline-block;background:color-mix(in srgb, var(--brand) 15%, #fff);color:var(--ink);border:1px solid color-mix(in srgb, var(--brand) 40%, #ddd);padding:.2rem .6rem;border-radius:999px;font-size:.8rem;font-weight:800;margin-bottom:.4rem}

.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;counter-reset:step}
.steps li{list-style:none;background:#fff;border:1px solid #e7e7e7;border-radius:var(--radius);padding:1rem}
.steps li::before{counter-increment:step;content:counters(step, '.') '. ';color:var(--brand);font-weight:900}

.section.cta{background:linear-gradient(180deg,#f3fff9,#fff)}
.contact{margin-top:1rem}
.contact input,.contact textarea{width:100%;padding:.9rem;border:1px solid #e2e8f0;border-radius:12px;background:#fff}
.contact .fine{font-size:.85rem;color:var(--ink-2)}
.cta-row{display:flex;gap:.8rem;margin-top:1rem}

.site-footer{border-top:1px solid #ececec;background:#fff;padding:1.2rem 0;color:var(--ink-2)}
.foot{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.foot-left{display:flex;align-items:center;gap:.6rem}
.foot-right{display:flex;align-items:center;gap:.6rem}
.foot-right a{color:var(--ink-2);text-decoration:none}
.dot{opacity:.5}

/* responsive */ 
@media (max-width: 960px){
  .grid-2{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr 1fr}
  .grid-3{grid-template-columns:1fr}
  .nav-links{display:none;position:absolute;right:4%;top:60px;background:#fff;border:1px solid #ececec;border-radius:12px;padding:.8rem;flex-direction:column;gap:.6rem;box-shadow:var(--shadow)}
  .menu-btn{display:block}
}


/* v3 header refinements */
.brand-logo{height:56px;width:auto;display:block}
.brand-text{font-size:1.35rem;font-weight:900;letter-spacing:.04em}
@media (max-width: 960px){
  .brand-logo{height:44px}
  .brand-text{font-size:1.15rem}
}


/* v4 header — single brand, compact spacing */
.site-header .nav{padding:.6rem 0}
.brand{gap:.75rem}
.brand-logo{height:52px}
.brand-text{font-size:1.4rem}
@media (max-width:960px){
  .brand-logo{height:42px}
  .brand-text{font-size:1.2rem}
}


/* v5 header — icon only */
.brand-icon-only{padding:.2rem 0}
.brand-icon-only .brand-logo{height:56px;width:auto;display:block}
@media (max-width:960px){
  .brand-icon-only .brand-logo{height:44px}
}


/* v6 — sticky header toggle */
.pin-btn{
  margin-left:.5rem;
  background:#fff;
  border:1px solid #e0e0e0;
  border-radius:10px;
  padding:.35rem .5rem;
  cursor:pointer;
  box-shadow:0 1px 2px rgba(0,0,0,.05);
}
.pin-btn.active{background:var(--brand);color:#fff;border-color:transparent}

body.header-pinned .site-header{
  position:fixed;
  top:0;left:0;right:0;
  z-index:20;
  background:#ffffffee;
  backdrop-filter:blur(8px);
  box-shadow:0 6px 18px rgba(0,0,0,.08);
}


/* v7 — visual polish */
.nav{gap:.6rem}
.nav-links{align-items:center}
.pin-btn{
  width:36px;height:36px;display:inline-grid;place-items:center;
  margin-left:.25rem;
  background:#fff;border:1px solid #dcdcdc;border-radius:10px;
  cursor:pointer;transition:.15s ease;
}
.pin-btn:hover{box-shadow:0 2px 6px rgba(0,0,0,.08)}
.pin-btn.active{background:var(--brand);border-color:var(--brand);color:#fff}
/* reduce contact button radius so it doesn't look like a floating badge */
.btn.small{border-radius:8px}
/* ensure pin button is at the far right on desktop */
@media (min-width: 961px){
  #menuBtn{order:2}
  #pinHeaderBtn{order:3;margin-left:.5rem}
}


/* v8 — Casos de éxito */
.muted{color:var(--ink-2)}
.case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1rem}
.case{display:flex;gap:1rem;align-items:center;background:#fff;border:1px solid #e7e7e7;border-radius:16px;padding:1rem;box-shadow:var(--shadow)}
.case img{width:120px;height:90px;object-fit:cover;border-radius:12px;border:1px solid #e7e7e7;background:#fff}
.case-body h3{margin:0 0 .25rem}
.case-body p{margin:.25rem 0 .5rem}
.impact,.guidelines{margin-top:1.5rem;background:var(--wash);border:1px solid #e7e7e7;border-radius:16px;padding:1rem}
.impact h4,.guidelines h4{margin:.2rem 0 .6rem}
@media (max-width:960px){
  .case-grid{grid-template-columns:1fr}
  .case img{width:100px;height:76px}
}

/* v8.1: remove caption under hero */
.caption{display:none !important}


/* v9 — WhatsApp floating button */
.wa-float{
  position:fixed;right:18px;bottom:18px;z-index:30;
  width:56px;height:56px;border-radius:50%;
  display:grid;place-items:center;
  background:var(--brand);color:#fff;text-decoration:none;
  box-shadow:0 12px 24px rgba(0,0,0,.18);
}
.wa-float:hover{filter:brightness(.95)}

/* v9 — minor reveal */
.case{opacity:0;transform:translateY(8px);transition:.35s ease}
.case.reveal{opacity:1;transform:none}


/* v9.1 — offset for anchored scroll when header is fixed */
:root{ --header-h: 72px; } /* default; JS actualiza este valor */
.section, [id]{ scroll-margin-top: calc(var(--header-h) + 10px); }
html{ scroll-behavior: smooth; }


/* v9.2 — Footer/copyright layout hardening */
.site-footer, .site-footer * {
  position: static !important; /* prevent accidental fixed/absolute from overrides */
}
.site-footer { z-index: 1; }
.site-footer .container { position: relative; }
.foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6rem; }
.foot-left span { white-space: nowrap; }
@media (max-width: 960px){
  .foot { flex-direction: column; text-align: center; }
  .foot-right { justify-content: center; }
}


/* v9.3 — HARD RESET footer to avoid floating copyright on right */
.site-footer{position:relative; z-index:1;}
.site-footer *{
  position:static !important;
  float:none !important;
  clear:none !important;
  inset:auto !important;
  right:auto !important; left:auto !important; top:auto !important; bottom:auto !important;
  transform:none !important;
}
.site-footer .foot{display:flex !important; align-items:center !important; justify-content:space-between !important; gap:.6rem !important; flex-wrap:wrap !important; text-align:left !important;}
.site-footer .foot-left, .site-footer .foot-right{display:flex !important; align-items:center !important; gap:.6rem !important;}
.site-footer .foot-right a{display:inline-block;}
@media (max-width: 960px){
  .site-footer .foot{flex-direction:column !important; justify-content:center !important; text-align:center !important;}
}


/* v9.4 — pin copyright inside footer-left */
#copyright{
  position: static !important;
  float:none !important;
  display:inline-flex; align-items:center; gap:.35rem;
  color: var(--ink-2);
  margin-left:.2rem;
  white-space: nowrap;
}
.foot-logo{height:20px; width:auto; display:inline-block}


/* v9.5 — Casos de éxito: imágenes uniformes + animación */
.case{opacity:0; transform:translateY(10px); transition:opacity .45s ease, transform .45s ease, box-shadow .25s ease;}
.case.reveal{opacity:1; transform:none;}
.case img{width:120px; height:120px; object-fit:contain; background:#fff; border:1px solid #e7e7e7; border-radius:12px; box-shadow:0 6px 16px rgba(0,0,0,.06);}
.case:hover{box-shadow:0 14px 32px rgba(0,0,0,.10);}
.case:hover img{transform:scale(1.02); transition:transform .25s ease;}
/* stagger */
.case:nth-child(1){transition-delay:.05s}
.case:nth-child(2){transition-delay:.15s}
.case:nth-child(3){transition-delay:.25s}
@media (max-width: 960px){
  .case img{width:96px;height:96px}
}


/* v9.6 — Case layout: title centered + image large left, text right; no image frame */
.case{background:#fff;border:1px solid #e7e7e7;border-radius:16px;padding:1.2rem;box-shadow:var(--shadow);}
.case-title{ text-align:center; margin:0 0 1rem; font-size:1.25rem; }
.case-inner{ display:grid; grid-template-columns: 200px 1fr; gap:1.2rem; align-items:center; }
.case-img{ width:100%; height:auto; display:block; border:none; box-shadow:none; border-radius:12px; }
.case-text{ text-align:left; }
.case-text p{ margin:.2rem 0 .6rem; }
@media (max-width: 960px){
  .case-inner{ grid-template-columns: 1fr; }
  .case-img{ max-width: 260px; margin: 0 auto; }
  .case-title{ margin-bottom:.8rem; }
}

/* ensure reveal animation from v9.5 stays */
.case{opacity:0; transform:translateY(10px); transition:opacity .45s ease, transform .45s ease;}
.case.reveal{opacity:1; transform:none;}
.case:nth-child(1){transition-delay:.05s}
.case:nth-child(2){transition-delay:.15s}
.case:nth-child(3){transition-delay:.25s}


/* v9.7 — robust case layout and images */
.case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1rem}
.case{background:#fff;border:1px solid #e7e7e7;border-radius:16px;padding:1.2rem;box-shadow:var(--shadow);opacity:0;transform:translateY(10px);transition:opacity .45s ease, transform .45s ease}
.case.reveal{opacity:1;transform:none}
.case-title{text-align:center;margin:0 0 1rem;font-size:1.25rem}
.case-inner{display:grid;grid-template-columns:240px 1fr;gap:1.4rem;align-items:center}
.case-img{width:100%;height:auto;display:block;border:none !important;box-shadow:none !important;background:transparent !important;border-radius:12px}
.case-text{text-align:left}
@media (max-width: 960px){
  .case-grid{grid-template-columns:1fr}
  .case-inner{grid-template-columns:1fr}
  .case-img{max-width:300px;margin:0 auto}
}
/* override any legacy rule targeting .case img */
.case img{border:none !important;box-shadow:none !important;background:transparent !important}


/* v9.8 — equalized images & alignment */
.case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:1rem}
.case{background:#fff;border:1px solid #e7e7e7;border-radius:16px;padding:1.2rem;box-shadow:var(--shadow);opacity:0;transform:translateY(10px);transition:opacity .45s ease, transform .45s ease}
.case.reveal{opacity:1;transform:none}
.case-title{text-align:center;margin:0 0 1rem;font-size:1.25rem}
.case-inner{display:grid;grid-template-columns:240px 1fr;gap:1.4rem;align-items:center}
.case-img{width:220px;height:220px;object-fit:cover;object-position:center;border:none !important;box-shadow:none !important;background:transparent !important;border-radius:12px}
.case-text{text-align:left}
.case-text ul{margin:.4rem 0 0 1.1rem}
@media (max-width: 960px){
  .case-grid{grid-template-columns:1fr}
  .case-inner{grid-template-columns:1fr}
  .case-img{width:280px;height:280px;margin:0 auto}
}
/* last-resort override for legacy .case img rules */
.case img{border:none !important;box-shadow:none !important;background:transparent !important}


/* v9.9 — titles centered above inner grid; prevent side placement */
.case{ display:block !important; }
.case-title{ text-align:center; margin:0 0 1rem; font-size:1.25rem; font-weight:800; }
.case-inner{ display:grid; grid-template-columns:240px 1fr; gap:1.4rem; align-items:center; }
@media (max-width: 960px){
  .case-inner{ grid-template-columns:1fr; }
}


/* v9.9-fix — compact cards + no horizontal scroll */
html, body { overflow-x: hidden; }

.case-grid{ grid-template-columns: repeat(3, 1fr) !important; gap: 1rem !important; }
.case{ padding: 1rem !important; max-width: 100% !important; }
.case-inner{ grid-template-columns: 160px 1fr !important; gap: 1rem !important; }
.case-img{ width: 120px !important; height: 120px !important; object-fit: contain !important; }
.case-title{ font-size: 1.15rem !important; margin-bottom: .75rem !important; }

@media (max-width: 960px){
  .case-grid{ grid-template-columns: 1fr !important; }
  .case-inner{ grid-template-columns: 1fr !important; }
  .case-img{ width: 140px !important; height: 140px !important; margin: 0 auto !important; }
}


/* v10-mock — cards like user reference */
:root{ --tk-green:#008000; }
.case-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; margin-top:1rem; }
.case.mock{ padding:1.1rem; border:1px solid #e7e7e7; border-radius:16px; background:#fff; box-shadow:var(--shadow); }
.case-head{ margin-bottom:.6rem; }
.case-title{ margin:0; font-size:1.05rem; font-weight:800; color:var(--tk-green); text-transform:uppercase; text-align:left; }
.case-sub{ margin:.15rem 0 0; color:var(--tk-green); font-weight:700; }
.case-inner{ display:grid; grid-template-columns:180px 1fr; gap:1rem; align-items:center; }
.case-img{ width:160px; height:160px; object-fit:contain; display:block; margin:0 auto; border:none !important; box-shadow:none !important; background:transparent !important; }
.case-text ul{ margin:.2rem 0 0 1.1rem; }
@media (max-width: 1080px){
  .case-inner{ grid-template-columns:160px 1fr; }
  .case-img{ width:140px; height:140px; }
}
@media (max-width: 960px){
  .case-grid{ grid-template-columns:1fr; }
  .case-inner{ grid-template-columns:1fr; }
  .case-text{ text-align:center; }
  .case-text ul{ text-align:left; margin: .3rem auto 0; max-width: 360px; }
}
html, body{ overflow-x:hidden; } /* avoid horizontal scroll */