/* =========================================================
   Pagini sate (Nou, Hosman, Marpod, Nocrich) – limbaj vizual comun v3
   Toate selectoarele încep cu .p-sat (pus pe fiecare <section>).
   Restul vine din componentele globale (.hero, .sec, .gallery, .band ...).
   ========================================================= */

/* Texte lizibile */
.p-sat .sat-text { line-height: 1.7; max-width: 70ch; }
.p-sat .sec-head p { line-height: 1.7; }
.p-sat b + b::before { content: " "; }

/* Galerie mozaic: rânduri de înălțime fixă, pentru .tall / .wide */
.p-sat .gallery.sat-mosaic { grid-auto-rows: clamp(150px, 17vw, 250px); }
.p-sat .gallery.sat-mosaic > * { aspect-ratio: auto; }
.p-sat .gallery.sat-mosaic-3 { grid-auto-rows: 1fr; min-height: 460px; }
@media (max-width: 991.98px) { .p-sat .gallery.sat-mosaic-3 { min-height: 0; grid-auto-rows: 200px; } }

/* Bandă mică de 3 poze (în split-body) – 3 coloane și pe mobil */
.p-sat .gallery.sat-strip { grid-template-columns: repeat(3, 1fr); }

/* Card roșu cu text (ex. afterschool Nou) */
.p-sat .sat-card-red {
  height: 100%; background: var(--el-red-dark); color: #fff; border-radius: var(--el-radius);
  padding: clamp(28px, 4vw, 48px); box-shadow: var(--el-shadow-lg);
  display: flex; flex-direction: column; justify-content: center;
}
.p-sat .sat-card-red .title-accent::after { background: #fff; }
.p-sat .sat-card-red p { margin: 0; }

/* Panou alb peste bandă foto */
.p-sat .panel h2 { color: var(--el-ink); }
.p-sat .panel .sat-btn br { display: none; }
.p-sat .panel .sat-btn { white-space: normal; max-width: 100%; }
.p-sat .band-text .title-accent::after { background: #fff; }

/* Carousel full-bleed cu text (stil identic cu hero-ul) */
.p-sat .sat-carousel .carousel-item { background-size: cover; background-position: center; background-color: #222; }
.p-sat .sat-carousel .sat-slide-in {
  position: relative; min-height: clamp(480px, 76vh, 760px);
  display: flex; align-items: flex-end; color: #fff;
}
.p-sat .sat-carousel .sat-slide-in::before {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0) 30%, rgba(0,0,0,.35) 60%, rgba(0,0,0,.8) 100%);
}
.p-sat .sat-carousel .container { position: relative; z-index: 1; padding-top: 120px; padding-bottom: clamp(64px, 7vw, 104px); }
.p-sat .sat-carousel h1, .p-sat .sat-carousel h2, .p-sat .sat-carousel h3 {
  max-width: 860px; margin-bottom: 1rem; text-shadow: 0 2px 20px rgba(0,0,0,.35);
}
.p-sat .sat-carousel p { max-width: 680px; color: rgba(255,255,255,.92); margin: 0; font-size: clamp(.95rem, .9rem + .2vw, 1.1rem); }
.p-sat .sat-carousel .title-accent::after { background: #fff; }
.p-sat .sat-carousel .hero-tag {
  display: inline-block; background: var(--el-red); color: #fff; font-weight: 700; font-size: .75rem;
  letter-spacing: 2px; text-transform: uppercase; padding: 6px 14px; border-radius: 50px; margin-bottom: 1.1rem;
}
.p-sat .sat-carousel-hero .sat-slide-in { min-height: clamp(520px, 80vh, 800px); }
/* Indicatori: linii scurte, cel activ roșu */
.p-sat .sat-carousel .carousel-indicators { margin-bottom: 1.6rem; }
.p-sat .sat-carousel .carousel-indicators [data-bs-target] {
  width: 28px; height: 4px; border-radius: 4px; border: 0; background: #fff; opacity: .55;
}
.p-sat .sat-carousel .carousel-indicators .active { background: var(--el-red); opacity: 1; }
/* Săgeți: cerc discret */
.p-sat .sat-carousel .carousel-control-prev, .p-sat .sat-carousel .carousel-control-next { width: 9%; }
.p-sat .sat-carousel .carousel-control-prev-icon, .p-sat .sat-carousel .carousel-control-next-icon,
.p-sat .carousel-el .carousel-control-prev-icon, .p-sat .carousel-el .carousel-control-next-icon {
  width: 3rem; height: 3rem; border-radius: 50%; background-color: rgba(0,0,0,.35); background-size: 45%;
  transition: background-color .2s;
}
.p-sat .carousel-control-prev:hover span, .p-sat .carousel-control-next:hover span { background-color: var(--el-red); }

@media (max-width: 767.98px) {
  /* săgețile rămân vizibile și pe mobil (mai mici) */
  .p-sat .sat-carousel .sat-slide-in { min-height: 520px; }
  .p-sat .sat-carousel .container { padding-top: 90px; }
  .p-sat .gallery.sat-strip { gap: 8px; }
  /* mozaic pe 2 coloane: fără goluri */
  .p-sat .gallery.sat-mosaic { grid-auto-flow: dense; grid-auto-rows: 150px; }
  .p-sat .gallery.sat-mosaic > .wide:not(.tall):last-child { grid-column: auto; }
}
@media (min-width: 1400px) {
  .p-sat .sat-carousel-hero .carousel-item { min-height: calc(100vh - 88px); }
}

/* Full HD+: slidere pe tot ecranul, umbrirea acoperă toată poza */
@media (min-width: 1400px) {
  .p-sat .sat-carousel .sat-slide-in, .p-sat .sat-carousel-hero .sat-slide-in { min-height: calc(100vh - 88px); }
}

/* ===== v8: mozaic „acțiune” (Marpod) – pe desktop pozele se văd aproape întregi =====
   Primele două poze stau în picioare (ca să se vadă copilul care calculează și
   cel care sare șotronul), următoarele două pe lat, ultima pe toată lățimea.
   Pe telefon rămâne mozaicul obișnuit. */
@media (min-width: 992px) {
  .p-sat .gallery.sat-mosaic.mosaic-actiune { grid-template-columns: repeat(4, 1fr); grid-auto-rows: clamp(220px, 19vw, 520px); }
  .p-sat .gallery.mosaic-actiune > :nth-child(1),
  .p-sat .gallery.mosaic-actiune > :nth-child(2) { grid-column: span 1; grid-row: span 2; }
  .p-sat .gallery.mosaic-actiune > :nth-child(3),
  .p-sat .gallery.mosaic-actiune > :nth-child(4) { grid-column: span 2; grid-row: span 1; }
  .p-sat .gallery.mosaic-actiune > :nth-child(5) { grid-column: 1 / -1; grid-row: span 2; }
}

/* ===== v8: Nocrich pe telefon – textul mai mic și jos, ca să nu acopere fața fetiței ===== */
@media (max-width: 767.98px) {
  #nocrichCarousel .sat-slide-in { min-height: 620px; }
  #nocrichCarousel .container { padding-top: 40px; padding-bottom: 46px; }
  #nocrichCarousel .hero-tag { font-size: .62rem; padding: 4px 11px; margin-bottom: .6rem; }
  #nocrichCarousel h1 { font-size: 1.3rem; line-height: 1.25; margin-bottom: .5rem; }
  #nocrichCarousel p { font-size: .78rem; line-height: 1.5; }
}