/* ===== Reset mínimo y tipografía base ===== */
* { box-sizing: border-box; }
html, body { height: 100%; }
body {
  margin: 0;
  font-family: "Pattaya", sans-serif;
  color: var(--zrco-text, #ffffff);
  background: var(--zrco-bg, #0A4F97);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.zrco-alert {
  position: fixed;
  top: 18px;
  left: 50%;
  transform: translate3d(-50%, 0, 0);
  max-width: 480px;
  width: calc(100% - 32px);
  padding: 0.85rem 1.1rem;
  border-radius: 999px;
  font-size: 0.9rem;
  background: rgba(10, 37, 64, 0.96);
  color: #e5f0ff;
  border: 1px solid rgba(59, 130, 246, 0.7);
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.6);
  z-index: 1000;
  opacity: 1;
  transition: opacity .4s ease, transform .4s ease;
}

.zrco-alert--ok {
  border-color: #38bdf8;
}

.zrco-alert--error {
  border-color: #f97373;
}

.zrco-alert--hide {
  opacity: 0;
  transform: translate3d(-50%, -10px, 0);
  pointer-events: none;
}



/* ===== Paleta (respeta tus variables globales si existen) =====
   Si ya tenés:
   --basePrincipalColor, --baseSecondColor, etc., las usamos como fallback.
*/
:root{
  /* Azul corporativo + blanco */
  --zrco-primary: var(--basePrincipalColor, #0D74D6);       /* azul principal */
  --zrco-primary-600: var(--basePrincipalColorHover2, #0A4F97);
  --zrco-accent: #E6F0FF;                                   /* acento sutil en claros */
  --zrco-bg: #0A4F97;    
  --zrco-bg-white: radial-gradient(900px 600px at -10% 0%, rgba(13,116,214,0.08), transparent 60%),
    linear-gradient(180deg, #FFFFFF 0%, #F6FAFF 100%);
  --zrco-bg-blue:
    radial-gradient(900px 500px at -10% 0%, rgba(255,255,255,0.10), transparent 60%),
    radial-gradient(600px 500px at 110% 10%, rgba(255,255,255,0.08), transparent 60%),
    linear-gradient(180deg, #0A5FAF, #0A4F97);
  --zrco-surface: rgba(255,255,255,0.04);                   /* cards/superficie en oscuro */
  --zrco-text: #ffffff;                                     /* texto principal */
  --zrco-muted: #D7E6FF;                                    /* textos secundarios */
  --zrco-border: rgba(255,255,255,0.12);

  /* Gradientes y decoraciones */
  --zrco-grad-1: radial-gradient(1200px 600px at 10% -10%, rgba(255,255,255,0.10), transparent 60%);
  --zrco-grad-2: radial-gradient(1000px 800px at 110% 10%, rgba(255,255,255,0.08), transparent 60%);
  --white-text: linear-gradient(180deg, rgba(255,255,255,.70), rgba(255,255,255,.55));
}

:root{
  --zrco-hero-top: #E8F2FF;    /* claro */
  --zrco-hero-mid: #1C6FD1;    /* intermedio */
  --zrco-hero-bottom: #0A4F97; /* profundo */
    --header-h: 0px;
    --hdr-h: 120px;
}

.bg-blue{
  position: relative;        /* crea contexto para los pseudo */
  isolation: isolate;        /* evita mezclas con afuera */
  z-index: 0;

  /* Pinta SOLO los gradientes en la capa base */
  background-image: var(--zrco-bg-blue);
  background-repeat: no-repeat;
  background-position: center;   /* o lo que necesites */
  background-size: cover;        /* que llene bien */

  /* quita filtros al contenedor para no afectar texto */
  filter: none;
  will-change: auto;
}

/* Fondo imagen con Ken Burns: SOLO acá va la imagen/texture */
.bg-blue::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;                /* detrás del contenido */
  pointer-events: none;

  /* si --section-bg es una IMAGEN, y no un gradient, úsala sola */
  background-image: var(--section-bg);
  background-repeat: no-repeat;         /* o repeat si es textura tileable */
  background-position: right bottom;    /* ajusta según tu diseño */
  background-size: 70%;               /* o 'auto' si es textura repeat */

  /* efecto suave sin lavar demasiado */
  filter: saturate(1.1) blur(0.5px);
  opacity: .22;                         /* baja un poco el “humo” */
}

/* Viñeta/tinte superior para legibilidad */
.bg-blue::after{
  content:"";
  position:absolute;
  inset:0;
  z-index: -1;              /* también detrás del contenido */
  pointer-events: none;
  background: radial-gradient(
    80% 60% at 70% 40%,
    transparent 0%,
    rgba(6,58,114,0.38) 70%,
    rgba(6,58,114,0.58) 100%
  );
}


.bg-white{
  background: var(--zrco-bg-white);
}

/* ===== Contenedor ===== */
.zrco-container{
  width: min(1120px, 92%);
  margin-inline: auto;
}

/* ===== Header ===== */
.zrco-header{
  position: absolute;
    display: none;
  inset-inline: 0;
  top: 0;
  z-index: 50;
  backdrop-filter: saturate(1.2) blur(12px);
  background: linear-gradient(to bottom, rgba(13,116,214,0.70), rgba(10,79,151,0.35), transparent);
  border-bottom: 1px solid var(--zrco-border);
  will-change: transform, opacity;
}

/* Estado sticky: solo cambia a fixed + animación por transform */
.zrco-header.is-sticky{
    display: block;
  position: fixed;
  left: 0; right: 0; top: 0;
  animation: zrcoHeaderDrop 320ms ease-out both;
  background: rgba(13,116,214,0.80); /* opcional más sólido */
}

@keyframes zrcoHeaderDrop{
  from { transform: translateY(-100%); opacity: 0.001; }
  to   { transform: translateY(0);      opacity: 1; }
}

/* Ejemplo: tu hero ya tenía padding-top; que use la altura real del header */
.zrco-hero{
  padding-top: var(--hdr-h);
}

@media (prefers-reduced-motion: reduce){
  .zrco-header.is-sticky{ animation: none; }
}
.zrco-header .zrco-container{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 0;
}
.zrco-logo{
  display: flex;
  text-decoration: none;
}

.zrco-logo img{
    width: 150px;
}

.zrco-nav ul{
    position: relative;
    align-items: center;
  list-style: none;
  display: flex;
  gap: 18px;
  margin: 0;
  padding: 0;
}

.zrco-nav a{
  color: var(--zrco-text);
  text-decoration: none;
  font-size: 0.95rem;
  font-weight: bold;
  padding: 8px 10px;
  border: 2px solid rgb(255,255,255,0.1);
  border-radius: 999px;
  transition: transform .2s ease, background-color .2s ease, color .2s ease;
}
.zrco-nav a:hover{
  background: rgba(255, 255, 255, 0.1);
  transform: translateY(-1px);
}

/* ===== Botones ===== */
.zrco-btn{
  display: inline-block;
  padding: 12px 18px;
  border-radius: 12px;
  text-decoration: none;
  font-weight: 600;
  letter-spacing: .2px;
  transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease;
  border: 1px solid transparent;
  will-change: transform;
}
.zrco-btn--primary{
  background: linear-gradient(135deg, var(--zrco-primary), var(--zrco-primary-600));
  color: white;
  box-shadow: 0 12px 30px rgba(13,116,214,.18);
}
.zrco-btn--primary:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(13,116,214,.26);
}
.zrco-btn--secondary{
  background: rgba(255,255,255,0.10);
  color: var(--zrco-text);
  border-color: rgba(255,255,255,0.22);
}
.zrco-btn--secondary:hover{
  background: rgba(255,255,255,0.18);
  transform: translateY(-2px);
}
.zrco-btn--ghost{
  background: transparent;
  color: var(--zrco-text);
  border-color: rgba(255,255,255,0.22);
}
.zrco-btn--ghost:hover{ background: rgba(255,255,255,0.10); }

/* ===== Hero ===== */
/* ==== Variables mínimas de apoyo (ajustá a tu escala) ==== */
:root{
  --header-h: 88px;
  --zrco-text: #ffffff;
  --zrco-muted: rgba(255,255,255,.78);

  /* Gradientes base del hero (podés reemplazar por tus variables) */
  --zrco-hero-top: #0a2a4a;
  --zrco-hero-mid: #0b355c;
  --zrco-hero-bottom: #0a2744;
  --zrco-grad-1: radial-gradient(1200px 1200px at 10% -10%, rgba(255,255,255,.06), transparent 60%);
  --zrco-grad-2: radial-gradient(900px 900px at 110% 110%, rgba(13,116,214,.10), transparent 60%);
}

/* ===== Variables base (ajusta a tu paleta si ya tienes otras) ===== */
:root{

  --zrco-text: #ffffff;
  --zrco-muted: rgba(255,255,255,0.78);

  --zrco-hero-top: #0a0f1a;
  --zrco-hero-mid: #0f1f35;
  --zrco-hero-bottom: #0b1422;

  --zrco-accent: #0d74d6; /* acento para subrayado y botones */
  --zrco-accent-2: #0a4f97;

  --panel-bg: linear-gradient(135deg, rgba(12,22,40,0.78), rgba(12,22,40,0.38));
}

/* Contenedor genérico (si no existe en tu sistema) */
.zrco-container{
  width: min(1120px, 92%);
  margin-inline: auto;
}

/* ===== HERO ===== */
/* ===== Paleta de marca (azules del ejemplo) ===== */
:root{
  --header-h: 0px;

  /* Colores base */
  --brand-1: #0E79E6; /* azul vivo (arriba/izq) */
  --brand-2: #0A5EC0; /* azul medio */
  --brand-3: #063A72; /* azul profundo (abajo/der) */

  /* Texto */
  --zrco-text: #ffffff;
  --zrco-muted: rgba(255,255,255,0.80);

  /* Acentos y panel */
  --zrco-accent: #58A9FF;
  --zrco-accent-2: #2D8BEB;
  --panel-bg: linear-gradient(135deg, rgba(6,58,114,0.70), rgba(14,121,230,0.38));
}

/* Contenedor genérico */
.zrco-container{
  width: min(1120px, 92%);
  margin-inline: auto;
}

/* ===== HERO ===== */
.zrco-hero{
  position: fixed;
    width: 100%;
  min-height: calc(100dvh - var(--header-h));
  display: grid;
  align-items: center;
  isolation: isolate;
  overflow: hidden;
  color: var(--zrco-text);
  background-image: var(--hero-bg);

    /* ---- BLUR DINÁMICO EN HERO ---- */
  --hero-blur: 0px;                 /* valor inicial */
  filter: blur(var(--hero-blur));   /* aplica el blur a TODO el hero (incluye hijos y ::before/::after) */
  will-change: filter;              /* mejora performance */
}

.first{
  background: var(--panel-bg);
  
}


/* Subtítulo */
.zrco-hero__subtitle{
  color: var(--zrco-muted);
  font-size: clamp(1.05rem, 1.8vw, 1.2rem);
  margin: 0 0 22px; max-width: 60ch;
}

/* Fondo imagen con Ken Burns suave */
.zrco-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background-image: var(--hero-bg, none);
  background-size: 50%;
  background-position: right;
  background-repeat: no-repeat;
  filter: blur(1px);
  opacity: .28;              /* mantiene presencia sin oscurecer */
  transform: scale(1.05);
  animation: kenburns 16s ease-in-out both;
  z-index: 0;
}

.first2::before{
  background-size: 100%;
}

/* Viñeta con tinte azul (no negro) para legibilidad */
.zrco-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(80% 60% at 70% 40%, transparent 0%, rgba(6,58,114,0.42) 70%, rgba(6,58,114,0.62) 100%);
  pointer-events: none;
  z-index: 0;
}

/* Panel diagonal acorde a la marca */
.zrco-hero__panel{
  position: absolute;
  inset: 0 0% 0 0;

  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  clip-path: polygon(0 0, 92% 0, 80% 100%, 0% 100%);
  z-index: 1;
}

/* Contenido */
.zrco-hero__inner{
  position: relative;
  z-index: 2;
  margin-left: 120px;

  /* Ajustes rápidos */
  --border-thick: 6px;   /* grosor de la “línea” */
  --border-len: 20%;      /* largo relativo de la línea */

  /* Líneas centradas arriba y abajo */
  background:
    linear-gradient(#fff, #fff) top    left / var(--border-len) var(--border-thick) no-repeat,
    linear-gradient(#fff, #fff) bottom left / var(--border-len) var(--border-thick) no-repeat;
}

.zrco-hero__content{ 
    padding: clamp(150px, 6vw, 48px) 0; 
}

/* Marca */
.zrco-hero__brand{
  display:block; 
  gap:12px;
}

.zrco-logo-img{ 
  height: clamp(146px, 5.8vw, 100px); 
  width:auto; display:block; 
}


.zrco-brand-tag{
  font-size: 2rem;
  letter-spacing: .6px; 
  text-transform: uppercase; 
  color: #ffffff;
  font-weight: bold;
}

/* Título */
.zrco-hero__title{
  font-size: clamp(2.6rem, 5.8vw, 4.2rem);
  line-height: 1.05; margin: 0 0 12px; letter-spacing: -0.5px;
}
.zrco-underline{
  position: relative; 
  display: inline-block; 
  white-space: nowrap;
}
.zrco-underline::after{
  content:"";
  position:absolute; left:0; right:0; bottom:-8px; height:10px;
  background: linear-gradient(90deg, rgba(255,255,255,0), var(--zrco-accent), rgba(255,255,255,0));
  border-radius: 999px; filter: blur(1px); opacity:.95;
}


/* CTAs */
.zrco-cta{ display:flex; gap:12px; flex-wrap:wrap; margin-bottom:20px; }
.zrco-btn{
  --p: 12px;
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding: var(--p) clamp(16px, 2vw, 22px);
  border-radius: 10px; font-weight: 600; text-decoration:none;
  border: 1px solid transparent;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
}
.zrco-btn:active{ transform: translateY(1px) scale(.995); }

.zrco-btn--primary{
  background: linear-gradient(180deg, var(--zrco-accent) 0%, var(--zrco-accent-2) 100%);
  color:#fff; box-shadow: 0 6px 22px rgba(45,139,235,.28);
}
.zrco-btn--primary:hover{ box-shadow: 0 10px 28px rgba(45,139,235,.38); }

.zrco-btn--secondary{
  background: rgba(255,255,255,.10); color:#fff; border-color: rgba(255,255,255,.18);
}
.zrco-btn--secondary:hover{
  background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.30);
}

/* Métricas */
.zrco-trust{
  display:flex; gap:16px; flex-wrap: wrap; list-style:none; padding:0; margin: 0 0 6px;
  color: var(--zrco-muted);
}

.zrco-trust strong{ color:#fff; font-weight:700; letter-spacing:.2px; }

/* URL */
.zrco-hero__url a{
  color: var(--zrco-muted); text-decoration: none;
  border-bottom: 1px dashed rgba(255,255,255,0.35); padding-bottom: 2px;
}
.zrco-hero__url a:hover{
  color: var(--zrco-text); border-bottom-color: rgba(255,255,255,0.55);
}

/* Blueprint */
.zrco-blueprint{ position:absolute; inset:0; z-index: 0; pointer-events: none; }
.zrco-blueprint path{ stroke: rgba(255,255,255,.42); stroke-width: 1; }

/* Formas decorativas (tintes de la marca) */
.zrco-shape{
  position:absolute; border-radius: 999px; opacity:.28;
  filter: blur(18px); mix-blend-mode: screen; animation: floaty 14s ease-in-out infinite;
  z-index: 1;
}
.zrco-shape--a{
  width: 340px; height: 340px;
  background: radial-gradient(circle at 30% 30%, rgba(88,169,255,.45), rgba(88,169,255,.06));
  top: 12%; left: -90px; animation-delay: .2s;
}
.zrco-shape--b{
  width: 420px; height: 420px;
  background: radial-gradient(circle at 60% 40%, rgba(46,122,214,.35), rgba(46,122,214,.06));
  bottom: -80px; right: -120px; animation-delay: .6s;
}
.zrco-shape--c{
  width: 240px; height: 240px;
  background: radial-gradient(circle at 50% 50%, rgba(255,255,255,.22), transparent 60%);
  top: 36%; right: 18%; animation-delay: 1.2s;
}

/* Animaciones */
.reveal{ opacity: 0; transform: translateY(12px); animation: reveal .7s cubic-bezier(.2,.8,.2,1) forwards; animation-delay: var(--d, 0ms); }
@keyframes reveal{ to{ opacity:1; transform: translateY(0); } }
@keyframes floaty{ 0%,100%{ transform: translate3d(0,0,0) scale(1); } 50%{ transform: translate3d(0,-12px,0) scale(1.03); } }
@keyframes kenburns{ 0%{ transform: scale(1.05); } 50%{ transform: scale(1.1) translate3d(0,-1%,0); } 100%{ transform: scale(1.06); } }

/* Accesibilidad */
@media (prefers-reduced-motion: reduce){
  .zrco-shape, .reveal, .zrco-hero::before{ animation: none !important; transform: none !important; }
}

/* Responsive */
@media (max-width: 1024px){
  .zrco-hero__panel{ inset: 0 28% 0 0; }
}
@media (max-width: 860px){
  .zrco-hero__panel{ inset:0; clip-path:none; background: linear-gradient(180deg, rgba(6,58,114,0.78), rgba(14,121,230,0.42)); }
  .zrco-shape--c{ display:none; }
  .zrco-hero__subtitle{ margin-bottom: 18px; }
  
  
  .zrco-hero__inner{
    margin: 0 auto;
    }
  
  .zrco-hero__content{ 
    padding: clamp(150px, 6vw, 48px) 0; 
  margin: 0 auto;
  display: grid;
  place-items: center;
  text-align: center;
}
  
  


/* Fondo imagen con Ken Burns: SOLO acá va la imagen/texture */
.bg-blue::before{  /* ajusta según tu diseño */
  background-size: cover;               /* o 'auto' si es textura repeat */                    /* baja un poco el “humo” */
}
}
@media (max-width: 600px){
  .zrco-hero__title{ font-size: clamp(2.1rem, 8vw, 2.8rem); }
  .zrco-trust{ gap:10px; }
  .zrco-trust li{ padding:7px 10px; }
}


.lolo{
    height: calc(100vh - var(--header-h));
  z-index: 100000;
}


/* ============================
   NUEVO RESPONSIVE HERO ZARCO
   (solo primera sección)
   ============================ */

/* Ajustes suaves para pantallas medianas */
@media (max-width: 1024px) {
  .zrco-hero {
    min-height: 100vh;
  }

  .zrco-hero__inner {
    margin: 0 auto;
    max-width: 760px;
    padding-inline: 32px;
  }

  .zrco-hero__content {
    padding-block: 140px 120px;
  }
}

/* Tablet vertical y móviles: solo logo + título, imponente */
@media (max-width: 860px) {
  .zrco-hero {
    min-height: 100vh;
  }

  /* Fondo más adaptado a móvil */
  .zrco-hero::before {
    background-position: center;
    background-size: cover;
  }

  /* Shapes y blueprint más suaves para no ensuciar */
  .zrco-blueprint {
    opacity: 0.16;
  }
  .zrco-shape--a,
  .zrco-shape--b,
  .zrco-shape--c {
    opacity: 0.24;
    filter: blur(16px);
  }

  /* Contenedor del contenido: centrado e imponente */
  .zrco-hero__inner {
    margin: 0 auto;
    max-width: 540px;
    padding-inline: 24px;
    background: none; /* quita las líneas blancas laterales si las tenías */
  }

  .zrco-hero__content {
    padding-block: 130px 110px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 18px;
  }

  /* Logo */
  .zrco-logo-img {
    width: 50%;
    margin: 0 auto;
    height: auto;
  }

  /* Título principal bien grande */
  .zrco-hero__title {
    font-size: clamp(2.4rem, 7.6vw, 3rem);
    line-height: 1.08;
  }
  /* SOLO logo + título: escondemos todo lo demás */
  .zrco-hero__subtitle,
  .zrco-cta,
  .zrco-trust {
    display: none !important;
  }
}

/* Móviles pequeños: afinamos un poco más */
@media (max-width: 600px) {
  .zrco-hero__content {
    padding-block: 120px 96px;
  }

  .zrco-logo-img {
    width: 50%;
    margin: 0 auto;
    height: auto;
  }

  .zrco-hero__title {
    font-size: clamp(2.1rem, 8.2vw, 2.5rem);
  }
}








/* ===== Sección 2: About ===== */
.zrco-section-title{
  font-size: clamp(1.8rem, 3.4vw, 2.4rem);
  line-height: 1.15;
  margin: 0;
  color: var(--zrco-text);
  letter-spacing: -0.2px;
}
.zrco-section-subtitle{
  margin: 10px 0 0;
  color: var(--zrco-muted);
  max-width: 800px;
  font-size: clamp(1rem, 1.6vw, 1.08rem);
}

.zrco-section-title.black{
  color: #222222;
}
.zrco-section-title.blue{
  color: var(--zrco-primary-600);
}

.zrco-section-subtitle.blue{
  color: var(--zrco-primary-600);
}
.zrco-section-subtitle.black{
  color: #222222;
}


.zrco-about{
  position: relative;
  padding: 72px 0 80px;
  border-top: 1px solid var(--zrco-border);
  border-bottom: 1px solid var(--zrco-border);
}

.zrco-about__head{
  text-align: left;
  margin-bottom: 28px;
  animation: zrco-fade-slide .6s ease both;
}

/* Tarjetas: Visión / Misión / Valores */
.zrco-pillars{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  margin: 22px 0 10px;
}

.zrco-card{
  border-radius: 16px;
  border: 1px solid var(--zrco-border);
  background: var(--zrco-surface);
  color: var(--zrco-text);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease, background-color .25s ease;
  animation: zrco-fade-slide .6s ease both;
  overflow: hidden;
}
.zrco-card--glass{
  background: linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.04));
  backdrop-filter: blur(10px) saturate(1.2);
}
.zrco-card:hover{
  transform: translateY(-4px);
  box-shadow: 0 14px 28px rgba(0,0,0,.25);
  border-color: rgba(255,255,255,0.20);
}

.zrco-card__content{
  padding: 0px 20px 10px 20px;
  box-sizing: border-box;
}

.zrco-card__icon{
  display: block;           /* quita el gap de imágenes inline */
  width: 100%;
  object-fit: cover;        /* rellena y recorta */
  object-position: center;  /* centra el recorte */
}

.zrco-card__icon > img{
  width: 100%;
       
  overflow: hidden;        
  position: relative;
}
.zrco-card h3{
  margin: 6px 0 6px;
  font-size: 1.12rem;
  letter-spacing: 0.2px;
}
.zrco-card p{
  margin: 0;
  color: var(--zrco-muted);
  font-size: 0.98rem;
}

/* Métricas */
.zrco-stats{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 28px;
}

.zrco-stat{
  padding: 16px 14px;
  border: 1px solid var(--zrco-border);
  border-radius: 14px;
  background: transparent;
  backdrop-filter: blur(8px) saturate(1.1);
  text-align: center;
  animation: zrco-fade-slide .6s ease both .08s;
}
.zrco-stat__number{
  display: block;
  font-weight: 800;
  font-size: clamp(1.2rem, 3.2vw, 1.8rem);
  color: var(--zrco-text);
  letter-spacing: 0.4px;
}
.zrco-stat__label{
  display: block;
  margin-top: 2px;
  color: var(--zrco-muted);
  font-size: 0.92rem;
}

/* Responsivo */
@media (max-width: 980px){
  .zrco-pillars{ grid-template-columns: 1fr 1fr; }
  .zrco-stats{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px){
  .zrco-pillars{ grid-template-columns: 1fr; }
  .zrco-stats{ grid-template-columns: 1fr; }
}

/* ========== TWEAKS: Menú blanco + Hero menos saturado ========== */

/* Header blanco */
.zrco-header{
  background: rgba(255,255,255,0.95);
  -webkit-backdrop-filter: saturate(1.2) blur(10px);
  backdrop-filter: saturate(1.2) blur(10px);
  border-bottom: 1px solid rgba(10,79,151,.10);
  box-shadow: 0 2px 14px rgba(10,79,151,.06);
}

/* Marca y navegación en azul corporativo */
.zrco-logo{ color:#0A4F97; }
.zrco-logo small{ color:#fff; font-size: 0.7rem; position: relative; top:-4px;}

.zrco-nav a{
  color:#ffffff;
}

/* Botón "Contacto" (ghost) adaptado a header blanco */
.zrco-header .zrco-btn--ghost{
  color:#ffffff;
  border-color: rgba(13,116,214,.35);
  background: transparent;
  padding: 8px 12px;
}
.zrco-header .zrco-btn--ghost:hover{
  background: rgba(13,116,214,.10);
}





/* ===== Sección 3: Servicios (fondo blanco) ===== */
.zrco-kicker{
  display: inline-block;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-size: .78rem;
  padding: 6px 10px;
  border: 1px solid rgba(10,79,151,.18);      /* más definido en blanco */
  border-radius: 999px;
  color: #0A4F97;
  background: rgba(10,79,151,.06);            /* leve tinte en blanco */
}

.zrco-kicker.white{
  border: 1px solid rgba(255, 255, 255, 0.18);      /* más definido en blanco */
  color: #ffffff;
  background: rgba(10,79,151,.06);            /* leve tinte en blanco */
}

.zrco-services{
  position: relative;
  padding: 72px 0 84px;
  background-color: #ffffff;                   /* fondo blanco */
}

.zrco-services__head{
  text-align: left;
  margin-bottom: 28px;
  animation: zrco-fade-slide .6s ease both;
  color: #0F1E3A;                              /* título más legible en blanco */
}

.zrco-service-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 18px;
}

/* ===== Tarjeta ===== */
.zrco-service{
  position: relative;
  overflow: hidden;
  isolation: isolate;
  border-radius: 16px;
  background: #ffffff;                         /* fondo sólido para blanco */
  border: 1px solid rgba(17,42,87,.10);        /* borde suave visible en blanco */
  box-shadow: 0 2px 8px rgba(15,30,58,.06);    /* sombra sutil para flotar en blanco */
  transition:
    transform .25s ease,
    box-shadow .25s ease,
    border-color .25s ease,
    background-color .25s ease;
  animation: zrco-fade-slide .6s ease both .05s;
}

/* halo dinámico sutil (se ve sobre blanco) */
.zrco-service::before{
  content:"";
  position:absolute; inset:-1px;
  border-radius: 16px;
  background:
    conic-gradient(from 180deg at 50% 50%,
      rgba(13,116,214,0.00),
      rgba(13,116,214,0.28),
      rgba(13,116,214,0.00));
  z-index:-1; opacity:0; transition: opacity .3s ease;
  filter: blur(14px);
}

.zrco-service:hover{
  transform: translateY(-4px);
  box-shadow: 0 16px 34px rgba(10,79,151,.16);
  border-color: rgba(13,116,214,.28);
  background-color: #ffffff;
}
.zrco-service:hover::before{ opacity: .9; }

/* contenido interno */
.zrco-service__body{
  padding: 16px 16px 18px;
}

.zrco-service h3{
  margin: 6px 0 8px;
  font-size: 1.08rem;
  letter-spacing: .2px;
  color: #0A4F97;                              /* titular de tarjeta */
}

.zrco-service p{
  margin: 0 0 8px;
  color: #1B2A4A;                              /* texto principal en blanco */
  line-height: 1.5;
}

.zrco-service__icon{
  width: 46px; height: 46px;
  display: grid; place-items: center;
  border-radius: 12px;
  margin-bottom: 10px;
  font-size: 22px;
  color:#fff;
  background: linear-gradient(135deg, var(--zrco-primary), var(--zrco-primary-600));
  box-shadow: 0 8px 20px rgba(13,116,214,.22);
}

/* lista de features */
.zrco-service__list{
  margin: 0; padding-left: 18px;
  color: #1B2A4A;
}
.zrco-service__list li{
  margin: 4px 0;
  color: #2A3F66;                              /* contraste adecuado en blanco */
}


/* ===== Responsivo ===== */
@media (max-width: 1024px){
  .zrco-service-grid{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px){
  .zrco-services{ padding: 56px 0 64px; }
  .zrco-service-grid{ grid-template-columns: 1fr; }
}



/* ===== Sección 4: Proceso de trabajo ===== */
/* ===== Proceso ===== */
.zrco-process{ 
  position:relative; 
  padding:76px 0 90px; 
  box-shadow: 0 0 1rem rgba(0, 0, 0, .12);
         /* o 256px si quieres escalar */
}


.zrco-process__head{ text-align:left; margin-bottom:28px; animation: zrco-fade-slide .6s ease both; }

/* ===== Mapa ===== */
.zrco-map{
  --map-h: clamp(480px, 56vw, 620px);
  position: relative;
  border-radius: 22px;
  overflow: hidden;
  isolation: isolate;
  background:
    radial-gradient(1200px 700px at 60% 20%, rgba(255,255,255,.06), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  box-shadow: inset 0 0 0 1px rgba(10,79,151,.08), 0 24px 60px rgba(10,79,151,.10);
}
.zrco-map__art{ position:absolute; inset:0; width:100%; height:var(--map-h); color:rgba(10,79,151,.9); pointer-events:none; z-index:1; }

/* Ruta animada */
/* Ruta animada (igual) */
.zrco-map__route{
  fill:none; stroke:rgba(255,255,255,.92); stroke-width:3.5; stroke-linecap:round; stroke-dasharray:10 16;
  filter: drop-shadow(0 2px 0 rgba(10,79,151,.14));
  animation: zrco-route-move 18s linear infinite;
}
@keyframes zrco-route-move { to { stroke-dashoffset: -640; } }

/* Tracker AHORA no usa offset-path (lo mueve el <animateMotion>) */
.zrco-map__tracker{
  filter: drop-shadow(0 2px 6px rgba(13,116,214,.35));
}

/* Si el usuario prefiere menos movimiento, pausamos */
@media (prefers-reduced-motion: reduce){
  .zrco-map__route { animation: none !important; }
  /* opcional: ocultar el tracker animado si querés */
  /* .zrco-map__tracker { display:none !important; } */
}

@keyframes zrco-tracker { to { offset-distance:100%; } }
@supports not (offset-path: path("M0,0 L1,1")){ .zrco-map__tracker{ display:none; } }

.zrco-treasure__glow{ animation: zrco-pulse 2.6s ease-in-out infinite; transform-origin:center; opacity:.7; }
@keyframes zrco-pulse{ 0%,100%{ transform:scale(.96); opacity:.55;} 50%{ transform:scale(1.08); opacity:.9;} }
.zrco-compass{ color: rgba(255,255,255,.7); }

/* ===== Tarjetas ===== */
.zrco-steps--map{ position:relative; z-index:2; height:var(--map-h); list-style:none; margin:18px 0 10px; padding:0; }

/* Safe-edges + fallback si faltan --x/--y */
.zrco-steps--map .zrco-step{
  position:absolute;
  left: clamp(6%, var(--x, 50%), 94%);
  top:  clamp(10%, var(--y, 50%), 90%);
  width: clamp(220px, 24vw, 300px);
  text-align:left;
  background: linear-gradient(180deg, rgba(255,255,255,.78), rgba(255,255,255,.60));
  border:1px solid rgba(10,79,151,.14);
  backdrop-filter: blur(8px) saturate(1.05);
  border-radius:16px;
  padding:16px 16px 14px;
  box-shadow:0 10px 22px rgba(10,79,151,.08);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  isolation:isolate;
}

/* Anclajes para que no se “salgan” en los bordes */
.zrco-steps--map .anchor-c{ transform: translate(-50%, -50%); }
.zrco-steps--map .anchor-l{ transform: translate(0%, -50%); }     /* apoya a la izquierda */
.zrco-steps--map .anchor-r{ transform: translate(-100%, -50%); }   /* apoya a la derecha */

.zrco-steps--map .zrco-step:hover{
  transform: translate(var(--hover-tx, -50%), calc(var(--hover-ty, -50%) - 3px));
  border-color: rgba(13,116,214,.28);
  box-shadow: 0 16px 34px rgba(10,79,151,.14);
}
/* hereda el translate correcto en hover según el anclaje */
.zrco-steps--map .anchor-l:hover{ --hover-tx: 0%; --hover-ty: -50%; }
.zrco-steps--map .anchor-c:hover{ --hover-tx: -50%; --hover-ty: -50%; }
.zrco-steps--map .anchor-r:hover{ --hover-tx: -100%; --hover-ty: -50%; }

.zrco-step__index{
  width:42px; height:42px; display:grid; place-items:center; border-radius:999px; font-weight:800; color:#fff;
  background: linear-gradient(135deg, var(--zrco-primary, #0D74D6), var(--zrco-primary-600, #0A4F97));
  box-shadow:0 10px 20px rgba(13,116,214,.22);
}
.zrco-step__title{ margin:12px 0 4px; font-size:1rem; color:#0A4F97; }
.zrco-step__desc{ margin:0; color:#305186; font-size:.95rem; }

/* Estás aquí */
.zrco-step.is-start .zrco-here{
  position:absolute; top:-14px; left:10px; background:#0D74D6; color:#fff; font-size:.72rem;
  padding:4px 8px; border-radius:999px; box-shadow:0 6px 14px rgba(13,116,214,.28);
}
.zrco-step.is-start .zrco-here::after{
  content:""; position:absolute; left:16px; bottom:-6px; border:6px solid transparent; border-top-color:#0D74D6;
}

/* Tesoro */
.zrco-step.is-treasure{ border-color:rgba(255,215,0,.55); box-shadow:0 16px 34px rgba(255,215,0,.18), inset 0 0 0 1px rgba(255,215,0,.25); }
.zrco-step.is-treasure .zrco-step__index{ background:linear-gradient(135deg, #E9C200, #C79A00); box-shadow:0 10px 22px rgba(231,184,0,.35); }
.zrco-x{
  position:absolute; right:-18px; top:-18px; width:34px; height:34px; display:grid; place-items:center;
  font-weight:900; font-size:1.1rem; color:#1d1a00; background:#FFD700; border-radius:10px; transform:rotate(-12deg);
  box-shadow:0 10px 20px rgba(231,184,0,.35);
}

/* Accesibilidad */
@media (prefers-reduced-motion: reduce){
  .zrco-map__route, .zrco-map__tracker, .zrco-treasure__glow { animation:none !important; }
}

/* Responsive */
@media (max-width:1024px){ .zrco-steps--map .zrco-step{ width: clamp(220px, 30vw, 300px); } }
@media (max-width:860px){
  .zrco-map__art{ height:320px; opacity:.18; }
  .zrco-steps--map{ display:grid; grid-template-columns:1fr; gap:14px; height:auto; padding:12px 6px 0; }
  .zrco-steps--map .zrco-step{ position:relative; left:auto; top:auto; transform:none; width:100%; }
  .zrco-step.is-start .zrco-here{ top:-10px; left:12px; }
  .zrco-x{ right:10px; top:-12px; }
}


/* Aside compromisos */ .zrco-commit{ margin-top: 26px; } .zrco-commit__card{ padding: 18px 18px 16px; } .zrco-commit__title{ margin: 0 0 10px; font-size: 1.06rem; color: var(--white-text); } .zrco-commit__list{ margin: 0; padding-left: 18px; color: var(--white-text); } .zrco-commit__list li{ margin: 6px 0; color: var(--white-text); }

/*Sección 5: Proyectos destacados / Obras*/

#obras{
  --br: 16px;
  --shadow-1: 0 16px 36px rgba(10,79,151,.08);
  --shadow-2: 0 18px 36px rgba(10,79,151,.12);
  --glass: rgba(255,255,255,.62);
  --glass-border: rgba(255,255,255,.35);
  --hud-bg: rgba(255,255,255,.55);
  --hud-bd: rgba(255,255,255,.45);
}
#obras .zrco-works__head{ text-align:left; margin-bottom:26px; animation: zrco-fade-slide .6s ease both; }

/* === Slider principal === */
#obras .zrco-works-featured{ margin: 12px 0 26px; }
#obras .zrco-slider{
  position: relative;
  border-radius: var(--br);
  overflow: hidden;
  border: 1px solid rgba(10,79,151,.10);
  box-shadow: var(--shadow-1);
  isolation:isolate;
  background: linear-gradient(180deg, #f9fbff 0%, #f4f8ff 100%);
}
#obras .zrco-deco--grid{
  position:absolute; inset:0;
  background-image:
    radial-gradient(90px 90px at 15% 25%, rgba(13,116,214,.08), transparent 60%),
    radial-gradient(110px 110px at 85% 75%, rgba(13,116,214,.06), transparent 60%),
    linear-gradient(transparent 0 0);
  pointer-events:none;
  z-index:1;
}

/* HUD */
#obras .zrco-slider__hud{
  position:absolute; right:12px; top:12px; z-index:4;
  display:flex; align-items:center; gap:10px;
  padding:8px 10px; border-radius:999px;
  background: var(--hud-bg); border:1px solid var(--hud-bd); backdrop-filter: blur(4px);
}
#obras .zrco-slider__fraction{ font-size:.78rem; color:#0A4F97; letter-spacing:.5px; }
#obras .zrco-slider__fraction b{ font-variant-numeric: tabular-nums; }
#obras .zrco-slider__progress{
  width:72px; height:4px; border-radius:999px; background: rgba(10,79,151,.18); overflow:hidden;
}
#obras .zrco-slider__progress i{
  display:block; width:0%; height:100%; background: linear-gradient(90deg, var(--zrco-primary, #0A4F97), #0a3f7a);
  transform-origin:left; border-radius:999px;
}

/* Track + slides */
#obras .zrco-slider__track{
  display:flex; width:105%; transition: transform .55s ease; will-change: transform; z-index:2;
}
#obras .zrco-slide{
  position: relative; min-width:100%;
  aspect-ratio: 16 / 7;               /* alto del slider */
  display:grid; place-items:end start; color:#0A2959; background:#f3f7ff;
}
#obras .zrco-slide img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transform: scale(1.045); filter: saturate(1.05) contrast(1.02);
  animation: zrco-kenburns 24s ease-in-out infinite alternate;
}
@keyframes zrco-kenburns { from{ transform: scale(1.04) translate3d(0,0,0);} to{ transform: scale(1.08) translate3d(0,-1.5%,0);} }

#obras .zrco-slide::after{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(80% 80% at 70% 20%, rgba(13,116,214,.16), transparent 60%),
    linear-gradient(180deg, rgba(4,18,38,0) 50%, rgba(4,18,38,.28) 100%);
  mix-blend-mode:multiply;
}

/* Chip categoría (reusa tu estilo) */
#obras .zrco-slide .zrco-chip{ left:16px; top:16px; z-index:3; }

/* Panel de texto (glass) */
#obras .zrco-slide__caption{
  position:relative; z-index:3;
  width:min(820px, 88%); margin: 0 18px 18px; padding:18px 20px;
  border-radius: 14px; background: var(--glass); border: 1px solid var(--glass-border);
  backdrop-filter: blur(8px); box-shadow: 0 10px 28px rgba(10,79,151,.12);
}
#obras .zrco-slide__title{ margin:0 0 4px; font-size: clamp(1.2rem, 2.1vw, 1.7rem); color:#0A4F97; letter-spacing:.2px; }
#obras .zrco-slide__desc{ margin:.25rem 0 0; font-size: .98rem; color:#2a3f66; }
#obras .zrco-slide__meta{ margin:.35rem 0 0; font-size:.9rem; color:#48679f; }

/* Controles */
#obras .zrco-slider__ctrl{
  position:absolute; top:50%; transform:translateY(-50%); z-index:4;
  width:44px; height:44px; display:grid; place-items:center; border-radius:999px;
  border:1px solid rgba(255,255,255,.55); background: var(--hud-bg);
  box-shadow: 0 10px 24px rgba(10,79,151,.20); cursor:pointer;
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}
#obras .zrco-slider__ctrl:hover{
  transform:translateY(-50%) scale(1.06);
  background: rgba(255,255,255,.75);
  box-shadow: 0 14px 28px rgba(10,79,151,.22);
}
#obras .zrco-slider__ctrl svg{ width:22px; height:22px; color:#0A4F97; }
#obras .zrco-slider__ctrl--prev{ left:12px; }
#obras .zrco-slider__ctrl--next{ right:12px; }

/* Dots */
#obras .zrco-slider__dots{
  position:absolute; left:50%; bottom:12px; transform:translateX(-50%); z-index:4;
  display:flex; gap:8px; padding:6px 10px; border-radius:999px;
  background: var(--hud-bg); border:1px solid var(--hud-bd); backdrop-filter: blur(4px);
}
#obras .zrco-slider__dots button{
  width:8px; height:8px; border-radius:999px; border:none; cursor:pointer;
  background: rgba(10,79,151,.35); transition: transform .18s ease, background .18s ease;
}
#obras .zrco-slider__dots button.is-active{ background: var(--zrco-primary, #0A4F97); transform: scale(1.24); }

/* Grid de obras (con overlay blueprint sutil y glow) */
#obras .zrco-works-grid{
  position:relative;
  display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:18px;
}
#obras .zrco-works-grid::before{
  content:""; position:absolute; inset:-2% -2% auto -2%; height:1px;
  background: linear-gradient(90deg, transparent, rgba(13,116,214,.35), transparent);
  pointer-events:none;
}
#obras .zrco-card--elev{
  background:#fff; border:1px solid rgba(10,79,151,.10); box-shadow:0 10px 24px rgba(10,79,151,.06);
  border-radius: var(--br); overflow:hidden;
}
#obras .zrco-work__media{ position:relative; display:block; border-radius:14px; overflow:hidden; isolation:isolate; }
#obras .zrco-work__media img{
  width:100%; height:100%; aspect-ratio:16/10; object-fit:cover; transform:scale(1.02);
  transition: transform .35s ease, filter .35s ease; display:block;
}
#obras .zrco-media-overlay{
  position:absolute; inset:0;
  background:
    radial-gradient(80% 80% at 70% 30%, rgba(13,116,214,.15), rgba(10,79,151,0) 60%),
    linear-gradient(180deg, rgba(0,0,0,0) 62%, rgba(0,0,0,.12) 100%);
  opacity:0; transition: opacity .3s ease;
}
#obras .zrco-chip{
  position:absolute; left:12px; top:12px; display:inline-block; padding:6px 10px;
  font-size:.78rem; font-weight:700; line-height:1; color:#fff;
  background:linear-gradient(135deg, var(--zrco-primary, #0A4F97), var(--zrco-primary-600, #0a3f7a));
  border-radius:999px; box-shadow:0 8px 18px rgba(13,116,214,.25); border:1px solid rgba(255,255,255,.24);
}

#obras .zrco-img-sale{
  height: 0;
  background-color: red;
}
#obras .zrco-work:hover .zrco-work__media img{ transform:scale(1.06); filter: contrast(1.04) saturate(1.04); }
#obras .zrco-work:hover .zrco-media-overlay{ opacity:.88; }

#obras .zrco-work__body{ padding:14px 14px 16px; position:relative; display:block; display: none;}
#obras .zrco-work__title{ margin:4px 0 4px; font-size:1.06rem; color:#0A4F97; letter-spacing:.2px; }
#obras p.zrco-work__desc{ margin:0; color:#2a3f66; font-size:.95rem; }
#obras p.zrco-work__meta{ margin:8px 0 0; color:#48679f; font-size:.9rem; }

/* CTA */
#obras .zrco-works__cta{ margin-top:24px; display:flex; gap:12px; }

/* Animación barra de progreso (se reinicia desde JS) */
@keyframes zrco-progress { from{ width:0%; } to{ width:100%; } }

/* Accesibilidad & motion */
@media (prefers-reduced-motion: reduce){
  #obras .zrco-slider__track{ transition:none; }
  #obras .zrco-slide img{ animation:none; transform:none; }
}

/* Responsivo */
@media (max-width: 1200px){
  #obras .zrco-slide__caption{ width:min(880px, 92%); }
}
@media (max-width: 1024px){
  #obras .zrco-works-grid{ grid-template-columns: 1fr 1fr; }
  #obras .zrco-slide{ aspect-ratio: 16 / 8.5; }
}
@media (max-width: 640px){
  #obras .zrco-works-grid{ grid-template-columns: 1fr; }
  #obras .zrco-works__cta{ flex-direction: column; }
  #obras .zrco-slide{ aspect-ratio: 16 / 10; }
  #obras .zrco-slider__ctrl{ display:none; } /* en mobile priorizamos swipe */
}

/* Ocultar/mostrar tarjetas */
.zrco-works-grid .zrco-work.is-hidden { display: none; }

/* Mini animación al revelar */
.zrco-works-grid .zrco-work.just-revealed {
  animation: zrcoFadeUp .35s ease both;
}
@keyframes zrcoFadeUp {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Utilidad para ocultar cualquier control */
[hidden] { display: none !important; }

/* Alineación de los botones */
.zrco-works__cta { display:flex; gap:10px; justify-content:center; }
.zrco-btn--ghost { background: transparent; border: 1px solid currentColor; }


/* ===== Modal ZRCO Works ===== */
:root{
  --zrco-modal-bg: rgba(10, 15, 20, 0.65);          /* base azulada profunda */
}

body.is-modal-open { overflow: hidden; }

.zrco-modal{
  position: fixed; inset: 0; z-index: 9999;
  display: grid; place-items: center;
  pointer-events: none; opacity: 0;
  transition: opacity .22s ease;
}
.zrco-modal.is-open{ pointer-events: auto; opacity: 1; }

.zrco-modal__overlay{
  position: absolute; inset: 0; background: var(--zrco-modal-bg);
  backdrop-filter: blur(3px);
}

.zrco-modal__dialog{
  position: relative;
  width: min(1100px, 92vw);
  max-height: min(88vh, 900px);
  background: var( --zrco-primary-600);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 20px;
  box-shadow: 0 20px 60px rgba(0,0,0,.35);
  color: var(--zrco-modal-text);
  display: grid;
  grid-template-columns: 56% 44%;
  overflow: hidden;
  transform: translateY(8px) scale(.98);
  opacity: .96;
  transition: transform .26s ease, opacity .26s ease;
}
.zrco-modal.is-open .zrco-modal__dialog{
  transform: none; opacity: 1;
}

@media (max-width: 920px){
  .zrco-modal__dialog{ grid-template-columns: 1fr; max-height: 92vh; }
}

/* Media/Galería */
.zrco-modal__media{
  position: relative;
  background: #060b12;
  display: grid; place-items: center;
}
.zrco-modal__img{
  max-width: 100%;
  max-height: 80vh;
  width: auto; height: auto;
  object-fit: contain;
  transition: opacity .2s ease;
}

.zrco-modal__nav{
  position: absolute; top: 50%; transform: translateY(-50%);
  border: none; width: 42px; height: 42px; border-radius: 999px;
  display: grid; place-items: center;
  background: rgba(0,0,0,.45);
  color: #fff; font-size: 22px; cursor: pointer;
  backdrop-filter: blur(2px);
}
.zrco-modal__nav:hover{ background: rgba(0,0,0,.65); }
.zrco-modal__nav[disabled]{ opacity: .35; pointer-events: none; }
.zrco-modal__nav--prev{ left: 12px; }
.zrco-modal__nav--next{ right: 12px; }

.zrco-modal__dots{
  position: absolute; bottom: 10px; left: 0; right: 0;
  display: flex; gap: 8px; justify-content: center; align-items: center;
}
.zrco-modal__dot{
  width: 8px; height: 8px; border-radius: 999px;
  background: rgba(255,255,255,.35);
  border: none; cursor: pointer;
}
.zrco-modal__dot[aria-selected="true"]{ background: var(--zrco-accent); transform: scale(1.15); }

/* Contenido */
.zrco-modal__body{
  padding: 22px 24px 24px;
  overflow: auto;
}
.zrco-modal__chip{ 
  display: inline-block; font-size: 12px; letter-spacing:.4px;
  padding: 6px 10px; border-radius: 999px;
  background: rgba(255,255,255,.08); color: var(--zrco-modal-text);
  border: 1px solid rgba(255,255,255,.12);
  margin-bottom: 10px;
}
.zrco-modal__title{ font-size: 22px; line-height: 1.25; margin: 6px 0 10px; }
.zrco-modal__desc{ color: var(--zrco-modal-muted); margin-bottom: 12px; }
.zrco-modal__metas p{ color: #c7d4e6; margin: 6px 0; font-size: 14px; }

/* Cerrar */
.zrco-modal__close{
  position: absolute; top: 10px; right: 10px;
  width: 38px; height: 38px; border-radius: 999px;
  border: 1px solid rgba(255,255,255,.15);
  background: rgba(10, 15, 20, .55); color: #fff;
  display: grid; place-items:center; cursor:pointer;
}
.zrco-modal__close:hover{ background: rgba(10, 15, 20, .75); }



/* ===== Sección 6: Diferenciales ===== */
.zrco-advantages{
  padding: clamp(48px, 7vw, 96px) 0;
  color: #fff;
  text-align: center;
  isolation: isolate;
}

.zrco-adv__logo{
  height: clamp(180px, 6vw, 72px);
  width: auto;
  object-fit: contain;
  filter: drop-shadow(0 6px 22px rgba(0,0,0,.25));
}
.zrco-adv__title{
  margin: 0;
  font-weight: 800;
  letter-spacing: .4px;
  text-transform: uppercase;
  line-height: 1.15;
  text-wrap: balance;
  font-size: clamp(1.25rem, 2.8vw, 2.4rem);
}

/* Opción con línea decorativa sutil (quitar si no la querés) */
.zrco-adv__title::after{
  content:"";
  display:block;
  height: 2px;
  width: clamp(120px, 18vw, 220px);
  margin: clamp(10px, 1.5vw, 14px) 0px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.85), transparent);
  border-radius: 2px;
}

/* Opcional: números más prolijos y un leve énfasis */
/* Número limpio + salto final */
.zrco-counter{
  display:inline-block;
  font-variant-numeric: tabular-nums; /* dígitos de ancho fijo */
  font-weight: 800;
  letter-spacing: .5px;
  text-align: right;         /* el valor crece hacia la izquierda */
  white-space: pre;          /* evita colapsar espacios si se usan */
  vertical-align: baseline;
}

.zrco-counter.is-done{
  animation: counter-pop 420ms ease-out both;
}
@keyframes counter-pop{
  0%{ transform: scale(1) }
  60%{ transform: scale(1.03) }
  100%{ transform: scale(1) }
}

@media (prefers-reduced-motion: reduce){
  .zrco-counter{ animation: none !important; }
}




/* Dark mode coherente (si tu sitio lo usa) */
@media (prefers-color-scheme: dark){
  .zrco-advantages{ color:#eef4ff; }
}

/* ===========================
   DIFERENCIALES / CONTADOR RESPONSIVE
   (añadí esto debajo de tu CSS actual)
   =========================== */

/* Desktop medio (≤ 1200px) */
@media (max-width: 1200px) {
  #diferenciales .zrco-hero__inner {
    margin-left: auto;
    margin-right: auto;
  }

  .zrco-adv__title {
    font-size: clamp(1.3rem, 2.4vw, 2.1rem);
  }
}

/* Laptop / Tablet horizontal (≤ 992px) */
@media (max-width: 992px) {
  #diferenciales .zrco-hero__inner {
    margin-inline: auto;
    text-align: center;
    padding: 40px 0 56px;
    background: none;                /* evita líneas/decoración del hero si hereda */
  }

  .zrco-adv__logo {
    height: clamp(140px, 8vw, 120px);
  }

  .zrco-adv__title {
    font-size: clamp(1.25rem, 3vw, 1.9rem);
  }
}

/* Tablet vertical (≤ 768px) */
@media (max-width: 768px) {
  #diferenciales {
    padding: 32px 0 40px;
  }

  #diferenciales .zrco-hero__inner {
    padding: 0;
  }

  .zrco-adv__logo {
    height: clamp(120px, 10vw, 110px);
  }

  .zrco-adv__title {
    font-size: clamp(1.2rem, 4vw, 1.8rem);
    text-wrap: balance;
  }

  .zrco-adv__title br {
    display: none;  /* evita saltos forzados raros en pantallas chicas */
  }
}

/* Mobile (≤ 480px) */
@media (max-width: 480px) {
  #diferenciales {
    padding: 28px 0 34px;
  }

  .zrco-adv__logo {
    height: 100px;
    filter: drop-shadow(0 4px 16px rgba(0,0,0,.25));
  }

  .zrco-adv__title {
    font-size: clamp(1.1rem, 4.8vw, 1.6rem);
  }

  .zrco-adv__title::after {
    width: clamp(100px, 40vw, 160px);
    margin-top: 10px;
  }

  .zrco-counter {
    font-size: 1.1em;
  }
}



/* ===== Sección 7: Testimonios ===== */
/* ===== Sección 7: Testimonios ===== */

#testimonios .zrco-testimonials__head{
  text-align: left;
  margin-bottom: 26px;
  animation: zrco-fade-slide .6s ease both;
}

/* === Carrusel 3-up con foco central === */
#testimonios .zrco-carousel{ --gap: 18px; --per-view: 3; }
#testimonios .zrco-carousel__viewport{ overflow: hidden; }
#testimonios .zrco-carousel__track{
  display: flex;
  gap: var(--gap);
  will-change: transform;
  padding: 80px 0px 30px 0px;
}

#testimonios .zrco-slide{
  flex: 0 0 calc((100% - (var(--gap) * (var(--per-view) - 1))) / var(--per-view));
  transition: transform .35s ease, opacity .35s ease, filter .35s ease;
  transform-origin: center;
  opacity: .55;
  filter: saturate(.9);
  transform: scale(0.96);
}
#testimonios .zrco-slide.is-center{
  opacity: 1;
  filter: none;
  transform: scale(1.04);
  z-index: 2;
}
#testimonios .zrco-slide.is-side{
  opacity: .78;
  transform: scale(.96);
}

/* Tarjeta estilo review */
#testimonios .zrco-card--elev{
  background: #fff;
  border: 1px solid rgba(10,79,151,.08);
  border-radius: 18px;
  box-shadow: 0 10px 24px rgba(10,79,151,.08);
}
#testimonios .zrco-testi{
  text-align: center;
  padding: 52px 20px 18px;
  color: #24344f;
  border: 1px solid var(--zrco-primary-600);
  height: 400px;
  cursor: pointer;
  transition: transform .35s ease;
}

#testimonios .zrco-testi:hover{
  transform: scale(1.03);
  
}

#testimonios .zrco-testi__avatar{
  width: 100px; height: 100px;
  border-radius: 50%;
  object-fit: cover;
  display: block;
  
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  
  box-shadow: 0 8px 26px rgba(10,79,151,.12);
  border: 2px solid var(--zrco-primary-600);
}
#testimonios .zrco-testi__name{ margin: 0; font-size: 1.06rem; font-weight: 800; color: #2b4774; }
#testimonios .zrco-testi__date{ display:block; margin-top:2px; font-size:.88rem; color:#8aa0bf; }
#testimonios .zrco-testi__rating{ margin:12px 0 10px; color:#f5b400; font-size:1.16rem; letter-spacing:.12em; }
#testimonios .zrco-testi .zrco-testi__quote{ margin:6px 0 12px; color:#2a3f66; font-size:.98rem; line-height:1.55; }
#testimonios .zrco-testi__badge{ display:flex; justify-content:center; align-items:center; margin-top:6px; }
#testimonios .zrco-google{ display:inline-block; }

/* CTA inferior */
#testimonios .zrco-testimonials__cta{ margin-top:28px; display:flex; gap:12px; }

/* Responsive */
@media (max-width: 1024px){
  #testimonios .zrco-carousel{ --per-view: 2; }
}
@media (max-width: 640px){
  #testimonios .zrco-testimonials{ padding: 60px 0 70px; }
  #testimonios .zrco-carousel{ --per-view: 1; }
  #testimonios .zrco-testimonials__cta{ flex-direction: column; }
}

/* Accesibilidad */
@media (prefers-reduced-motion: reduce){
  #testimonios .zrco-carousel__track{ transition: none !important; }
  #testimonios .zrco-slide{ transition: none !important; }
}



/* ===== Sección 8: Licitaciones & Proveedores ===== */

#licitaciones .zrco-bids__head{
  text-align: left;
  margin-bottom: 22px;
  animation: zrco-fade-slide .6s ease both;
}

/* layout */
#licitaciones .zrco-bids__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
}
.zrco-subhead{
#licitaciones   margin: 0 0 10px;
  font-size: .98rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #ffffff;
}

/* Licitaciones (cards limpias) */
#licitaciones .zrco-bidlist{
  list-style: none;
  padding: 0; margin: 0;
  display: grid; gap: 14px;
}
#licitaciones .zrco-bid{
  padding: 16px 14px;
  border-radius: 14px;
  border: 1px solid var(--zrco-border);
  background: linear-gradient(180deg, rgba(255,255,255,0.70), rgba(255,255,255,0.55));
  backdrop-filter: blur(8px) saturate(1.05);
  box-shadow: 0 10px 22px rgba(10,79,151,.06);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
#licitaciones .zrco-bid:hover{
  transform: translateY(-3px);
  border-color: rgba(13,116,214,.22);
  box-shadow: 0 16px 34px rgba(10,79,151,.12);
}
#licitaciones .zrco-bid__top{
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 6px;
  font-weight: bold;
  color: var(--zrco-primary-600);
}
#licitaciones .zrco-bid__year{
  padding: 4px 8px;
  border-radius: 999px;
  font-size: .78rem;
  color: #ffffff;
  background: rgba(13,116,214,.10);
  border: 1px solid rgba(13,116,214,.22);
}
#licitaciones .zrco-bid__title{
  margin: 2px 0 4px;
  font-size: 1.02rem;
  color: #0A4F97;
  letter-spacing: .2px;
}
#licitaciones .zrco-bid__meta{
  margin: 0;
  color: #48679f;
  font-size: .92rem;
}

/* Proveedores (chips) */
#licitaciones .zrco-tags{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

#licitaciones .zrco-tag{
  display: inline-block;
  padding: 8px 10px;
  font-size: .9rem;
  border-radius: 999px;
  color: #ffffff;
  background: rgba(13,116,214,.10);
  border: 1px solid rgba(13,116,214,.22);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
#licitaciones .zrco-tag:hover{
  transform: translateY(-2px);
  border-color: rgba(13,116,214,.32);
  box-shadow: 0 8px 18px rgba(10,79,151,.10);
}

/* CTA proveedor */
#licitaciones .zrco-bids__cta{
  margin-top: 16px;
  display: flex;
  gap: 10px;
}

/* Responsive */
@media (max-width: 920px){
  #licitaciones .zrco-bids__grid{ grid-template-columns: 1fr; }
  #licitaciones .zrco-bids{ padding: 60px 0 70px; }
  #licitaciones .zrco-bids__cta{ flex-direction: column; }
}



/* ===== Equipo (ZRCO) ===== */
/* ===== Equipo (Directores) ===== */

.zrco-team__head{
  text-align: left;
  margin-bottom: 28px;
  animation: zrco-fade-slide .6s ease both;
}

/* Layout 2 columnas (texto + tarjetas) */
.zrco-team__layout{
  --gap: 28px;
  display: grid;
  grid-template-columns: minmax(300px, .9fr) 1.1fr;
  gap: var(--gap);
  align-items: start;
}

/* Lado texto */
.team-overview{
  color: var(--zrco-primary-600, #0A4F97);
}
.team-overview__title{
  text-transform: uppercase;
  letter-spacing: .02em;
  font-weight: 800;
  font-size: 21px;
  margin: 6px 0 8px;
}
.team-overview__text{ opacity:.9; }

.team-overview__bullets{
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
}
.team-overview__bullets li{
  display: flex;
  gap: 10px;
  align-items: start;
  line-height: 1.35;
  font-size: 15px;
  color: var(--zrco-primary-700, #0A3F7E);
}
.team-overview__bullets i{
  margin-top: 2px;
  opacity:.85;
}

/* ===== Tarjetas de directores ===== */
.team-directors{
  display: grid;
  grid-template-columns: repeat(1, minmax(240px, 1fr));
  gap: 22px;
}

.director-card{
  --card-bg: #fff;
  --card-bd: rgba(10,79,151,.10);
  --shadow: 0 10px 28px rgba(16,24,40,.12);
  background: var(--card-bg);
  border: 1px solid var(--card-bd);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: var(--shadow);
  display: grid;
  grid-template-rows: auto 1fr;
  isolation: isolate;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.director-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 36px rgba(16,24,40,.16);
  border-color: rgba(10,79,151,.18);
}


/* Quitar márgenes del figure y evitar micro-gaps */
.director-card__media{
  position: relative;
  display:block;
  aspect-ratio: 5/3;
  margin:0;            /* <figure> reseteado */
  line-height:0;       /* elimina espacio fantasma alrededor de la img */
  border-top-left-radius: 18px;
  border-top-right-radius: 18px;
  overflow:hidden;     /* recorta la imagen con el mismo radio */
}

/* Asegurar que la imagen ocupe todo el ancho sin espacios */
.director-card__media img{
  display:block;       /* evita el gap inline */
  width:100%;
  height:100%;
  object-fit:cover;
  transform:none;      /* opcional: quita el 1.02 si no querés zoom */
}

/* Badge sobre la foto */
.director-card__media .badge{
  position: absolute;
  left: 14px;
  bottom: 14px;
  padding: 15px 10px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .02em;
  color: #fff;
  border-radius: 999px;
  background:
    linear-gradient(180deg, rgba(10,95,175,.88), rgba(10,79,151,.88));
  box-shadow: 0 6px 18px rgba(10,79,151,.25);
  z-index: 1;
}
.director-card__media .badge2{
  position: absolute;
  right: 14px;
  bottom: 14px;
  padding: 15px 10px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .02em;
  color: #fff;
  border-radius: 999px;
  background:
    linear-gradient(180deg, rgba(10,95,175,.88), rgba(10,79,151,.88));
  box-shadow: 0 6px 18px rgba(10,79,151,.25);
  z-index: 1;
}

/* Cuerpo */
.director-card__body{
  padding: 16px 16px 18px;
}
.director-card__name{
  font-size: 20px;
  line-height: 1.2;
  margin: 4px 0 2px 0;
  color: var(--zrco-second-900, #111);
  font-weight: 800;
  letter-spacing: .005em;
}
.director-card__role{
  margin: 0 0 10px 0;
  font-size: 14px;
  color: var(--zrco-primary-700, #0A3F7E);
  opacity: .95;
}

/* Highlights */
.director-card__highlights{
  margin: 10px 0 12px;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 6px;
  color: #334155;
  font-size: 14px;
}
.director-card__highlights li{
  display: grid;
  grid-template-columns: 14px 1fr;
  gap: 8px;
  position: relative;
}
.director-card__highlights li::before{
  content: "";
  width: 6px; height: 6px;
  border-radius: 2px;
  margin-top: 6px;
  background: var(--basePrincipalColor, #ff5858);
  box-shadow: 0 0 0 3px rgba(255,88,88,.15);
}

/* Meta */
.director-card__meta{
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  margin-top: 4px;
}
.director-card__meta .meta{
  font-size: 12px;
  color: #475569;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border: 1px dashed rgba(10,79,151,.25);
  border-radius: 999px;
}

/* CTA */
.director-card__cta{
  margin-top: 14px;
}
.btn-line{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .02em;
  color: var(--zrco-primary-700, #0A3F7E);
  border: 1.5px solid currentColor;
  border-radius: 12px;
  text-decoration: none;
  transition: background-color .22s ease, color .22s ease;
}
.btn-line:hover{
  color: #fff;
  background: var(--zrco-primary-700, #0A3F7E);
}

/* Cita */
.zrco-team-quote{
  margin-top: 34px;
  font-style: italic;
  color: var(--zrco-primary-600, #0A4F97);
  opacity: .9;
  text-align: left;
  padding: 0;
}

/* ===== Responsive ===== */
@media (max-width: 1100px){
  .zrco-team__layout{
    grid-template-columns: 1fr;
  }
  .team-overview{ order: 2; }
  .team-directors{ order: 1; }
}

@media (max-width: 820px){
  .team-directors{
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce){
  .director-card,
  .btn-line{ transition: none; }
}




/* ===== Sección 10: FAQ ===== */

.zrco-faq__head{
  text-align: left;
  margin-bottom: 22px;
  animation: zrco-fade-slide .6s ease both;
}

/* Grid de acordeones */
.zrco-faq-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 14px;
}

/* Acordeón (details/summary estilizado) */
.zrco-qa{
  border-radius: 14px;
  border: 1px solid var(--zrco-border);
  background: linear-gradient(180deg, rgba(255,255,255,0.70), rgba(255,255,255,0.55));
  backdrop-filter: blur(8px) saturate(1.05);
  transition: border-color .25s ease, box-shadow .25s ease, background-color .25s ease, transform .25s ease;
  box-shadow: 0 10px 22px rgba(10,79,151,.06);
  overflow: hidden;
}
.zrco-qa[open]{
  transform: translateY(-2px);
  border-color: rgba(13,116,214,.22);
  box-shadow: 0 16px 34px rgba(10,79,151,.12);
}

/* Summary */
.zrco-qa__summary{
  list-style: none; /* oculta triángulo por defecto */
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  padding: 14px 14px;
}
.zrco-qa__summary::-webkit-details-marker{ display: none; }

.zrco-qa__summary h3{
  margin: 0;
  font-size: 1.02rem;
  color: #0A4F97;
  letter-spacing: .2px;
}

/* Icono +/− */
.zrco-qa__icon{
  width: 28px; height: 28px;
  border-radius: 8px;
  border: 1px solid rgba(13,116,214,.22);
  background: rgba(13,116,214,.10);
  position: relative;
  transition: transform .25s ease, background-color .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.zrco-qa__icon::before,
.zrco-qa__icon::after{
  content:"";
  position:absolute; left: 50%; top: 50%;
  width: 14px; height: 2px; border-radius: 2px;
  background: #0A4F97;
  transform: translate(-50%,-50%);
}
.zrco-qa__icon::after{
  transform: translate(-50%,-50%) rotate(90deg);
}
.zrco-qa[open] .zrco-qa__icon{
  background: linear-gradient(135deg, var(--zrco-primary), var(--zrco-primary-600));
  border-color: rgba(255,255,255,.35);
  box-shadow: 0 8px 18px rgba(13,116,214,.22);
}
.zrco-qa[open] .zrco-qa__icon::after{
  opacity: 0; /* de + a − */
}

/* Contenido */
.zrco-qa__content{
  padding: 0 14px 14px;
  color: #2a3f66;
  font-size: .98rem;
  line-height: 1.55;
  border-top: 1px solid rgba(10,79,151,.10);
  animation: zrco-fade-slide .35s ease both;
}

/* CTA inferior */
.zrco-faq-cta{
  margin-top: 22px;
  display: flex;
  gap: 12px;
  align-items: center;
}

/* Responsive */
@media (max-width: 900px){
  .zrco-faq-grid{ grid-template-columns: 1fr; }
}



/* ===== Contacto / CTA (look profesional) ===== */

/* Títulos de sección */
#contacto .zrco-contact .zrco-contact__top {
  margin-bottom: 28px;
}

/* Layout */
#contacto .zrco-contact__wrap{
  display: grid;
  grid-template-columns: 1fr 1.25fr;
  gap: 22px;
  align-items: start;
}

/* Tarjetas */
#contacto .zrco-card{
  background: linear-gradient(180deg,#ffffff,#ffffff);
  border: 1px solid rgba(15, 23, 42, .08);
  border-radius: 16px;
  box-shadow: 0 10px 24px rgba(16,24,40,.06);
}

#contacto .zrco-contact__info{ padding: 20px 20px; }
#contacto .zrco-contact__form{ padding: 20px 20px; }

/* Lista de datos */
#contacto .zrco-contact__list{
  list-style: none; 
  margin: 0; 
  padding: 0; 
  display: grid; 
  gap: 8px;
}
#contacto .zrco-contact__list li{
  display: grid;
  grid-template-columns: 44px 1fr;
  align-items: center;
  column-gap: 12px;
  padding: 10px 8px;
  border-radius: 12px;
}
#contacto .zrco-contact__list li:hover{
  background: rgba(2,6,23,.03);
}

#contacto .zrco-contact__list span{
  color: var(--zrco-primary, #0A4F97);
  text-decoration: none;
  font-weight: 600;
}
#contacto .zrco-contact__list a:hover{ text-decoration: underline; }

/* Icono limpio (sin emojis) */
#contacto .zrco-contact__icon{
  display: grid; place-items: center;
  width: 44px; height: 44px; border-radius: 12px;
  background: linear-gradient(180deg,#f7f9fc,#eff4f9);
  border: 1px solid #e5edf5;
  color: var(--zrco-primary, #0A4F97);
}
#contacto .zrco-ico{ width: 20px; height: 20px; display: block; }

/* Formulario */
#contacto .zrco-form__grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 14px;
}
#contacto .zrco-field--full{ grid-column: 1 / -1; }

#contacto .zrco-field label{
  display: block;
  font-size: .92rem;
  color: #0A4F97;
  font-weight: 700;
  margin-bottom: 6px;
}
#contacto .zrco-field input,
#contacto .zrco-field select,
#contacto .zrco-field textarea{
  width: 100%;
  padding: 12px 12px;
  border-radius: 12px;
  border: 1px solid #d6dee9;
  background: #ffffff;
  color: #1c2a44;
  outline: none;
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
  font-size: .98rem;
}
#contacto .zrco-field textarea{ resize: vertical; min-height: 140px; }

#contacto .zrco-field input::placeholder,
#contacto .zrco-field textarea::placeholder{ color: #8a9bb3; }

/* Foco accesible */
#contacto .zrco-field input:focus,
#contacto .zrco-field select:focus,
#contacto .zrco-field textarea:focus{
  border-color: var(--zrco-primary, #0A4F97);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--zrco-primary, #0A4F97) 18%, transparent);
  background: #fff;
}

/* Estados HTML5 (sutiles) */
#contacto .zrco-field input:required:invalid,
#contacto .zrco-field textarea:required:invalid{
  border-color: rgba(255, 99, 71, .55);
}
#contacto .zrco-field input:required:valid,
.zrco-field textarea:required:valid{
  border-color: rgba(24, 160, 88, .55);
}

/* Consentimiento */
#contacto .zrco-check{
  display: flex; align-items: center; gap: 10px;
  color: #2a3f66; font-size: .95rem;
}
#contacto .zrco-check input{
  width: 18px; height: 18px; accent-color: var(--zrco-primary, #0A4F97);
}

/* Honeypot */
#contacto .zrco-hp{
  position: absolute !important; left: -5000px !important; top: 0; height: 0; width: 0; opacity: 0;
}

/* Botones (estilo sobrio) */
#contacto .zrco-actions{ display: flex; gap: 10px; align-items: center; }

#contacto .zrco-btn{
  --btn-h: 46px;
  display: inline-flex; align-items: center; justify-content: center;
  height: var(--btn-h); padding: 0 18px; border-radius: 12px;
  font-weight: 700; font-size: .98rem; line-height: 1; text-decoration: none;
  transition: transform .08s ease, box-shadow .18s ease, background-color .18s ease, border-color .18s ease;
  border: 1px solid transparent; cursor: pointer;
}
#contacto .zrco-btn:active{ transform: translateY(1px); }

#contacto .zrco-btn--primary{
  background: var(--zrco-primary, #0A4F97);
  color: #fff; border-color: var(--zrco-primary, #0A4F97);
  box-shadow: 0 8px 18px rgba(10,79,151,.18);
}
#contacto .zrco-btn--primary:hover{ filter: brightness(1.04); }

#contacto .zrco-btn--secondary{
  background: #fff; color: var(--zrco-primary, #0A4F97);
  border-color: rgba(10,79,151,.28);
}
#contacto .zrco-btn--secondary:hover{
  border-color: var(--zrco-primary, #0A4F97);
  box-shadow: 0 6px 14px rgba(10,79,151,.10);
}

/* Responsivo */
@media (max-width: 1040px){
  #contacto .zrco-contact__wrap{ grid-template-columns: 1fr; }
}
@media (max-width: 640px){
  #contacto .zrco-form__grid{ grid-template-columns: 1fr; }
  #contacto .zrco-actions{ flex-direction: column; align-items: stretch; }
  #contacto .zrco-contact__list li{ grid-template-columns: 40px 1fr; }
  #contacto .zrco-contact__icon{ width: 40px; height: 40px; }
}



/* ===== Sección 12: Footer ===== */
.zrco-footer{
  position: relative;
  padding: 52px 0 24px;
  color: #ffffff;
  background:
    radial-gradient(1000px 600px at 110% 10%, rgba(255,255,255,0.10), transparent 60%),
    linear-gradient(180deg, #0D74D6 0%, #0A4F97 70%);
  border-top: 1px solid rgba(255,255,255,.12);
}

.zrco-footer__grid{
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 18px;
  align-items: start;
}

.zrco-logo--footer{
  color: #fff;
}
.zrco-logo--footer small{
  color: #D7E6FF;
}
.zrco-footer__tag{
  margin: 8px 0 0;
  color: #EAF2FF;
  opacity: .9;
  font-size: .95rem;
}

.zrco-footer__nav ul,
.zrco-footer__contact ul{
  list-style: none;
  margin: 0; padding: 0;
  display: grid; gap: 8px;
}

.zrco-footer a{
  color: #ffffff;
  text-decoration: none;
  border-bottom: 1px dashed transparent;
  transition: color .2s ease, border-color .2s ease, opacity .2s ease;
}
.zrco-footer a:hover{
  color: #EAF2FF;
  border-bottom-color: rgba(255,255,255,.35);
}

.zrco-footer__divider{
  margin: 18px 0 14px;
  border: 0;
  height: 1px;
  background: linear-gradient(90deg, rgba(255,255,255,.0), rgba(255,255,255,.35), rgba(255,255,255,.0));
}

.zrco-footer__bottom{
  display: flex;
  gap: 12px;
  justify-content: space-between;
  align-items: center;
  color: #EAF2FF;
  font-size: .92rem;
  flex-wrap: wrap;
}
.zrco-footer__copy{ margin: 0; opacity: .95; }
.zrco-footer__credit{ margin: 0; opacity: .95; }

/* Responsive */
@media (max-width: 900px){
  .zrco-footer__grid{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px){
  .zrco-footer__grid{ grid-template-columns: 1fr; }
  .zrco-footer{ padding: 44px 0 22px; }
  .zrco-footer__bottom{ flex-direction: column; align-items: flex-start; gap: 6px; }
}

@import url('https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Pattaya&display=swap');