/* ========== Base & Layout ========== */
body{font-family:system-ui,Arial;margin:0}
.container{max-width:1100px;margin:auto;padding:1.25rem}
.site-header,.site-footer{padding:1rem;margin-top:1rem;border-bottom:1px solid #eee;display:flex;gap:1rem;align-items:center;justify-content:space-between}
.main-nav {
  display: flex;
  gap: 1.2rem;
  align-items: center;
}

.main-nav a {
  text-decoration: none;
  font-weight: 600;
  color: #333;
  padding: 0.4rem 0;
  position: relative;
  transition: color 0.2s ease;
}

.main-nav a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -3px;
  width: 0%;
  height: 2px;
  background-color: #ffd900; /* Groc del teu logo */
  transition: width 0.3s ease;
}

.main-nav a:hover {
  color: #000;
}

.main-nav a:hover::after {
  width: 100%;
}

.main-nav a.active {
  color: #000;
}

.main-nav a.active::after {
  width: 100%;
}
.lang-switcher {
  display: flex;
  gap: 0.5rem;
  align-items: center;
}

.lang-switcher a {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.35rem 0.75rem;
  border: 1px solid #e5e5e5;
  border-radius: 999px;
  text-decoration: none;
  font-size: 0.9rem;
  font-weight: 600;
  color: #333;
  background: #fff;
  box-shadow: 0 2px 6px rgba(0,0,0,0.05);
  transition: all 0.2s ease;
}

.lang-switcher a:hover {
  background: #f8f8f8;
  border-color: #ccc;
  transform: translateY(-1px);
}

.lang-switcher .lang-flag {
  font-size: 1rem;
  line-height: 1;
}

/* ========== Utils ========== */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.5rem}
.grid.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:900px){.grid.grid-3{grid-template-columns:1fr}}

.btn-primary,.btn-secondary{display:inline-block;padding:.75rem 1.5rem;border-radius:6px;text-decoration:none;font-weight:700}
.btn-primary{background:#000;color:#fff;}
.btn-secondary{background:#fff;border:2px solid #000;color:#000}

/* ========== Hero Home ========== */
.hero{background:#fff;text-align:center;padding:4rem 1rem}
.hero h1{font-size:2.5rem;margin-bottom:.5rem}
.hero p{font-size:1.2rem;color:#666;margin-bottom:2rem}
.hero.-white {
  background: url('/img/hero-lanzarote.webp') center/cover no-repeat;
  position: relative;
  color: white;
}
.hero.-white::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 48, 102, 0.35); /* blau transparent */
}
.hero.-white .hero-text {
  position: relative;
  z-index: 2;
}

.hero.-white .hero-text h1{font-size:2.7rem;margin:0 0 .5rem}
.hero.-white .hero-text p{font-size:1.15rem;color:#666;margin:0 0 1.5rem}
.quick-contact {
  display: flex;
  gap: 1.2rem;
  justify-content: center;
  margin-top: 1rem;
}

.quick-contact a {
  color: #fff !important;
  text-decoration: none;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: .5rem; /* espai entre icona i text */
  font-size: 1rem;
}

.quick-contact a i {
  font-size: 1.1rem;
}

.quick-contact a:hover {
  color: #FFD700 !important; /* groc del logo */
}

.hero-glass {
  background: rgba(0, 0, 0, .35); /* fons més fosc per millor llegibilitat */
  border: 1px solid rgba(255, 255, 255, .2);
  padding: 1.25rem 1.4rem;
  border-radius: 12px;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  box-shadow: 0 6px 24px rgba(0, 0, 0, .25);
  display: inline-block;
}

/* Texts dins del hero */
.hero-glass h1,
.hero-glass p,
.hero-glass a {
  color: #fff !important; /* blanc pur per llegir sobre fons fosc */
}

/* Botons */
.hero-glass .btn-primary {
  background: #000; /* groc inspirat en el logo */
  color: #fff;
  border: none;
}
.hero-glass .btn-primary:hover {
  background: #e6c200;
}

/* Icones de contacte */
.quick-contact a {
  color: #fff !important;
}
.quick-contact a:hover {
  color: #FFD700 !important;
}

@media (max-width: 640px){
  .hero-glass{ padding: .9rem 1rem; }
}

/* ========== Home: seccions ========== */
.home-intro{max-width:900px;margin:1.2rem auto 0}
.property-grid.container{margin-top:1rem}
.props-head{display:block;margin-bottom:1.5rem}
.props-head h2{margin:.2rem 0}
.props-intro{color:#666;margin:.2rem 0 1rem}
/* Important: .property-grid actua com contenidor, no defineix grid per no xocar amb .grid.grid-3 */
.property-grid{display:block;background:#fff}

/* ========== Trust band & about/contact snippets ========== */
.trust-band {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1rem;
  padding: 1.5rem;
  background: #fffaf0; /* càlid */
  border-radius: 12px;
  border: 1px solid #f1e3b0;
  box-shadow: 0 6px 24px rgba(0,0,0,.04);
}

.trust-band .band-item {
  display: flex;
  flex-direction: column; /* icona sobre el text */
  align-items: center;
  justify-content: center; /* centrament vertical */
  text-align: center;
  gap: .6rem;
  padding: 1rem;
  background: white;
  border-radius: 10px;
  font-weight: 600;
  color: #333;
  border: 1px solid #f3e2a9;
  box-shadow: 0 3px 10px rgba(0,0,0,.03);
  transition: transform .2s, box-shadow .2s;
  min-height: 130px;
}

.trust-band .band-item:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
  background: #fff8e6;
}

.trust-band .band-item i {
  color: #d4af37;
  font-size: 1.8rem;
  flex-shrink: 0;
}

/* About snippet en home */
.about-snippet {
  background: #fff;
  padding: 3rem 1rem;
  text-align: center;
  border-radius: 12px;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.04);
  border: 1px solid #eee;
  margin-top: 3rem;
}

/* Título */
.about-snippet h2 {
  font-size: 2rem;
  margin: 0 0 1rem;
  color: #0f0f10;
  font-weight: 700;
  position: relative;
}

/* Línea decorativa dorada debajo del título */
.about-snippet h2::after {
  content: "";
  display: block;
  width: 60px;
  height: 3px;
  background: #d4af37;
  margin: 0.6rem auto 0;
  border-radius: 2px;
}

/* Texto */
.about-snippet p {
  max-width: 720px;
  margin: 0 auto 1.5rem;
  font-size: 1.1rem;
  line-height: 1.6;
  color: #555;
}

/* CTA secundaria */
.about-snippet .btn-secondary {
  background: transparent;
  border: 2px solid #d4af37;
  color: #d4af37;
  padding: 0.7rem 1.5rem;
  font-weight: 700;
  border-radius: 999px;
  transition: all 0.25s ease;
}

.about-snippet .btn-secondary:hover {
  background: #d4af37;
  color: #fff;
}

@media (max-width: 640px) {
  .about-snippet {
    padding: 2rem 1rem;
  }
  .about-snippet h2 {
    font-size: 1.6rem;
  }
  .about-snippet p {
    font-size: 1rem;
  }
}

/* ========== Targetes (llistat/home) ========== */
.card{border:1px solid #eee;border-radius:8px;overflow:hidden;background:#fff}
.card img{width:100%;aspect-ratio:4/3;object-fit:cover}
/* Targeta premium usada a llistat i home */
.card.-prop{border:1px solid #eee;border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 10px 28px rgba(0,0,0,.06);transition:transform .18s}
.card.-prop:hover{transform:translateY(-4px)}
.card__link{text-decoration:none;color:inherit;display:block}
.card__media{position:relative}
.card__media img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.price-badge{position:absolute;left:.75rem;bottom:.75rem;background:#000;color:#fff;padding:.35rem .6rem;border-radius:999px;font-weight:700}
.featured-badge{position:absolute;right:.75rem;top:.75rem;background:#ffd900;color:#000;padding:.35rem .6rem;border-radius:999px;font-weight:800;display:inline-flex;gap:.35rem;align-items:center}
.card__body{padding:1rem}
.card__title{margin:.1rem 0 .3rem;font-size:1.15rem}
.card__meta{margin:0 0 .5rem;color:#666;display:flex;flex-wrap:wrap;gap:.45rem}
.card__meta i{opacity:.9}
.card__desc{margin:0 0 .6rem;color:#555}
.mini-amenities{display:flex;flex-wrap:wrap;gap:.35rem;list-style:none;padding:0;margin:0}
.mini-amenities li{display:inline-flex;align-items:center;gap:.35rem;background:#fafafa;border:1px solid #eee;border-radius:999px;padding:.25rem .55rem;font-size:.92rem}
/* Botó inline per targeta (evita col·lisions amb .btn-ghost antics) */
.btn-inline{display:inline-block;margin-top:.7rem;border:1px solid #000;padding:.5rem .9rem;border-radius:999px;font-weight:700;background:transparent}
.btn-inline:hover{background:#000;color:#fff}
/* Reset per si hi ha .btn-ghost heretat a targetes */
.card.-prop .btn-ghost{position:static;display:inline-block;margin-top:.7rem;border:1px solid #000;padding:.5rem .9rem;border-radius:999px;font-weight:700}

/* (Legacy) targetes antigues de la primera home – segur si encara en tens */
.property-card{position:relative;overflow:hidden;border-radius:12px;background:#fff;box-shadow:0 8px 30px rgba(0,0,0,.06);transition:transform .2s}
.property-card:hover{transform:translateY(-6px)}
.property-card img{width:100%;aspect-ratio:4/3;object-fit:cover}
.property-card .property-info{padding:1rem 1rem 1.2rem}
.property-card h2{margin:0 0 .2rem;font-size:1.35rem}
.property-card p{margin:0;color:#888}
.bullets{list-style:none;padding:0;margin:.6rem 0 0;color:#555}
.bullets li{margin:.25rem 0}
.rating{display:inline-block;margin-top:.6rem;font-weight:700;background:#f2f2f2;padding:.25rem .5rem;border-radius:6px}
.rating.-gold{background:#fff7e0}
.pill{display:inline-flex;align-items:center;gap:.4rem;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(4px);padding:.35rem .6rem;border-radius:999px;font-weight:600}

/* ========== Galeries (llistat/fixa) ========== */
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.5rem}
.gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:4px}
.gallery.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px;background:#fff}
.gallery.grid a{display:block;border-radius:10px;overflow:hidden;border:1px solid #f0f0f0;box-shadow:0 6px 24px rgba(0,0,0,.04)}
.gallery.grid img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;background:#fff}

/* ========== Fitxa propietat (single) ========== */
.prop-hero{position:relative;background:#fff;min-height:46vh;display:flex;align-items:end;background-size:cover;background-position:center}
.prop-hero__overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.0) 0%,rgba(0,0,0,.25) 70%,rgba(0,0,0,.45) 100%)}
.prop-hero__inner{position:relative;padding:2.5rem 1rem;width:100%}
.prop-hero__text{color:#fff;max-width:860px}
.prop-hero__text h1{margin:0 0 .5rem;font-size:clamp(1.8rem,3.2vw,3rem);line-height:1.05}
.prop-hero__meta{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 1rem}
.pill.-price{background:#fff;color:#000;border-color:#fff}
.prop-layout{margin-top:2rem}
.prop-two-col{display:grid;grid-template-columns:2fr 1fr;gap:2rem}
@media (max-width:960px){.prop-two-col{grid-template-columns:1fr}}
.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.75rem;margin:1.25rem 0 2rem}
.feature{background:#fff;border:1px solid #eee;border-radius:10px;padding:.9rem;display:flex;align-items:center;gap:.6rem;box-shadow:0 8px 24px rgba(0,0,0,.04)}
.feature i{font-size:1.1rem}
.amenitats h3{margin:1.5rem 0 .5rem}
.amenity-chips{display:flex;flex-wrap:wrap;gap:.5rem;padding:0;margin:0;list-style:none}
.amenity-chips li{display:inline-flex;align-items:center;gap:.4rem;border:1px solid #eee;background:#fff;border-radius:999px;padding:.4rem .7rem;font-size:.95rem}
.map-wrap{margin:1.5rem 0;border-radius:12px;overflow:hidden;border:1px solid #eee;box-shadow:0 8px 24px rgba(0,0,0,.04)}
.map-wrap iframe{width:100%;height:360px;border:0}
.reserva-card{position:sticky;top:1.25rem;align-self:start;border:1px solid #eee;border-radius:14px;padding:1rem;background:#fff;box-shadow:0 12px 32px rgba(0,0,0,.06)}
.reserva-card__price{display:flex;justify-content:space-between;align-items:end;margin-bottom:.75rem}
.reserva-card__price .from{color:#777;font-weight:700}
.reserva-card__price .amount{font-size:1.6rem;font-weight:800}
.reserva-card__price .amount span{font-size:.9rem;font-weight:600;margin-left:.25rem;color:#777}
.reserva-card form label{display:block;font-size:.95rem;margin:.4rem 0}
.reserva-card input,.reserva-card textarea{width:100%;padding:.65rem;border:1px solid #e4e4e4;border-radius:8px}
.reserva-card .row-2{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
@media (max-width:640px){.reserva-card .row-2{grid-template-columns:1fr}}
.btn-full{width:100%;margin-top:.6rem}
.contact-inline{display:flex;gap:.75rem;flex-wrap:wrap;justify-content:center;margin-top:.6rem}
.contact-inline a{text-decoration:none;color:#000;opacity:.85}
.contact-inline a:hover{opacity:1}

/* ========== Llistat de propietats (filtres) ========== */
.prop-list .filters{display:grid;grid-template-columns:1fr 260px;gap:.6rem;align-items:start}
@media (max-width:980px){.prop-list .filters{grid-template-columns:1fr}}
#q{max-width:300px;width:100%}
.prop-list .filters input,.prop-list .filters select{width:100%;padding:.7rem .8rem;border:1px solid #e6e6e6;border-radius:8px;line-height:1.2}
.prop-list .grid{margin-top:1.5rem}

/* Amenitats (filtres) */
.amenities-filter{grid-column:1/-1;border:1px solid #e6e6e6;border-radius:10px;background:#fff;overflow:hidden}
.amenities-filter summary{list-style:none;cursor:pointer;padding:.6rem .8rem;font-weight:700;display:flex;align-items:center;gap:.5rem}
.amenities-filter summary::-webkit-details-marker{display:none}
.amenities-filter[open] summary{border-bottom:1px solid #eee}
.amenities-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:.35rem .9rem;padding:.7rem .9rem 1rem;text-align:left}
.amenities-grid label{display:grid;grid-template-columns:20px 1fr;align-items:center;gap:.45rem;white-space:normal}
.amenities-grid input[type="checkbox"]{margin:0;justify-self:start;accent-color:#000}

.site-logo img {
  height: 96px;
  width: auto;
  display: block;
  filter: drop-shadow(0 0 4px rgba(212, 175, 55, 0.4));
}

.site-header {
  border-bottom: 3px solid #d4af37; /* dorado */
}

/* Footer elegante */
.site-footer{
  background:#0f0f10;
  color:#f7f7f7;
  border-top:3px solid #d4af37; /* dorado */
  padding:1.5rem 1rem;
}

/* Layout: dos líneas en desktop, columna en móvil */
.site-footer{
  display:flex;
  gap:1rem 2rem;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
}

/* Tipografía y enlaces */
.site-footer p{
  margin:0;
  line-height:1.4;
  opacity:.92;
}
.site-footer a{
  color:#d4af37;
  text-decoration:none;
  border-bottom:1px dashed transparent;
}
.site-footer a:hover{
  border-bottom-color:currentColor;
}

/* Ajustes responsive */
@media (max-width: 780px){
  .site-footer{
    flex-direction:column;
    text-align:center;
    gap:.4rem;
  }
}
/* Hero full-bleed dentro de <main class="container"> */
.about-hero{
  position:relative;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background:#0b1a2a center/cover no-repeat;
  min-height: 42vh;
  display:flex; align-items:flex-end;
}
.about-hero__overlay{position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.15) 0, rgba(0,0,0,.55) 100%)}
.about-hero__inner{position:relative; color:#fff; padding:3rem 1rem; width:100%; max-width:1100px; margin:0 auto}
.about-hero h1{margin:0 0 .4rem; font-size:clamp(1.9rem,3.2vw,2.6rem)}
.about-hero .lead{margin:0; opacity:.95; max-width:820px}

/* Mosaico opcional */
.about-mosaic{max-width:1100px; margin:1.2rem auto 0; padding:0 1.25rem}
.mosaic{
  display:grid; grid-template-columns:repeat(12,1fr); gap:.6rem;
}
.mosaic__item{ border-radius:12px; overflow:hidden; }
.mosaic__item img{ width:100%; height:100%; object-fit:cover; aspect-ratio:4/3; display:block; }

/* Por defecto, 4 columnas cada item (esto cubre los >6) */
.mosaic__item{ grid-column: span 4; }

/* Composición especial para los 6 primeros */
.mosaic__item:nth-child(1){ grid-column: span 7; }
.mosaic__item:nth-child(2){ grid-column: span 5; }
.mosaic__item:nth-child(3),
.mosaic__item:nth-child(4),
.mosaic__item:nth-child(5){ grid-column: span 4; }
.mosaic__item:nth-child(6){ grid-column: span 12; }

/* Móvil: a una columna */
@media (max-width:900px){
  .mosaic{ grid-template-columns: repeat(6,1fr); }
  .mosaic__item{ grid-column: span 6; }
}

/* Contenido en columnas (solo texto del MD) */
.about-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  margin-top: 3rem;
}

.about-col h2 {
  margin-top: 0;
}

@media (max-width: 900px) {
  .about-columns {
    grid-template-columns: 1fr;
  }
}

blockquote {
  margin: 3rem auto;
  padding: 2rem 2.5rem;
  background: #f9f9f9;
  border-left: 5px solid #333;
  font-size: 1.3rem;
  text-align: center;
  font-style: italic;
  box-shadow: 0 2px 10px rgba(0,0,0,0.05);
  max-width: 800px;
  border-radius: 8px;
}

blockquote p {
  margin: 0;
}

blockquote em {
  font-style: normal;
  color: #333;
  font-weight: 500;
}

.about-content{column-count:2; column-gap:2rem}
@media (max-width:900px){ .about-content{column-count:1} }
.about-content p, .about-content ul, .about-content ol, .about-content blockquote{break-inside:avoid; margin:0 0 1rem}

/* CTA final (solo si hay params en el MD) */
.about-cta{max-width:1100px; margin:2rem auto; padding:0 1.25rem}
.cta-card{border:1px solid #eee; border-radius:14px; background:#fff;
  box-shadow:0 10px 28px rgba(0,0,0,.06); padding:1.2rem}
.cta-text h2{margin:.2rem 0 .4rem}
.cta-actions{display:flex; gap:.8rem; flex-wrap:wrap; margin-top:.6rem}

.contact-page {
  max-width: 900px;
  margin: 0 auto;
  padding: 2rem;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,.05);
}

.contact-page h1 {
  text-align: center;
  margin-bottom: 1.5rem;
}

.contact-page form {
  display: grid;
  gap: 1rem;
}

.contact-page label {
  font-weight: 600;
  font-size: 0.95rem;
}

.contact-page input,
.contact-page textarea {
  width: 100%;
  padding: 0.75rem;
  border: 1px solid #e4e4e4;
  border-radius: 8px;
  font-size: 1rem;
}

.contact-page button {
  display: inline-block;
  background: #000;
  color: #fff;
  padding: 0.9rem 1.5rem;
  border-radius: 8px;
  font-weight: bold;
  border: none;
  cursor: pointer;
  transition: background 0.2s;
}

.contact-page button:hover {
  background: #222;
}

.contact-details {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid #eee;
  text-align: center;
}

.contact-details a {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #000;
  text-decoration: none;
  font-weight: 600;
  margin: 0 0.75rem;
}

.contact-details a:hover {
  opacity: 0.8;
}

.thank-you-message{
  margin-top: 1.75rem;
  padding: 1.5rem 1.75rem;
  border: 1px solid #f5e7b2;
  border-radius: 14px;
  background: linear-gradient(180deg, #fffdf5 0%, #ffffff 100%);
  box-shadow: 0 10px 28px rgba(0,0,0,.06);
  text-align: center;
}

.thank-you-message .ty-icon{
  width: 56px; height: 56px;
  margin: 0 auto .5rem;
  border-radius: 50%;
  display: grid; place-items: center;
  background: #fff3c4;           /* cercle groc suau */
  color: #d4a017;                /* groc més fort */
  font-size: 1.5rem;
}

.thank-you-message h2{
  margin: .4rem 0 .35rem;
  font-size: 1.5rem;
  color: #8a6d1d;                /* to marró-daurat per al text */
}

.thank-you-message .ty-text{
  margin: 0 0 .9rem;
  color: #6f5a20;
  font-size: 1.05rem;
  line-height: 1.55;
}

.thank-you-message .btn-secondary{
  border-color: #d4a017;
  color: #d4a017;
}
.thank-you-message .btn-secondary:hover{
  background: #d4a017;
  color: #fff;
}

/* Animació */
.thank-you-message{
  opacity: 0; transform: translateY(6px);
  transition: opacity .25s ease, transform .25s ease;
}
.thank-you-message.is-visible{
  opacity: 1; transform: translateY(0);
}

.mt-1 { margin-top: 0.5rem; }
.mt-2 { margin-top: 1rem; }
.mt-3 { margin-top: 1.5rem; }
.mt-4 { margin-top: 2rem; }
.mt-5 { margin-top: 3rem; }

/* --- Header responsive + menú hamburguesa --- */
.nav-toggle{display:none;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid #e5e5e5;border-radius:10px;background:#fff;cursor:pointer}
.nav-toggle i{font-size:1.1rem}
@media (max-width:900px){
  .site-header{gap:.75rem;flex-wrap:wrap}
  .site-logo img{height:72px}
  .nav-toggle{display:inline-flex}
  .main-nav{order:3;flex-basis:100%;display:block;max-height:0;overflow:hidden;transition:max-height .3s ease,border-color .2s ease;border-top:1px solid transparent}
  .main-nav.is-open{max-height:420px;border-top:1px solid #eee}
  .main-nav a{display:block;padding:.7rem 0}
  .lang-switcher{order:2;margin-left:auto}
}

/* ====== Mobile polish (≤900px) ====== */
@media (max-width:900px){

  /* LANG SWITCHER compacto y perfectamente centrado */
  .lang-switcher{gap:.25rem;flex-wrap:wrap;justify-content:center}
  .lang-switcher .lang-flag{display:none}
  .lang-switcher a{
    display:inline-flex;align-items:center;justify-content:center;
    min-width:2.4rem;height:2.4rem;padding:0;border:1px solid #ccc;border-radius:6px;
    font-size:0;color:#333;text-decoration:none;line-height:1;text-align:center;
    box-sizing:border-box;
  }
  .lang-switcher a::before{
    content:attr(lang);display:flex;align-items:center;justify-content:center;
    width:100%;font-size:.82rem;font-weight:700;letter-spacing:.02em;text-transform:uppercase;
  }
  .lang-switcher a:hover{background:#f5f5f5;border-color:#bbb}
  .lang-switcher a.active{background:#d4af37;border-color:#d4af37;color:#fff}
  .lang-switcher a.active::before{color:#fff}

  /* HERO: tarjeta a ancho completo + CTAs sin desbordes */
  .hero{padding:2rem .75rem}
  .hero.-white::before{background:rgba(0,48,102,.38)}
  .hero-glass{
    width:100%;max-width:100%;padding:1rem 1.1rem;border-radius:12px;
    box-sizing:border-box;
  }

  
  .hero .btn-primary{
    display:block;
    width:100%;
    max-width:100%;
    box-sizing:border-box;
    text-align:center;
    white-space:normal;
    overflow-wrap:break-word;
    padding:.9rem 1rem;
    margin:.25rem 0 0;
    border-radius:10px;
  }

  .hero-glass h1{font-size:1.6rem}
  .hero-glass p{font-size:1rem;margin:0 0 1rem;color:#f2f2f2!important}

  /* Botón principal: bloque y 100% de ancho */
  .hero-glass .btn-primary{
    display:block;width:100%;text-align:center;white-space:normal; /* evita que se salga */
    padding:.9rem 1rem;margin:.25rem 0 0;border-radius:10px;
  }

  /* Quick contact: en columna y con fondo suave para no tapar nada */
  .quick-contact{
    flex-direction:column;align-items:stretch;gap:.6rem;margin-top:.8rem;
  }
  .quick-contact a{
    justify-content:center;padding:.65rem .8rem;border:1px solid rgba(255,255,255,.25);
    border-radius:10px;background:rgba(0,0,0,.18);
  }

  /* Tarjetas y tipografías: evitar textos ocultos */
  .card__meta{font-size:.9rem}
  .mini-amenities{gap:.3rem}
  .mini-amenities li{padding:.28rem .5rem;font-size:.9rem}
  .price-badge{font-size:.85rem;padding:.3rem .55rem}

  /* Mosaico/galerías: una columna limpia */
  .mosaic{grid-template-columns:repeat(6,1fr)}
  .mosaic__item{grid-column:span 6}
  .gallery.grid{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:6px}
  .about-mosaic .mosaic {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); 
    gap: .6rem;
  }

  .about-mosaic .mosaic__item {
    grid-column: span 1 !important; /* Fuerza todas iguales */
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: 12px;
  }

  .about-mosaic .mosaic__item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  /* Panel reserva: inputs cómodos y sin saltos raros */
  .reserva-card{top:.75rem}
  .reserva-card .row-2{grid-template-columns:1fr;gap:.5rem}
  .btn-full{width:100%}

  /* Botones en general: que puedan partir línea si hace falta */
  .btn-primary,.btn-secondary{white-space:normal}

  /* Snippets de confianza y about */
  .trust-band{padding:1rem}
  .trust-band .band-item{min-height:120px;padding:.9rem}
  .about-snippet{padding:2rem 1rem;margin-top:2rem}
  .about-snippet h2{font-size:1.6rem}
  .about-snippet p{font-size:1rem}
}

/* ====== Micro-ajustes extra (≤420px) ====== */
@media (max-width:420px){
  .site-logo img{height:80px}
  .hero-glass h1{font-size:1.45rem}
  .hero-glass p{font-size:.95rem}
  .price-badge{left:.5rem;bottom:.5rem}
}

.cookie-banner{
  position: fixed; inset: auto 0 0 0; z-index: 9999;
  background: #111; color: #fff; transform: translateY(100%);
  transition: transform .28s ease; box-shadow: 0 -10px 28px rgba(0,0,0,.25);
}
.cookie-banner.is-visible{ transform: translateY(0); }
.cookie-inner{
  max-width: 1100px; margin: 0 auto; padding: .9rem 1.25rem;
  display: grid; grid-template-columns: 1fr auto; gap: .9rem; align-items: center;
}
.cookie-text p{ margin:.25rem 0 0; opacity:.9; }
.cookie-actions{ display:flex; gap:.5rem; flex-wrap:wrap; justify-content:flex-end; }
.cookie-actions .btn-primary{ background:#d4af37; color:#000; border:none; padding:.55rem .9rem; border-radius:8px; font-weight:800; }
.cookie-actions .btn-primary:hover{ filter: brightness(1.05); }
.cookie-actions .btn-secondary{ background:transparent; border:1px solid #666; color:#fff; padding:.55rem .85rem; border-radius:8px; font-weight:700; }
.cookie-actions .btn-secondary:hover{ background:#222; }

@media (max-width: 680px){
  .cookie-inner{ grid-template-columns: 1fr; gap:.75rem; }
  .cookie-actions{ justify-content: stretch; }
  .cookie-actions .btn-primary, .cookie-actions .btn-secondary{ flex:1; text-align:center; }
}

.cookie-link a {
  color: #fff;
  text-decoration: underline;
}
.cookie-link a:hover {
  text-decoration: none;
}

.site-footer .legal-links a {
  font-size: 0.85rem; /* lleugerament més petit */
  color: inherit; /* mantenim el color original */
  text-decoration: none;
  margin: 0 0.5rem;
}

.site-footer .legal-links a:hover {
  text-decoration: underline;
}

.site-footer .legal-links {
  font-size: 0.85rem; /* també afecta si tens text fora dels <a> */
}