
:root{
  --black:#070707;
  --black-2:#111111;
  --gold:#C8A45D;
  --gold-2:#E8C979;
  --ivory:#F8F4ED;
  --muted:#B9B0A4;
  --line:rgba(200,164,93,.30);
  --card:rgba(255,255,255,.055);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:var(--black);
  color:var(--ivory);
  line-height:1.6;
}
body.menu-open{overflow:hidden}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
.container{width:min(1180px,92%);margin:auto}
.gold{color:var(--gold)}
.eyebrow{
  color:var(--gold);
  text-transform:uppercase;
  letter-spacing:.18em;
  font-weight:900;
  font-size:.76rem;
}
h1,h2,h3{
  font-family:"Cormorant Garamond",Georgia,serif;
  margin:0;
  line-height:1.04;
}
h1{font-size:clamp(3rem,7.8vw,7.2rem);letter-spacing:-.04em}
h2{font-size:clamp(2.25rem,5.2vw,4.8rem);letter-spacing:-.03em}
h3{font-size:1.75rem}
p{margin:0;color:var(--muted)}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  padding:1rem 1.35rem;
  font-weight:900;
  border:1px solid var(--line);
  transition:.25s ease;
  cursor:pointer;
}
.btn:hover{transform:translateY(-2px);filter:brightness(1.08)}
.btn.primary{
  background:linear-gradient(135deg,var(--gold),var(--gold-2));
  color:#15100a;
  border-color:transparent;
}
.btn.secondary{background:rgba(255,255,255,.055);color:var(--ivory)}
.header{
  position:fixed;
  inset:0 0 auto 0;
  z-index:50;
  background:linear-gradient(to bottom,rgba(0,0,0,.92),rgba(0,0,0,.50),transparent);
  backdrop-filter:blur(10px);
}
.nav{
  height:86px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.4rem;
}
.brand img{width:96px;height:auto}
.menu{
  display:flex;
  align-items:center;
  gap:1.25rem;
  color:#f0e8dc;
  font-size:.94rem;
}
.menu a:not(.btn):hover{color:var(--gold)}
.menu-toggle{
  display:none;
  width:46px;
  height:46px;
  border-radius:999px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.06);
  color:var(--ivory);
  font-size:1.35rem;
}
.hero{
  min-height:100svh;
  position:relative;
  isolation:isolate;
  display:grid;
  align-items:center;
  padding:126px 0 72px;
  overflow:hidden;
}
.hero:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  background:
    linear-gradient(90deg,rgba(0,0,0,.94),rgba(0,0,0,.72),rgba(0,0,0,.32)),
    url("../img/sample-quince-hero.svg") center/cover no-repeat;
}
.hero:after{
  content:"";
  position:absolute;
  inset:auto -25% -35% -25%;
  height:55%;
  z-index:-1;
  background:radial-gradient(circle,rgba(200,164,93,.26),transparent 60%);
}
.hero-content{max-width:880px}
.hero-logo{width:min(330px,72vw);margin-bottom:1.4rem}
.hero p{font-size:clamp(1.05rem,2vw,1.35rem);max-width:740px;margin:1.15rem 0 2rem}
.actions{display:flex;gap:1rem;flex-wrap:wrap}
.stats{
  margin-top:2.7rem;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1rem;
  max-width:780px;
}
.stat{
  padding:1.15rem;
  border:1px solid var(--line);
  background:rgba(0,0,0,.45);
  border-radius:24px;
}
.stat strong{display:block;color:var(--ivory);font-size:1.25rem}
.stat span{font-size:.9rem;color:var(--muted)}
.section{padding:96px 0}
.section-head{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:2rem;
  margin-bottom:2.3rem;
}
.section-head p{max-width:560px}
.grid-3{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1.15rem;
}
.card{
  min-height:260px;
  padding:1.65rem;
  border-radius:30px;
  border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.03));
  box-shadow:0 22px 70px rgba(0,0,0,.28);
}
.card .num{color:var(--gold);font-weight:900;margin-bottom:1.1rem}
.card h3{margin-bottom:.7rem}
.card ul{color:var(--muted);padding-left:1.1rem;margin:1rem 0 0}
.card li{margin:.35rem 0}
.gallery{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:.9rem;
}
.gallery-item{
  position:relative;
  overflow:hidden;
  min-height:280px;
  border-radius:28px;
  border:1px solid var(--line);
  background:#121212;
}
.gallery-item.wide{grid-column:span 2}
.gallery-item img{width:100%;height:100%;object-fit:cover;transition:.4s ease}
.gallery-item:hover img{transform:scale(1.055)}
.caption{
  position:absolute;
  inset:auto 0 0 0;
  padding:1.15rem;
  background:linear-gradient(to top,rgba(0,0,0,.88),transparent);
  color:var(--ivory);
  font-weight:900;
}
.split{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:3rem;
  align-items:center;
}
.panel{
  border:1px solid var(--line);
  background:var(--card);
  border-radius:34px;
  padding:1rem;
}
.panel img{border-radius:25px;width:100%}
.packages{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1.15rem;
}
.package{
  position:relative;
  border:1px solid var(--line);
  background:var(--card);
  border-radius:30px;
  padding:1.8rem;
}
.package.featured{
  background:linear-gradient(180deg,rgba(200,164,93,.19),rgba(255,255,255,.05));
  transform:translateY(-8px);
}
.badge{
  position:absolute;
  top:1rem;
  right:1rem;
  background:var(--gold);
  color:#16100a;
  border-radius:999px;
  padding:.35rem .7rem;
  font-size:.72rem;
  font-weight:900;
}
.package p{margin:.55rem 0 1rem}
.package ul{padding-left:1.1rem;color:var(--muted)}
.package li{margin:.42rem 0}
.cta{
  padding:90px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:
    linear-gradient(90deg,rgba(0,0,0,.92),rgba(0,0,0,.72)),
    url("../img/sample-boda.svg") center/cover no-repeat;
}
.cta-box{text-align:center;max-width:850px;margin:auto}
.cta-box p{max-width:660px;margin:1rem auto 2rem}
.contact-grid{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:1.5rem;
}
.form{
  display:grid;
  gap:.9rem;
}
input,select,textarea{
  width:100%;
  background:rgba(255,255,255,.06);
  color:var(--ivory);
  border:1px solid var(--line);
  border-radius:18px;
  padding:1rem;
  font:inherit;
  outline:none;
}
textarea{min-height:132px;resize:vertical}
option{background:#111;color:white}
.footer{
  padding:34px 0;
  border-top:1px solid var(--line);
}
.footer-inner{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.whatsapp-float{
  position:fixed;
  right:20px;
  bottom:20px;
  z-index:55;
  background:#25D366;
  color:#061109;
  border-radius:999px;
  padding:1rem 1.15rem;
  font-weight:950;
  box-shadow:0 18px 50px rgba(0,0,0,.36);
}
@media(max-width:980px){
  .menu{
    position:fixed;
    top:86px;
    left:4%;
    right:4%;
    display:none;
    flex-direction:column;
    align-items:flex-start;
    gap:1rem;
    padding:1.15rem;
    border:1px solid var(--line);
    border-radius:24px;
    background:rgba(8,8,8,.98);
    box-shadow:0 30px 80px rgba(0,0,0,.55);
  }
  .menu.active{display:flex}
  .menu .btn{width:100%}
  .menu-toggle{display:inline-grid;place-items:center}
  .stats,.grid-3,.packages,.split,.contact-grid{grid-template-columns:1fr}
  .gallery{grid-template-columns:1fr 1fr}
  .gallery-item.wide{grid-column:span 2}
  .section-head{display:block}
  .section-head p{margin-top:1rem}
}
@media(max-width:620px){
  .container{width:min(100% - 28px,1180px)}
  .nav{height:76px}
  .brand img{width:78px}
  .menu{top:76px}
  .hero{padding-top:108px}
  .hero-logo{width:230px}
  h1{font-size:clamp(2.75rem,15vw,4.6rem)}
  .stats,.gallery{grid-template-columns:1fr}
  .gallery-item,.gallery-item.wide{grid-column:auto;min-height:235px}
  .section{padding:72px 0}
  .package.featured{transform:none}
  .whatsapp-float{
    left:14px;
    right:14px;
    text-align:center;
    justify-content:center;
    display:flex;
  }
}
