:root{
  --olive:#6c6a37;
  --olive-dark:#57552c;
  --blue-gray:#8facb4;
  --blue-gray-alt:#84a4ac;
  --red:#e14b3c;
  --ink:#111111;
  --cream:#f6f4ee;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Poppins',sans-serif;
  color:var(--ink);
  background:var(--cream);
  overflow-x:hidden;
  padding-top:64px;
}
body.modal-open{
  overflow:hidden;
}
h1,h2,h3,.display{
  font-family:'Baloo 2',sans-serif;
  font-weight:800;
  letter-spacing:0.5px;
}
a{color:inherit;}
strong{font-weight:600;}
p, li, label, input, select, textarea, button{
  font-size:1.02rem;
  line-height:1.6;
}

/* ===== NAV ===== */
.navbar{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  background:var(--olive);
  z-index:200;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 2rem;
  height:64px;
}
.navbar .brand{
  font-family:'Baloo 2',sans-serif;
  font-weight:700;
  color:#fff;
  font-size:1.05rem;
  white-space:nowrap;
}
.navbar .menu{
  display:flex;
  gap:0.4rem;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.navbar .menu a{
  font-family:'Baloo 2',sans-serif;
  font-weight:600;
  font-size:0.92rem;
  color:#fff;
  text-decoration:none;
  padding:0.55rem 0.9rem;
  border-radius:999px;
  transition:background 0.15s ease;
  white-space:nowrap;
}
.navbar .menu a:hover,
.navbar .menu a.active{
  background:rgba(255,255,255,0.18);
}
.navbar .menu a.cta{
  background:var(--red);
}
.navbar .menu a.cta:hover{
  background:#c53a2d;
}
.nav-toggle{
  display:none;
  background:none;
  border:none;
  color:#fff;
  font-size:1.6rem;
  cursor:pointer;
}
@media (max-width:900px){
  .navbar{flex-wrap:wrap;height:auto;padding:0.8rem 1.2rem;}
  .navbar .brand{flex:1;}
  .nav-toggle{display:block;}
  .navbar .menu{
    display:none;
    width:100%;
    flex-direction:column;
    gap:0.2rem;
    padding-top:0.6rem;
  }
  .navbar .menu.open{display:flex;}
  .navbar .menu a{text-align:center;}
  body{padding-top:0;}
}

/* ===== HERO ===== */
.hero{
  position:relative;
  min-height:88vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  background:
    linear-gradient(180deg, rgba(20,45,60,0.15) 0%, rgba(10,30,45,0.35) 100%),
    url('https://images.unsplash.com/photo-1507525428034-b723cf961d3e?auto=format&fit=crop&w=1800&q=80') center/cover no-repeat;
  padding:2rem;
}
.hero h1{
  color:#fff;
  font-size:clamp(2.6rem, 9vw, 7rem);
  line-height:0.95;
  text-shadow:0 4px 18px rgba(0,0,0,0.35);
}
.hero .sub{
  margin-top:1.2rem;
  color:#fff;
  font-family:'Baloo 2',sans-serif;
  font-weight:600;
  font-size:clamp(1.2rem, 3vw, 2.1rem);
  letter-spacing:3px;
  text-shadow:0 3px 12px rgba(0,0,0,0.35);
}
.hero .cta-button{
  margin-top:2rem;
  display:inline-block;
  background:var(--red);
  color:#fff;
  text-decoration:none;
  padding:0.95rem 2.2rem;
  border-radius:999px;
  font-family:'Baloo 2',sans-serif;
  font-size:1.15rem;
  font-weight:700;
  box-shadow:0 12px 24px rgba(0,0,0,0.18);
  transition:transform 0.15s ease, background 0.15s ease;
}
.hero .cta-button:hover{
  background:#c53a2d;
  transform:translateY(-1px);
}

/* ===== SECTIONS ===== */
section{
  padding:5rem 8vw;
}
.band{ background:var(--blue-gray); }
.band-alt{ background:var(--blue-gray-alt); }
.band-cream{ background:var(--cream); }

.eyebrow{
  font-size:clamp(1.7rem, 3.2vw, 2.6rem);
  margin-bottom:0.8rem;
}

.grid-2{
  display:grid;
  grid-template-columns:1.15fr 0.85fr;
  gap:3.5rem;
  align-items:start;
}
.info-block{margin-bottom:2.8rem;}
.info-block:last-child{margin-bottom:0;}
.polaroid{
  background:#fff;
  padding:0.6rem 0.6rem 3.2rem 0.6rem;
  box-shadow:0 12px 30px rgba(0,0,0,0.18);
  transform:rotate(0.6deg);
}
.polaroid img{
  display:block;
  width:100%;
  height:210px;
  object-fit:cover;
}
.deadline{
  margin-top:1.6rem;
  font-size:1.3rem;
  line-height:1.35;
}
.deadline .date{
  color:var(--red);
  font-family:'Baloo 2',sans-serif;
  font-weight:700;
  font-size:1.6rem;
}
.linklike{
  word-break:break-word;
  text-decoration:underline;
}

.precios-grid{
  display:grid;
  grid-template-columns:0.75fr 1.25fr;
  gap:3.5rem;
  align-items:center;
}
.precios-grid img{
  width:100%;
  border-radius:2px;
  box-shadow:0 12px 30px rgba(0,0,0,0.18);
}
table{
  width:100%;
  border-collapse:collapse;
  margin-top:1.5rem;
  background:#fff;
}
th{
  background:#1f4fb8;
  color:#fff;
  text-align:left;
  padding:0.75rem 1rem;
  font-weight:500;
  font-size:1rem;
}
td{
  padding:0.7rem 1rem;
  border-bottom:1px solid #d8d8d8;
  font-size:1rem;
}
.note{margin-top:1rem;font-size:0.95rem;}
.warn{
  color:var(--red);
  font-weight:700;
  font-family:'Baloo 2',sans-serif;
  font-size:1.4rem;
  margin-top:1.6rem;
  line-height:1.25;
}
.italic-note{font-style:italic;margin-top:2.2rem;display:block;}

.pagar-grid{
  display:grid;
  grid-template-columns:0.9fr 1.1fr;
  gap:3.5rem;
  align-items:center;
}
.pagar-grid img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:2px;
  box-shadow:0 12px 30px rgba(0,0,0,0.18);
}
ul{list-style:disc;padding-left:1.3rem;margin-top:1rem;}
li{margin-bottom:0.5rem;}

.vuelos-grid{
  display:grid;
  grid-template-columns:0.55fr 1.45fr;
  gap:3rem;
  align-items:start;
}
.vuelos-left img{
  width:100%;
  border-radius:2px;
  box-shadow:0 12px 30px rgba(0,0,0,0.18);
  margin-top:1.5rem;
}

.gallery-section{
  position:relative;
  overflow:hidden;
}
.gallery-head{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:1.5rem;
  margin-bottom:2rem;
}
.gallery-head p{
  max-width:620px;
}
.hotel-gallery{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:1.1rem;
}
.gallery-card{
  border:none;
  padding:0;
  background:#fff;
  border-radius:18px;
  overflow:hidden;
  cursor:pointer;
  box-shadow:0 12px 28px rgba(0,0,0,0.12);
  transform:translateY(0);
  transition:transform 0.18s ease, box-shadow 0.18s ease;
}
.gallery-card:hover{
  transform:translateY(-4px) rotate(0.2deg);
  box-shadow:0 18px 34px rgba(0,0,0,0.16);
}
.gallery-card img{
  width:100%;
  height:235px;
  object-fit:cover;
  display:block;
}

.gallery-modal{
  position:fixed;
  inset:0;
  z-index:500;
  display:none;
  align-items:center;
  justify-content:center;
  padding:2rem;
}
.gallery-modal.open{
  display:flex;
}
.gallery-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(7,18,27,0.78);
  backdrop-filter:blur(4px);
}
.gallery-modal-card{
  position:relative;
  z-index:1;
  width:min(960px, 100%);
  background:#fff;
  border-radius:24px;
  padding:1rem 1rem 1.2rem;
  box-shadow:0 28px 60px rgba(0,0,0,0.28);
}
.gallery-modal-close{
  position:absolute;
  top:0.8rem;
  right:0.8rem;
  width:42px;
  height:42px;
  border:none;
  border-radius:999px;
  background:rgba(17,17,17,0.08);
  color:#222;
  font-size:1.4rem;
  cursor:pointer;
}
.gallery-modal-media{
  border-radius:18px;
  overflow:hidden;
  background:#ece7dc;
}
.gallery-modal-media img{
  width:100%;
  max-height:76vh;
  object-fit:contain;
  display:block;
  background:#ece7dc;
}
.gallery-modal-caption{
  padding:0.9rem 0.35rem 0;
  font-family:'Baloo 2',sans-serif;
  font-size:1.1rem;
  color:var(--olive-dark);
}

.closing{
  position:relative;
  min-height:60vh;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  background:
    linear-gradient(180deg, rgba(5,30,55,0.25) 0%, rgba(5,30,55,0.45) 100%),
    url('https://images.unsplash.com/photo-1519046904884-53103b34b206?auto=format&fit=crop&w=1800&q=80') center/cover no-repeat;
  padding:3rem 2rem;
}
.closing h2{
  color:#fff;
  font-size:clamp(2rem, 5.5vw, 4rem);
  line-height:1.25;
  text-shadow:0 4px 18px rgba(0,0,0,0.4);
  max-width:900px;
}

/* ===== FORM PAGE ===== */
.form-hero{
  background:var(--olive);
  color:#fff;
  padding:3.5rem 8vw 2.5rem;
  text-align:center;
}
.form-hero h1{
  font-size:clamp(2rem, 5vw, 3rem);
  color:#fff;
}
.form-hero p{
  margin-top:0.8rem;
  color:#eeeee0;
}
.form-wrap{
  max-width:920px;
  margin:0 auto;
  padding:3rem 6vw 5rem;
}
.card{
  background:#fff;
  border-radius:14px;
  padding:2rem 2rem 2.4rem;
  box-shadow:0 10px 30px rgba(0,0,0,0.08);
  margin-bottom:2rem;
}
.card h2{
  font-size:1.4rem;
  margin-bottom:1.2rem;
  color:var(--olive-dark);
}
.field-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1.2rem;
}
.field-row.three{grid-template-columns:1fr 1fr 1fr;}
.field{
  margin-bottom:1.1rem;
  display:flex;
  flex-direction:column;
}
.field label{
  font-weight:600;
  font-size:0.9rem;
  margin-bottom:0.4rem;
  color:#333;
}
.field small{
  color:#777;
  font-weight:400;
  margin-top:0.3rem;
  font-size:0.8rem;
}
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
input[type="date"],
select,
textarea{
  border:1.5px solid #d9d6ca;
  border-radius:8px;
  padding:0.65rem 0.8rem;
  font-family:'Poppins',sans-serif;
  font-size:0.98rem;
  background:#fdfcf9;
  width:100%;
}
input:focus, select:focus, textarea:focus{
  outline:none;
  border-color:var(--olive);
}
textarea{resize:vertical;min-height:90px;}

.familiar-item{
  border:1.5px dashed #cfcabb;
  border-radius:10px;
  padding:1.2rem 1.2rem 0.3rem;
  margin-bottom:1.2rem;
  position:relative;
}
.familiar-item .remove-btn{
  position:absolute;
  top:0.7rem;
  right:0.8rem;
  background:none;
  border:none;
  color:var(--red);
  font-weight:600;
  font-size:0.85rem;
  cursor:pointer;
}
.familiar-item .familiar-title{
  font-weight:600;
  font-family:'Baloo 2',sans-serif;
  color:var(--olive-dark);
  margin-bottom:0.8rem;
}

.add-btn{
  background:var(--olive);
  color:#fff;
  border:none;
  border-radius:999px;
  padding:0.6rem 1.3rem;
  font-family:'Baloo 2',sans-serif;
  font-weight:600;
  cursor:pointer;
  font-size:0.92rem;
}
.add-btn:hover{background:var(--olive-dark);}

.checkbox-row{
  display:flex;
  align-items:center;
  gap:0.6rem;
  margin-top:0.4rem;
}
.checkbox-row input{width:auto;}

.submit-btn{
  width:100%;
  background:var(--red);
  color:#fff;
  border:none;
  border-radius:999px;
  padding:0.95rem;
  font-family:'Baloo 2',sans-serif;
  font-weight:700;
  font-size:1.1rem;
  cursor:pointer;
  margin-top:0.5rem;
}
.submit-btn:hover{background:#c53a2d;}

.error-box{
  background:#fceceb;
  border:1.5px solid var(--red);
  color:#8a231a;
  padding:1rem 1.2rem;
  border-radius:10px;
  margin-bottom:1.5rem;
  font-size:0.95rem;
}
.error-box ul{margin-top:0.5rem;}

/* ===== CONFIRMATION ===== */
.confirm-wrap{
  max-width:700px;
  margin:5rem auto;
  text-align:center;
  padding:0 6vw;
}
.confirm-wrap .icon{
  width:80px;height:80px;
  border-radius:50%;
  background:#e4f0da;
  color:#3b6d11;
  display:flex;align-items:center;justify-content:center;
  font-size:2.4rem;
  margin:0 auto 1.5rem;
}
.confirm-wrap h1{font-size:2rem;margin-bottom:1rem;}
.summary-table{
  text-align:left;
  margin-top:2rem;
  background:#fff;
  border-radius:12px;
  padding:1.5rem;
  box-shadow:0 8px 24px rgba(0,0,0,0.08);
}
.summary-table h3{
  font-family:'Baloo 2',sans-serif;
  margin-bottom:0.6rem;
  color:var(--olive-dark);
}

@media (max-width:850px){
  section{padding:3.5rem 6vw;}
  .grid-2, .precios-grid, .pagar-grid, .vuelos-grid{grid-template-columns:1fr;}
  .hotel-gallery{grid-template-columns:repeat(2, minmax(0, 1fr));}
  .precios-grid > img{max-width:340px;margin:0 auto;}
  .field-row, .field-row.three{grid-template-columns:1fr;}
}
@media (max-width:560px){
  .hotel-gallery{grid-template-columns:1fr;}
  .gallery-card img{height:255px;}
  .gallery-modal{padding:1rem;}
  .gallery-modal-card{padding:0.85rem 0.85rem 1rem;}
}
