:root {
  --blue: #0969da;
  --blue-dark: #0b3f96;
  --blue-light: #8bc0ff;
  --blue-50: #eaf3ff;
  --gold: #f6b64a;
  --gold-dark: #c98518;
  --ink: #071b3a;
  --ink-2: #0d2856;
  --slate: #40536f;
  --muted: #53677f;
  --line: #dce6f2;
  --cloud: #f6f9fd;
  --white: #ffffff;
  --radius: 18px;
  --shadow: 0 15px 50px rgba(9, 35, 78, .12);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--white); color: var(--ink); font: 400 16px/1.65 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
h1, h2, h3 { margin: 0; color: var(--ink); font-family: Sora, Inter, ui-sans-serif, system-ui, sans-serif; line-height: 1.18; letter-spacing: -.028em; }
h1 { font-size: clamp(2.35rem, 5vw, 4.65rem); }
h2 { font-size: clamp(1.7rem, 3vw, 2.65rem); }
h3 { font-size: 1.1rem; }
p { margin: 0 0 1rem; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button, input, textarea { font: inherit; }
.container { width: min(1180px, calc(100% - 40px)); margin: auto; }
.skip { position: absolute; left: -999px; top: 0; background: var(--ink); color: #fff; padding: .75rem; z-index: 999; }.skip:focus { left: 1rem; top: 1rem; }
.site-header { position: sticky; z-index: 30; top: 0; background: rgba(255,255,255,.93); border-bottom: 1px solid rgba(220,230,242,.85); backdrop-filter: blur(16px); }
.header-row { min-height: 74px; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.brand { display: inline-flex; align-items: center; gap: .68rem; color: var(--ink); font: 800 1.1rem/1 Sora, sans-serif; white-space: nowrap; }.brand img { width: 34px; height: 34px; }
.nav { display: flex; align-items: center; gap: .2rem; }.nav a { padding: .5rem .65rem; border-radius: 9px; color: var(--slate); font-size: .84rem; font-weight: 650; }.nav a:hover, .nav a[aria-current="page"] { background: var(--blue-50); color: var(--blue-dark); }
.btn { display: inline-flex; justify-content: center; align-items: center; gap: .45rem; border: 1px solid transparent; border-radius: 12px; padding: .72rem 1.12rem; font-weight: 750; cursor: pointer; transition: transform .18s ease, box-shadow .18s ease, background .18s ease; }.btn:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(22,119,255,.22); }.btn-primary { background: var(--blue); color: #fff; }.btn-primary:hover { background: var(--blue-dark); }.btn-white { background: #fff; color: var(--blue-dark); }.btn-outline { color: var(--blue-dark); border-color: var(--blue); background: transparent; }.btn-sm { font-size: .88rem; padding: .56rem .85rem; }
.menu-button { display: none; border: 0; background: none; padding: .5rem; color: var(--ink); font-size: 1.3rem; }.mobile-nav { display: none; padding: 0 20px 1rem; background: #fff; border-top: 1px solid var(--line); }.mobile-nav.open { display: grid; }.mobile-nav a { padding: .65rem .75rem; border-radius: 9px; font-weight: 650; color: var(--slate); }.mobile-nav .btn-primary { color: #fff; margin-top: .4rem; }
.hero { position: relative; overflow: hidden; color: #fff; background: #061933; }.hero::before { content:""; position:absolute; inset:0; background: linear-gradient(90deg, rgba(5,20,49,.96) 0%, rgba(5,20,49,.76) 45%, rgba(5,20,49,.28) 100%), url('../img/responsive/azure/intro-1920.jpg') right center/cover; }.hero-grid { position: relative; display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr); align-items: center; min-height: 670px; gap: 3rem; padding: 5.5rem 0; }.eyebrow { display:inline-flex; align-items:center; gap:.5rem; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.09); color: #d8eaff; border-radius: 999px; padding: .38rem .75rem; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; font-weight: 750; }.eyebrow::before { content:""; width:7px; height:7px; background: var(--gold); border-radius:50%; }.hero h1 { color: #fff; max-width: 730px; margin: 1.15rem 0; }.hero h1 em { font-style: normal; color: #9bcaff; }.hero-copy { max-width: 650px; color: #d4e3f6; font-size: 1.08rem; }.hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin: 1.75rem 0 1rem; }.hero-note { color: #b9cce5; font-size: .84rem; }
.form-card { background: #fff; color: var(--ink); padding: 1.75rem; border-radius: 22px; box-shadow: 0 28px 70px rgba(0,0,0,.28); }.form-card h2 { font-size: 1.42rem; }.form-card p { color: var(--muted); font-size: .9rem; margin-top: .45rem; }.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; margin: 1.35rem 0; }.form-field { display: grid; gap: .35rem; min-width: 0; }.form-field.full { grid-column: 1 / -1; }.form-field label { color: var(--slate); font-size: .76rem; font-weight: 750; }.form-field input, .form-field textarea { width:100%; border: 1px solid var(--line); border-radius: 10px; padding: .74rem .82rem; color: var(--ink); outline: none; }.form-field input:focus, .form-field textarea:focus { border-color: var(--blue); box-shadow: 0 0 0 3px var(--blue-50); }.form-legal { font-size: .72rem!important; line-height: 1.45; }.form-legal a { color: var(--blue-dark); text-decoration: underline; }.form-success { display:none; padding: 2rem .5rem; text-align:center; }.form-success.show { display:block; }.form-fields.hide { display:none; }
.phone-field { position: relative; display: flex; align-items: center; gap: .5rem; border: 1px solid var(--line); border-radius: 10px; padding: 0 .5rem 0 0; }.phone-field:focus-within { border-color: var(--blue); box-shadow: 0 0 0 3px var(--blue-50); }.phone-code-wrap { flex: 0 0 auto; }.phone-code-select { border: 0; background: transparent; padding: .74rem .3rem .74rem .82rem; color: var(--ink); font-weight: 700; outline: none; max-width: 8.5rem; }.phone-number-input { flex: 1; min-width: 0; border: 0 !important; box-shadow: none !important; padding: .74rem .1rem !important; }.phone-spinner { display: none; flex: 0 0 auto; padding-left: .82rem; }.phone-spinner.active { display: flex; }.phone-field .iti { flex: 1; min-width: 0; display: block; }.phone-field .iti__flag-container, .phone-field .iti__country-container, .phone-field .iti__selected-dial-code, .phone-field .iti__dropdown-content, .phone-field .iti__country-list { display: none !important; }.phone-field .iti input.phone-number-input { width: 100%; padding-left: .1rem !important; }.spinner-ring { width: 16px; height: 16px; border: 2px solid var(--line); border-top-color: var(--blue); border-radius: 50%; animation: spin .7s linear infinite; }@keyframes spin { to { transform: rotate(360deg); } }
input.input-error, textarea.input-error { border-color: #d33 !important; }.error-message { display: block; color: #d33; font-size: .78rem; margin-top: .3rem; }.btn-loading { opacity: .7; cursor: default; }
.section { padding: 5.4rem 0; }.section.alt { background: var(--cloud); }.section.dark { background: linear-gradient(135deg, #071b3a, #0b3f96); color: #eaf4ff; }.section.dark h2, .section.dark h3 { color: #fff; }.section-head { max-width: 760px; margin: 0 auto 2.6rem; text-align: center; }.section-head p { color: var(--muted); margin: .8rem auto 0; }.dark .section-head p { color: #d3e4fa; }.kicker { color: var(--blue-dark); text-transform: uppercase; letter-spacing: .1em; font-weight: 800; font-size: .75rem; }.dark .kicker { color: #9bcaff; }
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; }.split.reverse .media { order: 2; }.media { position:relative; }.media img { width:100%; height: 390px; object-fit: cover; border-radius: var(--radius); box-shadow: var(--shadow); }.media::after { content:""; position:absolute; width: 84px; height:84px; right:-16px; bottom:-16px; border: 3px solid var(--gold); border-radius: 50%; opacity: .8; }.copy p { color: var(--slate); }.dark .copy p { color: #d8e6f7; }.list { list-style:none; margin: 1.3rem 0 1.7rem; padding:0; display:grid; gap:.75rem; }.list li { position:relative; padding-left: 1.8rem; color: var(--slate); }.list li::before { content:'✓'; position:absolute; left:0; top:0; color:var(--blue); font-weight:900; }.dark .list li { color:#d8e6f7; }.dark .list li::before { color: var(--gold); }
.cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.1rem; }.cards.four { grid-template-columns: repeat(4, 1fr); }.card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 1.45rem; box-shadow: 0 7px 22px rgba(12,43,88,.05); }.card .icon { width: 42px; height: 42px; display:grid; place-items:center; margin-bottom: 1rem; color: var(--blue-dark); border-radius: 12px; background: var(--blue-50); font-size: 1.15rem; }.card p { color: var(--muted); margin: .65rem 0 0; font-size: .9rem; }.card a { color: var(--blue-dark); font-weight: 750; text-decoration: underline; }.dark .card { background: rgba(255,255,255,.97); }.dark .card h3 { color: var(--ink); }
.calc { max-width: 700px; margin:auto; background:#fff; border:1px solid var(--line); border-radius:22px; padding:2rem; box-shadow:var(--shadow); }.range-row { margin: 1.35rem 0; }.range-label { display:flex; justify-content:space-between; gap:1rem; font-size:.82rem; color:var(--slate); font-weight:750; text-transform:uppercase; letter-spacing:.045em; }.range-label b { color:var(--blue-dark); }.range-row input { width:100%; accent-color:var(--blue); margin-top:.75rem; }.calc-result { margin-top:1.65rem; background:linear-gradient(120deg, var(--blue-dark), var(--blue)); color:#fff; border-radius:16px; padding:1.3rem; text-align:center; }.calc-result strong { display:block; font:800 clamp(2rem,5vw,3rem)/1 Sora,sans-serif; margin:.5rem 0; }.calc small { display:block; text-align:center; color:var(--muted); margin-top:1rem; }
.steps { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; counter-reset:steps; }.step { position:relative; padding:1.4rem; border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.07); border-radius:var(--radius); }.step::before { counter-increment:steps; content:counter(steps, decimal-leading-zero); display:block; color:var(--gold); font:800 1.55rem Sora,sans-serif; margin-bottom:.85rem; }.step p { color:#d3e4fa; font-size:.89rem; margin:.5rem 0 0; }
.table-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:var(--radius); background:#fff; box-shadow:var(--shadow); }.table { width:100%; min-width:640px; border-collapse:collapse; }.table th { background:var(--ink); color:#fff; text-align:left; padding:1rem; font-size:.84rem; }.table td { padding:1rem; color:var(--slate); border-top:1px solid var(--line); font-size:.9rem; }.table td:last-child { color:var(--ink); font-weight:700; }
.callout { max-width:900px; margin:2.5rem auto 0; border-left:4px solid var(--gold); border-radius:0 14px 14px 0; background:#fff7e6; color:#62410c; padding:1.15rem 1.3rem; }.dark .callout { background:rgba(255,255,255,.1); color:#fff; }.callout p { margin:0; font-size:.9rem; }.cta { background:linear-gradient(105deg,#071b3a,#104eaa); color:#fff; border-radius:24px; padding:3.2rem clamp(1.5rem,5vw,4rem); text-align:center; overflow:hidden; position:relative; }.cta::after { content:""; position:absolute; width:300px; height:300px; border:1px solid rgba(255,255,255,.18); border-radius:50%; right:-100px; top:-170px; }.cta h2 { color:#fff; position:relative; }.cta p { color:#dbeaff; max-width:650px; margin:1rem auto 1.5rem; position:relative; }.cta .btn { position:relative; }
.page-hero { background: linear-gradient(120deg, #071b3a, #0c4da9); color:#fff; padding: 5.2rem 0 4.5rem; text-align:center; }.page-hero h1 { color:#fff; font-size:clamp(2.15rem,4vw,3.6rem); max-width:930px; margin:auto; }.page-hero p { color:#d8e8ff; max-width:690px; margin:1rem auto 0; }.prose { width:min(800px,100%); margin:auto; }.prose h2 { font-size:1.45rem; margin:2.2rem 0 .7rem; }.prose h3 { margin:1.45rem 0 .45rem; }.prose p, .prose li { color:var(--slate); }.prose ul { padding-left:1.2rem; }.prose a { color:var(--blue-dark); text-decoration:underline; }.faq { max-width:820px; margin:auto; }.faq details { border:1px solid var(--line); border-radius:13px; padding: 1rem 1.15rem; margin:.75rem 0; background:#fff; }.faq summary { cursor:pointer; font-weight:750; color:var(--ink); }.faq details p { color:var(--slate); margin: .8rem 0 0; }
.video-grid { display:grid; grid-template-columns: repeat(4, 1fr); gap:1rem; }.video-card { background:#071b3a; border-radius:15px; overflow:hidden; }.video-frame { position:relative; aspect-ratio:9/16; background:#020913; }.video-frame iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }.video-card p { color:#d7e5f7; font-size:.8rem; padding:.8rem .8rem 0; margin:0; }.video-card small { display:block; color:#a6bddb; padding:.25rem .8rem .9rem; }
.search-box { display:flex; gap:.6rem; max-width:720px; margin:0 auto 2rem; }.search-box input { flex:1; border:1px solid var(--line); border-radius:12px; padding:.8rem 1rem; outline:0; }.search-box input:focus { border-color:var(--blue); box-shadow:0 0 0 3px var(--blue-50); }.search-result { max-width:720px; margin:.8rem auto; padding:1rem 0; border-bottom:1px solid var(--line); }.search-result h2 { font-size:1.1rem; margin-bottom:.25rem; }.search-result h2 a { color:var(--blue-dark); }.search-result p { color:var(--muted); margin:0; font-size:.9rem; }.search-count { max-width:720px; margin:auto; color:var(--muted); }
.site-footer { background:#06152e; color:#aabbd2; padding: 4rem 0 1.5rem; }.footer-grid { display:grid; grid-template-columns: 1.6fr 1fr 1fr; gap:3rem; }.footer-grid h2 { color:#fff; font-size:.85rem; letter-spacing:.08em; text-transform:uppercase; margin-bottom:1rem; }.footer-grid p { font-size:.88rem; max-width:370px; }.footer-links { list-style:none; padding:0; margin:0; display:grid; gap:.5rem; }.footer-links a:hover { color:#fff; }.risk { border-top:1px solid rgba(170,187,210,.2); border-bottom:1px solid rgba(170,187,210,.2); margin:2.4rem 0 1.25rem; padding:1.25rem 0; color:#b8c8dc; font-size:.78rem; }.risk strong { color:#fff; }.footer-bottom { display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; font-size:.78rem; }
@media (max-width: 1060px) { .nav { display:none; }.menu-button{display:block}.hero-grid { grid-template-columns:1fr; min-height:auto; padding:4rem 0; }.hero::before { background:linear-gradient(90deg,rgba(5,20,49,.96),rgba(5,20,49,.7)),url('../img/responsive/azure/intro-1920.jpg') center/cover; }.form-card { max-width:580px; }.cards.four, .steps { grid-template-columns:repeat(2,1fr); }.video-grid { grid-template-columns:repeat(2,1fr); max-width:620px; margin:auto; } }
@media (max-width: 760px) { .container { width:min(100% - 28px, 1180px); }.header-row { min-height:64px; }.brand { font-size:1rem; }.hero-grid { gap:2rem; padding:3.5rem 0; }.hero-copy { font-size:1rem; }.form-grid, .split, .cards, .cards.four, .steps, .footer-grid { grid-template-columns:1fr; }.split.reverse .media { order:0; }.media img { height:250px; }.section { padding:3.8rem 0; }.video-grid { grid-template-columns:repeat(2,1fr); }.page-hero { padding:3.7rem 0; }.search-box { flex-direction:column; }.cta { padding:2.5rem 1.25rem; } }
@media (max-width: 430px) { .video-grid { grid-template-columns:1fr 1fr; gap:.65rem; }.form-card { padding:1.35rem; }.hero-actions .btn { width:100%; }.btn { width:100%; }.mobile-nav .btn, .header-row .btn { width:auto; } }

:focus-visible { outline: 3px solid #f6b64a; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; } }
@media (max-width: 760px) { .hero::before { background: linear-gradient(90deg, rgba(5,20,49,.96), rgba(5,20,49,.7)), url('../img/responsive/azure/intro-768.jpg') center/cover; } }
