/* ==========================================================================
   RESET & SYSTEM BASE
   ========================================================================== */
* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    padding: 0;
    background-color: #ffffff;
    color: #0d2347;
    font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    -webkit-font-smoothing: antialiased;
}

a {
    text-decoration: none;
    color: inherit;
    transition: all 0.25s ease;
}

img {
    display: block;
    max-width: 100%;
    height: auto;
}

.network-shell {
    width: min(1200px, calc(100% - 64px));
    margin-inline: auto;
}

/* ==========================================================================
   HEADER
   ========================================================================== */
.network-header {
    position: sticky;
    top: 0;
    z-index: 100;
    background: #011638;
    padding-block: 14px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.network-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
}

.network-brand {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.network-logo {
    width: 168px;
    height: auto;
    object-fit: contain;
}

.network-links {
    display: flex;
    align-items: center;
    gap: 34px;
}

.network-links a {
    color: #ffffff;
    font-size: 15px;
    font-weight: 600;
    padding-bottom: 7px;
    border-bottom: 2px solid transparent;
}

.network-links a:hover,
.network-links a.active {
    color: #00c7df;
    border-color: #00c7df;
}

.network-nav-cta {
    background: linear-gradient(135deg, #04acc5 0%, #00a4bd 100%);
    color: #ffffff;
    padding: 13px 24px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 700;
    box-shadow: 0 10px 24px rgba(0, 156, 185, 0.25);
}

.network-nav-cta:hover {
    transform: translateY(-1px);
    background: linear-gradient(135deg, #06c0da 0%, #00acc9 100%);
}

/* ==========================================================================
   HERO
   ========================================================================== */
.network-hero {
    display: grid;
    grid-template-columns: 1.04fr 0.96fr;
    align-items: center;
    gap: 46px;
    padding-top: 58px;
    padding-bottom: 54px;
}

.network-hero h1 {
    font-size: clamp(42px, 4vw, 58px);
    font-weight: 850;
    color: #071c3d;
    line-height: 1.12;
    letter-spacing: -1.7px;
    margin: 0 0 22px;
}

.network-hero h1 .dot {
    color: #e62a32;
}

.network-intro {
    font-size: 17px;
    line-height: 1.65;
    color: #3f4d63;
    max-width: 560px;
    margin: 0 0 34px;
}

.network-actions {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-bottom: 46px;
}

.network-primary,
.network-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    padding: 0 28px;
    border-radius: 10px;
    font-weight: 700;
    font-size: 15px;
}

.network-primary {
    background: linear-gradient(135deg, #04acc5 0%, #009cb9 100%);
    color: #ffffff;
    box-shadow: 0 12px 28px rgba(0, 156, 185, 0.24);
}

.network-primary:hover {
    transform: translateY(-2px);
}

.network-secondary {
    background: #ffffff;
    color: #071c3d;
    border: 1.5px solid #c9d5e3;
}

.network-secondary:hover {
    border-color: #071c3d;
    background-color: #f8fafc;
}

.network-benefits {
    display: flex;
    align-items: center;
    gap: 26px;
    border-top: 1px solid #e7edf5;
    padding-top: 24px;
}

.benefit-item {
    display: flex;
    align-items: center;
    gap: 12px;
}

.benefit-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #009cb9;
    color: #ffffff;
    flex-shrink: 0;
}

.benefit-icon svg {
    width: 21px;
    height: 21px;
}

.benefit-item p {
    margin: 0;
    line-height: 1.28;
}

.benefit-item strong {
    display: block;
    font-size: 13px;
    color: #071c3d;
}

.benefit-item small {
    display: block;
    font-size: 11px;
    color: #69788f;
}

.network-visual {
    display: flex;
    justify-content: center;
    align-items: center;
}

.network-visual img {
    width: 100%;
    max-width: 560px;
    height: auto;
}

/* ==========================================================================
   PLATEFORMES
   ========================================================================== */
.network-platform-section {
    background: linear-gradient(180deg, #f9fbfd 0%, #ffffff 100%);
    border-radius: 24px;
    padding: 36px 26px 28px;
    text-align: center;
    margin-top: 4px;
}

.network-platform-section h2,
.network-vision h2,
.network-about-copy h2 {
    font-size: 32px;
    font-weight: 850;
    color: #071c3d;
    letter-spacing: -0.9px;
}

.network-platform-section h2 {
    margin: 0 0 30px;
}

.network-platforms {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 26px;
    margin-bottom: 26px;
}

.network-platform-card {
    background: #ffffff;
    border: 1px solid #e9eef5;
    border-radius: 17px;
    padding: 36px 30px 24px;
    box-shadow: 0 12px 34px rgba(7, 28, 61, 0.07);
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 330px;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.network-platform-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 18px 42px rgba(7, 28, 61, 0.11);
}

.platform-icon {
    width: 78px;
    height: 78px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    color: #ffffff;
}

.platform-icon.navy,
.platform-icon.Avocats {
    background-color: #0c2340;
}

.platform-icon.teal,
.platform-icon.Notaires {
    background-color: #009cb9;
}

.platform-icon.red,
.platform-icon.Remorquage {
    background-color: #e62a32;
}

.platform-icon svg {
    width: 38px;
    height: 38px;
    stroke: currentColor;
    fill: none;
    stroke-width: 4;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.network-platform-card h3 {
    font-size: 24px;
    font-weight: 800;
    color: #071c3d;
    margin: 0 0 10px;
}

.network-platform-card p {
    font-size: 15px;
    line-height: 1.55;
    color: #4f6077;
    margin: 0 0 22px;
    min-height: 68px;
}

.platform-btn {
    background: linear-gradient(135deg, #04acc5 0%, #009cb9 100%);
    color: #ffffff;
    padding: 12px 27px;
    border-radius: 9px;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 22px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.card-footer-domain {
    width: 100%;
    border-top: 1px dashed #d8e1eb;
    padding-top: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    color: #1673ff;
    font-size: 14px;
    font-weight: 600;
}

.globe-icon {
    width: 16px;
    height: 16px;
}

.network-coming {
    font-size: 15px;
    color: #34445a;
    margin: 0;
}

.network-coming .star-icon {
    color: #009cb9;
    margin-right: 5px;
}

/* ==========================================================================
   À PROPOS
   ========================================================================== */
.network-about {
    display: grid;
    grid-template-columns: 0.92fr 1.08fr;
    align-items: center;
    gap: 70px;
    background: #f7faff;
    border-radius: 24px;
    padding: 52px 48px;
    margin-block: 26px 34px;
}

.network-portrait {
    position: relative;
    border-radius: 18px;
    overflow: hidden;
    aspect-ratio: 4 / 3;
    display: grid;
    place-items: center;
    isolation: isolate;
    background: radial-gradient(circle at 50% 45%, #123b75 0 23%, transparent 24%), linear-gradient(145deg, #061a3e 0%, #0a3266 62%, #007f9d 140%);
}

.network-portrait::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    opacity: .18;
    background-image: linear-gradient(rgba(255,255,255,.18) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.18) 1px, transparent 1px);
    background-size: 36px 36px;
    mask-image: linear-gradient(to bottom, #000, transparent 88%);
}

.about-avatar {
    display: grid;
    place-items: center;
    width: 158px;
    height: 158px;
    border: 1px solid rgba(255,255,255,.26);
    border-radius: 36px;
    background: linear-gradient(145deg, rgba(255,255,255,.16), rgba(255,255,255,.05));
    box-shadow: 0 26px 55px rgba(0,0,0,.28), inset 0 1px rgba(255,255,255,.22);
    backdrop-filter: blur(8px);
    transform: rotate(-4deg);
}

.about-avatar-mark {
    display: grid;
    place-items: center;
    width: 84px;
    height: 84px;
    border-radius: 25px;
    color: #06204a;
    background: linear-gradient(135deg, #56eff4, #00b6d3);
    font-size: 29px;
    font-weight: 950;
    letter-spacing: -2px;
    box-shadow: 0 13px 30px rgba(0,199,223,.28);
}

.about-avatar-label {
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .03em;
}

.about-orbit {
    position: absolute;
    z-index: -1;
    border: 1px solid rgba(96,238,244,.28);
    border-radius: 50%;
}

.about-orbit-one { width: 250px; height: 250px; }
.about-orbit-two { width: 340px; height: 340px; border-style: dashed; opacity: .7; }

.about-chip {
    position: absolute;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 13px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 11px;
    color: #dcecff;
    background: rgba(4,25,60,.78);
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
    backdrop-filter: blur(7px);
    font-size: 11px;
    font-weight: 750;
}

.about-chip span { color: #42e8ec; font-size: 14px; }
.about-chip-top { top: 25px; right: 24px; }
.about-chip-bottom { bottom: 24px; left: 24px; }

@media (max-width: 560px) {
    .about-avatar { width: 130px; height: 130px; border-radius: 30px; }
    .about-avatar-mark { width: 68px; height: 68px; font-size: 24px; }
    .about-orbit-one { width: 210px; height: 210px; }
    .about-orbit-two { width: 285px; height: 285px; }
    .about-chip { padding: 8px 10px; font-size: 9px; }
}

.portrait-code-overlay {
    position: absolute;
    top: 25px;
    right: 30px;
    color: rgba(0, 188, 212, 0.55);
    font-size: 32px;
    font-weight: 850;
}

.portrait-badge {
    position: absolute;
    right: 22px;
    bottom: 22px;
    background: rgba(8, 32, 71, 0.94);
    backdrop-filter: blur(6px);
    border: 1px solid rgba(255, 255, 255, 0.12);
    padding: 12px 18px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.badge-icon {
    color: #00c7df;
    font-weight: 800;
    font-size: 15px;
}

.badge-text strong {
    display: block;
    color: #ffffff;
    font-size: 13px;
}

.badge-text small {
    display: block;
    color: #b9c7dc;
    font-size: 11px;
}

.network-about-copy h2 {
    margin: 0 0 18px;
    position: relative;
}

.network-about-copy h2::after {
    content: "";
    display: block;
    width: 62px;
    height: 4px;
    background: #00bcd4;
    margin-top: 14px;
    border-radius: 999px;
}

.network-about-copy p {
    font-size: 16px;
    line-height: 1.66;
    color: #3f4d63;
    margin: 0;
}

/* ==========================================================================
   VISION
   ========================================================================== */
.network-vision {
    text-align: center;
    background: linear-gradient(180deg, #f9fbfd 0%, #ffffff 100%);
    border-radius: 24px;
    padding: 28px 30px 40px;
}

.network-vision h2 {
    margin: 0 0 14px;
}

.vision-lead {
    font-size: 16px;
    line-height: 1.58;
    color: #3f4d63;
    max-width: 860px;
    margin: 0 auto 34px;
}

.network-values {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 26px;
}

.value-card {
    background: #ffffff;
    border: 1px solid #e9eef5;
    border-radius: 14px;
    padding: 22px 24px;
    display: flex;
    align-items: center;
    gap: 18px;
    box-shadow: 0 10px 30px rgba(7, 28, 61, 0.06);
    text-align: left;
}

.value-icon {
    width: 58px;
    height: 58px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.value-icon.rocket-bg {
    background-color: #e6f6f8;
    color: #009cb9;
}

.value-icon.shield-bg {
    background-color: #e6f4ea;
    color: #137333;
}

.value-icon.map-bg {
    background-color: #fef3f2;
    color: #d92727;
}

.value-icon svg {
    width: 28px;
    height: 28px;
}

.value-text strong {
    display: block;
    font-size: 18px;
    color: #071c3d;
    margin-bottom: 3px;
}

.value-text p {
    margin: 0;
    font-size: 13px;
    color: #53647a;
    line-height: 1.3;
}

/* ==========================================================================
   BANNIÈRE AVANT FOOTER
   ========================================================================== */
.network-cta {
    position: relative;
    overflow: hidden;
    min-height: 195px;
    margin-block: 32px 12px;
    padding: 34px 48px;
    border-radius: 20px;
    color: #ffffff;
    background: linear-gradient(135deg, #03183a 0%, #062a5c 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.network-cta::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 50% 30%, rgba(0, 188, 212, 0.10), transparent 36%),
        linear-gradient(90deg, rgba(3, 24, 58, 0.65) 0%, rgba(3, 24, 58, 0.18) 50%, rgba(3, 24, 58, 0.65) 100%);
    z-index: 2;
}

.cta-decorations {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
}

.network-cta-city {
    position: absolute;
    left: 32px;
    bottom: 0;
    width: 330px;
    max-width: 36%;
    opacity: 0.28;
    object-fit: contain;
}

.network-cta-map {
    position: absolute;
    right: 54px;
    top: 50%;
    width: 150px;
    max-width: 18%;
    opacity: 0.42;
    transform: translateY(-50%);
    object-fit: contain;
}

.cta-content {
    position: relative;
    z-index: 4;
    max-width: 690px;
    margin-inline: auto;
    text-align: center;
}

.network-cta h2 {
    font-size: 30px;
    line-height: 1.18;
    font-weight: 850;
    margin: 0 0 10px;
    color: #ffffff;
}

.network-cta p {
    font-size: 16px;
    line-height: 1.45;
    color: rgba(255, 255, 255, 0.86);
    margin: 0 0 24px;
}

.cta-btn {
    background: linear-gradient(135deg, #04acc5 0%, #009cb9 100%);
    color: #ffffff;
    padding: 14px 34px;
    border-radius: 9px;
    font-size: 16px;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    box-shadow: 0 12px 26px rgba(0, 156, 185, 0.25);
}

.cta-btn:hover {
    transform: translateY(-2px);
}

/* ==========================================================================
   FOOTER
   ========================================================================== */
.network-footer {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, #01122e 0%, #031d42 58%, #063250 100%);
    color: #ffffff;
    padding: 58px 0 0;
    margin-top: 0;
}

.network-footer::before {
    content: "";
    position: absolute;
    width: 360px;
    height: 360px;
    right: -170px;
    top: -230px;
    border-radius: 50%;
    border: 1px solid rgba(0, 199, 223, 0.22);
    box-shadow: 0 0 0 48px rgba(0, 199, 223, 0.035), 0 0 0 96px rgba(0, 199, 223, 0.025);
    pointer-events: none;
}

.network-footer-content {
    position: relative;
    display: grid;
    grid-template-columns: minmax(300px, 1.55fr) minmax(170px, 0.7fr) minmax(190px, 0.75fr);
    align-items: start;
    gap: clamp(42px, 7vw, 94px);
    padding-bottom: 44px;
}

.footer-intro {
    max-width: 430px;
}

.footer-logo-link {
    display: inline-flex;
    border-radius: 12px;
}

.footer-intro .network-logo {
    width: 178px;
    height: auto;
}

.footer-intro p {
    max-width: 400px;
    margin: 20px 0 18px;
    color: #c3d3e6;
    font-size: 15px;
    line-height: 1.75;
}

.footer-local-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border: 1px solid rgba(73, 220, 234, 0.25);
    border-radius: 999px;
    background: rgba(0, 199, 223, 0.08);
    color: #6ee9f3;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.04em;
}

.footer-local-badge::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #1bd0e2;
    box-shadow: 0 0 0 4px rgba(27, 208, 226, 0.12);
}

.footer-column {
    display: flex;
    flex-direction: column;
    gap: 13px;
}

.footer-column strong {
    margin-bottom: 7px;
    color: #ffffff;
    font-size: 13px;
    font-weight: 850;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.footer-column a {
    width: fit-content;
    color: #c3d3e6;
    font-size: 14px;
    line-height: 1.5;
    transition: color 0.2s ease, transform 0.2s ease;
}

.footer-column a span {
    display: inline-block;
    margin-left: 4px;
    color: #19c7da;
    transition: transform 0.2s ease;
}

.footer-column a:hover,
.footer-column a:focus-visible {
    color: #63e6f2;
    transform: translateX(3px);
}

.footer-column a:hover span {
    transform: translate(2px, -2px);
}

.footer-bottom {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-height: 72px;
    border-top: 1px solid rgba(255, 255, 255, 0.11);
}

.footer-bottom p {
    margin: 0;
    color: #91a7c0;
    font-size: 12px;
}

.footer-signature span {
    margin-right: 5px;
    color: #15c7da;
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width: 1100px) {
    .network-shell {
        width: min(100% - 44px, 1200px);
    }

    .network-links {
        gap: 22px;
    }

    .network-logo {
        width: 145px;
    }

    .network-hero {
        gap: 30px;
    }

    .network-hero h1 {
        font-size: clamp(38px, 5vw, 52px);
    }
}

@media (max-width: 992px) {
    .network-hero {
        grid-template-columns: 1fr;
        text-align: center;
        padding-top: 42px;
    }

    .network-intro {
        margin-inline: auto;
    }

    .network-actions,
    .network-benefits {
        justify-content: center;
    }

    .network-platforms {
        grid-template-columns: repeat(2, 1fr);
    }

    .network-about {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .network-values {
        grid-template-columns: 1fr;
    }

    .network-footer-content {
        align-items: flex-start;
    }
}

@media (max-width: 768px) {
    .network-shell {
        width: min(100% - 32px, 1200px);
    }

    .network-header {
        padding-block: 12px;
    }

    .network-logo {
        width: 138px;
    }

    .network-links,
    .network-nav-cta {
        display: none;
    }

    .network-hero {
        padding-top: 34px;
        padding-bottom: 44px;
    }

    .network-hero h1 {
        font-size: 34px;
        letter-spacing: -1px;
    }

    .network-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .network-benefits {
        flex-direction: column;
        align-items: flex-start;
        text-align: left;
    }

    .network-platform-section {
        padding: 30px 18px;
    }

    .network-platforms {
        grid-template-columns: 1fr;
    }

    .network-about {
        padding: 30px 22px;
    }

    .network-vision {
        padding: 30px 20px;
    }

    .network-cta {
        min-height: 250px;
        padding: 36px 24px;
    }

    .network-cta-city {
        left: 0;
        width: 280px;
        max-width: 72%;
        opacity: 0.18;
    }

    .network-cta-map {
        right: 16px;
        width: 105px;
        max-width: 28%;
        opacity: 0.25;
    }

    .network-cta h2 {
        font-size: 25px;
    }

    .network-cta p {
        font-size: 14px;
    }

    .network-footer-content {
        grid-template-columns: 1fr 1fr;
        gap: 40px 56px;
    }

    .footer-intro {
        grid-column: 1 / -1;
    }

    .footer-bottom {
        min-height: 80px;
    }
}

@media (max-width: 560px) {
    .network-footer {
        padding-top: 42px;
    }

    .network-footer-content {
        grid-template-columns: 1fr;
        gap: 34px;
        padding-bottom: 34px;
    }

    .footer-intro {
        grid-column: auto;
    }

    .footer-bottom {
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        gap: 8px;
        padding-block: 20px;
    }
}

/* SEO landing components -------------------------------------------------- */
.seo-section { padding-block: 72px; text-align: center; }
.seo-section h2, .seo-feature h2, .seo-numbers h2 { color:#071c3d; font-size:clamp(28px,4vw,42px); line-height:1.15; margin:0 0 16px; }
.seo-eyebrow { margin:0 0 12px; color:#008da9; font-size:13px; font-weight:850; letter-spacing:.12em; text-transform:uppercase; }
.seo-lead { max-width:850px; margin:0 auto 34px; color:#53647a; font-size:17px; line-height:1.7; }
.seo-strip { background:#071c3d; color:#fff; padding:24px 0; }
.seo-strip-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.seo-strip-grid div { text-align:center; }
.seo-strip-grid strong { display:block; font-size:24px; color:#31c6da; }
.seo-strip-grid span { font-size:13px; color:#d9e5f4; }
.seo-soft { width:100%; background:#f4f8fc; }
.seo-grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:34px; }
.seo-grid-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:34px; }
.seo-grid-4 article { border:1px solid rgba(255,255,255,.15); border-radius:18px; padding:26px; background:rgba(255,255,255,.08); }
.seo-grid-4 strong,.seo-grid-4 span { display:block; }
.seo-grid-4 strong { color:#fff; font-size:38px; }
.seo-grid-4 span { margin-top:6px; color:#d7e5f5; font-size:13px; }
.orbit-four { right:2%; top:48%; }
.seo-grid-3 article { background:#fff; border:1px solid #e3eaf2; border-radius:18px; padding:28px; box-shadow:0 10px 28px rgba(7,28,61,.06); }
.seo-grid-3 b { display:inline-grid; place-items:center; width:38px; height:38px; border-radius:50%; background:#009cb9; color:#fff; }
.seo-grid-3 h3 { color:#071c3d; font-size:20px; }
.seo-grid-3 p { color:#53647a; line-height:1.65; }
.seo-tags { display:flex; flex-wrap:wrap; justify-content:center; gap:12px; margin-top:30px; }
.seo-tags span, .seo-city-grid span, .seo-city-grid a { padding:11px 17px; border:1px solid #d8e4ee; background:#fff; border-radius:999px; color:#173457; font-weight:700; }
.seo-city-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:12px; margin-top:28px; }
.seo-city-grid span, .seo-city-grid a { border-radius:12px; }
.seo-city-grid a { transition:.2s ease; }
.seo-city-grid a:hover { border-color:#00a9c2; color:#007d98; transform:translateY(-2px); box-shadow:0 8px 20px rgba(7,28,61,.08); }

/* Visual governorate cards on the main landing page. */
.region-card-section{text-align:center}.region-card-section .seo-lead{max-width:820px;margin-inline:auto}.region-card-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:34px;text-align:left}.region-card{position:relative;min-height:235px;overflow:hidden;border-radius:20px;background:#082652;box-shadow:0 15px 38px rgba(7,28,61,.14);isolation:isolate;transition:transform .25s ease,box-shadow .25s ease}.region-card img{position:absolute;z-index:-2;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .45s ease}.region-card-shade{position:absolute;z-index:-1;inset:0;background:linear-gradient(180deg,rgba(4,18,43,.03) 20%,rgba(4,18,43,.9) 100%)}.region-card-content{position:absolute;inset:auto 20px 19px;display:grid;color:#fff}.region-card-content small{color:#54edf0;font-size:10px;font-weight:900;letter-spacing:.14em;text-transform:uppercase}.region-card-content strong{margin-top:3px;font-size:24px;line-height:1.1}.region-card-content em{margin-top:3px;color:#dbe8f1;font-family:Tahoma,Arial,sans-serif;font-size:13px;font-style:normal}.region-card-content b{display:flex;align-items:center;justify-content:space-between;margin-top:13px;padding-top:11px;border-top:1px solid rgba(255,255,255,.25);font-size:11px}.region-card:hover,.region-card:focus-visible{transform:translateY(-5px);box-shadow:0 22px 48px rgba(7,28,61,.23)}.region-card:hover img,.region-card:focus-visible img{transform:scale(1.045)}.region-card:focus-visible{outline:3px solid #34d9e8;outline-offset:3px}

/* Regional SEO pages */
.region-hero{padding:82px 0;background:linear-gradient(130deg,#061a3e,#083d71 70%,#008aa2);color:#fff}.region-hero-grid{display:grid;grid-template-columns:1.35fr .65fr;align-items:center;gap:70px}.region-back{display:inline-block;margin-bottom:30px;color:#a9dce7;font-size:13px;font-weight:750}.region-hero h1{margin:8px 0 18px;font-size:clamp(42px,6vw,68px);line-height:1.04}.region-hero p:not(.seo-eyebrow){max-width:720px;color:#d3e2f2;font-size:17px;line-height:1.75}.region-stat{display:flex;align-items:center;gap:13px;margin-top:25px}.region-stat strong{font-size:35px;color:#44e8ed}.region-stat span{max-width:180px;color:#c7d8ea;font-size:12px}.region-map-mark{display:grid;place-items:center;aspect-ratio:1;border:1px solid rgba(255,255,255,.2);border-radius:38% 62% 55% 45%;background:linear-gradient(145deg,rgba(68,232,237,.2),rgba(255,255,255,.05));box-shadow:inset 0 0 70px rgba(68,232,237,.1),0 25px 70px rgba(0,0,0,.2)}.region-map-mark span{font-size:76px;font-weight:950;color:#50edf0}.region-map-mark small{margin-top:-35%;color:#d9e9f3;font-weight:800;text-transform:uppercase;letter-spacing:.16em}.region-services{padding-block:76px;text-align:center}.region-services h2,.region-links h2{margin:5px 0 14px;color:#071c3d;font-size:clamp(30px,4vw,44px)}.region-service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:34px;text-align:left}.region-service-grid article{display:flex;flex-direction:column;align-items:flex-start;padding:28px;border:1px solid #dae5ee;border-radius:20px;background:#fff;box-shadow:0 16px 45px rgba(7,28,61,.08)}.region-service-icon{display:grid;place-items:center;width:58px;height:58px;border-radius:17px;background:#eaf8fa;font-size:29px}.region-service-grid h3{margin:18px 0 8px;color:#09244b;font-size:20px}.region-service-grid p{color:#60728a;font-size:13px;line-height:1.6}.region-service-grid a{margin-top:auto;padding-top:18px;color:#008fa8;font-weight:850}.region-local-copy{padding:68px 0;background:#f3f7fb}.region-local-copy>.network-shell{display:grid;grid-template-columns:1.4fr .6fr;gap:55px;align-items:center}.region-local-copy h2{margin:6px 0 18px;color:#071c3d;font-size:36px}.region-local-copy p{color:#51667e;line-height:1.75}.region-local-copy aside{padding:28px;border-radius:20px;background:#082652;color:#fff;box-shadow:0 18px 45px rgba(8,38,82,.18)}.region-local-copy aside strong{font-size:20px}.region-local-copy aside p{color:#d7e4f1}.region-local-copy aside span{color:#52e9ed;font-size:11px;font-weight:750}.region-links{padding-block:72px;text-align:center}
@media(max-width:800px){.region-hero-grid,.region-local-copy>.network-shell{grid-template-columns:1fr}.region-map-mark{display:none}.region-service-grid{grid-template-columns:1fr}.region-hero{padding:58px 0}.region-services,.region-links{padding-block:52px}}

/* Rich regional content and dynamic FAQ. */
.region-story{display:grid;grid-template-columns:1.08fr .92fr;gap:58px;align-items:center;padding-block:76px}.region-story-media{position:relative;min-height:440px;overflow:hidden;border-radius:26px;box-shadow:0 24px 65px rgba(7,28,61,.16)}.region-story-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(4,22,52,.8))}.region-story-media img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover}.region-story-media>div{position:absolute;z-index:1;left:28px;bottom:25px;color:#fff}.region-story-media span,.region-story-media strong{display:block}.region-story-media span{color:#5af0f1;font-size:11px;font-weight:900;letter-spacing:.14em;text-transform:uppercase}.region-story-media strong{margin-top:4px;font-size:31px}.region-story-copy h2,.region-faq h2{margin:6px 0 16px;color:#071c3d;font-size:clamp(30px,4vw,42px);line-height:1.12}.region-story-copy>p:not(.seo-eyebrow){color:#566b82;line-height:1.75}.region-story-copy ul{display:grid;gap:12px;margin:24px 0 0;padding:0;list-style:none}.region-story-copy li{display:flex;align-items:center;gap:15px;padding:13px;border:1px solid #e0e8ef;border-radius:14px;background:#fff}.region-story-copy li>span{display:grid;place-items:center;width:42px;height:42px;flex:0 0 auto;border-radius:12px;background:#e8f9fb;color:#008da5;font-weight:900}.region-story-copy li strong,.region-story-copy li small{display:block}.region-story-copy li strong{color:#0b2850}.region-story-copy li small{margin-top:3px;color:#6b7c90}.region-faq{padding:78px 0;background:linear-gradient(145deg,#f0f6fa,#fff)}.region-faq>.network-shell{display:grid;grid-template-columns:.65fr 1.35fr;gap:65px;align-items:start}.region-faq-heading{position:sticky;top:110px}.region-faq-heading>p:not(.seo-eyebrow){color:#60738a;line-height:1.65}.region-faq-list{display:grid;gap:12px}.region-faq-list details{border:1px solid #dce6ed;border-radius:16px;background:#fff;box-shadow:0 8px 24px rgba(7,28,61,.04)}.region-faq-list summary{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 22px;color:#0b2850;font-weight:850;cursor:pointer;list-style:none}.region-faq-list summary::-webkit-details-marker{display:none}.region-faq-list summary span{color:#00a7be;font-size:22px;transition:.2s}.region-faq-list details[open] summary span{transform:rotate(45deg)}.region-faq-list details p{margin:0;padding:0 22px 21px;color:#5b6f86;font-size:14px;line-height:1.7}
@media(max-width:800px){.region-story,.region-faq>.network-shell{grid-template-columns:1fr}.region-story,.region-faq{padding-block:52px}.region-story-media{min-height:330px}.region-faq-heading{position:static}}
@media(max-width:520px){.region-story-media{min-height:260px;border-radius:18px}.region-story-media>div{left:20px;bottom:18px}.region-story-media strong{font-size:25px}.region-faq-list summary{padding:17px;font-size:14px}.region-faq-list details p{padding:0 17px 18px}.region-local-copy aside{padding:22px}}
.region-arabic-name{display:block;margin-top:10px;color:#55edf0;font-family:Tahoma,Arial,sans-serif;font-size:.48em;font-weight:700;letter-spacing:0}
.seo-card-icon { display:grid; place-items:center; width:72px; height:72px; border-radius:50%; background:#e8f7fa; font-size:34px; margin-bottom:18px; }
.seo-feature { display:grid; grid-template-columns:1.35fr .65fr; align-items:center; gap:50px; padding-block:72px; }
.seo-feature.reverse { direction:rtl; }
.seo-feature.reverse > * { direction:ltr; }
.seo-feature p, .seo-feature li { color:#53647a; line-height:1.7; }
.seo-feature ul { padding-left:20px; margin-bottom:30px; }
.seo-feature-number { display:grid; place-items:center; min-height:240px; border-radius:28px; background:linear-gradient(135deg,#071c3d,#009cb9); color:#fff; font-size:clamp(52px,8vw,92px); font-weight:900; box-shadow:0 22px 60px rgba(7,28,61,.2); }
.seo-numbers { padding:72px 0; color:#fff; text-align:center; background:linear-gradient(135deg,#041b40,#073b69); }
.seo-numbers h2 { color:#fff; }
.seo-numbers .seo-grid-3 article { background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.15); }
.seo-numbers strong { display:block; color:#38d4e6; font-size:44px; }
.seo-numbers span { color:#fff; }
.seo-faq { max-width:900px; margin:34px auto 0; text-align:left; }
.seo-faq details { background:#fff; border:1px solid #dfe8f1; border-radius:14px; padding:18px 22px; margin:12px 0; }
.seo-faq summary { cursor:pointer; color:#071c3d; font-weight:800; }
.seo-faq p { color:#53647a; line-height:1.65; }

@media (max-width: 900px) {
  .seo-strip-grid, .seo-grid-3, .seo-grid-4 { grid-template-columns:repeat(2,1fr); }
  .seo-city-grid { grid-template-columns:repeat(3,1fr); }
  .region-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .seo-feature, .seo-feature.reverse { grid-template-columns:1fr; direction:ltr; }
}
@media (max-width: 600px) {
  .seo-section, .seo-feature, .seo-numbers { padding-block:48px; }
  .seo-strip-grid, .seo-grid-3, .seo-grid-4 { grid-template-columns:1fr; }
  .seo-city-grid { grid-template-columns:repeat(2,1fr); }
  .region-card-grid { grid-template-columns:1fr; gap:14px; }
  .region-card { min-height:230px; }
  .seo-feature-number { min-height:160px; }
}

/* Premium interactive redesign ------------------------------------------ */
html { scroll-behavior:smooth; }
.skip-link { position:fixed; left:16px; top:-60px; z-index:999; padding:12px 18px; border-radius:10px; background:#fff; color:#071c3d; font-weight:800; }
.skip-link:focus { top:16px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.network-header { position:sticky; top:0; z-index:50; transition:box-shadow .25s,background .25s; }
.network-header.is-scrolled { box-shadow:0 14px 40px rgba(0,16,44,.18); background:rgba(1,18,46,.94); backdrop-filter:blur(16px); }
.mobile-menu-toggle { display:none; border:0; background:transparent; padding:8px; }
.mobile-menu-toggle > span:not(.sr-only) { display:block; width:24px; height:2px; margin:5px; border-radius:2px; background:#fff; }
.network-hero { position:relative; min-height:650px; }
.network-hero::before { content:""; position:absolute; width:460px; height:460px; left:-260px; top:30px; border-radius:50%; background:rgba(0,188,212,.08); filter:blur(4px); pointer-events:none; }
.network-hero h1 span { color:#009cb9; position:relative; }
.pulse-dot { display:inline-block; width:8px; height:8px; margin-right:6px; border-radius:50%; background:#16c79a; box-shadow:0 0 0 7px rgba(22,199,154,.12); animation:pulse 2s infinite; }
@keyframes pulse { 50% { box-shadow:0 0 0 12px rgba(22,199,154,0); } }
.hero-mini-proof { display:flex; flex-wrap:wrap; gap:18px; margin-top:24px; color:#4b6179; font-size:13px; font-weight:750; }
.network-visual { position:relative; isolation:isolate; }
.network-visual::before { content:""; position:absolute; inset:9% 3% 5%; z-index:-1; border-radius:45% 55% 46% 54%; background:linear-gradient(145deg,#e7faff,#f1f5ff); transform:rotate(-5deg); }
.hero-orbit { position:absolute; z-index:3; display:flex; align-items:center; gap:8px; padding:10px 14px; border:1px solid rgba(255,255,255,.8); border-radius:14px; background:rgba(255,255,255,.88); box-shadow:0 15px 35px rgba(7,28,61,.14); backdrop-filter:blur(10px); font-size:20px; animation:float 5s ease-in-out infinite; }
.hero-orbit small { color:#173457; font-size:12px; font-weight:800; }
.orbit-one { left:0; top:20%; }.orbit-two { right:1%; top:11%; animation-delay:-1.5s; }.orbit-three { right:2%; bottom:15%; animation-delay:-3s; }
@keyframes float { 50% { transform:translateY(-9px); } }
.section-heading-row { display:flex; align-items:flex-end; justify-content:space-between; gap:30px; text-align:left; }
.section-heading-row .seo-lead { margin:0; }
.carousel-controls { display:flex; gap:10px; padding-bottom:8px; }
.carousel-controls button { width:48px; height:48px; border:1px solid #d6e1eb; border-radius:50%; background:#fff; color:#071c3d; font-size:20px; cursor:pointer; transition:.2s; }
.carousel-controls button:hover { color:#fff; border-color:#009cb9; background:#009cb9; transform:translateY(-2px); }
.network-platforms { overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; padding:12px 4px 28px; }
.network-platforms::-webkit-scrollbar { display:none; }
.network-platform-card { position:relative; min-width:calc((100% - 52px)/3); align-items:stretch; text-align:left; scroll-snap-align:start; overflow:hidden; }
.network-platform-card::before { content:""; position:absolute; left:0; top:0; width:100%; height:5px; background:#009cb9; }
.network-platform-card.accent-navy::before { background:#071c3d; }.network-platform-card.accent-red::before { background:#e62a32; }
.card-topline { display:flex; justify-content:space-between; align-items:flex-start; }
.card-index { color:#dbe3ec; font-size:46px; line-height:1; font-weight:900; }
.network-platform-card .platform-btn { align-self:flex-start; }
.network-platform-card small { margin-top:auto; padding-top:18px; border-top:1px dashed #dbe4ed; color:#54708d; }
.carousel-dots { display:flex; justify-content:center; gap:7px; }
.carousel-dots span { width:8px; height:8px; border-radius:99px; background:#cad6e2; transition:.25s; }.carousel-dots span.active { width:28px; background:#009cb9; }
.service-tabs { max-width:1000px; margin:38px auto 0; }
.tab-list { display:inline-flex; gap:6px; padding:6px; border:1px solid #dfe8f1; border-radius:16px; background:#fff; box-shadow:0 10px 35px rgba(7,28,61,.06); }
.tab-list button { border:0; border-radius:11px; padding:13px 22px; background:transparent; color:#52677e; font-weight:800; cursor:pointer; }
.tab-list button[aria-selected="true"] { background:#071c3d; color:#fff; box-shadow:0 8px 20px rgba(7,28,61,.2); }
.tab-panels { margin-top:22px; }
.tab-panels article { display:grid; grid-template-columns:1fr auto; align-items:center; gap:35px; min-height:270px; padding:42px; border-radius:24px; background:linear-gradient(135deg,#fff,#f8fbfe); border:1px solid #e1eaf2; box-shadow:0 20px 55px rgba(7,28,61,.09); text-align:left; }
.tab-panels article[hidden] { display:none; }
.tab-panels h3 { margin:8px 0 10px; color:#071c3d; font-size:28px; }.tab-panels p { color:#52677e; line-height:1.65; }
.tab-panels article > a { padding:14px 20px; border-radius:12px; background:#009cb9; color:#fff; font-weight:850; white-space:nowrap; }
.tab-kicker { color:#009cb9; font-size:12px; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
.tab-panels .seo-tags { justify-content:flex-start; margin-top:18px; }
.bento-grid { display:grid; grid-template-columns:1.2fr .8fr .8fr; grid-template-rows:auto auto; gap:18px; margin-top:38px; text-align:left; }
.bento-grid article { position:relative; min-height:190px; padding:30px; overflow:hidden; border:1px solid #e1e9f1; border-radius:24px; background:#f7fafc; }
.bento-grid article::after { content:""; position:absolute; width:140px; height:140px; right:-55px; bottom:-65px; border-radius:50%; background:rgba(0,156,185,.1); }
.bento-grid .bento-large { grid-row:span 2; min-height:398px; color:#fff; background:linear-gradient(145deg,#071c3d,#075a75); }
.bento-grid .bento-large h3,.bento-grid .bento-large p { color:#fff; }
.bento-grid .bento-wide { grid-column:span 2; }
.bento-grid span { color:#009cb9; font-size:12px; font-weight:900; }.bento-grid h3 { color:#071c3d; font-size:24px; }.bento-grid p { color:#52677e; line-height:1.65; }
.seo-faq details { transition:border-color .2s,box-shadow .2s; }.seo-faq details[open] { border-color:#74cfdb; box-shadow:0 12px 32px rgba(7,28,61,.08); }.seo-faq summary { display:flex; justify-content:space-between; list-style:none; }.seo-faq summary::after { content:"+"; color:#009cb9; font-size:22px; }.seo-faq details[open] summary::after { content:"−"; }

@media (max-width:900px) {
  .network-platform-card { min-width:calc((100% - 24px)/2); }
  .bento-grid { grid-template-columns:1fr 1fr; }.bento-grid .bento-large { grid-row:auto; min-height:220px; }.bento-grid .bento-wide { grid-column:span 2; }
  .hero-orbit { display:none; }
}
@media (max-width:768px) {
  .mobile-menu-toggle { display:block; margin-left:auto; }
  .network-links { display:none; position:absolute; left:16px; right:16px; top:76px; padding:18px; border-radius:16px; background:#071c3d; box-shadow:0 18px 40px rgba(0,0,0,.25); flex-direction:column; align-items:stretch; }
  .network-links.is-open { display:flex; }.network-links a { padding:10px; }
  .network-hero { min-height:auto; }.hero-mini-proof { justify-content:center; }
  .section-heading-row { align-items:flex-start; }.carousel-controls { display:none; }
  .network-platform-card { min-width:88%; }
  .tab-list { display:grid; grid-template-columns:repeat(2,1fr); width:100%; }.tab-list button { padding:12px 6px; font-size:12px; }
  .tab-panels article { grid-template-columns:1fr; padding:26px; }.tab-panels article > a { justify-self:start; }
  .bento-grid { grid-template-columns:1fr; }.bento-grid .bento-wide { grid-column:auto; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; scroll-behavior:auto!important; } }

/* Four network services: keep the 404 choices balanced on desktop and stacked on mobile. */
.error-services { grid-template-columns:repeat(4,1fr); }
@media (max-width:850px) { .error-services { grid-template-columns:1fr; } }