/* Solutions menu and solution pages. */

.nav-drop{position:relative;display:flex;align-items:center;margin:0}
.nav-drop-label{display:inline-flex;align-items:center;gap:6px;padding:0;border:0;background:none;color:#465573;font-size:13px;font-weight:600;list-style:none;cursor:pointer}
.nav-drop-label::-webkit-details-marker{display:none}
.nav-drop-label::after{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-1px) rotate(45deg)}
.nav-drop-label:hover{color:#3147b8}
.nav-drop-panel{display:none;position:absolute;z-index:40;top:100%;left:50%;transform:translateX(-50%);padding-top:14px}
.nav-drop:hover .nav-drop-panel,
.nav-drop[open] .nav-drop-panel,
.nav-drop:focus-within .nav-drop-panel{display:block}
.nav-drop-card{min-width:232px;display:grid;padding:8px;background:#f9faff;border:1px solid #dce3ef;border-radius:14px;box-shadow:0 18px 40px rgba(16,26,51,.12)}
.desktop-nav .nav-drop-card a,
.nav-links .nav-drop-card a,
#mainNav .nav-drop-card a,
#nav .nav-drop-card a{display:block;padding:11px 12px;border-radius:8px;color:#19254b;font-size:13px;font-weight:600;text-align:left;white-space:nowrap}
.desktop-nav .nav-drop-card a:hover,
.nav-links .nav-drop-card a:hover,
.desktop-nav .nav-drop-card a[aria-current],
.nav-links .nav-drop-card a[aria-current],
#mainNav .nav-drop-card a:hover,
#nav .nav-drop-card a:hover,
#mainNav .nav-drop-card a[aria-current],
#nav .nav-drop-card a[aria-current]{background:#edf1fc;color:#3147b8;transform:none}
.sol-label{display:block;padding:16px 4px 2px;font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#526bca}
.nav-mobile-menu .sol-label{padding:18px 24px 2px;color:#b8c7ff}

#mainNav:not(.scrolled):not(.menu-open) .nav-drop-label,
#nav:not(.scrolled):not(.menu-open) .nav-drop-label{color:#fff}
#mainNav:not(.scrolled):not(.menu-open) .nav-drop-label:hover,
#nav:not(.scrolled):not(.menu-open) .nav-drop-label:hover{color:#b8c7ff}
#mainNav.scrolled .nav-drop-label,
#mainNav.menu-open .nav-drop-label,
#nav.scrolled .nav-drop-label,
#nav.menu-open .nav-drop-label{color:#465573}

/* Solution pages */
.sol-hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:64px;align-items:center;padding-top:clamp(140px,14vw,176px);padding-bottom:clamp(64px,8vw,96px)}
.sol-hero h1{max-width:640px;margin:16px 0 18px;font-size:clamp(46px,5.2vw,72px);line-height:1.02;letter-spacing:-.06em;font-weight:600}
.sol-hero h1 em{font-style:normal;color:#3147b8}
.sol-hero .lede{max-width:540px;color:#526280;font-size:18px;line-height:1.65}
.sol-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.sol-actions a{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:14px 22px;border-radius:10px;font-size:14px;font-weight:700}
.sol-actions .action-primary{background:#3147b8;color:#fff}
.sol-actions .action-primary:hover{background:#2238a8}
.sol-actions .action-ghost{border:1px solid #cbd5ed;color:#19254b;background:#fff}
.sol-actions .action-ghost:hover{border-color:#3147b8;color:#3147b8}
.sol-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding-bottom:clamp(72px,8vw,110px)}
.sol-steps article{background:#fff;border:1px solid #cbd5ed;border-radius:16px;padding:26px 24px 28px}
.sol-steps span{color:#526bca;font-size:11px;font-weight:700;letter-spacing:.14em}
.sol-steps h2{margin:14px 0 8px;font-size:24px;letter-spacing:-.04em;font-weight:600}
.sol-steps p{color:#526280;font-size:15px;line-height:1.6}
.sol-band{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center;margin-bottom:clamp(72px,8vw,110px);padding:clamp(32px,4vw,52px);background:#111a33;color:#fff;border-radius:22px}
.sol-band h2{max-width:560px;margin:12px 0 14px;font-size:clamp(32px,3.4vw,46px);line-height:1.08;letter-spacing:-.05em;font-weight:600}
.sol-band p{max-width:520px;color:#d5deef;font-size:16px;line-height:1.65}
.sol-band .eyebrow{color:#b8c7ff}
.sol-related{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding-bottom:clamp(80px,9vw,120px)}
.sol-related a{display:block;padding:22px;background:#fff;border:1px solid #cbd5ed;border-radius:16px}
.sol-related a:hover{border-color:#3147b8}
.sol-related span{color:#526bca;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.sol-related strong{display:block;margin-top:10px;font-family:'Space Grotesk',system-ui,sans-serif;font-size:22px;letter-spacing:-.04em;font-weight:600}

.mail-stage,.pass-stage,.brand-stage{border:1px solid #d5deef;border-radius:22px;background:#fff;box-shadow:0 28px 60px rgba(16,26,51,.08)}
.call-live{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:22px;background:#eef3ff;box-shadow:0 28px 60px rgba(16,26,51,.12)}
.call-live .call-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.call-live .call-host{position:absolute;left:50%;bottom:0;height:108%;width:auto;max-width:none;transform:translateX(-50%);filter:drop-shadow(0 16px 18px rgba(17,26,51,.16));animation:host-in 1.15s cubic-bezier(.19,1,.22,1) both}
@keyframes host-in{from{opacity:0;transform:translateX(-50%) translateY(18px)}to{opacity:1;transform:translateX(-50%)}}
.call-caption{margin-top:12px;color:#71809d;font-size:12px}

.mail-stage{padding:28px 26px}
.sig{border-left:4px solid #3147b8;padding-left:16px}
.sig-top{display:flex;gap:14px;align-items:flex-start}
.sig-photo{width:64px;height:64px;flex:none;border-radius:12px;object-fit:cover;object-position:center 18%;background:#e8eefc}
.sig-name{font-family:'Space Grotesk',system-ui,sans-serif;font-size:18px;font-weight:600;letter-spacing:-.03em}
.sig-role,.sig-meta{color:#64708b;font-size:13px;line-height:1.45}
.sig-co{color:#17223c;font-size:13px}
.sig-qr{margin-left:auto;text-align:center}
.sig-qr img{width:72px;height:72px;border:1px solid #dbe2f2;border-radius:8px}
.sig-qr span{display:block;margin-top:4px;color:#64708b;font-size:10px}
.sig-links{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:14px;color:#3147b8;font-size:13px}
.sig-btn{display:inline-block;margin-top:12px;padding:9px 14px;background:#3147b8;border-radius:6px;color:#fff;font-size:12px;font-weight:700}
.sig-brand{display:flex;align-items:center;gap:14px;margin-top:16px}
.sig-brand img{height:28px;width:auto}

.brand-stage{display:grid;place-items:center;min-height:420px;background:#111a33;border-color:#111a33}
.sol-mark{width:min(210px,52vw)}
.sol-mark svg{display:block;width:100%;height:auto;overflow:visible}
.sol-mark .card{transform-box:fill-box;transform-origin:center;transition:transform 1.15s cubic-bezier(.19,1,.22,1)}
.sol-mark .venn{opacity:0;transition:opacity .8s ease}
.sol-mark.is-apart .back{transform:translate(-46px,-34px) rotate(-7deg)}
.sol-mark.is-apart .front{transform:translate(50px,40px) rotate(6deg)}
.sol-mark.is-met .venn{opacity:1}

.phone{width:min(300px,78%);margin-inline:auto;filter:drop-shadow(0 30px 40px rgba(16,26,51,.2));animation:phone-in 1.1s cubic-bezier(.19,1,.22,1) both}
.phone svg{display:block;width:100%;height:auto}
.phone-note{margin-top:14px;color:#71809d;font-size:12px;line-height:1.5;text-align:center}
@keyframes phone-in{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

@media(prefers-reduced-motion:reduce){
  .sol-mark.is-apart .back,.sol-mark.is-apart .front{transform:none}
  .sol-mark .venn{opacity:1;transition:none}
}
.sol-steps.steps-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.badge-stage{display:grid;place-items:center;min-height:560px;padding:18px 24px 36px;background:radial-gradient(380px 240px at 50% 46%,rgba(109,219,234,.18),transparent 68%),#111a33;border-radius:22px;box-shadow:0 28px 60px rgba(16,26,51,.12);overflow:hidden}
.badge-hang{position:relative;display:flex;flex-direction:column;align-items:center;width:min(268px,100%)}
.badge-lanyard{position:relative;z-index:0;display:flex;justify-content:center;width:100%;height:78px}
.badge-lanyard span{width:16px;height:100%;background:linear-gradient(#243056 0%,#3147b8 70%,#6ddbea);border-inline:2px solid #6ddbea}
.badge-card{position:relative;z-index:1;width:100%;margin-top:-28px;padding:22px 16px 16px;background:#f7f8fc;color:#17223c;border-radius:16px;text-align:center;box-shadow:0 24px 48px rgba(0,0,0,.32);-webkit-mask:linear-gradient(#000 0 0) center/100% 100% no-repeat,url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 52 12'><rect width='52' height='12' rx='6' fill='black'/></svg>") center 11px/52px 12px no-repeat;-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) center/100% 100% no-repeat,url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 52 12'><rect width='52' height='12' rx='6' fill='black'/></svg>") center 11px/52px 12px no-repeat;mask-composite:exclude}
.badge-hole{position:absolute;top:7px;left:50%;width:64px;height:20px;transform:translateX(-50%);border:3px solid #e6ebf5;border-radius:999px;pointer-events:none}
.badge-photo{position:relative;height:168px;border-radius:12px;overflow:hidden;background:#0c1224}
.badge-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 12%}
.badge-event{position:absolute;left:10px;bottom:10px;margin:0;padding:5px 9px;background:#3147b8;color:#fff;border-radius:999px;font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.badge-name{margin:14px 0 0;font-family:'Space Grotesk',system-ui,sans-serif;font-size:26px;line-height:1.05;letter-spacing:-.04em;font-weight:600}
.badge-role{margin:6px 0 0;color:#3147b8;font-size:13px;font-weight:600}
.badge-co{margin:2px 0 0;color:#526280;font-size:13px;font-weight:600}
.badge-scan{display:flex;align-items:center;gap:12px;margin-top:14px;padding:10px;background:#fff;border:1px solid #dbe2f2;border-radius:12px;text-align:left}
.badge-scan img{width:72px;height:72px;flex:none;border-radius:6px}
.badge-hint{margin:0;color:#526280;font-size:12px;line-height:1.35;font-weight:600}

@media(max-width:900px){
  .sol-hero,.sol-band,.sol-related,.sol-steps,.sol-steps.steps-4{grid-template-columns:1fr}
  .sig-qr{display:none}
  .brand-stage{min-height:300px}
}
