/* ============================================================
   Consentimiento de cookies.

   Sitio de Estados Unidos. Aqui no rige el opt-in previo del RGPD
   europeo, pero varios estados (California con CCPA y CPRA, y detras
   Virginia, Colorado, Connecticut y otros) exigen AVISO y una via
   clara para RECHAZAR la venta o el uso publicitario. Por eso el
   banner trae "Reject all" con el mismo peso visual que "Accept all":
   una negativa escondida detras de dos clics es justo lo que esas
   leyes persiguen.

   Lo que este archivo NO hace: decidir si al club le aplica alguna de
   esas leyes, ni redactar la politica. Eso lo confirma el club.
   ============================================================ */
.ck{position:fixed;left:0;right:0;bottom:0;z-index:92;
  background:var(--navy-deep);border-top:1px solid rgba(180,151,89,.4);
  transform:translateY(100%);transition:transform .42s cubic-bezier(.22,.61,.36,1);
  padding-bottom:env(safe-area-inset-bottom)}
.ck.on{transform:none}
.ck-in{max-width:var(--maxw);margin:0 auto;padding:calc(var(--u)*3) var(--margin);
  display:grid;grid-template-columns:1fr auto;gap:calc(var(--u)*3);align-items:center}
.ck-t b{display:block;font-family:var(--head);font-weight:500;text-transform:uppercase;
  font-size:14px;letter-spacing:var(--tr-s);color:#fff;margin-bottom:7px}
.ck-t p{font-size:14px;line-height:22px;color:var(--sky);max-width:62ch;margin:0}
.ck-t a{color:#fff}
.ck-b{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.ck-btn{font-family:var(--head);text-transform:uppercase;font-size:12.5px;
  letter-spacing:var(--tr-s);font-weight:500;cursor:pointer;border-radius:var(--r);
  padding:0 20px;min-height:46px;display:inline-flex;align-items:center;white-space:nowrap}
.ck-si{background:var(--gold);border:1px solid var(--gold);color:var(--navy-ink)}
.ck-si:hover{background:var(--gold-hi)}
/* el rechazo pesa lo mismo que la aceptacion: mismo tamano, mismo lugar */
.ck-no{background:none;border:1px solid rgba(153,202,234,.5);color:#fff}
.ck-no:hover{border-color:var(--sky);background:rgba(153,202,234,.1)}
.ck-mas{background:none;border:0;color:var(--sky);text-decoration:underline;
  text-underline-offset:3px;padding:13px 8px;min-height:46px;cursor:pointer;
  font:inherit}
.ck-mas:hover{color:#fff}
@media(max-width:820px){
  .ck-in{grid-template-columns:1fr;gap:calc(var(--u)*2.5);
    padding-left:16px;padding-right:16px}
  /* Rechazar y aceptar comparten fila: misma caja, mismo alto, uno al lado
     del otro. Apilados, el de arriba parece el principal aunque midan igual.
     Y "Choose" deja de ser un enlace subrayado para ser un boton con su
     borde: las tres salidas son tres cajas, no dos cajas y un enlace. */
  .ck-b{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:stretch}
  .ck-btn{justify-content:center;padding:0 12px}
  .ck-mas{grid-column:1/-1;border:1px solid rgba(153,202,234,.32);
    border-radius:var(--r);text-decoration:none;
    font-family:var(--head);text-transform:uppercase;font-size:12.5px;
    letter-spacing:var(--tr-s);font-weight:500;padding:0 12px;
    display:inline-flex;align-items:center;justify-content:center}
}

/* ---------------- panel de preferencias ---------------- */
.ck-sheet{position:fixed;inset:0;z-index:96;display:grid;place-items:center;
  background:rgba(0,20,42,.96);backdrop-filter:blur(14px);
  opacity:0;pointer-events:none;transition:opacity .28s var(--ease)}
.ck-sheet.on{opacity:1;pointer-events:auto}
.ck-box{width:min(680px,calc(100vw - 32px));max-height:min(760px,calc(100vh - 48px));
  background:var(--navy-deep);border:1px solid rgba(180,151,89,.32);border-radius:var(--r);
  display:flex;flex-direction:column;overflow:hidden;
  transform:translateY(12px);transition:transform .3s cubic-bezier(.22,.61,.36,1)}
.ck-sheet.on .ck-box{transform:none}
.ck-head{padding:calc(var(--u)*3) calc(var(--u)*3.5) calc(var(--u)*2);
  border-bottom:1px solid rgba(153,202,234,.16);display:flex;align-items:flex-start;gap:14px}
.ck-head h2{font-size:22px;color:#fff;margin:0}
.ck-head p{font-size:13.5px;line-height:21px;color:var(--sky);margin:8px 0 0;max-width:54ch}
.ck-x{margin-left:auto;background:none;border:0;color:var(--sky);cursor:pointer;
  font-size:22px;line-height:1;padding:13px;margin:-13px -13px 0 0;min-height:48px;min-width:48px}
.ck-x:hover{color:#fff}
.ck-body{overflow-y:auto;padding:calc(var(--u)*1) calc(var(--u)*3.5)}
.ck-cat{padding:calc(var(--u)*2.5) 0;border-bottom:1px solid rgba(153,202,234,.14);
  display:flex;gap:18px;align-items:flex-start}
.ck-cat:last-child{border-bottom:0}
.ck-cat .tx{flex:1;min-width:0}
.ck-cat b{display:block;font-family:var(--head);font-weight:500;text-transform:uppercase;
  font-size:13px;letter-spacing:var(--tr-s);color:#fff}
.ck-cat p{font-size:13.5px;line-height:21px;color:var(--sky);margin:7px 0 0}
.ck-cat .what{font-size:12px;color:rgba(153,202,234,.7);margin-top:7px;display:block;
  line-height:19px}   /* sin esto hereda el interlineado del cuerpo y a 12 px abre demasiado */
/* Interruptor. La caja de contacto mide 44 px de alto aunque el carril se
   vea de 30: medido, un interruptor de 30 px es un objetivo tactil que falla.
   El carril y la perilla se dibujan con pseudoelementos para no inflar el
   dibujo al agrandar la caja. */
.ck-sw{flex:0 0 auto;position:relative;width:52px;height:44px;border:0;padding:0;
  background:none;cursor:pointer;margin-top:-4px}
.ck-sw::before{content:"";position:absolute;left:0;top:7px;width:52px;height:30px;
  border-radius:30px;background:rgba(153,202,234,.2);
  transition:background .25s var(--ease)}
.ck-sw::after{content:"";position:absolute;top:10px;left:3px;width:24px;height:24px;
  border-radius:50%;background:#fff;z-index:1;
  transition:transform .25s cubic-bezier(.22,.61,.36,1)}
.ck-sw[aria-checked="true"]::before{background:var(--gold)}
.ck-sw[aria-checked="true"]::after{transform:translateX(22px)}
.ck-sw[disabled]{cursor:not-allowed}
.ck-sw[disabled]::before{background:var(--gold);opacity:.55}
.ck-sw[disabled]::after{opacity:.75}
.ck-sw:focus-visible{outline:2px solid var(--sky);outline-offset:0;border-radius:30px}
.ck-foot{border-top:1px solid rgba(153,202,234,.16);
  padding:calc(var(--u)*2.5) calc(var(--u)*3.5) calc(var(--u)*3);
  display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.ck-foot .ck-btn{flex:0 0 auto}
.ck-note{font-size:12px;color:rgba(153,202,234,.75);line-height:19px;
  width:100%;margin:0}
.ck-note a{color:var(--sky);text-underline-offset:3px}
.ck-note a:hover{color:#fff}
.ck-gpc{display:flex;gap:9px;align-items:flex-start;font-size:12.5px;line-height:20px;
  color:var(--sky);background:rgba(153,202,234,.08);
  border-left:0;padding:12px 14px;margin:calc(var(--u)*2) 0 0}
.ck-gpc i{font-style:normal;color:var(--gold)}
@media(max-width:560px){
  .ck-box{width:100vw;max-height:100dvh;height:100dvh;border:0;border-radius:0}
  .ck-head,.ck-body,.ck-foot{padding-left:18px;padding-right:18px}
  .ck-foot{padding-bottom:calc(var(--u)*3 + env(safe-area-inset-bottom))}
  .ck-foot .ck-btn{flex:1 1 100%;justify-content:center}
}
@media(prefers-reduced-motion:reduce){
  .ck,.ck-sheet,.ck-box,.ck-sw::before,.ck-sw::after{transition:none}
}