@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--navy:#031a44;--ocean:#073d8f;--cyan:#06b6d4;--sky:#eefaff;--text:#334155;--line:#dbeafe;--green:#20c765}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f8fcff;color:var(--text);font-family:Manrope,Arial,sans-serif;line-height:1.75}a{color:inherit}img{max-width:100%}.wrap{width:min(1120px,calc(100% - 40px));margin:auto}
.site-header{position:sticky;top:0;z-index:20;border-bottom:1px solid rgba(219,234,254,.85);background:rgba(248,252,255,.9);backdrop-filter:blur(18px)}.nav{height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}.logo{width:118px;height:auto;filter:drop-shadow(0 7px 12px rgba(5,43,106,.14))}.nav-links{display:flex;align-items:center;gap:24px;font-size:.9rem;font-weight:800}.nav-links a{text-decoration:none}.nav-links a:hover{color:var(--cyan)}
.wa{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:16px;background:var(--green);color:#fff;padding:13px 20px;text-decoration:none;font-weight:800;box-shadow:0 14px 32px rgba(32,199,101,.25);transition:.25s}.wa:hover{transform:translateY(-3px);background:#16a653}.wa svg{width:20px;height:20px}
.blog-hero{position:relative;overflow:hidden;padding:82px 0 70px;background:radial-gradient(circle at 12% 18%,rgba(103,232,249,.5),transparent 28%),radial-gradient(circle at 90% 22%,rgba(196,181,253,.5),transparent 30%),linear-gradient(180deg,#f8fcff,#eefaff)}.blog-hero:after{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(7,61,143,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(7,61,143,.045) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(#000,transparent)}.hero-inner{position:relative;z-index:1;max-width:820px}.eyebrow{color:var(--cyan);font-size:.75rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase}.blog-hero h1,.article-head h1{margin:14px 0 20px;color:var(--navy);font-size:clamp(2.35rem,6vw,4.6rem);line-height:1.05;letter-spacing:-.045em}.blog-hero p,.article-head .lead{margin:0;max-width:760px;font-size:1.12rem;color:#52657f}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:70px 0 92px}.card{display:flex;flex-direction:column;min-height:330px;padding:28px;border:1px solid var(--line);border-radius:26px;background:#fff;box-shadow:0 16px 45px rgba(3,42,102,.07);transition:.3s}.card:hover{transform:translateY(-7px);border-color:#67e8f9;box-shadow:0 28px 60px rgba(3,42,102,.13)}.card h2{margin:15px 0 12px;color:var(--navy);font-size:1.25rem;line-height:1.35}.card p{margin:0;color:#64748b}.card a{margin-top:auto;padding-top:24px;color:var(--ocean);font-weight:800;text-decoration:none}.card a:hover{color:var(--cyan)}
.article-head{padding:72px 0 46px;background:linear-gradient(180deg,#f3fbff,#f8fcff)}.article-head h1{max-width:900px;font-size:clamp(2.25rem,5.5vw,4rem)}.crumbs{font-size:.85rem;font-weight:700;color:#64748b}.crumbs a{color:var(--ocean);text-decoration:none}.meta{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:22px;color:#64748b;font-size:.88rem;font-weight:700}
.article-layout{display:grid;grid-template-columns:minmax(0,760px) 280px;gap:56px;padding:58px 0 96px}.article{font-size:1.06rem}.article h2{margin:42px 0 13px;color:var(--navy);font-size:1.75rem;line-height:1.25;letter-spacing:-.025em}.article h3{margin:30px 0 10px;color:var(--ocean);font-size:1.2rem}.article p{margin:0 0 18px}.article ul,.article ol{padding-left:24px}.article li{margin:8px 0}.callout{margin:30px 0;padding:22px 24px;border:1px solid #a5f3fc;border-left:5px solid var(--cyan);border-radius:18px;background:#ecfeff}.warning{border-color:#fde68a;border-left-color:#f59e0b;background:#fffbeb}.toc{position:sticky;top:102px;height:max-content;padding:22px;border:1px solid var(--line);border-radius:22px;background:#fff;box-shadow:0 14px 40px rgba(3,42,102,.07)}.toc strong{display:block;color:var(--navy);margin-bottom:12px}.toc a{display:block;padding:7px 0;color:#64748b;font-size:.9rem;font-weight:700;text-decoration:none}.toc a:hover{color:var(--cyan)}
.article-cta{margin-top:46px;padding:30px;border-radius:26px;background:linear-gradient(135deg,#0756bd,#06b6d4 58%,#7c3aed);color:#fff}.article-cta h2{margin:0 0 10px;color:#fff}.article-cta p{margin-bottom:22px;color:rgba(255,255,255,.88)}.related{margin-top:54px;padding-top:34px;border-top:1px solid var(--line)}.related h2{margin-top:0}.related a{display:block;margin:10px 0;color:var(--ocean);font-weight:800;text-decoration:none}.related a:hover{color:var(--cyan)}
.footer{background:var(--navy);color:#cfe8ff}.footer .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:32px;padding-bottom:32px}.footer a{color:#67e8f9;font-weight:800;text-decoration:none}
@media(max-width:900px){.grid{grid-template-columns:repeat(2,1fr)}.article-layout{grid-template-columns:1fr}.toc{position:static;order:-1}.nav-links a:not(.wa){display:none}}
@media(max-width:620px){.wrap{width:min(100% - 28px,1120px)}.grid{grid-template-columns:1fr}.nav{height:68px}.logo{width:94px}.nav-links{gap:8px}.wa{padding:11px 14px;font-size:.8rem}.blog-hero,.article-head{padding-top:54px}.article-layout{padding-top:36px}.footer .wrap{align-items:flex-start;flex-direction:column}}
