.hero-slogan{color:var(--accent);font-size:20px;line-height:1.55;letter-spacing:-.04em;margin:28px 0 16px;font-weight:700}
.hero-intro{margin-top:0}
@media(max-width:560px){.hero-slogan{font-size:18px;margin-top:23px}}

/* Dark neon glass visual system for the LA carrier landing page. */
:root {
  --ink: #0f101a;
  --paper: #f7f5ff;
  --muted: #aaa8bf;
  --line: rgba(190, 169, 255, .17);
  --accent: #9d4edd;
  --accent-dark: #fff;
  --warm: #6b9dff;
  --la-blue: #5f8dff;
  --la-purple: #7148ee;
  --la-surface: rgba(27, 25, 47, .68);
  --la-shadow: 0 24px 70px rgba(4, 4, 12, .4);
}

html { background: var(--ink); }
body { background: var(--ink); color: var(--paper); color-scheme: dark; }
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .24;
  background-image: linear-gradient(rgba(177, 156, 255, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(177, 156, 255, .05) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(to bottom, black, transparent 84%);
}
.site-shell { background: transparent; }
.topbar { border-color: var(--line); background: rgba(15, 16, 26, .74); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
.brand-word { color: var(--paper); }
.brand-name, .desktop-nav a, .status-link { color: var(--muted); }
.brand-mark span { background: linear-gradient(180deg, #c795ff, #7047ec); }
.status-dot { background: #22c55e; box-shadow: 0 0 14px rgba(34, 197, 94, .9); }
.desktop-nav a:hover, .footer-links a:hover { color: #c495ff; }
.button { min-height: 46px; border-radius: 12px; border: 1px solid rgba(190, 153, 255, .36); box-shadow: 0 10px 28px rgba(68, 39, 128, .24); transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease, background .24s ease; }
.button:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(116, 66, 219, .42), 0 0 20px rgba(157, 78, 221, .24); }
.button-primary { background: linear-gradient(135deg, var(--accent), var(--la-purple) 58%, var(--la-blue)); color: #fff; }
.button-primary:hover { background: linear-gradient(135deg, #ad5de8, #7b5aff 58%, #6aa2ff); }
.button-outline, .button-quiet { color: var(--paper); background: rgba(35, 33, 59, .58); border-color: var(--line); }
.button-outline:hover, .button-quiet:hover { color: #fff; border-color: rgba(195, 157, 255, .7); background: rgba(94, 66, 155, .34); }
.hero { position: relative; min-height: calc(100vh - 78px); }
.hero-copy { position: relative; z-index: 1; }
.eyebrow { color: #bd8eff; letter-spacing: .11em; }
.eyebrow-line { background: linear-gradient(90deg, var(--accent), var(--la-blue)); }
.hero h1, .section-heading h2, .showcase-copy h2, .faq-intro h2, .closing-cta h2 { letter-spacing: 0; color: var(--paper); }
.hero h1 em, .section-heading h2 span, .showcase-copy h2 span, .faq-intro h2 span { color: #76a5ff; }
.hero-slogan { color: #d4c3f5; }
.hero-intro, .section-note, .showcase-copy>p:not(.eyebrow), .faq-intro>p:not(.eyebrow) { color: var(--muted); }
.hero-metrics, .workflow-list, .ticker { border-color: var(--line); }
.metric strong { color: var(--paper); }
.metric span, .ticker, .visual-label, .visual-footer { color: var(--muted); }
.hero-visual, .workflow-visual, .product-detail, .feature-card, .support-card, .closing-cta { border: 1px solid var(--line); border-radius: 20px; box-shadow: var(--la-shadow); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
.hero-visual { background: linear-gradient(145deg, rgba(47, 32, 78, .78), rgba(16, 18, 34, .78) 64%, rgba(26, 33, 75, .72)); border-color: rgba(185, 143, 255, .28); box-shadow: var(--la-shadow), 0 0 35px rgba(112, 69, 226, .16); }
.hero-visual:before { border-color: rgba(193, 165, 255, .14); }
.hero-visual:after { background: linear-gradient(90deg, transparent 49.8%, rgba(153, 115, 235, .12) 50%, transparent 50.2%), linear-gradient(transparent 49.8%, rgba(153, 115, 235, .12) 50%, transparent 50.2%); }
.node-screen, .node-core { border-color: #b88aff; box-shadow: 0 0 24px rgba(157, 78, 221, .28); }
.node-screen { background: linear-gradient(135deg, rgba(157, 78, 221, .24), transparent); }
.screen-client { border-color: #6f9fff; background: linear-gradient(135deg, rgba(95, 141, 255, .22), transparent); }
.node-core { background: rgba(157, 78, 221, .1); }
.node-core span { border-color: #d0a9ff; box-shadow: 0 0 13px #9d4edd; }
.orbit { border-color: rgba(190, 149, 255, .3); }
.link-line { background: linear-gradient(90deg, transparent, #b77cff, transparent); box-shadow: 0 0 12px rgba(157, 78, 221, .75); }
.line-two { background: linear-gradient(90deg, transparent, #6f9fff, transparent); box-shadow: 0 0 12px rgba(95, 141, 255, .7); }
.link-line span { background: #cb9fff; }
.line-two span { background: #79aaff; }
.stage-readout b, .visual-index span { color: #bd8eff; }
.ticker { background: rgba(20, 19, 34, .48); }
.ticker-dot { background: #6f9fff; }
.ticker-scroll span { color: #bd8eff; }
.section-heading, .product-layout, .product-tabs, .technology-section, .support-section, .faq-section { border-color: var(--line); }
.product-tab { border-color: var(--line); color: var(--muted); }
.product-tab:hover, .product-tab.is-active { color: var(--paper); }
.product-tab.is-active .tab-number, .product-tab.is-active .tab-arrow { color: #bd8eff; }
.tab-number, .tab-arrow, .tab-footnote, .product-code, .detail-grid span, .feature-number, .feature-meta, .workflow-item, .workflow-item small { color: var(--muted); }
.product-detail { background: linear-gradient(145deg, rgba(58, 38, 93, .66), rgba(22, 23, 43, .72)); border-color: rgba(184, 143, 255, .25); }
.pill { color: #c799ff; border-color: rgba(184, 143, 255, .4); border-radius: 999px; background: rgba(157, 78, 221, .12); }
.detail-grid { border-color: var(--line); }
.detail-grid b { color: #dbd2ed; }
.feature-grid, .support-grid { gap: 14px; background: transparent; border: 0; }
.feature-card { background: var(--la-surface); border-color: var(--line); min-height: 220px; }
.feature-card:hover, .support-card:hover, .product-detail:hover, .workflow-visual:hover { transform: translateY(-3px); border-color: rgba(184, 143, 255, .35); transition: transform .24s ease, border-color .24s ease; }
.feature-large { background: linear-gradient(145deg, rgba(76, 42, 124, .72), rgba(22, 22, 42, .84) 63%); }
.accent-card { color: var(--paper); background: linear-gradient(145deg, rgba(157, 78, 221, .82), rgba(78, 76, 187, .84)); }
.accent-card .feature-number, .accent-card .feature-meta { color: rgba(250, 247, 255, .7); }
.feature-icon { color: #bd8eff; }
.accent-card .feature-icon { color: #fff; }
.feature-card p { color: var(--muted); }
.accent-card p { color: rgba(250, 247, 255, .76); }
.feature-line { background: var(--line); }
.workflow-visual { background: linear-gradient(145deg, rgba(38, 31, 69, .75), rgba(17, 18, 33, .8)); }
.terminal-window { border-color: rgba(183, 137, 255, .32); background: rgba(8, 8, 18, .72); box-shadow: 0 22px 45px rgba(0, 0, 0, .35); border-radius: 14px; overflow: hidden; }
.terminal-bar { border-color: var(--line); }
.terminal-body, .workflow-visual-caption { color: var(--muted); }
.terminal-body em, .terminal-result strong, .workflow-visual-caption b { color: #b98aff; }
.support-card { background: var(--la-surface); color: var(--paper); }
.support-card-dark { background: linear-gradient(145deg, rgba(39, 35, 69, .8), rgba(20, 20, 37, .8)); color: var(--paper); }
.support-card p, .support-card-dark p { color: var(--muted); }
.support-card .text-link, .support-card-dark .text-link { color: #cab0f8; }
details { border-color: var(--line); }
summary { color: var(--paper); }
summary span { color: #bd8eff; }
details p { color: var(--muted); }
.closing-cta { background: linear-gradient(135deg, rgba(157, 78, 221, .9), rgba(80, 75, 184, .9) 60%, rgba(95, 141, 255, .86)); color: #fff; border-color: rgba(215, 189, 255, .38); }
.closing-cta .eyebrow, .closing-cta h2, .closing-cta h2 em { color: #fff; }
.closing-cta .button-dark { color: #fff; background: rgba(13, 12, 24, .62); border-color: rgba(255, 255, 255, .3); }
.footer { border-color: var(--line); color: var(--muted); }
.footer-brand { color: var(--paper); }
.footer small { color: var(--muted); }
.mobile-menu { background: rgba(15, 16, 26, .98); }
.mobile-menu a { border-color: var(--line); color: var(--paper); }
.mobile-menu a span { color: #bd8eff; }
.toast { color: #fff; background: linear-gradient(135deg, #5d32a2, #2b3d93); border: 1px solid rgba(213, 188, 255, .34); border-radius: 12px; box-shadow: 0 14px 40px rgba(0, 0, 0, .42); }

@media (max-width: 1180px) and (min-width: 901px) {
  .desktop-nav { display: none; }
  .status-link,
  .topbar-actions .button-outline:not(.match-entry) { display: none; }
  .menu-toggle { display: block; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* Keep compact architecture cards readable when descriptions wrap to multiple lines. */
.feature-card:not(.feature-large) {
  min-height: 240px;
  display: flex;
  flex-direction: column;
}
.feature-card:not(.feature-large) h3 {
  margin-top: 54px;
  margin-bottom: 10px;
  line-height: 1.25;
}
.feature-card:not(.feature-large) p {
  max-width: none;
  line-height: 1.7;
}
.feature-card:not(.feature-large) .feature-meta {
  position: static;
  margin-top: auto;
  padding-top: 14px;
}

@media (max-width: 560px) {
  .feature-card:not(.feature-large) { min-height: 230px; }
  .feature-card:not(.feature-large) h3 { font-size: 19px; }
}

/* Editorial type scale with immediate touch feedback. */
body { font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "PingFang SC", "Microsoft YaHei", sans-serif; font-optical-sizing: auto; }
.hero h1 { letter-spacing: -.025em; line-height: 1.04; }
.section-heading h2, .showcase-copy h2, .faq-intro h2, .closing-cta h2 { letter-spacing: -.025em; }
:where(button, a, .product-tab, .role-entry, .feature-card, .support-card) { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
.is-pressing { transform: scale(.985) !important; transition: transform .1s ease-out !important; }
@media (prefers-reduced-motion: reduce) { .is-pressing { transform: none !important; } }

/* LA identity refinement: high-contrast tech typography and restrained motion. */
body { font-family: var(--la-font); font-optical-sizing: auto; text-rendering: optimizeLegibility; }
h1, h2, h3, .brand-word, .brand-name, .button, .desktop-nav, .metric strong { font-family: var(--la-display); }
.hero h1 { letter-spacing: -.035em; line-height: 1.03; font-weight: 700; text-wrap: balance; }
.hero-slogan { letter-spacing: -.015em; font-weight: 650; }
.hero-intro { max-width: 470px; line-height: 1.85; }
.section-heading h2, .showcase-copy h2, .faq-intro h2, .closing-cta h2 { letter-spacing: -.03em; font-weight: 650; text-wrap: balance; }
.section-note, .product-description, .feature-card p, .support-card p, details p { line-height: 1.85; }
.eyebrow, .visual-label, .visual-footer, .ticker, .product-code, .detail-grid span, .feature-number, .feature-meta, .workflow-item > span, .terminal-body, .metric strong { font-family: var(--la-font); letter-spacing: .045em; }
.topbar { min-height: 78px; }
.brand { gap: 13px; }
.brand-name { margin-left: 0; letter-spacing: .08em; }
.hero-visual { border-radius: 24px; }
.product-detail, .feature-card, .support-card, .workflow-visual { transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease; }
.product-tab { position: relative; isolation: isolate; }
.product-tab::before { content: ""; position: absolute; inset: 8px -10px; z-index: -1; border-radius: 12px; background: linear-gradient(90deg, rgba(157, 78, 221, .16), transparent 72%); opacity: 0; transition: opacity .22s ease; }
.product-tab:hover::before, .product-tab.is-active::before { opacity: 1; }
.button:active, .text-link:active { transform: translateY(1px) scale(.985); }
.button:focus-visible, .text-link:focus-visible, .product-tab:focus-visible, .mobile-close:focus-visible { outline: 2px solid #8cc8ff; outline-offset: 4px; }

@media (prefers-reduced-motion: no-preference) {
  .site-shell .section:not(.hero), .site-shell > .ticker, .site-shell .closing-cta { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1); }
  .site-shell .is-revealed { opacity: 1 !important; transform: none !important; }
}

@media (max-width: 900px) {
  .hero { padding-top: 52px; }
  .hero h1 { font-size: clamp(44px, 9vw, 68px); }
  .hero-visual { margin-left: 0; }
}

@media (max-width: 560px) {
  .topbar { min-height: 68px; padding-inline: 18px; }
  .brand { gap: 9px; }
  .brand-name { font-size: 11px; }
  .hero { padding-top: 38px; }
  .hero h1 { font-size: 45px; line-height: 1.06; }
  .hero-slogan { font-size: 18px; }
}
