/* Homepage additions (ACR-1587): partner strip, numbers, quote, FAQ.
   Same type, colour and spacing roles as homepage.css; Manrope headings, Inter body. */
body main.homepage>.business-strip{background:#fff;padding:4px 0 60px}
body main.homepage .business-strip h2{color:#526b7e}
body main.homepage>:is(.home-quote,.home-faq){padding-block:var(--site-section-space)}
body main.homepage>.home-quote{background:#f8fafc}
body main.homepage>.home-faq{background:#fff}
/* Quote: one voice, centred, with the attribution under it. */
.home-quote figure{margin:0 auto;max-width:52rem;text-align:center}
.home-quote small{margin-bottom:1.5rem}
.home-quote blockquote{margin:0;font:500 clamp(1.5rem,2.6vw,2.125rem)/1.35 NexusManrope,Manrope,system-ui,sans-serif;letter-spacing:-.02em;color:var(--site-ink);text-wrap:balance}
.home-quote figure[data-slot] blockquote{color:#6b8090}
.home-quote figcaption{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:1.75rem;font:400 .9375rem/1.45 var(--site-body);color:var(--site-muted);text-align:left}
.home-quote figcaption i{flex:none;width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,#dbe9f3,#c3dcec)}
.home-quote figcaption b{display:block;color:var(--site-ink);font-weight:600}
/* FAQ: a single column of questions; the answer opens in place. */
.home-faq-list{max-width:52rem;margin:3rem auto 0;border-top:1px solid #d6e2ea}
.home-faq details{border-bottom:1px solid #d6e2ea}
.home-faq summary{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:64px;padding:18px 0;cursor:pointer;list-style:none;font:600 1.125rem/1.4 NexusManrope,Manrope,system-ui,sans-serif;letter-spacing:-.01em;color:var(--site-ink)}
.home-faq summary::-webkit-details-marker{display:none}
.home-faq summary i{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#eef4f8;color:#14638f;font-style:normal;font-size:18px;line-height:1;transition:transform 220ms cubic-bezier(.2,.8,.2,1),background-color 160ms ease-out}
.home-faq summary:hover i{background:#e2edf5}
.home-faq summary:active i{transform:scale(.92)}
.home-faq details[open] summary i{transform:rotate(45deg);background:#dbeaf4}
.home-faq summary:focus-visible{outline:2px solid #2180b8;outline-offset:4px;border-radius:6px}
.home-faq details p{margin:0 0 24px;max-width:64ch;font:400 1rem/1.7 var(--site-body);color:var(--site-muted)}
@media(max-width:900px){
 .home-faq-list{margin-top:2.25rem}
 body main.homepage .home-faq .marketing-heading{text-align:left;margin-left:0}
}
@media(max-width:640px){
 body main.homepage>.business-strip{padding-bottom:48px}
 .home-quote blockquote{font-size:1.375rem;line-height:1.4}
 .home-quote figcaption{font-size:.875rem}
 .home-faq summary{font-size:1rem;gap:16px;min-height:60px;padding:14px 0}
 .home-faq details p{font-size:.9375rem;margin-bottom:20px}
}
@media(prefers-reduced-motion:reduce){.home-faq summary i{transition:none}}
@media(forced-colors:active){.home-faq summary i{outline:1px solid CanvasText}}

/* Founders photo (13 Oct): on a phone the block crops to 4:3; keep the three faces (15 to 45 percent down) in frame. */
.home-about figure img.k-founders{object-position:50% 20%}

/* 13 Oct: the "Sample data" pill is gone (James); it used to push the Pause button to the right of the channel bar. */
.hd-bar .hd-control{margin-left:auto}

/* ---------- Type scale (James, 13 Oct ~20:45 UTC: section headings were "the same size as the heading in the hero so it looked weird").
   One hierarchy on every page, the homepage included: the page title is the largest thing on the page, section headings
   step down clearly, and on a phone the title no longer ends up smaller than the headings under it.
   Page title: 68px desktop, 40px phone (light 450). Section and closing headings: 48px desktop, 40px tablet, 30px phone (600).
   Tracking tightens with size (-0.025em); leading is tighter on the big sizes. ---------- */
body main.homepage h2.marketing-heading{font-size:3rem;line-height:1.1;letter-spacing:-.025em}
@media(max-width:900px){
  body main.homepage h2.marketing-heading{font-size:2.5rem;line-height:1.1}
}
@media(max-width:640px){
  body main.homepage h2.marketing-heading{font-size:1.875rem;line-height:1.15}
  body main.homepage #nexus-hero .nx-intro h1.marketing-heading{font-size:2.5rem;line-height:1.1;letter-spacing:-.025em}
}

/* ---------- Premium pass (13 Oct ~21:30 UTC, apple-design skill). Every page, the homepage included. ----------
   One shape for the main action: the page-title buttons become pills like every other button on the site, and the closing
   band's button is as tall as the page-title buttons (it was the smallest button on the page, under a 48px heading). */
body main.homepage #nexus-hero .nx-actions .nx-button{border-radius:999px}
body main.homepage section.close .cta{min-height:48px}
/* The header, once the page scrolls under it, gets a soft edge instead of sitting flat on the content. */
body header.top.stuck{box-shadow:0 1px 0 rgba(23,50,73,.06),0 12px 24px -20px rgba(23,50,73,.35)}

/* ---------- Carlos's Nexus film under the homepage hero (13 Oct ~23:00 UTC), silent. Same frame as the hero animation it replaced;
   shown on phones too. The Nexus page's hero frame (the animation, now there) shows on computers only, where it is loaded. ---------- */
body main.homepage .hero-stage.hero-film{position:relative;aspect-ratio:16/9;padding:0;overflow:hidden;background:#071a33}
body main.homepage .hero-stage.hero-film::before{display:none}
body main.homepage .hero-stage.hero-film>.hero-video{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
body main.homepage .hero-stage.hero-film>.hero-film-toggle{display:grid}
body main.homepage .hero-stage.hero-film>.hero-film-toggle[hidden]{display:none}
@media(max-width:900px){body main.homepage .k-hero .hero-stage{display:none}}
@media(max-width:640px){body main.homepage .hero-stage.hero-film{padding:0}}
/* The film's play/pause button at every width (the animation's button style only existed on computers). */
body main.homepage .hero-stage.hero-film>.hero-film-toggle{position:absolute;right:12px;bottom:12px;z-index:2;place-items:center;width:34px;height:34px;padding:0;border:1px solid rgba(201,220,233,.9);border-radius:50%;background:rgba(255,255,255,.78);color:#40566a;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
body main.homepage .hero-stage.hero-film>.hero-film-toggle:hover{background:#fff;color:#153b55}
body main.homepage .hero-stage.hero-film>.hero-film-toggle:active{transform:scale(.94)}
body main.homepage .hero-stage.hero-film>.hero-film-toggle:focus-visible{outline:2px solid #2180b8;outline-offset:2px}
body main.homepage .hero-stage.hero-film>.hero-film-toggle svg{width:11px;height:11px;fill:currentColor}

/* ---- Slack panels, every page (13 Oct ~21:40 UTC, James: "make the infographic look as clean and slick as the one on the still
   image", the viktor.com post linkedin.com/feed/update/urn:li:activity:7515754719248576513: a white Slack window with three window
   dots and "# channel", lifted on a deep gradient). Same content and animation; only the frame and finish change.
   Stage: Advisy navy to blue with a faint cyan light, no flat fill. Window: white, 14px corners, a soft deep shadow.
   Bar: the three window dots, then "# commercial"; the Slack mark steps aside (the channel already says where we are).
   Inside: more room, quieter lines, a tinted "APP" badge, a lighter composer and document card. */
body main.homepage .home-demo .ws-frame.home-demo-frame.hd{padding:clamp(20px,4.4vw,64px)!important;border:0;border-radius:28px;background-image:radial-gradient(80% 60% at 12% 0%,rgba(98,216,255,.2) 0%,rgba(98,216,255,0) 62%),linear-gradient(150deg,#071a33 0%,#0f3a62 52%,#2180b8 100%);box-shadow:0 44px 90px -56px rgba(7,26,51,.8)}
.hd .hd-window{border-radius:14px;background:#fff;box-shadow:0 2px 6px rgba(2,10,24,.16),0 36px 70px -30px rgba(2,10,24,.7)}
.hd .hd-bar{gap:14px;min-height:50px;padding:10px 14px 10px 18px;border-bottom:1px solid #edf1f4;background-image:linear-gradient(#fbfcfd,#f5f8fa)}
.hd .hd-bar::before{content:"";flex:none;width:52px;height:12px;background:radial-gradient(circle at 6px 6px,#ff5f57 0 5.5px,transparent 6px),radial-gradient(circle at 26px 6px,#febc2e 0 5.5px,transparent 6px),radial-gradient(circle at 46px 6px,#28c840 0 5.5px,transparent 6px)}
.hd .hd-bar>img{display:none}
.hd .hd-bar b{font-size:14px}
.hd .hd-members{color:#8a9aa6}
.hd .hd-control{border-color:#e3eaef}
.hd .hd-grid{gap:40px;padding:30px 32px 32px}
.hd .hd-chat{gap:24px}
.hd .hd-avatar{width:36px;height:36px;border-radius:9px}
.hd .hd-app{color:#14638f;background:#edf6fc;box-shadow:inset 0 0 0 1px #d4e6f0;border-radius:5px;padding:2px 6px;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.hd .hd-composer{border-color:#e3eaef;border-radius:10px}
.hd .hd-card{background:#fff;box-shadow:0 0 0 1px #e3eaef,0 18px 36px -26px rgba(23,50,73,.4)}
.hd .hd-card-head{background-image:linear-gradient(#fbfcfd,#f5f8fa);border-bottom-color:#edf1f4}
.hd .hd-sources{border-top-color:#edf1f4}
@media(max-width:1100px){.hd .hd-grid{gap:28px;padding:24px 22px 26px}}
@media(max-width:900px){.hd .hd-grid{gap:28px;padding:22px 20px 22px}}
@media(max-width:640px){
 body main.homepage .home-demo .ws-frame.home-demo-frame.hd{padding:10px!important;border-radius:20px}
 .hd .hd-window{border-radius:12px}
 .hd .hd-bar{gap:10px;min-height:44px;padding:8px 10px 8px 14px}
 .hd .hd-bar::before{width:40px;height:10px;background:radial-gradient(circle at 5px 5px,#ff5f57 0 4.5px,transparent 5px),radial-gradient(circle at 20px 5px,#febc2e 0 4.5px,transparent 5px),radial-gradient(circle at 35px 5px,#28c840 0 4.5px,transparent 5px)}
 .hd .hd-grid{padding:18px 14px 18px}
}
@media(prefers-contrast:more){.hd .hd-window{box-shadow:0 0 0 1px #202d32}}
/* The animated workspace under "Meet Nexus." (an iframe of nexus/motion.html, computers only): the same deep backdrop behind its
   window (13 Oct ~22:00 UTC, James: "please check if theres any others that you missed"). The homepage film keeps its own frame. */
body main.homepage .k-hero .hero-stage:not(.hero-film){background-image:radial-gradient(80% 60% at 12% 0%,rgba(98,216,255,.2) 0%,rgba(98,216,255,0) 62%),linear-gradient(150deg,#071a33 0%,#0f3a62 52%,#2180b8 100%);box-shadow:0 44px 90px -56px rgba(7,26,51,.8)}

/* ---------- Background: the old Nexus page's palette, every page (14 Oct ~13:10 UTC, James: "i think we need to chanhe the backgroudn
   to match advisy.com/nexus its more on our brand" ... "is it all white or does it have that blue tint?" ... "i meant the old nexus link").
   Measured on the Nexus page live until 14 Oct 12:24 UTC (dpl_BTuHmrG9, nexus-new/styles.css + nexus-release/opening.css): page #fafbfc,
   a soft pale-blue glow behind the opening headline, and alternating pale-blue bands #edf3f8. So: no white panels, the glow on every
   page title, and the site's faint grey bands become the old Nexus tint. Cards, navy stages and statement panels are unchanged.
   `html` lifts these above site-kit.css, which loads after this file. ---------- */
html body,html body main.nexus-page{background-color:#fafbfc}
html body main.nexus-page>:is(section,.nxi-preview,.business-strip,.home-vision,.home-about,.home-faq,.k-section){background-color:#fafbfc}
html body main.nexus-page>.nexus-hero{background-color:#fafbfc;background-image:radial-gradient(ellipse at 50% 42%,#eaf4fa 0,rgba(243,248,252,.6) 42%,rgba(250,251,252,0) 75%)}
html body main.nexus-page>:is(.k-alt,.wf,.home-demo,.home-how,.close){background-color:#edf3f8}
html body main.nexus-page>:is(.k-section,.home-about,.home-faq).k-alt{background-color:#edf3f8}
/* The page-title "See ..." button was a pale fill that the glow now swallows: white with a hairline, like the old page's chips. */
html body main.nexus-page #nexus-hero .nx-actions .nx-button.secondary{background-color:#fff;box-shadow:inset 0 0 0 1px #d6e2ea}
html body main.nexus-page #nexus-hero .nx-actions .nx-button.secondary:hover{background-color:#f4f8fb}
/* Secondary buttons and unselected tabs were the tint colour, so on a tinted band they vanish: white with a hairline there. */
html body main.nexus-page>:is(.k-alt,.wf,.home-demo,.home-how,.close) .k-actions .nx-button.secondary:not([aria-selected="true"]){background-color:#fff;box-shadow:inset 0 0 0 1px #d6e2ea}
html body main.nexus-page>:is(.k-alt,.wf,.home-demo,.home-how,.close) .k-actions .nx-button.secondary:not([aria-selected="true"]):hover{background-color:#f4f8fb}
