/* ─────────────────────────────────────────────────────────────
   Branded classic cases (Spendly, Lexiq, nGrow, Hash Chat) — same system as the Ailuna case:
   dark site canvas, the product's logo, typeface and palette as accents; media left untouched.
   Each case sets --b1/--b2/--b3 (palette), --b-on (text on palette chips) and --b-grad.
   ───────────────────────────────────────────────────────────── */
.project[data-skin="brand"]{ --b-font:"Montserrat", system-ui, sans-serif; --b-surface:#111316; --b-edge:rgba(243,239,231,.08); --gold:var(--b1); }
.project[data-skin="brand"] .project__mark{ font-family:var(--b-font); font-weight:700; }
.project[data-skin="brand"] .project__close:hover{ border-color:var(--b1); background:color-mix(in srgb, var(--b1) 10%, transparent); }

/* hero */
.project[data-skin="brand"] .project__hero{ position:relative; isolation:isolate; }
.b-glow{ position:absolute; inset:-10% 0 auto; height:120%; z-index:-1; pointer-events:none; overflow:hidden; }
.b-glow i{ position:absolute; border-radius:50%; filter:blur(60px); opacity:.16; animation:b-float 16s ease-in-out infinite alternate; }
.b-glow i:nth-child(1){ width:38rem; height:38rem; right:-12rem; top:-8rem; background:var(--b2); }
.b-glow i:nth-child(2){ width:30rem; height:30rem; left:-14rem; top:12rem; background:var(--b1); animation-duration:19s; opacity:.12; }
.b-glow i:nth-child(3){ width:22rem; height:22rem; right:18%; top:20rem; background:var(--b3); animation-duration:13s; opacity:.08; }
@keyframes b-float{ from{ transform:translate3d(0,0,0); } to{ transform:translate3d(-4%,6%,0); } }

.b-logo{ display:block; height:clamp(2.6rem,5vw,3.6rem); width:auto; margin-bottom:2rem; }
.b-logo--mask{ aspect-ratio:var(--ar); background:var(--b-grad); -webkit-mask:var(--src) center/contain no-repeat; mask:var(--src) center/contain no-repeat; }
.b-logo--hash{ font-family:var(--b-font); font-weight:800; font-size:clamp(2rem,4vw,2.8rem); line-height:1; letter-spacing:-.04em; height:auto; color:var(--ink); }
.b-logo--hash span{ background:var(--b-grad); -webkit-background-clip:text; background-clip:text; color:transparent; }

.project[data-skin="brand"] .project__eyebrow{ font-family:var(--b-font); font-weight:700; letter-spacing:.24em; color:var(--b1); }
.project[data-skin="brand"] .project__title{ font-family:var(--b-font); font-weight:800; letter-spacing:-.04em; }
.project[data-skin="brand"] .project__title span{ font-family:var(--b-font) !important; font-weight:700 !important; letter-spacing:-.015em !important; opacity:1 !important;
  background:var(--b-grad); -webkit-background-clip:text; background-clip:text; color:transparent !important; }
.project[data-skin="brand"] .project__tags span{ font-family:var(--b-font); font-weight:600; }
.project[data-skin="brand"] .project__lead{ font-family:var(--b-font); font-weight:500; letter-spacing:-.015em; }
.project[data-skin="brand"] .project__action{ font-family:var(--b-font); font-weight:600; }
.project[data-skin="brand"] .project__meta .m b{ font-family:var(--b-font); font-weight:600; color:var(--b1); opacity:.85; }
.project[data-skin="brand"] .project__meta .m span{ font-family:var(--b-font); font-weight:600; }

/* chapters */
.project[data-skin="brand"] .project__blocks > h2{ display:flex; align-items:center; gap:1rem; font-family:var(--b-font) !important; font-weight:800 !important;
  text-transform:uppercase; letter-spacing:-.005em !important; font-size:clamp(1.45rem,3vw,2.35rem) !important; line-height:1.08; }
.b-no{ flex:0 0 auto; display:grid; place-items:center; width:2.5rem; height:2.5rem; border-radius:50%; background:var(--c,var(--b1));
  color:var(--b-on,#0E1210); font-size:.82rem; font-weight:800; letter-spacing:0; }
.project[data-skin="brand"] .project__blocks > h3{ font-family:var(--b-font) !important; font-weight:700 !important; }
.project[data-skin="brand"] .project__blocks p b{ color:var(--ink); font-weight:600; }

/* "•" lists → cards */
.b-cards{ list-style:none; margin:1.6rem 0 0; padding:0; display:grid; gap:.75rem; }
@media (min-width:760px){ .b-cards{ grid-template-columns:1fr 1fr; } .b-cards li:last-child:nth-child(odd){ grid-column:1 / -1; } }
.b-cards li{ position:relative; padding:1.15rem 1.25rem 1.15rem 4rem; border-radius:20px; background:var(--b-surface); border:1px solid var(--b-edge);
  color:var(--ink-soft); line-height:1.55; font-size:1rem; }
.b-cards li::before{ content:""; position:absolute; left:1.15rem; top:1.1rem; width:1.9rem; height:1.9rem; border-radius:50%; background:var(--c,var(--b1)); }
.b-cards li::after{ content:""; position:absolute; left:1.74rem; top:1.62rem; width:.66rem; height:.36rem; border-left:2.4px solid var(--b-on,#0E1210); border-bottom:2.4px solid var(--b-on,#0E1210); transform:rotate(-45deg); }
.b-cards li b{ display:block; color:var(--ink); font-family:var(--b-font); font-weight:700; margin-bottom:.2rem; }

/* results + next */
.project[data-skin="brand"] .project__results .r b{ font-family:var(--b-font); font-weight:800; color:var(--c,var(--b1)); }
.project[data-skin="brand"] .project__results .r span{ font-family:var(--b-font); font-weight:500; }
.project[data-skin="brand"] .project__next strong{ font-family:var(--b-font); font-weight:800; }
.project[data-skin="brand"] .project__next:hover strong{ color:var(--b1); }

/* reveal (text only) */
.project[data-skin="brand"] .b-rv{ opacity:0; transform:translateY(22px); transition:opacity .8s cubic-bezier(.22,1,.36,1), transform .9s cubic-bezier(.22,1,.36,1); }
.project[data-skin="brand"] .b-rv.is-in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
  .b-glow i{ animation:none; }
  .project[data-skin="brand"] .b-rv{ opacity:1; transform:none; transition:none; }
}

/* Spendly: the browser window is the frame — no extra placeholder frame around it */
.project[data-skin="brand"] .project__figure:has(> .st-browser){ overflow:visible !important; background:none !important; padding:0 !important; border:0 !important; border-radius:0 !important; }