/* Monkey Speaks — shared styles
   Layout: a bright classroom. White page, soft-green bands, the monkey talking in speech bubbles,
   one chalkboard band, lime highlighter on the words that matter. */
:root{
  --paper:#ffffff;
  --paper-2:#f1f9ea;
  --mint:#e4f4d4;
  --ink:#1c2445;
  --ink-soft:#4f5878;
  --lime:#8acb3c;
  --lime-text:#3c7a0c;
  --chalk-bg:#2f4c43;
  --chalk:#eef2e6;
  --line:#dbe4d2;
  --card:#ffffff;
  --on-lime:#16203d;
  --warn-bg:#fff1e3;
  --warn:#b4540a;
  --tiktok:#ff2d55;
  --zoom:#2d6cdf;
  --banana:#f6cd3b;
  --banana-ink:#b58a00;
  --display:"Bricolage Grotesque", "Arial Rounded MT Bold", "Trebuchet MS", sans-serif;
  --body:"Figtree", "Segoe UI", system-ui, sans-serif;
  --hand:"Kalam", "Comic Neue", "Segoe Print", cursive;
  color-scheme:only light;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--paper)}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--display);line-height:1.08;text-wrap:balance;margin:0;letter-spacing:-.02em}
p{margin:0}
button{font:inherit}
[hidden]{display:none!important}
.wrap{max-width:1160px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.eyebrow{font-weight:700;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--lime-text)}
:focus-visible{outline:3px solid var(--lime);outline-offset:3px;border-radius:6px}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55em;font-weight:700;font-size:1rem;text-decoration:none;padding:.85em 1.35em;border-radius:999px;border:2px solid var(--ink);transition:transform .15s ease, box-shadow .15s ease, background .15s;cursor:pointer;background:none;color:var(--ink);text-align:center;line-height:1.2}
.btn-main{background:var(--lime);color:var(--on-lime);box-shadow:3px 3px 0 var(--ink)}
.btn-main:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--ink)}
.btn-ghost:hover{background:var(--paper-2)}
.btn-sm{padding:.55em 1em;font-size:.92rem}
.btn svg{width:1.15em;height:1.15em;flex:none}

/* Header */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:color-mix(in srgb,var(--paper) 93%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:12px}
.brand img{height:44px;width:auto}
.nav{display:flex;gap:4px;font-weight:600;font-size:.92rem}
.nav > a,.nav .dd-top{position:relative;display:inline-flex;align-items:center;gap:4px;text-decoration:none;color:var(--ink-soft);padding:.42em .75em;border-radius:999px;border:0;background:transparent;font:inherit;cursor:pointer;transition:color .15s ease, background-color .15s ease}
.nav > a::after,.nav .dd-top::after{content:"";position:absolute;left:.75em;right:.75em;bottom:.12em;height:3px;border-radius:2px;background:var(--lime);transform:scaleX(0);transform-origin:left;transition:transform .2s ease}
.nav > a:hover,.nav .dd-top:hover,.nav .dd.open .dd-top{color:var(--ink);background:var(--paper-2)}
.nav > a:hover::after,.nav .dd-top:hover::after,.nav .dd.open .dd-top::after{transform:scaleX(1)}
.nav > a.is-active,.nav > a[aria-current="page"],.nav .dd-top.is-active,.nav .dd-top[aria-current="page"]{color:var(--ink);background:var(--mint)}
.nav > a.is-active::after,.nav > a[aria-current="page"]::after,.nav .dd-top.is-active::after,.nav .dd-top[aria-current="page"]::after{transform:scaleX(1)}

/* Menú desplegable de exámenes (se abre con clic) */
.dd{position:relative;display:flex;align-items:center}
.dd-top svg{width:12px;height:12px;transition:transform .2s ease}
.dd.open .dd-top svg{transform:rotate(180deg)}
.dd-menu{display:none;position:absolute;top:calc(100% + 12px);left:50%;transform:translateX(-50%);width:min(900px,94vw);z-index:40;background:var(--card);border:2px solid var(--ink);border-radius:18px;box-shadow:0 14px 30px -12px color-mix(in srgb,var(--ink) 35%,transparent);overflow:hidden}
.dd.open .dd-menu{display:block;animation:ddIn .16s ease both}
@keyframes ddIn{from{opacity:0;transform:translate(-50%,-6px)}}
.dd-cols{display:grid;grid-template-columns:repeat(5,1fr)}
.dd-group{display:grid;gap:2px;align-content:start;padding:16px 12px 14px;border-left:1px solid var(--line)}
.dd-group:first-child{border-left:0}
.dd-label{font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);padding:0 .6em .4em}
.dd-group a{display:flex;align-items:center;justify-content:space-between;gap:8px;text-decoration:none;color:var(--ink);padding:.5em .6em;border-radius:10px}
.dd-group a b{font-family:var(--display);font-size:1.02rem}
.dd-group a span{font-size:.72rem;font-weight:700;color:var(--lime-text);background:var(--paper-2);border-radius:999px;padding:.15em .55em;white-space:nowrap}
.dd-group a:hover,.dd-group a:focus-visible{background:var(--paper-2)}
.dd-group a:hover span{background:var(--mint)}
.dd-group a[aria-current="page"]{background:var(--mint)}
.dd-foot{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 18px;background:var(--paper-2);border-top:1px solid var(--line)}
.dd-foot a{font-weight:700;font-size:.9rem;color:var(--lime-text);text-decoration:none}
.dd-foot a:hover{text-decoration:underline;text-underline-offset:4px}
@media (prefers-reduced-motion: reduce){.dd.open .dd-menu{animation:none}}
.top .btn{padding:.6em 1.05em;font-size:.92rem}
@media (max-width:1020px){.nav{display:none}}
@media (max-width:420px){.top .btn span{display:none}.brand img{height:38px}}

/* Sections */
.sec{padding-block:84px}
.band{background:var(--paper-2)}
.sec-head{max-width:680px;display:grid;gap:12px;margin-bottom:40px}
.sec-head h2{font-size:clamp(2rem,4.4vw,3.1rem);font-weight:800}
.sec-head p{color:var(--ink-soft);font-size:1.08rem}

/* Speech bubble */
.bubble{background:var(--card);border:2px solid var(--ink);border-radius:22px;padding:14px 18px;font-family:var(--hand);font-size:1.25rem;line-height:1.25;position:relative;box-shadow:3px 3px 0 var(--ink)}
.bubble::after{content:"";position:absolute;width:18px;height:18px;background:var(--card);border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);bottom:-11px;left:46px;transform:rotate(45deg)}
.bubble small{display:block;font-family:var(--body);font-size:.8rem;color:var(--ink-soft);margin-top:4px}

/* Lists with lime dash */
.dash{margin:0;padding:0;list-style:none;display:grid;gap:7px}
.dash li{padding-left:20px;position:relative;line-height:1.45}
.dash li::before{content:"";position:absolute;left:1px;top:.62em;width:10px;height:3px;background:var(--lime);border-radius:2px}

/* Placeholder flag */
.todo-flag{font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--warn);background:var(--warn-bg);border-radius:6px;padding:.25em .6em;justify-self:start;align-self:start;white-space:nowrap}

/* FAQ */
details{border-bottom:1px solid var(--line)}
details:first-of-type{border-top:1px solid var(--line)}
summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;padding:18px 2px;font-weight:700;font-size:1.06rem}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-family:var(--display);font-size:1.6rem;line-height:1;color:var(--lime-text);transition:transform .2s;flex:none}
details[open] summary::after{transform:rotate(45deg)}
details > div{padding:0 2px 20px;color:var(--ink-soft);display:grid;gap:10px;max-width:68ch}
details ul{margin:0;padding-left:1.2em;display:grid;gap:4px}

/* Final CTA + footer */
.final{background:var(--ink);color:var(--paper)}
.final .wrap{display:grid;grid-template-columns:auto 1fr;gap:40px;align-items:center}
.final img{width:230px}
.final h2{font-size:clamp(2.2rem,5vw,3.6rem);font-weight:800}
.final p{color:color-mix(in srgb,var(--paper) 78%,transparent);margin-top:12px;font-size:1.1rem;max-width:34em}
.final .btn-main{border-color:var(--paper);box-shadow:3px 3px 0 var(--lime)}
.final .btn-ghost{border-color:var(--paper);color:var(--paper)}
.final .btn-ghost:hover{background:color-mix(in srgb,var(--paper) 10%,transparent)}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.contact-lines{margin-top:22px;display:flex;flex-wrap:wrap;gap:6px 26px;font-weight:600}
.contact-lines a{text-decoration:none}
@media (max-width:760px){.final .wrap{grid-template-columns:1fr}.final img{width:150px}}
footer{padding-block:34px;font-size:.92rem;color:var(--ink-soft)}
footer a{text-decoration:none}
footer a:hover{color:var(--ink)}
/* Pie de página con menú detallado */
.site-foot{background:var(--paper-2);border-top:1px solid var(--line);padding-block:56px 26px}
.ft-grid{display:grid;grid-template-columns:1.25fr 1fr 1fr 1fr 1.15fr;gap:34px 26px}
.ft-col .nw{white-space:nowrap}
.ft-brand{display:grid;gap:12px;align-content:start;max-width:320px}
.ft-brand .brand img{height:48px;width:auto}
.ft-brand p{color:var(--ink-soft);line-height:1.55}
.ft-brand .ft-slogan{font-family:var(--display);font-weight:800;font-size:1.25rem;color:var(--ink);letter-spacing:-.01em}
.ft-brand .btn{justify-self:start;margin-top:4px}
.ft-col{display:grid;gap:9px;align-content:start}
.ft-col h2{font-family:var(--body);font-size:.75rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--lime-text);margin-bottom:4px}
.ft-col a,.ft-col span{color:var(--ink);font-weight:500;line-height:1.35}
.ft-col a:hover{color:var(--lime-text);text-decoration:underline;text-underline-offset:3px}
.ft-col span{color:var(--ink-soft)}
.ft-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:44px;padding-top:20px;border-top:1px solid var(--line);font-size:.86rem}
.ft-bottom a{color:var(--ink);font-weight:600}
@media (max-width:1000px){.ft-grid{grid-template-columns:repeat(2,1fr)}.ft-brand{grid-column:1 / -1;max-width:none}}
@media (max-width:520px){.ft-grid{grid-template-columns:1fr 1fr;gap:28px 18px}.site-foot{padding-block:44px 22px}}

/* Price card (shared by both pages) */
.price-tag{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.price-tag .now{font-family:var(--display);font-weight:800;font-size:2.2rem;line-height:1;font-variant-numeric:tabular-nums}
.price-tag .was{color:var(--ink-soft);text-decoration:line-through;font-size:.95rem;font-variant-numeric:tabular-nums}

@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

/* ===== Estilo "Selva de verdes con hojas" ===== */
:root{--paper-2:#e2f2d0;--mint:#cde8b2;--line:#bcdca0}
.hero{background:radial-gradient(circle at 85% 30%,#d9f0c2 0,transparent 38%),radial-gradient(circle at 10% 90%,#eaf6dc 0,transparent 35%)}
#plan{background:#e6f4d7}
#precios{background:#d4ecbc}
#test-de-nivel{background:#e3f3d2}
#agenda{background:#d8eec3}
#por-que{background:#e6f4d7}
#aula{background:#d4ecbc}
#opiniones{background:#e3f3d2}
#programas{background:#2f6b3c;color:#fff}
#programas .sec-head h2,#programas .sec-head p{color:#fff}
#programas .eyebrow{color:#c8ee9a}
#programas .ptab{background:#fff;color:#1c2445}
#programas .ptab[aria-selected="true"]{background:#8acb3c}
#programas .catalog-link a,#programas > .wrap > .cta-row .btn-ghost{background:#fff}
.band,#programas{position:relative}
.pack,.reason,.quote{border-color:#2f6b3c;box-shadow:4px 4px 0 #8acb3c}
.sec-head .eyebrow{display:inline-block;justify-self:start;background:#2f6b3c;color:#e8f7d4;border-radius:999px;padding:.35em .9em}
#programas .sec-head .eyebrow{background:#8acb3c;color:#16203d}
.band,#programas{position:relative}
.band,#programas{clip-path:inset(0)}
.band::after,#programas::after{content:"";position:absolute;right:-30px;top:-20px;width:230px;height:230px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cg fill='%232f6b3c'%3E%3Cpath d='M30 170C20 100 60 40 150 25c5 80-40 135-120 145z'/%3E%3Cpath d='M95 190c10-55 45-90 95-100-5 55-40 90-95 100z' opacity='.7'/%3E%3C/g%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.35' stroke-width='3'%3E%3Cpath d='M38 160C70 110 100 70 145 33'/%3E%3Cpath d='M102 182c20-30 45-55 82-85'/%3E%3C/g%3E%3C/svg%3E") no-repeat center/contain;opacity:.13;pointer-events:none;transform:rotate(12deg)}
.band::before,#programas::before{content:"";position:absolute;left:-40px;bottom:-30px;width:190px;height:190px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cg fill='%232f6b3c'%3E%3Cpath d='M30 170C20 100 60 40 150 25c5 80-40 135-120 145z'/%3E%3Cpath d='M95 190c10-55 45-90 95-100-5 55-40 90-95 100z' opacity='.7'/%3E%3C/g%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.35' stroke-width='3'%3E%3Cpath d='M38 160C70 110 100 70 145 33'/%3E%3Cpath d='M102 182c20-30 45-55 82-85'/%3E%3C/g%3E%3C/svg%3E") no-repeat center/contain;opacity:.10;pointer-events:none;transform:rotate(200deg)}
#programas::after,#programas::before{opacity:.22;filter:brightness(1.8)}
.band > .wrap,#programas > .wrap{position:relative;z-index:1}
#programas .ppanel{--ink:#ffffff;--ink-soft:#dcebdf;--lime-text:#c8ee9a;--line:rgba(255,255,255,.35)}
#programas .ppanel .btn-main{--ink:#16203d;border-color:#16203d}

/* Evita scroll horizontal por las hojas decorativas (clip no rompe el plan fijo) */
html,body{overflow-x:clip}

/* Menú para celular y tablet (botón ☰) */
.mnav-btn{display:none;width:42px;height:42px;flex:none;align-items:center;justify-content:center;border:1.5px solid var(--line);border-radius:999px;background:var(--card);color:var(--ink);cursor:pointer;padding:0}
.mnav-btn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.mnav-btn svg path{transition:transform .2s ease,opacity .2s ease;transform-origin:12px 12px}
.mnav-btn[aria-expanded="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.mnav-btn[aria-expanded="true"] .l1{transform:translateY(5px) rotate(45deg)}
.mnav-btn[aria-expanded="true"] .l2{opacity:0}
.mnav-btn[aria-expanded="true"] .l3{transform:translateY(-5px) rotate(-45deg)}
.mnav{position:absolute;left:0;right:0;top:100%;background:var(--card);border-bottom:2px solid var(--ink);box-shadow:0 12px 24px rgba(0,0,0,.12);max-height:calc(100dvh - 70px);overflow-y:auto;padding:10px 16px 18px}
.mnav nav{display:grid;gap:2px;max-width:640px;margin:0 auto}
.mnav-link,.mnav-dd > summary{display:flex;align-items:center;justify-content:space-between;font-weight:700;font-size:1.05rem;color:var(--ink);text-decoration:none;padding:.8em .7em;border-radius:12px}
.mnav-link:hover,.mnav-dd > summary:hover{background:var(--paper-2)}
.mnav-link[aria-current="page"]{background:var(--mint)}
.mnav-dd{border:0!important}
.mnav-dd > summary{font-family:inherit}
.mnav-sub{display:grid;gap:4px;padding:0 0 8px}
.mnav-sub .dd-group{border-left:0;padding:8px 6px 4px}
.mnav-sub .dd-foot{border-radius:12px}
@media (max-width:1160px){.mnav-btn{display:inline-flex}}
@media (max-width:420px){.mnav-btn{width:38px;height:38px}}