/* ===========================
   Memo Alcántara — STYLE
   Paleta estricta
   =========================== */
:root{
  --deep:#1F1F1B;       /* fondo principal */
  --green:#0A2C33;      /* verde oscuro */
  --cream:#FFFDE6;      /* texto/base */
  --mint:#99CCB7;       /* acento suave */
  --red:#E83C15;        /* CTA */
  /* RGB para opacidades (derivados de la misma paleta) */
  --deep-rgb:31,31,27;
  --cream-rgb:255,253,230;
  --green-rgb:10,44,51;
  --mint-rgb:153,204,183;
}

html, body { overflow-x: hidden; }

/* ====== Fuentes ====== */
@font-face{
  font-family:'Cy';
  src:url('../fonts/Cy/Cy-Regular-if6673e73706204.ttf') format('truetype');
  font-weight:400;font-style:normal;font-display:swap
}
@font-face{
  font-family:'Cy';
  src:url('../fonts/Cy/Cy-Bold-if6673e737316f8.ttf') format('truetype');
  font-weight:700;font-style:normal;font-display:swap
}
@font-face{
  font-family:'Heming';
  src:url('../fonts/Heming/Heming Variable.ttf') format('truetype');
  font-weight:100 900;font-display:swap
}
@font-face{
  font-family:'YametKudasi';
  src:url('../fonts/Yamet Kudasi/YametKudasi-Regular.ttf') format('truetype');
  font-weight:400;font-display:swap
}

/* ====== Base ====== */
html,body{
  background:var(--deep);
  color:var(--cream);
  font-family:'Cy',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  scroll-behavior:smooth
}
img{max-width:100%;height:auto}
.object-cover{object-fit:cover}

/* ====== Topbar / Links ====== */
.topbar{background:var(--green);border-bottom:1px solid rgba(var(--cream-rgb),.10)}
.link-top{color:rgba(var(--cream-rgb),.90);text-decoration:none}
.link-top:hover{color:var(--mint)}

/* ====== Navbar ====== */
.bg-deep{background:var(--deep)}
.bg-deeper{background:#181814} /* mismo tono, sin salir de paleta (oscurecido del deep) */
.navbar-brand .brand-text{
  font-family:'YametKudasi',serif;
  letter-spacing:.4px;
  font-size:1.15rem;
  color:var(--mint)
}
.nav-link{color:#99ccb7}
.nav-link:hover,.nav-link.active{color:var(--mint)}
.dropdown-menu{--bs-dropdown-bg:#181814;--bs-dropdown-link-color:rgba(var(--cream-rgb),.9)}

/* ====== Secciones y Titulares ====== */
.section-pad{padding:6rem 0}
.section-head{margin-bottom:1rem}
.eyebrow{
  font:700 1rem/1 'Heming',sans-serif;
  letter-spacing:.08em;
  color:var(--mint);
  text-transform:uppercase
}
.section-title{
  font-family:'YametKudasi',serif;
  font-size:clamp(2.2rem,4.2vw,3.4rem);
  line-height:1.05;
  color:var(--cream);
  margin:0
}
.section-title::after{
  content:"";
  display:block;
  width:72px;height:3px;margin:.6rem 0 0;
  background:linear-gradient(90deg,var(--mint),rgba(var(--mint-rgb),.0));
  border-radius:2px
}
.lead{color:rgba(var(--cream-rgb),.92)}

/* ====== Hero / Slider con Ken Burns sutil y degradado inferior ====== */
.hero .carousel-item{position:relative;overflow:hidden}
.hero .carousel-item::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to top,
    rgba(var(--deep-rgb),.82) 0%,
    rgba(var(--deep-rgb),.55) 36%,
    rgba(var(--deep-rgb),.22) 66%,
    rgba(var(--deep-rgb),0) 100%);
}
.hero .carousel-item,
.hero .carousel-item img{height:88vh;max-height:88vh}
@media (min-width:1200px){
  .hero .carousel-item,
  .hero .carousel-item img{height:92vh;max-height:92vh}
}
.hero .carousel-item img{
  will-change:transform;
  transform:scale(1.02);
  animation-duration:22s;
  animation-timing-function:ease-in-out;
  animation-fill-mode:both
}
.hero .carousel-item:nth-child(1) img{animation-name:kb-tl;transform-origin:20% 20%}
.hero .carousel-item:nth-child(2) img{animation-name:kb-br;transform-origin:80% 80%}
.hero .carousel-item:nth-child(3) img{animation-name:kb-tr;transform-origin:80% 20%}
.hero .carousel-item:nth-child(4) img{animation-name:kb-bl;transform-origin:20% 80%}
@keyframes kb-tl{0%{transform:scale(1.02) translate3d(-.6%,-.6%,0)}100%{transform:scale(1.08) translate3d(.6%,.6%,0)}}
@keyframes kb-br{0%{transform:scale(1.02) translate3d(.6%,.6%,0)}100%{transform:scale(1.08) translate3d(-.6%,-.6%,0)}}
@keyframes kb-tr{0%{transform:scale(1.02) translate3d(.6%,-.6%,0)}100%{transform:scale(1.08) translate3d(-.6%,.6%,0)}}
@keyframes kb-bl{0%{transform:scale(1.02) translate3d(-.6%,.6%,0)}100%{transform:scale(1.08) translate3d(.6%,-.6%,0)}}

.carousel-caption{
  bottom:10%;
  max-width:min(980px,94vw);
  margin-inline:auto;
  padding:0;
  text-shadow:0 2px 14px rgba(0,0,0,.65)
}
.carousel-caption .title-special,
.carousel-caption .display-5{font-size:clamp(2.6rem,6.8vw,5.6rem);line-height:1.04}
.carousel-caption h2{font-size:clamp(2.2rem,5.4vw,4.6rem);line-height:1.06}
.carousel-caption p{font-size:clamp(1.05rem,1.6vw,1.35rem);margin-top:.35rem}

/* ====== Botones ====== */
.btn-cta{background:var(--red);border-color:var(--red);color:var(--cream)}
.btn-cta:hover{background:#c33211;border-color:#c33211}
.btn-outline-light{color:var(--cream);border-color:rgba(var(--cream-rgb),.35)}
.btn-outline-light:hover{background:rgba(var(--cream-rgb),.06)}

/* ====== Tarjetas y Planes ====== */
.card{background:#191915;border:1px solid rgba(var(--cream-rgb),.08)}
.card-service:hover{transform:translateY(-3px)}
.plan-featured{border-color:var(--mint)}
.plan-title{font-family:'Heming',sans-serif;font-weight:800;letter-spacing:.4px}

/* ====== Formularios ====== */
.form-control,.form-select{background:#12120f;border-color:#2a2a22;color:var(--cream)}
.form-control:focus,.form-select:focus{border-color:var(--mint);box-shadow:none}
.btn-close-white{filter:invert(1)}

/* ====== Footer ====== */
footer{background:#181814}
.text-muted-cream{color:rgba(var(--cream-rgb),.72)}

/* ====== Floating Buttons ====== */
.floating{position:fixed;right:16px;bottom:16px;display:flex;flex-direction:column;gap:10px;z-index:1030}
.float-btn{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:var(--cream);box-shadow:0 8px 24px rgba(0,0,0,.35);text-decoration:none;transition:.2s}
.float-btn:hover{transform:translateY(-2px);background:#0E3A43}
.wapp{background:#25D366;color:#111} /* WhatsApp conserva su color de marca */

/* ====== Accesibilidad ====== */
@media (prefers-reduced-motion:reduce){
  .hero .carousel-item img{animation:none;transform:none}
  .carousel-caption{text-shadow:none}
}
/* ----- Nosotros: imagen completa y alineada arriba ----- */
/* antes: tenía background y altura fija */
.nosotros-media{
  background:none;           /* elimina gris */
  border-radius:12px;
  overflow:hidden;
}

@media (min-width:992px){
  .nosotros-media{height:100%}           /* iguala al alto del texto */
}

/* Lista con iconos */
.feature-list{list-style:none;margin:1rem 0 0;padding:0;display:grid;gap:.5rem}
.feature-list li{display:flex;align-items:center;gap:.6rem;color:rgba(var(--cream-rgb),.92)}
.feature-list i{color:var(--mint);font-size:1.05rem}

/* ----- Banda de métricas con fondo a ancho completo ----- */
.stats-band{
  position:relative;isolation:isolate;
  background:url('../img/nosotros02.jpg') center/cover no-repeat fixed;
  padding:10rem 0;
}
.stats-overlay{
  position:absolute;inset:0;
  background:linear-gradient(to right,
    rgba(var(--deep-rgb),.78),
    rgba(var(--deep-rgb),.55) 45%,
    rgba(var(--deep-rgb),.78));
  z-index:-1;
}
.stat{color:var(--cream)}
.stat-number{
  display:inline-block;
  font-family:'Heming',sans-serif;font-weight:900;
  font-size:clamp(2.2rem,6vw,3.8rem);line-height:1;
  color:#99ccb7;
}
.stat-sub{
  display:inline-block;margin-left:.5rem;
  font-weight:700;color:var(--cream)
}
.stat-label{margin-top:.25rem;font-weight:600}

/* Mejor legibilidad sobre foto */
.stats-band .stat-label{color:rgba(var(--cream-rgb),.95)}

/* Cards de la galería de servicios */
.serv-card{background:#191915;border:1px solid rgba(var(--cream-rgb),.08);border-radius:12px;overflow:hidden}
.serv-card img{display:block;transition:transform .45s ease}
.serv-card:hover img{transform:scale(1.03)}
.serv-card figcaption{padding:.75rem 1rem;font-weight:700}
/* Paquetes con fondo */
/* El contenedor queda a ancho normal; el fondo ocupa 100vw sin provocar scroll */
.paquetes-section{
  position:relative;
  padding:2.2rem 1.2rem;
  border-radius:12px;
  overflow:hidden;
}

/* Fondo full-bleed centrado con transform (sin margin-left:-50vw) */
.paquetes-section::before{
  content:"";
  position:absolute; inset:0;
  left:50%; right:auto; width:100vw; transform:translateX(-50%);
  background:url('assets/img/fondo_paquetes.jpg') center/cover no-repeat;
  z-index:0;
}
.paquetes-section > *{ position:relative; z-index:1; }

/* Elimina márgenes/anchos previos */
.paquetes-full{ left:auto; right:auto; margin:0; width:auto; border-radius:12px; }

/* Tarjetas de paquete */
.pack-card{
  background:rgba(var(--deep-rgb),.75);
  border:1px solid rgba(var(--cream-rgb),.10);
  border-radius:14px;
  padding:1.1rem 1.1rem 1.2rem;
  backdrop-filter:saturate(120%) blur(4px);
}
.pack-featured{border-color:var(--mint); box-shadow:0 12px 28px rgba(0,0,0,.25)}
.pack-list{list-style:none;margin:0 0 1rem;padding:0;display:grid;gap:.5rem}
.pack-list li{display:flex;gap:.6rem;align-items:flex-start}
.pack-list i{color:var(--mint);margin-top:.2rem}
/* full-bleed: ocupa todo el ancho del viewport aunque esté dentro de .container */
.paquetes-full{
  position:relative;
  left:50%;
  right:50%;
  margin-left:-50vw;
  margin-right:-50vw;
  width:100vw;
  border-radius:0;             /* sin esquinas para ocupar de orilla a orilla */
}
/* Modal sobre reservaciones a 80% del ancho */
.modal-reservas{ --bs-modal-width: 80vw; }
@media (max-width: 576px){ .modal-reservas{ --bs-modal-width: 96vw; } }

/* Asegura que el modal quede por encima de cualquier z-index del sitio */
.modal{ z-index: 1080; }
.modal-backdrop{ z-index: 1070; }

/* Contacto refinado */
.contact-form .form-control{padding:.7rem .9rem}
.contact-card{background:#191915;border:1px solid rgba(var(--cream-rgb),.08)}
.social-chip{
  display:inline-flex;align-items:center;
  padding:.4rem .7rem;border-radius:999px;
  background:#151511;border:1px solid rgba(var(--cream-rgb),.12);
  color:rgba(var(--cream-rgb),.9);text-decoration:none;font-weight:600
}
.social-chip:hover{color:var(--mint);border-color:var(--mint)}
.map-card{border:1px solid rgba(var(--cream-rgb),.08); background:#0a0a08}
/* Barra con sutil elevación y borde inferior */
.nav-elevated{box-shadow:0 8px 24px rgba(0,0,0,.25); border-bottom:1px solid rgba(var(--cream-rgb),.06)}

/* Marca un poco más visible */
.navbar-brand img{height:40px}
@media (min-width:992px){ .navbar-brand img{height:46px} }

/* Estilo de links: mayúsculas suaves, tracking y subrayado animado */
.navbar .nav-link{
  position:relative;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-weight:700;
  padding:.55rem .9rem;
  color:rgba(var(--cream-rgb),.85);
}
.navbar .nav-link::after{
  content:"";
  position:absolute; left:12%; right:12%; bottom:.25rem;
  height:2px; background:linear-gradient(90deg,var(--mint),rgba(var(--mint-rgb),0));
  transform:scaleX(0); transform-origin:right; transition:transform .25s ease;
}
.navbar .nav-link:hover{color:var(--mint)}
.navbar .nav-link:hover::after{transform:scaleX(1); transform-origin:left}

/* Activo: subrayado visible + color */
.navbar .nav-link.active{
  color:var(--mint) !important;
}
.navbar .nav-link.active::after{
  transform:scaleX(1); transform-origin:left;
}

/* Separadores sutiles en desktop */
@media (min-width:992px){
  .navbar-nav .nav-item{position:relative}
  .navbar-nav .nav-item + .nav-item::before{
    content:""; position:absolute; left:-.25rem; top:50%; transform:translateY(-50%);
    width:1px; height:18px; background:rgba(var(--cream-rgb),.14);
  }
}

/* CTA menú */
.navbar .btn-cta-nav{
  background:var(--red); color:var(--cream) !important;
  border-radius:999px; padding:.5rem 1rem; margin-left:.6rem;
  box-shadow:0 10px 24px rgba(0,0,0,.28);
}
.navbar .btn-cta-nav:hover{background:#c33211}
.navbar .btn-cta-nav::after{display:none}

/* Dropdown más legible */
.dropdown-menu{
  --bs-dropdown-bg:#151511;
  --bs-dropdown-link-color:rgba(var(--cream-rgb),.9);
  border:1px solid rgba(var(--cream-rgb),.12);
  backdrop-filter:saturate(120%) blur(4px);
}
.dropdown-item:hover{background:rgba(var(--mint-rgb),.12); color:var(--mint)}

/* Modo “shrink” al hacer scroll */
.navbar.shrink{padding-top:.2rem; padding-bottom:.2rem}
.navbar.shrink .navbar-brand img{height:36px}
/* Quita el azul del item activo/foco en el dropdown */
.dropdown-menu{
  --bs-dropdown-link-active-bg: rgba(var(--mint-rgb), .18);
  --bs-dropdown-link-active-color: var(--mint);
}
.dropdown-item:active,
.dropdown-item.active{
  background: rgba(var(--mint-rgb), .18) !important;
  color: var(--mint) !important;
}
.dropdown-item:focus{
  outline: none;
  background: rgba(var(--mint-rgb), .12);
  color: var(--mint);
}