/* Shared, buildless navigation and footer. Native menus also work without JavaScript. */
:root { --site-edge: clamp(20px, 4vw, 80px); }
.site-header.marketing-header { position: relative; z-index: 30; display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); gap: 28px; width: 100%; max-width: none; padding-inline: var(--site-edge); margin: 0; min-height: 96px; background: var(--paper); }
.marketing-header > .brand { justify-self: start; }
.site-navigation { display: flex; align-items: center; gap: 30px; font-size: 13px; font-weight: 600; color: var(--studio-muted); }
.site-navigation > a, .nav-platform > summary { display: flex; align-items: center; gap: 6px; min-height: 44px; }
.site-navigation a:hover, .nav-platform > summary:hover, .site-navigation [aria-current="page"] { color: var(--blue); }
.nav-platform { position: relative; }
.nav-platform > summary { cursor: pointer; list-style: none; }
.nav-platform > summary::-webkit-details-marker, .site-menu > summary::-webkit-details-marker { display: none; }
.nav-platform > summary::after { content: '⌄'; font-size: 15px; margin-left: 3px; }
.nav-platform[open] > summary { color: var(--blue); }
.platform-dropdown { position: absolute; top: calc(100% + 7px); left: -24px; width: 290px; padding: 10px; background: var(--paper); border: 1px solid var(--studio-line); border-radius: 4px; box-shadow: 0 15px 35px rgb(17 19 21 / 0.110); }
.platform-dropdown > a { display: block; padding: 12px 14px; border-radius: 5px; line-height: 1.5; min-height: 44px; }
.platform-dropdown > a:hover { background: var(--studio-soft); }
.marketing-header .header-action { justify-self: end; background: transparent; border: 0; padding: 0; min-height: 44px; font-size: 12px; gap: 16px; }
.marketing-header .header-action:hover { color: var(--blue); background: transparent; }
.site-menu { display: none; justify-self: end; }
.site-menu > summary { list-style: none; display: flex; align-items: center; gap: 12px; min-height: 44px; cursor: pointer; font-size: 13px; font-weight: 600; }
.site-menu > summary span:last-child { color: var(--blue); font-size: 22px; }
.mobile-navigation { position: absolute; right: var(--site-edge); top: calc(100% - 4px); width: min(340px, calc(100vw - 40px)); max-height: calc(100dvh - 105px); overflow-y: auto; padding: 17px 20px; background: var(--paper); border: 1px solid var(--studio-line); border-radius: 4px; box-shadow: 0 15px 35px rgb(17 19 21 / 0.149); }
.mobile-navigation > a { display: flex; align-items: center; min-height: 44px; font-size: 13px; color: var(--studio-ink-soft); }
.mobile-navigation > a[aria-current="page"] { color: var(--blue); font-weight: 700; }
.mobile-navigation > a.mobile-product-link { padding-left: 15px; font-size: 12px; }
.mobile-navigation > a.mobile-section-link { border-top: 1px solid var(--studio-line); margin-top: 10px; padding-top: 10px; }
summary:focus-visible { outline: 3px solid var(--blue); outline-offset: 4px; border-radius: 2px; }
.site-footer.content-footer { display: block; width: 100%; max-width: none; margin: 0; padding: 65px var(--site-edge) 25px; background: var(--paper); border-top: 1px solid var(--line); }
.footer-columns { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 50px; max-width: 1440px; margin: auto; }
.content-footer .brand { font-size: 21px; }
.content-footer .footer-brand > p { display: block; font-size: 13px; color: var(--muted); margin-top: 15px; max-width: 270px; }
.footer-link-group strong { display: block; color: var(--ink); font-size: 13px; font-weight: 700; margin-bottom: 16px; }
.footer-link-group > a { display: block; width: fit-content; min-height: 38px; padding-block: 6px; font-size: 12px; line-height: 1.8; color: var(--studio-muted); }
.footer-link-group > a:hover { color: var(--blue); }
.footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 20px; max-width: 1440px; margin: 30px auto 0; padding-top: 22px; border-top: 1px solid var(--line); font-size: 11px; color: var(--studio-muted); }
.footer-bottom > a { min-height: 44px; display: flex; align-items: center; }
.case-learn-more { display: inline-flex; align-items: center; gap: 18px; min-height: 44px; margin-top: 24px; font-size: 14px; font-weight: 600; color: var(--blue); }
.case-learn-more:hover { text-decoration: underline; text-underline-offset: 5px; }
@media (max-width: 1100px) { .site-header.marketing-header { gap: 20px; } .site-navigation { gap: 23px; } .marketing-header .header-action { font-size: 11px; } }
@media (max-width: 900px) { .site-header.marketing-header { grid-template-columns: 1fr auto; min-height: 80px; } .site-navigation, .marketing-header .header-action { display: none; } .site-menu { display: block; } .footer-columns { gap: 35px; grid-template-columns: 1fr 1fr; } .footer-brand { grid-column: 1 / -1; } }
@media (max-width: 600px) { .site-header.marketing-header { gap: 15px; } .marketing-header .brand { font-size: 18px; } .marketing-header .brand-symbol { font-size: 32px; } .site-footer.content-footer { padding-top: 45px; } .footer-columns { gap: 30px 25px; } .content-footer .brand { font-size: 19px; } .footer-link-group > a { font-size: 11px; min-height: 44px; } .case-learn-more { font-size: 13px; } }

/* White editorial navigation and a charcoal footer across the public site. */
.site-header.marketing-header { min-height:80px; border-bottom:1px solid var(--studio-line); }
.brand { font-weight:600; }
.brand-symbol { color:var(--studio-accent); font-size:30px; }
.site-navigation { color:var(--studio-ink-soft); font-weight:400; }
.marketing-header .header-action { min-height:42px; padding:8px 16px; color:var(--studio-on-action); background:var(--studio-ink); border-radius:3px; font-weight:500; }
.marketing-header .header-action:hover { background:var(--studio-action-hover); color:var(--studio-on-action); }
.platform-dropdown,.mobile-navigation { border-radius:4px; box-shadow:0 12px 30px #11131514; }
.site-footer.content-footer { background:var(--studio-ink); color:#fff; border-top:1px solid #ffffff20; padding-top:75px; }
.content-footer .brand-symbol { color:#d9ad99; }
.footer-link-group strong { color:#fff; font-weight:500; }
.content-footer .footer-brand > p,.footer-link-group > a,.footer-bottom { color:#adb0b2; }
.footer-bottom { border-color:#343638; }
.footer-link-group > a:hover { color:#fff; }
.launch-notice { padding: 12px 24px; background: var(--studio-soft, #eef3e8); color: var(--studio-ink, #18211b); text-align: center; font-size: 14px; line-height: 1.6; }
.launch-notice strong { font-weight: 600; }