/* Página «Katadoku en el aula». Reutiliza la cabecera, el hero, las tarjetas de
   modalidades, el pergamino, el cierre y el aviso de novedades de la portada
   (style.css + home-v2.css); aquí solo están los bloques propios de la página.
   Los selectores llevan «.home-v2.aula-page» para imponerse a las reglas
   móviles de la portada («.home-v2:not(.about-page) …»). */

.home-v2.aula-page{background:#f3efe5}
.home-v2.aula-page main a:focus-visible{outline:3px solid #931d30;outline-offset:3px}

/* Contenedor ancho de las secciones (más que el de la cabecera, como en el
   prototipo). */
.aula-wide{width:min(1400px,calc(100% - 56px));margin:0 auto}

/* ---------- Hero ---------- */
.home-v2.aula-page .aula-hero .hero-art{background:linear-gradient(90deg,rgba(243,239,229,.9) 0%,rgba(243,239,229,.6) 34%,rgba(243,239,229,.08) 52%,transparent 60%),url('../img/katadoku%20en%20el%20aula/katadoku%20en%20el%20aula%20hero.webp') 72% center/cover}
.home-v2.aula-page .aula-hero .hero-content{min-height:620px;padding-bottom:64px}
.home-v2.aula-page .aula-hero .hero-copy{width:min(52%,660px);max-width:660px}
.home-v2.aula-page .aula-hero h1{max-width:none;margin-bottom:16px;color:#931d30;font-size:clamp(52px,5.8vw,86px);line-height:.95}
.home-v2.aula-page .aula-hero h1 span{display:block;color:#1e1e1b}
.home-v2.aula-page .aula-hero .hero-copy>p.aula-hero-subtitle{max-width:none;margin:0 0 18px;color:#284333;font:400 clamp(24px,2.2vw,31px)/1.15 var(--serif);text-wrap:balance}
.home-v2.aula-page .aula-hero .hero-copy>p:not(.home-kicker):not(.aula-hero-subtitle){max-width:560px;margin-bottom:12px;font-size:17.5px}
.aula-actions{display:flex;flex-wrap:wrap;gap:14px 16px;margin-top:30px}
.aula-actions .button,.aula-print .button{gap:11px}

/* Botón secundario: mismo tamaño que el principal, en papel y granate. */
.button.aula-button-alt,.home-v2.aula-page .aula-hero .button.aula-button-alt{border:1px solid rgba(147,29,48,.5);background:#fbf6ec;color:#931d30;box-shadow:none}
.button.aula-button-alt:hover,.home-v2.aula-page .aula-hero .button.aula-button-alt:hover{background:#f4e8d6;color:#7b1626}
.home-v2.aula-page .button svg{flex:0 0 auto;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ---------- Bloques ---------- */
.aula-block{padding:clamp(56px,6vw,96px) 0}
.aula-block.is-tinted{background:#efe8db}
.aula-head{max-width:880px;margin:0 auto clamp(30px,3.4vw,46px);text-align:center}
.home-v2.aula-page h2{margin:0 0 16px;color:#931d30;font:400 clamp(34px,3.5vw,52px)/1.06 var(--serif);letter-spacing:-.018em;text-wrap:balance}
.aula-head p{margin:0 auto;max-width:62ch;color:#2f2a24;font:400 18px/1.55 var(--sans);text-wrap:pretty}
.aula-rhythm-text p,.aula-print-text p,.aula-scroll p{margin:0 0 14px;color:#2f2a24;font:400 17.5px/1.6 var(--sans);text-wrap:pretty}
.aula-rhythm-text p:last-child,.aula-scroll p:last-of-type{margin-bottom:0}

/* Pergamino: el papel rasgado del cierre en 9 partes (border-image), así los
   bordes conservan su forma aunque el bloque crezca en alto. */
.aula-scroll,.home-v2.aula-page .aula-final .closing-paper{position:relative;border:38px solid transparent;border-image:url('../img/fondo%20papel.webp?v=20260927-2') 64 fill / 38px stretch;background:none;filter:drop-shadow(0 8px 14px rgba(60,40,20,.13))}
.aula-scroll{padding:18px 26px 22px}
.aula-leaves{position:absolute;z-index:1;height:auto;pointer-events:none;filter:drop-shadow(0 3px 4px rgba(60,40,20,.18))}

/* ---------- Usos en clase: seis tarjetas de papel ligero ---------- */
.aula-uses-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:0;padding:0;list-style:none}
.aula-use{display:flex;flex-direction:column;align-items:center;padding:26px 34px 30px;border:1px solid rgba(160,120,70,.22);border-radius:3px;background:linear-gradient(180deg,#f7eedc 0%,#efe2c6 100%);box-shadow:0 4px 12px rgba(70,48,25,.07),inset 0 0 26px rgba(160,110,50,.1);text-align:center}
/* Misma altura para todos los iconos; los apaisados (la mesa de los patios) ocupan algo más de ancho. */
.aula-use-icon{display:block;flex:0 0 auto;width:auto;max-width:124px;height:78px;margin:0 0 12px;object-fit:contain}
.aula-use h3{margin:0 0 10px;color:#931d30;font:400 24px/1.15 var(--serif);text-wrap:balance}
.aula-use p{align-self:stretch;max-width:none;margin:0;text-align:left;color:#3f3830;font:400 16.5px/1.55 var(--sans);text-wrap:pretty}
.aula-use p+p{margin-top:10px}
/* Texto justificado, sin cortar palabras. */
.aula-use p{text-align:justify;hyphens:manual;-webkit-hyphens:manual}

/* ---------- Actividad sencilla: pergamino y cuatro habilidades ---------- */
.aula-simple-grid{display:grid;grid-template-columns:minmax(0,1.16fr) minmax(0,1.2fr);align-items:center;gap:clamp(20px,2.2vw,34px)}
.aula-simple .aula-scroll{padding:40px 42px 54px}
.aula-simple .aula-scroll h2{font-size:clamp(34px,3.2vw,47px)}
.aula-simple .aula-leaves{bottom:-100px;left:-60px;width:205px;transform:rotate(-8deg)}
.aula-skills{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0;padding:0;list-style:none}
.aula-skill{display:flex;flex-direction:column;align-items:center;padding:8px 18px;text-align:center}
.aula-skill+.aula-skill{border-left:1px solid rgba(118,95,72,.24)}
.aula-skill img{width:124px;height:124px;margin-bottom:16px}
.aula-skill h3{margin:0 0 8px;color:#1e1e1b;font:400 23px/1.15 var(--serif);text-wrap:balance}
.aula-skill p{margin:0;color:#3f3830;font:400 16px/1.5 var(--sans);text-wrap:pretty}

/* ---------- Ritmo + idiomas en una fila ---------- */
.aula-rhythm-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr) minmax(0,.58fr);align-items:center;gap:clamp(28px,3.2vw,52px)}
.aula-languages-text{padding:20px 24px 28px}
.aula-languages-text h2{font-size:clamp(28px,2.4vw,36px)}
.aula-languages-text p{font-size:17px}
.aula-languages-text .aula-leaves{bottom:-82px;left:-112px;width:175px;transform:rotate(-6deg)}
.aula-languages-figure{margin:0 0 0 calc(-1 * clamp(28px,3.2vw,52px) - 14px)}
.aula-languages-figure img{display:block;width:100%;height:auto}

/* ---------- Diferentes formas de jugar: tarjetas de la portada, más grandes ---------- */
.home-v2.aula-page .aula-modes-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:26px}
.home-v2.aula-page .aula-modes .home-modality{padding:26px 26px 34px;background:rgba(235,222,198,.5)}
.home-v2.aula-page .aula-modes .home-modality img{width:94%;max-width:none}
.home-v2.aula-page .aula-modes .home-modality h3{margin:8px 0 14px;padding:14px 18px 13px;font-size:35px}
.home-v2.aula-page .aula-modes .home-modality h3 small{font-size:12px}
.home-v2.aula-page .aula-modes .home-modality p{max-width:300px;margin-bottom:24px;font-size:17px}
.home-v2.aula-page .aula-modes .home-modality .button{padding:13px 36px;font-size:19px}

/* ---------- Pantalla o papel ---------- */
.aula-print-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);align-items:center;gap:clamp(24px,2.6vw,40px)}
.home-v2.aula-page .aula-print h3{margin:-6px 0 22px;color:#284333;font:400 clamp(24px,2.1vw,30px)/1.15 var(--serif)}
.aula-print .button{margin-top:26px}
.aula-print-figure{margin:0}
.aula-print-figure img{display:block;width:100%;height:auto;filter:sepia(.25) saturate(.8) contrast(.92) brightness(1.04)}

/* ---------- Preguntas ---------- */
.aula-questions-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);align-items:center;gap:clamp(18px,1.8vw,28px)}
.aula-questions .aula-scroll{padding:56px 54px 64px}
.aula-questions .aula-scroll h2{font-size:clamp(34px,3.3vw,48px)}
.aula-questions .aula-scroll p{font-size:18px}
.aula-question-list{display:grid;gap:14px;margin:0 0 26px;padding:0;list-style:none}
.aula-question-list li{position:relative;padding-left:26px;color:#2f2a24;font:400 18px/1.5 var(--sans)}
.aula-question-list li::before{position:absolute;top:.62em;left:4px;width:8px;height:8px;border-radius:50%;background:#931d30;content:""}
.aula-question-close{margin:0;padding-top:20px;border-top:1px solid rgba(118,95,72,.26);color:#1e1e1b;font:400 21px/1.45 var(--serif);text-wrap:pretty}

/* ---------- CTA final: pergamino ancho con brújula y hojas ---------- */
.home-v2.aula-page .aula-final{padding:78px 0 84px;overflow-x:clip;background:#e9e0d1}
.home-v2.aula-page .aula-final .closing-paper{display:block;min-height:0;padding:38px 70px 46px}
.home-v2.aula-page .aula-final .closing-paper::before{display:none}
.aula-final-cta{position:relative;z-index:2;max-width:760px;margin:0 auto;text-align:center}
.aula-final-cta p{margin:0 auto 6px;color:#2f2a24;font:400 18px/1.55 var(--sans)}
.aula-final-cta .aula-essence{margin:16px auto 0;color:#284333;font:400 25px/1.3 var(--serif)}
.aula-final-cta .aula-actions{justify-content:center;margin-top:24px}
.home-v2.aula-page .aula-final .closing-compass{top:-74px;left:-92px}
.home-v2.aula-page .aula-final .closing-decoration{right:-64px;bottom:-96px}

/* ---------- Novedades: patrón de la portada, fuera del pergamino ---------- */
.aula-newsletter{padding:58px 0 64px;border-top:1px solid rgba(118,95,72,.16);background:#f3efe5}
.aula-newsletter .closing-newsletter{max-width:640px;padding:0;text-align:center}
.home-v2.aula-page .aula-newsletter h2{margin-bottom:12px;color:#1e1e1b;font-size:clamp(28px,2.6vw,36px)}
.aula-newsletter p{margin:0 0 6px;color:#2f2a24;font:400 18px/1.55 var(--serif)}
.home-v2.aula-page .aula-newsletter .newsletter-subscribe{margin-top:16px}
.home-v2.aula-page .newsletter-subscribe:focus-visible{outline:3px solid #931d30;outline-offset:3px}

/* 3 + 3: títulos con la misma altura para que los textos empiecen alineados. */
@media (min-width:821px){
  .aula-use h3{display:flex;align-items:center;justify-content:center;min-height:2.3em}
}

/* ---------- Escritorio estrecho ---------- */
@media (max-width:1239px){
  .aula-use{padding:24px 24px 26px}
  .aula-use p{font-size:16px}
  .aula-skill{padding:8px 14px}
  .aula-skill img{width:88px;height:88px}
  .aula-skill h3{font-size:20px}
  .aula-skill p{font-size:15.5px}
}

/* El hero se ajusta a la altura y se alinea a la derecha para que la
   cuadrícula no quede detrás del texto. */
@media (min-width:1101px) and (max-width:1240px){
  .home-v2.aula-page .aula-hero .hero-art{background:linear-gradient(90deg,rgba(243,239,229,.96) 0%,rgba(243,239,229,.9) 40%,rgba(243,239,229,.25) 52%,transparent 60%),url('../img/katadoku%20en%20el%20aula/katadoku%20en%20el%20aula%20hero.webp') right center/auto 100% no-repeat,#efe2c9}
  .home-v2.aula-page .aula-hero .hero-copy{width:min(50%,580px)}
}

/* ---------- Tablet (hasta 1100 px) ---------- */
@media (max-width:1100px){
  /* Hero: texto sobre papel liso y la ilustración debajo. */
  .home-v2.aula-page .aula-hero .hero-art{background:linear-gradient(180deg,#f3efe5 0%,#f3efe5 calc(100% - 340px),rgba(243,239,229,0) calc(100% - 250px)),url('../img/katadoku%20en%20el%20aula/katadoku%20en%20el%20aula%20hero.webp') 100% bottom/max(100%,877px) auto no-repeat,#f3efe5}
  .home-v2.aula-page .aula-hero .hero-content{min-height:0;padding-bottom:330px}
  .home-v2.aula-page .aula-hero .hero-copy{width:min(100%,660px)}
  .aula-simple-grid,.aula-print-grid,.aula-questions-grid{grid-template-columns:1fr}
  .aula-simple .aula-scroll,.aula-questions .aula-scroll{width:min(100%,780px);margin:0 auto}
  /* Aire bajo el pergamino para que las hojas no lleguen a los iconos. */
  .aula-simple .aula-scroll{margin-bottom:56px}
  .aula-rhythm-grid{grid-template-columns:minmax(0,1fr) minmax(0,.62fr)}
  .aula-rhythm-text{grid-column:1/-1}
  .aula-rhythm-text p{max-width:72ch}
  .home-v2.aula-page .aula-modes-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .home-v2.aula-page .aula-modes .home-modality img{width:min(78%,330px)}
  .home-v2.aula-page .aula-modes .home-modality p{max-width:340px}
  .aula-print-figure img{width:min(90%,620px);max-width:100%;margin:0 auto}
  .home-v2.aula-page .aula-final .closing-paper{padding:44px 50px 60px}
}

@media (max-width:820px){
  .aula-uses-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .aula-skills{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:26px}
  .aula-skill:nth-child(3){border-left:0}
}

/* ---------- Móvil ---------- */
@media (max-width:720px){
  .aula-wide{width:calc(100% - 34px)}
  .home-v2.aula-page .aula-hero .hero-art{background:linear-gradient(180deg,#f3efe5 0%,#f3efe5 calc(100% - 280px),rgba(243,239,229,0) calc(100% - 200px)),url('../img/katadoku%20en%20el%20aula/katadoku%20en%20el%20aula%20hero.webp') 88% bottom/auto 280px no-repeat,#f3efe5}
  .home-v2.aula-page .aula-hero .hero-content{padding-bottom:280px}
  .home-v2.aula-page .aula-hero h1{font-size:clamp(44px,13vw,58px)}
  .aula-actions{flex-direction:column;align-items:stretch}
  .aula-actions .button{justify-content:center}
  .aula-block{padding:52px 0}
  .aula-head{text-align:left}
  .home-v2.aula-page h2{font-size:clamp(31px,8.6vw,38px)}
  .aula-head p{font-size:17px}
  .aula-rhythm-text p,.aula-print-text p,.aula-scroll p{font-size:17px}
  .aula-scroll,.home-v2.aula-page .aula-final .closing-paper{border-width:26px;border-image-width:26px}
  .aula-scroll{padding:16px 14px 20px}
  .aula-simple .aula-scroll,.aula-questions .aula-scroll{padding:18px 14px 26px}
  .aula-simple .aula-leaves{bottom:-86px;left:-46px;width:130px}
  .aula-languages-text .aula-leaves{bottom:-68px;left:-44px;width:120px}
  .aula-simple .aula-scroll,.aula-languages-text{margin-bottom:44px}
  .aula-uses-grid{grid-template-columns:1fr;gap:14px}
  .aula-use{display:grid;grid-template-columns:76px 1fr;column-gap:16px;align-items:center;padding:20px 20px 22px;text-align:left}
  .aula-use-icon{justify-self:center;width:auto;max-width:76px;height:58px;margin:0}
  .aula-use h3{margin:0;font-size:21px}
  .aula-use p{grid-column:1/-1;margin-top:12px;font-size:16px}
  .aula-skill{padding:4px 12px}
  .aula-skill img{width:76px;height:76px;margin-bottom:10px}
  .aula-skill h3{font-size:19px}
  .aula-skill p{font-size:15.5px}
  .aula-rhythm-grid{grid-template-columns:1fr;gap:30px}
  .aula-languages-figure{margin:0}
  .aula-languages-figure img{width:min(72%,300px);margin:0 auto}
  /* Fichas imprimibles algo menores en móvil (antes al 90 %). */
  .aula-print-figure img{width:78%}
  .home-v2.aula-page .aula-modes-grid{grid-template-columns:1fr;gap:16px}
  .home-v2.aula-page .aula-modes .home-modality img{width:min(72%,300px)}
  .home-v2.aula-page .aula-modes .home-modality h3{font-size:28px}
  .aula-question-list li{font-size:17px}
  .aula-question-close{font-size:19px}
  .home-v2.aula-page .aula-final{padding:46px 0 52px}
  .home-v2.aula-page .aula-final .closing-paper{width:calc(100% - 20px);padding:52px 12px 70px}
  .aula-final-cta p{font-size:17px}
  .home-v2.aula-page .aula-final .button,.aula-print .button{padding:13px 16px;font-size:17px}
  .aula-final-cta .aula-essence{font-size:22px}
  .home-v2.aula-page .aula-final .closing-compass{top:-30px;left:-18px}
  .home-v2.aula-page .aula-final .closing-decoration{right:-40px;bottom:-46px}
  .aula-newsletter{padding:46px 0 52px}
  .aula-newsletter p{font-size:17px}
  .aula-newsletter p br{display:none}
  .home-v2.aula-page .footer a{display:inline-block;margin:-12px 0;padding:12px 0}
}

@media (max-width:400px){
  .home-v2.aula-page .aula-scroll h2{font-size:28px}
  .home-v2.aula-page .aula-final h2{font-size:29px}
  .home-v2.aula-page main .button{padding:13px 12px;font-size:16px}
}

@media (max-width:420px){
  .aula-skills{grid-template-columns:1fr}
  .aula-skill{display:grid;grid-template-columns:64px 1fr;column-gap:16px;align-items:center;padding:16px 0;text-align:left}
  .aula-skill+.aula-skill{border-top:1px solid rgba(118,95,72,.24);border-left:0}
  .aula-skill img{grid-row:1/3;width:64px;height:64px;margin:0}
  .aula-skill h3{margin:0 0 4px}
}
/* Six modalities: three balanced columns on desktop, existing tablet/mobile layout retained. */
@media(min-width:1101px){.home-v2.aula-page .aula-modes-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}