/* Sleek BuildGrid — front-end styles. Namespaced .sbg */
.sbg{ --sbg-accent:#d12a31; --sbg-btn:#b81d24; --sbg-btn-text:#fff; --sbg-page:#000; --sbg-card:#0b0b0b; --sbg-text:#f6f2ec; --sbg-muted:#9a9089; --sbg-rad:0px;
	box-sizing:border-box; background:var(--sbg-page); color:var(--sbg-text);
	font-family:var(--p-font,inherit); padding:34px clamp(16px,4vw,40px) 44px; }
.sbg *,.sbg *::before,.sbg *::after{ box-sizing:border-box; }

/* ---- filter bar: red square buttons ---- */
.sbg-filters{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 30px; }
.sbg-filters--center{ justify-content:center; }
.sbg-filters--left{ justify-content:flex-start; }
.sbg-filter{ appearance:none; cursor:pointer; border:1px solid rgba(255,255,255,.18); background:transparent;
	color:var(--sbg-muted); font-family:var(--p-font,inherit); font-size:12px; font-weight:600; letter-spacing:.18em;
	text-transform:uppercase; padding:13px 22px; border-radius:var(--sbg-rad); transition:.18s ease; line-height:1; }
.sbg-filter:hover{ color:#fff; border-color:var(--sbg-btn); }
.sbg-filter.is-active{ color:var(--sbg-btn-text); background:var(--sbg-btn); border-color:var(--sbg-btn); }
.sbg-n{ font-size:10px; opacity:.7; margin-left:6px; letter-spacing:.05em; vertical-align:1px; }
.sbg-filter.is-active .sbg-n{ opacity:.8; }

/* ---- grid ---- */
.sbg-grid{ display:grid; grid-template-columns:repeat(var(--sbg-cols,3),1fr); gap:clamp(12px,1.6vw,22px); }
@media (max-width:980px){ .sbg-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px){ .sbg-grid{ grid-template-columns:1fr; } }

.sbg-item{ position:relative; display:block; text-align:left; text-decoration:none; cursor:pointer;
	border:1px solid rgba(255,255,255,.08); background:var(--sbg-card); border-radius:var(--sbg-rad);
	overflow:hidden; padding:0; font-family:inherit; color:inherit; width:100%;
	transition:transform .5s cubic-bezier(.22,1,.36,1), opacity .5s ease, border-color .25s ease; }
.sbg-item:hover{ border-color:rgba(184,29,36,.6); }
.sbg-item.is-hidden{ display:none; }
.sbg-item.is-enter{ opacity:0; transform:translateY(14px); }

.sbg-media{ position:relative; overflow:hidden; aspect-ratio:4/5; background:#000; }
.sbg-media img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s cubic-bezier(.22,1,.36,1); }
.sbg-item:hover .sbg-media img{ transform:scale(1.05); }
.sbg-noimg{ display:flex; align-items:center; justify-content:center; height:100%; color:var(--sbg-muted);
	font-size:12px; letter-spacing:.2em; text-transform:uppercase; }
.sbg-zoom{ position:absolute; right:12px; bottom:12px; width:38px; height:38px; display:flex; align-items:center;
	justify-content:center; font-size:24px; line-height:1; color:#fff; background:var(--sbg-btn);
	border:1px solid rgba(255,255,255,.18); opacity:0; transform:translateY(6px); transition:.25s ease; }
.sbg-item:hover .sbg-zoom{ opacity:1; transform:translateY(0); }

.sbg-meta{ display:flex; flex-direction:column; gap:7px; }
.sbg-type{ font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--sbg-accent); font-weight:500; font-family:var(--p-font,inherit); }
.sbg-title{ font-size:19px; font-weight:var(--p-gtw,400); line-height:1.18; color:var(--sbg-text); letter-spacing:.01em; font-family:var(--p-font,inherit); }
.sbg-ex{ font-size:13.5px; line-height:1.5; color:var(--sbg-muted); font-weight:300; font-family:var(--p-font,inherit); }

/* skin: card (caption below) */
.sbg--card .sbg-meta{ padding:18px; }

/* skin: overlay (caption over image) */
.sbg--overlay .sbg-item{ background:#000; }
.sbg--overlay .sbg-media{ aspect-ratio:4/5; }
.sbg--overlay .sbg-meta{ position:absolute; left:0; right:0; bottom:0; padding:20px 18px 18px; gap:6px;
	background:linear-gradient(to top, rgba(8,7,6,.92) 0%, rgba(8,7,6,.62) 45%, rgba(8,7,6,0) 100%); }
.sbg--overlay .sbg-ex{ display:none; }
.sbg--overlay .sbg-title{ font-size:20px; }

/* ---- load more: red square ---- */
.sbg-more-wrap{ display:flex; justify-content:center; margin-top:32px; }
.sbg-more{ appearance:none; cursor:pointer; font-family:inherit; font-size:12px; font-weight:600;
	letter-spacing:.2em; text-transform:uppercase; color:var(--sbg-btn-text); background:var(--sbg-btn);
	border:1px solid var(--sbg-btn); border-radius:var(--sbg-rad); padding:16px 38px; transition:.18s ease; }
.sbg-more:hover{ filter:brightness(1.1); }
.sbg-more-wrap.is-done{ display:none; }

.sbg-empty{ background:#0b0b0b; color:#cfc7bd; border:1px solid rgba(209,42,49,.4);
	padding:26px 28px; font-family:inherit; font-size:15px; border-radius:0; }
.sbg-empty a{ color:var(--sbg-btn); }

/* ---- lightbox ---- */
.sbg-lightbox{ position:fixed; inset:0; z-index:100000; display:flex; align-items:center; justify-content:center;
	padding:24px; background:rgba(6,5,4,.93); opacity:0; pointer-events:none; transition:opacity .3s ease; }
.sbg-lightbox.is-open{ opacity:1; pointer-events:auto; }
.sbg-lb-fig{ margin:0; max-width:min(900px,94vw); max-height:90vh; display:flex; flex-direction:column; align-items:center; }
.sbg-lb-fig img{ max-width:100%; max-height:84vh; object-fit:contain; box-shadow:0 30px 90px rgba(0,0,0,.7); }
.sbg-lb-fig figcaption{ margin-top:14px; color:#d8d0c6; font-family:inherit; font-size:13px;
	letter-spacing:.18em; text-transform:uppercase; }
.sbg-lb-close{ position:absolute; top:20px; right:24px; width:46px; height:46px; border:1px solid rgba(255,255,255,.35);
	background:rgba(0,0,0,.3); color:#fff; font-size:24px; line-height:1; cursor:pointer; display:flex;
	align-items:center; justify-content:center; transition:.2s; }
.sbg-lb-close:hover{ background:rgba(255,255,255,.14); border-color:#fff; }
.sbg-lb-nav{ position:absolute; top:50%; transform:translateY(-50%); width:54px; height:54px;
	border:1px solid rgba(255,255,255,.3); background:rgba(0,0,0,.3); color:#fff; font-size:30px; line-height:1;
	cursor:pointer; display:flex; align-items:center; justify-content:center; padding-bottom:3px; transition:.2s; }
.sbg-lb-nav:hover{ background:rgba(255,255,255,.14); border-color:#fff; }
.sbg-lb-prev{ left:24px; } .sbg-lb-next{ right:24px; }
.sbg-lb-count{ position:absolute; bottom:22px; left:50%; transform:translateX(-50%); color:rgba(255,255,255,.75);
	font-size:12px; letter-spacing:.24em; }
@media (max-width:560px){
	.sbg-lb-nav{ width:44px; height:44px; font-size:24px; } .sbg-lb-prev{ left:10px; } .sbg-lb-next{ right:10px; }
}

/* ============================================================
 *  Single Build template (.sbgp) — editorial, black
 * ============================================================ */
.sbgp{ --p-accent:#d12a31; --p-btn:#b81d24; background:#000; color:#f6f2ec;
	font-family:var(--p-font,inherit); font-weight:400; overflow-x:hidden; }
.sbgp *{ box-sizing:border-box; }
.sbgp section, .sbgp .sbgp-hero{ max-width:1100px; margin:0 auto; padding-left:clamp(18px,4vw,40px); padding-right:clamp(18px,4vw,40px); }

.sbgp-hero{ text-align:center; padding-top:var(--p-hero-pt,40px); }
.sbgp-eyebrow{ font-size:13px; letter-spacing:.42em; text-transform:uppercase; color:var(--p-eb-c,var(--p-accent)); font-weight:var(--p-eb-w,500); }
.sbgp-eyebrow{ font-size:var(--p-eb-s,13px); letter-spacing:.42em; text-transform:uppercase; color:var(--p-eb-c,var(--p-accent)); font-weight:var(--p-eb-w,500); }
.sbgp-title{ font-family:var(--p-font,inherit); font-weight:var(--p-ti-w,300); font-size:var(--p-ti-s,clamp(40px,7vw,84px)); line-height:1.02;
	letter-spacing:.01em; margin:14px 0 0; color:var(--p-ti-c,#eee2ca); text-transform:uppercase; }
.sbgp-sub{ margin-top:16px; font-size:var(--p-su-s,14px); letter-spacing:.28em; text-transform:uppercase; color:var(--p-su-c,#9a9089); font-weight:var(--p-su-w,400); }
.sbgp-hero-img{ margin-top:clamp(28px,4vw,52px); margin-bottom:clamp(22px,3.5vw,44px); }
.sbgp-hero-img img{ width:100%; height:auto; display:block; }
.sbgp-hero-img.is-full{ width:100vw; max-width:100vw; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); }
.sbgp-hero-img.is-full img{ width:100vw; height:auto; }
.sbgp-afterhero{ padding-top:clamp(8px,1.5vw,20px); padding-bottom:clamp(16px,2.5vw,32px); }
.sbgp-afterspecs{ padding-top:clamp(24px,4vw,56px); padding-bottom:clamp(8px,1.5vw,20px); }

.sbgp-stats{ display:flex; flex-wrap:wrap; justify-content:center; gap:clamp(28px,6vw,90px);
	padding-top:clamp(20px,3vw,32px); padding-bottom:clamp(20px,3vw,32px); text-align:center;
	border-top:1px solid rgba(255,255,255,.12); border-bottom:1px solid rgba(255,255,255,.12); }
.sbgp-stat{ display:flex; flex-direction:column; gap:8px; }
.sbgp-stat-v{ font-size:clamp(30px,4vw,46px); font-weight:var(--p-sv-w,600); color:var(--p-sv-c,#fff); line-height:1; }
.sbgp-stat-l{ font-size:11px; letter-spacing:.26em; text-transform:uppercase; color:var(--p-sl-c,var(--p-accent)); font-weight:var(--p-sl-w,500); }

.sbgp-kicker{ font-size:12px; letter-spacing:.4em; text-transform:uppercase; color:var(--p-kc-c,var(--p-accent));
	font-weight:var(--p-kc-w,600); display:flex; align-items:center; gap:16px; margin:0 0 24px; }
.sbgp-kicker::after{ content:""; flex:1; height:1px; background:rgba(255,255,255,.12); }

.sbgp-brief{ padding-top:clamp(56px,7vw,90px); }
.sbgp-brief .sbgp-body{ max-width:760px; font-size:17px; line-height:1.7; color:var(--p-bd-c,#cfc7bd); }
.sbgp-brief .sbgp-body p{ margin:0 0 1em; }
.sbgp-brief .sbgp-body strong{ color:#fff; }

.sbgp-specs{ padding-top:clamp(48px,6vw,80px); }
.sbgp-spec-grid{ column-count:var(--p-cols,2); column-gap:clamp(28px,5vw,72px); }
@media (max-width:560px){ .sbgp-spec-grid{ column-count:1; } }
.sbgp-spec-cols{ display:grid; grid-template-columns:repeat(var(--n,2),1fr); gap:clamp(28px,5vw,72px); align-items:start; }
@media (max-width:560px){ .sbgp-spec-cols{ grid-template-columns:1fr; } }
.sbgp-spec-column > .sbgp-spec-col{ margin:0 0 30px; }
.sbgp-spec-col{ break-inside:avoid; -webkit-column-break-inside:avoid; display:inline-block; width:100%; margin:0 0 30px; }
.sbgp-spec-col.sbg-colbreak{ break-before:column; -webkit-column-break-before:always; }
/* A single pasted block auto-splits its rows across the columns. */
.sbgp-spec-grid.is-single{ column-count:1; }
.sbgp-spec-grid.is-single .sbgp-spec-col{ display:block; }
.sbgp-spec-grid.is-single .sbgp-spec-rows{ column-count:var(--p-cols,2); column-gap:clamp(28px,5vw,72px); }
.sbgp-spec-grid.is-single .sbgp-spec-row{ break-inside:avoid; -webkit-column-break-inside:avoid; }
@media (max-width:560px){ .sbgp-spec-grid.is-single .sbgp-spec-rows{ column-count:1; } }
.sbgp-spec-col h3{ font-size:13px; letter-spacing:.2em; text-transform:uppercase; color:var(--p-sh-c,var(--p-accent));
	font-weight:var(--p-sh-w,600); margin:0 0 14px; padding-bottom:0; }
.sbgp-spec-row{ display:block; padding:6px 0; font-size:14px; line-height:1.5; }
.sbgp-spec-row .k{ color:var(--p-sk-c,#fff); font-weight:var(--p-sk-w,600); text-transform:uppercase; letter-spacing:.03em; font-size:12.5px; margin-right:5px; }
.sbgp-spec-row .v{ color:var(--p-vl-c,#cfc7bd); font-weight:var(--p-vl-w,400); }
.sbgp-spec-html{ color:var(--p-vl-c,#cfc7bd); font-size:14.5px; line-height:1.7; }
.sbgp-spec-html h2,.sbgp-spec-html h3,.sbgp-spec-html h4,.sbgp-spec-html strong{ color:var(--p-sh-c,var(--p-accent)); }
.sbgp-spec-html a{ color:var(--p-sh-c,var(--p-accent)); }

.sbgp-gallery{ padding-top:clamp(48px,6vw,80px); }
.sbgp-gal-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
@media (max-width:860px){ .sbgp-gal-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:560px){ .sbgp-gal-grid{ grid-template-columns:repeat(2,1fr); } }
.sbgp-gal{ appearance:none; border:0; padding:0; cursor:pointer; background:#0b0b0b; aspect-ratio:4/3; overflow:hidden; }
.sbgp-gal img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s cubic-bezier(.22,1,.36,1); }
.sbgp-gal:hover img{ transform:scale(1.06); }

.sbgp-cta{ text-align:center; padding-top:clamp(56px,7vw,96px); padding-bottom:clamp(56px,7vw,96px); }
.sbgp-cta-k{ font-family:inherit; font-weight:600; text-transform:uppercase; letter-spacing:.16em; font-size:clamp(18px,2.4vw,26px); color:var(--p-ct-c,#fff); margin-bottom:24px; }
.sbgp-cta-btn{ display:inline-block; text-decoration:none; background:var(--p-btn); color:#fff; font-size:12px;
	font-weight:600; letter-spacing:.2em; text-transform:uppercase; padding:16px 40px; }
.sbgp-cta-btn:hover{ filter:brightness(1.1); }

/* ---- build page: top-right "Back to Builds" (mirrors the bottom CTA) ---- */
.sbgp-topbar{ max-width:1100px; margin:0 auto; padding:18px clamp(18px,4vw,40px) 0; display:flex; justify-content:flex-end; }
.sbgp-back{ display:inline-flex; align-items:center; gap:9px; text-decoration:none; color:var(--p-su-c,#9a9089);
	font-family:var(--p-font,inherit); font-size:11px; font-weight:600; letter-spacing:.22em; text-transform:uppercase;
	padding:10px 16px; border:1px solid rgba(255,255,255,.18); border-radius:var(--sbg-rad,0); transition:.2s ease; }
.sbgp-back:hover{ color:#fff; border-color:var(--p-btn); }
.sbgp-back-ar{ font-size:14px; line-height:1; }

/* ---- build page: side arrows — navigate builds within the category ---- */
.sbgp-pager{ position:fixed; top:50%; transform:translateY(-50%); z-index:50; width:54px; height:54px;
	display:flex; align-items:center; justify-content:center; text-decoration:none; color:#fff;
	background:rgba(0,0,0,.34); border:1px solid rgba(255,255,255,.28); font-size:30px; line-height:1;
	padding-bottom:3px; transition:.2s ease; }
.sbgp-pager:hover{ background:var(--p-btn); border-color:var(--p-btn); }
.sbgp-pager--prev{ left:18px; }
.sbgp-pager--next{ right:18px; }
.sbgp-pager-t{ position:absolute; top:115%; white-space:nowrap; max-width:46vw; overflow:hidden; text-overflow:ellipsis;
	font-family:var(--p-font,inherit); font-size:10px; font-weight:500; letter-spacing:.16em; text-transform:uppercase;
	background:#111; color:#f6f2ec; border:1px solid rgba(255,255,255,.18); padding:6px 10px; opacity:0;
	pointer-events:none; transition:.2s ease; }
.sbgp-pager--prev .sbgp-pager-t{ left:0; }
.sbgp-pager--next .sbgp-pager-t{ right:0; }
.sbgp-pager:hover .sbgp-pager-t{ opacity:1; }
@media (max-width:640px){
	.sbgp-pager{ width:42px; height:42px; font-size:24px; background:rgba(0,0,0,.5); }
	.sbgp-pager--prev{ left:8px; } .sbgp-pager--next{ right:8px; }
	.sbgp-pager-t{ display:none; }
}