/* ============================================================
   Asistencia Hogar 24 · Sistema visual compartido
   Paleta: navy corporativo + acento ámbar (urgencia) · fondo blanco
   Sin dependencias externas · WCAG AA/AAA
   ============================================================ */

:root{
  --brand:        #123a6b;   /* navy corporativo */
  --brand-700:    #0e2f57;
  --brand-600:    #1b5bb0;   /* azul vivo */
  --brand-500:    #2f74d0;
  --brand-050:    #eef3fb;   /* azul muy claro (fondos) */
  --brand-025:    #f6f9fe;
  --accent:       #e35a10;   /* ámbar/naranja urgencia (contraste AA sobre blanco) */
  --accent-600:   #c74d0b;
  --accent-050:   #fff2e9;
  --wa:           #25D366;   /* WhatsApp */
  --ink:          #12202f;   /* texto principal */
  --ink-soft:     #45566b;   /* texto secundario */
  --ink-faint:    #6b7a8d;
  --line:         #e2e8f1;
  --line-soft:    #eef2f7;
  --white:        #ffffff;
  --star:         #f5a623;

  --radius:       16px;
  --radius-sm:    10px;
  --radius-lg:    26px;
  --shadow-sm:    0 2px 8px rgba(18,58,107,.06);
  --shadow:       0 14px 40px -18px rgba(18,58,107,.28);
  --shadow-lg:    0 30px 70px -28px rgba(18,58,107,.40);
  --header-h:     72px;
  --maxw:         1200px;

  --sans: "Segoe UI", system-ui, "Helvetica Neue", -apple-system, BlinkMacSystemFont, sans-serif;
  --display: "Georgia", "Times New Roman", var(--sans); /* serif de contraste para titulares no se usa; ver override */
}

/* ---------- Reset ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0;
  font-family:var(--sans);
  color:var(--ink);
  background:var(--white);
  line-height:1.65;
  font-size:clamp(16px,1.05vw,17.5px);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; height:auto; }
a{ color:var(--brand-600); text-decoration:none; }
a:hover{ text-decoration:underline; }
h1,h2,h3,h4{ line-height:1.12; color:var(--brand-700); margin:0 0 .5em; letter-spacing:-.015em; font-weight:800; }
h1{ font-size:clamp(2.1rem,5.2vw,3.6rem); }
h2{ font-size:clamp(1.7rem,3.4vw,2.5rem); }
h3{ font-size:clamp(1.2rem,2vw,1.5rem); }
p{ margin:0 0 1rem; }
strong{ color:var(--brand-700); font-weight:700; }
ul,ol{ margin:0 0 1rem; padding-left:1.25rem; }
li{ margin:.3rem 0; }

/* ---------- Layout helpers ---------- */
.container{ max-width:var(--maxw); margin-inline:auto; padding-inline:clamp(1.1rem,4vw,2rem); }
.prose{ max-width:70ch; }
.prose > * + *{ margin-top:1.1em; }
.section{ padding:clamp(3.2rem,7vw,6rem) 0; }
.section--muted{ background:var(--brand-025); }
.section--band{ background:linear-gradient(160deg,var(--brand-050),#fff); }
.section-header{ max-width:64ch; margin:0 auto clamp(2rem,4vw,3rem); text-align:center; }
.section-header.left{ text-align:left; margin-inline:0; }
.eyebrow{
  display:inline-flex; align-items:center; gap:.5em;
  font-size:.78rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent-600); background:var(--accent-050);
  padding:.4em .85em; border-radius:100px; margin-bottom:1rem;
}
.lead{ font-size:clamp(1.05rem,1.6vw,1.25rem); color:var(--ink-soft); }
.center{ text-align:center; }

/* skip link */
.skip-link{
  position:absolute; left:-999px; top:0; z-index:100000;
  background:var(--brand); color:#fff; padding:.8rem 1.2rem; border-radius:0 0 10px 0; font-weight:700;
}
.skip-link:focus{ left:0; }

:focus-visible{ outline:3px solid var(--brand-500); outline-offset:3px; border-radius:4px; }

/* ---------- Buttons ---------- */
.btn{
  --bg:var(--brand); --fg:#fff;
  display:inline-flex; align-items:center; justify-content:center; gap:.55em;
  font-weight:700; font-size:1rem; line-height:1; text-align:center;
  padding:.95em 1.5em; border-radius:100px; border:2px solid transparent;
  background:var(--bg); color:var(--fg); cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
  text-decoration:none; white-space:nowrap;
}
.btn:hover{ text-decoration:none; transform:translateY(-2px); box-shadow:var(--shadow); }
.btn svg{ width:1.15em; height:1.15em; fill:currentColor; }
.btn--accent{ --bg:var(--accent); }
.btn--accent:hover{ background:var(--accent-600); }
.btn--wa{ --bg:var(--wa); --fg:#0b3a1e; }
.btn--wa:hover{ background:#1fbd5a; }
.btn--ghost{ background:transparent; color:var(--brand); border-color:var(--brand); }
.btn--ghost:hover{ background:var(--brand); color:#fff; }
.btn--lg{ padding:1.1em 1.9em; font-size:1.08rem; }
.btn--block{ width:100%; }
.btn-row{ display:flex; flex-wrap:wrap; gap:.9rem; }

/* ghost sobre fondos oscuros */
.section-dark .btn--ghost,
.cta-final .btn--ghost,
.footer .btn--ghost{ color:#fff; border-color:rgba(255,255,255,.55); }
.section-dark .btn--ghost:hover,
.cta-final .btn--ghost:hover,
.footer .btn--ghost:hover{ background:rgba(255,255,255,.12); border-color:#fff; }

/* ============================================================
   HEADER / NAV
   ============================================================ */
.site-header{
  position:sticky; top:0; z-index:100;
  background:rgba(255,255,255,.86);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid transparent;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.site-header.scrolled{ border-bottom-color:var(--line); box-shadow:0 6px 22px -18px rgba(18,58,107,.5); }
.nav{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  height:var(--header-h); max-width:var(--maxw); margin-inline:auto;
  padding-inline:clamp(1.1rem,4vw,2rem);
}
.brand{ display:flex; align-items:center; gap:.6rem; font-weight:800; color:var(--brand-700); font-size:1.15rem; letter-spacing:-.02em; text-decoration:none; }
.brand:hover{ text-decoration:none; }
.brand-mark{
  width:38px; height:38px; border-radius:11px; flex:0 0 auto;
  background:linear-gradient(135deg,var(--brand),var(--brand-600));
  display:grid; place-items:center; color:#fff; font-weight:900; font-size:1.05rem;
  box-shadow:var(--shadow-sm);
}
.brand small{ display:block; font-size:.66rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--accent-600); }
.brand .brand-txt{ line-height:1.05; }

.nav-menu{ display:flex; align-items:center; gap:.35rem; list-style:none; margin:0; padding:0; }
.nav-menu > li{ position:relative; margin:0; }
.nav-menu a{
  display:inline-flex; align-items:center; gap:.35rem; white-space:nowrap;
  padding:.6rem .8rem; border-radius:10px; color:var(--ink); font-weight:600; font-size:.97rem;
}
.nav-menu a:hover{ background:var(--brand-050); color:var(--brand-700); text-decoration:none; }
.nav-menu a[aria-current="page"]{ color:var(--brand-600); }

.nav-dropdown > .dropdown-toggle::after{ content:"▾"; font-size:.7em; opacity:.7; }
.dropdown-menu{
  list-style:none; margin:0; padding:.5rem;
  position:absolute; top:calc(100% + 8px); left:0; min-width:250px;
  background:#fff; border:1px solid var(--line); border-radius:14px; box-shadow:var(--shadow-lg);
  opacity:0; visibility:hidden; transform:translateY(8px); transition:.18s ease; z-index:50;
}
.nav-dropdown:hover .dropdown-menu,
.nav-dropdown:focus-within .dropdown-menu{ opacity:1; visibility:visible; transform:translateY(0); }
.dropdown-menu a{ padding:.55rem .7rem; border-radius:8px; font-weight:600; width:100%; }

.nav-cta{ display:flex; align-items:center; gap:.6rem; }
.nav-phone{ display:inline-flex; align-items:center; gap:.45rem; font-weight:800; color:var(--brand-700); white-space:nowrap; }
.nav-phone:hover{ text-decoration:none; color:var(--brand-600); }
.nav-phone svg{ width:1.05em; height:1.05em; fill:var(--accent); }

.hamburger{
  display:none; width:46px; height:46px; border:1px solid var(--line); border-radius:12px;
  background:#fff; cursor:pointer; align-items:center; justify-content:center; flex-direction:column; gap:5px;
}
.hamburger span{ display:block; width:22px; height:2px; background:var(--brand-700); border-radius:2px; transition:.25s ease; }
.hamburger[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.hamburger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.hamburger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

.nav-backdrop{ display:none; }

@media (max-width:1024px){
  .hamburger{ display:flex; }
  .nav-cta .nav-phone-txt{ display:none; }
  .nav-menu{
    position:fixed; top:var(--header-h); right:0; width:min(340px,86vw);
    height:calc(100dvh - var(--header-h)); max-height:calc(100dvh - var(--header-h)); overflow-y:auto;
    flex-direction:column; align-items:stretch; gap:.15rem;
    background:#fff; border-left:1px solid var(--line); box-shadow:var(--shadow-lg);
    padding:1rem; transform:translateX(105%); transition:transform .28s ease; z-index:90;
  }
  .nav-menu.is-open{ transform:translateX(0); }
  .nav-menu > li{ width:100%; }
  .nav-menu a{ padding:.85rem .8rem; font-size:1.05rem; border-radius:10px; }
  .nav-backdrop.is-open{ display:block; position:fixed; inset:var(--header-h) 0 0; background:rgba(10,25,45,.35); z-index:80; }
  /* dropdown móvil */
  .dropdown-menu{
    position:static; opacity:1; visibility:visible; transform:none; box-shadow:none; border:0;
    padding:0 0 0 .8rem; min-width:0; max-height:0; overflow:hidden; transition:max-height .25s ease;
  }
  .nav-dropdown.is-open .dropdown-menu{ max-height:520px; }
  .nav-dropdown > .dropdown-toggle::after{ margin-left:auto; }
  .nav-dropdown.is-open > .dropdown-toggle::after{ transform:rotate(180deg); display:inline-block; }
}

/* ============================================================
   BREADCRUMB
   ============================================================ */
.breadcrumb{ padding:1rem 0 .2rem; font-size:.86rem; color:var(--ink-faint); }
.breadcrumb ol{ list-style:none; display:flex; flex-wrap:wrap; gap:.4rem; padding:0; margin:0; }
.breadcrumb li{ margin:0; display:flex; gap:.4rem; align-items:center; }
.breadcrumb li:not(:last-child)::after{ content:"›"; color:var(--line); }
.breadcrumb a{ color:var(--ink-faint); font-weight:600; }
.breadcrumb a:hover{ color:var(--brand-600); }
.breadcrumb [aria-current="page"]{ color:var(--brand-700); font-weight:700; }

/* ============================================================
   HERO
   ============================================================ */
.hero{ position:relative; overflow:hidden; background:linear-gradient(170deg,var(--brand-050) 0%,#fff 62%); }
.hero::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(60% 60% at 88% 8%, rgba(43,116,208,.14), transparent 60%),
    radial-gradient(40% 40% at 6% 92%, rgba(227,90,16,.08), transparent 60%);
}
.hero-grid{
  position:relative; z-index:1;
  display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2rem,4vw,4rem); align-items:center;
  padding:clamp(2.4rem,5vw,4.5rem) 0 clamp(3rem,5vw,5rem);
}
.hero h1{ margin-bottom:.6rem; }
.hero h1 .accent{ color:var(--accent); }
.hero .lead{ margin-bottom:1.4rem; }
.hero-actions{ display:flex; flex-wrap:wrap; gap:.9rem; margin-bottom:1.5rem; }
.hero-meta{ display:flex; flex-wrap:wrap; gap:1.3rem; align-items:center; font-size:.92rem; color:var(--ink-soft); }
.hero-rating{ display:flex; align-items:center; gap:.5rem; font-weight:700; color:var(--brand-700); }
.stars{ color:var(--star); letter-spacing:1px; }
.entity-def{
  margin-top:1.5rem; padding:1.1rem 1.25rem; background:#fff; border:1px solid var(--line);
  border-left:4px solid var(--accent); border-radius:12px; font-size:.97rem; color:var(--ink-soft); box-shadow:var(--shadow-sm);
}
.hero-media{ position:relative; }
.hero-media img{ width:100%; border-radius:var(--radius-lg); box-shadow:var(--shadow-lg); aspect-ratio:3/2; object-fit:cover; }
.hero-badge{
  position:absolute; bottom:-18px; left:-18px; background:#fff; border:1px solid var(--line);
  border-radius:16px; padding:.9rem 1.1rem; box-shadow:var(--shadow); display:flex; gap:.7rem; align-items:center;
}
.hero-badge .num{ font-size:1.7rem; font-weight:900; color:var(--brand); line-height:1; }
.hero-badge .lbl{ font-size:.8rem; color:var(--ink-soft); line-height:1.2; }

/* ============================================================
   TRUST BAR
   ============================================================ */
.trust-bar{ background:var(--brand); color:#fff; }
.trust-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; padding:1.6rem 0; }
.trust-item{ display:flex; align-items:center; gap:.75rem; justify-content:center; text-align:left; }
.trust-item svg{ width:30px; height:30px; fill:none; stroke:var(--accent); stroke-width:2; flex:0 0 auto; }
.trust-item b{ display:block; font-size:1.15rem; color:#fff; line-height:1.1; }
.trust-item span{ font-size:.82rem; color:rgba(255,255,255,.78); }

/* ============================================================
   SERVICIOS
   ============================================================ */
.cards-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:1.4rem; }
.service-card{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:1.6rem;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease; position:relative; overflow:hidden;
  display:flex; flex-direction:column;
}
.service-card:hover{ transform:translateY(-5px); box-shadow:var(--shadow); border-color:var(--brand-050); }
.service-card.is-star{ background:linear-gradient(165deg,var(--brand),var(--brand-600)); border-color:transparent; color:#fff; }
.service-card.is-star h3,.service-card.is-star strong{ color:#fff; }
.service-card.is-star p{ color:rgba(255,255,255,.85); }
.service-icon{
  width:52px; height:52px; border-radius:14px; display:grid; place-items:center; margin-bottom:1rem;
  background:var(--brand-050); color:var(--brand-600);
}
.service-card.is-star .service-icon{ background:rgba(255,255,255,.16); color:#fff; }
.service-icon svg{ width:26px; height:26px; fill:none; stroke:currentColor; stroke-width:2; }
.service-card h3{ margin-bottom:.4rem; }
.service-card p{ color:var(--ink-soft); font-size:.95rem; flex:1; }
.service-card .card-link{ margin-top:1rem; font-weight:700; display:inline-flex; align-items:center; gap:.35rem; }
.service-card.is-star .card-link{ color:#fff; }
.star-tag{ position:absolute; top:1rem; right:1rem; font-size:.68rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; background:var(--accent); color:#fff; padding:.3em .7em; border-radius:100px; }

/* ============================================================
   TARJETAS DE ACCESO (imagen + overlay)
   ============================================================ */
.feature-cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:1.4rem; }
.feature-card{
  position:relative; border-radius:var(--radius); overflow:hidden; min-height:280px; display:flex; align-items:flex-end;
  color:#fff; box-shadow:var(--shadow-sm); isolation:isolate;
}
.feature-card img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; transition:transform .4s ease; }
.feature-card::after{ content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(0deg,rgba(11,29,54,.92) 8%,rgba(11,29,54,.35) 60%,rgba(11,29,54,.15)); }
.feature-card:hover img{ transform:scale(1.06); }
.feature-card .fc-body{ padding:1.5rem; }
.feature-card h3{ color:#fff; margin-bottom:.35rem; }
.feature-card p{ color:rgba(255,255,255,.85); font-size:.92rem; margin-bottom:.9rem; }

/* ============================================================
   VENTAJAS
   ============================================================ */
.adv-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:1.6rem; }
.adv-item{ display:flex; flex-direction:column; gap:.6rem; }
.adv-item .adv-ico{ width:48px; height:48px; border-radius:12px; background:var(--accent-050); color:var(--accent-600); display:grid; place-items:center; }
.adv-item .adv-ico svg{ width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:2; }
.adv-item h3{ font-size:1.15rem; }
.adv-item p{ color:var(--ink-soft); font-size:.95rem; margin:0; }

/* ============================================================
   EQUIPO / SOBRE NOSOTROS
   ============================================================ */
.team-grid{ display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(2rem,4vw,3.5rem); align-items:center; }
.team-photo{ position:relative; }
.team-photo img{ border-radius:var(--radius-lg); box-shadow:var(--shadow); aspect-ratio:1/1; object-fit:cover; width:100%; }
.team-sign{ margin-top:1.2rem; font-style:italic; color:var(--ink-soft); }
.team-sign b{ font-style:normal; display:block; color:var(--brand-700); }

/* ============================================================
   EDITORIAL / PROSE + TLDR + VS TABLE
   ============================================================ */
.editorial h2{ margin-top:2.4rem; }
.editorial h3{ margin-top:1.6rem; color:var(--brand-600); }
.tldr, .honest-box{
  background:var(--brand-025); border-left:4px solid var(--brand-600);
  padding:1rem 1.25rem; margin:1.4rem 0; border-radius:0 10px 10px 0;
}
.tldr .tldr-label{ font-weight:800; letter-spacing:.08em; font-size:.78rem; text-transform:uppercase; color:var(--brand-600); margin:0 0 .5rem; }
.tldr ul{ margin:0; padding-left:1.2rem; }
.tldr li{ font-size:.95rem; }
.callout-box{ background:var(--accent-050); border-left:4px solid var(--accent); padding:1rem 1.25rem; margin:1.4rem 0; border-radius:0 10px 10px 0; }
.warning-box{ background:#fef6f5; border-left:4px solid #d64545; padding:1rem 1.25rem; margin:1.4rem 0; border-radius:0 10px 10px 0; }

.vs-comparison{ margin:2rem 0; }
.table-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.vs-table{ width:100%; border-collapse:collapse; font-size:.95rem; margin:1rem 0; min-width:520px; }
.vs-table th,.vs-table td{ padding:.85rem 1rem; text-align:left; border-bottom:1px solid var(--line); }
.vs-table thead th{ background:var(--brand); color:#fff; font-weight:700; }
.vs-table thead th:first-child{ border-radius:10px 0 0 0; }
.vs-table thead th:last-child{ border-radius:0 10px 0 0; }
.vs-table tbody tr:nth-child(even){ background:var(--brand-025); }
.vs-table td:first-child{ font-weight:700; color:var(--brand-700); }

.check-list{ list-style:none; padding:0; }
.check-list li{ position:relative; padding-left:1.9rem; margin:.6rem 0; }
.check-list li::before{
  content:""; position:absolute; left:0; top:.15em; width:1.25rem; height:1.25rem; border-radius:50%;
  background:var(--brand-050) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231b5bb0' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/.8rem no-repeat;
}

/* ============================================================
   TESTIMONIOS
   ============================================================ */
.reviews-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:1.4rem; }
.review-card{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:1.6rem; box-shadow:var(--shadow-sm); }
.review-card .stars{ font-size:1.05rem; margin-bottom:.7rem; }
.review-card blockquote{ margin:0 0 1rem; font-size:.98rem; color:var(--ink); }
.review-author{ display:flex; align-items:center; gap:.75rem; }
.review-avatar{ width:44px; height:44px; border-radius:50%; background:linear-gradient(135deg,var(--brand),var(--brand-600)); color:#fff; display:grid; place-items:center; font-weight:800; flex:0 0 auto; }
.review-author b{ display:block; color:var(--brand-700); font-size:.95rem; }
.review-author span{ font-size:.82rem; color:var(--ink-faint); }

/* ============================================================
   FAQ
   ============================================================ */
.faq-list{ max-width:820px; margin-inline:auto; }
.faq-item{ border:1px solid var(--line); border-radius:14px; margin-bottom:.8rem; background:#fff; overflow:hidden; transition:box-shadow .2s ease; }
.faq-item[open]{ box-shadow:var(--shadow-sm); border-color:var(--brand-050); }
.faq-item summary{
  cursor:pointer; list-style:none; padding:1.15rem 1.3rem; font-weight:700; color:var(--brand-700);
  display:flex; justify-content:space-between; align-items:center; gap:1rem; font-size:1.02rem;
}
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::after{ content:"+"; font-size:1.5rem; font-weight:400; color:var(--accent); transition:transform .2s ease; line-height:1; }
.faq-item[open] summary::after{ transform:rotate(45deg); }
.faq-item .faq-body{ padding:0 1.3rem 1.25rem; color:var(--ink-soft); }
.faq-item .faq-body p:last-child{ margin-bottom:0; }

/* ============================================================
   CTA FINAL
   ============================================================ */
.cta-final{ background:linear-gradient(150deg,var(--brand-700),var(--brand-600)); color:#fff; border-radius:var(--radius-lg); padding:clamp(2.4rem,5vw,4rem); text-align:center; position:relative; overflow:hidden; }
.cta-final::before{ content:""; position:absolute; inset:0; background:radial-gradient(50% 80% at 80% 0%, rgba(227,90,16,.28), transparent 60%); }
.cta-final > *{ position:relative; z-index:1; }
.cta-final h2{ color:#fff; }
.cta-final p{ color:rgba(255,255,255,.88); max-width:52ch; margin-inline:auto; }
.cta-final .btn-row{ justify-content:center; margin-top:1.6rem; }

/* ============================================================
   ZONAS
   ============================================================ */
.zone-pills{ display:flex; flex-wrap:wrap; gap:.55rem; justify-content:center; max-width:960px; margin-inline:auto; }
.zone-pills a, .zone-pills span{
  display:inline-block; padding:.5rem 1rem; border:1px solid var(--line); border-radius:100px;
  font-size:.9rem; font-weight:600; color:var(--ink-soft); background:#fff; transition:.18s ease;
}
.zone-pills a:hover{ border-color:var(--brand-600); color:var(--brand-600); background:var(--brand-025); text-decoration:none; transform:translateY(-2px); }

/* ============================================================
   FORM (contacto)
   ============================================================ */
.form-card{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:clamp(1.5rem,3vw,2.4rem); box-shadow:var(--shadow-sm); }
.field{ margin-bottom:1.1rem; }
.field label{ display:block; font-weight:700; color:var(--brand-700); margin-bottom:.4rem; font-size:.95rem; }
.field input,.field select,.field textarea{
  width:100%; padding:.85rem 1rem; border:1.5px solid var(--line); border-radius:10px; font:inherit; color:var(--ink);
  background:#fff; transition:border-color .15s ease, box-shadow .15s ease;
}
.field input:focus,.field select:focus,.field textarea:focus{ outline:none; border-color:var(--brand-600); box-shadow:0 0 0 4px var(--brand-050); }
.field .hint{ font-size:.82rem; color:var(--ink-faint); margin-top:.35rem; }
.field textarea{ resize:vertical; min-height:130px; }
.form-note{ font-size:.82rem; color:var(--ink-faint); }

.info-list{ list-style:none; padding:0; margin:0; }
.info-list li{ display:flex; gap:.9rem; align-items:flex-start; padding:.9rem 0; border-bottom:1px solid var(--line-soft); }
.info-list .info-ico{ width:42px; height:42px; border-radius:11px; background:var(--brand-050); color:var(--brand-600); display:grid; place-items:center; flex:0 0 auto; }
.info-list .info-ico svg{ width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:2; }
.info-list b{ display:block; color:var(--brand-700); }
.info-list a{ color:var(--ink-soft); }

/* ============================================================
   BLOG
   ============================================================ */
.blog-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:2rem; }
.blog-card{ border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:#fff; transition:transform .2s ease, box-shadow .2s ease; }
.blog-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow); }
.blog-card > a{ text-decoration:none; color:inherit; display:block; }
.blog-card img{ width:100%; aspect-ratio:16/9; object-fit:cover; }
.blog-card__body{ padding:1.3rem; }
.blog-card__category{ display:inline-block; font-size:.72rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--accent-600); background:var(--accent-050); padding:.3em .7em; border-radius:100px; margin-bottom:.7rem; }
.blog-card__title{ font-size:1.2rem; margin:0 0 .5rem; color:var(--brand-700); }
.blog-card__excerpt{ color:var(--ink-soft); font-size:.94rem; margin:0 0 1rem; }
.blog-card__meta{ display:flex; gap:1rem; font-size:.82rem; color:var(--ink-faint); border-top:1px solid var(--line-soft); padding-top:.8rem; }
/* skeleton */
.skeleton{ pointer-events:none; }
.skeleton .sk{ background:linear-gradient(90deg,#eef2f7 25%,#e3e9f1 37%,#eef2f7 63%); background-size:400% 100%; animation:skpulse 1.4s ease infinite; border-radius:6px; }
.skeleton .sk-img{ aspect-ratio:16/9; width:100%; }
.skeleton .sk-body{ padding:1.3rem; }
.skeleton .sk-line{ height:.8rem; margin:.6rem 0; }
.skeleton .sk-line.short{ width:45%; }
.skeleton .sk-line.tall{ height:1.3rem; width:80%; }
@keyframes skpulse{ 0%{ background-position:100% 0; } 100%{ background-position:-100% 0; } }
.blog-empty{ text-align:center; padding:3rem 1rem; color:var(--ink-soft); grid-column:1/-1; }

/* ============================================================
   FOOTER
   ============================================================ */
.footer{ position:relative; background:linear-gradient(180deg,var(--brand-700),#0b2038); color:#c9d4e3; padding-top:3rem; margin-top:2rem; }
.footer::before{ content:""; position:absolute; top:0; left:0; right:0; height:4px; background:linear-gradient(90deg,var(--brand-600),var(--accent),var(--brand-600)); }
.footer a{ color:#c9d4e3; }
.footer a:hover{ color:#fff; }
.footer-grid{ display:grid; grid-template-columns:1.6fr 1fr 1.1fr 1fr; gap:2rem; padding-bottom:2.4rem; }
.footer h4{ color:#fff; font-size:.82rem; letter-spacing:.12em; text-transform:uppercase; margin:0 0 1rem; }
.footer .f-brand .brand{ color:#fff; margin-bottom:.9rem; }
.footer .f-brand .brand .brand-txt{ color:#fff; }
.footer .f-desc{ font-size:.9rem; line-height:1.7; color:#9fb0c5; max-width:34ch; }
.footer ul{ list-style:none; padding:0; margin:0; }
.footer ul li{ margin:.5rem 0; }
.footer ul a{ font-size:.92rem; }
.footer .f-contact li{ display:flex; gap:.6rem; align-items:flex-start; font-size:.92rem; }
.footer .f-contact svg{ width:18px; height:18px; fill:none; stroke:var(--accent); stroke-width:2; flex:0 0 auto; margin-top:3px; }
.footer-socials{ display:flex; gap:.6rem; margin-top:1rem; }
.footer-socials a{ width:40px; height:40px; border-radius:11px; border:1px solid rgba(255,255,255,.18); display:grid; place-items:center; transition:.18s ease; }
.footer-socials a:hover{ background:var(--brand-600); border-color:var(--brand-600); transform:translateY(-2px); }
.footer-socials svg{ width:19px; height:19px; fill:#c9d4e3; }
.footer-socials a:hover svg{ fill:#fff; }
.footer-bottom{ border-top:1px solid rgba(255,255,255,.12); padding:1.4rem 0; display:flex; flex-wrap:wrap; justify-content:space-between; gap:1rem; align-items:center; font-size:.85rem; color:#8fa1b8; }
.footer-bottom .f-legal{ display:flex; flex-wrap:wrap; gap:1.1rem; }

/* ============================================================
   WHATSAPP FLOAT
   ============================================================ */
@keyframes tmPulse{ 0%,100%{ box-shadow:0 0 0 0 rgba(37,211,102,.5); } 50%{ box-shadow:0 0 0 14px rgba(37,211,102,0); } }
.tm-whatsapp-float{
  position:fixed; bottom:24px; right:24px; z-index:999999; width:60px; height:60px; border-radius:50%;
  background:var(--wa); display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 20px rgba(37,211,102,.45); animation:tmPulse 2s infinite; transition:transform .2s ease;
}
.tm-whatsapp-float:hover{ transform:scale(1.1); }
.tm-whatsapp-float:focus-visible{ outline:3px solid var(--wa); outline-offset:3px; }
.tm-whatsapp-float svg{ width:33px; height:33px; fill:#fff; }
.updated{ text-align:center; color:var(--ink-faint); font-size:.85rem; padding-top:1rem; }

/* ============================================================
   SCROLL REVEAL
   ============================================================ */
.reveal{ opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease; }
.reveal.in{ opacity:1; transform:none; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:900px){
  .hero-grid{ grid-template-columns:1fr; }
  .hero-media{ order:-1; }
  .team-grid{ grid-template-columns:1fr; }
  .trust-grid{ grid-template-columns:repeat(2,1fr); gap:1.4rem; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:560px){
  .trust-grid{ grid-template-columns:1fr 1fr; }
  .footer-grid{ grid-template-columns:1fr; }
  .btn{ width:100%; }
  .hero-actions .btn, .cta-final .btn{ width:100%; }
  .hero-badge{ left:0; }
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  .reveal{ opacity:1; transform:none; }
  .tm-whatsapp-float{ animation:none; }
}