:root{
  --bg:#f4f5fb;
  --ink:#12131a;
  --muted:rgba(18,19,26,.68);

  --card:#ffffff;
  --border:rgba(18,19,26,.10);

  --purple:#5b3df5;
  --purple2:#6a4bff;

  --orange1:#ffb45a;
  --orange2:#ff8a00;
  --orangeInk:#4a2a00;

  --radius:16px;
  --shadow:0 10px 30px rgba(10,12,20,.10);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background: var(--bg);
  color: var(--ink);
}

a{color:inherit; text-decoration:none}
a:hover{text-decoration:underline}

.container{ width:min(1180px, calc(100% - 40px)); margin:0 auto; }

/* =========================
   TOP BAR (PURPLE)
   ========================= */
.topbar{
  background: linear-gradient(180deg, var(--purple), var(--purple2));
  color:#fff;
  padding:18px 0;
  box-shadow:0 12px 28px rgba(40,25,150,.25);
}

.topbar__inner{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
}

.brand__row{
  display:flex;
  align-items:baseline;
  gap:12px;
  flex-wrap:wrap;
}

.brand__name{
  font-family:"Sora", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size:40px;
  font-weight:800;
  letter-spacing:-0.8px;
  line-height:1.0;
}

.brand__micro{
  font-size:13px;
  font-weight:800;
  color:var(--orangeInk);
  padding:6px 12px;
  border-radius:999px;
  background: linear-gradient(180deg, var(--orange1), var(--orange2));
  border:1px solid #ff7a00;
  box-shadow:0 6px 14px rgba(255,138,0,.35);
}

/* landing hero block under the orange pill */
.brand__tag{
  margin-top:10px;
  max-width:760px;
}

/* big statement (orange) */
.heroStatement{
  font-family:"Sora", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size:34px;
  font-weight:800;
  letter-spacing:-0.4px;
  line-height:1.12;
  margin-top:8px;
  color: var(--orange1);
  text-shadow:0 10px 28px rgba(0,0,0,.20);
}

.heroSub{
  margin-top:10px;
  font-size:14.5px;
  line-height:1.45;
  color:rgba(255,255,255,.92);
  max-width:720px;
}

.topnav{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:750;
  font-size:14px;
  opacity:.95;
  white-space:nowrap;
}

.dot{opacity:.75}

/* =========================
   LAYOUT
   ========================= */
.main{
  display:grid;
  grid-template-columns:360px 1fr;
  gap:18px;
  padding:18px 0 26px;
}

@media (max-width: 980px){
  .main{ grid-template-columns:1fr; }
  .topbar__inner{ flex-direction:column; }
  .topnav{ flex-wrap:wrap; }
  .heroStatement{ font-size:28px; }
}

.panel{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:16px;
  position:sticky;
  top:14px;
  align-self:start;
}

@media (max-width: 980px){
  .panel{ position:relative; top:0; }
}

.panel__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}

.panel__title{ font-weight:900; font-size:18px; }

.panel__intro{ color:var(--muted); line-height:1.45; }

.field{ margin-top:12px; }

.label{ font-weight:850; font-size:13px; color:var(--ink); }
.label--mini{ font-size:12px; font-weight:850; }

.help{ margin-top:4px; font-size:12px; color:var(--muted); }

input, select, textarea{
  width:100%;
  margin-top:8px;
  padding:12px 12px;
  border-radius:12px;
  border:1px solid var(--border);
  background:#fff;
  color:var(--ink);
  font-size:15px;
  outline:none;
}

textarea{
  min-height:96px;
  resize:vertical;
  line-height:1.35;
}

input:focus, select:focus, textarea:focus{
  border-color:rgba(91,61,245,.45);
  box-shadow:0 0 0 4px rgba(91,61,245,.14);
}

.row2{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.panel__actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.btn{
  border:1px solid var(--border);
  background:#fff;
  color:var(--ink);
  padding:11px 12px;
  border-radius:12px;
  font-weight:850;
  cursor:pointer;
  transition: transform .06s ease, box-shadow .12s ease;
}

.btn:active{ transform:scale(.99); }

.btn--primary{
  background:var(--purple);
  color:#fff;
  border-color:rgba(0,0,0,0);
  box-shadow:0 10px 18px rgba(91,61,245,.25);
}

.note{
  margin-top:12px;
  font-size:12px;
  color:var(--muted);
  line-height:1.45;
}

.content__top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding:8px 2px 0;
}

.h1{ margin:0; font-size:34px; letter-spacing:-0.4px; }

.sub{ margin-top:6px; color:var(--muted); line-height:1.45; }

.resultsMeta{ margin-top:10px; color:var(--muted); font-size:13px; }

.results{ margin-top:14px; }

/* Venue cards (results) */
.venue{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:14px;
  margin-bottom:12px;
}

.venue__row{
  display:grid;
  grid-template-columns:120px 1fr;
  gap:14px;
  align-items:start;
}

@media (max-width: 980px){
  .venue__row{ grid-template-columns:1fr; }
}

.venue__photo{
  width:100%;
  height:88px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.35);
  box-shadow:0 10px 18px rgba(10,12,20,.08);
}

/* Demo photo skins */
.img-a{ background: linear-gradient(135deg, rgba(91,61,245,.80), rgba(255,138,0,.55)); }
.img-b{ background: linear-gradient(135deg, rgba(20,180,150,.75), rgba(91,61,245,.55)); }
.img-c{ background: linear-gradient(135deg, rgba(255,100,140,.70), rgba(255,175,80,.55)); }

.venue__top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}

.venue__name{
  margin:0;
  font-weight:950;
  font-size:18px;
  letter-spacing:-0.2px;
}

.venue__area{ margin-top:4px; font-weight:850; color:var(--muted); }
.venue__addr{ margin-top:6px; color:var(--muted); font-size:13px; }

.venue__blurb{
  margin-top:8px;
  color:var(--ink);
  font-size:13px;
  line-height:1.45;
}

.venue__contact{
  margin-top:8px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  color:var(--muted);
  font-size:12px;
}

.contact__item{
  border:1px solid rgba(18,19,26,.10);
  padding:6px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.75);
}

.venue__tags{
  margin-top:10px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.pill{
  border:1px solid rgba(18,19,26,.10);
  background: rgba(91,61,245,.06);
  padding:7px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:850;
  color:#2c245a;
}

.pill--on{ background: rgba(20,180,150,.10); color:#0c4a3e; }
.pill--off{ background: rgba(255,120,120,.08); color:#6a1a1a; }

.footer{
  margin-top:18px;
  padding:18px 2px 0;
  color:var(--muted);
  font-size:12px;
  display:flex;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}

.footer__links{
  display:flex;
  gap:10px;
  align-items:center;
}

/* Guidance banners */
.banner{
  margin-top:12px;
  padding:14px 14px;
  border-radius:14px;
  border:1px solid var(--border);
  background: rgba(255,255,255,.85);
  box-shadow:0 10px 22px rgba(10,12,20,.07);
}

.banner--good{ font-size:16px; line-height:1.45; }
.banner--nomatch{ font-size:16px; font-weight:900; line-height:1.35; }

/* =========================
   REQUEST-HOLD PRIVACY BOX
   ========================= */
.privacyBox{
  margin-top:14px;
  background:#fff6ec;
  border:1px solid rgba(255,138,0,.35);
  border-radius:16px;
  box-shadow:0 10px 22px rgba(10,12,20,.06);
  padding:16px 18px;
}

.privacyPill{
  display:inline-block;
  font-size:12px;
  font-weight:900;
  color:var(--orangeInk);
  padding:6px 12px;
  border-radius:999px;
  background: linear-gradient(180deg, var(--orange1), var(--orange2));
  border:1px solid #ff7a00;
  box-shadow:0 6px 14px rgba(255,138,0,.25);
}

.privacyTitle{
  margin:10px 0 6px;
  font-family:"Sora", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight:900;
  font-size:20px;
  letter-spacing:-0.2px;
}

.privacyList{
  margin:10px 0 0;
  padding-left:18px;
  color:rgba(18,19,26,.78);
  line-height:1.55;
}

.privacyList li{ margin:8px 0; }


/* FORCE request-hold trust note to dark orange (override everything) */
.request-note,
.request-note *{
  color: var(--orangeInk) !important;
}

.request-note{
  background:#fff6ec !important;
  border:1px solid rgba(255,138,0,.40) !important;
  border-radius:16px !important;
  padding:18px 20px !important;
  box-shadow:0 10px 22px rgba(10,12,20,.06) !important;
  max-width: 980px !important;
  margin: 18px auto 12px !important;
}

.btn--claim{
  border-color: rgba(255,138,0,.35);
  background: rgba(255,138,0,.10);
  font-weight: 800;
}

.request-note__title{
  font-family:"Sora", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
  font-weight:950 !important;
  font-size:20px !important;
  letter-spacing:-0.2px !important;
  margin:0 0 10px 0 !important;
}

.request-note__list{
  font-size:15px !important;
  line-height:1.6 !important;
  margin:0 !important;
  padding-left:18px !important;
}

.request-note__list li{
  margin:7px 0 !important;
}

/* =========================
   Claim modal overlay (fix)
   ========================= */
.modal{
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: none;          /* IMPORTANT: keep it off the page */
}

.modal.is-open{
  display: block;
}

.modal__backdrop{
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.45);
}

.modal__panel{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  width: min(760px, calc(100vw - 24px));
  max-height: 86vh;
  overflow: auto;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 18px 60px rgba(0,0,0,.25);
  padding: 16px;
}

.modal__head{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.modal__kicker{
  font-size: 12px;
  font-weight: 800;
  opacity: .65;
  margin-bottom: 2px;
}

.modal__title{
  font-size: 22px;
  font-weight: 900;
  line-height: 1.2;
}

.iconBtn{
  border: 0;
  background: rgba(0,0,0,.06);
  width: 40px;
  height: 40px;
  border-radius: 10px;
  font-size: 22px;
  cursor: pointer;
}

.pillRow{
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin: 8px 0 10px;
}

.pill--muted{
  opacity: .7;
}

.hint{
  margin: 8px 0 12px;
  opacity: .75;
  font-weight: 600;
}

/* Modal-only field spacing (do not override site-wide .field) */
.modal .field{
  display: block;
  margin: 10px 0;
}


.field__label{
  display: block;
  font-weight: 800;
  margin-bottom: 6px;
}

.field__input{
  width: 100%;
  padding: 12px 12px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.12);
  outline: none;
}

.field__input:focus{
  border-color: rgba(91,61,245,.45);
  box-shadow: 0 0 0 4px rgba(91,61,245,.12);
}

.agree{
  display: flex;
  gap: 10px;
  align-items: center;
  margin-top: 10px;
  font-weight: 700;
}

.modal__actions{
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 12px;
}

.fineprint{
  margin-top: 10px;
  font-size: 12px;
  opacity: .7;
}

.btn--claim{
  border-color: rgba(255,138,0,.35);
  background: rgba(255,138,0,.10);
  font-weight: 800;
}

/* OpenRoom claim status box */
.claim-box{
  margin-top:12px;
  padding:12px 14px;
  border-radius:10px;
  font-size:13px;
  line-height:1.4;
  background:#f7f7fb;
  color:#333;
  border:1px solid rgba(0,0,0,.08);
}

.claim-box.verified{
  background:#eef8f1;
  border-color:#bfe5cc;
  color:#1f6b3a;
}

.claim-box.unclaimed{
  background:#fff4f4;
  border-color:#f2c4c4;
  color:#8a1f1f;
}

.smallNote{
  font-size:12px;
  color:#777;
  margin-top:10px;
  text-align:center;
}