/* Homepage implementation of the private brand handbook.
   Scoped here so legacy shared styles do not change other product/workspace pages. */
.home-page {
  --home-title: clamp(36px, 4.2vw, 58px);
  --home-section-title: clamp(30px, 3.2vw, 44px);
  --home-panel-title: 22px;
  --home-section-space: 80px;
  --home-control-border: #657c80;
}
[data-theme="dark"] .home-page { --home-control-border: #65848c; }
.home-page .shell { width: min(1200px, calc(100% - 80px)); }
.home-page .hero h1 {
  font-size: var(--home-title);
  line-height: 1.12;
  letter-spacing: -.045em;
  font-weight: 550;
}
.home-page :is(.section, .home-flow) h2:not(#preview-screen h2) {
  font-size: var(--home-section-title);
  line-height: 1.16;
  letter-spacing: -.042em;
  font-weight: 550;
}
.home-page .contact-panel h2 {
  font-size: var(--home-section-title);
  line-height: 1.16;
  letter-spacing: -.042em;
}
.home-page :is(.section, .contact-section) h3,
.home-page #experience-panel h3 {
  font-size: var(--home-panel-title);
  line-height: 1.3;
  letter-spacing: -.025em;
  font-weight: 550;
}
.home-page .hero-description { font-size: 16px; line-height: 1.75; }
.home-page :is(
  .section-heading > p, .pillars p, #experience-panel > p:not(.mini-eyebrow),
  .architecture-card > p:not(.card-caption), .control-intro > p:not(.eyebrow),
  .control-list p, .faq-list details > p, .deployment-panel > p:not(.microcopy),
  .launch-intro > p:not(.mini-eyebrow), .launch-steps p,
  .network-detail > p:not(.eyebrow), .universe-detail p:not(.eyebrow),
  .yield-home-copy > p:not(.eyebrow):not(.yield-home-status),
  .pm-product-split > div > p:not(.eyebrow):not(.pm-note),
  .contact-panel > div > p:not(.eyebrow):not(.contact-action p)
) { font-size: 15px; line-height: 1.75; }
.home-page :is(
  .hero-note, .preview-muted, .preview-principal > span:first-child,
  .preview-state, .preview-metrics span, .preview-metrics small,
  .preview-timeline span, .preview-fine, .preview-bottom, .preview-review > div,
  .preview-proof span, .flow-steps small, .flow-footer p, .flow-status,
  .network-node span, .network-detail dd, .connection-state, .network-links > span,
  .ecosystem-bottom p, .pm-note, .yield-home-status,
  .matching-core small, .universe-status, .trading-invitation p, .launch-note,
  .check-list, .microcopy, .demo-badge, .console-header strong,
  .console-context strong, .console-context div > span, .session-pill,
  .prompt-bubble p, .agent-reply strong, .agent-reply p, .result-heading,
  .result-heading > span, .demo-result dl, .demo-result > p, .demo-feedback,
  .audit-details, .audit-details ol, .console-footer,
  .system-diagram > span, .card-caption, .architecture-note p,
  .deployment-options small, .deployment-nodes > div > span, .boundary-footer,
  .contact-panel .contact-action > p
) { font-size: 13px; line-height: 1.65; }
.home-page :is(.eyebrow, .mini-eyebrow, .outlined-label, .boundary-label, .strip-label,
  .preview-context, .network-detail dt, .network-core span, .matching-map span,
  .prompt-bubble .mini-eyebrow, .contact-action > .mini-eyebrow) {
  font-size: 11px;
  line-height: 1.6;
}
.home-page :is(.preview-top, .home-format, .preview-tag) { font-size: 12px; line-height: 1.5; }
.home-page :is(.preview-principal > strong, .preview-metrics strong) { font-variant-numeric: tabular-nums; }
.home-page .preview-principal > strong { font-size: 34px; font-weight: 520; }
.home-page .preview-context { flex-wrap: wrap; gap: 4px 16px; }
.home-page .preview-timeline { flex-wrap: wrap; }
.home-page .preview-timeline span { flex-basis: 70px; }
.home-page .preview-bottom { flex-wrap: wrap; }
.home-page .preview-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.home-page .preview-metrics > div:last-child {
  grid-column: 1 / -1;
  border-inline-start: 0;
  border-top: 1px solid var(--line);
  padding: 12px 0 0;
}
.home-page .preview-metrics small { display: inline; }
.home-page .preview-metrics strong { font-size: 18px; }
/* 80/48 px belongs to the space between sections, not both neighboring edges. */
.home-page :is(.section, .home-flow) { padding-block: calc(var(--home-section-space) / 2); }
.home-page :is(.ecosystem-section, .experience-section, .deployment-section) {
  padding-block: var(--home-section-space);
}
.home-page :is(.ecosystem-section, .experience-section, .deployment-section) + .section {
  padding-block-start: var(--home-section-space);
}
.home-page .section:has(+ :is(.experience-section, .deployment-section, .contact-section)) {
  padding-block-end: var(--home-section-space);
}
.home-page .home-flow { padding-block-end: var(--home-section-space); }
.home-page .contact-section { margin-block-end: var(--home-section-space); }
.home-page :is(.button, .text-link, .desktop-nav a, .mobile-nav a,
  .preview-bottom a, .flow-footer a, .connection-strip a, .network-links a,
  .yield-hero-link a, .header-signin, .partner-verify-button, .ecosystem-link, .segmented button, .scenario-button, .reset-button,
  .home-tabs button, .market-universe button) {
  font-size: 14px;
  line-height: 1.5;
  min-height: 44px;
}
.home-page :is(.desktop-nav a, .network-links a, .preview-bottom a, .flow-footer a) {
  display: inline-flex;
  align-items: center;
  padding-block: 10px;
}
.home-page :is(.button, .icon-button, .scenario-button, .home-tabs button,
  .segmented button, .market-universe button) { border-radius: 6px; }
.home-page .button { min-height: 48px; }
.home-page .button.small { min-height: 44px; }
.home-page .button:not(.primary), .home-page .scenario-button:not([aria-pressed="true"]),
.home-page .market-universe button:not([aria-pressed="true"]) { border-color: var(--home-control-border); }
.home-page .icon-button { width: 44px; height: 44px; flex-shrink: 0; }
.home-page .wordmark { min-height: 44px; }
.home-page .desktop-nav { gap: 20px; }
.home-page .header-inner { gap: 24px; }
.home-page .home-tabs { border-radius: 10px; }
.home-page :is(.preview-principal, .preview-proof, .network-node, .demo-console,
  .architecture-card, .deployment-panel, .universe-detail) { border-radius: 10px; }
.home-page :is(.home-preview, .network-detail, .contact-panel, .yield-home-art) { border-radius: 12px; }
.home-page .network-core { width: 156px; height: 144px; }
.home-page .network-core span { max-width: 120px; text-align: center; }
.home-page .network-canvas { min-height: 480px; }
.home-page .network-node { min-height: 96px; }
.home-page .pm-actions { margin-top: 24px; gap: 12px 24px; }
.home-page .pm-note { margin-top: 20px; }
.home-page .console-header, .home-page .console-context, .home-page .console-footer,
.home-page .result-heading, .home-page .demo-action-row { flex-wrap: wrap; }
.home-page .session-pill { gap: 5px; }
.home-page .system-diagram { display: grid; grid-template-columns: 1fr 16px 1fr 16px 1fr; }
.home-page .system-diagram > span { min-width: 0; }
.home-page .deployment-nodes > div { min-width: 0; }
.home-page .boundary-footer { gap: 12px; flex-wrap: wrap; }
.home-page .faq-list summary { font-size: 15px; min-height: 48px; }
.home-page .banking-footer :is(.footer-column a, .footer-legal a) { min-height: 44px; font-size: 14px; }
.home-page .header-signin { display: inline-flex; align-items: center; }
.home-page .hero .actions .button { font-size: 14px; }
.home-page #preview-screen h2 { font-size: var(--home-panel-title); line-height: 1.3; }
.home-page #flow-screen > .preview-context { font-size: 11px; }
.home-page .yield-home-flow { font-size: 13px; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 20px; }
.home-page .yield-home-caption { font-size: 13px; }
.home-page .yield-home-art > p { font-size: var(--home-panel-title); line-height: 1.3; }
.home-page .yield-hero-link a { padding-block: 8px; }
.home-page .home-header-cta { flex-shrink: 0; }
@media (max-width: 1100px) {
  .home-page .desktop-nav, .home-page .header-signin { display: none; }
  .home-page .header-actions { margin-left: auto; }
  .home-page .menu-toggle { display: grid; }
}
@media (min-width: 761px) and (max-width: 1020px) {
  .home-page .hero { grid-template-columns: 1fr; }
  .home-page .hero-copy { max-width: 650px; }
  .home-page .home-preview { max-width: 650px; justify-self: center; width: 100%; }
  .home-page :is(.experience-layout, .deployment-layout) { grid-template-columns: 1fr; }
  .home-page .pillars { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-page .home-network { grid-template-columns: 1fr; }
  .home-page .network-canvas { max-width: 640px; width: 100%; justify-self: center; }
}
@media (max-width: 760px) {
  .home-page {
    --home-title: clamp(32px, 9vw, 36px);
    --home-section-title: 32px;
    --home-panel-title: 21px;
    --home-section-space: 48px;
  }
  .home-page .shell { width: calc(100% - 36px); }
  .home-page .hero { padding-block: 40px 24px; }
  .home-page .hero-description { font-size: 15px; }
  .home-page main :is(.eyebrow, .mini-eyebrow) { font-size: 10px; }
  .home-page .home-header-cta { display: none; }
  .home-page .header-inner { gap: 8px; }
  .home-page .home-preview { max-width: 600px; }
  .home-page :is(.section-heading, .experience-layout, .architecture-grid,
    .deployment-layout, .control-section, .faq-section, .contact-panel, .pillars) {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .home-page .contact-action { border-left: 0; border-top: 1px solid var(--line); padding: 24px 0 0; }
  .home-page :is(.architecture-card, .deployment-panel, .contact-panel, .network-detail,
    .universe-detail, #flow-screen, #preview-screen) { padding: 20px; }
  .home-page .preview-top { flex-wrap: wrap; gap: 8px; padding: 16px 20px; }
  .home-page .preview-principal { padding: 16px; }
  .home-page .home-tabs { margin-inline: 16px; }
  .home-page .home-format { white-space: normal; margin-left: 0; }
  .home-page .hero-note { align-items: baseline; gap: 8px; }
  .home-page .preview-label { padding-left: 0; border: 0; flex-basis: 100%; }
  .home-page .network-canvas { min-height: 0; }
  .home-page .network-core { height: 144px; }
  .home-page .network-node { padding: 12px; }
  .home-page .system-diagram { grid-template-columns: 1fr; justify-items: center; gap: 8px; }
  .home-page .system-diagram > span { width: 100%; padding: 12px; }
  .home-page .system-diagram > .icon { transform: rotate(90deg); }
  .home-page .deployment-nodes { flex-direction: column; }
  .home-page .deployment-nodes > .connector { transform: rotate(90deg); }
  .home-page .console-body { padding: 20px; }
  .home-page .prompt-bubble { margin-left: 0; }
  .home-page .demo-result { padding: 12px; }
}

@media (min-width: 1101px) {
  .home-page .preview-metrics { grid-template-columns: 1fr .85fr 1.3fr; }
  .home-page .preview-metrics > div:last-child {
    grid-column: auto;
    border-top: 0;
    border-inline-start: 1px solid var(--line);
    padding: 0 0 0 12px;
  }
}