/* =====================================================================
   TheSteamery.com — stylesheet
   Editorial look: outlined cards, pill buttons, teal brand, dark hero.
   ===================================================================== */

:root{
  --teal:#0E7C7B; --teal-dark:#0B5E5D; --teal-tint:#EAF6F5;
  --aqua:#2EC4B6; --amber:#C9772F;
  --ink:#0B2E33; --ink-soft:#3C5458; --ink-faint:#6E8488;
  --line:#D2E4E2; --paper:#fff; --wash:#F4FAF9;
  --ok:#0E7C7B; --err:#A3322A;
  --tier-ready:#C9772F; --tier-active:#0E7C7B; --tier-warm:#2EC4B6; --tier-nurture:#6E8488;
  --shadow:0 1px 2px rgba(11,46,51,.04), 0 8px 24px rgba(11,46,51,.05);
  --radius:12px; --radius-lg:16px;
  --serif:"Newsreader",Georgia,"Times New Roman",serif;
  --sans:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; font-family:var(--sans); color:var(--ink); background:var(--paper);
  line-height:1.6; font-size:16px; -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:var(--teal);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;line-height:1.18;color:var(--ink);margin:0 0 .5em}
h1 em,h2 em{font-style:italic;color:var(--teal)}
p{margin:0 0 1em}
main{display:block;min-height:50vh}
code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.86em;background:var(--teal-tint);padding:2px 6px;border-radius:5px}
hr{border:none;border-top:1.5px solid var(--line);margin:28px 0}

.wrap{max-width:1140px;margin:0 auto;padding:0 22px}

/* ---- sections / bands ---- */
.band{padding:64px 0}
.band--tint{background:var(--wash);border-top:1.5px solid var(--line);border-bottom:1.5px solid var(--line)}
.section-title{font-size:30px;margin:0 0 28px}
.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:18px;margin:0 0 24px;flex-wrap:wrap}
.section-head .section-title,.section-head .page-title{margin:0}
.section-lede{font-size:18px;color:var(--ink-soft);max-width:60ch;margin:-14px 0 30px}
.kicker{display:inline-block;font-family:var(--sans);font-weight:700;font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--teal);margin:0 0 14px}
.kicker--onhero{color:var(--aqua)}

/* ---- header / nav ---- */
.site-head{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.92);backdrop-filter:saturate(140%) blur(8px);border-bottom:1.5px solid var(--line)}
.site-head__in{display:flex;align-items:center;gap:22px;height:68px}
.brand{display:inline-flex;align-items:center;gap:9px;font-family:var(--sans);font-weight:800;font-size:19px;letter-spacing:-.02em;color:var(--ink)}
.brand:hover{text-decoration:none}
.brand__word{color:var(--ink)}
.brand__dot{color:var(--aqua)}
.brand__tm{font-size:.5em;vertical-align:super;font-weight:700;margin-left:.5px}
.brand__word--lg{font-size:22px}
.brand__pill{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:var(--teal-tint);color:var(--teal-dark);border:1.5px solid var(--teal);padding:3px 9px;border-radius:999px;margin-left:2px}
.site-nav{display:flex;align-items:center;gap:8px;margin-left:auto}
.site-nav a{color:var(--ink-soft);font-weight:600;font-size:14.5px;padding:8px 12px;border-radius:9px}
.site-nav a:hover{color:var(--ink);background:var(--teal-tint);text-decoration:none}
.site-nav .nav-admin{color:var(--amber)}
.nav-toggle{display:none;margin-left:auto;border:1.5px solid var(--ink);background:#fff;border-radius:9px;width:42px;height:38px;cursor:pointer;align-items:center;justify-content:center}
.nav-toggle span,.nav-toggle span::before,.nav-toggle span::after{display:block;width:18px;height:2px;background:var(--ink);position:relative;content:""}
.nav-toggle span::before{position:absolute;top:-6px}
.nav-toggle span::after{position:absolute;top:6px}

/* ---- buttons ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--sans);font-weight:700;font-size:15px;line-height:1;padding:13px 24px;border-radius:999px;border:1.5px solid transparent;cursor:pointer;text-decoration:none;transition:background .15s,color .15s,border-color .15s,transform .05s;white-space:nowrap}
.btn:hover{text-decoration:none}
.btn:active{transform:translateY(1px)}
.btn--teal{background:var(--teal);color:#fff;border-color:var(--teal)}
.btn--teal:hover{background:var(--teal-dark);border-color:var(--teal-dark)}
.btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.btn--ghost:hover{background:rgba(255,255,255,.12);border-color:#fff}
.btn--dark{background:var(--ink);color:#fff;border-color:var(--ink)}
.btn--dark:hover{background:#08252a}
.btn--outline{background:#fff;color:var(--ink);border-color:var(--ink)}
.btn--outline:hover{background:var(--teal-tint)}
.btn--danger{background:#fff;color:var(--err);border-color:var(--err)}
.btn--danger:hover{background:var(--err);color:#fff}
.btn--block{display:flex;width:100%}
.btn--sm{padding:9px 16px;font-size:13.5px}
.btn--xs{padding:6px 12px;font-size:12.5px}
.btn.is-disabled,.btn:disabled{opacity:.5;pointer-events:none}

.link-arrow{font-weight:700;font-size:14.5px;color:var(--teal);white-space:nowrap}
.link-arrow:hover{color:var(--teal-dark)}

/* ---- hero ---- */
.hero{background:var(--ink);color:#eaf6f5;position:relative;overflow:hidden;padding:84px 0}
.hero::after{content:"";position:absolute;right:-12%;top:-30%;width:560px;height:560px;border-radius:50%;background:radial-gradient(circle at 30% 30%, rgba(46,196,182,.30), transparent 62%);pointer-events:none}
.hero--sub{padding:64px 0}
.hero__in{position:relative;z-index:1;max-width:760px}
.hero__title{font-size:clamp(34px,5vw,56px);line-height:1.06;color:#fff;margin:0 0 18px}
.hero__title em{color:var(--aqua)}
.hero__sub{font-size:19px;color:#cfe6e3;max-width:60ch;margin:0 0 28px}
.hero__cta{display:flex;gap:14px;flex-wrap:wrap}

/* ---- trust strip ---- */
.trust-strip{display:flex;flex-wrap:wrap;gap:14px;margin-top:36px;position:relative;z-index:1}
.trust-cell{background:rgba(255,255,255,.07);border:1.5px solid rgba(255,255,255,.16);border-radius:12px;padding:14px 18px;min-width:150px}
.trust-cell b{display:block;font-family:var(--serif);font-size:26px;color:#fff;line-height:1.1}
.trust-cell span{font-size:13px;color:#bcdedb;letter-spacing:.02em}

/* ---- grids ---- */
.grid{display:grid;gap:22px}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}

/* ---- home: pick-cards ---- */
.pick-card{display:flex;flex-direction:column;gap:8px;background:#fff;border:1.5px solid var(--ink);border-radius:var(--radius);padding:24px;transition:transform .12s,box-shadow .12s}
.pick-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);text-decoration:none}
.pick-card h3{margin:0;font-size:20px}
.pick-card p{margin:0;color:var(--ink-soft);font-size:15px}
.pick-card__go{margin-top:auto;padding-top:10px;font-weight:700;color:var(--teal)}

/* ---- steps ---- */
.steps{counter-reset:step}
.step{background:#fff;border:1.5px solid var(--line);border-radius:var(--radius);padding:22px}
.step__n{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:999px;background:var(--ink);color:#fff;font-family:var(--sans);font-weight:800;font-size:15px;margin-bottom:12px}
.step h4{margin:0 0 6px;font-size:17px}
.step p{margin:0;color:var(--ink-soft);font-size:14.5px}

/* ---- why grid ---- */
.why{background:#fff;border:1.5px solid var(--line);border-radius:var(--radius);padding:22px}
.why h4{margin:0 0 6px;font-size:17px}
.why p{margin:0;color:var(--ink-soft);font-size:14.5px}

/* ---- tier explainer ---- */
.tier-explain{background:#fff;border:1.5px solid var(--line);border-radius:var(--radius);padding:20px}
.tier-explain p{margin:10px 0 0;color:var(--ink-soft);font-size:14px}

/* ---- split cards ---- */
.split-card{background:#fff;border:1.5px solid var(--ink);border-radius:var(--radius);padding:26px}
.split-card h3{font-size:21px;margin:0 0 8px}
.split-card p{color:var(--ink-soft);margin:0 0 14px}

/* ---- compliance ---- */
.compliance .dd-note{margin-top:26px}

/* ---- cta strip ---- */
.cta-strip{background:var(--ink);color:#fff;padding:52px 0}
.cta-strip__in{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.cta-strip h2{color:#fff;margin:0 0 4px}
.cta-strip p{color:#cfe6e3;margin:0}

/* ---- dd note ---- */
.dd-note{font-size:13.5px;color:var(--ink-faint);background:var(--teal-tint);border:1.5px solid var(--line);border-radius:10px;padding:13px 16px;line-height:1.5}

/* =====================================================================
   Badges / chips / tiers
   ===================================================================== */
.badge{display:inline-flex;align-items:center;gap:6px;font-family:var(--sans);font-weight:700;font-size:11.5px;letter-spacing:.04em;text-transform:uppercase;padding:4px 10px;border-radius:999px;border:1.5px solid var(--line);background:#fff;color:var(--ink-soft);line-height:1.4}
.badge--service{background:var(--teal-tint);color:var(--teal-dark);border-color:var(--teal)}
.badge--featured{background:var(--amber);color:#fff;border-color:var(--amber)}
.badge--tier{color:#fff;border:none}
.badge.tier-ready{background:var(--tier-ready)}
.badge.tier-active{background:var(--tier-active)}
.badge.tier-warm{background:var(--tier-warm);color:var(--ink)}
.badge.tier-nurture{background:var(--tier-nurture)}

.chip{display:inline-flex;align-items:center;font-family:var(--sans);font-weight:700;font-size:12px;padding:4px 11px;border-radius:999px;border:1.5px solid var(--line);background:#fff;color:var(--ink-soft)}
.chip--excl{border-color:var(--amber);color:var(--amber);background:#fdf3ec}
.chip--xs{font-size:10.5px;padding:2px 8px}

/* =====================================================================
   Lead cards
   ===================================================================== */
.lead-card{display:flex;flex-direction:column;background:#fff;border:1.5px solid var(--ink);border-radius:var(--radius);overflow:hidden;transition:transform .12s,box-shadow .12s}
.lead-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.lead-card__top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:16px 18px 0}
.lead-card__price{font-family:var(--serif);font-size:22px;font-weight:600;color:var(--ink);white-space:nowrap}
.lead-card__region{padding:10px 18px 0;font-weight:700;font-size:15px;color:var(--ink)}
.lead-card__chips{display:flex;flex-wrap:wrap;gap:7px;padding:12px 18px 0}
.lead-card__quote{padding:12px 18px 0;color:var(--ink-soft);font-size:14px;font-style:italic}
.lead-card__foot{margin-top:auto;padding:16px 18px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.lead-card__foot .muted{font-size:13px;color:var(--ink-faint)}

/* =====================================================================
   Browse layout
   ===================================================================== */
.browse{padding:34px 0 70px}
.browse__in{display:grid;grid-template-columns:248px 1fr;gap:30px;align-items:start}
.browse__side{position:sticky;top:88px;background:#fff;border:1.5px solid var(--line);border-radius:var(--radius);padding:18px}
.browse__main{min-width:0}
.browse__count{font-size:14px;color:var(--ink-faint);margin:0 0 16px}
.side-title{font-family:var(--sans);font-weight:800;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);margin:18px 0 8px}
.side-title:first-child{margin-top:0}
.side-list{list-style:none;margin:0 0 6px;padding:0}
.side-list li{margin:0}
.side-list a{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:7px 10px;border-radius:8px;color:var(--ink-soft);font-size:14px;font-weight:600}
.side-list a:hover{background:var(--teal-tint);color:var(--ink);text-decoration:none}
.side-list a .c{font-size:12px;color:var(--ink-faint);font-weight:600}
.side-list a.is-active{background:var(--ink);color:#fff}
.side-list a.is-active .c{color:#bcdedb}

.filter-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;background:#fff;border:1.5px solid var(--line);border-radius:var(--radius);padding:12px 14px;margin:0 0 20px}
.filter-bar input,.filter-bar select{padding:9px 11px;border:1.5px solid var(--line);border-radius:9px;font-size:14px;font-family:var(--sans);color:var(--ink)}
.filter-bar input:focus,.filter-bar select:focus{outline:2px solid var(--teal);border-color:var(--teal)}
.filter-bar .px{flex:1;min-width:120px}

.empty{text-align:center;background:#fff;border:1.5px dashed var(--line);border-radius:var(--radius-lg);padding:54px 24px;color:var(--ink-soft)}
.empty h3{font-size:21px;margin:0 0 8px}
.empty p{margin:0 auto;max-width:46ch}

/* ---- pager ---- */
.pager{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin:30px 0 0}
.pager a{min-width:40px;text-align:center;padding:9px 13px;border:1.5px solid var(--line);border-radius:9px;color:var(--ink-soft);font-weight:700;font-size:14px}
.pager a:hover{background:var(--teal-tint);text-decoration:none}
.pager a.is-active{background:var(--ink);color:#fff;border-color:var(--ink)}

/* =====================================================================
   Single lead page
   ===================================================================== */
.lead-page{padding:30px 0 70px}
.lead-page__in{display:grid;grid-template-columns:1fr 340px;gap:34px;align-items:start}
.lead-page__main{min-width:0}
.lead-page__buy{position:sticky;top:88px}
.back-link{display:inline-block;font-weight:700;font-size:14px;color:var(--ink-soft);margin:0 0 16px}
.lead-page__badges{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.lead-page__title{font-size:32px;margin:0 0 6px}
.lead-page__region{font-size:17px;font-weight:700;color:var(--ink-soft);margin:0 0 24px}

.spec-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5px;background:var(--line);border:1.5px solid var(--line);border-radius:var(--radius);overflow:hidden;margin:0 0 24px}
.spec{background:#fff;padding:15px 18px}
.spec span{display:block;font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-faint);font-weight:700;margin:0 0 3px}
.spec b{font-family:var(--sans);font-weight:700;font-size:15.5px;color:var(--ink)}

.lead-note{background:var(--wash);border:1.5px solid var(--line);border-radius:var(--radius);padding:20px 22px;margin:0 0 22px}
.lead-note h3{font-size:16px;margin:0 0 8px}
.lead-note__quote{font-family:var(--serif);font-size:18px;font-style:italic;color:var(--ink);line-height:1.5;margin:0}

/* ---- buy box ---- */
.buy-box{background:#fff;border:1.5px solid var(--ink);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow)}
.buy-box__price{font-family:var(--serif);font-size:38px;font-weight:600;color:var(--ink);line-height:1;margin:0 0 4px}
.buy-box__price small{font-family:var(--sans);font-size:14px;font-weight:600;color:var(--ink-faint)}
.buy-box__cap{font-size:13.5px;color:var(--ink-soft);margin:0 0 18px}
.buy-box .btn{margin-top:6px}
.buy-box__soldout{background:#fdf3ec;border:1.5px solid var(--amber);color:var(--amber);border-radius:10px;padding:12px 14px;font-weight:700;text-align:center}
.buy-box__fine{font-size:12.5px;color:var(--ink-faint);margin:14px 0 0;line-height:1.5}

.contact-panel{margin-top:6px}
.contact-panel h3{font-size:16px;margin:0 0 12px}
.contact-row{display:flex;flex-direction:column;gap:2px;padding:11px 0;border-top:1.5px solid var(--line)}
.contact-row:first-of-type{border-top:none}
.contact-row span{font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-faint);font-weight:700}
.contact-row a,.contact-row b{font-size:16px;font-weight:700;color:var(--ink);word-break:break-word}

/* ---- the gate ---- */
.gate{position:relative;border:1.5px dashed var(--line);border-radius:var(--radius);overflow:hidden;margin-top:6px}
.gate__rows{padding:8px 16px;filter:blur(4px);user-select:none;pointer-events:none}
.gate__row{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-top:1.5px solid var(--line)}
.gate__row:first-child{border-top:none}
.gate__row span{color:var(--ink-faint);font-weight:700;font-size:13px;text-transform:uppercase}
.gate__row b{color:var(--ink)}
.gate__lock{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:rgba(244,250,249,.72);text-align:center;padding:18px}
.gate__lock .ico{font-size:24px}
.gate__lock p{margin:0;font-weight:700;color:var(--ink);font-size:14px}

/* =====================================================================
   Result cards (checkout success / removal request)
   ===================================================================== */
.result-card{background:#fff;border:1.5px solid var(--ink);border-radius:var(--radius-lg);padding:38px 30px;text-align:center;box-shadow:var(--shadow)}
.result-card--ok{border-color:var(--teal)}
.result-card__icon{width:62px;height:62px;border-radius:999px;background:var(--teal);color:#fff;display:flex;align-items:center;justify-content:center;font-size:30px;margin:0 auto 18px}
.result-card h2{font-size:26px;margin:0 0 8px}
.result-card p{color:var(--ink-soft);max-width:48ch;margin:0 auto 8px}
.result-card__actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:22px}

/* =====================================================================
   Page headers / narrow wrappers
   ===================================================================== */
.page-title{font-size:34px;margin:0 0 8px}
.page-lede{font-size:18px;color:var(--ink-soft);max-width:60ch;margin:0 0 28px}
.narrow{max-width:560px;margin:0 auto}
.narrow--left{margin:0;max-width:640px}

/* ---- legal ---- */
.legal{font-size:15.5px;color:var(--ink-soft)}
.legal h3{font-size:19px;color:var(--ink);margin:26px 0 8px}
.legal p{margin:0 0 14px}
.legal__meta{font-size:13.5px;color:var(--ink-faint);font-style:italic;margin:0 0 22px}

/* =====================================================================
   Forms
   ===================================================================== */
.form-card{background:#fff;border:1.5px solid var(--ink);border-radius:var(--radius-lg);padding:28px;box-shadow:var(--shadow)}
.form-section{font-family:var(--serif);font-size:19px;margin:0 0 14px;padding-bottom:8px;border-bottom:1.5px solid var(--line)}
.form-section:not(:first-child){margin-top:26px}
.form-hint{font-size:14px;color:var(--ink-faint);margin:-8px 0 14px}
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.form-grid--2{grid-template-columns:repeat(2,1fr)}
.field{display:flex;flex-direction:column;gap:6px;margin:0 0 16px}
.field>span{font-weight:700;font-size:13.5px;color:var(--ink)}
.field>span small{font-weight:400;color:var(--ink-faint)}
.field input,.field select,.field textarea{font-family:var(--sans);font-size:15px;color:var(--ink);padding:11px 13px;border:1.5px solid var(--line);border-radius:10px;background:#fff;width:100%}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--teal);border-color:var(--teal)}
.field input:disabled{background:var(--wash);color:var(--ink-faint)}
.field textarea{resize:vertical;min-height:84px}
.field--full{grid-column:1/-1}
.field--check{flex-direction:row;align-items:flex-start;gap:10px}
.field--check input{width:auto;margin-top:3px;flex:none}
.field--check span{font-weight:600;font-size:14.5px;color:var(--ink-soft)}
.form-foot{text-align:center;font-size:14.5px;color:var(--ink-soft);margin:18px 0 0}
.form-errors{background:#fbeeec;border:1.5px solid var(--err);border-radius:10px;padding:14px 18px;margin:0 0 20px;color:var(--err)}
.form-errors ul{margin:0;padding-left:18px}
.form-errors li{margin:3px 0}

/* honeypot — must stay invisible */
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

/* ---- KPI row (account) ---- */
.kpi-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:0 0 30px}
.kpi{background:#fff;border:1.5px solid var(--line);border-radius:var(--radius);padding:18px 20px}
.kpi span{display:block;font-size:13px;color:var(--ink-faint);font-weight:600;margin:0 0 4px}
.kpi b{font-family:var(--serif);font-size:26px;font-weight:600;color:var(--ink)}

/* =====================================================================
   Tables (public)
   ===================================================================== */
.table-wrap{overflow-x:auto;border:1.5px solid var(--line);border-radius:var(--radius);background:#fff}
.data-table{width:100%;border-collapse:collapse;font-size:14.5px}
.data-table th{text-align:left;font-family:var(--sans);font-weight:700;font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-faint);padding:12px 14px;border-bottom:1.5px solid var(--line);white-space:nowrap;background:var(--wash)}
.data-table td{padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top}
.data-table tr:last-child td{border-bottom:none}
.data-table--mini th,.data-table--mini td{padding:9px 12px}
.data-table--rows tr:hover td{background:var(--wash)}
.data-table .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.data-table .nowrap{white-space:nowrap}
.data-table .muted{color:var(--ink-faint)}
.muted{color:var(--ink-faint)}

/* =====================================================================
   Footer (public)
   ===================================================================== */
.site-foot{background:var(--ink);color:#bcdedb;padding:54px 0 30px;margin-top:0}
.site-foot__in{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:30px}
.site-foot .brand__word{color:#fff}
.foot-tag{font-size:14px;color:#9fc4c1;margin:12px 0 0;max-width:34ch}
.foot-col h5{font-family:var(--sans);font-weight:800;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#7fa9a6;margin:0 0 12px}
.foot-col a{display:block;color:#cfe6e3;font-size:14.5px;padding:4px 0}
.foot-col a:hover{color:#fff}
.site-foot__base{border-top:1.5px solid rgba(255,255,255,.12);margin-top:38px;padding-top:22px;font-size:13px;color:#8fb6b3;line-height:1.6}
.site-foot__base .dd{margin-top:8px;color:#7fa9a6}

/* =====================================================================
   Flash messages (public)
   ===================================================================== */
.flash{position:fixed;top:80px;right:20px;z-index:60;max-width:340px;display:flex;flex-direction:column;gap:10px}
.flash>div{background:var(--ink);color:#fff;padding:13px 18px;border-radius:11px;box-shadow:var(--shadow);font-size:14.5px;font-weight:600;border-left:4px solid var(--aqua)}
.flash--ok>div{border-left-color:var(--ok)}
.flash--err>div{border-left-color:var(--err)}

/* =====================================================================
   ADMIN
   ===================================================================== */
.admin-body{background:var(--wash)}
.admin-shell{display:grid;grid-template-columns:240px 1fr;min-height:100vh}
.admin-side{background:var(--ink);color:#cfe6e3;padding:22px 16px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;overflow-y:auto}
.admin-brand{display:flex;flex-direction:column;gap:2px;color:#fff;margin:0 0 26px;padding:0 8px}
.admin-brand .brand__word{font-family:var(--sans);font-weight:800;font-size:18px;color:#fff}
.admin-brand .brand__dot{color:var(--aqua)}
.admin-brand__tag{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#7fa9a6}
.admin-nav{display:flex;flex-direction:column;gap:22px;flex:1}
.admin-nav__group{display:flex;flex-direction:column;gap:2px}
.admin-nav a{display:block;color:#bcdedb;font-weight:600;font-size:14.5px;padding:9px 12px;border-radius:9px}
.admin-nav a:hover{background:rgba(255,255,255,.08);color:#fff;text-decoration:none}
.admin-nav a.is-active{background:var(--teal);color:#fff}
.admin-nav__group--foot{margin-top:auto;border-top:1.5px solid rgba(255,255,255,.12);padding-top:14px}
.admin-nav__group--foot a{color:#9fc4c1;font-size:13.5px}

.admin-main{min-width:0;padding:26px 30px 60px}
.admin-head{display:flex;align-items:baseline;justify-content:space-between;gap:18px;margin:0 0 24px;flex-wrap:wrap}
.admin-head h1{font-size:27px;margin:0}
.admin-who{font-size:13.5px;color:var(--ink-faint);font-weight:600}
.admin-content{min-width:0}

.admin-flash{border-radius:11px;padding:13px 18px;margin:0 0 20px;font-weight:600;font-size:14.5px;border-left:4px solid var(--aqua);background:#fff;border:1.5px solid var(--line)}
.admin-flash--ok{border-left-color:var(--ok)}
.admin-flash--err{border-left-color:var(--err);color:var(--err)}

/* ---- KPI grid ---- */
.kpi-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin:0 0 26px}
.kpi-card{background:#fff;border:1.5px solid var(--line);border-radius:var(--radius);padding:16px 18px}
.kpi-card span{display:block;font-size:12.5px;color:var(--ink-faint);font-weight:600;margin:0 0 6px}
.kpi-card b{display:block;font-family:var(--serif);font-size:27px;font-weight:600;color:var(--ink);line-height:1.05}
.kpi-card small{display:block;font-size:12px;color:var(--ink-faint);margin-top:4px}
.kpi-card--accent{background:var(--ink);border-color:var(--ink)}
.kpi-card--accent span{color:#9fc4c1}
.kpi-card--accent b{color:#fff}
.kpi-card--accent small{color:#9fc4c1}

/* ---- admin panels / columns ---- */
.admin-panel{background:#fff;border:1.5px solid var(--line);border-radius:var(--radius);padding:22px;margin:0 0 24px}
.admin-panel h2{font-size:18px;margin:0 0 16px}
.admin-cols{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.admin-cols .admin-panel{margin:0}

/* ---- toolbar / filters ---- */
.admin-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 18px;flex-wrap:wrap}
.admin-filter{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.admin-filter input,.admin-filter select{font-family:var(--sans);font-size:14px;color:var(--ink);padding:9px 12px;border:1.5px solid var(--line);border-radius:9px;background:#fff}
.admin-filter input:focus,.admin-filter select:focus{outline:2px solid var(--teal);border-color:var(--teal)}
.admin-filter input[type=search]{min-width:240px}

/* ---- bulk bar ---- */
.bulk-bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:#fff;border:1.5px solid var(--line);border-radius:var(--radius);padding:11px 16px;margin:0 0 14px}
.bulk-bar__all{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:600;color:var(--ink-soft)}
.bulk-bar__all input{flex:none}
.bulk-bar__sep{flex:1}

/* ---- status pills ---- */
.status-pill{display:inline-flex;align-items:center;font-family:var(--sans);font-weight:700;font-size:11.5px;letter-spacing:.02em;padding:4px 11px;border-radius:999px;background:var(--teal-tint);color:var(--ink-soft);white-space:nowrap;text-transform:capitalize}
.status-new{background:#eef4ff;color:#2b4a8b}
.status-available{background:#e7f6f0;color:#0b6b4f}
.status-reserved{background:#fff3e0;color:#9a5a17}
.status-sold_out{background:#fdecea;color:#a3322a}
.status-archived{background:#eef1f1;color:#647072}
.status-paid{background:#e7f6f0;color:#0b6b4f}
.status-pending{background:#fff3e0;color:#9a5a17}
.status-refunded{background:#eef1f1;color:#647072}
.status-failed{background:#fdecea;color:#a3322a}

/* ---- dots ---- */
.dot{display:inline-block;width:10px;height:10px;border-radius:999px;background:#cdd9d8;border:1.5px solid #b8c8c6;vertical-align:middle}
.dot--on{background:var(--ok);border-color:var(--ok)}
.dot--warn{background:var(--amber);border-color:var(--amber)}

/* ---- checkbox cell ---- */
.cbx{width:34px;text-align:center}
.cbx input{cursor:pointer}

/* ---- admin form ---- */
.admin-form{background:transparent}
.admin-form__cols{display:grid;grid-template-columns:1fr 1fr;gap:30px}
.admin-form__col{background:#fff;border:1.5px solid var(--line);border-radius:var(--radius);padding:22px}
.admin-form__actions{display:flex;gap:12px;align-items:center;margin-top:22px;flex-wrap:wrap}
.admin-form__del{margin-left:auto}
.gated-tag{display:inline-block;font-family:var(--sans);font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:#fdf3ec;color:var(--amber);border:1.5px solid var(--amber);padding:2px 8px;border-radius:999px;vertical-align:middle;margin-left:6px}

/* ---- map table / upload / import ---- */
.map-table td{vertical-align:middle}
.map-table select{font-family:var(--sans);font-size:14px;padding:8px 11px;border:1.5px solid var(--line);border-radius:9px;width:100%;max-width:260px}
.upload-form{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:6px 0}
.upload-form input[type=file]{font-size:14px}
.import-opts{display:flex;align-items:flex-end;gap:24px;flex-wrap:wrap;margin:20px 0 0;padding:18px 0 0;border-top:1.5px solid var(--line)}
.import-opts .field{margin:0}
.toggle-row{margin:18px 0 0;padding:16px 0 0;border-top:1.5px solid var(--line)}

/* ---- confirm box ---- */
.confirm-box{background:#fff;border:1.5px solid var(--err);border-radius:var(--radius-lg);padding:28px;max-width:560px}
.confirm-box h2{font-size:22px;margin:0 0 8px}
.confirm-box p{color:var(--ink-soft);margin:0 0 18px}
.confirm-box form{display:flex;gap:12px;flex-wrap:wrap}

/* ---- inline form / role select ---- */
.inline-form{display:inline-flex;margin:0}
.role-select{font-family:var(--sans);font-size:13px;font-weight:600;padding:6px 9px;border:1.5px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);cursor:pointer}
.role-select:focus{outline:2px solid var(--teal);border-color:var(--teal)}

/* ---- env table ---- */
.env-table td:first-child{font-weight:600;color:var(--ink-soft);width:42%}
.env-table code{font-size:12.5px}

/* =====================================================================
   Responsive
   ===================================================================== */
@media (max-width:1080px){
  .kpi-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:980px){
  .browse__in{grid-template-columns:1fr}
  .browse__side{position:static;top:auto}
  .lead-page__in{grid-template-columns:1fr}
  .lead-page__buy{position:static;top:auto}
  .admin-form__cols{grid-template-columns:1fr}
}
@media (max-width:860px){
  .nav-toggle{display:inline-flex}
  .site-nav{display:none;position:absolute;top:68px;left:0;right:0;flex-direction:column;align-items:stretch;gap:2px;background:#fff;border-bottom:1.5px solid var(--line);padding:12px 16px 18px;box-shadow:var(--shadow)}
  .site-nav.is-open{display:flex}
  .site-nav a{padding:11px 12px}
  .grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}
  .site-foot__in{grid-template-columns:1fr 1fr}
  .admin-cols{grid-template-columns:1fr}
  .kpi-grid{grid-template-columns:repeat(2,1fr)}
  /* Admin becomes top-stacked on small screens */
  .admin-shell{grid-template-columns:1fr}
  .admin-side{position:static;height:auto;flex-direction:column}
  .admin-nav{flex-direction:row;flex-wrap:wrap;gap:10px}
  .admin-nav__group{flex-direction:row;flex-wrap:wrap}
  .admin-nav__group--foot{margin:0;border-top:none;padding-top:0}
}
@media (max-width:620px){
  .band{padding:48px 0}
  .hero{padding:60px 0}
  .grid-2,.grid-3,.grid-4{grid-template-columns:1fr}
  .form-grid,.form-grid--2{grid-template-columns:1fr}
  .spec-grid{grid-template-columns:1fr}
  .kpi-row{grid-template-columns:1fr}
  .kpi-grid{grid-template-columns:1fr 1fr}
  .site-foot__in{grid-template-columns:1fr}
  .cta-strip__in{flex-direction:column;align-items:flex-start}
  .hero__cta{width:100%}
  .hero__cta .btn{flex:1}
  .flash{left:14px;right:14px;max-width:none}
  .admin-main{padding:20px 16px 50px}
}

/* =====================================================================
   Accessibility
   ===================================================================== */
:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
.btn:focus-visible{outline-offset:3px}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}