/* HERO background */
.hero{
  min-height: 62vh;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding: 90px 16px 70px;
  position:relative;
  overflow:hidden;
}
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(900px 420px at 50% 40%, rgba(201,162,74,.18), transparent 62%),
    radial-gradient(700px 360px at 50% 55%, rgba(255,255,255,.05), transparent 70%),
    radial-gradient(1200px 700px at 50% 120%, rgba(0,0,0,.85), transparent 55%);
  z-index:-1;
}
.hero-inner{ max-width: 900px; }
.hero h1{
  color: var(--gold2);
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: clamp(30px, 4.5vw, 64px);
  margin: 0 0 12px;
}
.hero p{
  color: rgba(255,255,255,.78);
  font-size: clamp(14px, 1.6vw, 18px);
  line-height: 1.7;
  margin: 0 0 20px;
}
.hero-actions{
  display:flex;
  gap: 12px;
  justify-content:center;
  flex-wrap: wrap;
}

/* Filters */
.filters{
  display:flex;
  justify-content:center;
  gap: 10px;
  flex-wrap: wrap;
  margin: 14px 0 26px;
}
.filter-btn{
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(201,162,74,.35);
  background: rgba(255,255,255,.05);
  color: rgba(255,255,255,.85);
  cursor:pointer;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: 12px;
}
.filter-btn.is-active{
  border-color: rgba(225,192,106,.95);
  background: rgba(201,162,74,.18);
  color: var(--gold2);
}
.is-hidden{ display:none !important; }

/* Contact section */
.section-contact{
  border-top: 1px solid rgba(201,162,74,.12);
  background: linear-gradient(180deg, rgba(201,162,74,.04) 0%, rgba(0,0,0,.55) 55%, #050505 100%);
}
.hint{
  text-align:center;
  color: rgba(255,255,255,.72);
  margin-top: 6px;
}
.section-contact-page{
  min-height: calc(100vh - 90px);
}
.center-row{
  display:flex;
  justify-content:center;
  margin-top: 18px;
}

/* MODAL */
.modal{
  position: fixed;
  inset:0;
  display:none;
  z-index: 200;
  padding: 20px;
}
.modal.is-open{
  display:flex;
  align-items:center;
  justify-content:center;
}
.modal-backdrop{
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.65);
  backdrop-filter: blur(6px);
}
.modal-card{
  position:relative;
  width: min(1100px, 96vw);
  max-height: 90vh;
  border-radius: 22px;
  border: 1px solid rgba(201,162,74,.25);
  background: rgba(12,12,12,.92);
  backdrop-filter: blur(18px);
  box-shadow: 0 40px 120px rgba(0,0,0,.55);
  overflow:hidden;
  display:grid;
  grid-template-columns: 1.1fr .9fr;
}
.modal-media{
  background: rgba(0,0,0,.35);
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 16px;
}
.modal-media img{
  max-width: 100%;
  max-height: 70vh;
  object-fit: contain;
  border-radius: 14px;
}
.modal-body{
  padding: 26px;
  display:flex;
  flex-direction:column;
  gap: 14px;
  overflow-y:auto;
}
.modal-body h3{
  margin:0;
  color: var(--gold2);
  letter-spacing: .06em;
  text-transform: uppercase;
  font-size: 18px;
}

.info-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.info-box{
  border-radius: 16px;
  border: 1px solid rgba(201,162,74,.22);
  background: rgba(255,255,255,.04);
  padding: 12px;
}
.info-label{
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,.68);
  margin-bottom: 6px;
}
.info-value{
  font-size: 13px;
  line-height: 1.55;
  color: rgba(255,255,255,.88);
}
.modal-text{
  margin:0;
  color: rgba(255,255,255,.78);
  line-height: 1.7;
  font-size: 14px;
}
.modal-actions{
  margin-top:auto;
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}

@media (max-width: 900px){
  .modal-card{ grid-template-columns: 1fr; max-height: 92vh; }
  .modal-media img{ max-height: 42vh; }
  .info-grid{ grid-template-columns: 1fr; }
}
@media (max-width: 520px){
  .modal{ padding: 10px; }
  .modal-body{ padding: 18px; }
  .modal-media img{ max-height: 36vh; }
}

/* QR PAGE */
.qr-page{
  min-height: 100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 24px;
}
.qr-card{
  width: min(560px, 100%);
  border-radius: 22px;
  padding: 22px;
  text-align:center;
}
.qr-title{
  margin: 0 0 8px;
  font-size: clamp(18px, 2.4vw, 24px);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--gold2);
}
.qr-sub{
  margin: 0 0 16px;
  opacity: .85;
  line-height: 1.7;
  color: rgba(255,255,255,.78);
}
.qr-img{
  width: min(420px, 88vw);
  height: auto;
  display:block;
  margin: 14px auto 14px;
  border-radius: 16px;
  background: #fff;
  padding: 12px;
}
.qr-actions{
  display:flex;
  gap: 10px;
  justify-content:center;
  flex-wrap:wrap;
  margin-top: 10px;
}