/* SeTechnota — featured.css | estilos modulares */

.featured-section{padding:34px 0 0;border-bottom:0}

.featured-grid{display:grid;grid-template-columns:2.1fr 1.05fr 1.15fr;grid-template-rows:repeat(4,minmax(0,1fr));height:440px;gap:10px}

.featured-item{min-width:0;min-height:0;overflow:hidden}

.featured-link{height:100%;display:block;position:relative;overflow:hidden;background:#e3e3e3}

.featured-link>img{width:100%;height:100%;object-fit:cover;transition:transform .3s}

.featured-link:hover>img{transform:scale(1.04)}

.featured-text{position:absolute;bottom:0;left:0;right:0;padding:32px 14px 12px;background:linear-gradient(transparent,rgba(0,0,0,.83));color:#fff}

.featured-text span{text-transform:uppercase;font-weight:bold;font-size:10px;letter-spacing:.4px;color:#f0bca4}

.featured-text h2{font-size:16px;line-height:1.23;margin:5px 0 0}

.featured-link:hover .featured-text h2{color:#fff}

.feature-main{grid-column:1;grid-row:1 / 5}

.feature-main .featured-text{padding:70px 25px 24px}

.feature-main h2{font-size:28px}

/* Posiciones fijas: evita que el navegador cree filas adicionales. */
.feature-secondary{grid-column:2}
.featured-grid > .feature-secondary:nth-child(2){grid-row:1 / 3}
.featured-grid > .feature-secondary:nth-child(3){grid-row:3 / 5}

.feature-secondary h2{font-size:17px}

.feature-small{grid-column:3}
.featured-grid > .feature-small:nth-child(4){grid-row:1}
.featured-grid > .feature-small:nth-child(5){grid-row:2}
.featured-grid > .feature-small:nth-child(6){grid-row:3}
.featured-grid > .feature-small:nth-child(7){grid-row:4}

.feature-small .featured-link{display:flex;background:#fafafa;border-bottom:1px solid #ddd}

.feature-small .featured-link>img,.feature-small .image-placeholder{width:36%;flex:0 0 36%;height:100%;object-fit:cover}

.feature-small .featured-text{position:static;background:none;color:#171717;display:flex;flex-direction:column;justify-content:center;padding:10px}

.feature-small .featured-text span{display:none}

.feature-small h2{font-size:13px}

.feature-small .featured-link:hover h2{color:var(--st-red)}

.image-placeholder{display:grid;place-items:center;background:linear-gradient(135deg,#d7d7d7,#f1f1f1);font-weight:800;color:#777;width:100%;height:100%;min-height:120px}

@media (max-width:1020px) {
  .featured-grid{grid-template-columns:1.6fr 1fr;grid-template-rows:repeat(4,minmax(0,1fr));height:460px}
}

@media (max-width:1020px) {
  .feature-main{grid-column:1;grid-row:1 / 5}
}

@media (max-width:1020px) {
  /* Posiciones fijas: evita que el navegador cree filas adicionales. */
.feature-secondary{grid-column:2}
.featured-grid > .feature-secondary:nth-child(2){grid-row:1 / 3}
.featured-grid > .feature-secondary:nth-child(3){grid-row:3 / 5}
}

@media (max-width:1020px) {
  .feature-small{display:none}
}

@media (max-width:700px) {
  .featured-section{padding:18px 0}
}

@media (max-width:700px) {
  .featured-grid{grid-template-columns:1fr 1fr;grid-template-rows:260px 155px;gap:8px;height:auto}
}

@media (max-width:700px) {
  .feature-main{grid-column:1/-1;grid-row:1}
}

@media (max-width:700px) {
  .feature-main h2{font-size:22px}
}

@media (max-width:700px) {
  .featured-grid > .feature-secondary:nth-child(2){grid-row:2;grid-column:1}
  .featured-grid > .feature-secondary:nth-child(3){grid-row:2;grid-column:2}
}

@media (max-width:700px) {
  .feature-secondary h2{font-size:13px}
}

@media (max-width:700px) {
  .feature-secondary .featured-text{padding:20px 10px 10px}
}

@media (max-width:420px) {
  .featured-grid{grid-template-rows:220px 130px}
}

/* Slider editorial: solo columna principal */
.feature-slider{position:relative;isolation:isolate}
.feature-slider__slides,.feature-slide{position:absolute;inset:0}
.feature-slide{opacity:0;visibility:hidden;transition:opacity .45s ease,visibility .45s;z-index:0}
.feature-slide.is-active{opacity:1;visibility:visible;z-index:1}
.feature-slide .featured-link{width:100%;height:100%}
.feature-slide .featured-link > img{width:100%;height:100%;object-fit:cover}
.feature-slider__controls{position:absolute;z-index:3;bottom:10px;left:15px;right:15px;display:flex;align-items:center;justify-content:center;gap:12px;pointer-events:none}
.feature-slider__arrow,.feature-slider__dot{pointer-events:auto;cursor:pointer;border:0;color:#fff}
.feature-slider__arrow{width:32px;height:32px;background:rgba(0,0,0,.48);border-radius:50%;font:normal 26px/1 Arial,sans-serif;display:grid;place-items:center;padding:0 0 4px}
.feature-slider__arrow:hover{background:var(--st-red)}
.feature-slider__dots{display:flex;align-items:center;gap:7px}
.feature-slider__dot{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.5);padding:0}
.feature-slider__dot.is-active{background:#fff;width:17px;border-radius:10px}
.feature-slider button:focus-visible{outline:2px solid white;outline-offset:3px}
.feature-main.feature-slider .featured-text{padding-bottom:63px}
@media(max-width:700px){.feature-main.feature-slider .featured-text{padding:40px 15px 55px}.feature-slider__controls{bottom:7px}}
@media(prefers-reduced-motion:reduce){.feature-slide,.feature-slide .featured-link>img{transition:none}}
