/* ==========================================================================
   TICsPoint — Presencia institucional transitoria
   Capa aditiva: NO reemplaza styles.css / site.css / v7.css.
   Objetivo: presencia mínima, sobria y coherente con las placas 2026.
   ========================================================================== */

:root{
  --tp-presence-bg: #0B1D33;
  --tp-presence-bg-2: #102843;
  --tp-presence-bg-3: #173653;
  --tp-presence-text: #F8FAFC;
  --tp-presence-muted: #C9D5E2;
  --tp-presence-muted-2: #93A8BC;
  --tp-presence-cyan: #23D0EB;
  --tp-presence-violet: #6C5CE7;
  --tp-presence-line: rgba(35, 208, 235, .19);
  --tp-presence-soft-line: rgba(201, 213, 226, .13);
  --tp-presence-light: #F7F9FC;
  --tp-presence-light-2: #EEF3F7;
  --tp-presence-dark-text: #10243B;
}

/* Eliminar la sensación de negro puro sin tocar el sistema histórico. */
html[data-theme="dark"] body.tp-presence-page,
body.tp-presence-page{
  background:
    radial-gradient(860px 440px at 88% 4%, rgba(35,208,235,.065), transparent 63%),
    radial-gradient(650px 380px at 8% 26%, rgba(108,92,231,.045), transparent 68%),
    var(--tp-presence-bg);
  color:var(--tp-presence-text);
}

html[data-theme="dark"] .tp-header{
  background:rgba(11,29,51,.88);
  border-bottom-color:rgba(201,213,226,.10);
}

html[data-theme="dark"] .tp-nav{
  background:rgba(11,29,51,.97);
}

html[data-theme="dark"] .tp-navbtn{
  background:rgba(16,40,67,.74);
}

html[data-theme="dark"] .tp-footer{
  background:rgba(11,29,51,.82);
  border-top-color:rgba(201,213,226,.10);
}

/* Light mode: familia secundaria clara, no inversión automática. */
html[data-theme="light"] body.tp-presence-page{
  background:
    radial-gradient(820px 430px at 88% 0%, rgba(35,208,235,.075), transparent 64%),
    var(--tp-presence-light);
  color:var(--tp-presence-dark-text);
}

html[data-theme="light"] .tp-presence-kicker,
html[data-theme="light"] .tp-presence-prose,
html[data-theme="light"] .tp-presence-contact__lead,
html[data-theme="light"] .tp-presence-product__copy p{
  color:#536A7E;
}

/* ---------- Hero / banner ---------- */
.tp-presence-hero{
  position:relative;
  isolation:isolate;
  min-height:410px;
  overflow:hidden;
  border-bottom:1px solid var(--tp-presence-soft-line);
  background:var(--tp-presence-bg);
}

/*
 * La fotografía es ambiente, no una "caja".
 * Vive detrás del contenido y se desvanece hacia el fondo mediante mask-image.
 * No existe ningún overlay por encima del copy.
 */
.tp-presence-hero__media{
  position:absolute;
  z-index:0;
  top:0;
  right:0;
  bottom:0;
  width:64%;
  overflow:hidden;
  background:
    radial-gradient(520px 300px at 74% 40%, rgba(35,208,235,.05), transparent 70%);
}

.tp-presence-hero__media.has-image{
  -webkit-mask-image:linear-gradient(
    90deg,
    transparent 0%,
    rgba(0,0,0,.16) 8%,
    rgba(0,0,0,.72) 24%,
    #000 42%,
    #000 100%
  );
  mask-image:linear-gradient(
    90deg,
    transparent 0%,
    rgba(0,0,0,.16) 8%,
    rgba(0,0,0,.72) 24%,
    #000 42%,
    #000 100%
  );
}

.tp-presence-hero__media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
}

.tp-presence-hero__inner{
  position:relative;
  z-index:2;
  min-height:410px;
  display:flex;
  align-items:center;
  padding-top:46px;
  padding-bottom:46px;
}

.tp-presence-hero__copy{
  width:min(500px,46%);
  min-width:0;
}

.tp-presence-kicker{
  margin:0 0 12px;
  font-family:"Montserrat",system-ui,sans-serif;
  font-size:10.5px;
  line-height:1.4;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--tp-presence-muted-2);
}

.tp-presence-claim{
  margin:0;
  max-width:500px;
  font-family:"Montserrat",system-ui,sans-serif;
  font-weight:700;
  font-size:clamp(30px,3.25vw,44px);
  line-height:1.09;
  letter-spacing:-.032em;
  color:var(--tp-presence-text);
}

.tp-presence-claim > span{
  display:block;
}

.tp-presence-accent{
  color:var(--tp-presence-cyan);
}

.tp-presence-lead{
  max-width:480px;
  margin:17px 0 0;
  font-size:15.5px;
  line-height:1.55;
  color:var(--tp-presence-muted);
}

/* ---------- Summary ---------- */
.tp-presence-summary{
  padding:64px 0 60px;
  border-bottom:1px solid var(--tp-presence-soft-line);
}

.tp-presence-summary__grid{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(260px,.8fr);
  gap:64px;
  align-items:center;
}

.tp-presence-title{
  margin:0;
  max-width:700px;
  font-family:"Montserrat",system-ui,sans-serif;
  font-size:clamp(25px,3vw,36px);
  line-height:1.14;
  letter-spacing:-.025em;
  font-weight:700;
  color:inherit;
}

.tp-presence-title span{
  display:inline;
}

.tp-presence-prose{
  max-width:730px;
  margin-top:22px;
  color:var(--tp-presence-muted);
  font-size:16px;
  line-height:1.7;
}

.tp-presence-prose p{
  margin:0 0 14px;
}

.tp-presence-summary__visual{
  min-height:230px;
  position:relative;
  overflow:hidden;
  border-left:1px solid var(--tp-presence-line);
}

/* Placeholder sobrio mientras no exista la segunda imagen. */
.tp-presence-summary__visual:not(.has-image){
  opacity:.8;
}

.tp-presence-summary__visual:not(.has-image)::before,
.tp-presence-summary__visual:not(.has-image)::after{
  content:"";
  position:absolute;
  border:1px solid rgba(35,208,235,.12);
  border-radius:999px;
}

.tp-presence-summary__visual:not(.has-image)::before{
  width:170px;
  height:170px;
  right:8%;
  top:12%;
}

.tp-presence-summary__visual:not(.has-image)::after{
  width:84px;
  height:84px;
  right:36%;
  top:33%;
  border-color:rgba(108,92,231,.11);
}

.tp-presence-summary__visual.has-image::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(
    90deg,
    var(--tp-presence-bg) 0%,
    rgba(11,29,51,.38) 12%,
    rgba(11,29,51,0) 36%
  );
}

.tp-presence-summary__visual img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
}

/* ---------- Product mention ---------- */
.tp-presence-product{
  padding:42px 0;
  border-bottom:1px solid var(--tp-presence-soft-line);
}

.tp-presence-product__line{
  display:grid;
  grid-template-columns:minmax(220px,.55fr) minmax(0,1.45fr);
  gap:54px;
  align-items:end;
}

.tp-presence-product__name{
  margin:2px 0 0;
  font-family:"Montserrat",system-ui,sans-serif;
  font-size:30px;
  line-height:1.1;
  font-weight:700;
  letter-spacing:-.025em;
}

.tp-presence-product__copy{
  border-left:1px solid var(--tp-presence-line);
  padding-left:28px;
}

.tp-presence-product__descriptor{
  margin:0 0 6px;
  color:var(--tp-presence-cyan) !important;
  font-family:"Montserrat",system-ui,sans-serif;
  font-size:13px;
  font-weight:700;
  letter-spacing:.02em;
}

.tp-presence-product__copy p:last-child{
  margin:0;
  max-width:680px;
  color:var(--tp-presence-muted);
  line-height:1.58;
}

/* ---------- Contact ---------- */
.tp-presence-contact{
  padding:58px 0 64px;
}

.tp-presence-contact--page{
  min-height:calc(100vh - 180px);
  padding-top:72px;
}

.tp-presence-contact__head{
  max-width:720px;
  margin-bottom:24px;
}

.tp-presence-contact__lead{
  margin:12px 0 0;
  color:var(--tp-presence-muted);
  line-height:1.6;
}

.tp-presence-form{
  max-width:760px;
  display:grid;
  gap:15px;
  margin-top:24px;
  padding:22px;
  border:1px solid var(--tp-presence-soft-line);
  border-radius:16px;
  background:rgba(16,40,67,.42);
}

.tp-presence-form__row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:15px;
}

.tp-presence-field label{
  display:block;
  margin-bottom:6px;
  color:var(--tp-presence-muted);
  font-size:12px;
  font-weight:600;
}

.tp-presence-field input,
.tp-presence-field textarea{
  width:100%;
  padding:10px 12px;
  border:1px solid rgba(201,213,226,.15);
  border-radius:10px;
  outline:0;
  background:rgba(11,29,51,.58);
  color:var(--tp-presence-text);
  font:inherit;
  transition:border-color .16s ease, background .16s ease;
}

.tp-presence-field input:focus,
.tp-presence-field textarea:focus{
  border-color:rgba(35,208,235,.58);
  background:rgba(16,40,67,.82);
}

.tp-presence-field textarea{
  resize:vertical;
  min-height:105px;
}

.tp-presence-form__actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  flex-wrap:wrap;
  margin-top:2px;
}

.tp-presence-submit{
  padding:10px 18px;
  border:1px solid var(--tp-presence-cyan);
  border-radius:9px;
  background:var(--tp-presence-cyan);
  color:#0B1D33;
  font-family:"Montserrat",system-ui,sans-serif;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
}

.tp-presence-submit:hover{
  background:#48D9EF;
}

.tp-presence-honeypot{
  position:absolute !important;
  left:-9999px !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
}

.tp-presence-alert{
  max-width:760px;
  margin:16px 0 0;
}

/* ---------- Light surfaces ---------- */
html[data-theme="light"] .tp-presence-hero{
  background:var(--tp-presence-light);
  border-bottom-color:rgba(16,36,59,.10);
}

html[data-theme="light"] .tp-presence-hero__media.has-image::before{
  background:linear-gradient(
    90deg,
    var(--tp-presence-light) 0%,
    rgba(247,249,252,.72) 8%,
    rgba(247,249,252,.18) 22%,
    rgba(247,249,252,0) 42%
  );
}

html[data-theme="light"] .tp-presence-summary__visual.has-image::before{
  background:linear-gradient(
    90deg,
    var(--tp-presence-light) 0%,
    rgba(247,249,252,.34) 12%,
    rgba(247,249,252,0) 36%
  );
}

html[data-theme="light"] .tp-presence-claim{
  color:var(--tp-presence-dark-text);
}

html[data-theme="light"] .tp-presence-lead{
  color:#536A7E;
}

html[data-theme="light"] .tp-presence-summary,
html[data-theme="light"] .tp-presence-product{
  border-bottom-color:rgba(16,36,59,.10);
}

html[data-theme="light"] .tp-presence-form{
  background:rgba(255,255,255,.76);
  border-color:rgba(16,36,59,.11);
}

html[data-theme="light"] .tp-presence-field label{
  color:#536A7E;
}

html[data-theme="light"] .tp-presence-field input,
html[data-theme="light"] .tp-presence-field textarea{
  background:#FFFFFF;
  color:var(--tp-presence-dark-text);
  border-color:rgba(16,36,59,.15);
}

html[data-theme="light"] .tp-presence-field input:focus,
html[data-theme="light"] .tp-presence-field textarea:focus{
  border-color:rgba(35,208,235,.66);
  background:#FFFFFF;
}

/* ---------- Responsive ---------- */
@media (max-width:900px){
  .tp-presence-hero{
    min-height:auto;
  }

  .tp-presence-hero__media{
    position:relative;
    width:100%;
    height:245px;
    top:auto;
    right:auto;
    bottom:auto;
  }

  .tp-presence-hero__media.has-image{
    -webkit-mask-image:linear-gradient(
      180deg,
      transparent 0%,
      rgba(0,0,0,.72) 18%,
      #000 36%,
      #000 100%
    );
    mask-image:linear-gradient(
      180deg,
      transparent 0%,
      rgba(0,0,0,.72) 18%,
      #000 36%,
      #000 100%
    );
  }

  .tp-presence-hero__inner{
    min-height:auto;
    padding-top:50px;
    padding-bottom:34px;
  }

  .tp-presence-hero__copy{
    width:100%;
    max-width:560px;
  }

  .tp-presence-summary__grid{
    grid-template-columns:1fr;
    gap:30px;
  }

  .tp-presence-summary__visual{
    min-height:200px;
    border-left:0;
    border-top:1px solid var(--tp-presence-line);
  }

  .tp-presence-summary__visual.has-image::before{
    background:linear-gradient(
      180deg,
      var(--tp-presence-bg) 0%,
      rgba(11,29,51,.28) 14%,
      rgba(11,29,51,0) 36%
    );
  }

  html[data-theme="light"] .tp-presence-summary__visual.has-image::before{
    background:linear-gradient(
      180deg,
      var(--tp-presence-light) 0%,
      rgba(247,249,252,.24) 14%,
      rgba(247,249,252,0) 36%
    );
  }

  .tp-presence-product__line{
    grid-template-columns:1fr;
    gap:18px;
  }

  .tp-presence-product__copy{
    padding-left:0;
    padding-top:16px;
    border-left:0;
    border-top:1px solid var(--tp-presence-line);
  }
}

@media (max-width:580px){
  .tp-presence-claim{
    font-size:clamp(28px,9vw,38px);
  }

  .tp-presence-summary,
  .tp-presence-contact{
    padding-top:46px;
    padding-bottom:50px;
  }

  .tp-presence-form{
    padding:17px;
  }

  .tp-presence-form__row{
    grid-template-columns:1fr;
  }

  .tp-presence-form__actions{
    align-items:flex-start;
    flex-direction:column;
  }
}

@media (prefers-reduced-motion:reduce){
  .tp-presence-page *{
    transition-duration:.01ms !important;
  }
}


/* ==========================================================================
   FIX 01 — alineación header + formulario
   - Mantiene el brand a la izquierda.
   - Lleva Contacto / idioma / tema al extremo derecho en desktop.
   - Centra el formulario dentro del contenedor.
   ========================================================================== */

@media (min-width: 920px){
  .tp-presence-page .tp-header__row{
    width:100%;
  }

  .tp-presence-page .tp-header .tp-nav{
    margin:0 0 0 auto !important;
    max-width:none !important;
    width:auto !important;
    flex:0 0 auto;
    justify-content:flex-end;
  }

  .tp-presence-page .tp-header .tp-nav__meta{
    margin-left:2px;
  }
}

.tp-presence-page .tp-presence-form{
  margin:24px auto 0;
}

.tp-presence-page .tp-presence-alert{
  margin-left:auto;
  margin-right:auto;
}


/* ==========================================================================
   CONTENT UPDATE 02 — Sobre TICsPoint + AuxiTrack
   ========================================================================== */

/* Los kickers fueron retirados del HTML; esta regla evita residuos si alguna
   copia cacheada todavía conserva uno en la home transitoria. */
.tp-presence-page main .tp-presence-kicker{
  display:none;
}

/* Sin kicker, el hero puede respirar levemente más arriba. */
.tp-presence-hero__copy{
  padding-top:2px;
}

/* Sobre TICsPoint */
.tp-presence-summary__statement{
  max-width:660px;
  margin:14px 0 0;
  font-family:"Montserrat",system-ui,sans-serif;
  font-size:clamp(18px,2vw,23px);
  line-height:1.35;
  font-weight:600;
  letter-spacing:-.018em;
  color:var(--tp-presence-text);
}

.tp-presence-summary__statement span{
  display:inline;
}

.tp-presence-summary .tp-presence-prose{
  margin-top:20px;
}

/* AuxiTrack: más editorial, sin "Producto actual" ni nombre tipográfico. */
.tp-presence-product{
  padding:58px 0 60px;
}

.tp-presence-product__line{
  grid-template-columns:minmax(190px,.48fr) minmax(0,1.52fr);
  gap:52px;
  align-items:start;
}

.tp-presence-product__brand{
  min-height:62px;
  display:flex;
  align-items:flex-start;
  justify-content:flex-start;
  padding-top:4px;
}

.tp-presence-product__brand img{
  display:block;
  width:auto;
  max-width:190px;
  max-height:58px;
  object-fit:contain;
  object-position:left center;
}

.tp-presence-product__brand-placeholder{
  display:block;
  width:190px;
  height:58px;
}

.tp-presence-product__copy{
  padding-left:30px;
}

.tp-presence-product__descriptor{
  margin:0 0 12px;
  font-size:12px;
  letter-spacing:.035em;
}

.tp-presence-product__headline{
  max-width:760px;
  margin:0 0 18px;
  font-family:"Montserrat",system-ui,sans-serif;
  font-size:clamp(18px,2vw,23px);
  line-height:1.35;
  letter-spacing:-.018em;
  font-weight:600;
  color:var(--tp-presence-text);
}

.tp-presence-product__copy > p:not(.tp-presence-product__descriptor){
  max-width:760px;
  margin:0 0 12px;
  color:var(--tp-presence-muted);
  font-size:15.5px;
  line-height:1.65;
}

.tp-presence-product__cta{
  display:inline-flex;
  align-items:center;
  margin-top:8px;
  padding:8px 0 7px;
  color:var(--tp-presence-cyan);
  border-bottom:1px solid rgba(35,208,235,.46);
  text-decoration:none;
  font-family:"Montserrat",system-ui,sans-serif;
  font-size:13.5px;
  font-weight:700;
  transition:border-color .16s ease, transform .16s ease;
}

.tp-presence-product__cta:hover{
  border-bottom-color:var(--tp-presence-cyan);
  transform:translateX(2px);
}

/* Contacto ya no tiene kicker, por lo que el título arranca la sección. */
.tp-presence-contact__head .tp-presence-title{
  margin-top:0;
}

/* Light mode */
html[data-theme="light"] .tp-presence-summary__statement,
html[data-theme="light"] .tp-presence-product__headline{
  color:var(--tp-presence-dark-text);
}

html[data-theme="light"] .tp-presence-product__copy > p:not(.tp-presence-product__descriptor){
  color:#536A7E;
}

@media (max-width:900px){
  .tp-presence-product__line{
    grid-template-columns:1fr;
    gap:20px;
  }

  .tp-presence-product__brand{
    min-height:48px;
  }

  .tp-presence-product__brand img{
    max-width:175px;
    max-height:52px;
  }

  .tp-presence-product__brand-placeholder{
    width:175px;
    height:52px;
  }

  .tp-presence-product__copy{
    padding-left:0;
    padding-top:18px;
  }
}

@media (max-width:580px){
  .tp-presence-product{
    padding-top:48px;
    padding-bottom:50px;
  }

  .tp-presence-product__headline{
    font-size:clamp(18px,5.8vw,23px);
  }
}


/* ==========================================================================
   AUXITRACK — variantes de isologotipo según tema
   Agregar AL FINAL de assets/css/presence.css
   No requiere cambios en index.php.
   ========================================================================== */

/* El PHP actual puede seguir resolviendo el slot genérico.
   Para estas variantes dejamos que CSS controle la reproducción final. */
.tp-presence-product__brand > img,
.tp-presence-product__brand-placeholder{
  display:none;
}

.tp-presence-product__brand::before{
  content:"";
  display:block;
  width:190px;
  height:58px;
  background-image:url("../img/auxitrack-logo-dark.png");
  background-repeat:no-repeat;
  background-position:left center;
  background-size:contain;
}

html[data-theme="light"] .tp-presence-product__brand::before{
  background-image:url("../img/auxitrack-logo-light.png");
}

@media (max-width:900px){
  .tp-presence-product__brand::before{
    width:175px;
    height:52px;
  }
}

/* ==========================================================================
   FIX — centrado vertical del isologotipo AuxiTrack en desktop
   ========================================================================== */
@media (min-width:901px){
  .tp-presence-product__line{
    align-items:center;
  }

  .tp-presence-product__brand{
    align-items:center;
    padding-top:0;
  }
}

/* ==========================================================================
   FIX — centrado del encabezado de Contacto
   ========================================================================== */
.tp-presence-contact__head{
  max-width:760px;
  margin-left:auto;
  margin-right:auto;
  text-align:center;
}

.tp-presence-contact__head .tp-presence-title{
  margin-left:auto;
  margin-right:auto;
}

.tp-presence-contact__lead{
  margin-left:auto;
  margin-right:auto;
}

/* ==========================================================================
   FIX — hover/focus de iconos sociales del footer
   ========================================================================== */
.tp-presence-social__link{
  transition:
    color .16s ease,
    border-color .16s ease,
    background-color .16s ease,
    box-shadow .16s ease,
    transform .16s ease,
    opacity .16s ease;
}

.tp-presence-social__link:hover,
.tp-presence-social__link:focus-visible{
  color:var(--tp-presence-text);
  border-color:rgba(35,208,235,.72);
  background:rgba(35,208,235,.11);
  box-shadow:0 0 0 3px rgba(35,208,235,.06);
  transform:translateY(-2px);
  opacity:1;
}

.tp-presence-social__link:focus-visible{
  outline:2px solid var(--tp-presence-cyan);
  outline-offset:3px;
}

html[data-theme="light"] .tp-presence-social__link:hover,
html[data-theme="light"] .tp-presence-social__link:focus-visible{
  color:var(--tp-presence-dark-text);
  background:rgba(35,208,235,.10);
  border-color:rgba(35,208,235,.68);
}