.about-language {
    display:block
}
.about-ar {
    display:none
}
.about-story-grid {
    display:grid;
    grid-template-columns:1fr .85fr;
    gap:70px;
    align-items:center
}
.about-beliefs {
    margin-top:76px;
    padding-top:58px;
    border-top:1px solid var(--line)
}
.belief-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:18px;
    margin:26px 0 52px
}
.belief-grid p {
    margin:0;
    padding:22px;
    background:var(--soft);
    border-top:3px solid var(--yellow);
    font-weight:700
}
.about-vision-label {
    margin-bottom:14px
}
.about-signoff {
    margin-top:34px;
    font-size:1.1rem
}
.about-signoff strong {
    font-family:Montserrat,Arial,sans-serif;
    font-size:1.45rem
}
.rtl .about-en {
    display:none
}
.rtl .about-ar {
    display:block
}
.rtl .about-story-grid {
    direction:rtl
}
.rtl .about-ar .about-beliefs {
    text-align:right
}
@media (max-width:760px) {
    .about-story-grid {
        grid-template-columns:1fr;
        gap:34px
    }
    .belief-grid {
        grid-template-columns:1fr 1fr;
        gap:12px
    }
    .about-beliefs {
        margin-top:52px;
        padding-top:42px
    }
}

:root {
    --blue:#006ea3;
    --blue2:#00567f;
    --navy:#062f4b;
    --yellow:#ffd21c;
    --ink:#0b3452;
    --muted:#61788a;
    --line:#dce8ef;
    --soft:#f6fafc
}
* {
    box-sizing:border-box
}
html {
    scroll-behavior:smooth
}
body {
    margin:0;
    font-family:Inter,Arial,sans-serif;
    color:var(--ink);
    line-height:1.6;
    font-size:16px
}
a {
    text-decoration:none;
    color:inherit
}
img {
    max-width:100%;
    display:block
}
.container {
    width:min(1180px,calc(100% - 40px));
    margin:auto
}
.site-header {
    position:sticky;
    top:0;
    z-index:99;
    background:#00638f;
    box-shadow:0 2px 16px #003a541a
}
.nav-wrap {
    min-height:96px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px
}
.brand {
    display:inline-flex;
    align-items:center;
    gap:12px;
    color:#fff;
    font-family:Montserrat,Arial,sans-serif;
    font-weight:800;
    font-size:1.2rem;
    letter-spacing:.02em;
    white-space:nowrap
}
.brand img {
    width:136px;
    height:88px;
    object-fit:contain;
    object-position:left center;
    flex-shrink:0
}
.brand-text {
    display:inline-block;
    line-height:1.1;
    font-size:clamp(1.3rem,1.6vw,2.35rem);
    font-weight:800;
    letter-spacing:.02em
}
.main-nav {
    display:flex;
    align-items:center;
    gap:28px;
    color:#fff;
    font-size:17px;
    font-weight:600
}
.main-nav>a:not(.btn) {
    opacity:.96
}
.lang-toggle {
    border:1px solid #ffffff33;
    background:#ffffff18;
    color:#fff;
    border-radius:22px;
    width:44px;
    height:36px;
    font-size:13px;
    font-weight:800;
    cursor:pointer
}
.btn {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:48px;
    padding:0 22px;
    border-radius:7px;
    font-size:14.5px;
    font-weight:800;
    transition:.2s
}
.btn:hover {
    transform:translateY(-2px)
}
.btn-yellow {
    background:var(--yellow);
    color:#17354b
}
.btn-outline {
    border:1px solid #fff9;
    color:#fff
}
.nav-cta {
    min-height:38px
}
.mobile-menu {
    display:none;
    border:0;
    background:none;
    cursor:pointer
}
.mobile-menu span {
    display:block;
    width:24px;
    height:2px;
    background:#fff;
    margin:5px
}
.hero {
    position:relative;
    min-height:600px;
    display:flex;
    align-items:center;
    overflow:hidden;
    background:#006a9d
}
.hero-image {
    position:absolute;
    inset:0;
    background:url('../assets/Server-Rooms.webp') center right/cover no-repeat
}
.hero-overlay {
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,#006a9df5 0%,#00689de7 38%,#005b8aad 65%,#003d5a20 100%)
}
.hero-content {
    position:relative;
    z-index:2;
    color:#fff;
    padding:80px 0;
    max-width:690px
}
.eyebrow {
    font-size:13px;
    font-weight:700;
    margin:0 0 12px
}
.eyebrow.dark {
    color:var(--blue2)
}
 .hero h1 {
    font-family:Montserrat,Arial,sans-serif;
    font-size:62px;
    line-height:1.03;
    letter-spacing:-1.3px;
    margin:0 0 22px
}
.hero h1 .accent {
    color:var(--yellow)
}
 .hero-copy {
    max-width:620px;
    font-size:17px;
    color:#ffffffec;
    margin:0 0 30px
}
.hero-actions {
    display:flex;
    gap:12px
}
.trust-strip {
    border-bottom:1px solid var(--line);
    background:#fff
}
.trust-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    padding:17px 0
}
.trust-item {
    display:flex;
    justify-content:center;
    align-items:center;
    gap:9px;
    border-right:1px solid var(--line);
    min-height:64px
}
.trust-item:last-child {
    border:0
}
 .trust-icon {
    font-size:32px;
    line-height:1;
    color:var(--blue2)
}
.trust-item strong,.trust-item span {
    display:block;
    font-size:12px;
    line-height:1.35
}
.trust-item span {
    color:var(--muted)
}
.section {
    padding:76px 0
}
.split {
    display:grid;
    grid-template-columns:1fr .85fr;
    gap:70px;
    align-items:center
}
.section-copy h2,.section-head h2 {
    font-family:Montserrat,Arial,sans-serif;
    font-size:34px;
    line-height:1.2;
    margin:0 0 16px;
    color:var(--navy)
}
.section-copy p {
    font-size:16px;
    color:var(--muted);
    margin:0 0 18px
}
.text-link {
    font-size:14px;
    color:var(--blue2);
    font-weight:800
}
.photo-frame {
    border-radius:8px;
    overflow:hidden;
    position:relative;
    box-shadow:0 12px 28px #083e5e14
}
.photo-frame:after {
    content:"";
    position:absolute;
    right:0;
    bottom:0;
    width:30%;
    height:8px;
    background:var(--yellow)
}
.photo-frame img {
    width:100%;
    aspect-ratio:1.4/1;
    object-fit:cover
}
.services-section {
    padding-top:5px
}
.section-head {
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:20px;
    margin-bottom:28px
}
.service-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:16px
}
.service-card,.detail-card {
    border:1px solid var(--line);
    border-radius:12px;
    padding:24px;
    background:#fff;
    box-shadow:0 4px 14px #0b4d6d0a;
    transition:.2s
}
.service-card:hover,.detail-card:hover {
    transform:translateY(-3px);
    box-shadow:0 12px 28px #083e5e14
}
.service-icon {
    width:52px;
    height:52px;
    border-radius:12px;
    background:linear-gradient(135deg,#edf7fc,#fff8cd);
    display:grid;
    place-items:center;
    color:var(--blue2);
    font-weight:900;
    font-size:27px;
    margin-bottom:16px
}
.service-card h3,.detail-card h2 {
    font-family:Montserrat,Arial,sans-serif;
    color:var(--navy);
    margin:0 0 9px;
    font-size:19px
}
 .service-card p,.detail-card p {
    color:var(--muted);
    font-size:14px;
    line-height:1.5;
    margin:0
}
.why-section {
    padding:62px 0;
    background:linear-gradient(135deg,#006e9f,#004c76);
    color:#fff;
    overflow:hidden
}
 .why-section h2 {
    font-family:Montserrat,Arial,sans-serif;
    font-size:34px;
    margin:0 0 28px
}
.why-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:22px
}
.why-item {
    text-align:center
}
 .why-icon {
    width:58px;
    height:58px;
    margin:0 auto 14px;
    border:1px solid #fff6;
    border-radius:10px;
    display:grid;
    place-items:center;
    color:var(--yellow)
}
 .why-item h3 {
    font-size:16px;
    margin:0 0 5px
}
 .why-item p {
    font-size:13px;
    color:#ffffffbd;
    margin:0
}
.approach-section {
    padding-top:68px;
    padding-bottom:68px
}
.process-grid {
    display:flex;
    align-items:center;
    gap:6px
}
.process-step {
    text-align:center;
    min-width:120px
}
 .process-circle {
    width:58px;
    height:58px;
    margin:auto;
    border:1px solid #c9dfea;
    border-radius:50%;
    display:grid;
    place-items:center;
    color:var(--blue2);
    box-shadow:0 5px 12px #0d4e6d0b
}
 .process-step span {
    font-size:12px;
    color:var(--muted)
}
 .process-step h3 {
    font-size:16px;
    margin:1px 0 4px
}
 .process-step p {
    font-size:12px;
    color:var(--muted);
    margin:0
}
.process-line {
    height:1px;
    flex:1;
    background:repeating-linear-gradient(90deg,#c8dce7 0 6px,transparent 6px 11px)
}
.cta-banner {
    padding:30px 0;
    background:linear-gradient(90deg,#006ea3,#005780);
    color:#fff
}
.cta-inner {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px
}
.cta-inner h2 {
    font-family:Montserrat,Arial,sans-serif;
    font-size:21px;
    margin:0 0 2px
}
.cta-inner p {
    font-size:12px;
    color:#ffffffbd;
    margin:0
}
.site-footer {
    background:#062f4b;
    color:#fff;
    padding-top:48px
}
.footer-grid {
    display:grid;
    grid-template-columns:1.7fr 1fr 1.2fr .8fr;
    gap:35px;
    padding-bottom:34px
}
 .footer-brand img {
    width:185px;
    height:60px;
    object-fit:contain;
    object-position:left center
}
 .footer-brand p {
    font-size:13px;
    color:#ffffffa6
}
 .site-footer h4 {
    font-size:14px;
    text-transform:uppercase;
    letter-spacing:.7px;
    margin:0 0 12px
}
 .site-footer a {
    display:block;
    color:#ffffffad;
    font-size:13px;
    margin:7px 0
}
.socials {
    display:flex;
    gap:8px
}
.socials a {
    width:30px;
    height:30px;
    border:1px solid #ffffff38;
    border-radius:50%;
    display:grid;
    place-items:center;
    margin:0
}
 .footer-bottom {
    border-top:1px solid #ffffff18;
    padding:16px 0 22px;
    display:flex;
    justify-content:space-between;
    color:#ffffff80;
    font-size:12px
}
.page-hero {
    padding:88px 0 82px;
    background:linear-gradient(135deg,#006ea3,#004b74);
    color:#fff
}
.page-hero h1 {
    font-family:Montserrat,Arial,sans-serif;
    font-size:48px;
    line-height:1.08;
    max-width:820px;
    margin:0 0 15px
}
.page-hero p:last-child {
    max-width:720px;
    color:#ffffffcf;
    margin:0
}
.service-detail-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
    max-width:1200px;
    margin:0 auto
}
.detail-card {
    padding:28px
}
.detail-card h2 {
    font-size:22px
}
.detail-card p {
    font-size:13px
}
.contact-grid {
    display:grid;
    grid-template-columns:.85fr 1.15fr;
    gap:70px
}
.contact-info h2 {
    font-family:Montserrat,Arial,sans-serif;
    font-size:34px;
    line-height:1.15;
    margin:0 0 18px
}
.contact-info>p {
    color:var(--muted);
    font-size:16px
}
.contact-list {
    display:grid;
    gap:15px;
    margin-top:28px
}
.contact-list div {
    border-bottom:1px solid var(--line);
    padding:13px 0
}
.contact-list strong,.contact-list span {
    display:block
}
.contact-list strong {
    font-size:12px;
    color:var(--blue2)
}
.contact-list span {
    font-size:14px
}
.contact-form {
    padding:28px;
    border:1px solid var(--line);
    border-radius:12px;
    box-shadow:0 12px 28px #083e5e10
}
.field-row {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px
}
.field {
    margin-bottom:16px
}
.field label {
    display:block;
    font-size:14px;
    font-weight:700;
    margin-bottom:7px
}
 .field input,.field textarea {
    width:100%;
    padding:14px;
    border:1px solid #cbdde8;
    border-radius:8px;
    font:inherit;
    font-size:15px;
    outline:none
}
.field input:focus,.field textarea:focus {
    border-color:var(--blue);
    box-shadow:0 0 0 3px #006ea31a
}
.form-note {
    color:var(--blue2);
    font-size:12px
}
.mobile-menu span {
    border-radius:2px
}
.hero-lead {
    font-family:Montserrat,Arial,sans-serif;
    font-size:22px;
    font-weight:700;
    margin:0 0 16px;
    max-width:640px
}
.approach-intro {
    color:var(--muted);
    font-size:15px;
    max-width:680px;
    margin:0 0 34px
}
.detail-card .category {
    font-size:12px;
    font-weight:800;
    color:var(--blue2);
    text-transform:uppercase;
    letter-spacing:.5px;
    margin:0 0 6px
}
.detail-card .subtitle {
    font-size:13px;
    color:var(--muted);
    margin:-4px 0 12px;
    font-weight:700
}
.detail-card .help-heading,.detail-card .result-heading {
    font-family:Montserrat,Arial,sans-serif;
    font-weight:800;
    font-size:15px;
    margin:16px 0 8px;
    color:var(--navy)
}
.detail-card ul {
    margin:0 0 8px;
    padding:0 0 0 20px;
    color:var(--muted);
    font-size:14px;
    line-height:1.8
}
body.rtl .detail-card ul {
    padding:0 20px 0 0
}
.detail-card .result-copy {
    color:var(--muted);
    font-size:14px;
    line-height:1.7;
    margin:0
}
body.rtl .brand img,body.rtl .footer-brand img {
    object-position:right center
}
body.rtl .hero-overlay {
    background:linear-gradient(270deg,#006a9df5 0%,#00689de7 38%,#005b8aad 65%,#003d5a20 100%)
}
body.rtl .text-link {
    direction:rtl
}
@media(max-width:980px) {
    .main-nav {
        gap:14px
    }
    .hero h1 {
        font-size:48px
    }
    .service-grid {
        grid-template-columns:repeat(2,1fr)
    }
    .why-grid {
        grid-template-columns:repeat(2,1fr)
    }
    .split {
        gap:40px
    }
    .footer-grid {
        grid-template-columns:repeat(2,1fr)
    }
    .contact-grid {
        grid-template-columns:1fr
    }
}
@media(max-width:760px) {
    .container {
        width:calc(100% - 28px)
    }
    .mobile-menu {
        display:block
    }
    .main-nav {
        display:none;
        position:absolute;
        left:14px;
        right:14px;
        top:96px;
        background:#063a5d;
        padding:17px;
        border-radius:12px;
        box-shadow:0 18px 40px #0003;
        flex-direction:column;
        align-items:stretch
    }
    .main-nav.open {
        display:flex
    }
    .lang-toggle {
        align-self:flex-start
    }
    .nav-cta {
        text-align:center
    }
    .hero {
        min-height:650px
    }
    .hero h1 {
        font-size:39px
    }
    .hero-copy {
        font-size:14px
    }
    .trust-grid {
        grid-template-columns:repeat(2,1fr)
    }
    .trust-item {
        border-bottom:1px solid var(--line)
    }
    .trust-item:nth-child(2n) {
        border-right:0
    }
    .split {
        grid-template-columns:1fr
    }
    .section {
        padding:58px 0
    }
    .section-head {
        align-items:start;
        flex-direction:column
    }
    .service-grid {
        grid-template-columns:1fr
    }
    .service-detail-grid {
        grid-template-columns:1fr
    }
    .process-grid {
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:22px
    }
    .process-line {
        display:none
    }
    .cta-inner {
        flex-direction:column;
        align-items:flex-start
    }
    .cta-inner .btn {
        width:100%
    }
    .footer-grid {
        grid-template-columns:1fr 1fr
    }
    .footer-bottom {
        flex-direction:column;
        gap:5px
    }
    .page-hero {
        padding:65px 0
    }
    .page-hero h1 {
        font-size:38px
    }
    .field-row {
        grid-template-columns:1fr
    }
}
@media(max-width:470px) {
    .brand img {
        width:136px;
        height:88px
    }
    .hero h1 {
        font-size:34px
    }
    .trust-grid {
        grid-template-columns:1fr
    }
    .trust-item {
        border-right:0
    }
    .trust-item:nth-child(3) {
        border-bottom:1px solid var(--line)
    }
    .why-grid,.footer-grid {
        grid-template-columns:1fr
    }
    .page-hero h1 {
        font-size:31px
    }
}


/* ==================== SHARED NEW PIECES ==================== */
.eyebrow.gold {
    color:var(--gold2);
    letter-spacing:1.6px;
    text-transform:uppercase
}

.eyebrow.navy {
    color:#2b5f86;
    letter-spacing:1.6px;
    text-transform:uppercase
}

.sec-lead {
    color:var(--muted);
    font-size:15px;
    max-width:640px;
    margin:0 0 26px
}

.narrow {
    max-width:900px;
    margin-inline:auto
}


/* ==================== ABOUT PAGE ==================== */
.about-body {
    max-width:820px
}

.about-body p {
    color:var(--muted);
    font-size:16px;
    margin:0 0 18px
}

.about-beliefs {
    margin-top:70px;
    padding-top:54px;
    border-top:1px solid var(--line)
}

.belief-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:16px;
    margin:24px 0 0
}

.belief-grid p {
    margin:0;
    padding:22px;
    background:var(--soft);
    border-top:3px solid var(--yellow);
    font-weight:700;
    font-size:14px;
    line-height:1.5;
    border-radius:0 0 8px 8px
}

.about-vision {
    margin-top:64px;
    padding:44px;
    border-radius:14px;
    background:linear-gradient(135deg,#006e9f,#004c76);
    color:#fff
}

.about-vision h2 {
    font-family:Montserrat,Arial,sans-serif;
    font-size:30px;
    margin:0 0 18px
}

.about-vision p {
    color:#ffffffd6;
    font-size:16px;
    margin:0 0 14px;
    max-width:760px
}

.about-signoff {
    margin-top:46px;
    text-align:center;
    padding-top:36px;
    border-top:1px solid var(--line)
}

.about-signoff strong {
    display:block;
    font-family:Montserrat,Arial,sans-serif;
    font-size:26px;
    color:var(--navy)
}

.about-signoff span {
    display:block;
    color:var(--blue2);
    font-weight:700;
    margin-top:6px
}


/* ==================== SHADOW COO — DARK / GOLD ==================== */
.sc {
    --gold:#c4952f;
    --gold2:#e2be6a;
    --ink0:#0a1725;
    --ink1:#0f2436;
    --ink2:#16324a;
    --cream:#f4efe4;
    background:var(--ink0);
    color:#fff
}

.sc .site-header {
    background:#0a1725;
    border-bottom:1px solid #ffffff14;
    box-shadow:none
}

.sc .btn-gold {
    background:linear-gradient(135deg,var(--gold2),var(--gold));
    color:#14202e;
    font-weight:800
}

.sc .lang-toggle {
    border-color:#ffffff2e
}

.sc .site-footer {
    background:#07111c;
    border-top:1px solid #ffffff12
}

.sc-hero {
    position:relative;
    padding:92px 0 78px;
    background:radial-gradient(1100px 520px at 78% 22%,#1d3a55 0%,#0f2436 42%,#0a1725 100%);
    overflow:hidden
}

.sc-hero:before {
    content:"";
    position:absolute;
    inset:0;
    background:radial-gradient(520px 320px at 80% 30%,#c4952f26,transparent 70%)
}

.sc-hero .container {
    position:relative;
    z-index:2
}

.sc-hero-grid {
    display:grid;
    grid-template-columns:1.05fr .95fr;
    gap:56px;
    align-items:center
}

.sc-hero h1 {
    font-family:Montserrat,Arial,sans-serif;
    font-size:44px;
    line-height:1.16;
    margin:10px 0 20px;
    letter-spacing:-.5px
}

.sc-hero p {
    color:#ffffffc7;
    font-size:16px;
    margin:0 0 16px;
    max-width:560px
}

.sc-hero-actions {
    display:flex;
    align-items:center;
    gap:18px;
    flex-wrap:wrap;
    margin-top:28px
}

.sc-hero-tag {
    color:var(--gold2);
    font-size:13px;
    font-weight:700;
    line-height:1.5
}

.sc-pills {
    display:flex;
    gap:26px;
    flex-wrap:wrap;
    margin-top:34px;
    padding-top:26px;
    border-top:1px solid #ffffff1a
}

.sc-pill {
    display:flex;
    align-items:center;
    gap:10px;
    font-size:13px;
    font-weight:700;
    color:#ffffffd4
}

.sc-pill i {
    font-style:normal;
    color:var(--gold2);
    font-size:20px
}

.sc-hero-visual {
    position:relative;
    min-height:340px;
    border-radius:16px;
    background:linear-gradient(160deg,#16324a,#0c1d2e);
    border:1px solid #ffffff14;
    display:grid;
    place-items:center;
    padding:30px;
    overflow:hidden
}

.sc-hero-visual:after {
    content:"";
    position:absolute;
    inset:0;
    background:radial-gradient(360px 240px at 50% 42%,#c4952f2e,transparent 72%)
}

.sc-ladder {
    position:relative;
    z-index:2;
    display:grid;
    gap:12px;
    width:100%;
    max-width:330px
}

.sc-rung {
    display:flex;
    align-items:center;
    gap:13px;
    padding:13px 17px;
    border-radius:10px;
    background:#ffffff0a;
    border:1px solid #ffffff17;
    font-size:13px;
    font-weight:700
}

.sc-rung i {
    font-style:normal;
    color:var(--gold2);
    font-size:18px
}

.sc-rung.top {
    background:linear-gradient(135deg,#c4952f38,#c4952f14);
    border-color:#c4952f5c;
    color:var(--gold2)
}


.sc-section {
    padding:74px 0;
    border-top:1px solid #ffffff10
}

.sc-section.cream {
    background:var(--cream);
    color:#132233;
    border-top:0
}

.sc-section h2 {
    font-family:Montserrat,Arial,sans-serif;
    font-size:32px;
    margin:8px 0 14px;
    line-height:1.22
}

.sc-section .lead {
    color:#ffffffab;
    font-size:15px;
    max-width:600px;
    margin:0
}

.sc-section.cream .lead {
    color:#4d6274
}

.sc-head-split {
    display:grid;
    grid-template-columns:1fr auto;
    gap:40px;
    align-items:end;
    margin-bottom:40px
}

.sc-callout {
    border-left:3px solid var(--gold);
    padding:16px 20px;
    background:#ffffff08;
    font-size:14px;
    color:#ffffffd1;
    line-height:1.7;
    border-radius:0 8px 8px 0;
    max-width:330px
}

.sc-section.cream .sc-callout {
    background:#fff;
    color:#44607a;
    border-color:var(--gold);
    box-shadow:0 4px 14px #0b243a0f
}

body.rtl .sc-callout {
    border-left:0;
    border-right:3px solid var(--gold);
    border-radius:8px 0 0 8px
}


/* radial diagram */
.radial {
    position:relative;
    width:100%;
    max-width:560px;
    margin:0 auto;
    aspect-ratio:1/1
}

.radial-core {
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    width:33%;
    aspect-ratio:1/1;
    border-radius:50%;
    display:grid;
    place-items:center;
    text-align:center;
    padding:12px;
    font-family:Montserrat,Arial,sans-serif;
    font-weight:800;
    font-size:13px;
    line-height:1.25;
    background:linear-gradient(145deg,#16324a,#0b1b2b);
    border:2px solid #c4952f6b;
    color:var(--gold2);
    box-shadow:0 0 0 12px #c4952f0f
}

.sc-section.cream .radial-core {
    background:linear-gradient(145deg,#15304a,#0d2135);
    color:var(--gold2)
}

.radial-node {
    position:absolute;
    transform:translate(-50%,-50%);
    width:27%;
    text-align:center
}

.radial-dot {
    width:44px;
    height:44px;
    margin:0 auto 7px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:#ffffff0d;
    border:1px solid #c4952f5c;
    color:var(--gold2);
    font-size:18px;
    font-style:normal
}

.sc-section.cream .radial-dot {
    background:#fff;
    border-color:#c4952f7a;
    box-shadow:0 4px 12px #0b243a14
}

.radial-node span {
    display:block;
    font-size:11.5px;
    line-height:1.35;
    color:#ffffffc4;
    font-weight:600
}

.sc-section.cream .radial-node span {
    color:#44607a
}

.radial-ring {
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    width:66%;
    aspect-ratio:1/1;
    border-radius:50%;
    border:1px dashed #c4952f3d
}


/* areas cards */
.sc-areas-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:16px;
    margin-top:38px
}

.sc-area {
    padding:24px;
    border-radius:12px;
    background:#ffffff08;
    border:1px solid #ffffff14;
    transition:.2s
}

.sc-area:hover {
    background:#ffffff0f;
    border-color:#c4952f52;
    transform:translateY(-3px)
}

.sc-area i {
    font-style:normal;
    display:grid;
    place-items:center;
    width:44px;
    height:44px;
    border-radius:10px;
    background:#c4952f1f;
    color:var(--gold2);
    font-size:19px;
    margin-bottom:14px
}

.sc-area h3 {
    font-family:Montserrat,Arial,sans-serif;
    font-size:16px;
    margin:0 0 8px;
    color:#fff;
    line-height:1.35
}

.sc-area p {
    font-size:13px;
    color:#ffffffa8;
    line-height:1.65;
    margin:0
}


/* hassan teaser */
.sc-hassan-grid {
    display:grid;
    grid-template-columns:.95fr 1.05fr;
    gap:56px;
    align-items:center
}

.sc-hassan-grid h2,.sc-section.cream h2 {
    color:#10283d
}

.sc-hassan-grid p {
    color:#4d6274;
    font-size:15px;
    line-height:1.75
}

.sc-hassan-grid .text-link {
    color:#9a7420
}


/* OHC */
.ohc-steps {
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
    margin:30px 0 40px
}

.ohc-step {
    flex:1;
    min-width:150px;
    text-align:center
}

.ohc-step .n {
    width:54px;
    height:54px;
    margin:0 auto 11px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:#ffffff0d;
    border:1px solid #c4952f5c;
    color:var(--gold2);
    font-size:19px;
    font-style:normal
}

.ohc-step b {
    display:block;
    font-size:11px;
    color:var(--gold2);
    margin-bottom:4px
}

.ohc-step span {
    font-size:13px;
    color:#ffffffc2;
    line-height:1.45
}

.ohc-arrow {
    color:#c4952f7a;
    font-size:16px
}

.ohc-cover {
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin:18px 0 0
}

.ohc-cover span {
    padding:9px 16px;
    border-radius:30px;
    background:#ffffff0a;
    border:1px solid #ffffff1c;
    font-size:12.5px;
    font-weight:700;
    color:#ffffffc9
}

.ohc-deliver {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:16px;
    margin-top:20px
}

.ohc-card {
    padding:22px;
    border-radius:12px;
    background:linear-gradient(150deg,#ffffff0f,#ffffff05);
    border:1px solid #ffffff17
}

.ohc-card i {
    font-style:normal;
    color:var(--gold2);
    font-size:22px;
    display:block;
    margin-bottom:10px
}

.ohc-card h4 {
    font-family:Montserrat,Arial,sans-serif;
    font-size:14.5px;
    margin:0 0 7px;
    color:#fff
}

.ohc-card p {
    font-size:12.5px;
    color:#ffffff9e;
    margin:0;
    line-height:1.6
}

.ohc-outcomes {
    margin-top:44px;
    padding-top:36px;
    border-top:1px solid #ffffff12
}

.flow-top {
    max-width:330px;
    margin:0 auto 10px;
    padding:13px;
    border-radius:9px;
    text-align:center;
    font-weight:800;
    font-size:13.5px;
    background:linear-gradient(135deg,#16324a,#0d2134);
    border:1px solid #c4952f52;
    color:var(--gold2)
}

.flow-split {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
    max-width:620px;
    margin:0 auto
}

.flow-split div {
    padding:15px 12px;
    border-radius:9px;
    text-align:center;
    font-size:13px;
    font-weight:700;
    border:1px solid
}

.flow-a {
    background:#2f8b5e1f;
    border-color:#3f9e6e6b;
    color:#7fd3a7
}

.flow-b {
    background:#c4952f1f;
    border-color:#c4952f6b;
    color:var(--gold2)
}

.flow-c {
    background:#a744441f;
    border-color:#b055556b;
    color:#e29a9a
}


/* role hierarchy */
.role-chart {
    display:grid;
    gap:11px;
    justify-items:center
}

.role-box {
    padding:12px 26px;
    border-radius:9px;
    font-weight:800;
    font-size:13.5px;
    text-align:center;
    min-width:220px
}

.role-top {
    background:#16324a;
    border:1px solid #ffffff24;
    color:#fff
}

.role-mid {
    background:linear-gradient(135deg,var(--gold2),var(--gold));
    color:#14202e
}

.role-bottom {
    background:#16324a;
    border:1px solid #c4952f52;
    color:var(--gold2);
    min-width:280px
}

.role-row {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:10px;
    width:100%
}

.role-row div {
    padding:14px 8px;
    border-radius:9px;
    background:#ffffff0a;
    border:1px solid #ffffff17;
    text-align:center;
    font-size:12.5px;
    font-weight:700;
    color:#ffffffc4
}

.role-row div i {
    display:block;
    font-style:normal;
    color:var(--gold2);
    font-size:17px;
    margin-bottom:6px
}

.role-conn {
    width:1px;
    height:16px;
    background:#c4952f6b
}


/* before / after */
.ba-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
    max-width:820px
}

.ba-col h4 {
    margin:0 0 12px;
    padding:10px;
    border-radius:8px;
    text-align:center;
    font-size:13px;
    font-family:Montserrat,Arial,sans-serif
}

.ba-before h4 {
    background:#16324a;
    color:#ffffffd1;
    border:1px solid #ffffff1f
}

.ba-after h4 {
    background:linear-gradient(135deg,var(--gold2),var(--gold));
    color:#14202e
}

.ba-col ul {
    list-style:none;
    margin:0;
    padding:0;
    display:grid;
    gap:8px
}

.ba-col li {
    padding:11px 14px;
    border-radius:8px;
    font-size:13px;
    background:#ffffff08;
    border:1px solid #ffffff12;
    color:#ffffffb8;
    display:flex;
    gap:9px;
    align-items:flex-start;
    line-height:1.5
}

.ba-col li:before {
    content:"×";
    color:#d98a8a;
    font-weight:800;
    flex-shrink:0
}

.ba-after li:before {
    content:"✓";
    color:#7fd3a7
}

.ba-side {
    align-self:center
}

.ba-wrap {
    display:grid;
    grid-template-columns:1fr auto;
    gap:44px;
    align-items:center
}


.sc-final {
    padding:56px 0;
    background:linear-gradient(120deg,#16324a,#0a1725);
    border-top:1px solid #c4952f3d
}

.sc-final-inner {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:26px;
    flex-wrap:wrap
}

.sc-final h2 {
    font-family:Montserrat,Arial,sans-serif;
    font-size:25px;
    margin:0 0 5px
}

.sc-final p {
    margin:0;
    color:var(--gold2);
    font-size:14px;
    font-weight:700
}


/* ==================== AL HASSAN MODEL — LIGHT / NAVY ==================== */
.hm {
    --gold:#c4952f;
    --gold2:#dfba6d;
    --sand:#f7f3ea
}

.hm-hero {
    padding:86px 0 74px;
    background:linear-gradient(120deg,#0d2033,#15324b 55%,#1b3c58);
    color:#fff;
    position:relative;
    overflow:hidden
}

.hm-hero:before {
    content:"";
    position:absolute;
    inset:0;
    background:radial-gradient(560px 340px at 82% 34%,#c4952f26,transparent 70%)
}

.hm-hero .container {
    position:relative;
    z-index:2
}

.hm-hero h1 {
    font-family:Montserrat,Arial,sans-serif;
    font-size:50px;
    margin:12px 0 8px;
    letter-spacing:-.8px
}

.hm-hero h2 {
    font-family:Montserrat,Arial,sans-serif;
    font-size:21px;
    font-weight:600;
    color:#ffffffd6;
    margin:0 0 22px
}

.hm-hero p {
    color:#ffffffbd;
    font-size:15.5px;
    max-width:640px;
    margin:0 0 14px;
    line-height:1.75
}

.hm-badges {
    display:flex;
    gap:34px;
    flex-wrap:wrap;
    margin-top:34px;
    padding-top:28px;
    border-top:1px solid #ffffff1c
}

.hm-badge i {
    font-style:normal;
    display:block;
    color:#dfba6d;
    font-size:22px;
    margin-bottom:8px
}

.hm-badge b {
    display:block;
    font-size:13.5px;
    font-family:Montserrat,Arial,sans-serif
}

.hm-badge span {
    display:block;
    font-size:12px;
    color:#ffffff96;
    margin-top:2px
}

.hm-herotag {
    position:absolute;
    right:38px;
    bottom:38px;
    color:#dfba6d;
    font-size:13px;
    font-weight:700;
    letter-spacing:2px;
    text-transform:uppercase;
    z-index:2
}

body.rtl .hm-herotag {
    right:auto;
    left:38px
}


.hm-section {
    padding:72px 0
}

.hm-section.sand {
    background:#f7f3ea
}

.hm-section h2 {
    font-family:Montserrat,Arial,sans-serif;
    font-size:31px;
    color:#10283d;
    margin:8px 0 12px;
    line-height:1.25
}

.hm-section .lead {
    color:#5a7085;
    font-size:15px;
    max-width:640px;
    margin:0 0 34px
}

.hm-center {
    text-align:center
}

.hm-center .lead {
    margin-inline:auto
}

.hm-phil-grid {
    display:grid;
    grid-template-columns:1fr 1.05fr;
    gap:52px;
    align-items:start
}

.hm-quote {
    padding:34px;
    background:#f7f3ea;
    border-radius:12px;
    position:relative
}

.hm-quote:before {
    content:"❝";
    position:absolute;
    top:14px;
    right:22px;
    font-size:40px;
    color:#c4952f52;
    line-height:1
}

body.rtl .hm-quote:before {
    right:auto;
    left:22px
}

.hm-quote p {
    font-family:Montserrat,Arial,sans-serif;
    font-size:18px;
    line-height:1.6;
    color:#1d3b55;
    margin:0 0 14px
}

.hm-quote cite {
    font-style:normal;
    font-size:13px;
    color:#7a8ea0
}

.hm-qlist {
    list-style:none;
    padding:0;
    margin:20px 0 0;
    display:grid;
    gap:9px
}

.hm-qlist li {
    padding:12px 16px;
    background:#fff;
    border:1px solid #e4ecf2;
    border-radius:8px;
    font-size:13.5px;
    color:#3d576e;
    display:flex;
    gap:10px;
    line-height:1.5
}

.hm-qlist li:before {
    content:"→";
    color:#c4952f;
    font-weight:800;
    flex-shrink:0
}

body.rtl .hm-qlist li:before {
    content:"←"
}

.hm-diff {
    list-style:none;
    padding:0;
    margin:0;
    display:grid;
    gap:15px
}

.hm-diff li {
    display:flex;
    gap:14px;
    align-items:flex-start;
    font-size:14px;
    color:#3d576e;
    line-height:1.55
}

.hm-diff i {
    font-style:normal;
    color:#10283d;
    font-size:19px;
    flex-shrink:0
}


.hm-comp-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:18px;
    margin-top:36px
}

.hm-comp {
    padding:26px;
    background:#fff;
    border:1px solid #e6edf3;
    border-radius:12px;
    transition:.2s
}

.hm-comp:hover {
    box-shadow:0 14px 32px #0b243a12;
    transform:translateY(-3px)
}

.hm-comp b {
    display:inline-block;
    font-size:12px;
    color:#a07d28;
    background:#f4ecd8;
    padding:4px 9px;
    border-radius:5px;
    margin-bottom:12px;
    font-family:Montserrat,Arial,sans-serif
}

.hm-comp h3 {
    font-family:Montserrat,Arial,sans-serif;
    font-size:16.5px;
    color:#10283d;
    margin:0 0 9px;
    line-height:1.35
}

.hm-comp p {
    font-size:13.5px;
    color:#5a7085;
    line-height:1.7;
    margin:0
}


.hm-steps {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
    margin-top:34px
}

.hm-step {
    text-align:center
}

.hm-step .n {
    width:54px;
    height:54px;
    margin:0 auto 12px;
    border-radius:50%;
    background:#fff;
    border:1px solid #d9e3ec;
    display:grid;
    place-items:center;
    color:#10283d;
    font-size:19px;
    font-style:normal;
    box-shadow:0 5px 14px #0b243a0d
}

.hm-step b {
    display:block;
    font-size:11px;
    color:#a07d28;
    margin-bottom:5px
}

.hm-step h4 {
    font-family:Montserrat,Arial,sans-serif;
    font-size:14.5px;
    color:#10283d;
    margin:0 0 6px;
    line-height:1.35
}

.hm-step p {
    font-size:12.5px;
    color:#65798c;
    margin:0;
    line-height:1.6
}


.hm-chain {
    display:grid;
    gap:0;
    max-width:340px;
    margin:0 auto;
    justify-items:center
}

.hm-chain div {
    width:100%;
    padding:12px;
    background:#fff;
    border:1px solid #e0e9f0;
    border-radius:8px;
    text-align:center;
    font-size:13.5px;
    font-weight:700;
    color:#23425c
}

.hm-chain i {
    font-style:normal;
    color:#c4952f;
    font-size:15px;
    line-height:1.6
}

.hm-ex-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:52px;
    align-items:center
}


.hm-en-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:16px;
    margin-top:34px
}

.hm-en {
    padding:22px;
    background:#fff;
    border-radius:11px;
    border-top:3px solid #c4952f
}

.hm-en h4 {
    font-family:Montserrat,Arial,sans-serif;
    font-size:15px;
    color:#10283d;
    margin:0 0 7px
}

.hm-en p {
    font-size:12.5px;
    color:#65798c;
    margin:0;
    line-height:1.6
}


.hm-seq {
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    align-items:center;
    justify-content:center;
    margin-top:30px
}

.hm-seq span {
    padding:11px 18px;
    background:#12293f;
    color:#fff;
    border-radius:30px;
    font-size:12.5px;
    font-weight:700
}

.hm-seq i {
    font-style:normal;
    color:#c4952f;
    font-weight:800
}


.hm-result {
    padding:74px 0;
    background:linear-gradient(120deg,#0d2033,#1b3c58);
    color:#fff
}

.hm-result-grid {
    display:grid;
    grid-template-columns:.9fr 1.1fr;
    gap:56px;
    align-items:center
}

.hm-result h2 {
    font-family:Montserrat,Arial,sans-serif;
    font-size:31px;
    margin:8px 0 14px
}

.hm-result p {
    color:#ffffffc4;
    font-size:15.5px;
    line-height:1.75;
    margin:0
}

.hm-res-grid {
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:14px
}

.hm-res {
    padding:20px;
    background:#ffffff0d;
    border:1px solid #ffffff1c;
    border-radius:11px;
    text-align:center
}

.hm-res i {
    font-style:normal;
    display:block;
    color:#dfba6d;
    font-size:21px;
    margin-bottom:9px
}

.hm-res span {
    font-size:13px;
    color:#ffffffd1;
    font-weight:600;
    line-height:1.5
}

.hm-result-cta {
    margin-top:30px;
    display:flex;
    align-items:center;
    gap:20px;
    flex-wrap:wrap
}

.hm-result-cta span {
    color:#dfba6d;
    font-size:13.5px;
    font-weight:700
}


/* ==================== CONTACT — BLUE ==================== */
.ct {
    --c1:#0b3f77;
    --c2:#0a5596;
    --c3:#073161;
    --gold3:#f5c518
}

.ct .site-header {
    background:#073161
}

.ct-page {
    background:linear-gradient(135deg,#0a3a6d 0%,#0b4d8c 48%,#083260 100%);
    color:#fff;
    padding:74px 0 82px;
    position:relative;
    overflow:hidden
}

.ct-page:before {
    content:"";
    position:absolute;
    inset:0;
    background:repeating-linear-gradient(90deg,#ffffff08 0 1px,transparent 1px 46px),repeating-linear-gradient(0deg,#ffffff08 0 1px,transparent 1px 46px)
}

.ct-page .container {
    position:relative;
    z-index:2
}

.ct-top {
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:24px;
    margin-bottom:34px;
    flex-wrap:wrap
}

.ct-top .eyebrow {
    color:var(--gold3);
    font-size:13px;
    font-weight:800;
    margin:0
}

.ct-grid {
    display:grid;
    grid-template-columns:1fr 1.1fr;
    gap:52px;
    align-items:start
}

.ct-intro h1 {
    font-family:Montserrat,Arial,sans-serif;
    font-size:46px;
    line-height:1.12;
    margin:0 0 20px;
    letter-spacing:-1px
}

.ct-intro h1 .accent {
    color:var(--gold3)
}

.ct-intro>p {
    color:#ffffffd1;
    font-size:15.5px;
    line-height:1.8;
    margin:0 0 30px;
    max-width:520px
}

.ct-values {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:16px;
    padding-top:26px;
    border-top:1px solid #ffffff1f
}

.ct-value {
    text-align:center
}

.ct-value i {
    font-style:normal;
    display:block;
    color:var(--gold3);
    font-size:24px;
    margin-bottom:9px
}

.ct-value span {
    font-size:12px;
    color:#ffffffc4;
    font-weight:600;
    line-height:1.4;
    display:block
}

.ct-note {
    margin-top:34px;
    color:var(--gold3);
    font-family:Montserrat,Arial,sans-serif;
    font-size:19px;
    font-weight:700;
    line-height:1.4
}

.ct-note:after {
    content:"";
    display:block;
    width:70px;
    height:3px;
    background:var(--gold3);
    margin-top:12px;
    border-radius:2px
}


.ct-card {
    background:#ffffff0f;
    border:1px solid #ffffff21;
    border-radius:16px;
    padding:32px;
    backdrop-filter:blur(6px)
}

.ct-card h2 {
    font-family:Montserrat,Arial,sans-serif;
    font-size:27px;
    margin:0 0 10px
}

.ct-card>p {
    color:#ffffffb8;
    font-size:14px;
    margin:0 0 24px;
    line-height:1.7
}

.ct-fields {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:13px
}

.ct-field {
    position:relative;
    display:flex;
    align-items:center;
    gap:11px;
    background:#ffffff0f;
    border:1px solid #ffffff26;
    border-radius:10px;
    padding:0 15px;
    transition:.2s
}

.ct-field:focus-within {
    border-color:var(--gold3);
    background:#ffffff17
}

.ct-field i {
    font-style:normal;
    color:#ffffff8c;
    font-size:17px;
    flex-shrink:0
}

.ct-field input {
    flex:1;
    background:none;
    border:0;
    outline:none;
    color:#fff;
    font:inherit;
    font-size:14px;
    padding:14px 0
}

.ct-field input::placeholder {
    color:#ffffff8c
}

.ct-req {
    color:var(--gold3);
    font-weight:800
}

.ct-topic-label {
    font-size:14px;
    font-weight:700;
    margin:24px 0 12px
}

.ct-topics {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:11px
}

.ct-topic {
    display:flex;
    align-items:center;
    gap:11px;
    background:#ffffff0d;
    border:1px solid #ffffff21;
    border-radius:10px;
    padding:13px 15px;
    cursor:pointer;
    transition:.2s;
    font-size:13px
}

.ct-topic:hover {
    background:#ffffff17;
    border-color:#ffffff3d
}

.ct-topic input {
    accent-color:var(--gold3);
    width:15px;
    height:15px;
    flex-shrink:0;
    margin:0
}

.ct-topic i {
    font-style:normal;
    color:#ffffff9e;
    font-size:16px;
    flex-shrink:0
}

.ct-topic span {
    flex:1;
    line-height:1.35
}

.ct-topic:has(input:checked) {
    background:#f5c5181f;
    border-color:#f5c5187a
}

.ct-textarea {
    display:flex;
    gap:11px;
    background:#ffffff0d;
    border:1px solid #ffffff21;
    border-radius:10px;
    padding:15px;
    margin-top:13px;
    transition:.2s
}

.ct-textarea:focus-within {
    border-color:var(--gold3);
    background:#ffffff17
}

.ct-textarea i {
    font-style:normal;
    color:#ffffff8c;
    font-size:16px
}

.ct-textarea textarea {
    flex:1;
    background:none;
    border:0;
    outline:none;
    color:#fff;
    font:inherit;
    font-size:14px;
    resize:vertical;
    min-height:80px
}

.ct-textarea textarea::placeholder {
    color:#ffffff8c
}

.ct-submit {
    width:100%;
    margin-top:20px;
    background:var(--gold3);
    color:#0b3160;
    border:0;
    border-radius:11px;
    padding:17px;
    font:inherit;
    font-weight:800;
    font-size:15.5px;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    transition:.2s
}

.ct-submit:hover {
    transform:translateY(-2px);
    box-shadow:0 10px 24px #f5c51838
}

.ct-formnote {
    margin:14px 0 0;
    font-size:13px;
    color:var(--gold3);
    text-align:center;
    min-height:18px
}


.ct-bar {
    background:#062a52;
    border-top:1px solid #ffffff17;
    padding:26px 0
}

.ct-bar-inner {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:26px;
    flex-wrap:wrap
}

.ct-reach {
    display:flex;
    gap:34px;
    flex-wrap:wrap
}

.ct-reach a,.ct-reach div {
    display:flex;
    align-items:center;
    gap:12px;
    color:#fff
}

.ct-reach i {
    font-style:normal;
    width:38px;
    height:38px;
    border-radius:50%;
    background:#ffffff14;
    border:1px solid #ffffff21;
    display:grid;
    place-items:center;
    font-size:17px;
    color:var(--gold3);
    flex-shrink:0
}

.ct-reach b {
    display:block;
    font-size:14px;
    font-weight:700;
    direction:ltr
}

.ct-reach small {
    display:block;
    font-size:11.5px;
    color:#ffffff8c;
    margin-top:1px
}

.ct-socials {
    display:flex;
    gap:9px
}

.ct-socials a {
    width:36px;
    height:36px;
    border-radius:50%;
    background:#ffffff14;
    border:1px solid #ffffff26;
    display:grid;
    place-items:center;
    color:#fff;
    font-size:14px
}


/* ==================== RESPONSIVE ==================== */
@media(max-width:980px) {
    
.sc-hero-grid,.sc-hassan-grid,.hm-phil-grid,.hm-ex-grid,.hm-result-grid,.ct-grid,.ba-wrap {
        grid-template-columns:1fr
    }
    
.sc-areas-grid,.hm-comp-grid {
        grid-template-columns:repeat(2,1fr)
    }
    
.hm-steps,.hm-en-grid {
        grid-template-columns:repeat(2,1fr)
    }
    
.ohc-deliver {
        grid-template-columns:1fr
    }
    
.sc-head-split {
        grid-template-columns:1fr
    }
    
.sc-callout {
        max-width:none
    }
    
.belief-grid {
        grid-template-columns:1fr 1fr
    }
    
.hm-hero h1 {
        font-size:40px
    }
    
.ct-intro h1 {
        font-size:37px
    }
}

@media(max-width:760px) {
    
.sc-hero h1 {
        font-size:33px
    }
    
.hm-hero h1 {
        font-size:33px
    }
    
.ct-intro h1 {
        font-size:30px
    }
    
.sc-areas-grid,.hm-comp-grid,.hm-steps,.hm-en-grid,.ct-fields,.ct-topics,.ba-grid,.hm-res-grid,.ct-values {
        grid-template-columns:1fr
    }
    
.belief-grid {
        grid-template-columns:1fr
    }
    
.ct-values {
        grid-template-columns:1fr 1fr
    }
    
.radial {
        aspect-ratio:auto;
        max-width:none;
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:16px
    }
    
.radial-ring {
        display:none
    }
    
.radial-core {
        position:static;
        transform:none;
        width:100%;
        grid-column:1/-1;
        aspect-ratio:auto;
        padding:18px;
        border-radius:12px;
        margin-bottom:6px
    }
    
.radial-node {
        position:static;
        transform:none;
        width:auto
    }
    
.ohc-arrow {
        display:none
    }
    
.ohc-step {
        min-width:calc(50% - 8px)
    }
    
.role-row {
        grid-template-columns:1fr 1fr
    }
    
.hm-herotag {
        position:static;
        display:block;
        margin-top:26px
    }
    
.ct-card {
        padding:22px
    }
    
.ct-reach {
        gap:18px
    }
    
.about-vision {
        padding:28px
    }
}


/* ---- page-specific header / CTA theming ---- */
.sc .nav-cta,.hm .nav-cta {
    background:linear-gradient(135deg,#e2be6a,#c4952f);
    color:#14202e
}

.hm .site-header {
    background:#0d2033;
    box-shadow:none;
    border-bottom:1px solid #ffffff14
}

.ct .nav-cta {
    background:#f5c518;
    color:#0b3160
}


/* ---- Al Hassan hero visual ---- */
.hm-hero-grid {
    display:grid;
    grid-template-columns:1.1fr .9fr;
    gap:48px;
    align-items:center
}

.hm-hero-visual {
    position:relative;
    border-radius:14px;
    overflow:hidden;
    border:1px solid #ffffff1f;
    min-height:330px
}

.hm-hero-visual img {
    width:100%;
    height:100%;
    min-height:330px;
    object-fit:cover;
    opacity:.82
}

.hm-hero-visual:after {
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,#0d203352,#0d2033d6)
}

.hm-hero-words {
    position:absolute;
    left:26px;
    top:26px;
    z-index:2;
    display:grid;
    gap:7px
}

.hm-hero-words span {
    font-family:Montserrat,Arial,sans-serif;
    font-size:12px;
    letter-spacing:2.5px;
    color:#ffffffd1;
    font-weight:600
}

.hm-hero-visual .hm-herotag {
    right:26px;
    bottom:26px;
    max-width:160px;
    text-align:end;
    letter-spacing:1.4px
}

body.rtl .hm-hero-visual .hm-herotag {
    right:auto;
    left:26px
}

body.rtl .hm-hero-words {
    left:auto;
    right:26px
}


/* ---- Contact photo panel ---- */
.ct-photo {
    position:relative;
    margin-top:30px;
    border-radius:14px;
    overflow:hidden;
    border:1px solid #ffffff21;
    min-height:190px
}

.ct-photo img {
    width:100%;
    height:230px;
    object-fit:cover;
    opacity:.9
}

.ct-photo:after {
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,#0a3a6d1f,#0a3a6dc7)
}

.ct-photo-cap {
    position:absolute;
    left:24px;
    bottom:22px;
    z-index:2
}

body.rtl .ct-photo-cap {
    left:auto;
    right:24px
}

.ct-photo-cap b {
    display:block;
    font-family:Montserrat,Arial,sans-serif;
    font-size:15px;
    letter-spacing:2px;
    color:#fff
}

.ct-photo-cap span {
    display:block;
    font-size:13px;
    letter-spacing:3px;
    color:#f5c518;
    margin-top:3px
}

.ct-reach i svg {
    display:block
}


@media(max-width:980px) {
    .hm-hero-grid {
        grid-template-columns:1fr
    }
}


/* ---- radial diagram on light (sand/cream) backgrounds ---- */
.hm .radial-node span {
    color:#2b4560;
    font-weight:700
}

.sc-section.cream .radial-node span {
    color:#2b4560;
    font-weight:700
}

.hm .radial-dot {
    background:#fff;
    border:1px solid #c4952f8a;
    color:#a07d28;
    box-shadow:0 5px 14px #0b243a14
}

.sc-section.cream .radial-dot {
    color:#a07d28
}

.hm .radial-ring {
    border-color:#c4952f52
}

.hm .radial-core {
    background:linear-gradient(145deg,#15304a,#0d2135);
    border-color:#c4952f8a;
    color:#dfba6d;
    box-shadow:0 0 0 14px #c4952f14
}

.hm .radial,.sc-section.cream .radial {
    max-width:620px
}

.hm .radial-node,.sc-section.cream .radial-node {
    width:25%
}


/* ---- final polish ---- */
.hm-en {
    border:1px solid #e9eef3;
    border-top:3px solid #c4952f;
    box-shadow:0 4px 14px #0b243a08
}

.hm-section:not(.sand) .hm-en {
    background:#fcfdfe
}

.sc .brand-text,.hm .brand-text,.ct .brand-text {
    color:#fff
}

.sc-area h3,.hm-comp h3 {
    word-break:normal;
    overflow-wrap:anywhere
}

.ct-topic span,.sc-area p {
    overflow-wrap:anywhere
}

.hm-seq {
    max-width:960px;
    margin-inline:auto
}

.hm-seq i:last-of-type {
    display:none
}

body.rtl .hm-seq i,body.rtl .hm-chain i,body.rtl .ohc-arrow {
    transform:scaleX(-1);
    display:inline-block
}

body.rtl .hm-chain i {
    transform:none
}

.ba-side {
    max-width:260px
}

@media(max-width:980px) {
    .ba-side {
        max-width:none
    }
}




/* Compatibility page for old Al Hassan Model bookmarks */
.legacy-redirect{background:#f5f1e8;min-height:100vh;display:grid;place-items:center}
.redirect-wrap{width:min(680px,calc(100% - 36px))}
.redirect-card{background:#fff;padding:40px;border:1px solid #ddd6ca;border-radius:16px;box-shadow:0 16px 38px #11273a12}
.redirect-card h1{font-family:Manrope,Inter,sans-serif;color:#132c43;font-size:38px;margin:0 0 10px}
.redirect-card p:not(.eyebrow){color:#52677a;font-size:16px;line-height:1.6;margin:0 0 20px}


/* Global readability and navigation polish */
.section-copy p,.detail-card p,.service-card p { font-size:14px; line-height:1.7; }
.section-copy h2,.section-head h2 { font-size:32px; }
.service-card { padding:24px; }
.service-icon { width:52px; height:52px; font-size:25px; border-radius:11px; }
.trust-icon { font-size:31px; }
.trust-item strong,.trust-item span { font-size:12px; }
.site-footer a { font-size:12px; }
.site-footer h4 { font-size:13px; }
@media(max-width:760px){
  .brand img{width:120px;height:78px;}
}