:root{color-scheme:light;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}html{scroll-padding-top:env(safe-area-inset-top,0px)}body{margin:0;padding:0;font:14px -apple-system,BlinkMacSystemFont,sans-serif;background:#faf9f5;color:#141413}img{max-width:100%}[hidden]:not([hidden=until-found i]){display:none!important}

  :root{
    --paper:#F7F4EC;
    --surface:#FFFFFF;
    --surface-2:#EFE9DB;
    --text:#1B2233;
    --text-soft:#4E5768;
    --navy:#071B33;
    --navy-2:#0F2A4D;
    --red:#FF3B3B;
    --red-strong:#DD2529;
    --agency:#4A6B8A;
    --agency-2:#577A9B;
    --on-inverse:#F4F1E9;
    --on-inverse-soft:#B9C3D6;
    --border:#E2DBCB;
    --ring:#FF3B3B;
    --shadow: 0 18px 40px -22px rgba(7,27,51,.35);
  }
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --paper:#0A1626;
      --surface:#101E33;
      --surface-2:#152A45;
      --text:#EDEAE0;
      --text-soft:#AEB8CC;
      --navy:#040D1A;
      --navy-2:#0B1F38;
      --red:#FF5A5A;
      --red-strong:#FF7A7A;
      --agency:#6D91B6;
      --agency-2:#85A0BD;
      --on-inverse:#F4F1E9;
      --on-inverse-soft:#B9C3D6;
      --border:rgba(237,234,224,.14);
      --ring:#FF5A5A;
      --shadow: 0 18px 44px -20px rgba(0,0,0,.55);
    }
  }
  :root[data-theme="dark"]{
    --paper:#0A1626;
    --surface:#101E33;
    --surface-2:#152A45;
    --text:#EDEAE0;
    --text-soft:#AEB8CC;
    --navy:#040D1A;
    --navy-2:#0B1F38;
    --red:#FF5A5A;
    --red-strong:#FF7A7A;
    --agency:#6D91B6;
    --agency-2:#85A0BD;
    --on-inverse:#F4F1E9;
    --on-inverse-soft:#B9C3D6;
    --border:rgba(237,234,224,.14);
    --ring:#FF5A5A;
    --shadow: 0 18px 44px -20px rgba(0,0,0,.55);
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--paper);
    color:var(--text);
    font-family:"Work Sans",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
    font-size:16px;
    line-height:1.55;
    -webkit-font-smoothing:antialiased;
  }
  img{max-width:100%; display:block;}
  a{color:inherit;}
  h1,h2,h3{
    font-family:"Fraunces",Georgia,serif;
    text-wrap:balance;
    color:var(--text);
    margin:0;
  }
  .wrap{max-width:1160px; margin:0 auto; padding-inline:24px;}
  section{padding-block:72px;}
  .eyebrow{
    font-size:.8rem;
    font-weight:600;
    letter-spacing:.09em;
    text-transform:uppercase;
    color:var(--red);
  }
  .btn{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:13px 24px;
    border-radius:100px;
    font-weight:600;
    font-size:.95rem;
    text-decoration:none;
    border:1px solid transparent;
    cursor:pointer;
    transition:transform .15s ease, box-shadow .15s ease, background-color .15s ease, color .15s ease;
  }
  .btn:focus-visible{outline:3px solid var(--ring); outline-offset:2px;}
  .btn-primary{background:var(--red); color:#fff;}
  .btn-primary:hover{background:var(--red-strong); transform:translateY(-1px);}
  .btn-ghost{background:transparent; color:var(--text); border-color:var(--border);}
  .btn-ghost:hover{border-color:var(--red); color:var(--red);}
  .btn-inverse{background:var(--on-inverse); color:var(--navy);}
  .btn-inverse:hover{background:#fff;}

  /* ---------- header ---------- */
  header{
    position:sticky; top:0; z-index:40;
    background:color-mix(in srgb, var(--paper) 88%, transparent);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--border);
  }
  header .wrap{
    display:flex; align-items:center; gap:20px;
    padding-block:12px;
  }
  .brand{display:flex; align-items:center; gap:10px; text-decoration:none; margin-right:auto;}

  /* logo: transparent, theme-aware (light navy mark / dark cream mark) */
  .logo-swap{position:relative; display:inline-block; line-height:0; flex:none;}
  .logo-swap img{display:block; width:100%; height:auto;}
  .logo-swap .lg-dark{display:none;}
  @media (prefers-color-scheme:dark){
    :root:not([data-theme="light"]) .logo-swap .lg-light{display:none;}
    :root:not([data-theme="light"]) .logo-swap .lg-dark{display:block;}
  }
  :root[data-theme="dark"] .logo-swap .lg-light{display:none;}
  :root[data-theme="dark"] .logo-swap .lg-dark{display:block;}
  .logo-icon{width:26px;}
  .brand-name{
    font-family:"Fraunces",serif;
    font-weight:600;
    font-size:1.05rem;
    color:var(--text);
    letter-spacing:-.01em;
    white-space:nowrap;
    display:flex;
    align-items:baseline;
    gap:.32em;
  }
  .brand-rotate-wrap{
    display:inline-block; position:relative; overflow:hidden;
    height:1.25em; vertical-align:bottom;
  }
  .brand-rotate{
    display:inline-block; color:var(--red);
    transition:opacity .3s ease, transform .3s ease, filter .3s ease;
  }
  .brand-rotate.switching{opacity:0; transform:translateY(7px); filter:blur(2px);}
  nav.primary-nav{display:flex; align-items:center; gap:26px;}
  nav.primary-nav a{
    font-size:.92rem; font-weight:500; text-decoration:none; color:var(--text-soft);
    white-space:nowrap;
  }
  nav.primary-nav a:hover{color:var(--text);}
  .langsel{
    display:flex; border:1px solid var(--border); border-radius:100px; padding:3px; gap:2px; flex:none;
  }
  .langsel button{
    border:none; background:transparent; padding:6px 11px; border-radius:100px;
    font-size:.78rem; font-weight:600; letter-spacing:.03em; color:var(--text-soft); cursor:pointer;
  }
  .langsel button[aria-pressed="true"]{background:var(--navy); color:var(--on-inverse);}
  .header-cta{flex:none;}
  @media (max-width:1000px){
    nav.primary-nav{display:none;}
  }
  @media (max-width:560px){
    .header-cta{display:none;}
  }
  @media (max-width:400px){
    header .wrap{gap:10px;}
    .brand-name{font-size:.85rem;}
    .logo-icon{width:22px;}
    .langsel{padding:2px; gap:0;}
    .langsel button{padding:5px 7px; font-size:.68rem;}
  }

  /* ---------- hero (full-bleed photo, text pinned left) ---------- */
  .hero{
    position:relative; overflow:hidden; isolation:isolate;
    min-height:min(86vh,720px); display:flex; align-items:flex-end;
    padding-block:64px 56px;
  }
  .hero-photo{position:absolute; inset:0; z-index:-2;}
  .hero-photo img{width:100%; height:100%; object-fit:cover; display:block;}
  .hero-overlay{
    position:absolute; inset:0; z-index:-1;
    background:
      linear-gradient(100deg, rgba(4,13,26,.88) 0%, rgba(4,13,26,.72) 32%, rgba(4,13,26,.32) 62%, rgba(4,13,26,.12) 100%),
      linear-gradient(0deg, rgba(4,13,26,.55) 0%, rgba(4,13,26,0) 45%);
  }
  .hero .wrap{position:relative; max-width:1160px; margin-left:0; margin-right:auto;}
  .hero-content{max-width:620px; margin-left:0;}
  .hero .eyebrow{color:var(--red);}
  .hero h1{
    font-size:clamp(2.1rem, 4vw, 3.15rem); font-weight:600; line-height:1.08; margin-top:14px;
    color:#fff;
  }
  .hero p.lead{font-size:1.08rem; color:rgba(255,255,255,.88); max-width:46ch; margin-top:20px;}
  .hero-chips{display:flex; flex-wrap:wrap; gap:10px; margin-top:26px;}
  .chip{
    display:inline-flex; align-items:center; gap:8px;
    background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.28);
    -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
    padding:9px 15px; border-radius:100px; font-size:.85rem; font-weight:500; color:#fff;
  }
  .chip svg{width:15px; height:15px; color:var(--red); flex:none;}
  .btn-outline-light{background:transparent; color:#fff; border-color:rgba(255,255,255,.6);}
  .btn-outline-light:hover{border-color:#fff; background:rgba(255,255,255,.12);}
  @media (max-width:900px){
    .hero{min-height:auto; padding-block:52px 44px;}
  }

  /* ---------- path split ---------- */
  .paths{padding-block:64px 88px;}
  .paths h2{font-size:1.5rem; font-weight:600; margin-bottom:28px;}
  .path-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
  .path-card{
    position:relative; overflow:hidden;
    border-radius:22px; padding:34px 30px;
    text-decoration:none; display:flex; flex-direction:column; gap:14px;
    border:1px solid var(--border);
    transition:transform .18s ease, box-shadow .18s ease;
  }
  .path-card:hover{transform:translateY(-3px); box-shadow:var(--shadow);}
  .path-card.families{background:var(--surface);}
  .path-card.schools{background:var(--navy); border-color:var(--navy); color:var(--on-inverse);}
  .path-card.schools h3, .path-card.schools p{color:var(--on-inverse);}
  .path-card.schools p{color:var(--on-inverse-soft);}
  .path-card.agencies{background:var(--agency); border-color:var(--agency); color:var(--on-inverse);}
  .path-card.agencies h3, .path-card.agencies p{color:var(--on-inverse);}
  .path-card.agencies p{color:var(--on-inverse-soft);}
  .path-icon{
    width:46px; height:46px; border-radius:13px; display:grid; place-items:center; flex:none;
  }
  .path-card.families .path-icon{background:var(--surface-2); color:var(--red);}
  .path-card.schools .path-icon{background:rgba(244,241,233,.12); color:var(--on-inverse);}
  .path-card.agencies .path-icon{background:rgba(244,241,233,.12); color:var(--on-inverse);}
  .path-icon svg{width:24px; height:24px;}
  .path-card h3{font-size:1.3rem; font-weight:600;}
  .path-card p{color:var(--text-soft); font-size:.96rem; max-width:38ch;}
  .path-cta{
    margin-top:6px; display:inline-flex; align-items:center; gap:7px; font-weight:600; font-size:.92rem;
  }
  .path-cta svg{width:16px; height:16px; transition:transform .15s ease;}
  .path-card:hover .path-cta svg{transform:translateX(3px);}
  @media (max-width:960px){ .path-grid{grid-template-columns:1fr;} }

  /* ---------- section heads ---------- */
  .section-head{max-width:62ch; margin-bottom:44px;}
  .section-head h2{font-size:clamp(1.6rem,2.6vw,2.15rem); font-weight:600; margin-top:10px;}
  .section-head p{color:var(--text-soft); margin-top:14px; font-size:1.03rem;}

  /* ---------- program cards (illustrated) ---------- */
  .cards3{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
  .prog-card{
    background:var(--surface); border:1px solid var(--border); border-radius:20px; overflow:hidden;
    display:flex; flex-direction:column;
    transition:transform .2s ease, box-shadow .2s ease;
  }
  .prog-card:hover{transform:translateY(-4px); box-shadow:var(--shadow);}
  .prog-media{position:relative; aspect-ratio:16/10; overflow:hidden; background:var(--navy);}
  .prog-media svg, .prog-media img{width:100%; height:100%; display:block; object-fit:cover;}
  .prog-body{padding:24px; display:flex; flex-direction:column; gap:12px; flex:1;}
  .prog-card h3{font-size:1.15rem; font-weight:600;}
  .prog-card p{color:var(--text-soft); font-size:.95rem; flex:1;}
  .tag-row{display:flex; gap:8px; flex-wrap:wrap;}
  .tag{
    font-size:.72rem; font-weight:600; letter-spacing:.03em; text-transform:uppercase;
    background:var(--surface-2); color:var(--text-soft); padding:5px 10px; border-radius:100px;
  }
  @media (max-width:900px){
    .cards3{grid-template-columns:1fr;}
  }

  /* ---------- trust strip ---------- */
  .trust{margin-top:40px; padding-top:32px; border-top:1px solid var(--border);}
  .trust h3.trust-h{font-size:1.2rem; font-weight:600; margin-bottom:26px;}
  .trust-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:30px;}
  .trust-item{display:flex; gap:16px;}
  .trust-item svg{width:28px; height:28px; color:var(--red); flex:none; margin-top:2px;}
  .trust-item h4{font-size:1.1rem; font-weight:600; margin:0 0 5px;}
  .trust-item p{color:var(--text-soft); font-size:1rem; margin:0;}
  @media (max-width:760px){ .trust-grid{grid-template-columns:1fr;} }

  /* ---------- colegios (inverse band) ---------- */
  .band{background:var(--navy); color:var(--on-inverse);}
  #agencias.band{background:var(--agency); border-top:1px solid rgba(244,241,233,.16);}
  #agencias.band .b2b-point p{color:var(--on-inverse-soft);}
  #agencias.band .section-head p{color:var(--on-inverse-soft);}
  #agencias.band .b2b-card{background:rgba(244,241,233,.08); border-color:rgba(244,241,233,.18);}
  #agencias.band .b2b-card p{color:var(--on-inverse-soft);}
  .band .eyebrow{color:var(--red);}
  .band h2{color:var(--on-inverse);}
  .band .section-head p{color:var(--on-inverse-soft);}
  .b2b-visual-grid{display:grid; grid-template-columns:1fr 1.1fr; gap:44px; align-items:center; margin-bottom:40px;}
  .b2b-illustration{border-radius:20px; overflow:hidden; aspect-ratio:4/3; box-shadow:var(--shadow);}
  .b2b-illustration svg, .b2b-illustration img{width:100%; height:100%; display:block; object-fit:cover;}
  .b2b-points{display:flex; flex-direction:column; gap:26px;}
  .b2b-point{display:flex; gap:16px;}
  .b2b-point .num{
    font-family:"Fraunces",serif; font-weight:600; font-size:1.1rem; color:var(--red);
    width:30px; flex:none;
  }
  .b2b-point h4{font-size:1.02rem; font-weight:600; margin:0 0 5px; color:var(--on-inverse);}
  .b2b-point p{color:var(--on-inverse-soft); font-size:.94rem; margin:0;}
  .b2b-card{
    background:rgba(244,241,233,.06); border:1px solid rgba(244,241,233,.16);
    border-radius:20px; padding:30px; display:flex; flex-direction:column; gap:18px;
  }
  .b2b-card .flag{
    align-self:flex-start; font-size:.72rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase;
    background:var(--red); color:#fff; padding:6px 12px; border-radius:100px;
  }
  .section-badge{
    display:inline-flex; font-size:.72rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase;
    background:var(--red); color:#fff; padding:6px 12px; border-radius:100px; margin-top:12px;
  }
  .b2b-card h3{color:var(--on-inverse); font-size:1.25rem; font-weight:600;}
  .b2b-card p{color:var(--on-inverse-soft); font-size:.95rem;}
  @media (max-width:900px){ .b2b-visual-grid{grid-template-columns:1fr;} }

  /* ---------- nosotros ---------- */
  .founders{display:grid; grid-template-columns:1fr 1fr; gap:22px;}
  .founder-card{
    background:var(--surface); border:1px solid var(--border); border-radius:20px; padding:28px;
    display:flex; flex-direction:column; gap:18px;
  }
  .founder-head{display:flex; align-items:center; gap:18px;}
  .founder-photo{
    width:84px; height:84px; border-radius:50%; flex:none;
    object-fit:cover; display:block; box-shadow:var(--shadow);
  }
  .founder-card h4{font-size:1.05rem; font-weight:600; margin:0 0 3px;}
  .founder-role{color:var(--text-soft); font-size:.88rem; margin:0;}
  .founder-bio{color:var(--text-soft); font-size:.92rem; line-height:1.62; margin:0;}
  @media (max-width:700px){ .founders{grid-template-columns:1fr;} }

  /* ---------- contacto ---------- */
  .contact-card{
    background:var(--surface); border:1px solid var(--border); border-radius:26px;
    padding:52px 40px;
  }
  .contact-head{text-align:center; max-width:60ch; margin:0 auto 40px; display:flex; flex-direction:column; align-items:center; gap:14px;}
  .contact-head h2{font-size:clamp(1.5rem,2.4vw,2rem); font-weight:600;}
  .contact-head p{color:var(--text-soft); max-width:48ch;}
  .req{color:var(--red); margin-left:2px;}

  .contact-form{display:flex; flex-direction:column; gap:18px; max-width:640px; margin:0 auto;}
  .form-row{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
  .form-field{display:flex; flex-direction:column; gap:6px;}
  .form-field label{font-size:.85rem; font-weight:600; color:var(--text);}
  .form-field input, .form-field textarea{
    font:inherit; font-size:.95rem; padding:12px 14px; border-radius:12px;
    border:1px solid var(--border); background:var(--paper); color:var(--text);
    transition:border-color .15s ease, box-shadow .15s ease;
  }
  .form-field input:focus, .form-field textarea:focus{
    outline:none; border-color:var(--red); box-shadow:0 0 0 3px color-mix(in srgb, var(--red) 20%, transparent);
  }
  .form-field textarea{resize:vertical; min-height:120px;}
  .consent-block{display:flex; flex-direction:column; gap:14px; padding-top:18px; margin-top:4px; border-top:1px solid var(--border);}
  .consent-note{font-size:.82rem; color:var(--text-soft); line-height:1.5; margin:0;}
  .consent-check{display:flex; gap:10px; align-items:flex-start; font-size:.85rem; color:var(--text-soft); line-height:1.4; cursor:pointer;}
  .consent-check input[type=checkbox]{margin-top:3px; width:16px; height:16px; accent-color:var(--red); flex:none;}
  .consent-privacy{font-size:.78rem; color:var(--text-soft); margin:0;}
  .form-submit{align-self:flex-start;}
  @media (max-width:600px){ .form-row{grid-template-columns:1fr;} .contact-card{padding:36px 22px;} }

  /* ---------- HubSpot form (embed real, para cuando la web viva en hosting definitivo) ----------
     Sustituir el <form class="contact-form">...</form> de abajo por:
       <script src="https://js-eu1.hsforms.net/forms/embed/149301953.js" defer></script>
       <div class="hs-form-frame" data-region="eu1" data-form-id="012f54a5-40e6-4860-ba87-a79e22791269" data-portal-id="149301953"></div>
     Estas reglas reproducen el mismo estilo sobre el formulario real de HubSpot. Verificar selectores
     una vez renderizado el formulario real: la estructura exacta puede variar ligeramente. */
  .hs-form-frame, .hs-form{display:flex; flex-direction:column; gap:18px; max-width:640px; margin:0 auto; font-family:"Work Sans",system-ui,sans-serif;}
  .hs-form fieldset{max-width:100%;}
  .hs-form .hs-form-field{display:flex; flex-direction:column; gap:6px; margin-bottom:0;}
  .hs-form label{font-size:.85rem; font-weight:600; color:var(--text);}
  .hs-form input[type=text], .hs-form input[type=email], .hs-form input[type=tel], .hs-form textarea, .hs-form select{
    font:inherit; font-size:.95rem; padding:12px 14px; border-radius:12px;
    border:1px solid var(--border); background:var(--paper); color:var(--text); width:100%;
  }
  .hs-form input:focus, .hs-form textarea:focus{outline:none; border-color:var(--red); box-shadow:0 0 0 3px color-mix(in srgb, var(--red) 20%, transparent);}
  .hs-form textarea{resize:vertical; min-height:120px;}
  .hs-form .hs-button, .hs-form input[type=submit]{
    font-family:"Work Sans",sans-serif; font-weight:600; font-size:.95rem; padding:13px 24px; border-radius:100px;
    background:var(--red); color:#fff; border:none; cursor:pointer; align-self:flex-start;
  }
  .hs-form .hs-button:hover{background:var(--red-strong);}
  .hs-form .legal-consent-container, .hs-form .hs-richtext{font-size:.82rem; color:var(--text-soft); line-height:1.5;}
  .hs-form .hs-form-booleancheckbox-display{display:flex; gap:10px; align-items:flex-start; font-size:.85rem; color:var(--text-soft);}
  .hs-form .hs-form-booleancheckbox-display input{margin-top:3px; width:16px; height:16px; accent-color:var(--red); flex:none;}
  .hs-form .hs-error-msgs{color:var(--red-strong); font-size:.8rem; list-style:none; padding:0; margin:2px 0 0;}
  .hs-form .hs-error-msgs label{color:var(--red-strong); font-weight:500;}

  /* ---------- footer ---------- */
  footer{border-top:1px solid var(--border); padding-block:40px;}
  footer .wrap{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:20px;}
  .foot-brand{display:flex; align-items:center; gap:12px;}
  .foot-brand .logo-icon{width:22px;}
  .foot-tag{font-size:.85rem; color:var(--text-soft); font-style:italic; font-family:"Fraunces",serif;}
  .foot-links{display:flex; gap:22px; flex-wrap:wrap;}
  .foot-links a{font-size:.88rem; color:var(--text-soft); text-decoration:none;}
  .foot-links a:hover{color:var(--red);}
  .foot-social{display:flex; align-items:center; gap:14px;}
  .foot-social a{
    color:var(--text-soft); display:inline-flex; align-items:center; justify-content:center;
    width:34px; height:34px; border-radius:50%; border:1px solid var(--border);
    transition:color .15s ease, border-color .15s ease;
  }
  .foot-social a:hover{color:var(--red); border-color:var(--red);}
  .foot-social svg{width:17px; height:17px;}
  .foot-meta{font-size:.8rem; color:var(--text-soft); width:100%; padding-top:22px; margin-top:22px; border-top:1px solid var(--border); display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}


  /* ---------- trust bar ---------- */
  .trustbar{background:var(--surface); border-bottom:1px solid var(--border); border-top:1px solid var(--border);}
  .trustbar .wrap{
    display:grid; grid-template-columns:repeat(4,1fr); gap:20px;
    padding-block:32px;
  }
  .trust-stat{display:flex; align-items:center; gap:14px;}
  .trust-stat svg{width:30px; height:30px; color:var(--red); flex:none;}
  .trust-stat .num{
    font-family:"Fraunces",serif; font-weight:700; font-size:1.75rem; color:var(--text); line-height:1;
  }
  .trust-stat .num.plain{font-size:1.15rem; font-weight:600; font-family:"Work Sans",sans-serif;}
  .trust-stat .lbl{font-size:.92rem; color:var(--text-soft); line-height:1.3; margin-top:4px;}
  @media (max-width:900px){ .trustbar .wrap{grid-template-columns:1fr 1fr;} }
  @media (max-width:520px){ .trustbar .wrap{grid-template-columns:1fr;} }

  /* ---------- seguridad / logistics ---------- */
  .safety-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:22px;}
  .safety-item{
    background:var(--surface); border:1px solid var(--border); border-radius:20px; padding:26px;
    display:flex; gap:16px;
  }
  .safety-item .ic{
    width:46px; height:46px; border-radius:13px; background:var(--surface-2); color:var(--red);
    display:grid; place-items:center; flex:none;
  }
  .safety-item .ic svg{width:23px; height:23px;}
  .safety-item h4{font-size:1.02rem; font-weight:600; margin:0 0 6px;}
  .safety-item p{color:var(--text-soft); font-size:.92rem; margin:0;}
  @media (max-width:760px){ .safety-grid{grid-template-columns:1fr;} }

  /* ---------- hub (EF-style: 4 blocks for families) ---------- */
  .hub-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
  .hub-card{
    background:var(--surface); border:1px solid var(--border); border-radius:20px; padding:26px 22px;
    text-decoration:none; display:flex; flex-direction:column; gap:12px;
    transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  }
  .hub-card:hover{transform:translateY(-3px); box-shadow:var(--shadow); border-color:var(--red);}
  .hub-card .ic{
    width:42px; height:42px; border-radius:12px; background:var(--surface-2); color:var(--red);
    display:grid; place-items:center;
  }
  .hub-card .ic svg{width:21px; height:21px;}
  .hub-card h4{font-size:1rem; font-weight:600; margin:0;}
  .hub-card p{color:var(--text-soft); font-size:.88rem; margin:0;}
  .hub-card .go{
    margin-top:auto; font-size:.82rem; font-weight:600; color:var(--red);
    display:inline-flex; align-items:center; gap:5px;
  }
  .hub-card .go svg{width:13px; height:13px;}
  @media (max-width:900px){ .hub-grid{grid-template-columns:1fr 1fr;} }
  @media (max-width:520px){ .hub-grid{grid-template-columns:1fr;} }

  /* ---------- galería documental ---------- */
  .gallery-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:12px;}
  .gallery-item{border-radius:16px; overflow:hidden; aspect-ratio:1/1; position:relative;}
  .gallery-item svg, .gallery-item img{width:100%; height:100%; display:block; object-fit:cover;}
  .gallery-item .mark{
    position:absolute; inset:auto 8px 8px auto; background:rgba(7,27,51,.72); color:#fff;
    font-size:.62rem; font-weight:600; letter-spacing:.03em; padding:4px 8px; border-radius:100px;
  }
  @media (max-width:520px){ .gallery-grid{gap:6px;} }

  /* ---------- WhatsApp flotante ---------- */
  .wa-float{
    position:fixed; right:20px; bottom:20px; z-index:50;
    width:56px; height:56px; border-radius:50%;
    background:#25D366; color:#fff; display:grid; place-items:center;
    box-shadow:0 12px 26px -8px rgba(0,0,0,.4); text-decoration:none;
  }
  .wa-float svg{width:28px; height:28px;}
  .wa-float::before{
    content:""; position:absolute; inset:0; border-radius:50%; background:#25D366;
    animation:wa-pulse 2.4s ease-out infinite; z-index:-1;
  }
  @keyframes wa-pulse{
    0%{transform:scale(1); opacity:.55;}
    100%{transform:scale(1.9); opacity:0;}
  }
  @media (prefers-reduced-motion: reduce){ .wa-float::before{animation:none;} }

  /* ---------- footer trust chips ---------- */
  .foot-trust{display:flex; gap:10px; flex-wrap:wrap; margin-top:16px;}
  .foot-trust span{
    font-size:.72rem; font-weight:600; color:var(--text-soft); background:var(--surface-2);
    padding:6px 12px; border-radius:100px; border:1px solid var(--border);
  }

  ::selection{background:var(--red); color:#fff;}

/* Enlaces legales y nota bajo el formulario */
.foot-meta a{color:inherit; text-decoration:none;}
.foot-meta a:hover{color:var(--red);}
.form-legal-note{max-width:640px; margin:14px auto 0; text-align:center;}
.form-legal-note a{color:var(--red-strong); text-decoration:underline;}
