/* Xquisite Blendz — night violet + LED lime, Krona One / Urbanist */
:root{
  --c-primary:#c8ff3e; --c-primary-dark:#a9e01c; --c-accent:#c8ff3e;
  --c-ink:#17121f; --c-muted:#5d5470; --c-bg:#f1edf9; --c-surface:#e6e0f3;
  --c-dark:#17121f; --c-on-dark:#f1edf9; --c-border:#d2c9e6;
  --lime:#c8ff3e; --night:#17121f; --violet:#2a2140; --lilac:#f1edf9;
  --f-head:"Krona One",system-ui,sans-serif; --f-body:"Urbanist",system-ui,sans-serif; --fw-head:400;
  --radius:0; --radius-sm:0;
}
body{background:var(--lilac);color:var(--night);font-family:var(--f-body);font-size:1.06rem}
h1,h2,h3{font-family:var(--f-head);font-weight:400;text-transform:uppercase;letter-spacing:-.02em;line-height:1.08}
h2{font-size:clamp(1.6rem,3.6vw,2.6rem);margin:0 0 .6em}
.demo-banner{background:var(--lime);color:var(--night);font-weight:700}
.btn{border-radius:0;text-transform:uppercase;letter-spacing:.06em;font-size:.88rem;font-weight:800}
.xb-btn{background:var(--lime);color:var(--night);border-color:var(--lime)}
.xb-btn:hover{color:var(--night);background:#d9ff73;box-shadow:0 0 24px rgba(200,255,62,.55)}
.xb-btn-ghost{background:transparent;color:inherit;border-color:currentColor}
.xb-btn-ghost:hover{background:var(--lilac);color:var(--night)}

/* header */
.site-header{background:var(--night);border-bottom:1px solid #3a3150;backdrop-filter:none}
.brand{color:var(--lilac)} .brand:hover{color:var(--lilac)}
.xb-brandword{font-family:var(--f-head);text-transform:uppercase;font-size:.92rem;letter-spacing:.02em;line-height:1.2}
.xb-brandword small{display:block;font-family:var(--f-body);font-size:.7rem;letter-spacing:.18em;color:var(--lime);font-weight:700}
.nav-links a{color:var(--lilac);text-transform:uppercase;font-size:.8rem;letter-spacing:.12em;font-weight:700}
.nav-links a:hover{background:transparent;color:var(--lime)}
.nav-toggle{background:var(--night);border:1.5px solid var(--lime);border-radius:0}
.nav-toggle span,.nav-toggle span::before,.nav-toggle span::after{background:var(--lime)}
.nav-toggle[aria-expanded="true"] span{background:transparent}
.mobile-menu{background:var(--night);border-bottom:1px solid #3a3150}
.mobile-menu a:not(.btn){color:var(--lilac);border-color:#3a3150}

/* hero */
.xb-hero{background:var(--night);color:var(--lilac);padding:clamp(40px,7vw,96px) 0 clamp(56px,8vw,110px);overflow:hidden;position:relative}
.xb-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 22% 50%,rgba(200,255,62,.14),transparent 45%);pointer-events:none}
.xb-hero-grid{display:grid;gap:40px;align-items:center;position:relative}
.xb-ring-wrap{position:relative;max-width:460px;width:86%;margin:0 auto}
.xb-ring{aspect-ratio:1;border-radius:50%;padding:14px;background:conic-gradient(from 0deg,var(--lime),#effcc9,var(--lime),#7d9d22,var(--lime));box-shadow:0 0 60px rgba(200,255,62,.45),inset 0 0 0 2px rgba(255,255,255,.4)}
.xb-ring img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block;border:6px solid var(--night)}
.xb-bracket{font-family:var(--f-head);font-size:.78rem;letter-spacing:.08em;color:var(--lime);text-transform:uppercase;margin:0 0 16px}
.xb-hero h1{font-size:clamp(1.9rem,4.6vw,3.5rem);margin:0;color:var(--lilac)}
.xb-hero h1 span{display:block;color:var(--lime);text-shadow:0 0 22px rgba(200,255,62,.45)}
.xb-lead{font-size:clamp(1.1rem,1.8vw,1.3rem);max-width:520px;margin:22px 0 28px;color:#cfc6e4}
.xb-ctas{display:flex;flex-wrap:wrap;gap:12px}
.xb-es{margin:22px 0 0;font-weight:700;color:var(--lime)}
@media(min-width:900px){.xb-hero-grid{grid-template-columns:.9fr 1.1fr;gap:64px}}


/* walk */
.xb-walk{padding:clamp(56px,8vw,100px) 0}
.xb-walk-grid{display:grid;gap:24px;align-items:end}
.xb-walk h2{font-size:clamp(2.4rem,7vw,5rem);margin:0;line-height:.98}
.xb-walk q{font-weight:700;background:linear-gradient(transparent 60%,rgba(200,255,62,.8) 60%)}
.xb-walk-copy p{font-size:1.15rem;max-width:560px}
@media(min-width:900px){.xb-walk-grid{grid-template-columns:1fr 1fr;gap:60px}}

/* cuts */
.xb-cuts{background:var(--night);color:var(--lilac);padding:clamp(56px,8vw,100px) 0}
.xb-cuts-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:10px 20px;margin-bottom:18px}
.xb-cuts-head h2{margin:0}
.xb-rows{list-style:none;margin:0;padding:0;border-top:1px solid #3a3150}
.xb-rows li{display:grid;grid-template-columns:3rem 1fr;gap:4px 18px;padding:22px 0;border-bottom:1px solid #3a3150;transition:background .25s,padding .25s}
.xb-rows li:hover{background:var(--violet);padding-left:12px}
.xb-rows .n{font-family:var(--f-head);color:var(--lime);grid-row:span 2;font-size:1rem;padding-top:6px}
.xb-rows b{font-family:var(--f-head);font-weight:400;text-transform:uppercase;font-size:clamp(1.4rem,4vw,2.6rem)}
.xb-rows em{font-style:normal;color:#b9b0cf}
@media(min-width:900px){.xb-rows li{grid-template-columns:5rem 1fr 1fr;align-items:center}.xb-rows .n{grid-row:auto;padding:0}.xb-rows em{text-align:right}}

/* new */
.xb-new{padding:clamp(56px,8vw,100px) 0}
.xb-new-grid{display:grid;gap:36px;align-items:center}
.xb-new-photo{margin:0;position:relative}
.xb-new-photo img{width:100%;aspect-ratio:9/7;object-fit:cover;display:block;box-shadow:-14px 14px 0 var(--lime)}
.xb-new .xb-bracket{color:#5f7d12}
@media(min-width:900px){.xb-new-grid{grid-template-columns:1.1fr .9fr;gap:70px}}

/* work strip */
.xb-work{background:var(--surface,#e6e0f3);padding:clamp(56px,8vw,100px) 0}
.xb-work-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px 20px;margin-bottom:22px}
.xb-work-head h2{margin:0}
.xb-strip{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 max(20px,calc((100vw - 1180px)/2 + 20px)) 16px}
.xb-strip button{flex:0 0 min(70vw,300px);scroll-snap-align:start;padding:0;border:0;background:none;cursor:zoom-in}
.xb-strip img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block;filter:saturate(.9);transition:filter .3s,transform .3s}
.xb-strip button:hover img{filter:saturate(1.1);transform:translateY(-4px)}

/* reviews */
.xb-word{background:var(--violet);color:var(--lilac);padding:clamp(56px,8vw,100px) 0}
.xb-word-grid{display:grid;gap:28px}
.xb-word h2{color:var(--lilac)}
@media(min-width:900px){.xb-word-grid{grid-template-columns:.8fr 1.2fr;align-items:start}}

/* visit */
.xb-visit{padding:clamp(56px,8vw,100px) 0}
.xb-visit-grid{display:grid;gap:36px}
.xb-addr{font-family:var(--f-head);text-transform:uppercase;font-size:1.3rem;line-height:1.35}
.xb-link{font-weight:800;color:var(--night);text-decoration-color:var(--lime);text-decoration-thickness:3px}
.xb-map{border-radius:0;min-height:340px;border:2px solid var(--night)}
.xb-map iframe{min-height:340px}
@media(min-width:900px){.xb-visit-grid{grid-template-columns:1fr 1.2fr}.xb-map,.xb-map iframe{min-height:460px}}

/* contact */
.xb-contact{background:var(--night);color:var(--lilac);padding:clamp(56px,8vw,100px) 0}
.xb-contact h2{color:var(--lime)}
.xb-contact-grid{display:grid;gap:30px;align-items:center}
.xb-form{background:var(--lilac);color:var(--night);border-radius:0;border:0;box-shadow:0 0 0 2px var(--lime),0 0 40px rgba(200,255,62,.25)}
.xb-form input,.xb-form textarea{border-radius:0;border:1.5px solid var(--night)}
@media(min-width:900px){.xb-contact-grid{grid-template-columns:.9fr 1.1fr}}

/* footer */
.xb-footer{background:var(--night);color:#b9b0cf;padding:10px 0 28px;border-top:1px solid #3a3150}
.xb-footer a{color:var(--lime)}
.xb-footer-big{font-family:var(--f-head);text-transform:uppercase;font-size:clamp(1.8rem,8.5vw,6.6rem);color:var(--lilac);margin:16px 0;line-height:1;letter-spacing:-.04em;opacity:.95;overflow-wrap:anywhere}
.xb-footer-row{display:flex;flex-wrap:wrap;gap:8px 28px;justify-content:space-between;font-size:.9rem}

.call-bar{background:var(--night);border-top:1px solid #3a3150}
.call-bar .xb-btn-ghost{color:var(--lilac)}
.lightbox{background:rgba(23,18,31,.95)}
.lightbox-btn{border-radius:0}

/* reviews as a dated log */
.xb-logs{display:grid;border-top:2px solid var(--lilac)}
.xb-log{margin:0;display:grid;grid-template-columns:minmax(0,1fr);gap:6px 28px;padding:22px 0;border-bottom:2px solid rgba(230,220,255,.35)}
.xb-log-date{margin:0;font-family:var(--f-head);text-transform:uppercase;color:var(--lime);line-height:1}
.xb-log-date b{display:inline-block;font-size:clamp(1.6rem,4vw,2.4rem);font-weight:400;margin-right:10px}
.xb-log-date span{font-size:.9rem;letter-spacing:.12em;color:var(--lilac)}
.xb-log blockquote{margin:0;font-family:var(--f-body);text-transform:none;letter-spacing:0;font-size:1.2rem;font-weight:600;line-height:1.45;color:#fff}
.xb-log figcaption{font-family:var(--f-body);font-size:.85rem;color:var(--lilac)}
.xb-log figcaption a{color:var(--lime);font-weight:700}
@media(min-width:700px){.xb-log{grid-template-columns:150px minmax(0,1fr)}.xb-log-date span{display:block;margin-top:6px}.xb-log blockquote,.xb-log figcaption{grid-column:2}.xb-log-date{grid-row:1 / span 2}}
