*{box-sizing:border-box}body{margin:0;background:#06111e;color:#e9f6ff;font:17px/1.8 system-ui,-apple-system,Segoe UI,sans-serif}a{color:#70eaf6}header{position:sticky;top:0;z-index:5;background:#06111eee;border-bottom:1px solid #244052;backdrop-filter:blur(12px)}nav{max-width:1200px;margin:auto;padding:15px 25px;display:flex;align-items:center;justify-content:space-between;gap:20px}nav img{width:40px;height:40px;object-fit:contain;vertical-align:middle}nav a{text-decoration:none;font-size:14px;font-weight:700}.logo{font-size:20px;font-weight:900;color:white}.wrap{max-width:1100px;margin:auto;padding:40px 24px}.eyebrow{font-size:12px;letter-spacing:3px;text-transform:uppercase;color:var(--accent);font-weight:800}.hero{border:1px solid #27475a;border-radius:25px;overflow:hidden;background:linear-gradient(120deg,#10273b,#06101c);margin:18px 0 32px}.hero-copy{padding:clamp(28px,6vw,65px)}h1{font-size:clamp(35px,5vw,65px);line-height:1.12;letter-spacing:-2px;margin:15px 0}h2{font-size:clamp(24px,3vw,34px);line-height:1.2;color:#fff;margin:0 0 16px}h3{font-size:21px;color:white}p{margin:0 0 18px}strong{color:white}.subtitle{font-size:20px;color:#b7d2e3;max-width:800px}.hero img{width:100%;height:auto;display:block;max-height:420px;object-fit:cover}.pill{display:inline-block;border:1px solid #3b6374;border-radius:50px;padding:4px 13px;font-size:12px;color:#b5eaf0}.button{display:inline-block;background:var(--accent);color:#03121c;text-decoration:none;font-weight:900;border-radius:11px;padding:14px 22px;margin:8px 10px 8px 0}.outline{background:transparent;border:1px solid var(--accent);color:var(--accent)}.layout{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:35px}.content{min-width:0}.content section{margin:36px 0;padding:26px;border:1px solid #254457;background:#0b1b2b;border-radius:20px}.content section:nth-child(even){background:#0d2331}.content ul,.content ol{padding-left:23px}.content li{margin:10px 0}aside{align-self:start;position:sticky;top:90px;border:1px solid #2d5264;background:#0d2331;border-radius:20px;padding:23px;font-size:14px}aside a{display:block;margin:12px 0}.callout{background:linear-gradient(110deg,#102f3d,#1b1a3b);padding:30px;border:1px solid #31596c;border-radius:22px;margin:30px 0}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.card{padding:20px;border:1px solid #2b5366;border-radius:17px;background:#0d2130;text-decoration:none;color:white;line-height:1.4}.card small{color:var(--accent);display:block;margin-bottom:9px}footer{border-top:1px solid #244052;padding:28px;text-align:center;color:#a6b9c9;font-size:14px}.breadcrumbs{font-size:13px;color:#abc7d2}.toc{display:flex;gap:10px;flex-wrap:wrap}.toc a{font-size:13px;padding:7px 12px;border:1px solid #37596a;border-radius:40px;text-decoration:none}.steps{counter-reset:step}.steps section{position:relative}.steps section:before{counter-increment:step;content:counter(step);position:absolute;right:20px;top:16px;color:var(--accent);font-weight:900;font-size:38px;opacity:.4}@media(max-width:780px){.layout{grid-template-columns:1fr}aside{position:static}.cards{grid-template-columns:1fr}.wrap{padding:20px 15px}.hero-copy{padding:27px}nav{padding:10px 15px}}
/* FaceIndex branded article headers */
header nav .logo{display:inline-flex;align-items:center;flex:0 1 auto;min-width:0;line-height:1}
header nav .logo .brand-wordmark{display:block;width:clamp(190px,31vw,350px);max-width:100%;height:auto;object-fit:contain}
@media(max-width:650px){header nav{padding:10px 13px;gap:10px;flex-wrap:wrap}header nav .logo .brand-wordmark{width:clamp(150px,48vw,240px)}header nav>a:not(.logo){font-size:11px}header nav .button{padding:9px 11px;margin:0}}
@media(max-width:390px){header nav .logo .brand-wordmark{width:155px}header nav>a:not(.logo){font-size:10px}}