/* Homepage composition. Colour, type, spacing, radius and motion come from
   /assets/weareswarm-brand.css. Composition, hero treatment, section rhythm and
   CTA presentation are deliberately this file's own.

   --electric now resolves to the canonical cyan: lime is no longer the primary
   identity, only a campaign highlight (see the campaign block at the end). */
:root{--ink:var(--brand-bg);--paper:var(--brand-text);--electric:var(--brand-accent);--warm:var(--brand-campaign-warm);--campaign:var(--brand-campaign);--silver:var(--brand-muted);--showcase-max:1440px}
*{box-sizing:border-box}
html{background:var(--ink);max-width:100%;overflow-x:hidden;scroll-behavior:smooth}
body{margin:0;background:var(--ink);font-family:var(--brand-font-sans);color:var(--paper);overflow-x:hidden;max-width:100%}
img,svg,video,canvas{max-width:100%;height:auto}
button,input,select,textarea{font:inherit}
.skip-link{position:fixed;top:-60px;left:20px;z-index:100;background:var(--electric);color:var(--ink);padding:12px 18px;font-weight:800;border:0;cursor:pointer}.skip-link:focus{top:12px}
#ds-field{position:fixed;inset:0;width:100vw;height:100vh;max-width:none;z-index:0;pointer-events:none;overflow:hidden;display:block;opacity:.78}
.ds-hud{position:fixed;left:0;right:0;bottom:0;z-index:20;display:flex;align-items:center;flex-wrap:wrap;gap:8px 26px;padding:8px 20px;border-top:1px solid rgba(0,245,255,.18);background:rgba(1,3,10,.88);backdrop-filter:blur(18px) saturate(1.2);box-shadow:0 -12px 40px rgba(0,0,0,.35);font-family:"DM Mono",monospace;font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:#8f939b;opacity:0;transform:translateY(100%);transition:opacity .5s ease,transform .5s ease;pointer-events:none}.ds-hud.ds-in{opacity:.82;transform:none}.ds-hud-title{display:flex;align-items:center;gap:7px;color:var(--electric);margin-right:auto}.ds-hud-title:before{content:"";width:5px;height:5px;border-radius:50%;background:var(--electric);box-shadow:0 0 9px var(--electric)}.ds-hud-row{display:flex;align-items:center;gap:8px}.ds-hud-row b{color:var(--paper);font-weight:700}
.showcase-noise{position:fixed;inset:0;z-index:30;opacity:.035;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
body:before{background:radial-gradient(circle at 73% 21%,rgba(0,245,255,.08),transparent 23rem),radial-gradient(circle at 9% 54%,rgba(255,109,58,.05),transparent 28rem),var(--ink)}
body:after{display:none}
.showcase-header,main,.showcase-footer{position:relative;z-index:1}
.showcase-header{height:96px;max-width:var(--showcase-max);margin:auto;padding:0 42px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;border-bottom:1px solid #ffffff1a;position:relative;z-index:40}
.showcase-brand{display:flex;align-items:center;gap:12px;color:var(--paper);text-decoration:none;font-size:.72rem;font-weight:800;line-height:.95;letter-spacing:.04em;width:max-content}.showcase-brand svg{width:36px;height:36px;fill:none;stroke:currentColor;stroke-width:1.5}.showcase-brand circle{fill:var(--electric);stroke:none}
.showcase-nav{display:flex;align-items:center;gap:34px}.showcase-nav a{color:#d6d6d0;text-decoration:none;font-size:.78rem;font-weight:600;letter-spacing:.02em}.showcase-nav a:hover{color:var(--electric)}
.header-cta{justify-self:end;color:var(--paper);text-decoration:none;text-transform:uppercase;font-size:.72rem;font-weight:700;letter-spacing:.08em;border-bottom:1px solid var(--electric);padding:8px 0}.header-cta span{color:var(--electric);margin-left:8px}
.showcase-hero{min-height:calc(100vh - 96px);max-width:var(--showcase-max);margin:auto;padding:80px 42px 44px;position:relative;display:flex;align-items:center;overflow:hidden}
.hero-copy-showcase{position:relative;z-index:4;width:min(830px,70%)}.kicker,.section-label,.proof-kicker{font-family:"DM Mono",monospace;text-transform:uppercase;letter-spacing:.12em;font-size:.67rem;color:#a7abb4}.kicker{display:flex;align-items:center;gap:10px;margin-bottom:30px}.kicker span{width:7px;height:7px;border-radius:50%;background:var(--electric);box-shadow:0 0 16px var(--electric)}
.hero-copy-showcase h1{font-size:clamp(4.5rem,9.3vw,9.3rem);line-height:.82;letter-spacing:-.078em;text-shadow:none;font-weight:600;margin:0}.hero-copy-showcase h1 em,.display-copy strong,.proof-statement h2 em,.final-cta h2 em{font-family:var(--brand-font-editorial);font-weight:400;color:var(--electric)}
.hero-lede{max-width:620px;margin:38px 0 0;color:#b7bac1;font-size:clamp(1rem,1.3vw,1.2rem);line-height:1.7}.hero-buttons{display:flex;align-items:center;gap:35px;margin-top:35px}
.primary-action,.final-cta>a{display:inline-flex;justify-content:space-between;align-items:center;min-width:220px;padding:17px 20px;color:var(--ink);background:var(--electric);text-decoration:none;text-transform:uppercase;letter-spacing:.08em;font-size:.69rem;font-weight:800;transition:.25s}.primary-action:hover,.final-cta>a:hover{background:var(--paper);transform:translateY(-2px)}
.text-action{color:var(--paper);text-decoration:none;font-size:.78rem;font-weight:600}.play{display:inline-grid;place-items:center;width:31px;height:31px;border:1px solid #ffffff38;border-radius:50%;font-size:.55rem;margin-right:8px}
.hero-orbit{position:absolute;width:min(53vw,720px);aspect-ratio:1;right:-5%;top:50%;transform:translateY(-50%);opacity:.85}.orbit{position:absolute;inset:10%;border:1px solid #ffffff1f;border-radius:50%}.orbit-one:after,.orbit-two:after{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:var(--electric);top:8%;left:27%;box-shadow:0 0 18px var(--electric)}.orbit-two{inset:25%;border-style:dashed;transform:rotate(28deg)}.orbit-two:after{background:var(--warm);left:80%;top:65%;box-shadow:0 0 18px var(--warm)}.orbit-core{position:absolute;inset:40%;border:1px solid #c7ff3866;border-radius:50%;display:grid;place-items:center;box-shadow:0 0 70px #c7ff3819}.orbit-core span{width:18%;aspect-ratio:1;background:var(--electric);transform:rotate(45deg);box-shadow:0 0 30px #c7ff38aa}.orbit-node{position:absolute;font:500 .58rem "DM Mono";color:#8e929a;border:1px solid #ffffff27;border-radius:50%;width:42px;height:42px;display:grid;place-items:center;background:var(--ink)}.node-one{left:13%;top:12%}.node-two{right:4%;top:41%}.node-three{left:18%;bottom:6%}.node-four{right:22%;bottom:12%}
.hero-index{position:absolute;right:42px;top:40%;font:500 .57rem "DM Mono";color:#81858d;display:flex;flex-direction:column;align-items:center;gap:9px}.hero-index div{height:105px;width:1px;background:linear-gradient(var(--electric) 28%,#ffffff2b 28%)}.scroll-cue{position:absolute;bottom:32px;right:42px;font:500 .58rem "DM Mono";text-transform:uppercase;letter-spacing:.12em;color:#777b83}.scroll-cue span{color:var(--electric);margin-left:8px}
.signal-strip{max-width:var(--showcase-max);margin:auto;min-height:105px;padding:0 42px;border-top:1px solid #ffffff1a;border-bottom:1px solid #ffffff1a;display:flex;align-items:center;justify-content:space-between;gap:30px}.signal-strip p{margin:0;color:#7f838a;font:500 .65rem "DM Mono";text-transform:uppercase;letter-spacing:.09em}.signal-items{display:flex;gap:45px}.signal-items span{font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em}.signal-items i{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--electric);margin:0 9px 2px 0}
.showcase-section{max-width:var(--showcase-max);margin:auto;padding:125px 42px;display:grid;grid-template-columns:220px 1fr;gap:40px}.section-label{padding-top:12px}.section-label span{color:var(--electric);margin-right:18px}.display-copy{font-size:clamp(2.8rem,5.5vw,5.8rem);line-height:.98;letter-spacing:-.06em;color:var(--paper);margin:0}.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;margin:65px 0 0 auto;max-width:820px}.intro-grid p{font-size:.94rem;line-height:1.75;color:#999da5;margin:0}
.capability-grid{max-width:var(--showcase-max);margin:auto;padding:0 42px 130px;display:grid;grid-template-columns:repeat(3,1fr);gap:1px}.capability-card{min-height:500px;padding:30px;border:1px solid #ffffff18;margin-right:-1px;display:flex;flex-direction:column;transition:.3s;background:#0c0e14}.capability-card.featured,.capability-card:hover{background:var(--electric);color:var(--ink);transform:translateY(-8px)}.card-top{display:flex;justify-content:space-between;font:500 .65rem "DM Mono";color:#8a8e96}.featured .card-top,.capability-card:hover .card-top{color:#30351f}.card-arrow{font-size:1rem}.card-symbol{height:165px;position:relative;margin:30px 0}.card-symbol i{position:absolute;display:block;border:1px solid #ffffff35}.featured .card-symbol i,.capability-card:hover .card-symbol i{border-color:#11151d55}.strategy-symbol i{width:100px;height:100px;border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%)}.strategy-symbol i:nth-child(2){width:55px;height:55px}.strategy-symbol i:nth-child(3){width:8px;height:8px;background:currentColor;border-radius:50%}.product-symbol i{width:70px;height:70px;transform:rotate(45deg);left:43%;top:28%}.product-symbol i:nth-child(2){left:30%;top:41%}.product-symbol i:nth-child(3){left:56%;top:41%}.product-symbol i:nth-child(4){width:6px;height:6px;background:var(--electric);border:0;border-radius:50%;left:50%;top:50%}.automation-symbol i{height:1px;width:70%;left:15%;top:50%}.automation-symbol i:nth-child(2),.automation-symbol i:nth-child(3){width:42px;height:42px;border-radius:50%;top:calc(50% - 21px);left:15%}.automation-symbol i:nth-child(3){left:auto;right:15%;background:var(--electric)}.capability-card h2{font-size:1.65rem;line-height:1.15;letter-spacing:-.04em;margin:auto 0 18px}.capability-card p{font-size:.82rem;line-height:1.65;color:#8f939b;margin:0;max-width:32ch}.featured p,.capability-card:hover p{color:#333728}
.method-section{border-top:1px solid #ffffff18}.method-board{display:grid;grid-template-columns:repeat(4,1fr);margin-top:70px}.method-step{padding:25px 25px 30px;border-top:1px solid #ffffff2b;position:relative}.method-step:before{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:#555961;top:-4px;left:25px}.method-step.active:before{background:var(--electric);box-shadow:0 0 12px var(--electric)}.method-step>span{font:500 .6rem "DM Mono";color:#686c74}.method-step h3{font-size:1.1rem;margin:42px 0 15px}.method-step p{font-size:.78rem;line-height:1.65;color:#858991;margin:0}.method-step.active{background:#ffffff06}
.proof-statement{max-width:var(--showcase-max);margin:auto;padding:140px 42px;background:var(--paper);color:var(--ink);text-align:center}.proof-kicker{color:#666b72}.proof-statement h2{font-size:clamp(3rem,6.7vw,7rem);line-height:.91;letter-spacing:-.065em;margin:28px 0}.proof-statement h2 em{color:#315d45}.proof-statement>p:not(.proof-kicker){max-width:630px;margin:0 auto;color:#5d6168;font-size:1rem}.proof-actions{display:flex;justify-content:center;gap:35px;margin-top:45px}.proof-actions a{color:var(--ink);text-decoration:none;border-bottom:1px solid #8b8e91;padding:10px 0;text-transform:uppercase;font-size:.68rem;letter-spacing:.08em;font-weight:800}.proof-actions span{margin-left:30px}
.final-cta{max-width:var(--showcase-max);margin:auto;padding:130px 42px;min-height:650px;display:flex;flex-direction:column;align-items:center;text-align:center;justify-content:center;position:relative;overflow:hidden}.final-cta:before{content:"";position:absolute;width:560px;height:560px;border:1px solid #ffffff12;border-radius:50%}.final-cta p{font:500 .65rem "DM Mono";text-transform:uppercase;letter-spacing:.1em;color:#8e9299;position:relative}.final-cta h2{font-size:clamp(3rem,6.5vw,6.7rem);letter-spacing:-.065em;line-height:.92;margin:25px 0 45px;position:relative}.final-cta>a{position:relative}.cta-mark span{position:absolute;width:330px;height:330px;border:1px solid #c7ff3820;border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%)}.cta-mark span:nth-child(2){width:430px;height:430px}.cta-mark span:nth-child(3){width:530px;height:530px}
.showcase-footer{max-width:var(--showcase-max);margin:auto;padding:35px 42px;min-height:120px;border-top:1px solid #ffffff1a;display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:25px;align-items:center}.showcase-footer p,.showcase-footer small{font:500 .6rem "DM Mono";color:#777b83;text-transform:uppercase;letter-spacing:.08em;margin:0}.showcase-footer>div{display:flex;gap:22px}.showcase-footer>div a{color:#a4a7ad;text-decoration:none;font-size:.7rem}
@media(max-width:900px){.showcase-header{grid-template-columns:1fr auto;padding:0 22px}.showcase-nav{display:none}.showcase-hero{padding:65px 22px 40px}.hero-copy-showcase{width:100%}.hero-orbit{opacity:.35;width:90vw;right:-40%;top:42%}.hero-index{display:none}.signal-strip{padding:24px 22px;align-items:flex-start}.signal-items{gap:15px;flex-wrap:wrap;justify-content:flex-end}.showcase-section{padding:90px 22px;grid-template-columns:1fr}.capability-grid{padding:0 22px 90px;grid-template-columns:1fr}.capability-card{min-height:420px}.intro-grid{gap:30px}.method-board{grid-template-columns:1fr 1fr}.proof-statement,.final-cta{padding:100px 22px}.showcase-footer{padding:35px 22px;grid-template-columns:1fr 1fr}.showcase-footer>div{justify-self:end}}
@media(max-width:560px){.showcase-header{height:78px}.header-cta{font-size:.61rem}.showcase-hero{min-height:calc(100svh - 78px);align-items:flex-start}.hero-copy-showcase h1{font-size:clamp(3.7rem,19vw,5.4rem);margin-top:12px}.hero-lede{font-size:.95rem}.hero-buttons{align-items:flex-start;flex-direction:column;gap:22px}.scroll-cue{display:none}.signal-strip{display:block}.signal-items{justify-content:flex-start;margin-top:18px}.signal-items span{width:44%}.intro-grid{grid-template-columns:1fr}.method-board{grid-template-columns:1fr}.method-step{min-height:180px}.proof-actions{flex-direction:column;gap:8px;align-items:center}.showcase-footer{grid-template-columns:1fr}.showcase-footer>div{justify-self:start}.showcase-footer small{margin-top:10px}}
@media(max-width:720px){.ds-hud{display:none}}
@media(prefers-reduced-motion:reduce){.ds-hud{transition:none}}
@media(prefers-reduced-motion:no-preference){.orbit-one{animation:spin 32s linear infinite}.orbit-two{animation:spin-reverse 24s linear infinite}.orbit-core{animation:breathe 4s ease-in-out infinite}@keyframes spin{to{transform:rotate(360deg)}}@keyframes spin-reverse{from{transform:rotate(28deg)}to{transform:rotate(-332deg)}}@keyframes breathe{50%{box-shadow:0 0 110px #c7ff3830}}}

/* --- Campaign highlights --------------------------------------------------
   Lime is no longer the homepage's identity colour — cyan is, domain-wide.
   It survives only inside the hero orbit illustration, which is the one place
   it reads as campaign energy rather than as a competing brand. The lime glows
   already hardcoded on .orbit-core (#c7ff3866 / #c7ff3819 / #c7ff3830) belong
   to this same treatment.
   Everything else that used to be lime now resolves to var(--brand-accent). */
.orbit-one:after{background:var(--campaign);box-shadow:0 0 18px var(--campaign)}
.orbit-core span{background:var(--campaign);box-shadow:0 0 30px #c7ff38aa}

/* --- Work page ------------------------------------------------------------ */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.showcase-nav a[aria-current="page"]{color:var(--electric)}
.work-hero{max-width:var(--showcase-max);margin:auto;padding:112px 42px 78px;min-height:calc(78vh - 96px);position:relative;display:flex;align-items:center;border-bottom:1px solid #ffffff1a}
.work-hero-copy{width:min(980px,82%);position:relative;z-index:3}.work-hero-copy h1{font-size:7rem;line-height:.86;letter-spacing:0;margin:0}.work-hero-copy h1 em{font-family:var(--brand-font-editorial);font-weight:400;color:var(--electric)}.work-hero-copy>p:last-child{max-width:690px;margin:36px 0 0;color:#b7bac1;font-size:1.12rem;line-height:1.7}
.work-hero-index{position:absolute;right:42px;top:35%;font:500 .57rem "DM Mono";color:#81858d;display:flex;flex-direction:column;align-items:center;gap:9px}.work-hero-index div{height:105px;width:1px;background:linear-gradient(var(--electric) 35%,#ffffff2b 35%)}
.case-study-section,.more-work-section{max-width:var(--showcase-max);margin:auto;padding:118px 42px;display:grid;grid-template-columns:220px 1fr;gap:40px;border-bottom:1px solid #ffffff1a}
.case-study-stack{display:grid;gap:1px;background:#ffffff24;border:1px solid #ffffff24}.case-study{display:grid;grid-template-columns:minmax(260px,.45fr) 1fr;gap:0;background:var(--ink);min-height:520px}.case-visual{min-height:100%;display:grid;place-items:center;position:relative;overflow:hidden;background:#0c0e14}.case-visual:before,.case-visual:after{content:"";position:absolute;border:1px solid #ffffff26;border-radius:50%;width:72%;aspect-ratio:1}.case-visual:after{width:44%;border-color:rgba(0,245,255,.5);box-shadow:0 0 80px rgba(0,245,255,.12)}.case-visual span{position:relative;z-index:2;font:800 5.6rem var(--brand-font-sans);letter-spacing:0;color:var(--paper)}.fri-visual{background:linear-gradient(135deg,#111721,#06080d)}.swarm-visual{background:radial-gradient(circle at 50% 50%,rgba(0,245,255,.16),#090b11 64%)}.dreamscape-visual{background:linear-gradient(135deg,rgba(168,85,247,.2),#070910 65%)}
.case-copy{padding:58px 72px;display:flex;flex-direction:column;justify-content:center}.case-copy h3{font-size:4.8rem;line-height:.9;letter-spacing:0;margin:18px 0 42px}.case-copy dl{display:grid;gap:20px;margin:0}.case-copy dl div{display:grid;grid-template-columns:105px 1fr;gap:26px;border-top:1px solid #ffffff1c;padding-top:18px}.case-copy dt{font:500 .62rem "DM Mono";text-transform:uppercase;letter-spacing:0;color:var(--electric)}.case-copy dd{margin:0;color:#aeb2ba;line-height:1.68;font-size:.95rem}.case-link,.work-proof-band>a{width:max-content;color:var(--paper);text-decoration:none;text-transform:uppercase;font-size:.68rem;letter-spacing:0;font-weight:800;border-bottom:1px solid var(--electric);padding:12px 0;margin-top:36px}.case-link span,.work-proof-band>a span{color:var(--electric);margin-left:24px}
.more-work-grid h2{font-size:4.8rem;line-height:.96;letter-spacing:0;margin:0 0 52px;max-width:920px}.work-chip-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#ffffff24;border:1px solid #ffffff24}.work-chip-grid a{min-height:170px;background:#0c0e14;color:var(--paper);text-decoration:none;padding:26px;display:flex;align-items:flex-end;justify-content:space-between;font-size:1.04rem;font-weight:800;letter-spacing:0;transition:.25s}.work-chip-grid a:hover{background:var(--electric);color:var(--ink);transform:translateY(-4px)}.work-chip-grid span{font-size:.85rem;color:var(--electric)}.work-chip-grid a:hover span{color:var(--ink)}
.work-proof-band{max-width:var(--showcase-max);margin:auto;padding:128px 42px;background:var(--paper);color:var(--ink);text-align:center}.work-proof-band h2{font-size:6rem;line-height:.9;letter-spacing:0;margin:28px 0 22px}.work-proof-band h2 span{font-family:var(--brand-font-editorial);font-weight:400;color:#315d45}.work-proof-band p{max-width:650px;margin:0 auto;color:#5d6168;font-size:1rem;line-height:1.75}.work-proof-band>a{display:inline-flex;color:var(--ink);margin-top:42px}
@media(max-width:900px){.work-hero{padding:82px 22px 62px}.work-hero-copy{width:100%}.work-hero-copy h1{font-size:5.2rem}.work-hero-index{display:none}.case-study-section,.more-work-section{padding:90px 22px;grid-template-columns:1fr}.case-study{grid-template-columns:1fr;min-height:0}.case-visual{min-height:280px}.case-copy{padding:42px 28px}.case-copy h3{font-size:4rem}.more-work-grid h2{font-size:4rem}.work-chip-grid{grid-template-columns:1fr 1fr}.work-proof-band{padding:100px 22px}.work-proof-band h2{font-size:4.6rem}}
@media(max-width:560px){.work-hero{min-height:auto;padding-top:72px}.work-hero-copy h1{font-size:3.7rem}.case-copy dl div{grid-template-columns:1fr;gap:8px}.work-chip-grid{grid-template-columns:1fr}.work-chip-grid a{min-height:118px}.case-copy{padding:36px 22px}.case-copy h3{font-size:3rem}.more-work-grid h2{font-size:3rem}.work-proof-band h2{font-size:3.4rem}.case-visual span{font-size:4rem}}

/* --- Dream Suite preview --------------------------------------------------
   The commercial projection of ops/registry/dream-suite.yml. The markup is
   generated by runtime/tools/generate_dream_suite.py into the dream-suite
   markers on index.html; only presentation lives here.

   Deliberately a quiet list, not a card grid. The suite is not merchandise on
   this domain: .site says why the systems matter and hands the visitor to
   weareswarm.online, which is where they are operated and where their real
   state is published. No status, no counts, no metrics belong here — a second
   copy of runtime truth on the buyer surface would be a slower, wronger one. */
.suite-section{border-top:1px solid #ffffff18}
.suite-list{display:grid;margin:62px 0 0;border-top:1px solid #ffffff24}
.suite-item{display:grid;grid-template-columns:64px 1fr auto;align-items:baseline;gap:0 28px;padding:30px 4px;border-bottom:1px solid #ffffff18;color:var(--paper);text-decoration:none;transition:.28s}
.suite-item:hover{background:#ffffff06;padding-left:14px;padding-right:0}
.suite-index{font:500 .62rem "DM Mono";letter-spacing:.1em;color:#686c74}
.suite-item:hover .suite-index{color:var(--electric)}
.suite-item h3{margin:0;font-size:1.6rem;font-weight:800;letter-spacing:-.035em;line-height:1.1}
.suite-item p{grid-column:2;margin:10px 0 0;max-width:46ch;font-size:.86rem;line-height:1.65;color:#8f939b}
.suite-arrow{grid-row:1;grid-column:3;font-size:1rem;color:#686c74;transition:.28s}
.suite-item:hover .suite-arrow{color:var(--electric);transform:translate(4px,-4px)}
.suite-cta{display:inline-flex;align-items:center;gap:26px;width:max-content;margin-top:52px;padding:12px 0;border-bottom:1px solid var(--electric);color:var(--paper);text-decoration:none;text-transform:uppercase;font-size:.68rem;font-weight:800;letter-spacing:.08em}
.suite-cta span{color:var(--electric)}
.suite-cta:hover{border-bottom-color:var(--paper)}
@media(max-width:900px){.suite-list{margin-top:38px}.suite-item{grid-template-columns:40px 1fr auto;gap:0 16px;padding:24px 2px}.suite-item h3{font-size:1.3rem}.suite-cta{margin-top:38px}}

/* --- Informational surfaces -----------------------------------------------
   The showcase system was authored for five buyer pages: hero, case studies,
   CTA. The other twelve routes (/feed/, /roadmap/, /tasks/, /profile/ …) are
   informational — card grids, status tags, callouts — and had no showcase
   vocabulary at all, which is why they were still stranded on
   weareswarm-theme.css and looked like a different site.

   Two legacy patterns needed nothing new and are deliberately not duplicated
   here: .eyebrow maps onto the existing .kicker, and .section-head onto the
   existing .section-label inside a .showcase-section grid.

   Panels use the same hairline-gap construction as .case-study-stack and
   .work-chip-grid — a 1px grid gap over a #ffffff24 backdrop — so the
   informational pages inherit the buyer pages' geometry rather than
   approximating it. auto-fit replaces the old fixed .grid-2/.grid-3/.grid-4,
   so column count follows width instead of being asserted per page. */
.panel-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(232px,1fr));gap:1px;background:#ffffff24;border:1px solid #ffffff24;margin-top:52px}
.panel{background:#0c0e14;padding:30px;display:flex;flex-direction:column;gap:12px;transition:.28s}
.panel:hover{background:#11141c}
.panel h2,.panel h3{margin:0;font-size:1.22rem;font-weight:800;letter-spacing:-.03em;line-height:1.2}
.panel p{margin:0;font-size:.84rem;line-height:1.68;color:#8f939b}
.panel ul{margin:0;padding-left:1.1rem;color:#8f939b;font-size:.84rem;line-height:1.68}
.panel li+li{margin-top:6px}
.panel a{color:var(--electric);text-decoration:none;font-size:.78rem;font-weight:700}
.panel a:hover{color:var(--paper)}

/* Status tag. Colour carries meaning here, so each state also keeps its word —
   never let the swatch be the only signal. */
.panel-tag{width:max-content;font:500 .58rem "DM Mono",monospace;text-transform:uppercase;letter-spacing:.12em;color:#a7abb4;border:1px solid #ffffff2b;padding:5px 10px}
.panel-tag.is-active{color:var(--electric);border-color:#00f5ff5c}
.panel-tag.is-queued{color:#b7bac1}
.panel-tag.is-blocked{color:var(--warm);border-color:#ff6d3a5c}
.panel-tag.is-closed{color:#7f838a}

/* Quiet aside. .work-proof-band inverts to paper and shouts; a footnote-scale
   caveat needs the opposite, so this stays on ink with a single accent rule. */
.note-band{margin-top:52px;padding:28px 32px;border:1px solid #ffffff18;border-left:2px solid var(--electric);background:#ffffff06}
.note-band h2,.note-band h3{margin:0 0 10px;font-size:1.1rem;font-weight:800;letter-spacing:-.02em}
.note-band p{margin:0;font-size:.88rem;line-height:1.72;color:#999da5;max-width:78ch}

/* Footer directory. generate-nav.py injects the `directory` tier above
   .footerbar, which exists only in weareswarm-theme.css — so migrating a page
   to the showcase footer without this would silently strand /profile/,
   /community/, /tasks/ and /level10/, whose only inbound links are these. The
   navdir markers are carried into .showcase-footer so the generator keeps
   owning the block, and it spans the full width as its own row. */
.showcase-footer .footer-directory{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:22px;padding-top:22px;margin-top:4px;border-top:1px solid #ffffff14}
.showcase-footer .footer-directory a{color:#777b83;text-decoration:none;font:500 .6rem "DM Mono",monospace;text-transform:uppercase;letter-spacing:.08em}
.showcase-footer .footer-directory a:hover{color:var(--electric)}

@media(max-width:900px){.panel-grid{margin-top:38px}.panel{padding:24px}.note-band{margin-top:38px;padding:24px}}
@media(max-width:560px){.panel-grid{grid-template-columns:1fr}.showcase-footer .footer-directory{gap:14px}}