:root {
  --panel:#121417;
  --gold:#d6b36a;
  --text:#eaeaea;
  --muted:#a0a0a0;
}

*{box-sizing:border-box}

body{
  margin:0;
  font-family:Inter,sans-serif;
  background:radial-gradient(circle at top,#16181d,#070809);
  color:var(--text);
}

/* NAV */
nav{
  position:sticky;
  top:0;
  background:rgba(10,10,10,.85);
  backdrop-filter:blur(8px);
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:18px 40px;
  z-index:10;
}

.brand{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
  color:var(--text);
}

.brand img{height:42px}

.nav-right a{
  margin-left:25px;
  color:var(--text);
  text-decoration:none;
  font-size:.9rem;
}

.cta{
  background:var(--gold);
  color:#000;
  padding:10px 18px;
  border-radius:6px;
  font-weight:500;
}

/* HERO */
.hero{
  padding:120px 20px 100px;
  text-align:center;
}

.country-title{
  font-size:.9rem;
  letter-spacing:.35em;
  color:#6EC1E4;
}

.country-divider{
  width:120px;
  height:2px;
  background:linear-gradient(to right,#6EC1E4,#fff,#6EC1E4);
  margin:35px auto;
}

.anniversary-title{
  font-family:"Playfair Display",serif;
  font-size:clamp(2.8rem,5vw,4rem);
  color:#fff;
}

.event-meta{
  color:var(--gold);
  margin-top:18px;
}

/* SECTIONS */
section{
  max-width:1100px;
  margin:auto;
  padding:80px 20px;
}

h2{
  font-family:"Playfair Display",serif;
  font-size:2.3rem;
}

.gold-line{
  width:60px;
  height:2px;
  background:var(--gold);
  margin:25px 0;
}

/* PROGRAMME */
.program{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:25px;
}

.card{
  background:linear-gradient(180deg,#15171c,#0e0f13);
  border-radius:14px;
  padding:30px;
  border:1px solid rgba(214,179,106,.12);
}

.card h3{color:var(--gold)}

/* VENUE */
.venue{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:40px;
}

.price-box{
  border:1px solid rgba(214,179,106,.25);
  padding:30px;
  border-radius:14px;
}

.gold{color:var(--gold)}
.gold-link{color:var(--gold);text-decoration:none}

/* FORM */
form{
  background:var(--panel);
  padding:40px;
  border-radius:16px;
  display:grid;
  gap:18px;
}

input,select,textarea{
  width:100%;
  height:48px;
  padding:12px;
  background:#0d0f12;
  border:1px solid #333;
  color:#fff;
  border-radius:6px;
}

textarea{min-height:90px}

select{
  appearance:none;
  background-image:
          linear-gradient(45deg,transparent 50%,#aaa 50%),
          linear-gradient(135deg,#aaa 50%,transparent 50%);
  background-position:
          calc(100% - 18px) calc(50% - 3px),
          calc(100% - 13px) calc(50% - 3px);
  background-size:5px 5px;
  background-repeat:no-repeat;
}

.package-box{
  border:1px solid rgba(214,179,106,.35);
  padding:22px;
  border-radius:12px;
}

.hidden{display:none}

button{
  background:var(--gold);
  color:#000;
  padding:14px;
  font-weight:600;
  border-radius:6px;
  border:none;
  cursor:pointer;
}

/* FOOTER */
footer{
  text-align:center;
  padding:40px 20px;
  color:var(--muted);
}

@media(max-width:600px){
  nav{padding:14px 20px}
  .brand img{height:34px}
}

/* VENUE IMAGE CARD */
.venue-image-card {
  position: relative;
  background-image: url("../images/oasis.jpeg");
  background-size: cover;
  background-position: center;
  border-radius: 14px;
  min-height: 260px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
}

.venue-overlay {
  background: linear-gradient(
    to top,
    rgba(0,0,0,0.75),
    rgba(0,0,0,0.25),
    rgba(0,0,0,0)
  );
  padding: 30px;
  width: 100%;
}

.venue-title {
  font-size: 1.4rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 10px;
}

/* MERCH */
.merch-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 20px;
  margin-top: 20px;
}

.merch-item {
  text-align: center;
}

.merch-item img {
  width: 100%;
  border-radius: 10px;
  cursor: pointer;
  transition: transform .2s ease;
}

.merch-item img:hover {
  transform: scale(1.05);
}

.merch-item input {
  margin-top: 8px;
  height: 40px;
}

.total-box {
  text-align: center;
  font-size: 1.3rem;
  color: var(--gold);
}

/* Total breakdown */
.breakdown{
  text-align:left;
  color: var(--text);
  font-size: .95rem;
  margin-bottom:12px;
}
.breakdown .line{
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:4px 0;
  border-bottom:1px dashed rgba(214,179,106,.2);
}
.breakdown .line:last-child{
  border-bottom:none;
}
.breakdown .muted{ color: var(--muted); }

/* MODAL */
.modal{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.7);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:9999;
}

.modal.hidden{display:none}

.modal-content{
  background:#121417;
  border-radius:14px;
  padding:40px;
  max-width:420px;
  text-align:center;
  box-shadow:0 20px 60px rgba(0,0,0,.6);
}

.modal-content h3{
  color:var(--gold);
  margin-bottom:15px;
}

.modal-content p{
  color:var(--text);
  line-height:1.6;
  margin-bottom:25px;
}