:root{
  --navy:#14213A;
  --navy-deep:#0E1830;
  --manila:#F2E6C9;
  --brass:#C9972E;
  --brass-dark:#96701F;
  --green:#2F6844;
  --green-dark:#1F4530;
  --red:#B23A2F;
  --red-dark:#7E2820;
  --ink:#1F1B16;
  --paper-text-secondary:#5B5346;
  --offwhite:#F5F1E6;
  --offwhite-dim:#B9C0D4;
  --hairline: rgba(245,241,230,0.14);
}
*{box-sizing:border-box;}
body{
  margin:0;
  background:var(--navy);
  color:var(--offwhite);
  font-family:'Inter', sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;}

/* ---------- header ---------- */
header{
  padding:28px 6vw 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid var(--hairline);
}
.logo{
  font-family:'Fraunces', serif;
  font-weight:700;
  font-size:22px;
  letter-spacing:0.02em;
  display:flex;
  align-items:baseline;
  gap:8px;
  text-decoration:none;
  color:var(--offwhite);
}
.logo span{
  font-family:'JetBrains Mono', monospace;
  font-size:11px;
  font-weight:500;
  color:var(--brass);
  border:1px solid var(--brass);
  padding:2px 6px;
  border-radius:3px;
  letter-spacing:0.08em;
}
nav{
  font-size:14px;
  color:var(--offwhite-dim);
  display:flex;
  gap:28px;
}
nav a{text-decoration:none;}
nav a:hover{color:var(--offwhite);}

/* ---------- breadcrumb ---------- */
.breadcrumb{
  padding:20px 6vw 0;
  font-family:'JetBrains Mono', monospace;
  font-size:12px;
  color:var(--offwhite-dim);
}
.breadcrumb a{text-decoration:none;}
.breadcrumb a:hover{color:var(--offwhite);}
.breadcrumb span{color:var(--brass);}

/* ---------- hero ---------- */
.hero{padding:48px 6vw 40px; position:relative;}
.hero-eyebrow{
  font-family:'JetBrains Mono', monospace;
  font-size:12px; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--brass); margin:0 0 18px;
}
.hero h1{
  font-family:'Fraunces', serif; font-weight:600;
  font-size:clamp(32px, 4.6vw, 56px); line-height:1.06;
  margin:0 0 20px; max-width:16ch;
}
.hero h1 em{font-style:normal; color:var(--brass);}
.hero p{max-width:56ch; font-size:17px; line-height:1.6; color:var(--offwhite-dim); margin:0 0 28px;}
.hero-stats{display:flex; gap:36px; flex-wrap:wrap;}
.hero-stat .num{font-family:'JetBrains Mono', monospace; font-size:26px; font-weight:700; color:var(--offwhite);}
.hero-stat .lbl{font-size:12px; color:var(--offwhite-dim); text-transform:uppercase; letter-spacing:0.06em;}

/* ---------- filter bar ---------- */
.filter-bar{
  margin:0 6vw 8px; padding:14px 20px; background:var(--navy-deep);
  border:1px solid var(--hairline); border-radius:10px;
  display:flex; align-items:center; gap:16px; flex-wrap:wrap;
}
.chip{
  font-family:'JetBrains Mono', monospace; font-size:12px; padding:7px 14px;
  border-radius:20px; border:1px solid var(--hairline); background:transparent;
  color:var(--offwhite-dim); cursor:pointer;
}
.chip.active{background:var(--brass); border-color:var(--brass); color:var(--navy-deep); font-weight:700;}
.filter-bar input[type="text"]{
  margin-left:auto; background:var(--navy); border:1px solid var(--hairline);
  border-radius:8px; padding:8px 12px; color:var(--offwhite);
  font-family:'Inter', sans-serif; font-size:13px; min-width:200px;
}
.filter-bar input[type="text"]::placeholder{color:var(--offwhite-dim);}

/* ---------- section intro (hub pages) ---------- */
.section-intro{
  padding:8px 6vw 0;
  max-width:70ch;
  font-size:15px;
  line-height:1.7;
  color:var(--offwhite-dim);
}
.section-intro strong{color:var(--offwhite);}

/* ---------- ticket grid ---------- */
.grid{padding:32px 6vw 20px; display:grid; grid-template-columns:repeat(auto-fill, minmax(320px, 1fr)); gap:28px;}

.ticket{
  background:var(--manila); color:var(--ink); border-radius:10px; overflow:hidden;
  display:flex; flex-direction:column; box-shadow:0 14px 30px rgba(0,0,0,0.28); position:relative;
}
.ticket-photo{height:170px; background-size:cover; background-position:center; position:relative;}
.stamp{
  position:absolute; top:14px; right:14px; font-family:'JetBrains Mono', monospace;
  font-size:11px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase;
  padding:5px 10px; border-radius:4px; transform:rotate(6deg); border:2px solid;
  background:rgba(242,230,201,0.92);
}
.stamp.open{color:var(--green-dark); border-color:var(--green);}
.stamp.soon{color:var(--red-dark); border-color:var(--red);}
.stamp.closed{color:#6b6459; border-color:#6b6459;}
.ticket-organiser{
  position:absolute; left:0; bottom:0;
  background:linear-gradient(0deg, rgba(20,33,58,0.82), transparent);
  color:var(--offwhite); width:100%; padding:24px 16px 10px; font-size:13px;
}
.ticket-organiser .value{font-family:'Fraunces', serif; font-weight:600; font-size:20px; display:block;}

.perforation{position:relative; height:0; border-top:2px dashed var(--brass-dark); margin:0 16px;}
.perforation::before, .perforation::after{
  content:""; position:absolute; top:-9px; width:18px; height:18px; border-radius:50%; background:var(--navy);
}
.perforation::before{left:-24px;}
.perforation::after{right:-24px;}

.stub{padding:16px; display:flex; flex-direction:column; gap:12px; flex:1;}
.stub-row{display:flex; justify-content:space-between; font-size:13px;}
.stub-row .lbl{color:var(--paper-text-secondary); text-transform:uppercase; letter-spacing:0.04em; font-size:11px;}
.stub-row .val{font-family:'JetBrains Mono', monospace; font-weight:700;}
.serial{font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--paper-text-secondary); letter-spacing:0.05em;}
.stub-actions{margin-top:auto; display:flex; gap:8px;}
.btn-enter{
  flex:1; text-align:center; background:var(--green); color:var(--offwhite);
  text-decoration:none; font-weight:600; font-size:13px; padding:10px 12px; border-radius:6px;
}
.btn-enter:hover{background:var(--green-dark);}
.btn-tc{
  background:transparent; border:1px solid var(--paper-text-secondary); color:var(--ink);
  text-decoration:none; font-size:13px; padding:10px 12px; border-radius:6px; white-space:nowrap;
}
.btn-tc:hover{background:rgba(0,0,0,0.05);}

/* ---------- listing detail page ---------- */
.detail{padding:8px 6vw 0; display:grid; grid-template-columns:1.3fr 1fr; gap:36px;}
.detail-photo{
  height:340px; border-radius:10px; background-size:cover; background-position:center;
  position:relative;
}
.detail-body h1{
  font-family:'Fraunces', serif; font-weight:600; font-size:clamp(26px, 3.2vw, 38px);
  line-height:1.1; margin:16px 0 6px;
}
.detail-org{font-size:14px; color:var(--offwhite-dim); margin:0 0 20px;}
.detail-card{
  background:var(--manila); color:var(--ink); border-radius:10px; padding:20px; align-self:start;
}
.detail-card .stub-row{border-bottom:1px solid rgba(31,27,22,0.1); padding-bottom:10px; margin-bottom:2px;}
.detail-card .stub-row:last-of-type{border-bottom:none;}
.detail-card .serial{margin-bottom:6px;}
.detail-check{
  margin:24px 6vw 0; padding:18px 20px; border:1px solid var(--hairline); border-radius:10px;
  font-size:13px; line-height:1.7; color:var(--offwhite-dim); max-width:70ch;
}
.detail-check strong{color:var(--offwhite); font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.06em; text-transform:uppercase; display:block; margin-bottom:8px;}

.related{padding:40px 6vw 8px;}
.related h2{
  font-family:'JetBrains Mono', monospace; font-size:12px; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--brass); margin:0 0 16px;
}
.related-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr)); gap:16px;}
.mini-ticket{
  background:var(--manila); color:var(--ink); border-radius:8px; padding:14px; text-decoration:none;
  display:block;
}
.mini-ticket .m-org{font-family:'Fraunces', serif; font-weight:600; font-size:15px; display:block; margin-bottom:4px;}
.mini-ticket .m-meta{font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--paper-text-secondary);}

/* ---------- footer ---------- */
footer{margin-top:40px; padding:36px 6vw 48px; border-top:1px solid var(--hairline); font-size:13px; color:var(--offwhite-dim); line-height:1.7;}
footer strong{color:var(--offwhite);}
footer .cols{display:flex; gap:60px; flex-wrap:wrap; margin-bottom:24px;}
footer .col h4{font-family:'JetBrains Mono', monospace; font-size:12px; letter-spacing:0.06em; text-transform:uppercase; color:var(--brass); margin:0 0 10px;}
footer .col a{display:block; text-decoration:none; margin-bottom:6px; color:var(--offwhite-dim);}
footer .col a:hover{color:var(--offwhite);}

@media (max-width:640px){
  header{flex-direction:column; align-items:flex-start; gap:14px;}
  .filter-bar input[type="text"]{margin-left:0; width:100%;}
  .detail{grid-template-columns:1fr;}
}