/* One primary menu and one footer for public pages and the workspace. */
.site-header{position:sticky;top:0;z-index:40;background:#fff;color:var(--brand-ink);border-bottom:1px solid var(--brand-line);box-shadow:0 3px 16px #10182706;font-family:var(--brand-font);line-height:1.4}
.site-header *, .site-footer *{box-sizing:border-box}
.site-header-row{display:flex;align-items:center;gap:28px;width:min(1440px,100%);height:84px;padding:0 32px;margin:auto}
.site-brand{display:flex;align-items:center;flex:0 0 180px;min-height:44px;margin:0;line-height:0}
.site-brand .echoit-logo{display:block;width:180px;height:60px;max-width:100%;object-fit:contain}
.site-primary-nav{display:flex;align-items:center;justify-content:center;gap:24px;flex:1;min-width:0}
.site-primary-nav a{display:flex;align-items:center;min-height:44px;font-size:13px;font-weight:600;white-space:nowrap;color:var(--brand-navy);text-decoration:none;margin:0}
.site-primary-nav a:hover,.site-header #mobile-nav a:hover{color:var(--brand-accent)}
.site-primary-nav a[aria-current=page],.site-header #mobile-nav a[aria-current=page]{color:var(--brand-accent);text-decoration:underline;text-underline-offset:7px}
.site-nav-actions{display:flex;align-items:center;gap:12px;flex-shrink:0;margin-left:auto}
.site-action{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:12px 22px;border-radius:var(--brand-radius-control);background:var(--brand-lime);color:var(--brand-on-lime);font-size:13px;line-height:20px;font-weight:700;text-decoration:none;white-space:nowrap;border:1.5px solid var(--brand-ink);}
.site-action:hover{background:var(--brand-lime-hover)}
.site-header .menu-toggle{display:none;flex:0 0 44px;min-width:44px;max-width:44px;width:44px;min-height:44px;height:44px;padding:0;border:1px solid var(--brand-line);border-radius:50%;background:#fff;color:var(--brand-ink);font:22px var(--font-sans);cursor:pointer}
.site-header #mobile-nav{max-height:calc(100svh - 72px);overflow-y:auto;overscroll-behavior:contain;padding:12px 24px 24px;border-top:1px solid var(--brand-line);background:#fff}
.site-header #mobile-nav a{display:flex;align-items:center;min-height:48px;padding:10px 8px;margin:0;font-size:15px;line-height:1.4;color:var(--brand-ink)}
.site-header :focus-visible{outline:3px solid var(--brand-focus);outline-offset:4px}
.site-footer{position:relative;background:var(--brand-ink);color:#fff;background-image:radial-gradient(ellipse at 100% 100%,color-mix(in srgb,var(--brand-lime) 4%,transparent),transparent 60%);font-family:var(--brand-font);line-height:1.5;padding:64px max(32px,calc((100% - 1320px)/2)) 32px;isolation:isolate}
.site-footer-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px;padding:0 0 48px;border-bottom:1px solid var(--brand-navy);margin:0}
.site-footer h3{font-size:15px;line-height:1.4;font-weight:600;letter-spacing:0;margin:0 0 18px;color:#fff}
.site-footer a{display:flex;align-items:center;min-height:44px;padding:6px 0;margin:0;font-size:13px;line-height:1.5;color:var(--brand-line);text-decoration:none}
.site-footer a:hover{color:var(--brand-sky)}
.site-footer a:focus-visible{outline:3px solid var(--brand-focus);outline-offset:4px}
.site-footer .site-footer-brand{display:flex;align-items:center;justify-content:center;width:100%;min-height:0;padding:30px 0 12px;line-height:0}
.site-footer-brand .echoit-logo{display:block;width:auto;height:64px;object-fit:contain;max-width:100%}
.site-footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:24px;border-top:1px solid var(--brand-navy);margin:0;padding:18px 0 0;color:#8b9aab;font-size:11px;line-height:1.6}
.site-footer-bottom a{font-size:11px;color:#8b9aab}
/* Workspace remains secondary, contained beneath the universal primary header. */
.dashboard-route .workspace-app{display:grid!important;grid-template-columns:var(--workspace-sidebar) minmax(0,1fr);align-items:start;min-height:calc(100svh - 84px)}
.dashboard-route .workspace-sidebar{position:sticky;inset:auto;top:84px;height:calc(100svh - 84px);width:auto;grid-column:1;grid-row:1;z-index:20}
.dashboard-route .workspace-surface{grid-column:2;grid-row:1;margin:9px 0 0;min-width:0;min-height:calc(100svh - 93px)}
.dashboard-route .workspace-app .workspace-mobile-dialog .workspace-wordmark{display:flex;align-items:center;background:transparent;border:0;box-shadow:none;padding:0;margin:0 10px 20px;line-height:0;border-radius:0}
.dashboard-route .workspace-brand-logo{display:block;width:184px;max-width:100%;height:auto;object-fit:contain}
.dashboard-route .workspace-echo-core{width:30px;height:30px;border:0;background:transparent;box-shadow:none;object-fit:contain;border-radius:0;flex-shrink:0}
.dashboard-route .workspace-guide-toggle>.workspace-echo-core{display:block}
@media(max-width:1100px){.site-header-row{gap:18px;padding-inline:24px}.site-brand{flex-basis:156px}.site-brand .echoit-logo{width:156px;height:52px}.site-primary-nav{gap:16px}.site-primary-nav a{font-size:12px}.site-action{padding-inline:17px}}
@media(max-width:900px) and (min-width:801px){.site-header-row{gap:12px;padding-inline:18px}.site-brand{flex-basis:144px}.site-brand .echoit-logo{width:144px;height:48px}.site-primary-nav{gap:12px}.site-primary-nav a{font-size:11px}.site-action{padding-inline:14px;font-size:12px}}
@media(max-width:800px){.site-header-row{height:72px;padding-inline:20px;gap:16px}.site-brand{flex-basis:156px}.site-brand .echoit-logo{width:156px;height:52px}.site-primary-nav{display:none}.site-header .menu-toggle{display:grid;place-items:center}.site-nav-actions{gap:8px}.site-action{min-height:44px;padding:10px 16px;font-size:12px}.site-footer{padding:48px 24px 100px}.site-footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 24px;padding-bottom:32px}.site-footer-bottom{align-items:flex-start;flex-direction:column;gap:8px}.site-footer .site-footer-brand{padding-block:32px 24px}.dashboard-route .workspace-sidebar{top:72px;height:calc(100svh - 72px)}}
@media(max-width:760px){.dashboard-route .workspace-app{display:block!important;min-height:calc(100svh - 72px)}.dashboard-route .workspace-surface{margin:0;min-height:calc(100svh - 72px)}}
@media(max-width:360px){.site-header-row{padding-inline:12px;gap:8px}.site-brand{flex-basis:136px}.site-brand .echoit-logo{width:136px;height:46px}.site-nav-actions{gap:4px;flex-shrink:0}.site-action{padding-inline:10px}.site-header .menu-toggle{flex:0 0 44px;min-width:44px;min-height:44px}.site-footer{padding-inline:20px}.site-footer-grid{gap:28px 18px}}
@media(prefers-reduced-motion:reduce){.site-header,.site-footer{scroll-behavior:auto}.site-header *, .site-footer *{transition:none!important;animation:none!important}}
/* Placement-specific original PNGs. Keep their full canvas and aspect ratio. */
svg[data-echoit-logo="menu"],svg[data-echoit-logo="footer"]{background:var(--brand-ink)}
.site-header .site-brand{flex:0 0 auto;padding:6px 10px;background:var(--brand-ink);border-radius:10px}
.site-header .site-brand .echoit-logo{width:auto;height:40px;max-width:none;padding:0;border-radius:0}
.site-footer .site-footer-brand .echoit-logo{width:auto;height:64px;max-width:100%;padding:0}
.dashboard-route .workspace-app .workspace-mobile-dialog .workspace-wordmark{width:max-content;max-width:100%;background:var(--brand-ink);border-radius:10px;padding:6px 10px}
.dashboard-route .workspace-brand-logo{width:auto;height:40px;max-width:100%}
.final-cta .wordmark,.goals-final .wordmark{display:inline-flex;max-width:100%;background:var(--brand-ink);padding:10px 14px;border-radius:12px;box-shadow:none}
.final-cta .wordmark .echoit-logo,.goals-final .wordmark .echoit-logo{width:auto;height:64px;max-width:100%;padding:0}
@media(max-width:360px){.site-header .site-brand{padding-inline:6px}.site-header .site-brand .echoit-logo{height:38px}}
/* Mobile navigation is a top-layer panel; desktop chrome is intentionally unchanged. */
.site-header #mobile-nav[hidden]{display:none!important}
@media(max-width:800px){
 .site-header{background:var(--brand-ink);color:var(--brand-white,#fff);border-bottom-color:var(--brand-navy);box-shadow:none}
 .site-header .site-header-row{height:72px;padding-inline:16px;gap:12px}
 .site-header .site-brand{padding:0;background:transparent;border-radius:0;min-height:44px}
 .site-header .site-brand .echoit-logo{height:40px}
 .site-header .site-action{min-height:44px;padding:9px 13px;gap:6px;font-size:12px}
 html body .site-header .menu-toggle{background:transparent;color:#fff;border:1px solid var(--brand-navy);border-radius:14px}
 html body .site-header .menu-toggle:hover{background:var(--brand-navy);color:#fff}
 .site-header .menu-toggle svg{width:22px;height:22px}
 .site-header #mobile-nav{position:fixed;inset:80px 12px auto;width:calc(100% - 24px);max-width:520px;max-height:calc(100svh - 96px);max-height:calc(100dvh - 96px - env(safe-area-inset-bottom));margin:0 auto;padding:10px 12px 12px;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;border:1px solid var(--brand-navy);border-radius:24px;background:var(--brand-ink);color:#fff;box-shadow:0 18px 60px #0006;scrollbar-width:thin;scrollbar-color:var(--brand-muted) var(--brand-ink);isolation:isolate}
 .site-header #mobile-nav::backdrop{background:linear-gradient(to bottom,transparent 72px,#10182780 72px)}
 .site-header #mobile-nav[open]{animation:mobile-panel-in 180ms ease-out both}
 .site-header #mobile-nav[open]::after{content:'';position:absolute;pointer-events:none;z-index:-1;top:-60px;right:-60px;width:170px;height:170px;border:1px solid #1686ef45;border-radius:50%;box-shadow:0 0 0 24px #1686ef0a,0 0 0 48px #1686ef06;animation:mobile-echo-once 650ms ease-out both}
 .mobile-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding-left:12px;margin-bottom:4px}
 .mobile-panel-heading>span{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:#8b9aab}
 html body .site-header .mobile-nav-close{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;min-height:44px;padding:0;border:1px solid var(--brand-navy);border-radius:14px;background:var(--brand-ink);color:#fff;font:26px/1 var(--font-sans);cursor:pointer}
 .mobile-nav-group{display:grid;gap:2px}
 .mobile-nav-group+.mobile-nav-group{margin-top:10px;padding-top:10px;border-top:1px solid var(--brand-navy)}
 .site-header #mobile-nav a{display:flex;gap:12px;align-items:center;min-height:46px;padding:10px 12px;margin:0;border:1px solid transparent;border-radius:12px;font-size:14px;font-weight:500;line-height:1.4;color:var(--brand-ice);text-decoration:none}
 .site-header #mobile-nav a svg{width:19px;height:19px;flex:0 0 19px;color:#8b9aab}
 .site-header #mobile-nav .mobile-link-arrow{margin-left:auto;color:var(--brand-muted);font-size:15px}
 .site-header #mobile-nav a:hover{background:var(--brand-navy);color:#fff}
 .site-header #mobile-nav a[aria-current=page]{background:#1686ef14;border-color:#1686ef45;color:var(--brand-sky);text-decoration:none}
 .site-header #mobile-nav a[aria-current=page] svg,.site-header #mobile-nav a[aria-current=page] .mobile-link-arrow{color:var(--brand-sky)}
 .mobile-nav-secondary{grid-template-columns:repeat(2,minmax(0,1fr))}
 .site-header #mobile-nav .mobile-nav-secondary a{font-size:12px;gap:8px;padding-inline:10px}
 .mobile-nav-secondary .mobile-link-arrow{display:none}
 .site-header :focus-visible{outline-color:var(--brand-white);outline-offset:2px}
}
@media(max-width:360px){.site-header .site-header-row{padding-inline:12px;gap:8px}.site-header .site-brand .echoit-logo{height:38px}.site-header .site-action{padding-inline:10px}.site-header #mobile-nav a{font-size:13px}}
@media(min-width:801px){.site-header #mobile-nav{display:none!important}}
@keyframes mobile-panel-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
@keyframes mobile-echo-once{from{opacity:.65;transform:scale(.7)}to{opacity:0;transform:scale(1.7)}}
@media(prefers-reduced-motion:reduce){.site-header #mobile-nav[open],.site-header #mobile-nav[open]::after{animation:none}.site-header #mobile-nav[open]::after{display:none}}

/* One permanent Ink pill. Its reserved footprint matches its visible clearance. */
.site-desktop-start,.site-island-menu{display:none}
.site-header .site-brand .echoit-logo{background:transparent}
@media(min-width:801px){
 html{--site-header-clearance:100px;scroll-padding-top:calc(var(--site-header-clearance) + 12px)}
 .site-header{background:transparent;box-shadow:none;border:0;height:100px;pointer-events:none}
 .site-header-surface{position:absolute;inset:12px 0 auto;margin-inline:auto;width:min(1360px,calc(100% - 48px));height:76px;pointer-events:auto;border:1px solid var(--brand-navy);border-radius:999px;background:linear-gradient(165deg,var(--brand-navy) 0%,var(--brand-ink) 42%,var(--brand-ink) 100%);box-shadow:0 12px 28px #10182726,0 3px 5px #1018271a,inset 0 1px 0 #ffffff26,inset 0 -2px 0 #0008}
 .site-header .site-header-row{height:74px;gap:24px;padding:0 22px;max-width:none}
 .site-header .site-brand{padding:0;background:transparent;border-radius:0}
 .site-header .site-brand .echoit-logo{height:48px;width:auto}
 .site-primary-nav{justify-content:flex-start;gap:20px}
 .site-primary-nav a{font-size:13px;font-weight:500;color:#fff}
 .site-primary-nav a:hover,.site-primary-nav a[aria-current=page]{color:var(--brand-sky)}
 .site-mobile-workspace{display:none}
 .site-desktop-start{display:inline-flex;padding-inline:20px}
 .site-island-menu{display:block;position:relative}
 .site-island-menu>summary{display:flex;align-items:center;min-height:44px;gap:9px;padding:0 12px;border-radius:999px;color:#fff;font-size:13px;font-weight:600;cursor:pointer;list-style:none;white-space:nowrap}
 .site-island-menu>summary::-webkit-details-marker{display:none}
 .site-island-menu>summary:hover,.site-island-menu[open]>summary{background:#ffffff14}
 .site-island-menu>summary>span{transition:transform 180ms ease}
 .site-island-menu[open]>summary>span{transform:rotate(180deg)}
 .site-island-dropdown{position:absolute;top:calc(100% + 22px);right:-146px;z-index:50;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;width:min(640px,calc(100vw - 64px));max-height:calc(100dvh - 120px);overflow-y:auto;overscroll-behavior:contain;padding:18px;border:1px solid var(--brand-navy);border-radius:24px;background:linear-gradient(165deg,var(--brand-navy),var(--brand-ink));box-shadow:0 18px 48px #10182733,inset 0 1px 0 #ffffff1a}
 .site-island-dropdown>div+div{border-left:1px solid var(--brand-navy);padding-left:12px}
 .site-island-label{display:block;padding:8px 12px;color:#8b9aab;font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;line-height:1.5}
 .site-island-dropdown a{display:flex;align-items:center;min-height:44px;padding:8px 12px;border-radius:10px;color:#fff;font-size:12px;font-weight:500;line-height:1.4;text-decoration:none}
 .site-island-dropdown a:hover{background:#ffffff14}
 .site-island-dropdown a[aria-current=page]{color:var(--brand-sky);text-decoration:underline;text-underline-offset:4px}
 .site-header :focus-visible{outline-color:var(--brand-white)}
 .dashboard-route .workspace-sidebar{top:var(--site-header-clearance);height:calc(100svh - var(--site-header-clearance))}
 .dashboard-route .workspace-app{min-height:calc(100svh - 100px)}
 .dashboard-route .workspace-surface{min-height:calc(100svh - 109px)}
}
@media(min-width:801px) and (max-width:1100px){
 .site-header .site-primary-nav{display:none}
 .site-header-surface{width:calc(100% - 40px);max-width:900px}
}
@media(max-width:800px){
 html{--site-header-clearance:72px;scroll-padding-top:84px}
 .site-header{height:72px;background:transparent;border:0}
 .site-header-surface{position:absolute;inset:6px 8px auto;margin:0;border:1px solid var(--brand-navy);border-radius:999px;background:linear-gradient(165deg,var(--brand-navy),var(--brand-ink) 42%,var(--brand-ink));box-shadow:0 6px 16px #10182726,inset 0 1px 0 #ffffff26,inset 0 -1px 0 #0008}
 .site-header .site-header-row{height:58px;padding-inline:12px;gap:8px}
}
@media(max-width:360px){.site-header-surface{inset-inline:4px}.site-header .site-header-row{padding-inline:4px;gap:4px}.site-header .site-action{padding-inline:6px}}
@media(forced-colors:active){
 .site-header-surface,.site-island-dropdown{background:Canvas;border:1px solid CanvasText;box-shadow:none}
 .site-header .site-primary-nav a,.site-island-menu>summary,.site-island-dropdown a,.site-island-label{color:CanvasText}
 .site-header :focus-visible{outline-color:Highlight}
 .site-header .site-brand{background:var(--brand-ink);forced-color-adjust:none;border-radius:8px}
}
/* Image-led, click-to-open navigation. No hover-only targets or looping motion. */
@media(min-width:801px){
 .site-directory-menu{position:relative}
 .site-directory-menu>summary{display:flex;align-items:center;gap:6px;min-height:44px;padding:0;color:#fff;font-size:13px;font-weight:500;list-style:none;white-space:nowrap;cursor:pointer}
 .site-directory-menu>summary::-webkit-details-marker{display:none}
 .site-directory-menu>summary>span{transition:transform 180ms ease}
 .site-directory-menu[open]>summary>span{transform:rotate(180deg)}
 .site-directory-menu>summary:hover,.site-directory-menu:has([aria-current=page])>summary{color:var(--brand-sky)}
 .site-directory-dropdown{position:absolute;top:calc(100% + 22px);left:-20px;z-index:50;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;width:520px;max-height:calc(100dvh - 120px);overflow-y:auto;overscroll-behavior:contain;padding:16px;border:1px solid var(--brand-navy);border-radius:24px;background:linear-gradient(165deg,var(--brand-navy),var(--brand-ink));box-shadow:0 18px 48px #10182733,inset 0 1px 0 #ffffff1a}
 .site-header .site-menu-feature{position:relative;display:flex;flex-direction:column;align-items:stretch;gap:0;min-width:0;padding:0;overflow:hidden;white-space:normal;border:1px solid var(--brand-navy);border-radius:16px;background:#ffffff06;color:#fff;text-decoration:none;transition:background-color 180ms ease,border-color 180ms ease}
 .site-menu-feature>img{display:block;width:100%;height:120px;object-fit:cover;transition:transform 220ms ease}
 .site-menu-feature-copy{display:grid;gap:5px;padding:14px 32px 14px 14px;line-height:1.4}
 .site-menu-feature-copy>span{font-size:13px;font-weight:600}
 .site-menu-feature-copy>small{font-size:12px;font-weight:400;color:#8b9aab;line-height:1.5}
 .site-menu-feature-arrow{position:absolute;right:14px;bottom:16px;font-size:16px;color:#8b9aab}
 .site-header .site-menu-feature:hover,.site-header .site-menu-feature:focus-visible{background:#ffffff10;border-color:var(--brand-muted)}
 .site-menu-feature:hover>img{transform:scale(1.025)}
 .site-island-dropdown .site-menu-feature{margin-top:10px}
 .site-island-dropdown .site-menu-feature>img{height:88px;object-position:center 42%}
 .site-island-dropdown .site-menu-feature-copy{padding:10px 28px 12px 10px}
 .site-desktop-group[open]>.site-directory-dropdown,.site-desktop-group[open]>.site-island-dropdown{animation:site-dropdown-in 180ms ease-out both}
}
@media(max-width:800px){
 .site-header #mobile-nav .mobile-menu-image{display:block;flex:0 0 64px;width:64px;height:44px;object-fit:cover;border:1px solid var(--brand-navy);border-radius:10px}
 .site-header #mobile-nav .mobile-menu-image+svg{display:none}
}
@keyframes site-dropdown-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){
 .site-header .site-desktop-group[open]>.site-directory-dropdown,.site-header .site-desktop-group[open]>.site-island-dropdown{animation:none}
 .site-header .site-menu-feature:hover>img{transform:none}
}
@media(forced-colors:active){
 .site-directory-dropdown,.site-header .site-menu-feature{background:Canvas;border:1px solid CanvasText;box-shadow:none}
 .site-directory-menu>summary,.site-menu-feature-copy>small,.site-menu-feature-arrow{color:CanvasText}
 .site-header .site-menu-feature{color:LinkText}
}
/* Transparent outside the floating pill on every route, including dark-hero pages.
   Height compacts inside a constant 100px/72px footprint; hit targets never scale. */
html body .site-header{background:transparent;box-shadow:none;border:0}
.site-header-surface,.site-header .site-header-row,.site-header .site-brand .echoit-logo{transition:height 180ms ease}
@media(min-width:801px){
 .site-header[data-header-compact="true"] .site-header-surface{height:68px}
 .site-header[data-header-compact="true"] .site-header-row{height:66px}
 .site-header[data-header-compact="true"] .site-brand .echoit-logo{height:44px}
}
@media(max-width:800px){
 .site-header[data-header-compact="true"] .site-header-row{height:54px}
 .site-header[data-header-compact="true"] .site-brand .echoit-logo{height:38px}
}
@media(prefers-reduced-motion:reduce){
 .site-header-surface,.site-header .site-header-row,.site-header .site-brand .echoit-logo{transition:none}
}

/* Quiet glass depth, keeping the approved menu footprint and all hit targets. */
@media(forced-colors:none){
 .site-header-surface{box-shadow:0 8px 24px #1018271c,0 2px 4px #10182714,inset 0 1px 0 #ffffff21,inset 0 -1px 0 #0005}
}
@media(max-width:800px){
 .site-footer{padding-bottom:calc(100px + env(safe-area-inset-bottom))}
 .site-footer a{overflow-wrap:anywhere}
}
