/* ============================================================
   CALIDO-SHELL — header (pastilla flotante) y footer compacto del sitio (7-oct-2026)
   Lo carga partials/header.php en TODAS las páginas que usan el header compartido.
   No depende de ninguna otra hoja. El tema de página (marfil, paneles) vive en tema-calido.css.
   ============================================================ */
:root{ --nav-h:clamp(68px,9svh,88px); --gut:clamp(16px,5vw,96px); }

/* ===================== HEADER CÁLIDO ===================== */
.ch{position:fixed;top:14px;left:50%;transform:translate3d(-50%,0,0);z-index:80;width:min(1320px,calc(100% - 20px));height:calc(var(--nav-h,76px) - 14px);
  display:flex;align-items:center;gap:8px;padding:6px 10px 6px 12px;border-radius:999px;font-family:'Work Sans',-apple-system,'Segoe UI',Arial,sans-serif;
  background:rgba(253,251,247,.74);-webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%);
  border:1px solid rgba(150,110,70,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 10px 40px -14px rgba(120,80,40,.22);
  transition:transform .6s cubic-bezier(.16,1,.3,1)}
.ch.hide{transform:translate3d(-50%,-140%,0)}
.ch-brand{display:flex;align-items:center;gap:11px;margin-right:auto;min-width:0;text-decoration:none}
.ch-brand img{width:clamp(32px,4.4svh,40px);height:clamp(32px,4.4svh,40px);object-fit:contain;flex:none}
.ch-bt{display:flex;flex-direction:column;line-height:1.12;min-width:0}
.ch-bt small{font-size:.58rem;letter-spacing:.24em;text-transform:uppercase;color:#b9776a}
.ch-bt b{font-family:'Fraunces',Georgia,serif;font-weight:500;font-size:clamp(.82rem,1.25vw,1rem);letter-spacing:-.005em;white-space:nowrap;color:#26304d}
.ch-links ul{display:flex;list-style:none;gap:2px;margin:0;padding:0}
.ch-links a{display:block;padding:8px 14px;border-radius:999px;font-size:.85rem;color:#5d6682;text-decoration:none;transition:color .3s,background .3s;white-space:nowrap}
.ch-links a:hover{color:#26304d;background:rgba(190,140,100,.1)}
.ch-links a.active{color:#26304d;background:rgba(190,140,100,.14);font-weight:500}
.ch-acceso{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:999px;font-size:.82rem;font-weight:600;color:#FBF3E4;text-decoration:none;white-space:nowrap;
  background:linear-gradient(135deg,#8A3643 0%,#7A2E3A 55%,#5E212C 100%);box-shadow:inset 0 0 0 1px rgba(233,220,195,.75),0 6px 16px -6px rgba(122,46,58,.5);transition:transform .3s}
.ch-acceso:hover{transform:translateY(-1px);color:#fff}
.ch-acceso svg{width:15px;height:15px;fill:#E9DCC3;flex:none}
.ch-lang{display:flex;gap:2px;padding:3px;border-radius:999px;background:rgba(190,140,100,.1);font-size:.72rem;letter-spacing:.08em}
.ch-lang a{padding:5px 10px;border-radius:999px;color:#8a8fa3;text-decoration:none}
.ch-lang a.on{background:#fff;color:#26304d;box-shadow:0 1px 4px rgba(120,80,40,.12)}
.ch-school{display:flex;align-items:center;gap:10px;margin-left:4px;padding:3px 14px 3px 3px;border-radius:999px;background:rgba(255,255,255,.7);border:1px solid rgba(150,110,70,.15);text-decoration:none;transition:border-color .4s,background .4s}
.ch-school:hover{background:#fff;border-color:rgba(185,119,106,.5)}
.ch-school img{width:clamp(34px,4.6svh,42px);height:clamp(34px,4.6svh,42px);border-radius:50%;object-fit:cover;background:#fff;box-shadow:0 0 0 1px rgba(150,110,70,.15);flex:none}
.ch-school span{font-size:.72rem;line-height:1.15;letter-spacing:.04em;color:#5d6682;white-space:nowrap}
.ch-school span em{display:block;font-style:normal;font-size:.58rem;letter-spacing:.22em;text-transform:uppercase;color:#b9776a}
.ch-burger{display:none;width:44px;height:44px;border-radius:50%;align-items:center;justify-content:center;background:rgba(190,140,100,.12);color:#26304d;border:0;cursor:pointer;flex:none}
.ch-burger .bars{display:grid;gap:4px;width:18px}
.ch-burger .bars i{display:block;height:2px;border-radius:2px;background:currentColor;transition:transform .3s var(--ease,cubic-bezier(.16,1,.3,1)),opacity .2s}
.ch-burger[aria-expanded=true] .bars i:nth-child(1){transform:translate3d(0,6px,0) rotate(45deg)}
.ch-burger[aria-expanded=true] .bars i:nth-child(2){opacity:0}
.ch-burger[aria-expanded=true] .bars i:nth-child(3){transform:translate3d(0,-6px,0) rotate(-45deg)}
.ch-menu{display:none}
@media(max-width:1180px){
  .ch{-webkit-backdrop-filter:none;backdrop-filter:none;background:rgba(253,251,247,.95)}
  .ch-links,.ch-lang,.ch-acceso{display:none}
  .ch-burger{display:flex}
}
@media(max-width:1400px) and (min-width:1181px){.ch-links a{padding:8px 10px;font-size:.82rem}.ch-bt b{font-size:.88rem}.ch-school span{display:none}.ch-school{padding:3px}}
@media(max-width:400px){.ch-bt small{display:none}.ch-bt b{font-size:.8rem;white-space:normal;max-width:9.5em}.ch-school{display:none}}

/* ===================== FOOTER COMPACTO ===================== */
.cf{position:relative;z-index:6;margin:0;padding:9px 0;font-family:'Work Sans',-apple-system,'Segoe UI',Arial,sans-serif;
  background:linear-gradient(90deg,rgba(238,190,180,.28),rgba(255,254,251,.9) 28%,rgba(255,254,251,.9) 72%,rgba(200,186,232,.26));
  border-top:1px solid rgba(150,110,70,.16)}
.cf-in{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 22px;max-width:1560px;margin:0 auto;padding:0 var(--gut,24px)}
.cf p,.cf li,.cf a{font-size:12.5px;line-height:1.35;margin:0;color:#5d6682}
.cf-c{text-align:left;font-size:12px !important;color:#8a8fa3 !important}
.cf-c .dot{margin:0 10px;opacity:.55}
.cf-c a{color:#9b5446;text-decoration:underline;text-underline-offset:3px}
.cf-l{list-style:none;display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:2px 16px;margin:0;padding:0}
.cf-l a{display:inline-flex;align-items:center;gap:6px;text-decoration:none;transition:color .3s}
.cf-l a:hover,.cf-c a:hover{color:#7d3f33}
.cf svg{width:1em;height:1em;stroke:#b9776a;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none;font-size:13px}
@media(max-width:900px){
  .cf{padding:5px 0 6px}
  .cf-in{grid-template-columns:1fr;justify-items:center;text-align:center;gap:2px}
  .cf-c{text-align:center}
  .cf-l{justify-content:center}
  .cf p,.cf li,.cf a{font-size:11px;line-height:1.25}
}

@media(prefers-reduced-motion:reduce){
  .ch,.ch-menu,.ch-burger .bars i{ transition:none !important; }
}


/* ── Enlace al colegio St Margaret's: pie del menú móvil y footer ── */
.ch-mschool{display:none}
@media(max-width:1180px){
  .ch-mschool{display:flex;align-items:center;gap:14px;margin:6px 14px 14px;padding:12px 14px;border-radius:20px;text-decoration:none;
    background:#fff;border:1px solid rgba(185,146,90,.3);box-shadow:0 8px 22px -14px rgba(94,33,44,.35);transition:transform .3s,border-color .3s}
  .ch-mschool:active{transform:scale(.98)}
  .ch-mschool img{width:44px;height:44px;border-radius:50%;object-fit:cover;flex:none;box-shadow:0 0 0 1px rgba(150,110,70,.18)}
  .ch-mschool span{display:flex;flex-direction:column;line-height:1.2;min-width:0}
  .ch-mschool b{font-family:'Fraunces',Georgia,serif;font-weight:500;font-size:1rem;color:#26304d}
  .ch-mschool em{font-style:normal;font-size:.76rem;color:#9b5446;margin-top:2px}
}
.cf-school img{width:20px;height:20px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1px rgba(150,110,70,.2)}
.cf-school{font-weight:500}
/* ============================================================
   MENÚ MÓVIL «PREMIUM» (7-oct-2026): hoja a pantalla completa que se abre como una
   mancha de tinta desde el botón, con los enlaces en Fraunces grande, numerados y
   entrando en cascada. Solo transform/opacity/clip-path. El <nav class="ch-menu"> va
   FUERA del <header> (el header tiene transform y atraparía el position:fixed).
   ============================================================ */
html.ch-lock{overflow:hidden}
@media(max-width:1180px){
  .ch-menu{display:flex;flex-direction:column;position:fixed;inset:0;z-index:79;overflow:hidden;
    padding:calc(var(--nav-h,76px) + 22px) clamp(22px,7vw,40px) calc(66px + env(safe-area-inset-bottom,0px));
    background:
      radial-gradient(70% 45% at 6% 2%, rgba(238,190,180,.62), transparent 70%),
      radial-gradient(60% 40% at 100% 24%, rgba(200,186,232,.5), transparent 70%),
      radial-gradient(70% 45% at 40% 100%, rgba(190,214,236,.55), transparent 70%),
      linear-gradient(180deg,#FDFBF7,#F7F4EE);
    visibility:hidden;pointer-events:none;opacity:0;
    clip-path:circle(0px at calc(100% - 42px) 40px);
    transition:clip-path .8s cubic-bezier(.76,0,.24,1) .32s,opacity 0s linear 1.12s,visibility 0s linear 1.12s}
  .ch-menu.open{visibility:visible;pointer-events:auto;opacity:1;clip-path:circle(150% at calc(100% - 42px) 40px);
    transition:clip-path .85s cubic-bezier(.76,0,.24,1),opacity .2s ease,visibility 0s}
  .ch-menu::before{content:'MENÚ';display:block;height:auto;margin:0 0 6px;border-radius:0;background:none;
    font:600 .68rem/1 'Work Sans',system-ui,sans-serif;letter-spacing:.34em;color:#b9776a}
  html[lang=en] .ch-menu::before{content:'MENU'}
  .ch-menu::after{content:'';position:absolute;left:clamp(22px,7vw,40px);right:clamp(22px,7vw,40px);top:calc(var(--nav-h,76px) + 38px);height:1px;background:linear-gradient(90deg,#C9A55C,rgba(201,165,92,0))}
  .ch-list{display:flex;flex-direction:column;margin-top:12px;counter-reset:chn;flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;scrollbar-width:none;padding:6px 0 18px;
    -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 12px,#000 calc(100% - 26px),transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 12px,#000 calc(100% - 26px),transparent 100%)}
  .ch-list::-webkit-scrollbar{display:none}
  .ch-list a{counter-increment:chn;display:flex;align-items:baseline;gap:16px;padding:clamp(8px,1.5svh,13px) 0;
    font-family:'Fraunces',Georgia,serif;font-weight:400;font-size:clamp(1.45rem,6.4vw,1.95rem);line-height:1.1;letter-spacing:-.015em;color:#26304d;text-decoration:none;
    border-bottom:1px solid rgba(150,110,70,.14);
    opacity:0;transform:translate3d(0,26px,0);transition:opacity .28s ease,transform .38s ease,color .25s}
  .ch-list a::before{content:counter(chn,decimal-leading-zero);order:0;position:static;width:auto;height:auto;border:0;transform:none;margin:0;
    font:600 .7rem/1 'Work Sans',system-ui,sans-serif;letter-spacing:.16em;color:#c9a55c;min-width:1.7em}
  .ch-list a::after{content:'';margin-left:auto;align-self:center;width:9px;height:9px;border-top:1.5px solid #b9776a;border-right:1.5px solid #b9776a;transform:translate3d(-6px,0,0) rotate(45deg);opacity:0;transition:transform .35s,opacity .35s}
  .ch-list a:hover,.ch-list a:active{color:#a2543a;background:none}
  .ch-list a:hover::after,.ch-list a:active::after{opacity:1;transform:translate3d(0,0,0) rotate(45deg)}
  .ch-list a.active{color:#a2543a;font-style:italic;font-weight:400;box-shadow:none;background:none;border-radius:0}
  .ch-list a.active::after{opacity:1;transform:translate3d(0,0,0) rotate(45deg)}
  .ch-list a.hl{background:none;color:#7A2E3A;font-weight:400;border-radius:0;margin:0;border-bottom:1px solid rgba(150,110,70,.14);justify-content:flex-start}
  .ch-list a.hl::before{margin-left:0}
  .ch-list .tg{margin-left:auto;align-self:center;font:700 .6rem/1 'Work Sans',system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;padding:6px 11px;border-radius:999px;background:#E9DCC3;color:#5E212C}
  .ch-list a.hl::after{display:none}
  .ch-menu.open .ch-list a{opacity:1;transform:translate3d(0,0,0)}
  .ch-menu.open .ch-list a:nth-child(1){transition-delay:.18s}
  .ch-menu.open .ch-list a:nth-child(2){transition-delay:.25s}
  .ch-menu.open .ch-list a:nth-child(3){transition-delay:.32s}
  .ch-menu.open .ch-list a:nth-child(4){transition-delay:.39s}
  .ch-menu.open .ch-list a:nth-child(5){transition-delay:.46s}
  .ch-menu.open .ch-list a:nth-child(6){transition-delay:.53s}
  .ch-menu.open .ch-list a:nth-child(n+7){transition-delay:.6s}

  .ch-mschool,.ch-foot{opacity:0;transform:translate3d(0,22px,0);transition:opacity .26s ease,transform .36s ease}
  .ch-menu.open .ch-mschool{opacity:1;transform:none;transition-delay:.7s}
  .ch-menu.open .ch-foot{opacity:1;transform:none;transition-delay:.78s}
  .ch-mschool{flex:none;margin:6px 0 0;background:rgba(255,255,255,.82)}
  .ch-foot{flex:none;position:static;margin-top:10px;padding:0;background:none}
  .ch-foot a{padding:17px 20px;font-size:1rem;letter-spacing:.01em}
  .ch-menu > :last-child{margin-bottom:0}
}
@media(prefers-reduced-motion:reduce){
  .ch-menu,.ch-list a,.ch-mschool,.ch-foot{transition:none !important}
}
@media(max-width:1180px){.ch-menu::-webkit-scrollbar{display:none}}
@media(max-width:1180px){
  .ch-foot a{display:flex;align-items:center;justify-content:center;gap:10px;color:#FBF3E4;text-decoration:none;font-weight:700;border-radius:999px;
    background:linear-gradient(135deg,#8A3643 0%,#7A2E3A 55%,#5E212C 100%);box-shadow:inset 0 0 0 1px rgba(233,220,195,.8),0 10px 24px -10px rgba(122,46,58,.55)}
  .ch-foot svg{width:18px;height:18px;fill:#E9DCC3;flex:none}
}

/* ── Selector ES/EN FIJO en la esquina inferior derecha, en todas las páginas y con el menú abierto (7-oct-2026) ── */
.ch-flang{position:fixed;right:max(16px,env(safe-area-inset-right,0px));bottom:max(16px,env(safe-area-inset-bottom,0px));z-index:81;display:flex;gap:2px;padding:4px;border-radius:999px;
  font-family:'Work Sans',-apple-system,'Segoe UI',Arial,sans-serif;font-size:.74rem;font-weight:600;letter-spacing:.12em;
  background:rgba(253,251,247,.88);-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);
  border:1px solid rgba(150,110,70,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 12px 30px -12px rgba(94,33,44,.35);view-transition-name:cpa-idioma}
.ch-flang a{display:block;padding:8px 14px;border-radius:999px;color:#5d6682;text-decoration:none;line-height:1;transition:background .25s,color .25s}
.ch-flang a:hover{color:#26304d}
.ch-flang a.on{background:#7A2E3A;color:#FBF3E4;box-shadow:0 6px 14px -8px rgba(122,46,58,.7)}
@media(max-width:1180px){ .ch-flang{font-size:.7rem} .ch-flang a{padding:9px 14px} }
/* Cierre = efecto inverso de la apertura: primero salen los elementos de abajo hacia arriba y después el círculo se encoge hacia el botón. */
@media(max-width:1180px){
  .ch-menu:not(.open) .ch-foot{transition-delay:0s}
  .ch-menu:not(.open) .ch-mschool{transition-delay:.04s}
  .ch-menu:not(.open) .ch-list a:nth-child(n+7){transition-delay:.06s}
  .ch-menu:not(.open) .ch-list a:nth-child(6){transition-delay:.08s}
  .ch-menu:not(.open) .ch-list a:nth-child(5){transition-delay:.11s}
  .ch-menu:not(.open) .ch-list a:nth-child(4){transition-delay:.14s}
  .ch-menu:not(.open) .ch-list a:nth-child(3){transition-delay:.17s}
  .ch-menu:not(.open) .ch-list a:nth-child(2){transition-delay:.2s}
  .ch-menu:not(.open) .ch-list a:nth-child(1){transition-delay:.23s}
}
