:root{
      --navy:#003473;
      --navy-2:#003473;
      --turq:#FFF0D9;
      --turq-dark:#003473;
      --text:#163150;
      --muted:#64748b;
      --bg:#f7fbfd;
      --line:#dbe7ef;
      --white:#fff;
      --shadow:0 14px 40px rgba(12,45,90,.10);
      --radius:18px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
      color:var(--text);
      background:#fff;
      line-height:1.55;
    }
    img{max-width:100%;display:block}
    a{text-decoration:none;color:inherit}
    button,input,textarea{font:inherit}
    .container{width:min(1180px,calc(100% - 40px));margin:auto}
    .eyebrow{font-size:.85rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--turq-dark)}
    h1,h2,h3{line-height:1.08;margin:0}
    h1{font-size:44px;letter-spacing:-.04em}
    h2{font-size:clamp(2rem,3.6vw,3rem);letter-spacing:-.035em}
    h3{font-size:1.1rem}
    p{margin:0;color:var(--muted)}
    .section{padding:88px 0}
    .section-title{text-align:center;max-width:760px;margin:0 auto 42px}
    .section-title p{margin-top:14px;font-size:1.05rem}

    /* Header */
    .header{
      position:sticky;top:0;z-index:50;
      background:rgba(0,52,115,.97);
      backdrop-filter:blur(12px);
      color:#fff;
      border-bottom:1px solid rgba(255,255,255,.08);
    }
    .header-inner{height:78px;display:flex;align-items:center;gap:28px}
    .logo{display:flex;align-items:center;min-width:210px}.logo img{display:block;filter:none}
    .logo-mark{width:38px;height:38px;border:2px solid #fff;border-radius:10px;display:grid;place-items:center}
    .nav{display:flex;gap:26px;margin-left:auto;font-size:.92rem}
    .nav a{opacity:.88}
    .nav a:hover{opacity:1}
    

    /* Hero */
    .hero{
      min-height:690px;
      display:flex;align-items:center;
      position:relative;overflow:hidden;
      background:
        linear-gradient(90deg,#fff 0%,#fff 43%,rgba(255,255,255,.78) 57%,rgba(255,255,255,.03) 100%),
        url('../images/recurso-04.webp') center 48%/cover no-repeat;
    }
    .hero::after{
      content:"";position:absolute;inset:auto 0 0 0;height:1px;background:var(--line)
    }
    .hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:50px}
    .hero-copy{padding:70px 0}
    .hero-copy h1{color:var(--navy);max-width:760px;line-height:1.03}
    .hero-copy h1 span{color:var(--turq-dark)}
    .hero-copy>p{font-size:1.12rem;max-width:680px;margin-top:24px}
    .hero-badges{display:flex;flex-wrap:wrap;gap:12px;margin:30px 0}
    .badge{
      display:flex;align-items:center;gap:10px;
      padding:10px 13px;border:1px solid #dce9ef;background:rgba(255,255,255,.85);
      border-radius:999px;font-size:.88rem;font-weight:700;color:var(--navy)
    }
    .icon{
      width:34px;height:34px;border-radius:50%;background:#FFF0D9;
      color:var(--turq-dark);display:grid;place-items:center;font-weight:900
    }
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
    .btn{
      display:inline-flex;align-items:center;justify-content:center;gap:10px;
      padding:15px 20px;border-radius:10px;font-weight:800;border:1px solid transparent;
      transition:.2s ease;cursor:pointer
    }
    .btn-primary{background:var(--navy);color:#fff}
    .btn-primary:hover{transform:translateY(-2px);background:#09264d}
    .btn-outline{border-color:var(--navy);color:var(--navy);background:#fff}
    .btn-turq{background:var(--turq);color:#07325a}
    .hero-form{
      background:#fff;border-radius:18px;padding:26px;box-shadow:0 28px 70px rgba(8,37,76,.2);
      border:1px solid rgba(12,45,90,.08);max-width:430px;margin-left:auto
    }
    .hero-form h3{font-size:1.35rem;color:var(--navy)}
    .hero-form small{display:block;color:var(--muted);margin:5px 0 18px}
    label{display:block;font-size:.82rem;font-weight:700;color:var(--text);margin:10px 0 6px}
    input,textarea{
      width:100%;border:1px solid #cfdae3;border-radius:9px;padding:12px 13px;background:#fff;
      color:var(--text);outline:none
    }
    input:focus,textarea:focus{border-color:var(--turq-dark);box-shadow:0 0 0 3px rgba(44,201,189,.12)}
    .form-note{font-size:.78rem;color:var(--muted);margin-top:10px}

    .trustbar{background:var(--navy);color:#fff}
    .trustbar .container{display:grid;grid-template-columns:repeat(4,1fr)}
    .trust-item{padding:17px;text-align:center;border-right:1px solid rgba(255,255,255,.13);font-size:.88rem}
    .trust-item:last-child{border-right:0}

    /* Cards */
    .cards-3,.cards-4,.cards-6{display:grid;gap:18px}
    .cards-3{grid-template-columns:repeat(3,1fr)}
    .cards-4{grid-template-columns:repeat(4,1fr)}
    .cards-6{grid-template-columns:repeat(6,1fr)}
    .card{
      border:1px solid var(--line);background:#fff;border-radius:var(--radius);
      padding:28px;box-shadow:0 8px 28px rgba(12,45,90,.05)
    }
    .card .icon{margin-bottom:18px}
    .card p{margin-top:10px}
    .link{display:inline-block;color:var(--turq-dark);font-weight:800;margin-top:16px}

    /* Process */
    .process{background:linear-gradient(180deg,#fff,#f7fbfd)}
    .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;position:relative}
    .step{text-align:center;padding:14px 24px}
    .step-number{
      width:42px;height:42px;border-radius:50%;display:grid;place-items:center;margin:0 auto 14px;
      background:var(--turq);color:#fff;font-weight:900
    }
    .step p{margin-top:10px}
    .stat-banner{
      margin-top:45px;padding:28px 34px;border-radius:16px;background:#fff8ee;border:1px solid #f2dfc3;
      display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:28px
    }
    .stat{font-size:4rem;line-height:1;font-weight:900;color:var(--turq-dark)}
    .stat-copy strong{display:block;font-size:1.35rem;color:var(--navy)}

    /* Gallery */
    .gallery-card{overflow:hidden;border:1px solid var(--line);border-radius:15px;background:#fff;box-shadow:0 8px 24px rgba(12,45,90,.06)}
    .gallery-card img{height:220px;width:100%;object-fit:cover}
    .gallery-card div{padding:18px}
    .gallery-card p{font-size:.9rem;margin-top:7px}

    /* Reasons */
    .reason{text-align:center;padding:12px}
    .reason .icon{margin:0 auto 13px}
    .reason p{font-size:.88rem;margin-top:7px}

    /* Team */
    .team-card{padding:18px;display:flex;gap:15px;align-items:center}
    .team-card img{width:76px;height:76px;border-radius:50%;object-fit:cover}
    .team-card small{color:var(--turq-dark);font-weight:800;display:block;margin:4px 0}

    /* Family */
    .family-wrap{
      display:grid;grid-template-columns:1.05fr .95fr;background:#f3f9fb;border-radius:22px;
      overflow:hidden;border:1px solid var(--line)
    }
    .family-img{
      min-height:360px;
      background:url("../images/recurso-01.webp") center top/cover no-repeat;
    }
    .family-copy{padding:46px}
    .family-copy p{margin:15px 0 24px}
    .family-points{display:grid;gap:12px;margin-top:26px}
    .family-point{background:#fff;border:1px solid var(--line);border-radius:11px;padding:14px 16px;font-weight:700;color:var(--navy)}


    .team-feature{
      display:grid;grid-template-columns:1.15fr .85fr;gap:30px;align-items:stretch;
      border:1px solid var(--line);border-radius:22px;overflow:hidden;background:#fff;
      box-shadow:0 10px 32px rgba(12,45,90,.07)
    }
    .team-visual{min-height:430px;background:#eef4f7}
    .team-visual img{width:100%;height:100%;object-fit:cover}
    .team-content{padding:44px;display:flex;flex-direction:column;justify-content:center}
    .team-content h3{font-size:1.8rem;margin-top:9px;color:var(--navy)}
    .team-content p{margin:16px 0 20px}
    .team-role-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
    .press-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
    .press-card{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 7px 22px rgba(12,45,90,.05)}
    .press-card img{width:100%;height:190px;object-fit:cover;object-position:top}
    .press-card div{padding:14px 15px;font-weight:800;color:var(--navy);font-size:.9rem}

    /* Reviews */
    .review{padding:24px}
    .stars{color:#f6a600;font-size:1.15rem;letter-spacing:.05em}
    .review p{margin:16px 0}
    .review strong{font-size:.9rem}

    /* Media */
    .media-row{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
    .media-logo{
      min-height:72px;border:1px solid var(--line);border-radius:12px;display:grid;place-items:center;
      font-weight:900;color:var(--navy);background:#fff
    }

    /* Footer CTA */
    .final-cta{background:linear-gradient(135deg,#003473,#00295c);color:#fff}
    .final-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:60px;align-items:start}
    .final-cta h2{color:#fff}
    .final-cta p{color:#d6e1ed;margin-top:16px}
    .final-points{display:grid;gap:10px;margin-top:26px;color:#d9e5ef}
    .final-form{display:grid;grid-template-columns:1fr 1fr;gap:12px}
    .final-form .full{grid-column:1/-1}
    .final-form label{color:#fff}
    .footer{background:#00295c;color:#b7c8db;padding:22px 0}
    .footer-inner{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:.85rem}

    @media (max-width:980px){
      .nav{display:none}
      .hero{background:
        linear-gradient(180deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.93) 58%,rgba(255,255,255,.38) 100%),
        url('../images/recurso-04.webp') center/cover no-repeat}
      .hero-grid,.family-wrap,.final-grid,.team-feature{grid-template-columns:1fr}
      .hero-form{margin:0;max-width:100%}
      .trustbar .container{grid-template-columns:1fr 1fr}
      .cards-3,.cards-4{grid-template-columns:1fr 1fr}
      .cards-6{grid-template-columns:repeat(3,1fr)}
      .steps{grid-template-columns:1fr}
      .stat-banner{grid-template-columns:1fr;text-align:center}
      .media-row{grid-template-columns:repeat(3,1fr)}
      .press-grid{grid-template-columns:1fr 1fr}
    }
    @media (max-width:640px){
      .container{width:min(100% - 28px,1180px)}
      .section{padding:62px 0}
      .header-inner{height:68px}
      .header-cta-wrap{justify-content:flex-end;gap:8px}.contact-pill{min-height:44px;padding:0 14px;font-size:.82rem}.contact-pill-hero{min-height:54px;padding:0 20px;font-size:.95rem}
      .hero{min-height:auto}
      .hero-copy{padding:54px 0 24px}
      .hero-grid{gap:24px;padding-bottom:38px}
      .hero-actions .btn{width:100%}
      .hero-actions .contact-pill{width:100%}
      .header-cta-wrap{gap:7px}
      .header-cta-wrap .contact-pill{min-height:42px;padding:0 12px;font-size:.76rem}
      .header-cta-wrap .pill-icon{width:20px;height:20px;flex-basis:20px;font-size:1em}
      .trustbar .container,.cards-3,.cards-4,.cards-6,.media-row,.press-grid,.team-role-grid{grid-template-columns:1fr}
      .trust-item{border-right:0;border-bottom:1px solid rgba(255,255,255,.1)}
      .gallery-card img{height:210px}
      .family-copy{padding:30px 24px}
      .final-form{grid-template-columns:1fr}
      .final-form .full{grid-column:auto}
    }
  
    /* Contact buttons: pill style with subtle pulse */
    .header-cta-wrap{
      display:flex !important;
      gap:12px;
      margin-left:auto;
      align-items:center;
      flex-shrink:0;
    }
    .contact-pill{
      position:relative;
      display:inline-flex !important;
      align-items:center;
      justify-content:center;
      gap:11px;
      min-height:50px;
      padding:0 22px;
      border-radius:999px;
      color:#fff !important;
      font-weight:800;
      font-size:.94rem;
      line-height:1;
      white-space:nowrap;
      z-index:1;
      text-decoration:none !important;
      box-shadow:0 8px 18px rgba(4,28,58,.15);
      transition:transform .22s ease,box-shadow .22s ease,filter .22s ease;
      animation:buttonPulse 2.8s ease-in-out infinite;
    }
    .contact-pill i{
      font-size:1.18rem;
      line-height:1;
      width:21px;
      text-align:center;
    }
    .contact-pill:hover{
      transform:translateY(-2px);
      box-shadow:0 12px 24px rgba(4,28,58,.20);
      filter:brightness(1.02);
      animation-play-state:paused;
    }
    .contact-pill:active{
      transform:translateY(0) scale(.99);
    }
    .contact-pill-wa{
      background:linear-gradient(180deg,#2bd970 0%,#22c965 100%) !important;
    }
    .contact-pill-call{
      background:#003473 !important;
    }
    .contact-pill-hero{
      min-height:58px;
      padding:0 30px;
      font-size:1rem;
    }
    @keyframes buttonPulse{
      0%,100%{
        transform:scale(1);
        box-shadow:0 8px 18px rgba(4,28,58,.15);
      }
      50%{
        transform:scale(1.015);
        box-shadow:0 10px 23px rgba(4,28,58,.19);
      }
    }

    /* Why centro */
    .why-section{
      padding:86px 0;
      background:linear-gradient(180deg,#ffffff 0%,#f7fbfd 100%);
    }
    .why-grid{
      display:grid;
      grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);
      gap:54px;
      align-items:center;
    }
    .why-intro{
      padding:12px 0;
    }
    .why-intro h2{
      margin-top:10px;
      max-width:520px;
    }
    .why-intro > p{
      margin-top:18px;
      font-size:1.05rem;
      max-width:520px;
    }
    .why-highlight{
      margin:28px 0 24px;
      padding:22px 24px;
      display:flex;
      gap:18px;
      align-items:center;
      background:#fff8ee;
      border:1px solid #f2dfc3;
      border-radius:16px;
      max-width:520px;
    }
    .why-highlight strong{
      flex:0 0 auto;
      color:var(--turq-dark);
      font-size:2.15rem;
      line-height:1;
      letter-spacing:-.04em;
    }
    .why-highlight span{
      color:var(--text);
      font-weight:700;
      line-height:1.4;
    }
    .why-cta{
      display:inline-flex;
      gap:10px;
    }
    .why-cards{
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:16px;
    }
    .why-card{
      display:grid;
      grid-template-columns:48px 1fr;
      gap:15px;
      align-items:start;
      background:#fff;
      border:1px solid var(--line);
      border-radius:16px;
      padding:22px 20px;
      box-shadow:0 8px 26px rgba(12,45,90,.055);
      transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
    }
    .why-card:hover{
      transform:translateY(-5px);
      box-shadow:0 15px 34px rgba(12,45,90,.11);
      border-color:#ead4b4;
    }
    .why-icon{
      width:46px;
      height:46px;
      border-radius:13px;
      display:grid;
      place-items:center;
      background:#FFF0D9;
      color:var(--turq-dark);
      font-size:1.15rem;
    }
    .why-card h3{
      color:var(--navy);
      font-size:1.02rem;
      line-height:1.25;
      margin:1px 0 7px;
    }
    .why-card p{
      font-size:.91rem;
      line-height:1.5;
    }

    @media (max-width:1100px){
      .header-inner{gap:14px}
      .nav{gap:18px}
      .contact-pill{min-height:46px;padding:0 16px;font-size:.84rem}
    }
    @media (max-width:980px){
      .why-grid{grid-template-columns:1fr;gap:34px}
      .why-intro{text-align:center}
      .why-intro h2,.why-intro>p,.why-highlight{margin-left:auto;margin-right:auto}
      .why-cta{margin:auto}
      .header-cta-wrap{margin-left:auto}
    }
    @media (max-width:760px){
      .header-inner{height:auto;min-height:72px;flex-wrap:wrap;padding:10px 0}
      .logo{min-width:0}
      .logo img{height:36px !important;max-width:190px !important}
      .header-cta-wrap{
        width:100%;
        display:grid !important;
        grid-template-columns:1fr 1fr;
        gap:8px;
      }
      .header-cta-wrap .contact-pill{
        min-width:0;
        width:100%;
        padding:0 12px;
        font-size:.82rem;
        min-height:43px;
      }
      .why-cards{grid-template-columns:1fr}
    }
    @media (max-width:640px){
      .hero-actions{
        display:grid !important;
        grid-template-columns:1fr;
        width:100%;
      }
      .hero-actions .contact-pill{
        width:100%;
      }
      .why-section{padding:62px 0}
      .why-highlight{
        align-items:flex-start;
        text-align:left;
      }
    }
    @media (prefers-reduced-motion:reduce){
      .contact-pill{animation:none}
      .why-card,.contact-pill{transition:none}
    }

  
    .trustindex-wrap{
      width:100%;
      margin:0 auto;
      min-height:140px;
    }
  
    /* Corporate CTA consistency */
    .btn-turq,
    .hero-form .btn-turq,
    .final-form .btn-turq{
      background:#003473 !important;
      color:#fff !important;
      border-color:#003473 !important;
      box-shadow:0 8px 18px rgba(0,52,115,.16);
    }
    .btn-turq:hover,
    .hero-form .btn-turq:hover,
    .final-form .btn-turq:hover{
      background:#00295c !important;
      color:#fff !important;
      transform:translateY(-2px);
      box-shadow:0 12px 24px rgba(0,52,115,.22);
    }

    .contact-pill-call{
      background:#003473 !important;
      color:#fff !important;
    }

    /* Corporate cream accent */
    .icon,
    .why-icon{
      background:#FFF0D9 !important;
      color:#003473 !important;
    }
    .why-highlight,
    .stat-banner{
      background:#fff8ee !important;
      border-color:#f2dfc3 !important;
    }
    .eyebrow,
    .link,
    .team-card small{
      color:#003473 !important;
    }

  
    /* More noticeable but still refined pulse */
    .contact-pill{
      animation:buttonPulseStrong 2.15s ease-in-out infinite !important;
      transform-origin:center;
    }

    @keyframes buttonPulseStrong{
      0%,100%{
        transform:scale(1);
        box-shadow:0 8px 18px rgba(0,52,115,.16);
      }
      50%{
        transform:scale(1.035);
        box-shadow:
          0 12px 28px rgba(0,52,115,.22),
          0 0 0 7px rgba(255,240,217,.12);
      }
    }

    .contact-pill:hover{
      animation-play-state:paused !important;
      transform:translateY(-2px) scale(1.02);
    }

    /* Cream outline specifically for the call button in the header */
    .header-cta-wrap .contact-pill-call{
      border:2px solid #FFF0D9 !important;
      box-shadow:0 8px 18px rgba(0,52,115,.18);
    }

    .header-cta-wrap .contact-pill-call:hover{
      border-color:#FFF0D9 !important;
      box-shadow:
        0 12px 26px rgba(0,52,115,.24),
        0 0 0 4px rgba(255,240,217,.10);
    }

  
    @media (max-width:980px){
      h1{font-size:clamp(2rem,6vw,2.8rem)}
    }
    @media (max-width:640px){
      h1{font-size:clamp(2rem,9vw,2.45rem)}
    }

  
    .step-number{
      background:#FFF0D9 !important;
      color:#003473 !important;
    }

  
    /* Final page form button in corporate cream */
    .final-form .btn-turq{
      background:#FFF0D9 !important;
      color:#003473 !important;
      border-color:#FFF0D9 !important;
      box-shadow:0 8px 18px rgba(0,52,115,.12);
    }
    .final-form .btn-turq:hover{
      background:#f7e5c7 !important;
      color:#003473 !important;
      border-color:#f7e5c7 !important;
      box-shadow:0 12px 24px rgba(0,52,115,.18);
    }

  
    /* Team image shown above the hero only on mobile */
    .mobile-team-hero{
      display:none;
    }

    @media (max-width:640px){
      .mobile-team-hero{
        display:block;
        width:100%;
        background:#fff;
        overflow:hidden;
      }
      .mobile-team-hero img{
        width:100%;
        height:auto;
        max-height:330px;
        object-fit:cover;
        object-position:center 35%;
        display:block;
      }

      /* On mobile, the hero starts immediately after the team image */
      .hero-copy{
        padding-top:38px;
      }
    }

  
    .logo img{
      height:42px !important;
      width:auto !important;
      max-width:280px;
      object-fit:contain;
    }
    @media (max-width:760px){
      .logo img{
        height:34px !important;
        max-width:210px;
      }
    }

  

    /* Subrayado de aparición/desaparición para "primer paso" */
    .underline-step{
      position:relative;
      display:inline-block;
      z-index:1;
    }

    .underline-step::after{
      content:"";
      position:absolute;
      left:0;
      bottom:-6px;
      width:100%;
      height:5px;
      border-radius:999px;
      background:#FFF0D9;
      transform:scaleX(0);
      transform-origin:left center;
      opacity:0;
      animation:underlinePulse 6.5s ease-in-out infinite;
    }

    @keyframes underlinePulse{
      0%,58%{
        transform:scaleX(0);
        opacity:0;
      }
      66%,78%{
        transform:scaleX(1);
        opacity:1;
      }
      86%,100%{
        transform:scaleX(0);
        opacity:0;
      }
    }

    @media (prefers-reduced-motion:reduce){
      .underline-step::after{
        animation:none;
        transform:scaleX(1);
        opacity:1;
      }
    }

/* Formulario de producción */
.hp-field{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
}
.form-status{
  margin-top:12px;
  font-size:.88rem;
  font-weight:700;
  min-height:1.2em;
}
.form-status.is-success{color:#137333;}
.form-status.is-error{color:#b3261e;}
.final-form .form-status.is-success{color:#FFF0D9;}
.final-form .form-status.is-error{color:#ffd2cc;}
button[disabled]{opacity:.7;cursor:wait;}


/* Equipo: versión compacta en móvil.
   La foto del equipo ya aparece sobre el hero, así que aquí evitamos repetirla. */
@media (max-width:640px){
  #equipo{
    padding-top:54px;
    padding-bottom:54px;
  }

  #equipo .section-title{
    margin-bottom:24px;
  }

  #equipo .section-title p{
    display:none;
  }

  #equipo .team-feature{
    display:block;
    border:0;
    box-shadow:none;
    background:transparent;
  }

  #equipo .team-visual{
    display:none;
  }

  #equipo .team-content{
    padding:0;
  }

  #equipo .team-content > .eyebrow,
  #equipo .team-content > h3,
  #equipo .team-content > p{
    display:none;
  }

  #equipo .team-role-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
  }

  #equipo .team-role-grid .family-point{
    min-height:74px;
    display:flex;
    align-items:center;
    padding:14px;
    font-size:.88rem;
    line-height:1.3;
  }
}

@media (max-width:420px){
  #equipo .team-role-grid{
    grid-template-columns:1fr;
  }

  #equipo .team-role-grid .family-point{
    min-height:auto;
  }
}