/* Propuesta cálida exclusiva de portada; conserva navegación y estilos del resto de la app. */
.home-page{background:radial-gradient(ellipse at 3% 40%,#ffe29690,transparent 42%),radial-gradient(ellipse at 100% 60%,#ffd46a70,transparent 42%),#fff7db;color:#412e20;overflow-x:hidden}
.home-page .topbar{position:relative;z-index:2;background:transparent;border-bottom:1px solid #c7983d20;max-width:1180px;padding:22px 26px}
.home-page .brand-caption{color:#91704b}.home-page #home-language{background:#fffcf3;border:1px solid #d7bd8440;border-radius:14px;box-shadow:0 4px 16px #976b0b08}
.home-main{position:relative;isolation:isolate;max-width:1180px!important;padding:24px 26px!important}
.home-heading{position:relative;z-index:1;min-height:160px;padding:12px 165px 18px;margin-bottom:12px}
.home-heading .eyebrow{color:#995227;letter-spacing:3px;font-size:11px}
.home-heading h1{color:#653114;font-size:clamp(30px,3.5vw,46px);letter-spacing:-1.5px;text-wrap:balance}
.home-heading .lede{color:#765638;max-width:48ch;line-height:1.5}
.home-host{position:absolute;left:-35px;top:7px;width:205px;height:205px;object-fit:contain;transform:rotate(-9deg);z-index:0;filter:drop-shadow(0 8px 7px #aa75101c)}
.home-sticky{position:absolute;right:10px;top:24px;z-index:2;background:linear-gradient(145deg,#ffefad,#ffe298);padding:20px 19px 12px;width:145px;text-align:center;transform:rotate(7deg);box-shadow:2px 7px 13px #9c751221;font:italic 21px/1.2 'Segoe Print','Comic Sans MS',cursive;color:#9b5125;border:1px solid #f5d482}
.home-sticky:before{content:'';position:absolute;width:25px;height:30px;background:#e8b35365;top:-13px;left:62px;transform:rotate(-8deg)}
.home-sticky span{display:block;font:28px/1.2 'Segoe Print',cursive;margin-top:6px}
.home-page .area-grid{position:relative;z-index:1;gap:24px}
.home-page .area-card{border:1px solid #fffcdf;border-radius:26px;background:#fffbee;box-shadow:0 12px 26px #b38a2720;transition:transform .2s,box-shadow .2s}
.home-page .area-card:hover{transform:translateY(-5px) rotate(-.4deg);box-shadow:0 16px 28px #b38a2733}
.home-page .area-art{height:158px;background:linear-gradient(135deg,#ffe6a0,#fff0c1)}
.home-page .area-topics .area-art{background:linear-gradient(135deg,#c3e9ce,#dcf2df)}
.home-page .area-challenges .area-art{background:linear-gradient(135deg,#ffdcc9,#ffebe0)}
.home-page .area-art:before{border:0;box-shadow:none;background:#ffffff30;width:130px;height:130px}
.home-page .area-art img{height:94%;width:85%;filter:drop-shadow(0 5px 4px #64422118)}
.home-page .area-battle .area-art img{width:125px;height:125px}
.home-page .area-orbit{color:#ffffff88;font-size:32px;right:30px;top:30px}
.home-page .area-copy{padding:20px 22px 22px;gap:8px}
.home-page .area-copy h2{color:#233843;font-size:29px}
.home-page .area-copy .eyebrow{color:#25736a;letter-spacing:1.4px;font-size:10px}
.home-page .area-challenges .eyebrow{color:#c34543}
.home-page .area-copy p{color:#756d55;font-size:14px;line-height:1.55}
.home-page .area-link{justify-content:center;gap:12px;padding:13px 12px;border:0;border-radius:14px;color:#613700;background:linear-gradient(#ffdc76,#ffbf35);box-shadow:0 4px 10px #e5ac3020}
.home-page .area-topics .area-link{background:linear-gradient(#1caa7b,#098663);color:white}
.home-page .area-challenges .area-link{background:linear-gradient(#ef5560,#dc3345);color:white}
.home-wall-motto{text-align:center;font:italic 27px/1.5 'Segoe Print','Comic Sans MS',cursive;color:#426456;transform:rotate(-2deg);margin:24px 0 32px}
.home-wall-motto span{color:#eea62e;padding:0 12px}
.home-wall-art{position:absolute;inset:0 -65px;pointer-events:none;z-index:-1;overflow:hidden}
.home-wall-art i{position:absolute;width:70px;height:125px;background:linear-gradient(60deg,#368759,#8dbb66);border-radius:2% 100% 2% 100%;opacity:.65;transform:rotate(-25deg);left:0;top:150px}
.home-wall-art i:after{content:'';position:absolute;inset:10% 49%;background:#285d4240;transform:rotate(-27deg)}
.home-wall-art i:nth-child(2){top:260px;left:15px;transform:rotate(-65deg);background:#a0bb58}
.home-wall-art i:nth-child(3){top:400px;left:-20px;transform:rotate(15deg)}
.home-wall-art i:nth-child(4){left:auto;right:0;top:130px;transform:rotate(95deg)}
.home-wall-art i:nth-child(5){left:auto;right:15px;top:290px;transform:rotate(150deg);background:#afbf64}
.home-wall-art i:nth-child(6){left:auto;right:-15px;top:430px;transform:rotate(105deg)}
.home-page .home-mobile,.home-page .home-discover{background:#fffaf0;border-color:#eedba8;box-shadow:0 7px 22px #a4821410}
.home-page .home-mobile h2,.home-page .home-discover h2{color:#66411e}
@media(max-width:850px){.home-heading{padding:10px 115px 15px;min-height:160px}.home-host{width:140px;height:150px;left:-12px;top:30px}.home-sticky{width:110px;font-size:17px;padding:15px 10px;right:12px;top:32px}.home-sticky:before{left:43px}.home-page .area-grid{gap:14px}.home-page .area-copy{padding:17px}.home-page .area-art{height:130px}}
@media(max-width:620px){.home-page .topbar{padding:14px 16px;gap:10px}.home-page .brand-caption{display:none}.home-main{padding:12px 18px!important}.home-heading{padding:4px 0 110px;min-height:0;margin:0}.home-heading h1{font-size:33px}.home-heading .lede{font-size:15px}.home-host{top:165px;left:26px;width:105px;height:110px}.home-sticky{top:177px;right:32px;width:130px;font-size:17px;padding:12px;transform:rotate(5deg)}.home-sticky span{display:none}.home-page .area-grid{grid-template-columns:1fr}.home-page .area-card{display:grid;grid-template-columns:110px minmax(0,1fr);border-radius:22px}.home-page .area-art{height:100%;min-height:190px}.home-page .area-art img,.home-page .area-battle .area-art img{width:100%;height:auto;max-height:130px}.home-page .area-orbit{display:none}.home-page .area-copy{padding:18px 16px}.home-page .area-copy h2{font-size:26px}.home-page .area-copy p{font-size:13px}.home-wall-motto{font-size:21px}.home-wall-motto span{padding:0 3px}.home-wall-art{inset:0 -18px}}
@media(prefers-reduced-motion:reduce){.home-page .area-card{transition:none}}

/* Follaje ilustrado con transparencia real: las hojas entran desde fuera de la portada. */
.home-page .area-battle .area-art img{width:90%;height:98%;max-height:none;object-fit:contain}
.home-wall-art{inset:0 -100px;overflow:hidden}
.home-wall-art:before,.home-wall-art:after{content:'';position:absolute;top:100px;left:-105px;width:330px;height:550px;background:url('assets/home-leaves-illustrated.png') center/contain no-repeat;opacity:.9;transform:rotate(12deg)}
.home-wall-art:after{left:auto;right:-110px;top:140px;transform:scaleX(-1) rotate(8deg)}
.home-floating-leaf{position:absolute;right:220px;top:-50px;width:62px;height:62px;transform:rotate(-12deg);pointer-events:none}
.home-sticky{font-family:'Segoe Print','Comic Sans MS',cursive;font-weight:600;line-height:1.35;transform:rotate(-6deg);background:linear-gradient(135deg,#fff2b5,#ffe7a0);border-color:#ffe3a0;box-shadow:2px 5px 10px #a16b1718}
.home-sticky:before{background:#e7ad4866;transform:rotate(7deg)}
@media(max-width:620px){.home-wall-art{inset:0 -18px}.home-wall-art:before,.home-wall-art:after{width:180px;height:400px;left:-115px;opacity:.8}.home-wall-art:after{left:auto;right:-115px}.home-floating-leaf{top:3px;right:8px;width:32px;height:32px;opacity:.6}.home-page .area-battle .area-art img{width:100%;height:auto;max-height:150px}}

/* Tipografía manuscrita alojada en la app para un resultado consistente también en móvil. */
@font-face{font-family:Kalam;src:url('assets/fonts/kalam-regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Kalam;src:url('assets/fonts/kalam-bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}
.home-page .home-heading h1{font-family:Kalam,'Segoe Print',cursive;font-weight:700;font-size:clamp(34px,4.2vw,54px);line-height:1.18;letter-spacing:-1px;transform:none;color:#743b1b;margin:12px 0;text-wrap:balance}
.home-page .home-heading .lede{font-family:Kalam,'Segoe Print',cursive;font-size:24px;line-height:1.35;color:#796042}
.home-page .home-sticky,.home-page .home-wall-motto{font-family:Kalam,'Segoe Print',cursive;font-style:normal}
.home-page .home-sticky{font-size:23px;font-weight:400}
.home-page .home-wall-motto{font-size:30px;transform:none}
.home-page .home-heading .eyebrow{font-family:inherit;font-size:11px;font-weight:700;letter-spacing:2.5px}
/* Segundo plano de hojas: solo solapa los bordes de las ilustraciones, nunca texto ni controles. */
.home-page .area-grid:before,.home-page .area-grid:after{content:'';position:absolute;z-index:3;pointer-events:none;width:145px;height:155px;left:-105px;top:50px;background:url('assets/home-leaves-illustrated.png') center/contain no-repeat;transform:rotate(27deg);filter:drop-shadow(3px 5px 3px #334c2825)}
.home-page .area-grid:after{left:auto;right:-105px;top:5px;transform:scaleX(-1) rotate(20deg)}
@media(max-width:850px){.home-page .home-heading{padding-inline:110px}.home-page .home-heading h1{font-size:36px}.home-page .home-heading .lede{font-size:21px}.home-page .home-sticky{font-size:20px}}
@media(max-width:620px){.home-page .home-heading{padding:4px 0 115px}.home-page .home-heading h1{font-size:34px;line-height:1.15}.home-page .home-heading .lede{font-size:21px}.home-page .home-wall-motto{font-size:25px}.home-page .area-grid:before{width:80px;height:110px;left:-63px;top:40px}.home-page .area-grid:after{width:80px;height:110px;right:-63px;top:auto;bottom:90px}.home-page .home-host{top:180px}.home-page .home-sticky{top:185px}}

/* Lema de cabecera: estudio personalizado y diversión, con un gesto manuscrito discreto. */
.home-page .topbar .home-study-caption{display:flex;flex-direction:column;gap:2px;align-items:center;text-align:center;transform:rotate(-3deg);font-family:Kalam,'Segoe Print',cursive;font-size:21px;line-height:1.2;color:#85603a;flex:1;min-width:0;white-space:normal;padding:0 14px}
.home-study-caption small{font-size:15px;color:#59805a;font-weight:400}
@media(max-width:850px){.home-page .topbar .home-study-caption{font-size:17px}.home-study-caption small{font-size:13px}}
@media(max-width:620px){.home-page .topbar{flex-wrap:wrap}.home-page .topbar .home-study-caption{order:3;flex:0 0 100%;padding:5px 0 0;font-size:19px;transform:rotate(-2deg)}.home-study-caption small{font-size:14px}}

.home-sticky .sticky-copy{display:block;font:inherit;margin:0}.home-wall-motto .motto-copy{color:inherit;padding:0}

/* En pantallas estrechas, la ilustración vuelve a ocupar el ancho del card.
   La franja lateral anterior comprimía las imágenes y dejaba todo el texto a un lado. */
@media(max-width:760px){
  .home-page .area-card{display:flex;flex-direction:column}
  .home-page .area-art{width:100%;height:156px;min-height:0;flex:none}
  .home-page .area-art img,.home-page .area-battle .area-art img{width:auto;height:148px;max-width:82%;max-height:148px;object-fit:contain}
  .home-page .area-copy{padding:20px 22px 22px;gap:8px}
  .home-page .area-copy p{font-size:14px}
}

/* La mascota y la nota comparten una fila propia para no invadir la primera tarjeta. */
@media(max-width:620px){
  .home-page .home-main{display:grid;grid-template-columns:minmax(0,1fr);align-content:start}
  /* Todos los bloques ocupan la única columna; mascota y nota sí comparten su fila. */
  .home-page .home-main>*{grid-column:1;min-width:0}
  .home-page .home-heading{grid-row:1;padding:4px 0 8px}
  .home-page .home-host,.home-page .home-sticky{grid-row:2;position:relative;top:auto;left:auto;right:auto}
  .home-page .home-host{width:132px;height:136px;justify-self:start;margin-left:10px}
  .home-page .home-sticky{width:132px;align-self:center;justify-self:end;margin-right:12px;padding:12px}
  .home-page .area-grid{grid-row:3;margin-top:10px}
  .home-page .area-grid:before,.home-page .area-grid:after{display:none}
  .home-page .area-art{height:144px}
  .home-page .area-art img,.home-page .area-battle .area-art img{height:136px;max-height:136px}
}