/* Footer — Camping El Carlitos
   Autónomo: no depende del resto de tu CSS. Prefijo .ft
   Colocar en: assets/css/footer-carlitos.css                */

.ft{--ft-azul:#002e64;--ft-azul-hondo:#001c40;--ft-naranja:#ec7e28;
  --ft-texto:rgba(255,255,255,.88);--ft-suave:rgba(255,255,255,.62);
  --ft-linea:rgba(255,255,255,.22);--ft-borde:rgba(255,255,255,.38);
  font-family:'PT Sans',Arial,sans-serif;position:relative;margin-top:130px}
/* el hueco de arriba no se queda transparente: lo pintamos del mismo claro
   que usan las secciones de contenido, para que se lea como su propio
   remate y no como una franja aparte */
.ft::before{content:"";position:absolute;left:0;right:0;top:-130px;height:130px;
  background:var(--cream,#fbf8f2);z-index:-1}
/* si la última sección de la página es la arena (.section--sand), el hueco
   se pinta de ese mismo tono en vez del crema general, para que no se note
   la costura entre la sección y el pie */
body:has(section.section--sand:last-of-type) .ft::before{background:var(--wood-brown,#f3ece0)}
.ft *{box-sizing:border-box}
.ft a{text-decoration:none}

/* ---------- fila principal ---------- */
/* 1fr auto 1fr: el nav queda centrado en la fila aunque el logo de la
   izquierda y las acciones de la derecha no midan lo mismo */
.ft__fila{background:var(--ft-azul);
  padding:23.4px 72.8px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:36.4px}
.ft__brand{display:flex;align-items:center;justify-self:start}
.ft__brand img{height:88.4px;width:auto;display:block}
.ft__acciones{display:flex;align-items:center;gap:20.8px;justify-self:end}

.ft__nav{display:flex;justify-content:center;gap:33.8px;font-size:19.5px;font-weight:600}
.ft__nav a{color:var(--ft-texto);transition:color .18s ease}
.ft__nav a:hover{color:var(--ft-naranja)}

/* ---------- redes: iconos con el color de cada marca ---------- */
/* el disco se queda blanco: es lo que deja ver el degradado de Instagram
   y el azul de Facebook, que sobre el azul del pie se perderían */
.ft__social{display:flex;gap:13px}
.ft__social a{width:44.2px;height:44.2px;border:2.6px solid var(--ft-borde);border-radius:50%;
  display:grid;place-items:center;background:#fff;
  transition:border-color .18s ease,transform .18s ease}
.ft__social a:hover{border-color:var(--ft-naranja);transform:translateY(-2.6px)}
.ft__social svg{width:22.1px;height:22.1px}
.ft__social--fb svg{fill:#1877f2}

.ft__book{height:59.8px;padding:0 33.8px;border-radius:7.8px;background:var(--ft-naranja);color:var(--ft-azul);
  display:flex;align-items:center;font-family:'PT Sans',Arial,sans-serif;font-weight:700;font-size:20.8px;
  transition:background .18s ease,color .18s ease}
/* sobre el pie azul el hover no puede ser azul: se volvería invisible */
.ft__book:hover{background:#fff;color:var(--ft-azul)}

/* ---------- fila legal ---------- */
.ft__legal{background:var(--ft-azul-hondo);border-top:2.6px dashed var(--ft-linea);
  padding:26px 72.8px;display:flex;flex-direction:column;gap:13px}
.ft__legal-links{display:flex;flex-wrap:wrap;gap:10.4px 23.4px;align-items:center;justify-content:center;
  text-align:center;font-size:18.2px;color:var(--ft-texto)}
.ft__legal-links a{color:var(--ft-texto);transition:color .18s ease}
.ft__legal-links a:hover{color:var(--ft-naranja);text-decoration:underline}
.ft__legal-links i{color:var(--ft-borde);font-style:normal}
/* 1fr auto 1fr mantiene el copyright centrado aunque los idiomas ocupen a la derecha */
.ft__meta{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:23.4px;
  font-size:16.9px;color:var(--ft-suave)}
.ft__copy{text-align:center}
.ft__langs{text-align:right;white-space:nowrap}
.ft__langs a{color:var(--ft-suave);transition:color .18s ease}
.ft__langs a:hover{color:var(--ft-naranja)}
.ft__langs a.is-active{color:var(--ft-naranja);font-weight:700}

@media (max-width:1150px){
  .ft__nav{gap:26px;font-size:18.2px}
  .ft__fila{gap:26px;padding:23.4px 41.6px}
}
@media (max-width:900px){
  .ft__fila{padding:31.2px;gap:23.4px;display:flex;flex-wrap:wrap;justify-content:center}
  .ft__brand,.ft__acciones{justify-self:auto}
  .ft__legal{padding:26px 31.2px}
  .ft__meta{grid-template-columns:1fr;gap:10.4px}
  .ft__copy,.ft__langs{text-align:center}
}
@media (max-width:520px){
  .ft__nav{gap:15.68px;font-size:15.68px;flex-wrap:wrap;justify-content:center}
  .ft__brand img{height:64.96px}
  .ft__legal-links{gap:6.72px 13.44px;font-size:14.56px}
  .ft__legal-links i{display:none}
}
@media (prefers-reduced-motion:reduce){
  .ft__social a,.ft__book,.ft__nav a{transition:none}
}

/* Aviso de cookies y mapa con permiso */
.ck-aviso{position:fixed;left:16px;right:16px;bottom:16px;z-index:70;max-width:760px;margin:0 auto;padding:20px 24px;background:#fff;color:#23302f;border-radius:16px;box-shadow:0 12px 40px rgba(0,28,64,.3);font-family:'PT Sans',Arial,sans-serif;font-size:16px;line-height:1.45;max-height:calc(100vh - 32px);overflow-y:auto}
.ck-aviso__txt{margin:0 0 14px}
.ck-aviso a{color:#002e64;font-weight:700}
.ck-panel{margin:0 0 14px;padding:12px 0;border-top:1px solid #e7dfcd;border-bottom:1px solid #e7dfcd}
.ck-panel[hidden]{display:none}
.ck-fila{display:block;padding:6px 0}
.ck-fila strong,.ck-fila span{display:block}
.ck-fila span{color:#5c6968;font-size:15px}
.ck-fila--op{position:relative;padding-left:30px;cursor:pointer}
.ck-fila--op input{position:absolute;left:0;top:9px;width:18px;height:18px;margin:0}
.ck-acciones{display:flex;flex-wrap:wrap;gap:10px}
.ck-btn{min-height:44px;padding:10px 22px;border-radius:12px;border:2px solid #002e64;font:700 16px 'PT Sans',Arial,sans-serif;cursor:pointer}
.ck-btn--si{background:#002e64;color:#fff}
.ck-btn--no{background:#fff;color:#002e64}
.ck-mapa{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;height:100%;min-height:494px;box-sizing:border-box;padding:24px;text-align:center;background:#f3ece0;font-family:'PT Sans',Arial,sans-serif}
.ck-mapa p{margin:0}