@charset "utf-8";
/* Base */
:root{
  --radius: 10px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
#form{scroll-margin-top:110px}
body{
  margin:0;
  font-family:var(--font-sans);
  color:var(--text);
  background:var(--cnv-white);
  line-height:1.55;
}
img{max-width:100%; height:auto; display:block}
a{color:inherit; text-decoration:none}
.container{max-width:var(--container); margin:0 auto; padding:0 var(--s-5)}

/* Buttons */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:12px 16px;
  border-radius:999px;
  border:1px solid transparent;
  font-weight:700;
  cursor:pointer;
  transition:transform .12s ease, background .12s ease, border-color .12s ease, opacity .12s ease;
  text-decoration:none;
}
.btn:active{transform:translateY(1px)}
.btn-primary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:12px 16px;
  border-radius:999px;
  border:1px solid transparent;
  font-weight:700;
  cursor:pointer;
  transition:transform .12s ease, background .12s ease, border-color .12s ease, opacity .12s ease;
  text-decoration:none;
}
.btn-primary:active{transform:translateY(1px)}
.btn--primary,
.btn-primary{background:var(--cnv-blue); color:var(--cnv-white)}
.btn--primary:hover,
.btn-primary:hover{background:var(--cnv-blue-ink); border-color:var(--cnv-blue-ink)}
.btn--secondary{background:var(--cnv-white); color:var(--cnv-blue); border-color:rgba(14,58,93,.35)}
.btn--ghost{background:transparent; color:var(--cnv-white); border-color:rgba(255,255,255,.35)}
.btn--link{padding:0; border:none; background:none; color:var(--cnv-blue)}
.btn[disabled]{opacity:.6; cursor:not-allowed}

/* Sections */
.section{padding:clamp(40px,5vw,54px) 0}
.section--light{background:var(--cnv-white)}
.section--muted{background:var(--cnv-muted)}
.section--dark{background:var(--cnv-blue); color:var(--cnv-white)}
.section__header{margin-bottom:var(--s-5)}
.section__header h2{margin:0 0 var(--s-2) 0; font-size:var(--fs-xl)}
.section__header p{margin:0; color:var(--text-muted)}
.section--dark .section__header p{color:rgba(255,255,255,.85)}
.section__actions{margin-top:var(--s-5)}

/* Cards + grids */
.cards{display:grid; gap:var(--s-4)}
.cards--3{grid-template-columns:repeat(3,1fr)}
.cards--4{grid-template-columns:repeat(4,1fr)}
.card{
  background:var(--cnv-white);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:var(--s-5);
  box-shadow:var(--shadow-soft);
}
.card h3{margin:0 0 var(--s-2) 0; font-size:18px}
.card p{margin:0; color:var(--text-muted)}
.section--dark .card{background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.18)}

.cta-blog{
  margin:var(--s-6) 0 0;
  padding:var(--s-5);
  border-radius:var(--radius);
  background:var(--cnv-muted);
  border:1px solid var(--border);
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}

.cta-blog .btn-primary{
  padding:11px 14px;
}
.footer__newsletter p{
  margin:0 0 10px;
  color:var(--text-muted);
}
.footer__newsletter h4,
.footer__newsletter .footer__heading{
  color:var(--cnv-charcoal);
}
.footer__newsletter a{
  color:var(--cnv-blue);
  font-weight:700;
}
.form-extra-fields{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
@media (max-width:720px){
  .form-extra-fields{grid-template-columns:1fr}
}

/* Gallery */
.gallery{display:grid; gap:var(--s-5)}
.gallery--grid{grid-template-columns:repeat(3, 1fr)}
.gallery__item{
  border-radius:var(--radius);
  overflow:hidden;
  border:1px solid var(--border);
  background:var(--cnv-white);
}
.gallery__item img{
  display:block;
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
  object-position:center;
}
.gallery__item figcaption{padding:var(--s-3); color:var(--text-muted); font-size:var(--fs-sm)}

/* Lists */
.bullets{margin:0; padding-left:18px}
.bullets li{margin:8px 0}
.steps{margin:0; padding-left:18px}
.steps li{margin:10px 0}
.checklist{list-style:none; padding:0; margin:0}
.checklist li{padding-left:26px; margin:10px 0; position:relative}
.checklist li::before{
  content:"\2713";
  position:absolute; left:0; top:0;
  color:var(--cnv-blue);
  font-weight:900;
}
.section--dark .checklist li::before{color:var(--cnv-white)}

/* Header (Home) */
.site-header{
  position:fixed;
  top:0; left:0; right:0;
  z-index:1000;
  transition:background .15s ease, box-shadow .15s ease;
}
.header__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--s-4);
  padding:14px 0;
}
.brand__logo{height:38px; width:auto}

.header--transparent{background:transparent}
.header--solid{background:var(--cnv-white); box-shadow:0 8px 22px rgba(0,0,0,.08)}

/* FIX: alinear todos los items del nav en la misma linea */
.nav__list{
  display:flex;
  gap:18px;
  list-style:none;
  padding:0;
  margin:0;
  align-items:center; /* <-- FIX CLAVE */
}

/* FIX: unificar <a> y <button> (baseline / line-height) */
.nav__link{
  background:none;
  border:none;
  font:inherit;
  cursor:pointer;
  padding:8px 10px;
  border-radius:var(--radius);

  display:inline-flex;     /* <-- FIX */
  align-items:center;      /* <-- FIX */
  justify-content:center;
  line-height:1;           /* <-- FIX */
  vertical-align:middle;   /* <-- FIX */
  white-space:nowrap;      /* evita saltos raros */
}

.header--transparent .nav__link{color:var(--cnv-white)}
.header--solid .nav__link{color:var(--cnv-charcoal)}

.nav__dropdown{
  position:absolute;
  margin-top:10px;
  background:var(--cnv-white);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:10px;
  display:none;
  min-width:220px;
  box-shadow:var(--shadow);
}
.nav__dropdown a{display:block; padding:10px; border-radius:var(--radius); color:var(--cnv-charcoal)}
.nav__dropdown-hub{font-weight:inherit; border-bottom:0; margin-bottom:0; padding-bottom:10px}
.nav__dropdown a:hover{background:var(--cnv-muted)}
.nav__dropdown.is-open{display:block}
.nav__item--dropdown{position:relative}

.header__ctas .btn--primary,
.landing-header__actions .btn--primary{white-space:nowrap}

/* Mobile */
.nav-toggle{display:none; background:none; border:none; font-size:20px; cursor:pointer}
.mobile-nav{
  background:var(--cnv-white);
  border-top:1px solid var(--border);
  padding:14px var(--s-5);
}
.mobile-nav a{display:block; padding:10px 0; color:var(--cnv-charcoal)}
.no-scroll{overflow:hidden}

/* Modal */
.modal{border:none; border-radius:var(--radius-lg); padding:0; width:min(760px, 92vw)}
.modal::backdrop{background:rgba(0,0,0,.55)}
.modal__inner{padding:var(--s-6); position:relative}
.modal__close{
  position:absolute; right:16px; top:14px;
  border:none; background:transparent; font-size:26px; cursor:pointer
}

/* Forms */
.lead-form{margin-top:var(--s-3)}
.form-grid{display:grid; gap:10px; grid-template-columns:repeat(2,1fr)}
.form-grid label{display:flex; flex-direction:column; gap:5px; font-size:var(--fs-sm)}
.form-grid input, .form-grid textarea, .form-grid select{
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:10px 11px;
  font:inherit;
}
.form-grid textarea{grid-column:1 / -1; resize:vertical}
.form-grid__full{grid-column:1 / -1}
.form-grid input[type="file"]{padding:8px}
.form-note{color:var(--text-muted); font-size:var(--fs-sm)}
.lead-form details.form-grid__full,
.lead-form .service-collapse{
  grid-column:1 / -1;
  border:1px solid var(--border);
  border-radius:var(--radius);
  background:#fff;
}
.lead-form .service-collapse > summary{
  cursor:pointer;
  padding:10px 12px;
  font-weight:700;
  color:var(--text);
}
.lead-form .service-collapse__content{
  border-top:1px solid var(--border);
  padding:12px;
}
.form-status{margin-top:10px; font-size:var(--fs-sm)}
.form-status.is-ok{color:#1C7C3A}
.form-status.is-err{color:#B00020}

/* Footer */
.site-footer{background:var(--cnv-muted); padding:var(--s-6) 0}
.footer__grid{display:grid; gap:var(--s-6); grid-template-columns:repeat(4,1fr)}
.footer__col h4,
.footer__col .footer__heading{
  margin:0 0 10px 0;
  font-weight:800;
  color:var(--cnv-charcoal);
}
.footer__col a{display:block; padding:6px 0; color:var(--cnv-charcoal)}
.footer__bottom{margin-top:var(--s-6); border-top:1px solid rgba(0,0,0,.08); padding-top:var(--s-4); color:var(--text-muted)}
.footer__logo{height:34px}

/* Responsive */
@media (max-width: 980px){
  .cards--4{grid-template-columns:repeat(2,1fr)}
  .gallery--grid{grid-template-columns:repeat(2,1fr)}
  .footer__grid{grid-template-columns:repeat(2,1fr)}
  .nav{display:none}
  .nav-toggle{display:block}
}
@media (max-width: 640px){
  .cards--3, .cards--4{grid-template-columns:1fr}
  .gallery--grid{grid-template-columns:1fr}
  .footer__grid{grid-template-columns:1fr}
  .form-grid{grid-template-columns:1fr}
}

/* =========================
   Sticky CTA (mobile)
   ========================= */
.sticky-cta{
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1200;
  display: none;
  gap: 10px;
  padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
  background: rgba(255,255,255,.96);
  border-top: 1px solid var(--border);
  backdrop-filter: blur(10px);
}
.sticky-cta__btn{
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 12px 14px;
  border-radius:var(--radius);
  border: 1px solid rgba(14,58,93,.28);
  background: transparent;
  color: var(--cnv-blue);
  font-weight: 700;
}
.sticky-cta__btn--primary{
  border-color: transparent;
  background: var(--cnv-blue);
  color: var(--cnv-white);
}
.sticky-cta{
  transition:opacity .2s ease, transform .2s ease;
}
.sticky-cta.is-suppressed{
  opacity:0;
  pointer-events:none;
  transform:translateY(calc(100% + 16px));
}
.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0, 0, 0, 0);
  white-space:nowrap;
  border:0;
}
@media (max-width: 820px){
  body.landing--service{ padding-bottom: 84px; }
  .sticky-cta{ display:flex; }
}


/* CNV_HEADER_VISIBILITY_V34_1
   Prevent "white on white" when header is transparent over light backgrounds.
   Also allow hide/show with .is-hidden.
*/
.site-header{
  will-change: transform;
}
.site-header.is-hidden{
  transform: translateY(-110%);
}

/* Default: if header is transparent, keep links readable unless home explicitly enables dark hero */
body:not(.home-hero--dark) .header--transparent .nav__link{
  color: var(--cnv-charcoal);
}

/* CNV_HEADER_CTA_CONSISTENT_V34_6
   Standardize header CTAs: Primary = Solicitar evaluacion, Secondary = Conversemos (WhatsApp).
*/
.header__ctas,
.landing-header__actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

/* Chat button adapts to header theme */
.btn--chat{
  background: var(--cnv-white);
  color: var(--cnv-blue);
  border-color: rgba(14,58,93,.35);
}

.header--transparent .btn--chat{
  background: rgba(255,255,255,0.10);
  color: var(--cnv-white);
  border-color: rgba(255,255,255,.35);
}

.btn--chat .dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background: var(--cnv-blue);
  opacity:.9;
}

.header--transparent .btn--chat .dot{
  background: rgba(255,255,255,0.85);
}

/* Tighten on small screens */
@media (max-width: 820px){
  .header__ctas .btn,
  .landing-header__actions .btn{
    padding:10px 14px;
  }
}


/* CNV_BTN_CHAT_VISIBILITY_V34_9
   Make the header "Conversemos" CTA (btn--chat) consistently visible and aligned.
   Uses existing brand palette (var --cnv-blue / --cnv-white).
*/
.btn.btn--chat{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 14px;
  border-radius:999px;
  font-weight:700;
  line-height:1;
  white-space:nowrap;
  border:1px solid rgba(14,58,93,0.35);
  background: rgba(14,58,93,0.06);
  color: var(--cnv-blue);
}

.btn.btn--chat .dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background: currentColor;
  opacity:.9;
}

.btn.btn--chat:hover{ filter: brightness(1.04); }

/* When header is transparent over a hero image/video */
.header--transparent .btn.btn--chat,
.landing-header .btn.btn--chat{
  background: rgba(255,255,255,0.14);
  border-color: rgba(255,255,255,0.30);
  color: #fff;
  backdrop-filter: blur(8px);
}

/* Keep CTA row aligned */
.header__ctas,
.landing-header__actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:nowrap;
}

/* Ensure header CTAs are not hidden behind toggles */
.header__ctas{ z-index: 2; }

@media (max-width: 900px){
  .btn.btn--chat{ padding:9px 12px; font-size:.95rem; }
  .header__ctas, .landing-header__actions{ gap:8px; }
}


/* CNV_LANDING_CHAT_FIX_V34_10
   Landing headers are light backgrounds; ensure "Conversemos" does NOT inherit transparent/white style.
*/
.landing-header .btn.btn--chat{
  background: rgba(14,58,93,0.06);
  color: var(--cnv-blue);
  border-color: rgba(14,58,93,0.35);
  backdrop-filter: none;
}

/* Construccion narrativa */
.build-criteria{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}

.build-criteria__item{
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:16px;
  box-shadow:var(--shadow-soft);
}

.build-criteria__item h3{
  margin:0 0 8px;
}

.build-criteria__item p{
  margin:0;
  color:var(--text-muted);
}

.build-brief{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}

.build-brief__item{
  border-left:4px solid var(--cnv-blue);
  background:#fff;
  border-radius:var(--radius);
  padding:12px 14px;
  box-shadow:var(--shadow-soft);
}

@media (max-width: 980px){
  .build-criteria{grid-template-columns:1fr}
  .build-brief{grid-template-columns:1fr}
}


/* Header WhatsApp availability dot (only header) */
.site-header .btn.btn--chat .dot{
  background: #20c86f;
}
.header--transparent .btn.btn--chat .dot{
  background: #20c86f;
}

/* =========================================================
   Responsive foundation - CONAVRE V3.0
   Fase R1: base mobile global
   ========================================================= */
html{
  overflow-x:hidden;
  scroll-padding-top:110px;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

body{
  overflow-x:hidden;
}

:target{
  scroll-margin-top:110px;
}

button,
input,
select,
textarea{
  max-width:100%;
}

button,
select,
input[type="button"],
input[type="submit"],
input[type="reset"],
.btn,
.btn-primary,
.nav-toggle,
.sticky-cta__btn{
  min-height:44px;
}

.container,
.section,
.card,
.modal,
.modal__inner,
.form-grid,
.form-extra-fields,
.footer__grid{
  min-width:0;
}

.cta-row,
.hero__actions,
.hero-cta,
.section__actions,
.header__ctas,
.landing-header__actions{
  min-width:0;
}

.section__header,
.section__header h1,
.section__header h2,
.section__header p,
.card,
.btn,
.btn-primary{
  overflow-wrap:break-word;
}

.modal{
  max-height:min(92vh, 920px);
  overflow:auto;
}

.modal__inner{
  max-width:100%;
}

.form-grid > *,
.form-extra-fields > *{
  min-width:0;
}

.form-grid input,
.form-grid textarea,
.form-grid select,
.form-extra-fields input,
.form-extra-fields textarea,
.form-extra-fields select{
  width:100%;
}

.mobile-nav{
  max-height:calc(100dvh - 70px);
  overflow:auto;
  overscroll-behavior:contain;
}

@media (max-width:980px){
  html{
    scroll-padding-top:96px;
  }

  :target{
    scroll-margin-top:96px;
  }

  .container{
    padding-left:clamp(16px, 4vw, var(--s-5));
    padding-right:clamp(16px, 4vw, var(--s-5));
  }

  .section{
    padding-top:clamp(32px, 6vw, 46px);
    padding-bottom:clamp(32px, 6vw, 46px);
  }

  .section__header{
    margin-bottom:clamp(18px, 4vw, var(--s-5));
  }

  .cta-row,
  .hero__actions,
  .hero-cta,
  .section__actions{
    gap:10px;
  }

  .modal{
    width:min(760px, calc(100vw - 24px));
    max-height:calc(100dvh - 24px);
  }

  .modal__inner{
    padding:clamp(18px, 4vw, var(--s-6));
  }
}

@media (max-width:640px){
  html{
    scroll-padding-top:84px;
  }

  :target{
    scroll-margin-top:84px;
  }

  .container{
    padding-left:16px;
    padding-right:16px;
  }

  .section{
    padding-top:32px;
    padding-bottom:32px;
  }

  .section__header h2{
    font-size:clamp(24px, 8vw, var(--fs-xl));
    line-height:1.12;
  }

  .btn,
  .btn-primary{
    line-height:1.15;
    white-space:normal;
    text-align:center;
  }

  .cta-row > .btn,
  .cta-row > .btn-primary,
  .cta-row > a,
  .cta-row > button,
  .hero__actions > .btn,
  .hero__actions > a,
  .hero__actions > button,
  .hero-cta > .btn,
  .hero-cta > a,
  .hero-cta > button{
    flex:1 1 100%;
    width:100%;
  }

  .form-grid,
  .form-extra-fields{
    grid-template-columns:1fr !important;
  }

  .form-grid input,
  .form-grid textarea,
  .form-grid select,
  .form-extra-fields input,
  .form-extra-fields textarea,
  .form-extra-fields select{
    font-size:16px;
  }

  .modal{
    width:calc(100vw - 20px);
    max-height:calc(100dvh - 20px);
    border-radius:var(--radius);
  }

  .modal__inner{
    padding:18px;
  }

  .modal__close{
    min-width:44px;
    min-height:44px;
    right:8px;
    top:8px;
  }

  .mobile-nav{
    padding-left:16px;
    padding-right:16px;
  }

  .mobile-nav a{
    min-height:44px;
    display:flex;
    align-items:center;
  }
}

@media (max-width:420px){
  .container{
    padding-left:14px;
    padding-right:14px;
  }

  .btn,
  .btn-primary{
    padding-left:14px;
    padding-right:14px;
  }

  .site-footer{
    padding-bottom:calc(var(--s-6) + env(safe-area-inset-bottom));
  }
}

/* =========================================================
   Consentimiento y medicion - prepublicacion 2026
   ========================================================= */
.consent-banner{
  position:fixed;
  z-index:1200;
  right:18px;
  bottom:18px;
  left:18px;
  max-width:980px;
  margin-inline:auto;
  padding:18px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:8px;
  background:#102836;
  color:#f7fbfd;
  box-shadow:0 18px 48px rgba(4,18,25,.32);
}

.consent-banner[hidden]{
  display:none;
}

.consent-banner__content{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:20px;
  align-items:center;
}

.consent-banner strong{
  display:block;
  margin-bottom:4px;
  font-size:1rem;
}

.consent-banner p{
  margin:0 0 6px;
  max-width:720px;
  color:rgba(247,251,253,.84);
  font-size:.9rem;
  line-height:1.45;
}

.consent-banner a{
  color:#fff;
  text-decoration:underline;
  text-underline-offset:3px;
}

.consent-banner__actions{
  display:flex;
  gap:10px;
}

.consent-banner .btn{
  min-height:44px;
  white-space:nowrap;
}

.footer__privacy-button{
  appearance:none;
  margin:0 0 0 auto;
  padding:6px 0;
  border:0;
  background:transparent;
  color:inherit;
  font:inherit;
  font-size:.82rem;
  text-decoration:underline;
  text-underline-offset:3px;
  cursor:pointer;
}

.footer__privacy-button:focus-visible{
  outline:2px solid currentColor;
  outline-offset:3px;
}

.lead-consent{
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin:12px 0;
  color:var(--text-muted, #52636d);
  font-size:.86rem;
  line-height:1.45;
}

.lead-consent input[type="checkbox"]{
  flex:0 0 auto;
  width:18px;
  height:18px;
  margin:2px 0 0;
  accent-color:var(--cnv-blue, #087ca7);
}

.lead-consent a{
  color:inherit;
  font-weight:700;
  text-decoration:underline;
  text-underline-offset:2px;
}

.lead-consent:focus-within{
  outline:2px solid rgba(8,124,167,.35);
  outline-offset:4px;
}

@media (max-width:768px){
  .consent-banner{
    right:10px;
    bottom:10px;
    left:10px;
    padding:16px;
  }

  .consent-banner__content{
    grid-template-columns:1fr;
    gap:14px;
  }

  .consent-banner__actions{
    display:grid;
    grid-template-columns:1fr 1fr;
  }

  .footer__privacy-button{
    width:100%;
    min-height:44px;
    margin-top:8px;
    text-align:left;
  }
}