/* Navigation and footer extracted from the live homepage. */
.site-header{ position: sticky; top: 0; z-index: 100; background: #efefefe6; backdrop-filter: blur(10px); border-bottom: 2px solid var(--ink); }
.nav{ display: flex; align-items: center; justify-content: space-between; gap: 1rem; height: 72px; }
.brand{ display: inline-flex; align-items: center; gap: 0.6rem; font-family: var(--font-display); font-weight: 900; font-size: 1.35rem; letter-spacing: -0.03em; }
.brand .dot{ width: 30px; height: 30px; background: var(--iris); border: 2px solid var(--ink); border-radius: 8px; display: grid; place-items: center; box-shadow: 3px 3px 0 var(--lime); flex: none; }
.brand .dot span{ width: 9px; height: 9px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 2px var(--iris-900) inset; }
.nav-links{ display: flex; align-items: center; gap: 1.5rem; }
.nav-links > li{ position: relative; }
.nav-links a,.drop-toggle{ font-size: var(--step--1); font-weight: 600; }
.nav-links > li > a,.drop-toggle{ position: relative; padding: 0.3em 0; display: inline-flex; align-items: center; gap: 0.35em; color: inherit; }
.nav-links > li > a::after,.drop-toggle::after{ content:""; position:absolute; left:0; right:100%; bottom:-2px; height:2px; background:var(--iris); transition: right 0.25s var(--ease); }
.nav-links > li > a:hover::after,.has-drop:hover .drop-toggle::after,.nav-links a.is-active::after{ right: 0; }
.nav-links a.is-active{ color: var(--iris); }
.drop-toggle svg{ width: 13px; height: 13px; transition: transform 0.25s var(--ease); }
.has-drop[data-open="true"] .drop-toggle svg{ transform: rotate(180deg); }
.drop{ position: absolute; top: calc(100% + 16px); left: 50%; transform: translateX(-50%) translateY(8px); min-width: 280px; background: var(--white); border: 1px solid var(--line); border-radius: 18px; box-shadow: 0 2px 6px rgba(22,20,43,.05), 0 18px 40px -12px rgba(22,20,43,.22); padding: 8px; display: grid; gap: 2px; opacity: 0; visibility: hidden; transition: opacity 0.18s var(--ease), transform 0.22s var(--ease); z-index: 60; }
.drop::before{ content:""; position:absolute; top:-16px; left:0; right:0; height:16px; }
.drop::after{ content:""; position:absolute; top:-7px; left:50%; width:13px; height:13px; background:var(--white); border-left:1px solid var(--line); border-top:1px solid var(--line); transform:translateX(-50%) rotate(45deg); border-radius:3px 0 0 0; }
.has-drop:hover .drop,.has-drop:focus-within .drop,.has-drop[data-open="true"] .drop{ opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.drop a{ position: relative; padding: 0.62rem 0.8rem; border-radius: 12px; font-weight: 600; line-height: 1.25; transition: background 0.16s var(--ease), color 0.16s var(--ease); }
.drop a > b{ font-weight: 600; }
.drop a::after{ display: none; }
.drop a:hover{ background: var(--iris-tint); color: var(--iris-700); }
.drop a small{ display: block; font-weight: 500; color: var(--muted); font-size: 0.78rem; margin-top: 2px; transition: color 0.16s var(--ease); }
.drop a:hover small{ color: var(--iris-700); opacity: .72; }
.nav-cta{ display: flex; align-items: center; gap: 0.75rem; }
.nav-toggle{ display: none; width: 46px; height: 46px; border: 2px solid var(--ink); border-radius: 9px; align-items: center; justify-content: center; background: var(--white); }
.nav-toggle span,.nav-toggle span::before,.nav-toggle span::after{ content:""; display:block; width:20px; height:2.5px; background: var(--ink); position: relative; transition: 0.25s var(--ease); }
.nav-toggle span::before{ position:absolute; top:-6px; }
.nav-toggle span::after{ position:absolute; top:6px; }
.nav[data-open="true"] .nav-toggle span{ background: transparent; }
.nav[data-open="true"] .nav-toggle span::before{ top:0; transform: rotate(45deg); }
.nav[data-open="true"] .nav-toggle span::after{ top:0; transform: rotate(-45deg); }
.site-footer{ background: var(--ink); color: #efefefcc; border-top: 2px solid var(--ink); padding-block: clamp(4rem, 3rem + 3vw, 5.5rem); }
.footer-grid{ display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr 1fr; gap: 2rem; }
.site-footer .brand{ color: var(--white); }
.site-footer .brand .dot{ box-shadow: 3px 3px 0 var(--iris-700); }
.footer-col .footer-h{ font-family: var(--font-body); font-weight: 700; font-size: var(--step--1); text-transform: uppercase; letter-spacing: 0.1em; color: var(--lime); margin-bottom: 1rem; }
.footer-col a{ display: block; padding: 0.35rem 0; color: #efefefb3; font-size: var(--step--1); transition: color 0.18s; }
.footer-col a:hover{ color: var(--lime); }
.footer-about p{ margin-top: 1rem; max-width: 34ch; font-size: var(--step--1); color: #efefef99; }
.footer-bottom{ margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid #ffffff22; display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between; font-size: var(--step--1); color: #efefef80; }
@media (max-width: 1024px){.nav-links,.nav-cta .btn,.nav-pilot{ display: none; }
.nav-toggle{ display: flex; }
.nav[data-open="true"] .nav-links{ display: flex; position: absolute; top: 72px; left: 0; right: 0; flex-direction: column; align-items: flex-start; gap: 0; background: var(--paper); border-bottom: 2px solid var(--ink); padding: 1rem 1.25rem 1.5rem; max-height: calc(100dvh - 72px); overflow-y: auto; }
.nav[data-open="true"] .nav-links > li{ width: 100%; }
.nav[data-open="true"] .nav-links > li > a,.nav[data-open="true"] .drop-toggle{ width: 100%; padding: 0.9rem 0; border-bottom: 1px solid var(--line); font-size: var(--step-0); justify-content: space-between; }
.nav[data-open="true"] .nav-links .btn{ display: inline-flex; margin-top: 1rem; justify-content: center; }
.has-drop .drop{ position: static; transform: none; opacity: 1; visibility: hidden; min-width: 0; box-shadow: none; border: none; padding: 0; display: none; background: transparent; }
.has-drop[data-open="true"] .drop{ display: grid; visibility: visible; padding: 0.2rem 0 0.6rem 0.8rem; }
.has-drop[data-open="true"] .drop::before{ display: none; }
.nav[data-open="true"] .drop a{ padding: 0.6rem 0; font-size: var(--step--1); }
.footer-grid{ grid-template-columns: 1fr 1fr; }
.footer-about{ grid-column: 1 / -1; }}
@media (max-width: 560px){.footer-grid{ grid-template-columns: 1fr; }}
.drop--wide{ min-width: 520px; grid-template-columns: 1fr 1fr; gap: 1px 8px; padding: 10px; }
.drop--wide a{ padding: 0.6rem 0.85rem; }
.drop .drop-all{ grid-column: 1 / -1; margin-top: 0.4rem; padding: 0.7rem 0.85rem 0.2rem; border-top: 1px solid var(--line); font-weight: 700; color: var(--iris); display: flex; align-items: center; gap: 0.4em; }
.drop .drop-all:hover{ background: transparent; color: var(--iris-700); }
@media (max-width: 860px){.drop--wide{ min-width: 0; grid-template-columns: 1fr; }}
.brand{gap:0.55rem}
.brand .egg{display:inline-flex;flex:none;line-height:0}
.brand .egg svg{width:40px;height:33px;display:block}
.site-header .brand .egg{background:var(--iris);border-radius:12px;padding:7px 9px;box-shadow:0 4px 14px rgba(90,79,207,.28)}
.site-header .brand .egg svg{width:34px;height:28px}
.brand .wm{font-family:var(--font-display);font-weight:800;letter-spacing:-0.02em;line-height:1}
.brand .ai{color:var(--iris)}
.site-footer .brand .ai{color:var(--lime)}
body.liderub-page .site-header{background:transparent;border-bottom:none;backdrop-filter:none;padding-top:16px}
body.liderub-page .site-header .nav{height:auto;padding:0;background:transparent;border:none;backdrop-filter:none;box-shadow:none;gap:14px;justify-content:flex-start}
body.liderub-page .site-header .nav-pill{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex:1;min-width:0;height:62px;padding:0 20px 0 22px;background:rgba(255,255,255,.5);border:1px solid rgba(22,20,43,.1);border-radius:16px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 10px 30px rgba(22,20,43,.07)}
body.liderub-page .site-header .nav-pilot{flex:none;transition:background .22s ease,color .22s ease,border-color .22s ease,box-shadow .22s ease}
body.liderub-page .site-header .nav-pilot.on-dark{background:#C7F464!important;color:#16142B!important;border-color:#16142B!important;box-shadow:4px 4px 0 #16142B!important}
body.liderub-page .site-header .nav-links .btn--iris{padding:0.85em 3.4em;min-height:44px;white-space:nowrap;color:var(--lime);box-shadow:none;background:var(--ink);border-color:var(--ink)}
body.liderub-page .site-header .nav-links .btn--iris:hover{box-shadow:none;transform:none;background:var(--ink)}
@media (max-width:760px){.footer-col a{padding:.6rem 0}}
.site-header .nav-pill{position:relative}
.site-header .has-drop{position:static}
.site-header .drop.mega{position:absolute;top:calc(100% + 14px);left:0;right:auto;width:100%;min-width:0;max-width:none;transform:translateY(8px);background:#fff;border:1px solid rgba(22,20,43,.10);border-radius:20px;box-shadow:0 28px 70px -24px rgba(22,20,43,.30);padding:0;display:block;opacity:0;visibility:hidden;transition:opacity .18s ease,transform .22s ease;z-index:80}
.site-header .has-drop[data-open="true"] .drop.mega{opacity:1;visibility:visible;transform:translateY(0)}
.site-header .has-drop:not([data-open="true"]):hover .drop.mega{opacity:0;visibility:hidden;transform:translateY(8px)}
.site-header .drop.mega .mega-cols{display:grid;gap:30px;padding:32px 38px}
.site-header .drop.mega .mega-col{display:flex;flex-direction:column;gap:2px}
.site-header .drop.mega .mega-label{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#5b5870;font-weight:700;margin-bottom:12px}
.site-header .drop.mega a{display:block;padding:9px 11px;border-radius:11px;text-decoration:none;transition:background .15s ease}
.site-header .drop.mega a b{display:block;font-family:var(--font-display);font-size:15px;color:#16142B;font-weight:700;line-height:1.2}
.site-header .drop.mega a small{display:block;font-size:12.5px;color:#5b5870;margin-top:3px;line-height:1.3}
.site-header .drop.mega a:hover{background:rgba(90,79,207,.07)}
.site-header .drop.mega .mega-foot{display:flex;align-items:center;gap:30px;padding:16px 38px;border-top:1px solid rgba(22,20,43,.08);background:rgba(22,20,43,.025);border-radius:0 0 20px 20px}
.site-header .drop.mega .mega-foot a{display:inline-flex;align-items:center;gap:9px;font-size:14px;font-weight:700;color:#16142B;padding:0;border-radius:0}
.site-header .drop.mega .mega-foot a:hover{background:transparent;color:#5A4FCF}
.site-header .drop.mega .mega-foot a svg{width:17px;height:17px}