:root {
    --navy: #06142f;
    --navy-2: #0a2c60;
    --blue: #2386e7;
    --cyan: #54c8f3;
    --ink: #152846;
    --muted: #68778e;
    --line: #e1e9f3;
    --soft: #f6f9fd;
    --white: #fff;
    --shadow: 0 24px 70px rgba(14, 42, 88, .12);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    color: var(--ink);
    background: #fff;
    font-family: "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 16px;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
}
body::selection { color: #fff; background: var(--blue); }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button { font: inherit; }
svg { fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.9; }
.container { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.skip-link { position: fixed; top: -60px; left: 16px; z-index: 100; padding: 9px 14px; color: #fff; background: #0d3672; border-radius: 8px; }
.skip-link:focus { top: 12px; }

.site-header { position: absolute; inset: 0 0 auto; z-index: 20; border-bottom: 1px solid rgba(255,255,255,.11); }
.nav-wrap { display: flex; min-height: 88px; align-items: center; justify-content: space-between; gap: 25px; }
.brand { display: inline-flex; align-items: center; gap: 11px; color: #fff; }
.brand img { width: 52px; height: 52px; object-fit: contain; filter: drop-shadow(0 6px 15px rgba(42,145,230,.22)); }
.brand span { display: grid; line-height: 1.2; }
.brand strong { font-size: .94rem; font-weight: 800; letter-spacing: -.02em; }
.brand small { margin-top: 4px; color: #9fc9ec; font-size: .6rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.site-nav { display: flex; align-items: center; gap: 29px; }
.site-nav > a:not(.admin-link) { position: relative; color: #d8e8f8; font-size: .78rem; font-weight: 700; }
.site-nav > a:not(.admin-link)::after { position: absolute; right: 50%; bottom: -8px; left: 50%; height: 2px; content: ""; background: var(--cyan); border-radius: 2px; transition: inset .2s ease; }
.site-nav > a:hover::after, .site-nav > a:focus-visible::after { right: 0; left: 0; }
.admin-link { display: inline-flex; min-height: 42px; align-items: center; gap: 8px; padding: 0 16px; color: #fff; border: 1px solid rgba(255,255,255,.2); border-radius: 11px; background: rgba(255,255,255,.08); font-size: .74rem; font-weight: 800; transition: .2s ease; }
.admin-link:hover { background: rgba(255,255,255,.14); transform: translateY(-1px); }
.admin-link svg, .button svg { width: 18px; }
.menu-toggle { display: none; width: 43px; height: 41px; padding: 9px; border: 1px solid rgba(255,255,255,.18); border-radius: 10px; background: rgba(255,255,255,.08); }
.menu-toggle i { display: block; width: 100%; height: 2px; margin: 4px 0; background: #fff; border-radius: 2px; }

.hero { position: relative; min-height: 790px; overflow: hidden; color: #fff; background: radial-gradient(circle at 76% 30%, rgba(35,134,231,.35), transparent 26%), linear-gradient(122deg, #06142f, #08214a 58%, #0b3470); }
.hero::before { position: absolute; inset: 0; content: ""; opacity: .26; background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 48px 48px; mask-image: linear-gradient(to right, #000, transparent 85%); }
.hero::after { position: absolute; right: -190px; bottom: -350px; width: 730px; height: 730px; content: ""; border: 1px solid rgba(90,198,244,.14); border-radius: 50%; box-shadow: 0 0 0 90px rgba(54,155,231,.03), 0 0 0 180px rgba(54,155,231,.022); }
.hero-shape { position: absolute; border-radius: 50%; filter: blur(15px); }
.hero-shape--one { top: 120px; left: -150px; width: 340px; height: 340px; background: rgba(35,134,231,.08); }
.hero-shape--two { top: 80px; right: 10%; width: 120px; height: 120px; background: rgba(84,200,243,.09); }
.hero-grid { position: relative; z-index: 2; display: grid; grid-template-columns: .95fr 1.05fr; gap: 65px; align-items: center; padding-top: 160px; padding-bottom: 100px; }
.eyebrow { display: inline-flex; align-items: center; gap: 9px; margin-bottom: 20px; color: #8fd4f3; font-size: .67rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.eyebrow i { width: 25px; height: 2px; background: var(--cyan); border-radius: 2px; }
.hero h1 { margin: 0; font-size: clamp(3.15rem, 5.5vw, 5.15rem); line-height: 1.03; letter-spacing: -.06em; }
.hero h1 em { color: transparent; background: linear-gradient(90deg, #58c9f6, #76aaff); -webkit-background-clip: text; background-clip: text; font-style: normal; }
.hero-copy > p { max-width: 590px; margin: 24px 0 29px; color: #bdd1e8; font-size: 1rem; line-height: 1.8; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.button { display: inline-flex; min-height: 51px; align-items: center; justify-content: center; gap: 10px; padding: 0 21px; border-radius: 13px; font-size: .78rem; font-weight: 800; transition: transform .2s ease, box-shadow .2s ease; }
.button:hover { transform: translateY(-2px); }
.button--primary { color: #fff; background: linear-gradient(135deg, #258de9, #256bd6); box-shadow: 0 13px 32px rgba(23,105,210,.32); }
.button--ghost { color: #e7f3ff; border: 1px solid rgba(255,255,255,.17); background: rgba(255,255,255,.055); }
.button--white { color: #0b2e60; background: #fff; box-shadow: 0 14px 35px rgba(0,8,25,.22); }
.hero-stats { display: flex; margin-top: 38px; }
.hero-stats > div { display: grid; min-width: 118px; padding-right: 20px; }
.hero-stats > div + div { padding-left: 20px; border-left: 1px solid rgba(255,255,255,.13); }
.hero-stats strong { font-size: 1.02rem; }
.hero-stats span { color: #8fa9c7; font-size: .64rem; }

.api-preview { position: relative; min-height: 510px; }
.api-preview::before { position: absolute; inset: 10% 5%; content: ""; background: #1586e1; border-radius: 50%; opacity: .16; filter: blur(55px); }
.preview-card { position: absolute; inset: 34px 12px 34px 32px; overflow: hidden; border: 1px solid rgba(149,205,248,.2); border-radius: 22px; background: rgba(8,28,62,.86); box-shadow: 0 35px 90px rgba(0,8,26,.5); backdrop-filter: blur(20px); }
.preview-head { display: grid; min-height: 49px; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 17px; border-bottom: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.035); }
.preview-head > div { display: flex; gap: 5px; }
.preview-head i { width: 7px; height: 7px; background: #ff6d79; border-radius: 50%; }
.preview-head i:nth-child(2) { background: #ffc159; }.preview-head i:nth-child(3) { background: #4ed7a4; }
.preview-head span { color: #7692b3; font-size: .59rem; font-weight: 700; }
.preview-head b { justify-self: end; padding: 4px 7px; color: #6ce0b4; background: rgba(44,190,137,.11); border-radius: 6px; font-size: .52rem; }
.request { display: flex; align-items: center; gap: 10px; margin: 14px 16px 0; padding: 10px 12px; color: #8ea8c7; background: rgba(255,255,255,.045); border: 1px solid rgba(255,255,255,.07); border-radius: 9px; }
.request b { padding: 4px 6px; color: #66ddb2; background: rgba(40,197,139,.1); border-radius: 5px; font-size: .49rem; }
.request code { overflow: hidden; font-size: .57rem; text-overflow: ellipsis; white-space: nowrap; }
.preview-meta { display: grid; grid-template-columns: 1.4fr 1fr auto; align-items: center; gap: 14px; padding: 17px 18px 13px; }
.preview-meta > div { display: grid; }.preview-meta small { color: #6482a7; font-size: .47rem; font-weight: 800; letter-spacing: .08em; }.preview-meta strong { color: #dceaff; font-size: .7rem; }
.network { display: flex !important; align-items: center; gap: 9px; }
.network > span { display: grid; width: 48px; height: 35px; place-items: center; padding: 5px; background: #fff; border-radius: 8px; }
.network img { max-width: 38px; max-height: 22px; }
.live { display: inline-flex; align-items: center; gap: 6px; padding: 5px 8px; color: #5ee0ad; background: rgba(42,195,138,.1); border-radius: 7px; font-size: .52rem; font-weight: 800; }
.live i, .preview-foot i, .float-card--sync > i { width: 6px; height: 6px; background: #4bdba5; border-radius: 50%; box-shadow: 0 0 0 4px rgba(75,219,165,.1); }
.plan-card { margin: 0 17px; padding: 16px; border: 1px solid rgba(85,176,239,.2); border-radius: 13px; background: linear-gradient(135deg, rgba(24,99,182,.2), rgba(23,65,130,.12)); }
.plan-card > div, .plan-card footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.plan-card > div span { color: #65c5f1; font-size: .51rem; font-weight: 800; letter-spacing: .08em; }.plan-card > div strong { font-size: 1.08rem; }
.plan-card p { margin: 8px 0 14px; color: #bbcee4; font-size: .66rem; }
.plan-card footer { padding-top: 10px; border-top: 1px solid rgba(255,255,255,.07); color: #7f9ab9; font-size: .54rem; }.plan-card footer b { color: #8dcdf2; }
.special-card { display: flex; align-items: center; gap: 12px; margin: 11px 17px 0; padding: 12px 13px; border: 1px solid rgba(159,108,246,.18); border-radius: 11px; background: rgba(104,67,175,.1); }
.special-card > span { display: inline-flex; align-items: center; gap: 5px; padding: 5px 7px; color: #c5a5ff; background: rgba(144,96,226,.12); border-radius: 6px; font-size: .49rem; font-weight: 800; }.special-card svg { width: 12px; }
.special-card > div { display: grid; }.special-card strong { color: #d8e4f4; font-size: .63rem; }.special-card small { color: #778eac; font-size: .51rem; }
.preview-foot { display: flex; align-items: center; justify-content: space-between; margin: 13px 18px 0; color: #6683a7; font-size: .51rem; }.preview-foot span { display: flex; align-items: center; gap: 7px; }
.float-card { position: absolute; z-index: 3; display: flex; align-items: center; gap: 10px; padding: 11px 13px; border: 1px solid rgba(174,214,248,.22); border-radius: 13px; background: rgba(13,43,87,.94); box-shadow: 0 15px 40px rgba(0,10,31,.4); backdrop-filter: blur(16px); }
.float-card strong, .float-card small { display: block; }.float-card strong { color: #e8f4ff; font-size: .63rem; }.float-card small { color: #7896b7; font-size: .5rem; }
.float-card--secure { top: 7px; right: -10px; }.float-card--secure svg { width: 27px; color: var(--cyan); }
.float-card--sync { right: 5px; bottom: 7px; }.float-card--sync > i { margin-inline: 5px; }

.network-strip { border-bottom: 1px solid var(--line); background: #fff; box-shadow: 0 -15px 45px rgba(6,20,47,.05); }
.network-row { display: flex; min-height: 112px; align-items: center; justify-content: space-between; gap: 30px; }
.network-row > p { color: #7a8799; font-size: .69rem; font-weight: 700; }
.network-row > div { display: flex; align-items: center; gap: 45px; }
.network-row span { display: grid; width: 88px; height: 55px; place-items: center; opacity: .82; transition: .2s; }
.network-row span:hover { opacity: 1; transform: translateY(-2px); }
.network-row img { max-width: 76px; max-height: 43px; object-fit: contain; }.network-row img.bsnl { max-width: 92px; }

.section { padding: 108px 0; }
.section-head { display: flex; align-items: end; justify-content: space-between; gap: 50px; margin-bottom: 44px; }
.section-head > div { max-width: 650px; }.section-head > p { max-width: 430px; margin: 0 0 5px; color: var(--muted); font-size: .84rem; }
.kicker { display: block; margin-bottom: 10px; color: #2d79d1; font-size: .63rem; font-weight: 800; letter-spacing: .11em; }
h2 { margin: 0; color: var(--ink); font-size: clamp(2rem, 4vw, 3.15rem); line-height: 1.16; letter-spacing: -.045em; }
.features { background: #f8fafd; }
.feature-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.feature { position: relative; min-height: 300px; overflow: hidden; padding: 24px 22px; color: #267ee0; border: 1px solid #e2e9f3; border-radius: 18px; background: #fff; box-shadow: 0 12px 35px rgba(20,42,82,.055); transition: .25s; }
.feature::after { position: absolute; right: -55px; bottom: -70px; width: 150px; height: 150px; content: ""; background: currentColor; border-radius: 50%; opacity: .06; }
.feature:hover { border-color: #cbd9eb; box-shadow: 0 20px 45px rgba(20,42,82,.1); transform: translateY(-5px); }
.feature > span { position: absolute; top: 22px; right: 21px; color: #c3ccda; font-size: .64rem; font-weight: 800; }
.icon { display: grid; width: 48px; height: 48px; place-items: center; margin-bottom: 40px; background: #eaf3ff; border-radius: 13px; }.icon svg { width: 23px; }
.feature h3 { margin: 0 0 10px; color: #1b2d4a; font-size: .98rem; }.feature p { margin: 0; color: #6e7b90; font-size: .74rem; line-height: 1.75; }
.feature--violet { color: #7960d8; }.feature--violet .icon { background: #f0edff; }.feature--cyan { color: #159bc4; }.feature--cyan .icon { background: #e6f8fc; }.feature--green { color: #1c9b73; }.feature--green .icon { background: #e8f8f2; }

.operators-grid { display: grid; grid-template-columns: .88fr 1.12fr; gap: 88px; align-items: center; }
.operators-copy > p { max-width: 500px; margin: 20px 0 23px; color: var(--muted); font-size: .84rem; }
.operators-copy ul { display: grid; gap: 11px; margin: 0 0 27px; padding: 0; list-style: none; }
.operators-copy li { display: flex; align-items: center; gap: 10px; color: #42516a; font-size: .75rem; font-weight: 700; }.operators-copy li i { display: grid; width: 24px; height: 24px; place-items: center; color: #15966d; background: #e9f8f3; border-radius: 7px; font-style: normal; }
.text-link { color: #2479d5; font-size: .75rem; font-weight: 800; }.text-link span { margin-left: 5px; }
.operator-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.operator-cards article { position: relative; display: grid; min-height: 190px; place-items: center; padding: 22px; border: 1px solid #e1e8f2; border-radius: 18px; background: linear-gradient(145deg, #fff, #f7f9fd); box-shadow: 0 14px 35px rgba(20,42,82,.07); transition: .25s; }
.operator-cards article:hover { border-color: #c8d8eb; transform: translateY(-4px); }
.operator-cards article > i { position: absolute; top: 15px; right: 15px; width: 7px; height: 7px; background: #43ca98; border-radius: 50%; box-shadow: 0 0 0 5px #e9f8f3; }
.operator-cards article > span { display: grid; width: 110px; height: 75px; place-items: center; }.operator-cards img { max-width: 92px; max-height: 65px; object-fit: contain; }.operator-cards img.bsnl { max-width: 112px; }
.operator-cards strong { font-size: .87rem; }.operator-cards small { color: #7b8799; font-size: .61rem; }

.workflow { background: #f7faff; border-block: 1px solid #e9eff7; }
.center-head { max-width: 740px; margin: 0 auto 50px; text-align: center; }
.steps { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.steps::before { position: absolute; top: 48px; right: 17%; left: 17%; content: ""; border-top: 1px dashed #bed0e6; }
.steps article { position: relative; z-index: 1; padding: 18px 35px; text-align: center; }.steps article > b { position: absolute; top: 5px; right: calc(50% - 53px); display: grid; width: 22px; height: 22px; place-items: center; color: #fff; background: #237eda; border: 3px solid #f7faff; border-radius: 50%; font-size: .5rem; }
.step-icon { display: grid; width: 72px; height: 72px; place-items: center; margin: 0 auto 18px; color: #267bd6; background: #fff; border: 1px solid #d8e5f4; border-radius: 19px; box-shadow: 0 12px 30px rgba(21,67,128,.09); }.step-icon svg { width: 29px; }
.steps h3 { margin: 0 0 8px; font-size: .98rem; }.steps p { max-width: 280px; margin: auto; color: #6e7c91; font-size: .73rem; }

.api-section { position: relative; overflow: hidden; color: #fff; background: radial-gradient(circle at 10% 0, rgba(47,148,229,.2), transparent 32%), linear-gradient(128deg, #061831, #0b2d60); }
.api-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 85px; align-items: center; }
.kicker--light { color: #5bc8f2; }.api-section h2 { color: #fff; }.api-section p { max-width: 520px; margin: 20px 0 23px; color: #b5c9e0; font-size: .83rem; }
.api-points { display: flex; flex-wrap: wrap; gap: 9px 18px; margin-bottom: 27px; }.api-points span { color: #bad0e6; font-size: .67rem; font-weight: 700; }
.api-code-stack { display: grid; gap: 15px; }
.code-card { overflow: hidden; border: 1px solid rgba(148,199,240,.18); border-radius: 20px; background: #07152d; box-shadow: 0 30px 70px rgba(0,5,18,.42); }
.code-card header, .code-card footer { display: flex; align-items: center; justify-content: space-between; padding: 0 17px; }.code-card header { min-height: 48px; border-bottom: 1px solid rgba(255,255,255,.07); }.code-card header span { color: #829bb9; font-size: .63rem; font-weight: 700; }.code-card header b { padding: 4px 7px; color: #65ddb0; background: rgba(51,197,143,.1); border-radius: 5px; font-size: .52rem; }
.code-card pre { margin: 0; padding: 27px; overflow: auto; color: #68c8ee; font: 500 .72rem/1.9 Consolas, "Courier New", monospace; }.code-card code > span { color: #7893b1; }.code-card em { color: #e0ad7d; font-style: normal; }
.code-card footer { min-height: 44px; color: #6f8cab; border-top: 1px solid rgba(255,255,255,.06); font-size: .55rem; }.code-card footer span { display: flex; align-items: center; gap: 7px; }.code-card footer i { width: 6px; height: 6px; background: #4bdca5; border-radius: 50%; }
.code-card--compact pre { padding: 18px 27px; font-size: .66rem; line-height: 1.65; }

.cta { padding: 88px 0; background: #f7f9fd; }
.cta-card { position: relative; display: flex; min-height: 245px; align-items: center; justify-content: space-between; gap: 50px; padding: 48px 54px; overflow: hidden; border: 1px solid #dce6f2; border-radius: 24px; background: #fff; box-shadow: var(--shadow); }
.cta-card::after { position: absolute; top: -150px; right: -140px; width: 360px; height: 360px; content: ""; border: 55px solid rgba(38,129,220,.045); border-radius: 50%; }
.cta-card > div { position: relative; z-index: 1; max-width: 720px; }.cta-card h2 { font-size: clamp(1.8rem, 3.5vw, 2.65rem); }.cta-card p { margin: 13px 0 0; color: var(--muted); font-size: .8rem; }.cta-card .button { position: relative; z-index: 1; flex: 0 0 auto; }
.contact-links { display: flex; flex-wrap: wrap; gap: 10px 22px; margin-top: 20px; }.contact-links a { color: #145caa; font-size: .72rem; font-weight: 800; }.contact-links a:hover { color: #0b3872; text-decoration: underline; text-underline-offset: 3px; }

.site-footer { color: #b5c8df; background: #06142f; }
.footer-main { display: grid; min-height: 140px; grid-template-columns: 1fr 1fr auto; align-items: center; gap: 35px; }
.footer-brand { display: flex; align-items: center; gap: 12px; }.footer-brand img { width: 54px; height: 54px; object-fit: contain; }.footer-brand > div { display: grid; line-height: 1.25; }.footer-brand strong { color: #fff; font-size: .85rem; }.footer-brand span { color: #7190b3; font-size: .56rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.footer-copy { max-width: 390px; }.footer-copy p { margin: 0 0 9px; color: #7995b5; font-size: .67rem; }.footer-copy > div { display: flex; flex-wrap: wrap; gap: 7px 18px; }.footer-copy a { color: #b8d7f6; font-size: .62rem; font-weight: 700; }.footer-copy a:hover { color: #fff; }.footer-main nav { display: flex; gap: 25px; }.footer-main nav a { color: #9fb7d2; font-size: .67rem; font-weight: 700; }.footer-main nav a:hover { color: #fff; }
.footer-bottom { display: flex; min-height: 65px; align-items: center; justify-content: space-between; color: #607d9f; border-top: 1px solid rgba(255,255,255,.07); font-size: .59rem; }.footer-bottom a { color: #8da9c7; }

:focus-visible { outline: 3px solid rgba(83,199,244,.68); outline-offset: 3px; }

@media (max-width: 1050px) {
    .site-nav { gap: 19px; }
    .hero-grid { gap: 30px; }
    .feature-grid { grid-template-columns: 1fr 1fr; }
    .operators-grid, .api-grid { gap: 45px; }
}
@media (max-width: 860px) {
    .menu-toggle { display: block; }
    .site-nav { position: absolute; top: 77px; right: 20px; left: 20px; display: none; align-items: stretch; gap: 0; padding: 10px; border: 1px solid rgba(255,255,255,.13); border-radius: 15px; background: rgba(7,26,58,.97); box-shadow: 0 20px 50px rgba(0,8,25,.42); backdrop-filter: blur(20px); }
    .site-nav.is-open { display: grid; }.site-nav > a:not(.admin-link) { padding: 11px 12px; }.site-nav > a:not(.admin-link)::after { display: none; }.admin-link { margin-top: 5px; justify-content: center; }
    .hero { min-height: 0; }.hero-grid { grid-template-columns: 1fr; gap: 55px; padding-top: 145px; }.hero-copy { max-width: 680px; }.api-preview { width: min(620px, 100%); min-height: 500px; margin: auto; }
    .network-row { flex-direction: column; justify-content: center; padding-block: 25px; }.network-row > p { margin: 0; }
    .section-head { align-items: flex-start; flex-direction: column; gap: 18px; }.operators-grid, .api-grid { grid-template-columns: 1fr; }.operators-copy { max-width: 650px; }.operator-cards { max-width: 680px; }
    .steps article { padding-inline: 10px; }.cta-card { align-items: flex-start; flex-direction: column; }.footer-main { grid-template-columns: 1fr 1fr; padding-block: 30px; }.footer-main nav { grid-column: 1 / -1; }
}
@media (max-width: 600px) {
    .container { width: min(100% - 28px, 1180px); }.nav-wrap { min-height: 76px; }.brand img { width: 45px; height: 45px; }.brand strong { font-size: .83rem; }
    .hero-grid { padding-top: 128px; padding-bottom: 75px; }.hero h1 { font-size: clamp(2.65rem, 13vw, 3.8rem); }.hero-copy > p { font-size: .89rem; }.hero-actions, .hero-actions .button { width: 100%; }
    .hero-stats { justify-content: space-between; }.hero-stats > div { min-width: 0; padding-right: 9px; }.hero-stats > div + div { padding-left: 9px; }
    .api-preview { min-height: 475px; }.preview-card { inset: 28px 0 25px; }.float-card--secure, .float-card--sync { right: -5px; }.preview-meta { grid-template-columns: 1fr 1fr; }.preview-meta .live { display: none; }
    .network-row > div { width: 100%; flex-wrap: wrap; justify-content: center; gap: 12px 22px; }.network-row span { width: 70px; }
    .section { padding: 78px 0; }h2 { font-size: 2.15rem; }.feature-grid, .operator-cards, .steps { grid-template-columns: 1fr; }.feature { min-height: 275px; }.operators-grid { gap: 45px; }
    .steps::before { display: none; }.steps article { padding-block: 8px 28px; }.api-section { padding-block: 78px; }.code-card pre { padding: 20px 17px; font-size: .64rem; }
    .cta { padding: 58px 0; }.cta-card { min-height: 0; gap: 30px; padding: 34px 27px; }.cta-card .button { width: 100%; }
    .footer-main { grid-template-columns: 1fr; }.footer-main nav { grid-column: auto; flex-wrap: wrap; }.footer-bottom { align-items: flex-start; flex-direction: column; justify-content: center; gap: 5px; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}