.firewall-landing {
    --firewall-ink: #203a4f;
    --firewall-blue: #347da9;
    --firewall-cyan: #71c9db;
}

.firewall-landing #main { background: linear-gradient(180deg, #f3f9fd, #f7fbfd 55%, #edf6fb); }
.firewall-landing h1,
.firewall-landing h2,
.firewall-landing h3 { color: var(--firewall-ink); }
.firewall-landing .ambient-section { overflow: hidden; }
.firewall-landing .ambient-section > .shell { position: relative; z-index: 1; }
.firewall-landing .ambient-ball { z-index: 0; opacity: .58; }

.firewall-hero {
    padding-block: clamp(62px, 6.3vw, 96px);
    background: radial-gradient(ellipse 44% 68% at 7% 22%, rgba(125, 195, 224, .27), transparent 100%), radial-gradient(ellipse 43% 70% at 94% 78%, rgba(109, 206, 217, .2), transparent 100%);
}
.firewall-hero .ambient-ball-large { left: 2%; top: 6%; }
.firewall-hero .ambient-ball-small { right: 3%; bottom: 8%; }
.firewall-hero-grid { display: grid; grid-template-columns: minmax(0, 1.02fr) minmax(0, .98fr); align-items: center; gap: clamp(30px, 5vw, 76px); }
.firewall-hero h1 { max-width: 740px; margin: 0 0 24px; font-size: clamp(3.05rem, 4.6vw, 4.7rem); line-height: 1.06; letter-spacing: -.045em; }
.firewall-hero h1 em { color: var(--firewall-blue); font-style: normal; }
.firewall-lead { max-width: 65ch; margin: 0; color: #536a7b; font-size: clamp(1.09rem, 1.42vw, 1.24rem); line-height: 1.6; }
.firewall-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 21px; margin-top: 29px; }
.firewall-text-link { color: var(--firewall-blue); font-weight: 750; text-decoration: underline; text-underline-offset: 5px; }
.firewall-note { margin: 27px 0 0; color: #668092; font-size: .96rem; }

.firewall-visual { position: relative; display: grid; place-items: center; width: min(100%, 550px); min-height: 520px; margin-inline: auto; isolation: isolate; }
.firewall-visual::before { position: absolute; z-index: -2; width: 86%; aspect-ratio: 1; border: 1px solid #d2e8f2; border-radius: 50%; background: radial-gradient(circle at 45% 41%, rgba(255,255,255,.92), rgba(217,240,249,.6) 65%, rgba(180,225,241,.32)); box-shadow: 0 34px 82px rgba(57, 124, 156, .1); content: ""; }
.firewall-visual::after { position: absolute; z-index: -1; width: 68%; aspect-ratio: 1; border: 1px solid rgba(255,255,255,.75); border-radius: 50%; content: ""; }
.firewall-visual > img { display: block; width: min(92%, 490px); height: auto; filter: drop-shadow(0 23px 29px rgba(36, 85, 123, .14)); }
.firewall-orbit { position: absolute; z-index: -1; border-radius: 50%; background: linear-gradient(135deg, rgba(255,255,255,.95), rgba(99,174,215,.38)); box-shadow: 0 12px 32px rgba(62, 122, 156, .12); }
.firewall-orbit-one { width: 84px; height: 84px; top: 9%; left: 5%; }
.firewall-orbit-two { width: 118px; height: 118px; right: -1%; bottom: 7%; }
.firewall-visual-card { position: absolute; display: flex; align-items: center; gap: 13px; min-width: 190px; padding: 14px 17px; border: 1px solid #d0e4ee; border-radius: 15px; background: rgba(255,255,255,.96); box-shadow: 0 15px 38px rgba(39, 94, 128, .12); }
.firewall-visual-card small { display: block; margin-bottom: 2px; color: #698293; font-size: .74rem; }
.firewall-visual-card strong { color: var(--firewall-ink); font-family: "Nexa", "Source Sans 3", sans-serif; font-size: 1.05rem; }
.firewall-visual-card-top { top: 7%; right: 0; }
.firewall-visual-card-bottom { bottom: 5%; left: 0; }
.firewall-card-dot { flex: 0 0 14px; width: 14px; height: 14px; border-radius: 50%; background: var(--firewall-cyan); box-shadow: 0 0 0 7px #e5f5f8; }
.firewall-card-icon { display: grid; flex: 0 0 34px; width: 34px; height: 34px; place-items: center; border-radius: 10px; background: #e5f4f9; color: var(--firewall-blue); font-weight: 800; }

.firewall-scope { padding-block: clamp(60px, 6.2vw, 88px); background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.72) 20%, rgba(255,255,255,.72) 80%, rgba(255,255,255,.06)); scroll-margin-top: 20px; }
.firewall-scope .ambient-ball-small { right: 6%; top: 7%; }
.firewall-section-heading { max-width: 860px; margin-bottom: 31px; }
.firewall-section-heading h2,
.firewall-vpn h2,
.firewall-context h2,
.firewall-contact h2 { margin: 0 0 17px; font-size: clamp(2.25rem, 3.7vw, 3.55rem); line-height: 1.12; letter-spacing: -.035em; }
.firewall-section-heading > p:last-child,
.firewall-context-copy > p,
.firewall-contact-copy > p { margin: 0; color: #566d7e; font-size: 1.1rem; line-height: 1.6; }
.firewall-scope-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.firewall-scope-grid article { padding: clamp(25px, 3vw, 37px); border: 1px solid #d4e5ef; border-radius: 23px; background: rgba(255,255,255,.94); box-shadow: 0 13px 34px rgba(55, 102, 129, .06); }
.firewall-scope-grid article::before { display: block; width: 38px; height: 4px; margin-bottom: 21px; border-radius: 8px; background: var(--firewall-cyan); content: ""; }
.firewall-scope-grid article:nth-child(2)::before { background: #e9aa69; }
.firewall-scope-grid article > span { color: #4382a5; font-size: .76rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.firewall-scope-grid h3 { margin: 11px 0 10px; font-size: clamp(1.26rem, 1.7vw, 1.48rem); }
.firewall-scope-grid p { margin: 0; color: #5b7080; line-height: 1.58; }

.firewall-vpn { padding-block: clamp(62px, 6.3vw, 90px); background: linear-gradient(180deg, rgba(219,239,249,.06), rgba(219,239,249,.62) 22%, rgba(219,239,249,.62) 78%, rgba(219,239,249,.06)); }
.firewall-vpn .ambient-ball-large { right: 3%; top: 5%; }
.firewall-vpn-grid { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); align-items: center; gap: clamp(33px, 6vw, 86px); }
.firewall-vpn-copy > p:not(.eyebrow) { max-width: 60ch; margin: 0; color: #566d7e; font-size: 1.1rem; line-height: 1.6; }
.firewall-vpn-copy > p:not(.eyebrow) + p { margin-top: 16px; }
.firewall-vpn-flow { padding: clamp(25px, 3vw, 38px); border: 1px solid #cee3ed; border-radius: 24px; background: rgba(255,255,255,.92); box-shadow: 0 18px 40px rgba(46, 103, 136, .08); }
.firewall-vpn-flow-heading { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; padding-bottom: 21px; border-bottom: 1px solid #dce9ef; color: var(--firewall-ink); font-family: "Nexa", "Source Sans 3", sans-serif; font-size: 1.13rem; }
.firewall-vpn-flow ol { display: grid; gap: 11px; margin: 0; padding: 0; list-style: none; }
.firewall-vpn-flow li { display: grid; grid-template-columns: 43px 1fr; align-items: center; gap: 14px; padding: 14px; border: 1px solid #dbe9f1; border-radius: 15px; background: #f8fbfd; }
.firewall-vpn-flow li > span { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 11px; background: #e4f3f9; color: var(--firewall-blue); font-weight: 800; }
.firewall-vpn-flow li strong { display: block; color: var(--firewall-ink); font-family: "Nexa", "Source Sans 3", sans-serif; font-size: 1.08rem; }
.firewall-vpn-flow li small { display: block; margin-top: 3px; color: #657c8d; font-size: .91rem; line-height: 1.4; }
.firewall-vpn-flow > p { margin: 18px 0 0; color: #657c8d; font-size: .9rem; line-height: 1.5; }

.firewall-context { padding-block: clamp(62px, 6.3vw, 92px); background: linear-gradient(180deg, rgba(212,237,248,.06), rgba(212,237,248,.68) 22%, rgba(212,237,248,.68) 78%, rgba(212,237,248,.06)); }
.firewall-context .ambient-ball-large { left: 2%; bottom: 3%; }
.firewall-context-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .95fr); align-items: center; gap: clamp(32px, 6vw, 86px); }
.firewall-context h2 { margin-bottom: 0; }
.firewall-context-copy { padding: clamp(26px, 3vw, 39px); border: 1px solid #d2e5ee; border-radius: 23px; background: rgba(255,255,255,.86); box-shadow: 0 12px 28px rgba(49, 111, 145, .07); }
.firewall-context-copy > p + p { margin-top: 15px; }
.firewall-context-copy .firewall-text-link { display: inline-block; margin-top: 19px; }

.firewall-contact { padding-block: clamp(63px, 6vw, 90px); background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.73) 24%, rgba(255,255,255,.73) 76%, rgba(255,255,255,.06)); scroll-margin-top: 20px; }
.firewall-contact .ambient-ball-small { right: 4%; top: 10%; }
.firewall-contact-grid { display: grid; grid-template-columns: minmax(0, .87fr) minmax(0, 1.13fr); gap: clamp(31px, 6vw, 85px); align-items: start; }
.firewall-contact-copy > p + p { margin-top: 17px; }
.firewall-contact-copy a { color: var(--firewall-blue); }
.firewall-form { background: #fff; }
.firewall-form h3 { margin: 0 0 18px; font-size: clamp(1.55rem, 2vw, 2rem); }
.firewall-preview-note { padding: 12px 15px; margin-bottom: 16px; border: 1px solid #c8dfed; border-radius: 12px; background: #edf7fc; color: #45677f; font-size: .87rem; }

@media (max-width: 900px) {
    .firewall-hero-grid,
    .firewall-vpn-grid,
    .firewall-context-grid,
    .firewall-contact-grid { grid-template-columns: 1fr; }
    .firewall-visual { max-width: 600px; }
}
@media (max-width: 700px) {
    .firewall-hero { padding-block: 49px 61px; }
    .firewall-hero h1 { font-size: clamp(2.55rem, 9vw, 3.65rem); }
    .firewall-scope-grid { grid-template-columns: 1fr; }
    .firewall-scope,
    .firewall-vpn,
    .firewall-context,
    .firewall-contact { padding-block: 56px; }
    .firewall-visual { min-height: 470px; }
}
@media (max-width: 520px) {
    .firewall-landing .landing-header-inner { gap: 8px; }
    .firewall-landing .landing-brand img { width: 128px; }
    .firewall-landing .landing-header .button { padding: 6px 10px; font-size: .72rem; white-space: nowrap; }
    .firewall-hero h1 { font-size: clamp(2.45rem, 10vw, 3rem); }
    .firewall-lead { font-size: 1.06rem; }
    .firewall-actions { align-items: stretch; flex-direction: column; gap: 17px; }
    .firewall-actions .button,
    .firewall-form .button { width: 100%; }
    .firewall-visual { min-height: 380px; }
    .firewall-visual-card { min-width: 158px; padding: 10px 11px; gap: 10px; }
    .firewall-visual-card strong { font-size: .87rem; }
    .firewall-visual-card-top { top: 4%; }
    .firewall-visual-card-bottom { bottom: 1%; }
    .firewall-orbit-one { width: 54px; height: 54px; }
    .firewall-orbit-two { width: 80px; height: 80px; }
    .firewall-form .form-row { grid-template-columns: 1fr; gap: 0; }
}
