/* SOLO SECCIÓN: Nuestra forma de trabajar + presentación del logo original */
    .logo img,
    .footerLogo {
      object-fit: contain;
      background: #fff;
      border-radius: 10px;
      padding: 5px 8px;
      box-shadow: 0 6px 20px rgba(7, 19, 43, .10);
    }
    .logo img { width: 118px; }
    .footerLogo { width: 145px; }

    #fccValues .valueCard {
      position: relative;
      isolation: isolate;
      overflow: hidden;
      cursor: default;
      outline: none;
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      gap: 12px;
      transition:
        border-color .42s ease,
        box-shadow .42s ease,
        transform .42s ease,
        background-color .42s ease;
    }

    #fccValues .valueCard > span:first-child {
      display: inline-block;
      font-weight: 800;
      letter-spacing: .08em;
    }

    #fccValues .valueIcon {
      width: 54px;
      height: 54px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border-radius: 16px;
      border: 1px solid rgba(31,139,255,.22);
      background: linear-gradient(180deg, rgba(255,255,255,.82), rgba(241,247,255,.96));
      box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
      color: #1878f3;
      transition: transform .42s ease, border-color .42s ease, background-color .42s ease, box-shadow .42s ease, color .42s ease;
    }

    #fccValues .valueIcon svg {
      width: 24px;
      height: 24px;
      stroke: currentColor;
      fill: none;
      stroke-width: 1.9;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    #fccValues .valueCard h3 {
      margin: 2px 0 0;
    }

    #fccValues .valueCard p {
      margin: 0;
      max-width: 22ch;
    }

    #fccValues .valueCard::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -1;
      opacity: 0;
      background:
        radial-gradient(circle at 18% 10%, rgba(41,154,255,.20), transparent 48%),
        linear-gradient(145deg, #f8fbff 0%, #eaf4ff 100%);
      transition: opacity .42s ease;
    }

    #fccValues .valueCard::after {
      content: "";
      position: absolute;
      left: 0;
      top: 0;
      bottom: 0;
      width: 4px;
      background: linear-gradient(180deg, #31a8ff, #0869e8);
      transform: scaleY(0);
      transform-origin: top;
      transition: transform .42s ease;
    }

    /* ÚNICO estado activo. JS garantiza que solo una tarjeta lo tenga. */
    #fccValues .valueCard.is-active {
      border-color: rgba(31,139,255,.82);
      box-shadow: 0 18px 48px rgba(15,80,160,.15);
      transform: translateY(-7px);
    }
    #fccValues .valueCard.is-active::before { opacity: 1; }
    #fccValues .valueCard.is-active::after { transform: scaleY(1); }
    #fccValues .valueCard.is-active .valueIcon {
      color: #ffffff;
      border-color: rgba(8,105,232,.55);
      background: linear-gradient(180deg, #39a6ff 0%, #0a69e8 100%);
      box-shadow: 0 12px 24px rgba(24,120,243,.24);
      transform: translateY(-2px) scale(1.03);
    }

    /* Hover/focus ya no pinta una segunda tarjeta por CSS.
       JS transfiere el único estado activo a la tarjeta señalada. */
    #fccValues .valueCard:hover,
    #fccValues .valueCard:focus-visible {
      z-index: 2;
    }

    @media (max-width: 760px) {
      .logo img { width: 94px; padding: 4px 6px; border-radius: 8px; }
      #fccValues .valueCard { min-height: 170px; gap: 10px; }
      #fccValues .valueIcon { width: 48px; height: 48px; border-radius: 14px; }
      #fccValues .valueIcon svg { width: 22px; height: 22px; }
      #fccValues .valueCard.is-active {
        box-shadow: 0 14px 36px rgba(15,80,160,.14);
        transform: translateX(5px);
      }
    }

    @media (prefers-reduced-motion: reduce) {
      #fccValues .valueCard,
      #fccValues .valueCard::before,
      #fccValues .valueCard::after {
        transition: none !important;
      }
    }
  

    /* SOLO HEADER: barra flotante premium */
    .header {
      inset: 0 0 auto 0;
      padding-top: 18px;
      background: transparent !important;
      border-bottom: 0 !important;
      box-shadow: none !important;
      backdrop-filter: none !important;
      -webkit-backdrop-filter: none !important;
      pointer-events: none;
    }

    .header .nav {
      pointer-events: auto;
      width: min(calc(100% - 56px), 1320px);
      height: 70px;
      padding: 0 16px 0 20px;
      border: 1px solid rgba(255,255,255,.10);
      border-radius: 26px;
      background:
        linear-gradient(135deg, rgba(13,28,39,.94), rgba(23,35,39,.90));
      box-shadow:
        0 18px 48px rgba(2,12,27,.20),
        inset 0 1px 0 rgba(255,255,255,.045);
      backdrop-filter: blur(18px) saturate(1.08);
      -webkit-backdrop-filter: blur(18px) saturate(1.08);
      transition:
        background-color .35s ease,
        box-shadow .35s ease,
        transform .35s ease,
        border-color .35s ease;
    }

    .header.scrolled .nav {
      background:
        linear-gradient(135deg, rgba(8,23,42,.97), rgba(15,31,47,.96));
      border-color: rgba(255,255,255,.13);
      box-shadow:
        0 14px 42px rgba(1,10,24,.28),
        inset 0 1px 0 rgba(255,255,255,.05);
    }

    .header .logo {
      flex: 0 0 auto;
    }

    .header .logo img {
      width: 102px;
      max-height: 48px;
      object-fit: contain;
      background: #fff;
      border-radius: 12px;
      padding: 5px 8px;
      box-shadow: none;
    }

    .header .logoText {
      display: none;
    }

    .header .links {
      gap: 24px;
    }

    .header .links a {
      color: rgba(255,255,255,.76);
      font-size: 12px;
      font-weight: 700;
      transition: color .22s ease;
    }

    .header .links a:hover,
    .header .links a:focus-visible {
      color: #fff;
    }

    .header .links a::after {
      bottom: -10px;
      height: 1px;
      background: #63bdff;
    }

    .header .lang {
      border-color: rgba(255,255,255,.16);
      background: rgba(255,255,255,.055);
      box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
    }

    .header .navCta {
      min-height: 44px;
      padding: 0 20px;
      border: 0;
      border-radius: 999px;
      background: #fff;
      color: #0a1732;
      box-shadow: 0 8px 22px rgba(0,0,0,.12);
    }

    .header .navCta:hover,
    .header .navCta:focus-visible {
      background: linear-gradient(135deg, #1688ff, #55b7ff);
      color: #fff;
      transform: translateY(-1px);
    }

    @media (max-width: 1160px) {
      .header {
        padding-top: 14px;
      }

      .header .nav {
        width: min(calc(100% - 32px), 1320px);
        height: 66px;
        border-radius: 24px;
        padding: 0 12px 0 14px;
      }

      .header.open .links {
        top: 88px !important;
        left: 16px !important;
        right: 16px !important;
        padding: 22px !important;
        border: 1px solid rgba(255,255,255,.10) !important;
        border-radius: 22px !important;
        background: rgba(8,23,42,.98) !important;
        box-shadow: 0 18px 48px rgba(2,12,27,.28);
        backdrop-filter: blur(18px);
        -webkit-backdrop-filter: blur(18px);
      }
    }

    @media (max-width: 760px) {
      .header {
        padding-top: 10px;
      }

      .header .nav {
        width: calc(100% - 20px);
        height: 62px;
        border-radius: 21px;
        padding: 0 9px 0 11px;
        gap: 8px;
      }

      .header .logo img {
        width: 78px;
        max-height: 42px;
        border-radius: 10px;
        padding: 4px 6px;
      }

      .header .menu {
        order: 2;
        margin-left: auto;
      }

      .header .lang {
        order: 3;
        margin-left: 0;
        transform: scale(.94);
        transform-origin: right center;
      }

      .header.open .links {
        top: 80px !important;
        left: 10px !important;
        right: 10px !important;
        border-radius: 20px !important;
      }
    }

    @media (max-width: 430px) {
      .header .nav {
        width: calc(100% - 14px);
        height: 60px;
        border-radius: 19px;
        padding-left: 9px;
        padding-right: 7px;
      }

      .header .logo img {
        width: 68px;
      }

      .header .menu {
        width: 38px;
        height: 38px;
      }

      .header .lang {
        transform: scale(.88);
      }
    }




    /* SOLO HERO PANEL: interacción premium como en Empresa */
    .heroPanel {
      transition:
        transform .32s ease,
        border-color .32s ease,
        background .32s ease,
        box-shadow .32s ease;
    }

    @media (hover:hover) and (pointer:fine) {
      .heroPanel:hover {
        transform: translateY(-4px);
        border-color: rgba(113,195,255,.34);
        background: linear-gradient(145deg,rgba(255,255,255,.155),rgba(255,255,255,.055));
        box-shadow: 0 36px 92px rgba(0,0,0,.28);
      }
    }

    .heroFeature {
      position: relative;
      isolation: isolate;
      margin-inline: -10px;
      padding-inline: 10px;
      border-radius: 16px;
      transition:
        transform .28s ease,
        background-color .28s ease,
        border-color .28s ease,
        box-shadow .28s ease;
    }

    .heroFeature::before {
      content: "";
      position: absolute;
      inset: 5px 0;
      z-index: -1;
      border-radius: 14px;
      background: linear-gradient(100deg,rgba(79,174,255,.13),rgba(255,255,255,.055));
      opacity: 0;
      transform: scale(.985);
      transition: opacity .28s ease, transform .28s ease;
    }

    .heroFeature .heroIcon {
      transition:
        transform .28s ease,
        color .28s ease,
        border-color .28s ease,
        background-color .28s ease,
        box-shadow .28s ease;
    }

    .heroFeature b,
    .heroFeature span {
      transition: color .28s ease, transform .28s ease;
    }

    /* Un único estado activo: lo controla JS para auto-ciclo + hover/focus. */
    .heroFeature.is-active {
      transform: translateX(5px);
      border-color: rgba(118,199,255,.18);
    }

    .heroFeature.is-active::before {
      opacity: 1;
      transform: scale(1);
    }

    .heroFeature.is-active .heroIcon {
      transform: scale(1.06);
      color: #fff;
      border-color: rgba(111,199,255,.72);
      background: rgba(39,145,235,.18);
      box-shadow: 0 8px 22px rgba(19,116,211,.18);
    }

    .heroFeature.is-active b { color: #fff; }
    .heroFeature.is-active span { color: #d9e8f8; }

    .heroFeature:focus-visible {
      outline: 2px solid rgba(111,199,255,.58);
      outline-offset: 3px;
    }

        /* SMART HEADER: se oculta al bajar y reaparece al subir */
    .header {
      transform: translate3d(0,0,0);
      opacity: 1;
      transition:
        transform .42s cubic-bezier(.22,.61,.36,1),
        opacity .28s ease;
      will-change: transform;
    }

    .header.header-hidden {
      transform: translate3d(0, calc(-100% - 26px), 0);
      opacity: .98;
    }

    .header.header-visible {
      transform: translate3d(0,0,0);
      opacity: 1;
    }

    /* Si el menú móvil está abierto, la navegación debe permanecer visible */
    .header.open {
      transform: translate3d(0,0,0) !important;
      opacity: 1 !important;
    }

    @media (prefers-reduced-motion: reduce) {
      .header {
        transition: none !important;
      }
    }

  

    /* Botones flotantes sociales: iconos SVG reales + tooltip bilingüe */
    .floaters{gap:10px;right:18px;bottom:18px}
    .floater{position:relative;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;padding:0;box-shadow:0 12px 30px rgba(3,17,40,.20);transition:transform .22s ease,box-shadow .22s ease,filter .22s ease}
    .floater svg{width:23px;height:23px;display:block;fill:#fff}
    .floater.fb{background:#1877f2}
    .floater.wa{background:#25d366}
    .floater:hover,.floater:focus-visible{transform:translateY(-3px) scale(1.04);box-shadow:0 16px 34px rgba(3,17,40,.27);filter:saturate(1.06)}
    .floater::before{content:attr(data-tooltip);position:absolute;right:64px;top:50%;transform:translateY(-50%) translateX(6px);white-space:nowrap;padding:8px 11px;border-radius:9px;background:#07152f;color:#fff;font:700 11px/1 Manrope,sans-serif;letter-spacing:.01em;box-shadow:0 10px 24px rgba(4,18,42,.20);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s ease,transform .18s ease,visibility .18s ease}
    .floater:hover::before,.floater:focus-visible::before{opacity:1;visibility:visible;transform:translateY(-50%) translateX(0)}
    @media(max-width:760px){.floaters{right:12px;bottom:14px;gap:8px}.floater{width:48px;height:48px}.floater svg{width:21px;height:21px}.floater::before{display:none}}

    /* HERO EDITORIAL FCC: video protagonista, texto corto y una sola acción */
    .heroEditorial{
      min-height:720px;
      height:100svh;
      max-height:920px;
      position:relative;
      overflow:hidden;
      background:#07152f;
    }

    .heroEditorial .heroVideo{
      position:absolute;
      inset:0;
      width:100%;
      height:100%;
      object-fit:cover;
      object-position:center 50% !important;
      filter:saturate(.94) contrast(1.025);
    }

    .heroEditorial .heroShade{
      position:absolute;
      inset:0;
      background:
        linear-gradient(180deg,
          rgba(4,15,34,.10) 0%,
          rgba(4,15,34,.06) 38%,
          rgba(4,15,34,.24) 65%,
          rgba(4,15,34,.84) 100%),
        linear-gradient(90deg,
          rgba(4,15,34,.62) 0%,
          rgba(4,15,34,.34) 28%,
          rgba(4,15,34,.08) 58%,
          rgba(4,15,34,0) 78%) !important;
    }

    .heroEditorial .heroGridClean{
      position:relative;
      z-index:2;
      min-height:100%;
      display:flex !important;
      align-items:flex-end !important;
      justify-content:flex-start;
      padding-top:150px;
      padding-bottom:118px;
    }

    .heroEditorial .heroCopyClean{
      width:min(100%,560px);
      max-width:560px;
    }

    .heroEditorial .heroCopyClean .eyebrow{
      display:inline-flex;
      align-items:center;
      min-height:28px;
      margin-bottom:14px;
      color:#70c4ff;
      text-shadow:0 4px 18px rgba(0,0,0,.24);
    }

    .heroEditorial .heroTitle{
      max-width:9.4ch;
      margin:0 0 18px !important;
      font-size:clamp(50px,4.3vw,70px) !important;
      line-height:.93 !important;
      letter-spacing:-.038em !important;
      text-shadow:0 10px 34px rgba(0,0,0,.30);
    }

    .heroEditorial .heroTitle span,
    .heroEditorial .heroTitle em{
      display:block;
    }

    .heroEditorial .heroTitle em{
      color:#4fb1ff;
      font-weight:400;
    }

    .heroEditorial .heroLead{
      width:min(100%,430px);
      margin:0 !important;
      color:rgba(255,255,255,.88) !important;
      font-size:15.5px !important;
      line-height:1.55 !important;
      text-shadow:0 4px 18px rgba(0,0,0,.22);
    }

    .heroEditorial .heroActionsClean{
      margin-top:24px !important;
    }

    .heroEditorial .heroActionsClean .btn{
      min-height:48px;
      padding-inline:22px;
    }

    .heroEditorial .heroBottomClean{
      position:absolute;
      z-index:2;
      left:50%;
      bottom:28px;
      transform:translateX(-50%);
      display:flex;
      align-items:center;
      justify-content:flex-start;
      pointer-events:none;
    }

    .heroEditorial .heroBottomClean span{
      display:inline-flex;
      align-items:center;
      gap:13px;
      color:rgba(255,255,255,.68);
      font-size:10px;
      font-weight:700;
      letter-spacing:.18em;
    }

    .heroEditorial .heroBottomClean span::before{
      content:"";
      width:38px;
      height:1px;
      background:rgba(255,255,255,.42);
    }

    /* HERO MULTIVIDEO: tres clips con transición editorial suave */
    .heroEditorial .heroVideoStack{
      position:absolute;
      inset:0;
      z-index:0;
      overflow:hidden;
      background:#07152f;
    }

    .heroEditorial .heroVideoSlide{
      position:absolute !important;
      inset:0;
      width:100%;
      height:100%;
      opacity:0;
      visibility:hidden;
      pointer-events:none;
      transform:scale(1.018);
      transition:opacity 1.6s ease,visibility 1.6s ease,transform 7.5s ease;
      will-change:opacity,transform;
    }

    .heroEditorial .heroVideoSlide.is-active{
      opacity:1;
      visibility:visible;
      transform:scale(1.045);
    }

    .heroEditorial .heroShade{z-index:1}
    .heroEditorial .heroGridClean,
    .heroEditorial .heroBottomClean,
    .heroEditorial .heroVideoNav{z-index:2}

    .heroEditorial .heroVideoNav{
      position:absolute;
      right:clamp(18px,4vw,72px);
      bottom:25px;
      display:flex;
      align-items:center;
      gap:8px;
    }

    .heroEditorial .heroVideoNav button{
      width:8px;
      height:8px;
      padding:0;
      border:1px solid rgba(255,255,255,.68);
      border-radius:999px;
      background:rgba(255,255,255,.20);
      cursor:pointer;
      transition:width .28s ease,background .28s ease,border-color .28s ease,transform .28s ease;
    }

    .heroEditorial .heroVideoNav button:hover,
    .heroEditorial .heroVideoNav button:focus-visible{
      transform:scale(1.12);
      border-color:#fff;
      outline:none;
    }

    .heroEditorial .heroVideoNav button.is-active{
      width:30px;
      background:#fff;
      border-color:#fff;
    }

    @media(max-width:760px){
      .heroEditorial .heroVideoNav{
        right:14px;
        bottom:18px;
        gap:6px;
      }
      .heroEditorial .heroVideoNav button{width:7px;height:7px}
      .heroEditorial .heroVideoNav button.is-active{width:24px}
    }

    @media(prefers-reduced-motion:reduce){
      .heroEditorial .heroVideoSlide{transition:none!important;transform:none!important}
      .heroEditorial .heroVideoNav{display:none}
    }

    /* Franja de propuesta de valor: reemplaza el panel del hero y deja libre el video */
    .heroValueStrip{
      position:relative;
      z-index:4;
      padding:0 0 66px !important;
      background:#edf4fd !important;
    }

    .heroValueStrip .factsGrid{
      position:relative;
      top:-24px;
      display:grid !important;
      grid-template-columns:repeat(4,minmax(0,1fr)) !important;
      overflow:hidden;
      border:1px solid #ceddf0;
      border-radius:24px;
      background:rgba(255,255,255,.96);
      box-shadow:0 24px 60px rgba(15,56,112,.10);
      backdrop-filter:blur(12px);
      -webkit-backdrop-filter:blur(12px);
    }

    .heroValueStrip .heroValueItem{
      position:relative;
      isolation:isolate;
      min-height:158px;
      padding:26px 28px 25px !important;
      border-right:1px solid #d6e3f2;
      background:#fff;
      overflow:hidden;
      outline:none;
      transition:
        transform .32s ease,
        background .32s ease,
        box-shadow .32s ease,
        border-color .32s ease;
    }

    .heroValueStrip .heroValueItem:last-child{
      border-right:0;
    }

    .heroValueStrip .heroValueItem::before{
      content:"";
      position:absolute;
      inset:0;
      z-index:-1;
      opacity:0;
      background:
        radial-gradient(circle at 18% 10%,rgba(54,161,255,.18),transparent 48%),
        linear-gradient(145deg,#f9fcff 0%,#eaf4ff 100%);
      transition:opacity .32s ease;
    }

    .heroValueStrip .heroValueItem::after{
      content:"";
      position:absolute;
      left:0;
      top:0;
      bottom:0;
      width:4px;
      background:linear-gradient(180deg,#37a9ff,#0b6de9);
      transform:scaleY(0);
      transform-origin:top;
      transition:transform .32s ease;
    }

    .heroValueStrip .heroValueItem small{
      display:block;
      margin-bottom:18px;
      color:#1688ff;
      font-size:10px;
      font-weight:800;
      letter-spacing:.14em;
    }

    .heroValueStrip .heroValueItem strong{
      display:block;
      margin:0 0 8px;
      color:#0a1732;
      font-family:'Source Serif 4',serif;
      font-size:25px;
      font-weight:400;
      line-height:1.08;
    }

    .heroValueStrip .heroValueItem span{
      display:block;
      max-width:27ch;
      color:#657a9e;
      font-size:12.5px;
      line-height:1.55;
    }

    .heroValueStrip .heroValueItem.is-active{
      transform:translateY(-3px);
      background:#f5faff;
      box-shadow:0 18px 42px rgba(22,91,171,.10);
      border-color:#bdd8f4;
    }

    .heroValueStrip .heroValueItem.is-active::before{opacity:1}
    .heroValueStrip .heroValueItem.is-active::after{transform:scaleY(1)}
    .heroValueStrip .heroValueItem.is-active strong{color:#0b2d60}
    .heroValueStrip .heroValueItem.is-active span{color:#4f709b}

    @media(max-width:900px){
      .heroEditorial{
        min-height:700px;
        height:92svh;
        max-height:none;
      }

      .heroEditorial .heroGridClean{
        padding-top:118px;
        padding-bottom:105px;
      }

      .heroEditorial .heroTitle{
        font-size:clamp(44px,7vw,62px) !important;
      }

      .heroValueStrip .factsGrid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
      }

      .heroValueStrip .heroValueItem{
        border-bottom:1px solid #d6e3f2;
      }

      .heroValueStrip .heroValueItem:nth-child(2n){
        border-right:0;
      }

      .heroValueStrip .heroValueItem:nth-child(n+3){
        border-bottom:0;
      }
    }

    @media(max-width:760px){
      .heroEditorial{
        min-height:650px;
        height:88svh;
      }

      .heroEditorial .heroVideo{
        object-position:56% center !important;
      }

      .heroEditorial .heroShade{
        background:
          linear-gradient(180deg,
            rgba(4,15,34,.08) 0%,
            rgba(4,15,34,.07) 34%,
            rgba(4,15,34,.34) 61%,
            rgba(4,15,34,.90) 100%),
          linear-gradient(90deg,
            rgba(4,15,34,.40) 0%,
            rgba(4,15,34,.14) 58%,
            rgba(4,15,34,0) 100%) !important;
      }

      .heroEditorial .heroGridClean{
        padding-top:100px;
        padding-bottom:92px;
      }

      .heroEditorial .heroCopyClean{
        width:min(100%,390px);
      }

      .heroEditorial .heroCopyClean .eyebrow{
        margin-bottom:10px;
        font-size:9px;
        letter-spacing:.14em;
      }

      .heroEditorial .heroTitle{
        max-width:8.8ch;
        font-size:clamp(36px,10.3vw,48px) !important;
        line-height:.94 !important;
        margin-bottom:13px !important;
      }

      .heroEditorial .heroLead{
        max-width:31ch;
        font-size:13.5px !important;
        line-height:1.48 !important;
      }

      .heroEditorial .heroActionsClean{
        margin-top:18px !important;
      }

      .heroEditorial .heroActionsClean .btn{
        min-height:45px;
        padding-inline:18px;
        font-size:11px;
      }

      .heroEditorial .heroBottomClean{
        bottom:18px;
      }

      .heroEditorial .heroBottomClean span{
        font-size:8.5px;
        letter-spacing:.14em;
      }

      .heroValueStrip{
        padding-bottom:50px !important;
      }

      .heroValueStrip .factsGrid{
        top:-16px;
        border-radius:20px;
      }

      .heroValueStrip .heroValueItem{
        min-height:132px;
        padding:20px 18px !important;
      }

      .heroValueStrip .heroValueItem small{
        margin-bottom:12px;
      }

      .heroValueStrip .heroValueItem strong{
        font-size:21px;
      }

      .heroValueStrip .heroValueItem span{
        font-size:11.5px;
      }
    }

    @media(max-width:480px){
      .heroEditorial{
        min-height:620px;
        height:86svh;
      }

      .heroEditorial .heroVideo{
        object-position:58% center !important;
      }

      .heroEditorial .heroGridClean{
        padding-bottom:86px;
      }

      .heroEditorial .heroTitle{
        max-width:8.4ch;
        font-size:clamp(34px,10.8vw,44px) !important;
      }

      .heroValueStrip .factsGrid{
        grid-template-columns:1fr !important;
        top:-12px;
      }

      .heroValueStrip .heroValueItem{
        min-height:112px;
        border-right:0 !important;
        border-bottom:1px solid #d6e3f2 !important;
        padding:17px 18px !important;
      }

      .heroValueStrip .heroValueItem:last-child{
        border-bottom:0 !important;
      }

      .heroValueStrip .heroValueItem small{
        margin-bottom:8px;
      }

      .heroValueStrip .heroValueItem strong{
        font-size:20px;
        margin-bottom:5px;
      }
    }

    @media(prefers-reduced-motion:reduce){
      .heroValueStrip .heroValueItem,
      .heroValueStrip .heroValueItem::before,
      .heroValueStrip .heroValueItem::after{
        transition:none !important;
      }
    }



    /* =========================================================
       HERO FCC V7 · enfoque prendas + tipografía editorial sans
       ========================================================= */
    .heroEditorial{
      min-height:680px;
      height:100svh;
      max-height:900px;
    }

    .heroEditorial .heroVideoSlide{
      filter:saturate(.96) contrast(1.03) brightness(.94);
    }

    .heroEditorial .heroVideo-group{object-position:center 46% !important}
    .heroEditorial .heroVideo-streetwear{object-position:center 48% !important}
    .heroEditorial .heroVideo-production{object-position:center 50% !important}

    /* Overlay más ligero: deja ver la prenda y solo protege la zona del copy. */
    .heroEditorial .heroShade{
      background:
        linear-gradient(180deg,rgba(5,16,34,.12) 0%,rgba(5,16,34,.02) 42%,rgba(5,16,34,.28) 70%,rgba(5,16,34,.76) 100%) !important;
    }

    .heroEditorial .heroGridClean{
      align-items:flex-end !important;
      justify-content:center !important;
      padding-top:132px;
      padding-bottom:112px;
      text-align:center;
    }

    .heroEditorial .heroCopyClean{
      width:min(100%,920px);
      max-width:920px;
      margin-inline:auto;
    }

    .heroEditorial .heroCopyClean .eyebrow{
      justify-content:center;
      margin:0 auto 14px;
      color:#8dd2ff;
      font-size:10px;
      letter-spacing:.20em;
      text-transform:uppercase;
    }

    /* Cambio importante: el título deja la serif y usa Manrope ExtraBold,
       más cercano al lenguaje visual de campañas de moda/retail. */
    .heroEditorial .heroTitle{
      max-width:900px !important;
      margin:0 auto 14px !important;
      font-family:'Manrope',sans-serif !important;
      font-size:clamp(38px,4.15vw,66px) !important;
      font-style:normal !important;
      font-weight:800 !important;
      line-height:.98 !important;
      letter-spacing:-.045em !important;
      text-transform:uppercase;
      color:#fff !important;
      text-wrap:balance;
      text-shadow:0 8px 30px rgba(0,0,0,.28);
    }

    .heroEditorial .heroTitle span,
    .heroEditorial .heroTitle em{
      display:inline;
      color:inherit !important;
      font-family:inherit !important;
      font-style:normal !important;
      font-weight:inherit !important;
    }

    .heroEditorial .heroLead{
      width:min(100%,680px);
      max-width:680px;
      margin:0 auto !important;
      font-size:15px !important;
      line-height:1.55 !important;
      color:rgba(255,255,255,.90) !important;
      text-align:center;
      text-shadow:0 3px 15px rgba(0,0,0,.24);
    }

    .heroEditorial .heroActionsClean{
      display:flex;
      justify-content:center;
      margin-top:20px !important;
    }

    .heroEditorial .heroActionsClean .btnPrimary{
      min-height:48px;
      padding:0 24px;
      border:1px solid rgba(255,255,255,.72);
      border-radius:999px;
      background:#fff;
      color:#091a35;
      box-shadow:0 12px 30px rgba(0,0,0,.16);
    }
    .heroEditorial .heroActionsClean .btnPrimary:hover,
    .heroEditorial .heroActionsClean .btnPrimary:focus-visible{
      border-color:#2398ff;
      background:#1688ff;
      color:#fff;
    }

    .heroEditorial .heroBottomClean{
      bottom:25px;
      justify-content:flex-start;
    }

    .heroEditorial .heroVideoNav{
      right:clamp(18px,4vw,72px);
      bottom:24px;
    }

    /* Libro de reclamaciones: fuera de la navegación principal y visible al final. */
    .footerClaimsRow{
      display:flex;
      justify-content:flex-start;
      padding-top:28px;
      padding-bottom:26px;
      border-top:1px solid rgba(255,255,255,.08);
    }

    .footerClaimsCard{
      width:min(100%,430px);
      display:grid;
      grid-template-columns:70px minmax(0,1fr) 28px;
      gap:16px;
      align-items:center;
      padding:16px 18px;
      border:1px solid rgba(127,185,255,.18);
      border-radius:18px;
      background:linear-gradient(135deg,rgba(20,54,99,.62),rgba(13,35,70,.44));
      color:#fff;
      text-decoration:none;
      transition:transform .25s ease,border-color .25s ease,background .25s ease,box-shadow .25s ease;
    }
    .footerClaimsCard:hover,
    .footerClaimsCard:focus-visible{
      transform:translateY(-3px);
      border-color:rgba(99,189,255,.48);
      background:linear-gradient(135deg,rgba(26,72,128,.78),rgba(14,42,82,.64));
      box-shadow:0 16px 36px rgba(0,0,0,.18);
      outline:none;
    }
    .footerClaimsIcon{
      width:66px;
      height:54px;
      display:grid;
      place-items:center;
      border-radius:14px;
      background:rgba(255,255,255,.07);
      color:#63bdff;
    }
    .footerClaimsIcon svg{
      width:54px;
      height:40px;
      fill:none;
      stroke:currentColor;
      stroke-width:2;
      stroke-linecap:round;
      stroke-linejoin:round;
    }
    .footerClaimsCopy strong{
      display:block;
      margin-bottom:4px;
      font:700 14px/1.25 'Manrope',sans-serif;
      color:#fff;
    }
    .footerClaimsCopy small{
      display:block;
      color:#9fb4d5;
      font:500 11px/1.45 'Manrope',sans-serif;
    }
    .footerClaimsArrow{
      color:#63bdff;
      font-size:18px;
      justify-self:end;
    }

    @media(max-width:760px){
      .heroEditorial{
        min-height:620px;
        height:84svh;
      }
      .heroEditorial .heroVideo-group{object-position:50% 5% !important}
      .heroEditorial .heroVideo-streetwear{object-position:50% 5% !important}
      .heroEditorial .heroVideo-production{object-position:50% 8% !important}
      .heroEditorial .heroShade{
        background:linear-gradient(180deg,rgba(5,16,34,.08) 0%,rgba(5,16,34,.02) 36%,rgba(5,16,34,.34) 63%,rgba(5,16,34,.88) 100%) !important;
      }
      .heroEditorial .heroGridClean{
        padding-top:98px;
        padding-bottom:90px;
      }
      .heroEditorial .heroCopyClean{
        width:min(100%,430px);
      }
      .heroEditorial .heroCopyClean .eyebrow{
        max-width:90%;
        font-size:8px;
        line-height:1.4;
        letter-spacing:.16em;
      }
      .heroEditorial .heroTitle{
        max-width:12ch !important;
        font-size:clamp(30px,8.8vw,42px) !important;
        line-height:1 !important;
        letter-spacing:-.04em !important;
      }
      .heroEditorial .heroLead{
        max-width:31ch;
        font-size:13px !important;
      }
      .heroEditorial .heroActionsClean .btnPrimary{
        min-height:44px;
        padding-inline:18px;
        font-size:11px;
      }
      .heroEditorial .heroBottomClean{
        bottom:17px;
      }
      .heroEditorial .heroBottomClean span{
        font-size:7.5px;
        letter-spacing:.13em;
      }
      .footerClaimsRow{
        padding-top:22px;
        padding-bottom:22px;
      }
      .footerClaimsCard{
        grid-template-columns:58px minmax(0,1fr) 24px;
        padding:14px;
        border-radius:16px;
      }
      .footerClaimsIcon{
        width:56px;
        height:48px;
      }
      .footerClaimsIcon svg{
        width:46px;
        height:34px;
      }
    }


    /* Libro de reclamaciones · versión simple al pie, sin tarjeta. */
    .footerClaimsRow{
      display:flex !important;
      justify-content:flex-start !important;
      padding-top:8px !important;
      padding-bottom:24px !important;
      border-top:0 !important;
    }
    .footerClaimsCard{
      width:190px !important;
      display:flex !important;
      flex-direction:column !important;
      align-items:center !important;
      justify-content:center !important;
      gap:5px !important;
      padding:6px 4px 0 !important;
      border:0 !important;
      border-radius:0 !important;
      background:transparent !important;
      color:#fff !important;
      text-decoration:none !important;
      box-shadow:none !important;
      transition:transform .22s ease,opacity .22s ease !important;
    }
    .footerClaimsCard:hover,.footerClaimsCard:focus-visible{
      transform:translateY(-3px) !important;
      opacity:.92;
      outline:none;
    }
    .footerClaimsCopy{order:1;text-align:center}
    .footerClaimsCopy strong{
      display:block;
      margin:0 !important;
      color:#59b7ff !important;
      font:800 14px/1.05 'Manrope',Arial,sans-serif !important;
      letter-spacing:-.01em;
    }
    .footerClaimsCopy small{display:none !important}
    .footerClaimsIcon{
      order:2;
      width:112px !important;
      height:64px !important;
      display:grid !important;
      place-items:center !important;
      border-radius:0 !important;
      background:transparent !important;
      color:#dfe9f6 !important;
      filter:drop-shadow(0 8px 10px rgba(0,0,0,.20));
    }
    .footerClaimsIcon svg{
      width:104px !important;
      height:60px !important;
      fill:rgba(255,255,255,.08) !important;
      stroke:currentColor !important;
      stroke-width:1.6 !important;
    }
    .footerClaimsArrow{display:none !important}
    @media(max-width:760px){
      .footerClaimsRow{justify-content:center !important;padding-top:10px !important;padding-bottom:22px !important}
      .footerClaimsCard{width:176px !important;grid-template-columns:none !important}
      .footerClaimsCopy strong{font-size:13px !important}
      .footerClaimsIcon{width:102px !important;height:58px !important}
      .footerClaimsIcon svg{width:94px !important;height:54px !important}
    }


    /* Sistema tipográfico FCC: moderno, limpio y consistente con el hero. */
    html{font-synthesis:none}
    body,button,input,select,textarea{
      font-family:'Manrope',Arial,sans-serif;
      -webkit-font-smoothing:antialiased;
      text-rendering:optimizeLegibility;
    }
    p,.serviceContent p,.companyBody p,.valueCard p,.productsIntro p,.worldSection p,.footer p{
      font-family:'Manrope',Arial,sans-serif !important;
      letter-spacing:-.012em;
    }

    /* Títulos principales: misma familia fuerte y moderna del banner. */
    h1:not(.heroTitle),h2,
    .companyBody h2,.valueLead h2,.quoteCard h2,.productsHead h2,.worldSection h2{
      font-family:'Manrope',Arial,sans-serif !important;
      font-weight:800 !important;
      letter-spacing:-.045em !important;
      line-height:1.02 !important;
    }

    /* Énfasis azul: conserva el color, pero elimina la cursiva editorial. */
    h2 em,.companyBody h2 em,.valueLead h2 em,.quoteCard h2 em,.productsHead h2 em,.worldSection h2 em{
      font-family:'Manrope',Arial,sans-serif !important;
      font-weight:800 !important;
      font-style:normal !important;
      letter-spacing:-.045em !important;
    }

    /* Subtítulos y tarjetas: un poco menos pesados para mantener jerarquía. */
    h3,.serviceCard h3,.valueCard h3,.productMeta h3,.heroValueItem strong{
      font-family:'Manrope',Arial,sans-serif !important;
      font-weight:700 !important;
      letter-spacing:-.032em !important;
      line-height:1.08 !important;
    }

    .eyebrow,.serviceNo,.companyDetail small,.worldStats small,.footer h4,
    .links a,.navCta,.btn,.textLink,.catalogPill{
      font-family:'Manrope',Arial,sans-serif !important;
    }

    .heroEditorial .heroTitle{
      font-family:'Manrope',Arial,sans-serif !important;
      font-weight:800 !important;
      letter-spacing:-.04em !important;
    }

    /* Ajuste de escala para que los títulos no se sientan pesados en móvil. */
    @media(max-width:760px){
      h2,.companyBody h2,.valueLead h2,.quoteCard h2,.productsHead h2,.worldSection h2{
        letter-spacing:-.038em !important;
        line-height:1.04 !important;
      }
    }

    /* SOBRE FCC COMPANY · enfoque comercial para el INDEX */
    .companyBenefits .companyDetail{
      position:relative;
      overflow:hidden;
      border:1px solid rgba(46,132,231,.14);
      background:linear-gradient(145deg,#ffffff 0%,#f5f9ff 100%);
      transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease,background .28s ease;
    }
    .companyBenefits .companyDetail::before{
      content:"";
      position:absolute;
      inset:0 auto 0 0;
      width:3px;
      background:linear-gradient(180deg,#4bb5ff,#0869e8);
      opacity:.22;
      transition:opacity .28s ease;
    }
    .companyBenefits .companyDetail small{
      color:#1878f3;
      font-weight:800;
      letter-spacing:.10em;
    }
    .companyBenefits .companyDetail b{
      color:#0a1732;
      font-weight:700;
    }
    /* Estado activo único: auto-ciclo cada 3s + transferencia por hover/focus. */
    .companyBenefits .companyDetail.is-active{
      transform:translateY(-3px);
      border-color:rgba(31,139,255,.48);
      background:linear-gradient(145deg,#ffffff 0%,#e9f4ff 100%);
      box-shadow:0 14px 30px rgba(17,88,170,.12);
    }
    .companyBenefits .companyDetail.is-active::before{
      opacity:1;
      width:4px;
    }
    .companyBenefits .companyDetail.is-active small{color:#0b6fe8}
    .companyBenefits .companyDetail.is-active b{color:#071f45}
    .companyBenefits .companyDetail:focus-visible{
      outline:2px solid rgba(73,174,255,.72);
      outline-offset:3px;
    }
    @media(hover:hover) and (pointer:fine){
      .companyBenefits .companyDetail:hover{z-index:2}
    }
    @media(prefers-reduced-motion:reduce){
      .companyBenefits .companyDetail,
      .companyBenefits .companyDetail::before{transition:none !important}
    }



    /* =========================================================
       FCC · REVISIÓN RESPONSIVE FINAL
       360 / 390 / 430 / tablet / desktop
       ========================================================= */
    html,body{max-width:100%;overflow-x:hidden}
    img,video{height:auto}

    /* Evita saltos visuales mientras cargan imágenes y mantiene tarjetas parejas. */
    .serviceCard img,.companyMedia img,.productImage img{width:100%;height:100%;object-fit:cover}

    @media(max-width:1180px){
      .sectionHead{gap:38px!important}
      .serviceGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important}
      .serviceCard{min-height:440px!important}
      .companyGrid{grid-template-columns:1fr!important}
      .companyMedia{min-height:390px!important;max-height:500px}
      .valuesGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
      .valueLead{grid-column:1/-1!important}
      .quoteCard{grid-template-columns:minmax(0,1.15fr) minmax(230px,.65fr)!important}
      .footerGrid{grid-template-columns:1.25fr repeat(3,1fr)!important;gap:34px!important}
    }

    @media(max-width:900px){
      .heroEditorial{min-height:650px!important;height:88svh!important;max-height:820px!important}
      .heroEditorial .heroGridClean{padding-top:108px!important;padding-bottom:92px!important}
      .heroEditorial .heroTitle{font-size:clamp(34px,7.2vw,52px)!important;max-width:14ch!important}
      .heroEditorial .heroLead{max-width:38ch!important}
      .sectionHead{grid-template-columns:1fr!important;gap:18px!important;align-items:start!important}
      .sectionHead>div:last-child{max-width:680px}
      .companyBody{padding:42px 38px!important}
      .quoteCard{grid-template-columns:1fr!important;padding:38px 38px!important}
      .quoteAction{justify-self:start!important;text-align:left!important}
      .worldGrid{grid-template-columns:1fr!important;gap:30px!important}
      .footerGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:30px 44px!important}
      .footerGrid>div:first-child{grid-column:1/-1!important}
    }

    @media(max-width:760px){
      .wrap{width:min(calc(100% - 28px),1420px)!important}

      /* Hero: más altura y sin zoom para conservar rostro + prenda en los videos verticales. */
      .heroEditorial{min-height:640px!important;height:94svh!important;max-height:860px!important}
      .heroEditorial .heroVideoSlide,
      .heroEditorial .heroVideoSlide.is-active{
        transform:scale(1)!important;
      }
      .heroEditorial .heroGridClean{padding-top:92px!important;padding-bottom:78px!important;align-items:flex-end!important}
      .heroEditorial .heroCopyClean{width:min(100%,390px)!important}
      .heroEditorial .heroCopyClean .eyebrow{max-width:96%!important;margin-bottom:8px!important;font-size:7.8px!important;line-height:1.35!important;letter-spacing:.14em!important}
      .heroEditorial .heroTitle{max-width:12ch!important;margin-bottom:10px!important;font-size:clamp(29px,9vw,40px)!important;line-height:.98!important;letter-spacing:-.038em!important}
      .heroEditorial .heroLead{max-width:30ch!important;font-size:12.5px!important;line-height:1.45!important}
      .heroEditorial .heroActionsClean{margin-top:15px!important}
      .heroEditorial .heroActionsClean .btnPrimary{min-height:42px!important;padding-inline:17px!important;font-size:10.5px!important}
      .heroEditorial .heroBottomClean{bottom:15px!important}
      .heroEditorial .heroBottomClean span{font-size:7px!important;letter-spacing:.11em!important}
      .heroEditorial .heroVideoNav{right:13px!important;bottom:15px!important}
      .heroEditorial .heroVideoNav button.is-active{width:22px!important}

      /* Propuesta de valor: dos columnas en móvil ancho para evitar bloques interminables. */
      .heroValueStrip{padding-bottom:42px!important}
      .heroValueStrip .factsGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important;top:-12px!important;border-radius:18px!important}
      .heroValueStrip .heroValueItem{min-height:116px!important;padding:16px 15px!important}
      .heroValueStrip .heroValueItem small{margin-bottom:7px!important}
      .heroValueStrip .heroValueItem strong{font-size:18px!important;margin-bottom:5px!important}
      .heroValueStrip .heroValueItem span{font-size:10.5px!important;line-height:1.4!important}

      .section{padding:58px 0!important}
      .sectionHead{margin-bottom:24px!important}
      .sectionHead h2,.companyBody h2,.valueLead h2,.quoteCard h2,.productsHead h2,.worldSection h2{font-size:clamp(32px,9.5vw,44px)!important;line-height:1.02!important}
      .sectionHead p,.companyBody p,.productsIntro p,.worldSection p{font-size:13px!important;line-height:1.55!important}

      .serviceGrid{grid-template-columns:1fr!important;gap:14px!important}
      .serviceCard{min-height:390px!important;border-radius:20px!important}
      .serviceContent{left:20px!important;right:20px!important;bottom:20px!important}
      .serviceContent h3{font-size:30px!important}

      .companyGrid{border-radius:22px!important}
      .companyMedia{min-height:280px!important;max-height:360px!important}
      .companyBody{padding:30px 22px!important}
      .companyDetails{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;margin:20px 0!important}
      .companyDetail{padding:12px 12px!important}
      .companyDetail b{font-size:11.5px!important;overflow-wrap:anywhere}

      .values{padding:54px 0!important}
      .valuesGrid{grid-template-columns:1fr!important;border-radius:20px!important}
      .valueLead,.valueCard{padding:22px!important}
      #fccValues .valueCard{min-height:155px!important}

      .quoteSection{padding-bottom:62px!important}
      .quoteCard{padding:28px 22px!important;border-radius:22px!important;gap:22px!important}
      .quoteAction small{text-align:left!important;font-size:9.5px!important}

      /* Productos: carrusel horizontal táctil. No se comprimen cinco tarjetas. */
      .productsHead{display:grid!important;grid-template-columns:1fr!important;gap:18px!important}
      .productsIntro{max-width:100%!important}
      .productShowcase{display:flex!important;gap:12px!important;overflow-x:auto!important;overflow-y:hidden!important;scroll-snap-type:x mandatory!important;overscroll-behavior-inline:contain;padding:2px 2px 14px!important;-webkit-overflow-scrolling:touch;scrollbar-width:none}
      .productShowcase::-webkit-scrollbar{display:none}
      .productTile{flex:0 0 min(76vw,290px)!important;min-width:0!important;scroll-snap-align:start!important}
      .productImage{aspect-ratio:4/3!important;overflow:hidden!important}

      .worldSection{padding:58px 0!important}
      .worldStats{grid-template-columns:1fr 1fr!important}
      .worldCta{grid-column:1/-1!important}

      .footer{padding-top:44px!important}
      .footerGrid{grid-template-columns:1fr 1fr!important;gap:24px 28px!important}
      .footerGrid>div:first-child{grid-column:1/-1!important}
      .footerBottom{gap:10px!important}
      .floaters{right:10px!important;bottom:12px!important}
      .floater{width:46px!important;height:46px!important}
    }

    @media(max-width:480px){
      .wrap{width:min(calc(100% - 22px),1420px)!important}
      .heroEditorial{min-height:630px!important;height:96svh!important;max-height:820px!important}
      .heroEditorial .heroGridClean{padding-top:92px!important;padding-bottom:66px!important}
      .heroEditorial .heroTitle{font-size:clamp(27px,9.2vw,36px)!important;max-width:12ch!important}
      .heroEditorial .heroLead{font-size:12px!important}
      .heroEditorial .heroBottomClean span{display:none!important}

      .heroValueStrip .factsGrid{grid-template-columns:1fr!important}
      .heroValueStrip .heroValueItem{min-height:96px!important;border-right:0!important;padding:14px 16px!important}
      .heroValueStrip .heroValueItem strong{font-size:17px!important}

      .companyDetails{grid-template-columns:1fr!important}
      .companyMedia{min-height:240px!important}
      .serviceCard{min-height:360px!important}
      .productTile{flex-basis:min(82vw,286px)!important}
      .worldStats{grid-template-columns:1fr!important}
      .worldCta{grid-column:auto!important}
      .footerGrid{grid-template-columns:1fr!important}
      .footerGrid>div:first-child{grid-column:auto!important}
      .footerClaimsRow{justify-content:flex-start!important}
    }

    @media(max-width:380px){
      .heroEditorial{min-height:610px!important;height:96svh!important}
      .heroEditorial .heroGridClean{padding-top:88px!important;padding-bottom:58px!important}
      .heroEditorial .heroCopyClean .eyebrow{font-size:7px!important}
      .heroEditorial .heroTitle{font-size:clamp(25px,9vw,33px)!important}
      .heroEditorial .heroLead{max-width:28ch!important}
      .heroEditorial .heroActionsClean .btnPrimary{min-height:40px!important;padding-inline:15px!important}
      .serviceCard{min-height:340px!important}
      .companyBody{padding:26px 18px!important}
      .valueLead,.valueCard{padding:19px!important}
      .quoteCard{padding:25px 18px!important}
      .productTile{flex-basis:84vw!important}
    }



    /* =========================================================
       SOBRE FCC COMPANY · versión compacta / premium
       Reduce altura en desktop, tablet y móvil sin perder contenido.
       ========================================================= */
    .company{
      padding:64px 0 !important;
    }
    .company .companyGrid{
      width:min(calc(100% - 56px),1240px) !important;
      margin-inline:auto !important;
      grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr) !important;
      min-height:520px !important;
      border-radius:26px !important;
      overflow:hidden !important;
    }
    .company .companyMedia{
      position:relative !important;
      align-self:stretch !important;
      min-height:520px !important;
      max-height:none !important;
      overflow:hidden !important;
    }
    .company .companyMedia img{
      position:absolute !important;
      inset:0 !important;
      display:block !important;
      width:100% !important;
      height:100% !important;
      object-fit:cover !important;
      object-position:center 48% !important;
    }
    .company .companyBody{
      display:flex !important;
      flex-direction:column !important;
      justify-content:center !important;
      padding:44px 48px !important;
    }
    .company .companyBody>.eyebrow{
      margin-bottom:14px !important;
    }
    .company .companyBody>h2{
      max-width:none !important;
      margin:0 0 18px !important;
      font-size:clamp(38px,3.35vw,54px) !important;
      line-height:.98 !important;
      letter-spacing:-.045em !important;
    }
    .company .companyTitleLine{
      display:block !important;
      white-space:nowrap;
    }
    .company .companyBody>h2 em{
      display:block !important;
      margin-top:2px;
    }
    .company .companyBody>p{
      max-width:58ch !important;
      margin:0 !important;
      font-size:13.5px !important;
      line-height:1.55 !important;
    }
    .company .companyDetails{
      display:grid !important;
      grid-template-columns:repeat(2,minmax(0,1fr)) !important;
      gap:10px !important;
      margin:22px 0 20px !important;
    }
    .company .companyBenefits .companyDetail{
      min-height:66px !important;
      padding:12px 15px !important;
      border-radius:14px !important;
      display:flex !important;
      flex-direction:column !important;
      justify-content:center !important;
      gap:5px !important;
    }
    .company .companyBenefits .companyDetail small{
      font-size:8.5px !important;
      line-height:1.1 !important;
    }
    .company .companyBenefits .companyDetail b{
      font-size:12.5px !important;
      line-height:1.25 !important;
    }
    .company .companyBtn{
      align-self:flex-start !important;
      min-height:44px !important;
      padding:0 18px !important;
      font-size:10.5px !important;
    }

    @media(max-width:1180px){
      .company{padding:56px 0 !important}
      .company .companyGrid{
        width:min(calc(100% - 40px),1040px) !important;
        grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr) !important;
        min-height:480px !important;
      }
      .company .companyMedia{min-height:480px !important;max-height:none !important;align-self:stretch !important}
      .company .companyBody{padding:36px 38px !important}
      .company .companyBody>h2{font-size:clamp(36px,4vw,48px) !important}
    }

    /* En escritorio la foto acompaña automáticamente toda la altura del contenido.
       Así no queda un bloque blanco debajo cuando el texto derecho crece. */
    @media(min-width:901px){
      .company .companyMedia{
        height:auto !important;
        max-height:none !important;
        align-self:stretch !important;
      }
    }

    @media(max-width:900px){
      .company{padding:48px 0 !important}
      .company .companyGrid{
        width:min(calc(100% - 32px),760px) !important;
        grid-template-columns:1fr !important;
        min-height:0 !important;
      }
      .company .companyMedia{
        min-height:220px !important;
        height:220px !important;
        max-height:220px !important;
      }
      .company .companyMedia img{object-position:center 44% !important}
      .company .companyBody{padding:30px 32px 32px !important}
      .company .companyBody>h2{
        max-width:none !important;
        font-size:clamp(34px,6vw,44px) !important;
        margin-bottom:14px !important;
      }
      .company .companyDetails{margin:18px 0 18px !important}
    }

    @media(max-width:760px){
      .company{padding:40px 0 !important}
      .company .companyGrid{
        width:min(calc(100% - 24px),620px) !important;
        border-radius:20px !important;
      }
      .company .companyMedia{
        min-height:180px !important;
        height:180px !important;
        max-height:180px !important;
      }
      .company .companyBody{padding:24px 20px 26px !important}
      .company .companyBody>.eyebrow{margin-bottom:10px !important}
      .company .companyBody>h2{
        max-width:none !important;
        margin-bottom:12px !important;
        font-size:clamp(29px,8vw,36px) !important;
        line-height:1 !important;
      }
      .company .companyBody>p{
        font-size:12.25px !important;
        line-height:1.5 !important;
      }
      .company .companyDetails{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:8px !important;
        margin:16px 0 16px !important;
      }
      .company .companyBenefits .companyDetail{
        min-height:62px !important;
        padding:10px 11px !important;
        border-radius:12px !important;
      }
      .company .companyBenefits .companyDetail small{font-size:7.5px !important}
      .company .companyBenefits .companyDetail b{font-size:11px !important}
      .company .companyBtn{
        min-height:41px !important;
        padding:0 15px !important;
        font-size:10px !important;
      }
    }

    @media(max-width:430px){
      .company{padding:34px 0 !important}
      .company .companyGrid{width:calc(100% - 18px) !important}
      .company .companyMedia{
        min-height:150px !important;
        height:150px !important;
        max-height:150px !important;
      }
      .company .companyBody{padding:20px 16px 22px !important}
      .company .companyBody>h2{
        max-width:none !important;
        font-size:clamp(27px,8.5vw,32px) !important;
      }
      .company .companyBody>p{font-size:11.75px !important}
      .company .companyDetails{gap:7px !important;margin:14px 0 !important}
      .company .companyBenefits .companyDetail{
        min-height:58px !important;
        padding:9px 10px !important;
      }
      .company .companyBenefits .companyDetail small{font-size:7px !important;letter-spacing:.07em !important}
      .company .companyBenefits .companyDetail b{font-size:10.5px !important}
    }

    @media(max-width:360px){
      .company .companyMedia{
        min-height:135px !important;
        height:135px !important;
        max-height:135px !important;
      }
      .company .companyBody{padding:18px 14px 20px !important}
      .company .companyBody>h2{font-size:24px !important}
      .company .companyDetails{grid-template-columns:1fr 1fr !important}
      .company .companyBenefits .companyDetail b{font-size:10px !important}
    }

/* ==========================================================================
   FIX HERO VIDEO RESPONSIVE - iPhone / Safari + sin flash desktop en móvil
   Desktop y móvil usan grupos de video físicamente separados.
   El CSS decide el grupo visible ANTES de que se ejecute JavaScript.
   ========================================================================== */
.heroEditorial .heroVideoDesktopVideos,
.heroEditorial .heroVideoMobileVideos{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  overflow:hidden;
}

.heroEditorial .heroVideoDesktopVideos{display:block;}
.heroEditorial .heroVideoMobileVideos{display:none;}

@media (max-width:760px){
  .heroEditorial .heroVideoDesktopVideos{display:none !important;}
  .heroEditorial .heroVideoMobileVideos{display:block !important;}
  .heroEditorial .heroVideoMobileVideos .heroVideoSlide{
    left:0 !important;
    right:0 !important;
    top:0 !important;
    bottom:0 !important;
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
  }
}

@media (min-width:761px){
  .heroEditorial .heroVideoDesktopVideos{display:block !important;}
  .heroEditorial .heroVideoMobileVideos{display:none !important;}
}