/* ===========================================================
   Spacebars - shared styles (brand layer; utilities live in util.css)
   Responsive: full desktop website >= 768px, mobile app < 768px
   =========================================================== */
:root{
  --sb-blue:#0d2b8f;
  --sb-blue-tint:#DEE3FC;
  --sb-orange:#FF8500;
  --sb-yellow:#FFAF00;
  --sb-ink:#1D1D1D;
  --sb-muted:#454545;
  --sb-soft:#808080;
  --sb-cream:#F9E3CC;
  --sb-field:#EEEEEE;
  --sb-page:#F3EFE8;
  --sb-shell:#ECE7DD;
  --sb-line:#e6e6e3;
  --sb-max:1200px;
}
:root{
  --bs-primary:#0d2b8f;
  --bs-body-color:#1D1D1D;
  --bs-body-font-family:"Albert Sans","-apple-system",BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
}
*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  background:#fff;
  font-family:"Albert Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  color:var(--sb-ink); -webkit-font-smoothing:antialiased;
}
a{ color:var(--sb-blue); text-decoration:none; }
a:hover{ color:var(--sb-orange); }
h1,h2,h3,h4,h5,h6{ font-family:"Poppins",sans-serif; font-weight:700; letter-spacing:-.01em; }
.app-body h2, .own-main h2, .wrap > h2{ color:#14103F; }
.font-dm{ font-family:"DM Sans",sans-serif; }
.text-muted-2{ color:var(--sb-soft)!important; }
.text-orange{ color:var(--sb-orange)!important; }
.text-blue{ color:var(--sb-blue)!important; }
.noscroll::-webkit-scrollbar{ display:none; }
.noscroll{ scrollbar-width:none; }

/* ---------- Layout wrappers ---------- */
.app-shell{ width:100%; min-height:100dvh; display:flex; flex-direction:column; background:var(--sb-page); }
.app-body{ flex:1 1 auto; }
.wrap{ width:100%; max-width:var(--sb-max); margin:0 auto; padding:0 16px; }
.wrap-narrow{ width:100%; max-width:600px; margin:0 auto; padding:0 16px; }
.pad-nav{ padding-bottom:96px; }
@media (min-width:768px){
  .wrap{ padding:0 32px; }
  .pad-nav{ padding-bottom:0; }
}

/* ---------- Global site header ---------- */
.site-header{ position:sticky; top:0; z-index:1020; background:linear-gradient(120deg,#0d2b8f 0%,#1740c4 100%); border-bottom:2px solid rgba(255,133,0,.55); }
[data-app-header]:not([data-persistent]),
[data-app-nav]:not([data-persistent]){ display:none !important; }
.site-header__in{ max-width:var(--sb-max); margin:0 auto; padding:10px 16px; display:flex; align-items:center; gap:20px; }
.site-logo{ font-size:24px; font-weight:700; letter-spacing:-.02em; color:#fff; }
.site-logo span{ color:var(--sb-orange); }
.site-links{ display:none; gap:30px; margin-left:14px; }
.site-links a{ position:relative; font-size:15px; font-weight:500; color:rgba(255,255,255,.82); padding:4px 0; transition:color .18s ease; }
.site-links a::after{ content:""; position:absolute; left:0; right:0; bottom:-2px; height:2px; background:var(--sb-orange); transform:scaleX(0); transform-origin:left; transition:transform .22s ease; border-radius:2px; }
.site-links a:hover{ color:#fff; }
.site-links a:hover::after{ transform:scaleX(1); }
.site-links a.active{ color:#fff; font-weight:600; }
.site-links a.active::after{ background:var(--sb-orange); transform:scaleX(1); height:3px; bottom:-6px; }
.site-actions{ margin-left:auto; display:flex; align-items:center; gap:12px; }
.site-host{ display:none; font-size:13px; font-weight:600; color:#fff; border:1px solid rgba(255,255,255,.35); background:transparent; padding:8px 15px; border-radius:100px; transition:border-color .18s ease, background .18s ease; }
.site-host:hover{ color:var(--sb-orange); border-color:var(--sb-orange); background:rgba(255,133,0,.12); }

/* header tray triggers + dropdown trays */
.trigger{ display:flex; align-items:center; gap:7px; cursor:pointer; border-radius:100px; padding:7px 12px; transition:background .16s ease; user-select:none; }
.trigger:hover{ background:rgba(255,255,255,.14); }
.trigger .caret{ transition:transform .2s ease; font-size:10px; color:rgba(255,255,255,.7); }
.trigger.open .caret{ transform:rotate(180deg); }
.site-loc{ font-size:15px; font-weight:600; color:#fff; white-space:nowrap; }
.avatar-btn{ display:flex; align-items:center; gap:7px; cursor:pointer; border:1px solid rgba(255,255,255,.35); border-radius:100px; padding:4px 10px 4px 4px; transition:background .18s ease; background:rgba(255,255,255,.08); }
.avatar-btn:hover{ background:rgba(255,255,255,.18); }
.avatar-caret{ font-size:10px; color:rgba(255,255,255,.7); transition:transform .2s ease; }
.avatar-btn.open .avatar-caret{ transform:rotate(180deg); }
.site-avatar{ width:32px; height:32px; border-radius:50%; background:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; color:var(--sb-blue); font-size:13px; }
.tray-wrap{ position:relative; }
.tray{ position:absolute; top:calc(100% + 12px); right:0; min-width:240px; background:#fff; border:1px solid var(--sb-line); border-radius:18px; box-shadow:0 16px 44px rgba(0,0,0,.16); padding:8px; opacity:0; transform:translateY(-8px) scale(.98); transform-origin:top right; pointer-events:none; transition:opacity .18s ease,transform .18s ease; z-index:1040; }
.tray.show{ opacity:1; transform:none; pointer-events:auto; }
.tray a,.tray .tray-row{ display:flex; align-items:center; gap:11px; padding:11px 12px; border-radius:12px; font-size:14px; color:var(--sb-ink); cursor:pointer; transition:background .14s ease, color .14s ease; }
.tray a:hover,.tray .tray-row:hover{ background:var(--sb-blue-tint); color:var(--sb-blue); }
.tray .sep{ height:1px; background:var(--sb-line); margin:6px 4px; }
.tray .head{ padding:8px 12px 4px; font-size:11px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--sb-soft); }
@media (min-width:768px){
  .site-header__in{ padding:11px 32px; }
  .site-links{ display:flex; }
  .site-host{ display:inline-flex; }
  .site-loc-text{ display:inline; }
}
@media (max-width:767px){ .site-loc-text{ display:none; } }

/* sub bar (back + title) */
.subbar{ background:#fff; border-bottom:1px solid var(--sb-line); position:sticky; top:0; z-index:1015; }
.subbar__in{ max-width:var(--sb-max); margin:0 auto; padding:14px 16px; display:flex; align-items:center; gap:12px; }
.subbar .back{ cursor:pointer; font-size:20px; line-height:1; }
@media (min-width:768px){ .subbar__in{ padding:14px 32px; } }

/* ---------- Bottom nav (mobile only) ---------- */
.app-nav{
  position:fixed; left:50%; transform:translateX(-50%); bottom:14px; z-index:1030;
  width:calc(100% - 32px); max-width:460px; background:var(--sb-ink); border-radius:22px;
  box-shadow:0 10px 30px rgba(0,0,0,.28); display:flex; padding:8px 6px;
}
.app-nav a{ flex:1; display:flex; flex-direction:column; align-items:center; gap:4px; padding:6px 0; color:rgba(255,255,255,.6); font-size:10.5px; font-weight:600; }
.app-nav a .ic{ width:22px; height:22px; display:flex; align-items:center; justify-content:center; }
.app-nav a.active{ color:#fff; }
@media (min-width:768px){ .app-nav{ display:none; } }

/* ---------- Hero (explore) ---------- */
.hero{ background:var(--sb-blue); color:#fff; position:relative; overflow:hidden; }
.hero-bg{ position:absolute; inset:0; z-index:0; }
.hero-bg .slide{ position:absolute; inset:0; background-size:cover; background-position:center; opacity:0; transition:opacity 1.2s ease; }
.hero-bg .slide.on{ opacity:1; }
.hero-bg .scrim{ position:absolute; inset:0; background:linear-gradient(90deg,rgba(13,43,143,.92) 0%,rgba(13,43,143,.72) 42%,rgba(13,43,143,.34) 100%),linear-gradient(0deg,rgba(6,20,63,.55),rgba(6,20,63,0) 55%); }
.hero-dots{ position:absolute; bottom:16px; left:50%; transform:translateX(-50%); z-index:3; display:flex; gap:7px; }
.hero-dots span{ width:7px; height:7px; border-radius:100px; background:rgba(255,255,255,.45); cursor:pointer; transition:width .25s ease, background .25s ease; }
.hero-dots span.on{ width:22px; background:#fff; }
#cats > a .ring{ transition:transform .25s ease, box-shadow .25s ease; }
#cats > a:hover .ring{ transform:translateY(-4px) scale(1.06); box-shadow:0 10px 22px rgba(13,43,143,.28); background:linear-gradient(135deg,var(--sb-orange),#ffb347)!important; }
#cats > a:hover span:last-child{ color:var(--sb-blue); }
#cats > a span:last-child{ transition:color .2s ease; }
.trust-item{ display:inline-flex; align-items:center; gap:7px; font-size:13px; color:var(--sb-muted); font-family:"DM Sans",sans-serif; white-space:nowrap; background:rgba(13,43,143,.04); border:1px solid rgba(13,43,143,.08); padding:7px 14px; border-radius:100px; transition:background .2s ease, border-color .2s ease, transform .2s ease; }
.trust-item:hover{ background:rgba(13,43,143,.07); border-color:rgba(13,43,143,.18); transform:translateY(-1px); }
.trust-item b{ color:var(--sb-ink); font-weight:600; }
.trust-dot{ display:none !important; }
@media (max-width:640px){
  .trust-band{ flex-wrap:nowrap !important; justify-content:flex-start !important; gap:8px !important; overflow-x:auto; scrollbar-width:none; -ms-overflow-style:none; }
  .trust-band::-webkit-scrollbar{ display:none; }
  .trust-band .trust-item{ flex:0 0 auto; background:var(--sb-blue-tint); border-color:rgba(13,43,143,.18); color:var(--sb-ink); font-weight:500; }
}
.hero__lines{ position:absolute; inset:-80px; opacity:.16; pointer-events:none;
  background-image:repeating-linear-gradient(0deg,transparent 0 74px,rgba(255,255,255,.9) 74px 76px),repeating-linear-gradient(90deg,transparent 0 148px,rgba(255,255,255,.9) 148px 150px); }
.hero__in{ position:relative; max-width:var(--sb-max); margin:0 auto; padding:22px 16px 24px; }
.hero h1{ margin:0; font-size:40px; font-weight:700; line-height:1.04; letter-spacing:-.02em; }
.hero p{ margin:6px 0 0; font-size:14px; color:#EEEEEE; }
.searchbar{ margin-top:16px; display:flex; gap:10px; }
.searchbar .field{ flex:1; height:52px; border-radius:100px; background:#fff; display:flex; align-items:center; gap:10px; padding:0 18px; color:var(--sb-soft); font-family:"DM Sans",sans-serif; font-size:14px; box-shadow:0 6px 22px rgba(0,0,0,.14); transition:box-shadow .2s ease; }
.searchbar .field:hover{ box-shadow:0 10px 30px rgba(0,0,0,.2); }
.searchbar .field.focused{ box-shadow:0 12px 34px rgba(0,0,0,.24); }
.search-tray{ position:fixed; background:#fff; border-radius:18px; box-shadow:0 20px 50px rgba(0,0,0,.22); padding:6px; z-index:1200; max-height:min(60vh,420px); overflow-y:auto; text-align:left; color:var(--sb-ink); }
.search-tray .sec{ padding:8px 10px 2px; font-size:10px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--sb-soft); display:flex; align-items:center; gap:5px; }
.search-tray .row{ display:flex; align-items:center; gap:9px; padding:6px 10px; border-radius:11px; cursor:pointer; font-size:13.5px; position:relative; transition:background .12s ease, padding-left .12s ease; }
.search-tray .row::before{ content:""; position:absolute; left:3px; top:50%; transform:translateY(-50%); width:3px; height:0; border-radius:3px; background:var(--sb-orange); transition:height .14s ease; }
.search-tray .row:hover, .search-tray .row.active{ background:var(--sb-page); padding-left:14px; }
.search-tray .row:hover::before, .search-tray .row.active::before{ height:16px; }
.search-tray .row .ic{ width:24px; height:24px; border-radius:7px; background:var(--sb-tint); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.search-tray .row .meta{ display:flex; align-items:baseline; gap:7px; min-width:0; white-space:nowrap; overflow:hidden; }
.search-tray .row .meta b{ font-weight:600; overflow:hidden; text-overflow:ellipsis; }
.search-tray .row .meta small{ font-size:11.5px; color:var(--sb-soft); overflow:hidden; text-overflow:ellipsis; }
.search-tray .row .go{ margin-left:auto; color:var(--sb-soft); flex-shrink:0; opacity:0; transform:translateX(-4px); transition:opacity .12s ease, transform .12s ease; }
.search-tray .row:hover .go, .search-tray .row.active .go{ opacity:1; transform:none; }
.search-tray .empty{ padding:16px 14px; font-size:12.5px; color:var(--sb-soft); text-align:center; }
.search-tray mark{ background:transparent; color:var(--sb-blue); font-weight:700; padding:0; }
/* filter range sliders */
.range-dual{ position:relative; height:34px; margin:2px 4px 14px; }
.range-track{ position:absolute; left:0; right:0; top:15px; height:4px; border-radius:4px; background:var(--sb-line); }
.range-fill{ position:absolute; top:0; height:100%; border-radius:4px; background:var(--sb-blue); }
.range-dual input[type=range]{ position:absolute; left:0; right:0; top:0; width:100%; margin:0; -webkit-appearance:none; appearance:none; background:transparent; pointer-events:none; height:34px; }
.range-single{ -webkit-appearance:none; appearance:none; width:100%; height:4px; border-radius:4px; background:var(--sb-line); margin:6px 0 14px; }
.range-dual input[type=range]::-webkit-slider-thumb, .range-single::-webkit-slider-thumb{ -webkit-appearance:none; appearance:none; width:20px; height:20px; border-radius:50%; background:#fff; border:2px solid var(--sb-blue); box-shadow:0 2px 6px rgba(0,0,0,.18); cursor:pointer; pointer-events:auto; }
.range-dual input[type=range]::-moz-range-thumb, .range-single::-moz-range-thumb{ width:20px; height:20px; border-radius:50%; background:#fff; border:2px solid var(--sb-blue); box-shadow:0 2px 6px rgba(0,0,0,.18); cursor:pointer; pointer-events:auto; }
.range-out{ font-weight:400; text-transform:none; letter-spacing:0; color:var(--sb-blue); float:right; font-size:13px; }
@media (min-width:768px){
  .hero__in{ padding:44px 32px 40px; }
  .hero h1{ font-size:60px; max-width:640px; }
  .hero p{ font-size:17px; }
  .searchbar{ max-width:720px; }
}

/* ---------- Explore layout ---------- */
.explore-layout{ display:block; padding:24px 0 40px; }
.filter-side{ display:none; }
.sb-skel{ display:block; background:linear-gradient(90deg,#eceae4 25%,#f7f6f3 37%,#eceae4 63%); background-size:400% 100%; animation:sbShimmer 1.15s ease infinite; border-radius:12px; }
.sb-skel-line{ height:14px; margin-top:10px; }
.sb-skel-line.short{ width:46%; }
.sb-skel-photo{ height:180px; border-radius:16px 16px 0 0; }
.sb-skel-card{ border:1px solid var(--sb-line); border-radius:18px; overflow:hidden; background:#fff; min-height:268px; }
.sb-skel-card .pad{ padding:12px 14px 16px; }
.sb-skel-row{ display:flex; gap:12px; align-items:center; min-height:84px; padding:12px; border:1px solid var(--sb-line); border-radius:16px; background:#fff; margin-bottom:12px; }
.sb-skel-row .sb-skel-photo{ width:60px; height:60px; border-radius:12px; flex:none; }
.sb-skel-gallery{ height:340px; border-radius:20px; }
.sb-skel-side{ min-height:420px; border-radius:20px; border:1px solid var(--sb-line); padding:18px; background:#fff; }
@keyframes sbShimmer{ 0%{ background-position:100% 0; } 100%{ background-position:0 0; } }
@media (prefers-reduced-motion:reduce){ .sb-skel{ animation:none; } }
.studio-grid{ display:grid; grid-template-columns:1fr; gap:16px; }
@media (min-width:560px){ .studio-grid{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:900px){
  .explore-layout{ display:grid; grid-template-columns:270px 1fr; gap:32px; align-items:start; }
  .filter-side{ display:block; position:sticky; top:96px; background:#fff; border:1px solid var(--sb-line); border-radius:20px; padding:22px; }
  .studio-grid{ grid-template-columns:repeat(2,1fr); gap:20px; }
}
/* mobile Filters button + bottom-sheet */
.filters-btn{ display:inline-flex; }
.filter-sheet-head{ display:none; }
.filter-apply{ display:none; }
.filter-scrim{ display:none; }
@media (min-width:900px){ .filters-btn{ display:none; } }
@media (max-width:899px){
  .filter-desk-head{ display:none !important; }
  .filter-side{ position:fixed; left:0; right:0; bottom:0; z-index:2000; background:#fff; border-radius:24px 24px 0 0; padding:20px 18px calc(18px + env(safe-area-inset-bottom)); max-height:86vh; overflow-y:auto; transform:translateY(110%); transition:transform .28s cubic-bezier(.4,0,.2,1); box-shadow:0 -12px 40px rgba(0,0,0,.2); }
  .filter-side.open{ display:block; transform:none; }
  .filter-sheet-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
  .filter-apply{ display:flex; margin-top:8px; position:sticky; bottom:0; }
  .filter-scrim.open{ display:block; position:fixed; inset:0; z-index:1990; background:rgba(29,29,29,.45); }
}
@media (min-width:1120px){ .studio-grid{ grid-template-columns:repeat(3,1fr); } }

/* type scroller (mobile) */
.type-scroll{ display:flex; gap:20px; overflow-x:auto; padding:14px 16px 6px; }
.type-item{ cursor:pointer; display:flex; flex-direction:column; align-items:center; gap:8px; min-width:58px; }
.type-item .ic{ width:54px; height:54px; border-radius:16px; background:rgba(255,255,255,.16); display:flex; align-items:center; justify-content:center; font-size:22px; }
.type-item .lbl{ font-size:11px; color:rgba(255,255,255,.8); }
.type-item.on .ic{ background:#fff; }
.type-item.on .lbl{ color:#fff; font-weight:700; }
@media (min-width:900px){ .type-scroll{ flex-wrap:wrap; justify-content:center; overflow-x:visible; padding:18px 24px 4px; gap:26px; } }
#typeScroll .ring{ transition:transform .25s ease, box-shadow .25s ease; }
#typeScroll .type-item:hover .ring{ transform:translateY(-4px) scale(1.06); box-shadow:0 10px 22px rgba(0,0,0,.22); }
#typeScroll .type-item.on .ring{ box-shadow:0 0 0 3px rgba(255,255,255,.55); }

/* ---------- Detail layout ---------- */
.detail-layout{ display:block; padding-bottom:40px; min-width:0; }
.book-side{ display:none; min-width:0; }
@media (min-width:900px){
  .detail-layout{ display:grid; grid-template-columns:minmax(0,1fr) minmax(240px,360px); gap:clamp(16px,2.5vw,36px); align-items:start; padding-top:28px; }
  .book-side{ display:block; position:sticky; top:88px; align-self:start; max-height:calc(100dvh - 104px); overflow:auto; overscroll-behavior:contain; }
  .book-side .sb-card{ max-width:100%; }
  .detail-cta{ display:none; }
}
.book-side::-webkit-scrollbar{ width:8px; }
.book-side::-webkit-scrollbar-thumb{ background:#d0d0cd; border-radius:8px; }

/* ---------- Buttons (brand pills) ---------- */
.btn-pill{ --hpad:26px; border:0; cursor:pointer; border-radius:100px; padding:15px var(--hpad); font-family:inherit; font-size:16px; font-weight:500; display:inline-flex; align-items:center; justify-content:center; gap:10px; transition:transform .16s ease, box-shadow .2s ease, filter .18s ease, background .18s ease; }
.btn-blue:hover{ box-shadow:0 8px 22px rgba(13,43,143,.28); }
.btn-orange:hover{ box-shadow:0 8px 22px rgba(255,133,0,.30); }
.btn-pill:active{ transform:scale(.96); }
.btn-blue{ background:var(--sb-blue); color:#fff; } .btn-blue:hover{ color:#fff; filter:brightness(1.08); }
.btn-orange{ background:var(--sb-orange); color:#fff; } .btn-orange:hover{ color:#fff; filter:brightness(1.05); }
.btn-ghost{ background:#fff; color:var(--sb-ink); border:1px solid rgba(29,29,29,.15); } .btn-ghost:hover{ color:var(--sb-ink); }
.btn-white{ background:#fff; color:var(--sb-ink); } .btn-white:hover{ color:var(--sb-ink); }
.btn-block{ width:100%; }
.btn-arrow svg{ width:12px; height:12px; }

/* ---------- Cards / surfaces ---------- */
.sb-card{ background:#fff; border-radius:20px; box-shadow:0 1px 3px rgba(0,0,0,.06); overflow:hidden; transition:box-shadow .22s cubic-bezier(.4,0,.2,1), transform .22s cubic-bezier(.4,0,.2,1); }
.sb-card.hover{ cursor:pointer; }
.sb-card.hover:hover{ box-shadow:0 14px 40px rgba(13,43,143,.13); transform:translateY(-4px); }
/* image-zoom container for card photos */
.zoomwrap{ overflow:hidden; }
.zoomwrap > .hatch, .zoomwrap > img{ transition:transform .5s cubic-bezier(.4,0,.2,1); }
.sb-card.hover:hover .zoomwrap > .hatch, .sb-card.hover:hover .zoomwrap > img{ transform:scale(1.06); }
.sb-soft{ background:var(--sb-page); border-radius:16px; }
.sb-tint{ background:var(--sb-blue-tint); border-radius:16px; }
.stat-hov{ cursor:default; transition:transform .2s cubic-bezier(.4,0,.2,1), box-shadow .2s ease, background .2s ease; }
.stat-hov:hover{ transform:translateY(-3px); box-shadow:0 10px 24px rgba(13,43,143,.14); background:#d3daf9; }
.sb-cream{ background:var(--sb-cream); border-radius:16px; }
.hatch{ background-image:repeating-linear-gradient(45deg,#d8d8d4 0 12px,#cfcfca 12px 24px); display:flex; align-items:center; justify-content:center; color:#6b6b66; font-family:"DM Sans",monospace; font-size:11px; }
.eyebrow{ font-size:11px; font-weight:600; letter-spacing:.05em; text-transform:uppercase; color:var(--sb-orange); }
.chip{ display:inline-flex; align-items:center; gap:6px; white-space:nowrap; font-size:12px; font-weight:500; padding:7px 13px; border-radius:100px; border:1px solid #d0d0cd; color:var(--sb-muted); background:#fff; cursor:pointer; transition:background .16s ease, color .16s ease, border-color .16s ease, transform .12s ease; }
.chip:hover{ border-color:var(--sb-ink); color:var(--sb-ink); }
.chip:active{ transform:scale(.95); }
.chip.on{ background:var(--sb-blue); color:#fff; border-color:var(--sb-blue); }
#tabs .chip.on{ background:var(--sb-blue); border-color:var(--sb-blue); color:#fff; }
.chip.on-orange{ background:var(--sb-orange); color:#fff; border-color:var(--sb-orange); }
.datepick{ display:none; position:absolute; top:60px; left:0; z-index:40; width:300px; max-width:86vw; background:#fff; border:1px solid var(--sb-line); border-radius:20px; box-shadow:0 12px 30px rgba(0,0,0,.14); padding:16px; }

/* slot rows */
.slot{ height:48px; border-radius:12px; border:1px solid var(--sb-line); background:#fff; display:flex; align-items:center; justify-content:space-between; padding:0 16px; cursor:pointer; transition:border-color .16s ease, background .16s ease, transform .12s ease, box-shadow .16s ease; }
.slot:not(.booked):not(.held):hover{ border-color:var(--sb-blue); box-shadow:0 2px 10px rgba(13,43,143,.08); }
.slot:not(.booked):not(.held):active{ transform:scale(.99); }
.slot.sel{ background:var(--sb-ink); color:#fff; border-color:var(--sb-ink); }
.slot.booked{ background:#f0dede; border-color:#e2bcbc; color:#b03030; cursor:not-allowed; }
.slot.held{ background:#f6ead0; border-color:#e6d19c; color:#9a7b12; cursor:not-allowed; }
.slot .price{ font-family:"DM Sans",monospace; font-size:13px; }
.date-slide{ display:flex; align-items:center; gap:8px; min-width:0; }
.date-swiper{ flex:1; min-width:0; width:100%; margin:0; overflow:hidden; padding:4px 0 8px; }
.date-swiper .swiper-slide{ width:fit-content !important; height:auto !important; }
.date-slide__btn{ flex:none; width:36px; height:36px; border-radius:50%; border:1px solid var(--sb-line); background:#fff; color:var(--sb-ink); font-size:22px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.date-slide__btn:hover{ border-color:var(--sb-blue); color:var(--sb-blue); }
.date-slide__btn.swiper-button-disabled{ opacity:.35; cursor:default; border-color:var(--sb-line); color:var(--sb-muted); }

/* sticky action bar (mobile checkout) */
.action-bar{ position:sticky; bottom:0; z-index:1010; background:#fff; border-top:1px solid var(--sb-line); padding:14px 16px; display:flex; align-items:center; gap:16px; }
.action-bar__in{ width:100%; max-width:600px; margin:0 auto; display:flex; align-items:center; gap:16px; }
@media (min-width:900px){
  .action-bar.detail-cta{ display:none; }
}

/* toggle */
.sb-toggle{ width:44px; height:26px; border-radius:100px; background:#d0d0cd; position:relative; cursor:pointer; transition:background .18s; flex-shrink:0; }
.sb-toggle .knob{ position:absolute; top:3px; left:3px; width:20px; height:20px; border-radius:50%; background:#fff; transition:left .18s; }
.sb-toggle.on{ background:var(--sb-ink); }
.sb-toggle.on .knob{ left:21px; }

/* pill inputs */
.sb-input{ height:52px; border-radius:100px; border:1px solid var(--sb-line); background:#fff; padding:0 20px; font-family:"DM Sans",sans-serif; font-size:14px; color:var(--sb-ink); width:100%; }
.sb-input:focus, .sb-input:focus-within{ outline:2px solid var(--sb-blue); background:#fff; }
.sb-label{ font-size:10px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--sb-soft); }

/* checkout panel card on desktop */
.panel{ background:#fff; }
@media (min-width:768px){
  .panel{ border:1px solid var(--sb-line); border-radius:24px; box-shadow:0 1px 3px rgba(0,0,0,.06); margin:32px auto; overflow:hidden; }
}

.fade-up{ animation:sbFade .28s ease; }
@keyframes sbFade{ from{ opacity:0; transform:translateY(6px);} to{ opacity:1; transform:none;} }

/* ===========================================================
   Owner console shell
   =========================================================== */
.own-layout{ min-height:100dvh; background:var(--sb-page); }
.own-side{ display:none; }
.own-content{ display:flex; flex-direction:column; min-height:100dvh; }
.own-main-slot{ flex:1 1 auto; padding:20px 16px 96px; }
.own-scrim{ display:none; }

/* topbar */
.own-top{ position:sticky; top:0; z-index:900; background:#fff; border-bottom:1px solid var(--sb-line); display:flex; align-items:center; gap:12px; padding:12px 16px; }
.own-top__burger{ display:flex; flex-direction:column; gap:4px; background:none; border:0; cursor:pointer; padding:6px; }
.own-top__burger span{ width:20px; height:2px; background:var(--sb-ink); border-radius:2px; }
.own-top__title{ margin:0; font-size:19px; font-weight:600; letter-spacing:-.01em; }
.own-top__actions{ margin-left:auto; display:flex; align-items:center; gap:12px; }
.own-top__ghost{ display:none; font-size:13px; font-weight:600; color:var(--sb-ink); border:1px solid var(--sb-line); border-radius:100px; padding:9px 16px; transition:background .16s ease; }
.own-top__ghost:hover{ background:var(--sb-page); color:var(--sb-ink); }
.own-top__bell{ position:relative; background:none; border:0; cursor:pointer; color:var(--sb-muted); padding:4px; }
.own-top__dot{ position:absolute; top:2px; right:2px; width:8px; height:8px; border-radius:50%; background:var(--sb-orange); border:1.5px solid #fff; }

/* sidebar */
.own-brand{ display:flex; align-items:baseline; gap:8px; padding:6px 8px 2px; }
.own-brand__tag{ font-size:11px; font-weight:600; color:var(--sb-orange); padding:2px 7px; border-radius:100px; }
.own-side .sb-input{ background:rgba(255,255,255,.08) !important; color:rgba(255,255,255,.75) !important; border:1px solid rgba(255,255,255,.12) !important; }
.own-switch{ position:relative; margin:14px 0 8px; }
.own-switch__cur{ display:flex; align-items:center; gap:10px; padding:10px; border:1px solid var(--sb-line); border-radius:14px; cursor:pointer; background:#fff; transition:box-shadow .16s ease; }
.own-switch__cur:hover{ box-shadow:0 2px 10px rgba(0,0,0,.06); }
.own-switch__thumb{ width:34px; height:34px; border-radius:9px; background:var(--sb-blue); color:#fff; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; flex-shrink:0; }
.own-switch__thumb.sm{ width:28px; height:28px; border-radius:7px; font-size:11px; }
.own-switch__name{ font-size:13px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.own-switch__sub{ font-size:11px; color:var(--sb-soft); }
.own-switch__menu{ position:absolute; left:0; right:0; top:calc(100% + 6px); background:#fff; border:1px solid var(--sb-line); border-radius:14px; box-shadow:0 16px 40px rgba(0,0,0,.14); padding:6px; opacity:0; transform:translateY(-6px); pointer-events:none; transition:.16s; z-index:20; }
.own-switch__menu.show{ opacity:1; transform:none; pointer-events:auto; }
.own-switch__head{ padding:8px 10px 4px; font-size:10px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--sb-soft); }
.own-switch__opt{ display:flex; align-items:center; gap:9px; padding:9px 10px; border-radius:10px; font-size:13px; cursor:pointer; }
.own-switch__opt:hover{ background:var(--sb-page); }
.own-switch__opt.on{ font-weight:600; }
.own-switch__add{ display:block; padding:10px; margin-top:4px; border-top:1px solid var(--sb-line); font-size:13px; font-weight:600; color:var(--sb-blue); }
.own-nav{ display:flex; flex-direction:column; gap:2px; margin-top:6px; flex:1; }
.own-nav__item{ display:flex; align-items:center; gap:12px; padding:11px 12px; border-radius:11px; font-size:14px; font-weight:500; color:rgba(255,255,255,.68); position:relative; transition:background .14s ease,color .14s ease; }
.own-nav__item:hover{ background:rgba(255,255,255,.08); color:#fff; }
.own-nav__item.active{ background:rgba(255,255,255,.1); color:#fff; box-shadow:inset 3px 0 0 var(--sb-orange); }
.own-nav__item.active .own-nav__ic{ color:var(--sb-orange); }
.own-nav__ic{ display:flex; color:rgba(255,255,255,.5); }
.own-nav__item.active .own-nav__badge{ background:var(--sb-orange); color:#fff; }se; }
.own-nav__item:hover{ background:#fff; color:var(--sb-ink); }
.own-nav__item.active{ background:var(--sb-blue); color:#fff; }
.own-nav__item.active .own-nav__ic{ color:#fff; }
.own-nav__ic{ display:flex; color:var(--sb-soft); }
.own-nav__item.active .own-nav__badge{ background:#fff; color:var(--sb-blue); }
.own-nav__badge{ margin-left:auto; min-width:20px; height:20px; padding:0 6px; border-radius:100px; background:var(--sb-orange); color:#fff; font-size:11px; font-weight:700; display:flex; align-items:center; justify-content:center; }
.own-nav__sep{ height:1px; background:rgba(255,255,255,.12); margin:8px 8px; }
.own-side__foot{ display:flex; align-items:center; gap:10px; padding:10px; border-top:1px solid rgba(255,255,255,.12); margin-top:6px; color:rgba(255,255,255,.85); }
.own-side__foot:hover{ color:#fff; }

/* mobile bottom tabs */
.own-tabs{ position:fixed; left:50%; transform:translateX(-50%); bottom:12px; z-index:950; width:calc(100% - 24px); max-width:480px; background:var(--sb-ink); border-radius:20px; box-shadow:0 10px 30px rgba(0,0,0,.28); display:flex; padding:7px 4px; }
.own-tabs a{ flex:1; display:flex; flex-direction:column; align-items:center; gap:3px; padding:5px 0; color:rgba(255,255,255,.55); font-size:10px; font-weight:600; }
.own-tabs a.active{ color:#fff; }
.own-tabs .ic{ position:relative; display:flex; }
.own-tabs__badge{ position:absolute; top:-5px; right:-8px; min-width:15px; height:15px; padding:0 4px; border-radius:100px; background:var(--sb-orange); color:#fff; font-size:9px; font-weight:700; display:flex; align-items:center; justify-content:center; }
.own-tabs a{ cursor:pointer; }
/* More bottom sheet (mobile) */
.own-morescrim{ display:none; position:fixed; inset:0; z-index:960; background:rgba(29,29,29,.45); }
.own-morescrim.show{ display:block; }
.own-moresheet{ position:fixed; left:0; right:0; bottom:0; z-index:970; background:#fff; border-radius:22px 22px 0 0; padding:10px 14px calc(14px + env(safe-area-inset-bottom)); transform:translateY(110%); transition:transform .26s ease; box-shadow:0 -10px 40px rgba(0,0,0,.2); }
.own-moresheet.show{ transform:none; }
.own-moresheet__grab{ width:40px; height:4px; border-radius:100px; background:var(--sb-line); margin:2px auto 8px; }
.own-moresheet__head{ font-size:12px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--sb-soft); padding:4px 8px 8px; }
.own-moresheet__item{ display:flex; align-items:center; gap:12px; padding:14px 8px; border-top:1px solid var(--sb-line); font-size:15px; font-weight:500; color:var(--sb-ink); }
.own-moresheet__item .own-nav__ic{ color:var(--sb-muted); }
@media (min-width:900px){ .own-morescrim,.own-moresheet{ display:none !important; } }

@media (min-width:900px){
  .own-layout{ display:grid; grid-template-columns:248px 1fr; }
  .own-side{ display:flex; flex-direction:column; padding:16px 12px; border-right:1px solid rgba(255,255,255,.08); background:radial-gradient(120% 60% at 20% 0%,#10307f 0%,#0b2270 45%,#06143f 100%); position:sticky; top:0; height:100dvh; }
  .own-top__burger{ display:none; }
  .own-top__ghost{ display:inline-flex; }
  .own-top__title{ font-size:22px; }
  .own-main-slot{ padding:28px 32px 40px; }
  .own-tabs{ display:none; }
}
@media (max-width:899px){
  .own-side{ position:fixed; top:0; left:0; bottom:0; z-index:1000; width:270px; flex-direction:column; padding:16px 12px; background:radial-gradient(120% 60% at 20% 0%,#10307f 0%,#0b2270 45%,#06143f 100%); border-right:1px solid rgba(255,255,255,.08); transform:translateX(-100%); transition:transform .24s ease; }
  .own-side.open{ display:flex; transform:none; box-shadow:0 20px 60px rgba(0,0,0,.3); }
  .own-scrim.show{ display:block; position:fixed; inset:0; background:rgba(29,29,29,.4); z-index:990; }
}

/* owner content helpers */
.own-grid{ display:grid; grid-template-columns:1fr; gap:16px; }
@media (min-width:600px){ .own-grid.cols-2{ grid-template-columns:1fr 1fr; } .own-grid.cols-3{ grid-template-columns:repeat(3,1fr); } .own-grid.cols-4{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1000px){ .own-grid.cols-4{ grid-template-columns:repeat(4,1fr); } }
.stat{ background:#fff; border:1px solid var(--sb-line); border-radius:18px; padding:18px; }
.stat__v{ font-size:26px; font-weight:600; letter-spacing:-.01em; }
.stat__l{ font-size:12px; color:var(--sb-soft); margin-top:2px; }
.stat__d{ font-size:11px; font-weight:600; margin-top:8px; }

/* ---------- Footer (dark navy, matches header) ---------- */
.site-footer{ background:radial-gradient(120% 80% at 15% 0%,#10307f 0%,#0b2270 45%,#06143f 100%); border-top:1px solid rgba(255,255,255,.08); margin-top:56px; color:#fff; position:relative; overflow:hidden; }
.site-footer::before{ content:""; position:absolute; inset:0; pointer-events:none; background-image:repeating-linear-gradient(90deg,transparent 0 78px,rgba(255,255,255,.045) 78px 79px); }
.site-footer__in{ max-width:var(--sb-max); margin:0 auto; padding:0 16px; position:relative; }
.footer-cta{ display:flex; flex-direction:column; gap:16px; background-image:linear-gradient(90deg,rgba(13,43,143,.94) 0%,rgba(13,43,143,.66) 60%,rgba(13,43,143,.4) 100%),url(hero/2.webp); background-size:cover; background-position:center; border-radius:24px; padding:28px; margin:36px 0 8px; position:relative; overflow:hidden; color:#fff; }
.footer-cta__lines{ position:absolute; inset:-60px; opacity:.14; pointer-events:none; background-image:repeating-linear-gradient(0deg,transparent 0 60px,rgba(255,255,255,.9) 60px 62px),repeating-linear-gradient(90deg,transparent 0 120px,rgba(255,255,255,.9) 120px 122px); }
.footer-cta h3{ margin:0; font-size:24px; font-weight:600; letter-spacing:-.01em; position:relative; }
.footer-cta p{ margin:4px 0 0; font-size:14px; color:#EEE; position:relative; }
.footer-cta__btns{ display:flex; gap:10px; position:relative; flex-wrap:wrap; }
.footer-top{ display:grid; grid-template-columns:1fr; gap:28px; padding:32px 0; border-bottom:1px solid rgba(255,255,255,.1); }
.footer-brand{ display:flex; flex-direction:column; gap:16px; max-width:320px; }
.footer-brand p{ margin:0; font-family:"DM Sans",sans-serif; font-size:14px; line-height:1.6; color:rgba(255,255,255,.72); }
/* contact lines sit on the dark footer, so they must not inherit the blue link colour */
.footer-brand a[href^="tel"], .footer-brand a[href^="mailto"], .footer-brand a[href*="wa.me"]{ color:#fff; text-decoration:none; }
.footer-brand a[href^="tel"]:hover, .footer-brand a[href^="mailto"]:hover, .footer-brand a[href*="wa.me"]:hover{ color:var(--sb-orange); }
.footer-cols{ display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:24px 24px; align-items:start; }
.footer-col h4{ margin:0 0 14px; font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:rgba(255,255,255,.55); }
.footer-col a{ display:block; margin-bottom:11px; font-size:14px; color:rgba(255,255,255,.8); transition:color .16s ease, padding-left .16s ease; }
.footer-col a:hover{ color:var(--sb-orange); padding-left:4px; }
.footer-col a.footer-hl{ display:inline-flex; align-items:center; gap:6px; color:#fff; font-weight:600; background:var(--sb-orange); padding:7px 14px; border-radius:100px; margin-bottom:11px; transition:filter .16s ease, transform .16s ease; }
.footer-col a.footer-hl::before{ content:""; display:none; }
.footer-col a.footer-hl:hover{ color:#fff; padding-left:14px; filter:brightness(1.08); transform:translateY(-1px); }
.footer-news{ display:flex; gap:8px; margin-top:4px; }
.news-card{ position:relative; margin-top:-8px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14); border-radius:16px; padding:10px 14px 12px; overflow:hidden; }
.news-card::after{ content:""; position:absolute; right:-30px; top:-30px; width:80px; height:80px; border-radius:50%; background:radial-gradient(circle,rgba(255,255,255,.12),transparent 70%); pointer-events:none; }
.news-lead{ margin:0 0 10px; font-family:"DM Sans",sans-serif; font-size:13px; line-height:1.45; color:rgba(255,255,255,.72); }
.news-lead b{ color:#fff; font-weight:600; }
.news-card .footer-news{ gap:8px; margin-top:0; }
.news-card .footer-news input{ height:44px; background:rgba(255,255,255,.94); border:0; }
.news-card .footer-news button{ width:52px; flex-shrink:0; padding:0; display:inline-flex; align-items:center; justify-content:center; background:var(--sb-orange); }
.news-card .footer-news button:hover{ background:#fff; }
.news-fine{ display:inline-flex; align-items:center; gap:5px; margin-top:9px; font-family:"DM Sans",sans-serif; font-size:11px; color:rgba(255,255,255,.5); }
/* sort dropdown rows */
.sort-row{ position:relative; transition:background .14s ease, padding-left .14s ease, color .14s ease; }
.sort-row::before{ content:""; position:absolute; left:4px; top:50%; transform:translateY(-50%); width:3px; height:0; border-radius:3px; background:var(--sb-orange); transition:height .14s ease; }
.sort-row:hover{ background:var(--sb-page); padding-left:16px; color:var(--sb-blue); }
.sort-row:hover::before{ height:16px; }
/* home FAQ accordion */
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item[open] .faq-plus{ transform:rotate(45deg); }
.faq-item[open] summary{ color:var(--sb-blue); }
/* selectable option rows (cancel reason etc.) */
.opt-row{ display:flex; align-items:center; gap:12px; padding:13px 15px; background:#fff; border:1.5px solid var(--sb-line); border-radius:14px; cursor:pointer; transition:border-color .14s ease, background .14s ease, box-shadow .14s ease; }
.opt-row:hover{ border-color:#c9c9f0; }
.opt-row:has(input:checked){ border-color:var(--sb-blue); background:var(--sb-blue-tint); }
.opt-row input{ accent-color:var(--sb-blue); width:18px; height:18px; flex-shrink:0; }
.opt-row span{ font-size:14px; font-weight:500; }
.opt-group.needs-pick{ outline:2px solid #b03030; outline-offset:4px; border-radius:16px; }
.footer-news input{ flex:1; min-width:0; height:46px; border:1px solid var(--sb-line); border-radius:100px; padding:0 18px; font-family:"DM Sans",sans-serif; font-size:14px; background:#fff; }
.footer-news input:focus{ outline:2px solid var(--sb-blue); background:#fff; }
.footer-news button{ height:46px; border:0; border-radius:100px; padding:0 20px; background:var(--sb-ink); color:#fff; font-weight:600; font-size:14px; cursor:pointer; white-space:nowrap; transition:background .16s ease; }
.footer-news button:hover{ background:var(--sb-blue); }
.footer-social{ display:flex; gap:10px; margin-top:4px; }
.footer-social a{ width:40px; height:40px; border-radius:50%; border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.06); display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.85); transition:background .18s ease, border-color .18s ease, transform .18s ease, color .18s ease; }
.footer-social a:hover{ background:var(--sb-orange); border-color:var(--sb-orange); color:#fff; transform:translateY(-2px); }
.footer-bar{ display:flex; flex-direction:column; gap:12px; padding:10px 0 34px; font-size:13px; color:rgba(255,255,255,.6); }
.footer-bar__links{ display:flex; flex-wrap:wrap; gap:6px 22px; }
.footer-bar__links a{ color:rgba(255,255,255,.75); }
.footer-bar__links a:hover{ color:#fff; }
.footer-credit{ color:rgba(255,255,255,.6); }
.footer-credit a{ color:#fff; font-weight:600; border-bottom:1px solid var(--sb-orange); transition:color .16s ease; }
.footer-credit a:hover{ color:var(--sb-orange); }
@media (min-width:768px){
  .site-footer__in{ padding:0 32px; }
  .footer-cta{ flex-direction:row; align-items:center; justify-content:space-between; padding:32px 40px; }
  .footer-cta h3{ font-size:28px; }
  .footer-top{ grid-template-columns:1fr 2.4fr; gap:56px; padding:44px 0; }
  .footer-bar{ flex-direction:row; align-items:center; justify-content:space-between; }
}

/* ---------- Admin console extras ---------- */
.sb-badge{ display:inline-flex; align-items:center; gap:4px; font-size:11px; font-weight:600; padding:4px 10px; border-radius:100px; white-space:nowrap; }
.admin-iconbtn{ width:34px; height:34px; border:1px solid var(--sb-line); border-radius:10px; background:#fff; display:flex; align-items:center; justify-content:center; color:var(--sb-muted); cursor:pointer; transition:all .15s ease; text-decoration:none; }
.admin-iconbtn:hover{ background:var(--sb-blue-tint); border-color:var(--sb-blue); color:var(--sb-blue); }
.admin-iconbtn.danger:hover{ background:#f9e7e7; border-color:#b03030; color:#b03030; }
.rt-btn{ min-width:32px; height:30px; padding:0 8px; border:1px solid var(--sb-line); background:#fff; border-radius:7px; font-size:13px; color:var(--sb-ink); cursor:pointer; font-family:"DM Sans",sans-serif; line-height:1; }
.rt-btn:hover{ background:var(--sb-blue-tint); border-color:rgba(13,43,143,.2); }
.rt-sel{ height:30px; border:1px solid var(--sb-line); background:#fff; border-radius:7px; font-size:12px; color:var(--sb-ink); padding:0 6px; font-family:"DM Sans",sans-serif; cursor:pointer; }
.rt-div{ width:1px; height:20px; background:var(--sb-line); margin:0 3px; }
.media-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:16px; }
.media-card{ text-align:left; padding:0; border:1px solid var(--sb-line); background:#fff; border-radius:14px; overflow:hidden; cursor:pointer; transition:box-shadow .15s ease, transform .15s ease, border-color .15s ease; }
.media-card:hover{ box-shadow:0 6px 20px rgba(0,0,0,.09); transform:translateY(-2px); border-color:rgba(13,43,143,.2); }
.media-card__img{ width:100%; aspect-ratio:3/2; background-size:cover; background-position:center; }
.media-card__meta{ padding:10px 12px 12px; }
.media-card__name{ font-size:13px; font-weight:600; letter-spacing:-.01em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#f-body[data-empty="1"]:before{ content:attr(data-ph); color:var(--sb-soft); pointer-events:none; }
.admin-sec-h{ font-size:15px; font-weight:600; letter-spacing:-.01em; margin-bottom:14px; padding-bottom:12px; border-bottom:1px solid var(--sb-line); }
.admin-two{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media (max-width:600px){ .admin-two{ grid-template-columns:1fr; } }
.admin-metric-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px 16px; }
@media (max-width:760px){ .admin-metric-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:460px){ .admin-metric-grid{ grid-template-columns:1fr; } }
.admin-cols{ display:grid; grid-template-columns:1fr; gap:16px; }
.blog-feat{ display:grid; grid-template-columns:1fr; }
@media (min-width:760px){ .blog-feat{ grid-template-columns:1.1fr 1fr; } }
@media (min-width:900px){ .admin-cols{ grid-template-columns:1.1fr 1fr; } }
@media (max-width:760px){
  .admin-thead.bk, .admin-thead.inv{ display:none !important; }
  .admin-row.bk, .admin-row.inv{ grid-template-columns:1fr auto !important; row-gap:6px !important; }
  .admin-row.bk > :nth-child(3), .admin-row.inv > :nth-child(3){ display:none; }
  .admin-row.bk > :nth-child(2), .admin-row.inv > :nth-child(2){ font-size:12px !important; color:var(--sb-muted); }
  .admin-row.bk > :nth-child(4), .admin-row.inv > :nth-child(4){ grid-column:1; }
  .admin-row.bk > :nth-child(5), .admin-row.inv > :nth-child(5){ grid-column:1; justify-self:start; }
  .admin-row.bk > :last-child, .admin-row.inv > :last-child{ grid-column:2; grid-row:1 / span 4; align-self:center; }
}
@media (max-width:720px){
  .admin-thead{ display:none !important; }
  .admin-row{ grid-template-columns:1fr auto !important; grid-template-areas:"studio actions" "meta actions"; row-gap:6px !important; }
  .admin-row > :nth-child(1){ grid-area:studio; }
  .admin-row > :nth-child(2), .admin-row > :nth-child(3){ display:none; }
  .admin-row > :nth-child(4){ grid-area:meta; font-size:12px !important; color:var(--sb-muted); }
  .admin-row > :nth-child(5){ grid-area:meta; justify-self:start; }
  .admin-row > :last-child{ grid-area:actions; }
}


/* ---------- Contact page ---------- */
.contact-grid{ display:grid; grid-template-columns:1fr; gap:20px; max-width:980px; margin:0 auto; }
@media (min-width:840px){ .contact-grid{ grid-template-columns:1.35fr 1fr; align-items:start; } }
.contact-ic{ width:38px; height:38px; border-radius:10px; background:var(--sb-blue-tint); color:var(--sb-blue); display:flex; align-items:center; justify-content:center; flex-shrink:0; }

/* ---------- Admin CMS ---------- */
.cms-row{ display:flex; align-items:center; gap:16px; padding:14px 18px; border-bottom:1px solid var(--sb-line); }
.cms-row:last-child{ border-bottom:0; }
.cms-row__thumb{ width:72px; height:52px; border-radius:10px; flex-shrink:0; }
.cms-row__main{ display:flex; flex-direction:column; gap:4px; flex:1; min-width:0; }
.cms-row__act{ flex-shrink:0; }
@media (max-width:640px){
  .cms-row{ flex-wrap:wrap; }
  .cms-row__thumb{ width:56px; height:44px; }
  .cms-row__act{ width:100%; justify-content:flex-end; }
}
.admin-edit-grid{ display:grid; grid-template-columns:1fr; gap:16px; align-items:start; }
@media (min-width:900px){ .admin-edit-grid{ grid-template-columns:1fr 320px; } }


/* ---------- Rate breakup ---------- */
.rate-breakup{ display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }
.rate-breakup__cell{ display:flex; flex-direction:column; gap:2px; background:#fff; border:1px solid var(--sb-line); border-radius:12px; padding:10px 12px; }
@media (max-width:600px){ .rate-breakup{ grid-template-columns:repeat(2,1fr); } }


/* ---------- Offer / announcement strip ---------- */
.offer-strip{ position:relative; display:flex; align-items:center; justify-content:center; gap:14px; background:linear-gradient(90deg,#3b1d6e 0%,#7b2ff7 32%,#e8462c 72%,#ff8a3d 100%); color:#fff; padding:9px 44px; min-height:38px; font-family:"Albert Sans",sans-serif; overflow:hidden; }
.offer-strip__in{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; justify-content:center; }
.offer-strip__txt{ font-size:13px; font-weight:600; letter-spacing:.01em; text-shadow:0 1px 2px rgba(0,0,0,.15); }
.offer-strip__cta{ font-size:12px; font-weight:700; color:var(--sb-ink); background:#fff; padding:4px 13px; border-radius:100px; white-space:nowrap; text-decoration:none; box-shadow:0 1px 6px rgba(0,0,0,.18); }
.offer-strip__cta:hover{ transform:translateY(-1px); color:var(--sb-ink); }
.offer-strip__x{ position:absolute; right:12px; top:50%; transform:translateY(-50%); border:0; background:transparent; color:rgba(255,255,255,.7); font-size:20px; line-height:1; cursor:pointer; padding:2px 6px; }
.offer-strip__x:hover{ color:#fff; }
@media (max-width:560px){ .offer-strip__txt{ font-size:12px; } .offer-strip{ padding:8px 40px; } }


/* ---------- Studio offer tag ---------- */
.offer-tag{ display:inline-flex; align-items:center; gap:5px; background:linear-gradient(90deg,#e8462c,#ff8a3d); color:#fff; font-size:11px; font-weight:700; letter-spacing:.02em; padding:5px 11px; border-radius:100px; box-shadow:0 2px 8px rgba(232,70,44,.35); }
.offer-banner{ display:flex; align-items:center; gap:12px; background:#fff5ef; border:1px solid #ffd4bd; border-radius:16px; padding:14px 16px; }
.offer-banner__ic{ width:40px; height:40px; border-radius:12px; background:linear-gradient(135deg,#e8462c,#ff8a3d); color:#fff; display:flex; align-items:center; justify-content:center; font-size:19px; flex-shrink:0; }


/* ---------- Shared states (audit: loading / focus / tap targets) ---------- */
@keyframes sbShimmer{ 0%{background-position:-360px 0} 100%{background-position:360px 0} }
.sb-skel{
  background:linear-gradient(90deg,#efedea 0%,#f7f6f4 40%,#efedea 80%);
  background-size:720px 100%;
  animation:sbShimmer 1.3s linear infinite;
}
@media (prefers-reduced-motion:reduce){ .sb-skel{ animation:none; } }

/* Keyboard focus is visible on every interactive thing, not just inputs */
a:focus-visible, button:focus-visible, select:focus-visible, textarea:focus-visible,
.btn-pill:focus-visible, .chip:focus-visible, .slot:focus-visible,
.sb-toggle:focus-visible, .own-nav__item:focus-visible, [tabindex]:focus-visible{
  outline:3px solid var(--sb-blue);
  outline-offset:2px;
  border-radius:inherit;
}
.sb-skip{
  position:absolute; left:-9999px; top:0; z-index:9999;
  background:var(--sb-blue); color:#fff; padding:10px 16px; border-radius:0 0 12px 0;
  font-family:"DM Sans",sans-serif; font-size:13px; font-weight:600;
}
.sb-skip:focus{ left:0; color:#fff; }

/* Minimum 44px tap targets (scope §11.7) */
.admin-iconbtn{ min-width:44px; min-height:44px; }
.rt-btn, .rt-sel{ min-height:36px; }


/* ---------- Minimum tap targets, audit E3 ---------- */
.rt-btn{ min-width:44px; min-height:44px; }
.rt-sel{ min-height:44px; }
.chip{ min-height:36px; }
.sb-toggle{ min-width:46px; min-height:28px; }
.own-tabs a{ min-height:52px; }
.admin-iconbtn{ width:44px; height:44px; }
input[type="checkbox"], input[type="radio"]{ width:18px; height:18px; }
/* a checkbox/radio's clickable label row still needs the full target */
label:has(> input[type="checkbox"]), label:has(> input[type="radio"]){ min-height:44px; display:flex; align-items:center; }