/* ==========================================================================
   ENTRETENIMIENTO TOLIMA · Masthead editorial v10.4
   Blanco limpio + vinotinto + oro tenue. Sin cambiar rutas ni funcionalidad.
   ========================================================================== */

:root{
  --et-editorial-wine:#8f1633;
  --et-editorial-wine-deep:#6f1027;
  --et-editorial-gold:#c59a3a;
  --et-editorial-gold-soft:#ddc27a;
  --et-editorial-ink:#111a2b;
  --et-editorial-muted:#657185;
  --et-editorial-line:#e8ebef;
}

.et-site-header{
  position:relative;
  z-index:40;
  background:#fff;
  border-bottom:0!important;
}

.et-brandbar{
  position:relative;
  border-bottom:1px solid var(--et-editorial-line)!important;
  background:#fff;
}

.et-brandbar-inner{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  min-height:154px!important;
  gap:24px!important;
}

/* Edición / ciudad */
.et-edition{
  position:relative!important;
  z-index:3;
  width:230px!important;
  flex:0 0 230px!important;
  display:grid!important;
  gap:5px!important;
  padding-left:22px!important;
  color:var(--et-editorial-muted)!important;
  font-size:.76rem!important;
  line-height:1.35!important;
}

.et-edition::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:2px;
  height:56px;
  transform:translateY(-50%);
  border-radius:99px;
  background:linear-gradient(180deg, var(--et-editorial-gold), rgba(197,154,58,.35));
}

.et-edition strong{
  color:#26344a!important;
  font-weight:600!important;
  letter-spacing:.01em;
}

.et-edition span{
  color:#68768b!important;
}

/* Masthead central */
.et-logo{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  z-index:1;
  transform:translate(-50%,-50%)!important;
  width:max-content!important;
  max-width:calc(100% - 650px)!important;
  display:grid!important;
  justify-items:center!important;
  gap:0!important;
  margin:0!important;
  color:var(--et-editorial-ink)!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  text-align:center!important;
  font-family:Georgia,"Times New Roman",serif!important;
  line-height:.88!important;
  letter-spacing:-.055em!important;
}

.et-logo-main{
  display:block!important;
  color:var(--et-editorial-ink)!important;
  font-size:clamp(2.65rem,4.25vw,4.65rem)!important;
  font-weight:700!important;
}

.et-logo-region{
  position:relative;
  display:flex!important;
  align-items:center;
  justify-content:center;
  gap:22px;
  margin-top:-1px;
  color:var(--et-editorial-wine)!important;
  font-size:clamp(2.2rem,3.45vw,3.7rem)!important;
  font-weight:700!important;
  letter-spacing:-.04em!important;
}

.et-logo-region::before,
.et-logo-region::after{
  content:"";
  width:82px;
  height:1px;
  background:linear-gradient(90deg, transparent, var(--et-editorial-gold));
}

.et-logo-region::after{
  background:linear-gradient(90deg, var(--et-editorial-gold), transparent);
}

.et-logo-tagline{
  display:block!important;
  margin-top:12px;
  color:#6e7787!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:.61rem!important;
  font-weight:500!important;
  line-height:1!important;
  letter-spacing:.34em!important;
}

/* Acciones derechas */
.et-header-actions{
  position:relative!important;
  z-index:3;
  margin-left:auto!important;
  padding-left:26px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:11px!important;
  flex:0 0 auto!important;
}

.et-header-actions::before{
  display:none!important;
}

.et-action-btn{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  min-height:42px!important;
  padding:0 16px!important;
  border-radius:12px!important;
  text-decoration:none!important;
  font-size:.75rem!important;
  font-weight:600!important;
  line-height:1!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
  box-shadow:none!important;
  transition:background-color .18s ease,border-color .18s ease,color .18s ease,transform .18s ease,box-shadow .18s ease!important;
}

.et-action-btn:hover{
  transform:translateY(-1px)!important;
}

.et-action-icon{
  width:16px!important;
  height:16px!important;
  flex:0 0 16px!important;
}

.et-action-icon svg{
  width:16px!important;
  height:16px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.7!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}

.et-action-btn-primary{
  color:var(--et-editorial-wine)!important;
  border:1px solid rgba(143,22,51,.72)!important;
  background:#fff!important;
}

.et-action-btn-primary:hover{
  color:#fff!important;
  border-color:var(--et-editorial-wine)!important;
  background:var(--et-editorial-wine)!important;
  box-shadow:0 8px 20px rgba(143,22,51,.12)!important;
}

.et-action-btn-secondary{
  color:#fff!important;
  border:1px solid var(--et-editorial-wine)!important;
  background:linear-gradient(180deg,#9c1939,#86132f)!important;
  box-shadow:0 6px 16px rgba(143,22,51,.12)!important;
}

.et-action-btn-secondary:hover{
  background:var(--et-editorial-wine-deep)!important;
  border-color:var(--et-editorial-wine-deep)!important;
  box-shadow:0 9px 22px rgba(111,16,39,.18)!important;
}

.et-action-btn:focus-visible{
  outline:3px solid rgba(197,154,58,.28)!important;
  outline-offset:3px!important;
}

@media(max-width:1260px){
  .et-brandbar-inner{
    min-height:132px!important;
  }

  .et-edition{
    width:185px!important;
    flex-basis:185px!important;
  }

  .et-logo{
    max-width:calc(100% - 540px)!important;
  }

  .et-logo-main{
    font-size:clamp(2.35rem,4vw,3.75rem)!important;
  }

  .et-logo-region{
    font-size:clamp(1.95rem,3.25vw,3rem)!important;
  }

  .et-logo-region::before,
  .et-logo-region::after{
    width:56px;
  }
}

@media(max-width:980px){
  .et-brandbar-inner{
    display:grid!important;
    grid-template-columns:1fr auto!important;
    min-height:auto!important;
    padding:18px 0!important;
    row-gap:13px!important;
  }

  .et-edition{
    display:none!important;
  }

  .et-logo{
    position:static!important;
    transform:none!important;
    grid-column:1!important;
    justify-self:start!important;
    max-width:none!important;
  }

  .et-logo-main{
    font-size:clamp(2rem,5.2vw,3rem)!important;
  }

  .et-logo-region{
    justify-self:start!important;
    font-size:clamp(1.6rem,4.2vw,2.35rem)!important;
    gap:12px;
  }

  .et-logo-region::before{
    display:none;
  }

  .et-logo-region::after{
    width:44px;
  }

  .et-logo-tagline{
    justify-self:start!important;
    letter-spacing:.22em!important;
    font-size:.55rem!important;
  }

  .et-header-actions{
    grid-column:2!important;
    justify-self:end!important;
    padding-left:16px!important;
  }
}

@media(max-width:680px){
  .et-brandbar-inner{
    grid-template-columns:1fr!important;
    padding:15px 0!important;
  }

  .et-logo{
    grid-column:1!important;
    justify-self:center!important;
  }

  .et-logo-region{
    justify-self:center!important;
  }

  .et-logo-tagline{
    justify-self:center!important;
    margin-top:9px;
    text-align:center;
  }

  .et-header-actions{
    grid-column:1!important;
    width:100%!important;
    padding-left:0!important;
    justify-content:center!important;
    flex-wrap:wrap!important;
  }

  .et-action-btn{
    min-height:39px!important;
    padding-inline:13px!important;
    font-size:.72rem!important;
  }
}

@media(max-width:390px){
  .et-logo-main{
    font-size:1.75rem!important;
  }

  .et-logo-region{
    font-size:1.48rem!important;
  }

  .et-logo-region::after{
    width:30px;
  }

  .et-logo-tagline{
    font-size:.49rem!important;
    letter-spacing:.16em!important;
  }
}


/* ==========================================================================
   v10.6 · Refinamiento exclusivo para pantallas grandes
   En portátil el diseño ya funcionaba bien; estas reglas solo amplían el
   espacio lateral y separan mejor las acciones del masthead central.
   ========================================================================== */

@media(min-width:1400px){
  .et-brandbar-inner{
    min-height:166px!important;
    gap:34px!important;
  }

  /* Lados más amplios para que el centro respire simétricamente. */
  .et-edition{
    width:270px!important;
    flex:0 0 270px!important;
  }

  .et-logo{
    max-width:calc(100% - 760px)!important;
  }

  .et-header-actions{
    width:315px!important;
    flex:0 0 315px!important;
    padding-left:52px!important;
    gap:18px!important;
  }

  .et-action-btn{
    min-height:44px!important;
    padding-inline:19px!important;
  }
}

@media(min-width:1700px){
  .et-brandbar-inner{
    min-height:174px!important;
  }

  .et-edition{
    width:300px!important;
    flex-basis:300px!important;
  }

  .et-logo{
    max-width:calc(100% - 840px)!important;
  }

  .et-header-actions{
    width:350px!important;
    flex-basis:350px!important;
    padding-left:68px!important;
    gap:22px!important;
  }
}
