/* ================================================================
   AULA 9 · V11 · DISEÑO FULL WIDTH
   ---------------------------------------------------------------
   Filosofía:
   - fondos y franjas ocupan todo el ancho del navegador
   - el contenido permanece centrado dentro de 1200 px
   - hero sin bordes ni aspecto de tarjeta
   - responsive estable
   ================================================================ */

:root{
  --v11-max:1200px;
  --v11-navy:#061c3b;
  --v11-green:#79ff00;
  --v11-soft:#f5f8fa;
}

/* ------------------------------------------------
   HEADER FULL WIDTH
   ------------------------------------------------ */
.site-header{
  width:100%;
  background:var(--v11-navy) !important;
  box-shadow:0 5px 18px rgba(0,0,0,.12) !important;
}

.nav-row{
  width:min(calc(100% - 40px),var(--v11-max)) !important;
  min-height:82px;
  margin-inline:auto;
  padding:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

/* ------------------------------------------------
   HERO FULL WIDTH
   La imagen de fondo se aplica a la sección entera.
   El .container solo coloca el texto.
   ------------------------------------------------ */
.photo-hero{
  width:100%;
  min-height:500px;
  padding:0 !important;
  margin:0 !important;
  overflow:hidden;
  background-color:#f8fafb !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
}

.photo-hero-home{
  background-image:url('../img/fondo-portada.webp?v=20260830-01') !important;
}
.photo-hero-primaria{
  background-image:url('../img/fondo-primaria-eso.webp?v=20260830-01') !important;
}
.photo-hero-bachillerato{
  background-image:url('../img/fondo-bachillerato.webp?v=20260830-01') !important;
}
.photo-hero-universidad{
  background-image:url('../img/fondo-universidad.webp?v=20260830-01') !important;
}

.photo-hero-inner{
  width:min(calc(100% - 40px),var(--v11-max)) !important;
  min-height:500px !important;
  margin-inline:auto;
  padding:38px 0 34px !important;
  display:flex;
  align-items:center;
  overflow:visible !important;
  border:0 !important;
  border-radius:0 !important;
  background:none !important;
  box-shadow:none !important;
}

.photo-hero-home .photo-hero-inner,
.photo-hero-primaria .photo-hero-inner,
.photo-hero-bachillerato .photo-hero-inner,
.photo-hero-universidad .photo-hero-inner{
  background-image:none !important;
}

.photo-hero-copy{
  width:47%;
  max-width:550px;
  padding:0 !important;
}

.photo-hero h1{
  font-size:clamp(2.75rem,4.2vw,4rem);
}

.photo-hero p{
  max-width:525px;
}

/* ------------------------------------------------
   REVIEWS: nueva franja blanca, ya no solapa hero
   ------------------------------------------------ */
.reviews-wrap,
.reviews-course{
  width:100%;
  margin:0 !important;
  padding:38px 0 44px !important;
  background:#fff;
}

.reviews-panel{
  width:min(calc(100% - 40px),var(--v11-max));
  margin-inline:auto;
}

/* ------------------------------------------------
   SECCIONES FULL WIDTH
   ------------------------------------------------ */
.section{
  width:100%;
}

/* Las etapas se separan claramente de las reseñas */
.stage-section{
  padding-top:70px !important;
  padding-bottom:78px !important;
  background:var(--v11-soft);
}

/* Quiénes somos */
.about-section{
  padding-top:86px !important;
  padding-bottom:86px !important;
  background:#fff !important;
}

/* Método */
.method-section{
  padding-top:84px !important;
  padding-bottom:88px !important;
  background:#f3f6f8 !important;
}

/* Contacto */
.contact-section{
  padding-top:84px !important;
  padding-bottom:88px !important;
  background:#fff !important;
}

/* Precios y asignaturas de páginas interiores */
.course-subjects{
  padding-top:78px !important;
  padding-bottom:82px !important;
  background:#fff !important;
}
.prices-section{
  padding-top:82px !important;
  padding-bottom:84px !important;
  background:#f4f7f9 !important;
}

/* En páginas de curso, reseñas como una franja completa */
.reviews-course{
  padding-top:62px !important;
  padding-bottom:72px !important;
  background:#fff;
}

/* Banda de matrícula full width */
.enrol-banner{
  width:100%;
  padding:28px 0;
  background:var(--v11-navy);
}

/* Footer ya ocupa full width; reforzamos continuidad */
.site-footer{
  width:100%;
  background:var(--v11-navy);
}

/* ------------------------------------------------
   Tarjetas: conservamos profundidad sin aspecto
   de "web dentro de una caja"
   ------------------------------------------------ */
.stage-card{
  box-shadow:0 12px 30px rgba(6,28,59,.07);
}
.reviews-panel{
  box-shadow:0 10px 30px rgba(6,28,59,.08);
}
.about-classroom{
  box-shadow:0 14px 34px rgba(6,28,59,.09);
}

/* ------------------------------------------------
   MONITORES GRANDES
   ------------------------------------------------ */
@media(min-width:1500px){
  :root{
    --v11-max:1280px;
  }

  .photo-hero{
    min-height:540px;
  }

  .photo-hero-inner{
    min-height:540px !important;
  }

  .photo-hero-copy{
    max-width:580px;
  }

  .photo-hero h1{
    font-size:4.15rem;
  }
}

/* ------------------------------------------------
   MENÚ RESPONSIVE
   ------------------------------------------------ */
@media(max-width:1180px){
  .nav-row{
    width:min(calc(100% - 40px),var(--v11-max)) !important;
    min-height:74px;
    padding:0 !important;
    grid-template-columns:minmax(0,1fr) auto;
  }

  .site-nav{
    top:74px !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    padding:10px 18px 16px !important;
    border-radius:0 0 15px 15px !important;
    background:var(--v11-navy) !important;
  }

  .site-nav.open{
    display:grid !important;
  }

  .site-nav > a{
    max-width:100% !important;
    white-space:normal !important;
  }

  .site-nav .nav-cta{
    width:100% !important;
    position:static !important;
    transform:none !important;
  }

  .photo-hero{
    min-height:470px;
  }

  .photo-hero-inner{
    min-height:470px !important;
  }

  .photo-hero-copy{
    width:49%;
    max-width:485px;
  }
}

/* ------------------------------------------------
   TABLET: fondo específico vertical
   ------------------------------------------------ */
@media(max-width:820px){
  .photo-hero{
    min-height:820px;
    background-size:cover !important;
    background-position:center center !important;
  }

  .photo-hero-home{
    background-image:url('../img/fondo-portada-movil.webp?v=20260830-01') !important;
  }
  .photo-hero-primaria{
    background-image:url('../img/fondo-primaria-eso-movil.webp?v=20260830-01') !important;
  }
  .photo-hero-bachillerato{
    background-image:url('../img/fondo-bachillerato-movil.webp?v=20260830-01') !important;
  }
  .photo-hero-universidad{
    background-image:url('../img/fondo-universidad-movil.webp?v=20260830-01') !important;
  }

  .photo-hero-inner{
    min-height:820px !important;
    align-items:flex-start !important;
    padding:34px 0 28px !important;
  }

  .photo-hero-copy{
    width:100%;
    max-width:600px;
  }

  .reviews-wrap,
  .reviews-course{
    padding-top:32px !important;
  }

  .stage-section,
  .about-section,
  .method-section,
  .contact-section,
  .course-subjects,
  .prices-section{
    padding-top:64px !important;
    padding-bottom:66px !important;
  }
}

/* ------------------------------------------------
   MÓVIL
   ------------------------------------------------ */
@media(max-width:560px){
  .container,
  .nav-row,
  .photo-hero-inner,
  .reviews-panel{
    width:min(calc(100% - 28px),var(--v11-max)) !important;
  }

  .nav-row{
    min-height:70px;
  }

  .site-nav{
    top:70px !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    border-radius:0 0 13px 13px !important;
  }

  .photo-hero{
    min-height:790px;
  }

  .photo-hero-inner{
    min-height:790px !important;
    padding-top:26px !important;
  }

  .photo-hero h1{
    font-size:2.35rem;
  }

  .reviews-wrap,
  .reviews-course{
    padding:26px 0 38px !important;
  }

  .stage-section,
  .about-section,
  .method-section,
  .contact-section,
  .course-subjects,
  .prices-section{
    padding-top:54px !important;
    padding-bottom:56px !important;
  }

  .enrol-banner{
    padding:24px 0;
  }
}


/* ------------------------------------------------
   WHATSAPP DESTACADO · V11.6
   ------------------------------------------------ */
.whatsapp-float{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:96;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-width:134px;
  height:56px;
  padding:0 18px;
  border-radius:18px;
  background:#25d366 !important;
  color:#fff !important;
  text-decoration:none;
  font-weight:900;
  letter-spacing:.01em;
  box-shadow:0 14px 34px rgba(0,0,0,.24);
}
.whatsapp-float:hover{
  transform:translateY(-2px);
}
.whatsapp-float img{
  width:28px !important;
  height:28px !important;
  flex:0 0 auto;
  filter:none !important;
}
.whatsapp-float span{
  display:inline-block;
  font-size:1rem;
  line-height:1;
}
@media(max-width:560px){
  .whatsapp-float{
    min-width:116px;
    height:50px;
    padding:0 15px;
    right:12px;
    bottom:12px;
    border-radius:16px;
    gap:8px;
  }
  .whatsapp-float img{
    width:24px !important;
    height:24px !important;
  }
  .whatsapp-float span{
    font-size:.95rem;
  }
}
