/* =========================================
GLOBAL
========================================= */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:Arial, sans-serif;
}

:root{
    --site-header-height:120px;
}

html{
    scroll-behavior:smooth;
}

body{
    background:#ffffff;
    color:#111;
    padding-top:var(--site-header-height);
    overflow-x:hidden;
}

/* =========================================
PARTICLES
========================================= */
#particles-js{

    position:fixed;

    inset: 0;

    width:100vw;
    height:100vh;

    background:
    linear-gradient(
        135deg,
        #ffffff 0%,
        #f8fbff 50%,
        #eef6ff 100%
    );
    overflow: hidden;
    z-index: -1;
    pointer-events: none;
}

/* =========================================
NAVBAR
========================================= */

#nav_blk{

    position:fixed;

    top:0;
    left:0;

    width:100%;

    height:var(--site-header-height);

    background:#ffffff;

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:0 3%;

    box-shadow:0 2px 15px rgba(0,0,0,0.08);

    overflow:visible;
        z-index: 999999;
}



/* =========================================
LOGO SECTION
========================================= */

.logo_blk{

    display:flex;

    align-items:center;

    gap:14px;
    min-width: max-content;
    position: relative;
    z-index: 2;

    cursor:pointer;
}

.logo_blk img{

    width:110px;
    height:auto;
    object-fit:contain;
    transition:0.4s ease;
}

.logo_blk img:hover{

    transform:scale(1.22);

    filter:drop-shadow(
    0 0 10px rgba(255,215,0,0.4));
}

/* =========================================
LOGO TEXT
========================================= */

.logo-text{

    display:flex;

    flex-direction:column;

    justify-content:center;

    line-height:1.1;
}

.logo-text h1{

    font-size:42px;

    font-style:italic;

    font-weight:900;

    text-transform:uppercase;

    line-height:1;

    letter-spacing:1px;

    background:linear-gradient(
        90deg,
        #0f172a,
        #00AEEF,
        #334155,
        #00AEEF
    );

    background-size:300% auto;

    -webkit-background-clip:text;

    -webkit-text-fill-color:transparent;

    animation:darkFlow 20s linear reverse infinite;
}

@keyframes darkFlow{

    0%{
        background-position:0% center;
    }

    100%{
        background-position:300% center;
    }
}

/* =========================================
TAGLINE
========================================= */
.tagline{

    display:inline-block;
    font-size:15px;
    padding-left: 22px;

    letter-spacing:2px;

    margin-top:8px;

    text-transform:uppercase;

    background:linear-gradient(
        90deg,
        #00f7ff,
        rgb(255, 4, 242),
        rgb(0, 255, 157),
        rgb(255, 4, 242),
        #00f7ff
    );

    background-size:300% auto;

    -webkit-background-clip:text;

    -webkit-text-fill-color:transparent;

    /* OUTER BLACK BORDER */
    -webkit-text-stroke:0.8px rgb(0, 0, 0);

    /* GLOW */
    filter:drop-shadow(0 0 3px rgb(217, 222, 223));

    animation:goldShine 8s linear alternate-reverse infinite,
    heartbeat 10s ease infinite;
}

@keyframes goldShine{

    0%{
        background-position:0% center;
    }

    100%{
        background-position:300% center;
    }
}
/* HEARTBEAT EFFECT */
@keyframes heartbeat{

    0%{
        transform:scale(1);
    }

    25%{
        transform:scale(1.05);
    }

    50%{
        transform:scale(1);
    }

    75%{
        transform:scale(1.08);
    }

    100%{
        transform:scale(1);
    }
}

/* =========================================
MENU BUTTON
========================================= */

.menu-toggle{

    display:none;

    font-size:32px;

    cursor:pointer;

    font-weight:bold;
}

/* =========================================
MENU SECTION
========================================= */

.content_blk{
    display:flex;

    align-items:center;

    justify-content:flex-end;

    gap: 12px;

    flex-wrap:wrap;
}


/* =========================
MENU BOXES
========================= */

.content_blk a{

    position:relative;

    padding:7px 10px;

    background:#ffffff;

    border:1px solid rgba(10, 42, 90, 0.15);

    border-radius:12px;

    text-decoration:none;

    color:#0a2a5a;

    font-size:14px;

    font-weight:700;

    letter-spacing:0.3px;

    transition:all 0.35s ease;

    box-shadow:
        0 4px 12px rgba(0,0,0,0.05);

    overflow:hidden;
    white-space: nowrap;
}


/* =========================
HOVER EFFECT
========================= */

.content_blk a:hover{

    background:linear-gradient(
        135deg,
        #00AEEF,
        #123d7a
    );

    color:#ffffff;

    transform:translateY(-3px);

    border-color:#0a2a5a;

    box-shadow:
        0 10px 25px rgba(10,42,90,0.25);
}


/* =========================
ACTIVE MENU
========================= */

.content_blk a.active{

    background:#00AEEF;

    color:#ffffff;

    border-color:#0a2a5a;
}

.content_blk > ul{

    display:flex;

    align-items:center;

    gap:18px;

    list-style:none;
}

.content_blk ul li{

    position:relative;
}

.content_blk ul li a{

    text-decoration:none;

    color:#111;

    font-size:20px;

    font-style:italic;

    font-weight:700;

    text-transform:uppercase;

    transition:
    color 0.2s ease-in-out,
    transform 0.2s ease-in-out,
    letter-spacing 0.2s ease-in-out;
}

.content_blk ul li a:hover{

    color:#ffffff;
}

/* =========================================
PREMIUM DROPDOWN
========================================= */

/* =========================================
FIRST DROPDOWN
========================================= */

.submenu{

    position:absolute;

    top:160%;

    left:0;

    min-width:260px;

    padding:10px;

    border-radius:20px;

    background:
    linear-gradient(
        135deg,
        rgba(255,255,255,0.92),
        rgba(240,248,255,0.92),
        rgba(220,235,255,0.92)
    );

    backdrop-filter:blur(16px);

    border:1px solid rgba(255,255,255,0.4);

    box-shadow:
        0 15px 40px rgba(0,0,0,0.15),
        0 0 25px rgba(0,174,239,0.10);

    opacity:0;

    visibility:hidden;

    transform:translateY(15px);

    transition:0.35s ease;

    z-index:99999;

    list-style:none;
}

/* SHOW */

.dropdown:hover > .submenu{

    opacity:1;

    visibility:visible;

    transform:translateY(0);
}

/* =========================================
ONLY FIRST LEVEL = ROW
========================================= */

.content_blk > ul > .dropdown > .submenu{

    display:flex;

    flex-direction:row;

    gap:10px;

    align-items:flex-start;
}

/* =========================================
SECOND DROPDOWN = COLUMN
========================================= */

.content_blk > ul > .dropdown > .submenu > li > .submenu{

    position:absolute;

    top:125%;

    left:0;

    min-width:280px;

    display:flex;

    flex-direction:column;

    gap:6px;

    padding:12px;

    border-radius:18px;

    background:
    linear-gradient(
        135deg,
        rgba(255,255,255,0.95),
        rgba(240,248,255,0.95),
        rgba(220,235,255,0.95)
    );

    backdrop-filter:blur(16px);

    box-shadow:
        0 15px 35px rgba(0,0,0,0.14);

    opacity:0;

    visibility:hidden;

    transform:translateY(10px);

    transition:0.3s ease;
}

/* SHOW SECOND */

.content_blk > ul > .dropdown > .submenu > li:hover > .submenu{

    opacity:1;

    visibility:visible;

    transform:translateY(0);
}

/* =========================================
MENU LINKS
========================================= */

.submenu li a,
.submenu-side li a{

    display:flex;

    align-items:center;

    justify-content:space-between;

    width:100%;

    padding:14px 18px;

    border-radius:14px;

    color:#0f172a;

    font-size:14px;

    font-weight:700;

    font-style:normal;

    text-transform:none;

    background:transparent;

    box-shadow:none;

    transition:0.28s ease;
}

/* HOVER */

.submenu li a:hover{

    background:
    linear-gradient(
        135deg,
        #00AEEF,
        #123d7a
    );

    color:#ffffff;

    transform:translateX(4px);

    box-shadow:
        0 10px 20px rgba(0,174,239,0.22);
}

/* =========================================
THIRD LEVEL SIDE MENU
========================================= */

.dropdown-side{

    position:relative;
}

.submenu-side{

    position:absolute;

    top:0;

    left:105%;

    min-width:260px;

    display:flex;

    flex-direction:column;
    list-style:none;

    gap:6px;

    padding:12px;

    border-radius:18px;

    background:
    linear-gradient(
        135deg,
        rgba(255,255,255,0.96),
        rgba(240,248,255,0.96),
        rgba(220,235,255,0.96)
    );

    backdrop-filter:blur(16px);

    box-shadow:
        0 15px 35px rgba(0,0,0,0.15);

    opacity:0;

    visibility:hidden;

    transform:translateX(15px);

    transition:0.35s ease;

    z-index:999999;
}

/* SHOW THIRD LEVEL */

.dropdown-side:hover > .submenu-side{

    opacity:1;

    visibility:visible;

    transform:translateX(0);
}

/* =========================================
ARROWS
========================================= */

.dropdown > a::after{

    content:"▾";

    margin-left:8px;

    font: size 19px;

    transition:0.3s ease;
}

.dropdown:hover > a::after{

    transform:rotate(180deg);
}

.dropdown-side > a::after{

    content:"▸";

    margin-left:auto;

    transition:0.3s ease;
}

.dropdown-side:hover > a::after{

    transform:translateX(4px);
}

/* =========================================
BANNER
========================================= */

.banner-container{

    width:100vw;
    height:calc(100vh - var(--site-header-height));
    height:calc(100svh - var(--site-header-height));
    margin:0;
    padding:0;

    position:relative;
    left:50%;
    right:50%;
    margin-left:-50vw;
    margin-right:-50vw;

    overflow:hidden;
    background:#050b26;
}

.carousel{

    position:relative;
    width:100%;
    aspect-ratio:1672/941;
    height:100%;
    margin:0 auto;
    overflow:hidden;
    border-radius:0;
    box-shadow:0 10px 30px rgba(0,0,0,0.12);
    background:#050b26;
}

.carousel-slide{

    width:100%;
    height:100%;
}

.carousel-slide{

    position:absolute;

    inset: 0;
    opacity:0;
    visibility:hidden;

    transition:1s ease;
}

.carousel-slide.active{

    opacity:1;
    visibility:visible;
}

.carousel-slide img{

    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    display:block;
}

/* =========================================
CAROUSEL CONTROLS
========================================= */ 

.carousel-controls{

    position:absolute;

    bottom:20px;

    left:50%;

    transform:translateX(-50%);

    display:flex;

    align-items:center;

    gap:15px;
    z-index: 50;
}

/* =========================================
PREMIUM SCROLL BUTTONS
========================================= */

.carousel-btn{

    position:absolute;

    top:50%;

    transform:translateY(-50%);

    width:62px;

    height:62px;

    border-radius:50%;

    border:2px solid rgba(255,255,255,0.45);

    background:
    radial-gradient(
        circle at center,
        rgba(255,255,255,0.95) 35%,
        rgba(255,255,255,0.18) 70%
    );

    backdrop-filter:blur(8px);

    -webkit-backdrop-filter:blur(8px);

    color:#111111;

    font-size:34px;

    font-weight:300;

    cursor:pointer;

    display:flex;

    align-items:center;

    justify-content:center;

    transition:all 0.35s ease;

    z-index:20;

    box-shadow:
        0 8px 25px rgba(0,0,0,0.18),
        inset 0 0 12px rgba(255,255,255,0.08);
}

/* LEFT BUTTON */
.carousel-btn.prev{

    left:24px;
}

/* RIGHT BUTTON */
.carousel-btn.next{

    right:24px;
}

/* HOVER EFFECT */
.carousel-btn:hover{

    background:rgba(255,255,255,0.22);

    border-color:rgba(255,255,255,0.9);

    transform:translateY(-50%) scale(1.12);

    box-shadow:
        0 12px 30px rgba(0,0,0,0.28),
        0 0 20px rgba(255,255,255,0.18);
}

/* CLICK EFFECT */
.carousel-btn:active{

    transform:translateY(-50%) scale(0.96);
}

/* =========================================
PREMIUM INDICATORS
========================================= */

.slide-indicators{

    display:flex;

    align-items:center;

    gap:14px;
}

/* NORMAL DOT */

.indicator{

    width:14px;

    height:14px;

    border-radius:50%;

    cursor:pointer;

    border:2px solid rgba(0,0,0,0.85);

    background:
    radial-gradient(
        circle at center,
        rgba(255,255,255,0.95) 35%,
        rgba(255,255,255,0.18) 70%
    );

    box-shadow:
        0 4px 12px rgba(0,0,0,0.28),
        inset 0 0 6px rgba(255,255,255,0.7);

    transition:all 0.35s ease;
}

/* ACTIVE DOT */

.indicator.active{

    width:34px;

    border-radius:30px;

    background:
    linear-gradient(
        135deg,
        #ffffff,
        #d9f3ff,
        #ffffff
    );

    border:2px solid #000000;

    box-shadow:
        0 6px 18px rgba(0,0,0,0.35),
        0 0 10px rgba(255,255,255,0.4);
}

/* HOVER EFFECT */

.indicator:hover{

    transform:scale(1.2);

    box-shadow:
        0 6px 18px rgba(0,0,0,0.35),
        0 0 12px rgba(255,255,255,0.5);
}

/* =========================================
HERO SECTION
========================================= */

.hero-container{

    width:92%;

    margin:60px auto;

    padding:55px;

    border-radius:22px;

    background:transparent;

    box-shadow:0 5px 20px rgba(0,0,0,0.08);
}

.intro-showcase{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    background:
        linear-gradient(135deg, rgba(255,255,255,0.84), rgba(226,244,252,0.72)),
        url("../assets/images/generated/intro-generated.png") center/cover no-repeat;
    border:1px solid rgba(0,174,239,0.16);
    box-shadow:0 18px 44px rgba(0,27,68,0.14);
}

.intro-showcase::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(110deg, transparent 0%, rgba(255,255,255,0.3) 42%, transparent 68%);
    transform:translateX(-120%);
    animation:showcaseSweep 8s ease-in-out infinite;
    z-index:0;
}

.intro-showcase > *{
    position:relative;
    z-index:1;
}

.hero-content h1{

    font-size:55px;

    margin-bottom:25px;
}

.hero-content h1 span{

    color:#00AEEF;
}

.hero-content p{

    font-size:20px;

    line-height:1.9;

    margin-bottom:35px;

    text-align:justify;
}

.hero-btn{

    display:inline-block;

    padding:14px 32px;

    border-radius:40px;

    background:#00AEEF;

    color:#ffffff;

    text-decoration:none;

    font-weight:700;

    transition:0.3s ease;
}

.hero-btn:hover{

    background:#008ecc;

    transform:translateY(-3px);
}

/* ===================================
COMMON
=================================== */

.section-title{
    text-align:center;
    margin-bottom:60px;
}

.section-title h2{
    font-size:42px;
    font-weight:800;
}

.section-title span{
    color:#00AEEF;
}

section{
    padding:100px 8%;
}

/* ===================================
WHY US
=================================== */

.why-showcase{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    border:1px solid rgba(0, 174, 239, 0.18);
    background:
        linear-gradient(135deg, rgba(0,27,68,0.96), rgba(8,83,128,0.94) 52%, rgba(16,185,129,0.26)),
        linear-gradient(90deg, rgba(255,255,255,0.08) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255,255,255,0.08) 1px, transparent 1px),
        url("../assets/images/generated/why-generated.png") center/cover no-repeat;
    background-size:auto, 58px 58px, 58px 58px, cover;
    box-shadow:0 28px 70px rgba(0, 27, 68, 0.24);
}

.why-showcase::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(110deg, transparent 0%, rgba(255,255,255,0.16) 42%, transparent 68%);
    transform:translateX(-120%);
    animation:showcaseSweep 7.5s ease-in-out infinite;
    z-index:0;
}

.why-showcase::after{
    content:"";
    position:absolute;
    left:34px;
    bottom:0;
    width:180px;
    height:5px;
    background:linear-gradient(90deg, #10b981, #ffffff, #00aeef, #10b981);
    background-size:240% 100%;
    animation:lineFlow 4s linear infinite;
    transition:left 0.35s ease, width 0.35s ease;
    z-index:0;
}

.why-showcase:hover::after{
    left:0;
    width:100%;
}

.why-highlight{
    position:relative;
    z-index:1;
    padding:82px 6%;
}

.why-highlight .section-title{
    max-width:980px;
    margin:0 auto 48px;
    color:#ffffff;
}

.why-highlight .section-title h2{
    color:#ffffff;
    text-shadow:0 10px 30px rgba(0,0,0,0.28);
}

.why-highlight .section-title span{
    color:#67e8f9;
}

.why-grid{
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:22px;
}

.why-card{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    min-height:280px;
    padding:30px 24px;
    border:1px solid rgba(255,255,255,0.18);
    border-radius:18px;
    background:
        linear-gradient(145deg, rgba(255,255,255,0.9), rgba(228,248,255,0.82) 72%, rgba(213,250,239,0.86)),
        var(--why-card-bg) center/cover no-repeat;
    color:#001b44;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:flex-start;
    gap:16px;
    text-align:left;
    box-shadow:0 18px 40px rgba(0,0,0,0.2);
    animation:productCardRise 0.8s cubic-bezier(.2,.8,.2,1) both;
    transition:transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
}

.why-card:nth-child(2){ animation-delay:0.08s; }
.why-card:nth-child(3){ animation-delay:0.16s; }
.why-card:nth-child(4){ animation-delay:0.24s; }

.why-card:nth-child(1){ --why-card-bg:url("../assets/images/generated/cards/card-why-quality.png"); }
.why-card:nth-child(2){ --why-card-bg:url("../assets/images/generated/cards/card-why-support.png"); }
.why-card:nth-child(3){ --why-card-bg:url("../assets/images/generated/cards/card-why-success.png"); }
.why-card:nth-child(4){ --why-card-bg:url("../assets/images/generated/cards/card-why-delivery.png"); }

.why-card::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.72) 46%, transparent 74%);
    transform:translateX(-130%);
    transition:transform 0.7s ease;
    z-index:0;
}

.why-card::after{
    content:"";
    position:absolute;
    left:30px;
    right:30px;
    bottom:0;
    height:4px;
    border-radius:999px 999px 0 0;
    background:linear-gradient(90deg, #10b981, #00aeef, #f59e0b);
    transform:scaleX(0.35);
    transform-origin:left;
    transition:transform 0.35s ease;
    z-index:1;
}

.why-card > *{
    position:relative;
    z-index:1;
}

.why-card:hover,
.why-card:focus-within{
    transform:translateY(-12px) scale(1.02);
    border-color:rgba(103,232,249,0.75);
    box-shadow:0 28px 58px rgba(0,174,239,0.28), 0 12px 28px rgba(0,0,0,0.18);
}

.why-card:hover::before,
.why-card:focus-within::before{
    transform:translateX(130%);
}

.why-card:hover::after,
.why-card:focus-within::after{
    transform:scaleX(1);
}

.why-card i{
    width:62px;
    height:62px;
    display:grid;
    place-items:center;
    border-radius:16px;
    background:linear-gradient(135deg, #001b44, #00aeef);
    color:#ffffff;
    font-size:30px;
    box-shadow:0 14px 28px rgba(0,174,239,0.28);
    transition:transform 0.35s ease, box-shadow 0.35s ease;
}

.why-card:hover i,
.why-card:focus-within i{
    transform:rotate(-6deg) scale(1.08);
    box-shadow:0 18px 34px rgba(0,174,239,0.36);
}

.why-card h3{
    display:inline-flex;
    align-items:center;
    width:fit-content;
    max-width:100%;
    padding:7px 12px;
    border-left:4px solid #00aeef;
    border-radius:10px;
    color:#001b44;
    font-size:24px;
    font-weight:800;
    line-height:1.22;
    background:rgba(255,255,255,0.36);
    box-shadow:0 8px 18px rgba(0, 27, 68, 0.12);
    backdrop-filter:blur(8px);
}

.why-card p{
    color:#334155;
    font-size:16px;
    line-height:1.6;
}

/* ===================================
PRODUCTS SHOWCASE
=================================== */

.product-showcase{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    border:1px solid rgba(0, 174, 239, 0.18);
    background:
        linear-gradient(135deg, rgba(0,27,68,0.96), rgba(0,76,142,0.94) 48%, rgba(0,174,239,0.22)),
        linear-gradient(90deg, rgba(255,255,255,0.08) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255,255,255,0.08) 1px, transparent 1px),
        url("../assets/images/generated/products-generated.png") center/cover no-repeat;
    background-size:auto, 58px 58px, 58px 58px, cover;
    box-shadow:0 28px 70px rgba(0, 27, 68, 0.24);
}

.product-showcase::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(110deg, transparent 0%, rgba(255,255,255,0.18) 42%, transparent 68%);
    transform:translateX(-120%);
    animation:showcaseSweep 7s ease-in-out infinite;
    z-index:0;
}

.product-showcase::after{
    content:"";
    position:absolute;
    left:34px;
    bottom:0;
    width:180px;
    height:5px;
    background:linear-gradient(90deg, #00aeef, #ffffff, #10b981, #00aeef);
    background-size:240% 100%;
    animation:lineFlow 4s linear infinite;
    transition:left 0.35s ease, width 0.35s ease;
    z-index:1;
}

.product-showcase:hover::after{
    left:0;
    width:100%;
}

.products-highlight{
    position:relative;
    z-index:1;
    padding:82px 6%;
}

.products-highlight .section-title{
    max-width:920px;
    margin:0 auto 48px;
    color:#ffffff;
}

.section-eyebrow{
    display:inline-flex;
    margin-bottom:14px;
    padding:8px 14px;
    border:1px solid rgba(255,255,255,0.28);
    border-radius:999px;
    background:rgba(255,255,255,0.1);
    color:#7ee7ff;
    font-size:13px;
    font-weight:800;
    letter-spacing:1.5px;
    text-transform:uppercase;
}

.products-highlight .section-title h2{
    color:#ffffff;
    text-shadow:0 10px 30px rgba(0,0,0,0.28);
}

.products-highlight .section-title span{
    color:#67e8f9;
}

.section-subtitle{
    max-width:760px;
    margin:18px auto 0;
    color:rgba(255,255,255,0.84);
    font-size:19px;
    line-height:1.7;
}

.service-grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:24px;
}

.service-card{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    min-height:280px;
    padding:28px 24px;
    border:1px solid rgba(255,255,255,0.18);
    border-radius:18px;
    background:
        linear-gradient(145deg, rgba(255,255,255,0.9), rgba(227,246,255,0.82), rgba(214,242,255,0.86)),
        var(--service-card-bg) center/cover no-repeat;
    color:#001b44;
    text-decoration:none;
    box-shadow:0 18px 40px rgba(0,0,0,0.2);
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    animation:productCardRise 0.8s cubic-bezier(.2,.8,.2,1) both;
    transition:transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease, background-position 0.35s ease;
}

.service-card:nth-child(2){ animation-delay:0.08s; }
.service-card:nth-child(3){ animation-delay:0.16s; }
.service-card:nth-child(4){ animation-delay:0.24s; }
.service-card:nth-child(5){ animation-delay:0.32s; }
.service-card:nth-child(6){ animation-delay:0.4s; }

.service-card:nth-child(1){ --service-card-bg:url("../assets/images/generated/cards/card-product-tools.png"); }
.service-card:nth-child(2){ --service-card-bg:url("../assets/images/generated/cards/card-product-electronics.png"); }
.service-card:nth-child(3){ --service-card-bg:url("../assets/images/generated/cards/card-product-power.png"); }
.service-card:nth-child(4){ --service-card-bg:url("../assets/images/generated/cards/card-product-mechanical.png"); }
.service-card:nth-child(5){ --service-card-bg:url("../assets/images/generated/cards/card-product-communication.png"); }
.service-card:nth-child(6){ --service-card-bg:url("../assets/images/generated/cards/card-product-metals.png"); }

.service-card::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.72) 46%, transparent 74%);
    transform:translateX(-130%);
    transition:transform 0.7s ease;
    z-index:0;
}

.service-card::after{
    content:"";
    position:absolute;
    left:30px;
    right:30px;
    bottom:0;
    height:4px;
    border-radius:999px 999px 0 0;
    background:linear-gradient(90deg, #00aeef, #10b981, #f59e0b);
    transform:scaleX(0.35);
    transform-origin:left;
    transition:transform 0.35s ease;
    z-index:1;
}

.service-card > *{
    position:relative;
    z-index:1;
}

.service-card:hover,
.service-card:focus-visible{
    transform:translateY(-12px) scale(1.02);
    border-color:rgba(103,232,249,0.75);
    box-shadow:0 28px 58px rgba(0,174,239,0.28), 0 12px 28px rgba(0,0,0,0.18);
    outline:none;
}

.service-card:hover::before,
.service-card:focus-visible::before{
    transform:translateX(130%);
}

.service-card:hover::after,
.service-card:focus-visible::after{
    transform:scaleX(1);
}

.service-card i{
    width:54px;
    height:54px;
    display:grid;
    place-items:center;
    border-radius:16px;
    background:linear-gradient(135deg, #001b44, #00aeef);
    color:#ffffff;
    font-size:26px;
    box-shadow:0 14px 28px rgba(0,174,239,0.28);
    transition:transform 0.35s ease, box-shadow 0.35s ease;
}

.service-card:hover i,
.service-card:focus-visible i{
    transform:rotate(-6deg) scale(1.08);
    box-shadow:0 18px 34px rgba(0,174,239,0.36);
}

.service-card h3{
    margin:0;
    display:inline-flex;
    align-items:center;
    width:fit-content;
    max-width:100%;
    padding:7px 12px;
    border-left:4px solid #00aeef;
    border-radius:10px;
    color:#001b44;
    font-size:26px;
    font-weight:900;
    line-height:1.22;
    background:rgba(255,255,255,0.36);
    box-shadow:0 8px 18px rgba(0, 27, 68, 0.12);
    backdrop-filter:blur(8px);
}

.service-card p{
    margin:0;
    color:#334155;
    font-size:14px;
    line-height:1.5;
}

.service-card span{
    display:inline-flex;
    align-items:center;
    gap:10px;
    margin-top:auto;
    width:fit-content;
    max-width:100%;
    padding:8px 10px 8px 12px;
    border:1px solid rgba(0, 27, 68, 0.2);
    border-radius:999px;
    color:#001b44;
    font-size:11px;
    font-weight:800;
    letter-spacing:0.8px;
    text-transform:uppercase;
    background:rgba(255,255,255,0.08);
    box-shadow:0 8px 18px rgba(0, 27, 68, 0.08);
    backdrop-filter:blur(8px);
    transition:border-color 0.28s ease, box-shadow 0.28s ease, background 0.28s ease;
}

.service-card span::after{
    content:"\25B6";
    width:28px;
    height:28px;
    display:inline-grid;
    place-items:center;
    flex:0 0 28px;
    border-radius:50%;
    color:#ffffff;
    font-size:13px;
    line-height:1;
    background:linear-gradient(135deg, #001b44, #0077b6 48%, #00aeef);
    box-shadow:0 8px 18px rgba(0, 27, 68, 0.32), 0 0 0 3px rgba(255,255,255,0.28);
    transform:translateX(0);
    transition:box-shadow 0.28s ease, background 0.28s ease, color 0.28s ease;
}

.service-card span:hover::after,
.service-card span:focus-visible::after{
    background:linear-gradient(135deg, #00aeef, #001b44);
    box-shadow:0 12px 24px rgba(0, 174, 239, 0.46), 0 0 0 4px rgba(255,255,255,0.46);
}

.service-card span:hover,
.service-card span:focus-visible{
    border-color:rgba(0, 174, 239, 0.48);
    background:rgba(255,255,255,0.14);
    box-shadow:0 12px 26px rgba(0, 27, 68, 0.14);
}

.service-card-wide{
    grid-column:auto;
    background:
        linear-gradient(145deg, rgba(255,255,255,0.9), rgba(233,250,243,0.82), rgba(209,250,229,0.86)),
        var(--service-card-bg) center/cover no-repeat;
}

.service-card-wide h3{
    max-width:100%;
    font-size:26px;
    font-weight:900;
}

.service-card-wide span{
    letter-spacing:0.4px;
}

@keyframes showcaseSweep{
    0%, 42%{ transform:translateX(-120%); }
    70%, 100%{ transform:translateX(120%); }
}

@keyframes productCardRise{
    from{
        opacity:0;
        transform:translateY(24px) scale(0.98);
    }
    to{
        opacity:1;
        transform:translateY(0) scale(1);
    }
}

@keyframes lineFlow{
    0%{ background-position:0% 50%; }
    100%{ background-position:240% 50%; }
}

/* ===================================
STATS
=================================== */

.achievements-showcase,
.clients-showcase{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    border:1px solid rgba(0, 174, 239, 0.18);
    background:
        linear-gradient(135deg, rgba(0,27,68,0.96), rgba(0,76,142,0.94) 50%, rgba(16,185,129,0.22)),
        linear-gradient(90deg, rgba(255,255,255,0.08) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255,255,255,0.08) 1px, transparent 1px),
        url("../assets/images/generated/achievements-generated.png") center/cover no-repeat;
    background-size:auto, 58px 58px, 58px 58px, cover;
    box-shadow:0 28px 70px rgba(0, 27, 68, 0.24);
}

.achievements-showcase::before,
.clients-showcase::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(110deg, transparent 0%, rgba(255,255,255,0.16) 42%, transparent 68%);
    transform:translateX(-120%);
    animation:showcaseSweep 7.5s ease-in-out infinite;
    z-index:0;
}

.achievements-showcase::after,
.clients-showcase::after{
    content:"";
    position:absolute;
    left:34px;
    bottom:0;
    width:180px;
    height:5px;
    background:linear-gradient(90deg, #00aeef, #ffffff, #10b981, #00aeef);
    background-size:240% 100%;
    animation:lineFlow 4s linear infinite;
    transition:left 0.35s ease, width 0.35s ease;
    z-index:0;
}

.achievements-showcase:hover::after,
.clients-showcase:hover::after{
    left:0;
    width:100%;
}

.achievements-showcase > *,
.clients-showcase > *{
    position:relative;
    z-index:1;
}

.clients-showcase{
    background:
        linear-gradient(135deg, rgba(0,27,68,0.94), rgba(0,76,142,0.92) 50%, rgba(0,174,239,0.24)),
        linear-gradient(90deg, rgba(255,255,255,0.08) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255,255,255,0.08) 1px, transparent 1px),
        url("../assets/images/generated/clients-generated.png") center/cover no-repeat;
    background-size:auto, 58px 58px, 58px 58px, cover;
}

.achievements-showcase .section-title,
.clients-highlight .section-title{
    color:#ffffff;
}

.achievements-showcase .section-title h2,
.clients-highlight .section-title h2{
    color:#ffffff;
    text-shadow:0 10px 30px rgba(0,0,0,0.28);
}

.achievements-showcase .section-title span,
.clients-highlight .section-title span{
    color:#67e8f9;
}

.stats{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
    gap:22px;
    margin:0;
    padding:0;
    color:#001b44;
    background:transparent;
    border-radius:0;
}

.stat-box{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    min-height:190px;
    padding:34px 24px;
    border:1px solid rgba(255,255,255,0.18);
    border-radius:18px;
    background:
        linear-gradient(145deg, rgba(255,255,255,0.9), rgba(227,246,255,0.82) 72%, rgba(213,250,239,0.86)),
        var(--stat-card-bg) center/cover no-repeat;
    text-align:left;
    box-shadow:0 18px 40px rgba(0,0,0,0.2);
    animation:productCardRise 0.8s cubic-bezier(.2,.8,.2,1) both;
    transition:transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
}

.stat-box:nth-child(2){ animation-delay:0.08s; }
.stat-box:nth-child(3){ animation-delay:0.16s; }
.stat-box:nth-child(4){ animation-delay:0.24s; }

.stat-box:nth-child(1){ --stat-card-bg:url("../assets/images/generated/cards/card-stat-projects.png"); }
.stat-box:nth-child(2){ --stat-card-bg:url("../assets/images/generated/cards/card-stat-oem.png"); }
.stat-box:nth-child(3){ --stat-card-bg:url("../assets/images/generated/cards/card-stat-delivered.png"); }
.stat-box:nth-child(4){ --stat-card-bg:url("../assets/images/generated/cards/card-stat-experience.png"); }

.stat-box::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.72) 46%, transparent 74%);
    transform:translateX(-130%);
    transition:transform 0.7s ease;
    z-index:0;
}

.stat-box::after{
    content:"";
    position:absolute;
    left:24px;
    right:24px;
    bottom:0;
    height:4px;
    border-radius:999px 999px 0 0;
    background:linear-gradient(90deg, #00aeef, #10b981, #f59e0b);
    transform:scaleX(0.35);
    transform-origin:left;
    transition:transform 0.35s ease;
    z-index:1;
}

.stat-box > *{
    position:relative;
    z-index:1;
}

.stat-box:hover{
    transform:translateY(-12px) scale(1.02);
    border-color:rgba(103,232,249,0.75);
    box-shadow:0 28px 58px rgba(0,174,239,0.28), 0 12px 28px rgba(0,0,0,0.18);
}

.stat-box:hover::before{
    transform:translateX(130%);
}

.stat-box:hover::after{
    transform:scaleX(1);
}

.stat-box h2{
    color:#001b44;
    font-size:58px;
    line-height:1;
    margin-bottom:16px;
}

.stat-box p{
    color:#334155;
    font-size:17px;
    font-weight:800;
    line-height:1.5;
    text-transform:uppercase;
    letter-spacing:0.6px;
}

/* ===================================
ORGANIZATIONS
=================================== */

.org-grid{
    display:grid;
    grid-template-columns:repeat(5, minmax(0, 1fr));
    gap:18px;
    align-items:center;
}

.client-card{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    width:100%;
    height:180px;
    padding:18px;
    display:grid;
    place-items:center;
    background:
        linear-gradient(145deg, rgba(255,255,255,0.97), rgba(226,246,255,0.9) 68%, rgba(214,242,255,0.96)),
        linear-gradient(135deg, rgba(0,174,239,0.12), transparent 55%);
    border:1px solid rgba(103,232,249,0.22);
    border-radius:18px;
    box-shadow:0 18px 40px rgba(0,0,0,0.18), inset 0 0 0 1px rgba(255,255,255,0.5);
    animation:productCardRise 0.8s cubic-bezier(.2,.8,.2,1) both;
    transition:transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease, background 0.35s ease;
}

.client-card::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.72) 46%, transparent 74%);
    transform:translateX(-130%);
    transition:transform 0.7s ease;
    z-index:0;
}

.client-card::after{
    content:"";
    position:absolute;
    left:22px;
    right:22px;
    bottom:0;
    height:4px;
    border-radius:999px 999px 0 0;
    background:linear-gradient(90deg, #00aeef, #10b981, #f59e0b);
    transform:scaleX(0.25);
    transform-origin:left;
    transition:transform 0.35s ease;
    z-index:1;
}

.client-card img{
    position:relative;
    z-index:1;
    width:100%;
    height:100%;
    object-fit:contain;
    padding:8px;
    border-radius:12px;
    background:rgba(255,255,255,0.38);
    transition:transform 0.35s ease, filter 0.35s ease;
}

.client-card:nth-child(2){ animation-delay:0.05s; }
.client-card:nth-child(3){ animation-delay:0.1s; }
.client-card:nth-child(4){ animation-delay:0.15s; }
.client-card:nth-child(5){ animation-delay:0.2s; }
.client-card:nth-child(6){ animation-delay:0.25s; }
.client-card:nth-child(7){ animation-delay:0.3s; }
.client-card:nth-child(8){ animation-delay:0.35s; }
.client-card:nth-child(9){ animation-delay:0.4s; }
.client-card:nth-child(10){ animation-delay:0.45s; }

.client-card:hover{
    transform:translateY(-10px) scale(1.03);
    border-color:rgba(103,232,249,0.75);
    box-shadow:0 28px 58px rgba(0,174,239,0.24), 0 12px 28px rgba(0,0,0,0.16);
    background:
        linear-gradient(145deg, rgba(255,255,255,1), rgba(218,246,255,0.94) 68%, rgba(209,250,229,0.98)),
        linear-gradient(135deg, rgba(0,174,239,0.2), transparent 55%);
}

.client-card:hover::before{
    transform:translateX(130%);
}

.client-card:hover::after{
    transform:scaleX(1);
}

.client-card:hover img{
    transform:scale(1.04);
    filter:saturate(1.08) contrast(1.04);
}

/* ===================================
CTA
=================================== */

.cta-section{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    text-align:center;
    background:linear-gradient(
        135deg,
        rgba(0,27,68,0.98),
        rgba(0,76,142,0.96) 52%,
        rgba(0,174,239,0.82)
    ),
    linear-gradient(90deg, rgba(255,255,255,0.08) 1px, transparent 1px),
    linear-gradient(0deg, rgba(255,255,255,0.08) 1px, transparent 1px),
    url("../assets/images/generated/cta-generated.png") center/cover no-repeat;
    background-size:auto, 58px 58px, 58px 58px, cover;
    color:white;
    border-radius:30px;
    margin:80px 8%;
    border:1px solid rgba(0,174,239,0.2);
    box-shadow:0 28px 70px rgba(0,27,68,0.24);
    animation:productCardRise 0.8s cubic-bezier(.2,.8,.2,1) both;
}

.cta-section::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(110deg, transparent 0%, rgba(255,255,255,0.18) 42%, transparent 68%);
    transform:translateX(-120%);
    animation:showcaseSweep 7s ease-in-out infinite;
    z-index:0;
}

.cta-section::after{
    content:"";
    position:absolute;
    left:34px;
    bottom:0;
    width:180px;
    height:5px;
    background:linear-gradient(90deg, #10b981, #ffffff, #00aeef, #10b981);
    background-size:240% 100%;
    animation:lineFlow 4s linear infinite;
    transition:left 0.35s ease, width 0.35s ease;
    z-index:0;
}

.cta-section:hover::after{
    left:0;
    width:100%;
}

.cta-section > *{
    position:relative;
    z-index:1;
}

.cta-section h2{
    font-size:50px;
    margin-bottom:20px;
}

.cta-section p{
    max-width:700px;
    margin:auto;
    line-height:1.8;
}

.cta-buttons{
    margin-top:40px;
}

.cta-btn{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:190px;
    padding:16px 36px;
    background:linear-gradient(135deg, #ffffff, #dff8ff);
    color:#001b44;
    border:2px solid rgba(255,255,255,0.9);
    border-radius:50px;
    margin:10px;
    text-decoration:none;
    font-weight:900;
    letter-spacing:0.5px;
    text-transform:uppercase;
    transition:transform 0.3s ease, box-shadow 0.3s ease, background 0.3s ease, color 0.3s ease;
    box-shadow:0 16px 34px rgba(255,255,255,0.22), 0 10px 28px rgba(0,0,0,0.2);
    animation:ctaPulse 2.8s ease-in-out infinite;
}

.cta-btn::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(110deg, transparent 0%, rgba(255,255,255,0.8) 42%, transparent 68%);
    transform:translateX(-120%);
    transition:transform 0.55s ease;
    z-index:0;
}

.cta-btn:hover{
    transform:translateY(-7px);
    background:linear-gradient(135deg, #00aeef, #67e8f9);
    color:#001b44;
    box-shadow:0 22px 44px rgba(0,174,239,0.42), 0 14px 30px rgba(0,0,0,0.22);
}

.cta-btn:hover::before{
    transform:translateX(120%);
}

.secondary{
    background:linear-gradient(135deg, #10b981, #67e8f9);
    border-color:rgba(103,232,249,0.95);
    color:#001b44;
    box-shadow:0 16px 34px rgba(16,185,129,0.3), 0 10px 28px rgba(0,0,0,0.2);
    animation-delay:0.35s;
}

.secondary:hover{
    background:linear-gradient(135deg, #ffffff, #d1fae5);
    color:#001b44;
    box-shadow:0 22px 44px rgba(16,185,129,0.42), 0 14px 30px rgba(0,0,0,0.22);
}

@keyframes ctaPulse{
    0%, 100%{ box-shadow:0 16px 34px rgba(255,255,255,0.22), 0 10px 28px rgba(0,0,0,0.2); }
    50%{ box-shadow:0 22px 44px rgba(0,174,239,0.34), 0 14px 34px rgba(0,0,0,0.24); }
}

/* =========================================
TABLET
========================================= */

@media(max-width:992px){

    :root{
        --site-header-height:100px;
    }

    body.menu-open{
        overflow:hidden;
    }

    #nav_blk{
        height:100px;
        padding:10px 22px;
    }

    .logo_blk{
        gap:10px;
        min-width:0;
    }

    .logo_blk img{
        width:74px;
    }

    .logo-text h1{

        font-size:28px;
    }

    .tagline{
        padding-left:0;
        font-size:9px;
        letter-spacing:1.4px;
    }

    .menu-toggle{
        display:flex;
        width:46px;
        height:46px;
        align-items:center;
        justify-content:center;
        flex:0 0 auto;
        border:1px solid rgba(0,174,239,0.22);
        border-radius:14px;
        background:linear-gradient(135deg, #ffffff, #eef8ff);
        box-shadow:0 8px 22px rgba(0,44,90,0.12);
        color:#001b44;
        font-size:0;
        line-height:1;
        z-index:1000000;
    }

    .menu-toggle::before{
        content:"\2630";
        font-size:28px;
        font-weight:800;
    }

    .menu-toggle.active::before{
        content:"\00d7";
        font-size:34px;
    }

    .content_blk{
        position:fixed;
        top:var(--site-header-height);
        left:0;
        width:100%;
        height:calc(100vh - var(--site-header-height));
        padding:22px;
        display:block;
        overflow-y:auto;
        overflow-x:hidden;
        opacity:0;
        visibility:hidden;
        transform:translateX(-100%);
        background:linear-gradient(145deg, rgba(255,255,255,0.98), rgba(232,246,255,0.98));
        border-top:1px solid rgba(0,174,239,0.12);
        box-shadow:0 20px 40px rgba(0,27,68,0.16);
        transition:transform 0.35s ease, opacity 0.35s ease, visibility 0.35s ease;
        z-index:999998;
    }

    .content_blk.active{
        opacity:1;
        visibility:visible;
        transform:translateX(0);
    }

    .content_blk > ul{
        width:min(560px, 100%);
        margin:0 auto;
        padding:0;
        display:flex;
        flex-direction:column;
        align-items:stretch;
        gap:12px;
        list-style:none;
    }

    .content_blk ul li{
        width:100%;
    }

    .content_blk ul li a{
        width:100%;
        display:flex;
        align-items:center;
        justify-content:space-between;
        padding:15px 18px;
        border-radius:16px;
        font-size:15px;
        background:rgba(255,255,255,0.82);
        box-shadow:0 8px 20px rgba(0,38,84,0.08);
    }

    .submenu,
    .submenu-side{
        position:static !important;
        width:100% !important;
        min-width:100% !important;
        margin-top:10px;
        padding:10px;
        display:none;
        opacity:0;
        visibility:hidden;
        transform:none !important;
        flex-direction:column !important;
        gap:8px;
        border-radius:18px;
        background:rgba(255,255,255,0.62);
        box-shadow:inset 0 0 0 1px rgba(0,174,239,0.08);
    }

    .dropdown:hover > .submenu,
    .dropdown-side:hover > .submenu-side{
        display:none;
    }

    .dropdown.active > .submenu,
    .dropdown-side.active > .submenu-side{
        display:flex !important;
        opacity:1;
        visibility:visible;
    }

    .content_blk .dropdown > .submenu,
    .content_blk .dropdown-side > .submenu-side{
        display:none !important;
        opacity:0;
        visibility:hidden;
        max-height:0;
        margin-top:0;
        padding-top:0;
        padding-bottom:0;
        overflow:hidden;
    }

    .content_blk .dropdown.active > .submenu,
    .content_blk .dropdown-side.active > .submenu-side{
        display:flex !important;
        opacity:1;
        visibility:visible;
        max-height:none;
        margin-top:10px;
        padding:10px;
        overflow:visible;
    }

    .submenu-side{
        left:auto;
        margin-left:0;
    }

    .dropdown-side{
        width:100%;
    }

    .submenu li a,
    .submenu-side li a{
        padding:13px 15px;
        font-size:14px;
        box-shadow:none;
    }

    .dropdown > a::after,
    .dropdown-side > a::after{
        margin-left:auto;
    }

    .banner-container{

        width:100vw;
        height:calc(100vh - var(--site-header-height));
        height:calc(100svh - var(--site-header-height));
        margin:0;
        left:50%;
        right:50%;
        margin-left:-50vw;
        margin-right:-50vw;
    }

    .carousel{
        width:100%;
        aspect-ratio:1672/941;
        height:100%;
        border-radius:0;
    }

    .carousel-slide img{
        object-fit:cover;
    }

    .hero-container{

        width:92%;
        margin:42px auto;
        padding:38px;
        border-radius:20px;
    }

    .hero-content h1{

        font-size:38px;
        line-height:1.18;
    }

    .hero-content p{
        font-size:17px;
        line-height:1.75;
        margin-bottom:26px;
    }

    .section-title{
        margin-bottom:42px;
    }

    .section-title h2{
        font-size:36px;
        line-height:1.22;
    }

    .why-us .section-title p{
        font-size:17px;
        line-height:1.7;
    }

    section{
        padding:72px 5%;
    }

    .why-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap:22px;
    }

    .why-highlight{
        padding:64px 5%;
    }

    .why-card{
        padding:26px 22px;
        min-height:250px;
    }

    .why-card i{
        width:56px;
        height:56px;
        font-size:27px;
    }

    .why-card h3{
        font-size:22px;
        line-height:1.25;
    }

    .why-card p{
        font-size:16px;
        line-height:1.65;
    }

    .service-grid{
        grid-template-columns:repeat(3, minmax(0, 1fr));
        gap:22px;
    }

    .products-highlight{
        padding:64px 5%;
    }

    .stats-highlight,
    .clients-highlight{
        padding:64px 5%;
    }

    .section-subtitle{
        font-size:17px;
    }

    .service-card{
        min-height:245px;
        padding:24px 18px;
    }

    .service-card i{
        width:56px;
        height:56px;
        font-size:27px;
    }

    .service-card h3{
        font-size:20px;
    }

    .stats{
        grid-template-columns:repeat(2, minmax(0, 1fr));
        margin:30px 0 0;
        padding:48px 28px;
        gap:22px;
    }

    .stat-box h2{
        font-size:48px;
    }

    .stat-box p{
        font-size:16px;
    }

    .org-grid{
        grid-template-columns:repeat(3, minmax(0, 1fr));
        gap:18px;
    }

    .client-card{
        height:150px;
    }

    .cta-section{
        margin:58px auto;
        width:92%;
        padding:70px 45px;
    }

    .cta-section h2{
        font-size:40px;
        line-height:1.2;
    }
}

/* =========================================
MOBILE
========================================= */

@media(max-width:768px){

    :root{
        --site-header-height:90px;
    }

    body{
        padding-top:var(--site-header-height);
    }

    #nav_blk{

        height:var(--site-header-height);
        padding:10px 20px;
    }

    .logo_blk{
        align-items: flex-start;
        gap:8px;
    }

    .logo_blk img{

        width:55px;
        height: 55px;
    }

    .logo-text{

        display:flex;
        flex-direction:column;
        padding-top: 15px;
        justify-content: center;
        align-items: center;
        text-align: center;
        width: 100%;
    }

    .logo-text h1{

        font-size:15px;
        line-height: 1.1;
        margin-bottom: 2px;
    }

    .tagline{

        display: block;
        width: 100%;
        padding-left: 0;
        margin-top: 2px;
        font-size:6px;
        letter-spacing:1px;
        line-height: 1.4;
        text-align: center;
    }

    .menu-toggle{

        display:flex;
    }

    .content_blk{

        position:fixed;

        top:var(--site-header-height);
        left: -100%;

        width:100%;
        height:calc(100vh - var(--site-header-height));
        opacity:0;
        visibility:hidden;
        background:
        linear-gradient(
            135deg,
            rgba(255,255,255,0.96),
            rgba(240,248,255,0.96)
        );
        overflow-y:auto;
        overflow-x:hidden;
        overscroll-behavior:contain;
        transition:0.4s ease;

        box-shadow:0 10px 20px rgba(0,0,0,0.08);

        border-radius:0 0 20px 20px;
        z-index:99999;
    }

    .content_blk.active{
        left:0;
        opacity:1;
        visibility:visible;

        max-height: 85vh;

        padding:20px 0;
    }

    .content_blk ul{
        width:100%;
        display:flex;

        flex-direction:column;

        align-items:flex-start;

        gap: 14px;

        padding:0 18px;
        list-style:none;
    }
    
    /* MENU ITEMS */

    .content_blk ul li{

        width:100%;
    }

    .content_blk ul li a{

        width:100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        min-width:0;
        white-space:normal !important;
        overflow:visible !important;
        text-overflow:clip !important;
        line-height:1.25;
        gap:10px;
    }
     /* =========================================
    RESET ALL DROPDOWNS
    ========================================= */
    
    .submenu,
    .submenu-side{
    
        position:static !important;
    
        width:100% !important;
    
        min-width:100% !important;
    
        max-width:100% !important;
    
        margin-top:12px;
    
        padding:12px;
    
        border-radius:18px;
    
        display:none;
    
        transform:none !important;
    
        flex-direction:column !important;
    
        gap:10px;
    
        background:
        linear-gradient(
            135deg,
            rgba(255,255,255,0.75),
            rgba(240,248,255,0.72),
            rgba(220,235,255,0.68)
        );
    
        backdrop-filter:blur(16px);
    
        box-shadow:
            0 10px 25px rgba(0,0,0,0.08);
    }

    .dropdown > .submenu,
    .dropdown-side > .submenu-side{

        opacity:0;
        visibility:hidden;
        display:none;
    }   

    .dropdown.active > .submenu{
        display:flex;
        opacity:1;
        visibility:visible;
    }

    .dropdown-side.active > .submenu-side{
        display:flex;
        opacity:1;
        visibility:visible;
    }    
    
    /* FORCE COLUMN */

    .content_blk > ul > .dropdown > .submenu{

        flex-direction:column !important;
    }

    /*submenu links*/

    .submenu li a,
    .submenu-side li a{

        width:100%;
    
        padding:14px 16px;

        font-size:13px;
        border-radius:14px;
        min-width:0;
        white-space:normal !important;
        overflow:visible !important;
        text-overflow:clip !important;
        line-height:1.22;
        overflow-wrap:anywhere;
    }
    /* REMOVE HOVER EFFECTS */

    .dropdown:hover > .submenu,
    .dropdown-side:hover > .submenu-side{

        display:none;
    }

    .dropdown.active > .submenu,
    .dropdown-side.active > .submenu-side{

        display:flex !important;
    }

    .content_blk .dropdown > .submenu,
    .content_blk .dropdown-side > .submenu-side{
        display:none !important;
        opacity:0;
        visibility:hidden;
        max-height:0;
        margin-top:0;
        padding-top:0;
        padding-bottom:0;
        overflow:hidden;
    }

    .content_blk .dropdown.active > .submenu,
    .content_blk .dropdown-side.active > .submenu-side{
        display:flex !important;
        opacity:1;
        visibility:visible;
        max-height:none;
        margin-top:12px;
        padding:12px;
        overflow:visible;
    }

    /* THIRD LEVEL */

    .submenu-side{
    
        margin-left:0;
    
        margin-top:10px;
    }
    
    /* REMOVE SIDE OFFSET */
    
    .dropdown-side{
    
        width:100%;
    }
    
    /* ARROWS */
    
    .dropdown > a::after{
    
        margin-left:auto;
    }
    
    .dropdown-side > a::after{
    
        margin-left:auto;
    }
    

    .banner-container{

        width:100vw;
        height:calc(100vh - var(--site-header-height));
        height:calc(100svh - var(--site-header-height));
        margin:0;
        left:50%;
        right:50%;
        margin-left:-50vw;
        margin-right:-50vw;

    }

    .carousel{

        width:100%;
        aspect-ratio:1672/941;
        height:100%;
        border-radius:0;
    }

    .carousel-btn{

        width:42px;

        height:42px;

        font-size:24px;
    }

    .carousel-btn.prev{

        left:12px;
    }

    .carousel-btn.next{

        right:12px;
    }

    .indicator{

        width:10px;

        height:10px;
    }

    .hero-container{

        width:92%;

        padding:24px 18px;
        margin:28px auto;
        border-radius:18px;
    }

    .hero-content h1{

        font-size:26px;
        line-height:1.22;
        margin-bottom:18px;
    }

    .hero-content p{

        font-size:15px;
        line-height:1.65;
        margin-bottom:22px;

        text-align:left;
    }

    .hero-btn{
        width:100%;
        text-align:center;
        padding:13px 20px;
    }

    .section-title{
        margin-bottom:28px;
    }

    .section-title h2{
        font-size:26px;
        line-height:1.25;
    }

    section{
        padding:44px 4%;
    }

    .why-grid,
    .service-grid,
    .stats{
        grid-template-columns:1fr;
        gap:16px;
    }

    .why-card{
        min-height:235px;
        padding:24px 18px;
        border-radius:16px;
    }

    .why-highlight{
        padding:46px 4%;
    }

    .products-highlight{
        padding:46px 4%;
    }

    .stats-highlight,
    .clients-highlight{
        padding:46px 4%;
    }

    .section-eyebrow{
        font-size:11px;
        line-height:1.3;
    }

    .section-subtitle{
        font-size:15px;
        line-height:1.6;
    }

    .service-card{
        min-height:245px;
        padding:24px 18px;
        border-radius:16px;
    }

    .service-card-wide{
        grid-column:auto;
    }

    .why-card i{
        width:52px;
        height:52px;
        font-size:24px;
    }

    .service-card i{
        width:52px;
        height:52px;
        font-size:24px;
    }

    .why-card h3{
        font-size:21px;
        line-height:1.28;
    }

    .why-card p,
    .why-us .section-title p{
        font-size:15px;
        line-height:1.6;
    }

    .service-card h3{
        font-size:21px;
        line-height:1.3;
    }

    .service-card p{
        font-size:15px;
    }

    .stats{
        margin:20px 0 0;
        padding:32px 18px;
        border-radius:18px;
    }

    .stat-box h2{
        font-size:38px;
    }

    .stat-box p{
        font-size:15px;
    }

    .cta-section{
        width:92%;
        margin:44px auto;
        padding:44px 20px;
        border-radius:22px;
    }

    .cta-section h2{
        font-size:26px;
        line-height:1.25;
    }

    .cta-section p{
        font-size:16px;
    }

    .cta-buttons{
        display:flex;
        flex-direction:column;
        gap:12px;
        margin-top:28px;
    }

    .cta-btn{
        width:100%;
        margin:0;
        text-align:center;
    }

    .organizations{
        padding:42px 2%;
    }

    .organizations .section-title{
        margin-bottom:35px;
    }

    .organizations .section-title h2{
        font-size:26px;
    }

    .org-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap:14px;
    }

    .client-card{
        height:110px;
        padding:8px;
        border-radius:10px;
    }

    .client-card img{
        padding:6px;
    }
    /* CONTACT FORM + MAP */
    .contact-container{
    
        grid-template-columns:1fr;
    
        width:95%;
    }
    
    .map-section{
    
        width:95%;
    }
}

/* Content-only typography boost across page sections. Headings remain unchanged. */
.hero-content p,
.why-card p,
.section-subtitle,
.service-card p,
.service-card span,
.stat-box p,
.cta-section p{
    font-size:22px !important;
    font-weight:800 !important;
}

.service-card p{
    line-height:1.65 !important;
}

.service-card span{
    margin-top:auto;
}

@media(max-width:992px){
    .hero-content p,
    .why-card p,
    .section-subtitle,
    .service-card p,
    .service-card span,
    .stat-box p,
    .cta-section p{
        font-size:20px !important;
        font-weight:800 !important;
    }
}

/* Make small card background images clearer and less washed out. */
.why-card{
    background:
        linear-gradient(145deg, rgba(255,255,255,0.54), rgba(168,212,232,0.4) 70%, rgba(139,214,184,0.38)),
        linear-gradient(135deg, rgba(0,27,68,0.38), rgba(0,174,239,0.14)),
        var(--why-card-bg) center/cover no-repeat !important;
}

.service-card{
    background:
        linear-gradient(145deg, rgba(255,255,255,0.54), rgba(168,212,232,0.4), rgba(145,199,222,0.38)),
        linear-gradient(135deg, rgba(0,27,68,0.38), rgba(0,174,239,0.14)),
        var(--service-card-bg) center/cover no-repeat !important;
}

.service-card-wide{
    background:
        linear-gradient(145deg, rgba(255,255,255,0.54), rgba(174,226,204,0.4), rgba(135,207,176,0.38)),
        linear-gradient(135deg, rgba(0,27,68,0.38), rgba(16,185,129,0.14)),
        var(--service-card-bg) center/cover no-repeat !important;
}

.stat-box{
    background:
        linear-gradient(145deg, rgba(255,255,255,0.54), rgba(168,212,232,0.4), rgba(145,199,222,0.38)),
        linear-gradient(135deg, rgba(0,27,68,0.38), rgba(0,174,239,0.14)),
        var(--stat-card-bg) center/cover no-repeat !important;
}

.client-card{
    background:
        linear-gradient(145deg, rgba(255,255,255,0.58), rgba(168,218,238,0.4)),
        linear-gradient(135deg, rgba(0,27,68,0.28), rgba(0,174,239,0.12)) !important;
}

.why-card p,
.service-card p,
.service-card span,
.stat-box h2,
.stat-box p{
    text-shadow:0 1px 12px rgba(255,255,255,0.78);
}

@media(max-width:768px){
    .hero-content p,
    .why-card p,
    .section-subtitle,
    .service-card p,
    .service-card span,
    .stat-box p,
    .cta-section p{
        font-size:17px !important;
        font-weight:800 !important;
    }

    .service-card h3,
    .service-card-wide h3{
        font-size:22px !important;
        font-weight:900 !important;
    }
}

@media(max-width:992px){
    .service-card h3,
    .service-card-wide h3{
        font-size:24px !important;
        font-weight:900 !important;
    }
}

@media(max-width:768px){
    .service-card h3,
    .service-card-wide h3{
        font-size:22px !important;
        font-weight:900 !important;
    }
}

/* Content-only color tuning. Headings stay unchanged. */
.hero-content p{
    color:#1f3654 !important;
}

.section-subtitle{
    color:#dff8ff !important;
}

.why-card p,
.service-card p,
.stat-box p{
    color:#122d4a !important;
}

.service-card span{
    color:#004f78 !important;
}

.cta-section p{
    color:#edfaff !important;
}

/* Small card content should stay readable over image cards. */
.why-card,
.why-card p,
.service-card,
.service-card p,
.service-card span,
.stat-box,
.stat-box p{
    color:#000000 !important;
}

.why-card h3,
.service-card h3,
.stat-box h2{
    color:#001b44 !important;
}

/* Principal client logos sit directly on the section background. */
.clients-showcase .org-grid{
    grid-template-columns:repeat(5, minmax(170px, 1fr));
    gap:56px 58px;
    align-items:center;
}

.clients-showcase{
    background:
        linear-gradient(135deg, rgba(255,255,255,0.96), rgba(248,253,255,0.94) 52%, rgba(240,250,255,0.92)),
        linear-gradient(90deg, rgba(0,174,239,0.06) 1px, transparent 1px),
        linear-gradient(0deg, rgba(0,174,239,0.06) 1px, transparent 1px),
        url("../assets/images/generated/clients-generated.png") center/cover no-repeat !important;
    background-size:auto, 58px 58px, 58px 58px, cover !important;
    border:1px solid rgba(0, 174, 239, 0.16);
    box-shadow:0 18px 44px rgba(0, 27, 68, 0.1);
}

.clients-showcase::before{
    background:linear-gradient(110deg, transparent 0%, rgba(0,174,239,0.08) 42%, transparent 68%) !important;
}

.clients-showcase::after{
    background:linear-gradient(90deg, #00aeef, #10b981, #f59e0b, #00aeef) !important;
}

.clients-highlight .section-title,
.clients-highlight .section-title h2{
    color:#001b44 !important;
    text-shadow:none !important;
}

.clients-highlight .section-title span{
    color:#0077b6 !important;
}

.clients-showcase .client-card{
    height:225px !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    backdrop-filter:none !important;
    overflow:visible !important;
    display:flex;
    align-items:center;
    justify-content:center;
}

.clients-showcase .client-card::before,
.clients-showcase .client-card::after{
    display:none !important;
}

.clients-showcase .client-card:hover{
    transform:translateY(-6px) scale(1.04);
    border-color:transparent !important;
    box-shadow:none !important;
    background:transparent !important;
}

.clients-showcase .client-card img{
    width:100%;
    height:100%;
    max-width:285px;
    max-height:190px;
    padding:0 !important;
    object-fit:contain;
    border-radius:0;
    opacity:1 !important;
    background:transparent !important;
    image-rendering:auto;
    filter:drop-shadow(0 12px 18px rgba(0,27,68,0.2)) saturate(1.45) contrast(1.38) brightness(1.03);
}

.clients-showcase .client-logo-round{
    width:175px !important;
    height:175px !important;
    max-width:175px !important;
    max-height:175px !important;
}

.clients-showcase .client-logo-rci{
    max-width:150px !important;
    max-height:150px !important;
}

.clients-showcase .client-logo-wide{
    max-width:285px !important;
    max-height:145px !important;
}

.clients-showcase .client-logo-bdl{
    max-width:295px !important;
    max-height:155px !important;
    filter:drop-shadow(0 12px 18px rgba(0,27,68,0.18)) saturate(1.5) contrast(1.48) brightness(1.02) !important;
}

.clients-showcase .client-logo-aurobindo{
    max-width:300px !important;
    max-height:140px !important;
    filter:drop-shadow(0 12px 18px rgba(0,27,68,0.16)) saturate(1.48) contrast(1.42) brightness(1.02) !important;
}

.clients-showcase .client-logo-asl{
    filter:drop-shadow(0 12px 18px rgba(0,27,68,0.22)) saturate(1.36) contrast(1.28) brightness(1.04) !important;
}

.clients-showcase .client-logo-principal{
    width:175px !important;
    height:175px !important;
    max-width:175px !important;
    max-height:175px !important;
}

.clients-showcase .client-card:hover img{
    transform:scale(1.06);
    filter:drop-shadow(0 16px 24px rgba(0,27,68,0.28)) saturate(1.32) contrast(1.24) brightness(1.05);
}

.clients-showcase .client-card:hover .client-logo-drdl,
.clients-showcase .client-card:hover .client-logo-asl,
.clients-showcase .client-card:hover .client-logo-ecil,
.clients-showcase .client-card:hover .client-logo-nfc,
.clients-showcase .client-card:hover .client-logo-bdl,
.clients-showcase .client-card:hover .client-logo-aurobindo{
    filter:drop-shadow(0 16px 24px rgba(0,27,68,0.28)) saturate(1.56) contrast(1.42) brightness(1.06) !important;
}

@media(max-width:992px){
    .clients-showcase .org-grid{
        grid-template-columns:repeat(3, minmax(140px, 1fr));
        gap:34px 32px;
    }

    .clients-showcase .client-card{
        height:180px !important;
    }

    .clients-showcase .client-card img{
        max-width:210px;
        max-height:140px;
    }

    .clients-showcase .client-logo-ecil,
    .clients-showcase .client-logo-nfc,
    .clients-showcase .client-logo-drdl,
    .clients-showcase .client-logo-asl,
    .clients-showcase .client-logo-round,
    .clients-showcase .client-logo-principal{
        width:165px !important;
        height:165px !important;
        max-width:165px !important;
        max-height:165px !important;
    }
}

@media(max-width:768px){
    .clients-showcase .org-grid{
        grid-template-columns:repeat(2, minmax(120px, 1fr));
        gap:26px 24px;
    }

    .clients-showcase .client-card{
        height:135px !important;
    }

    .clients-showcase .client-card img{
        max-width:165px;
        max-height:112px;
    }

    .clients-showcase .client-logo-ecil,
    .clients-showcase .client-logo-nfc,
    .clients-showcase .client-logo-drdl,
    .clients-showcase .client-logo-asl,
    .clients-showcase .client-logo-round,
    .clients-showcase .client-logo-principal{
        width:132px !important;
        height:132px !important;
        max-width:132px !important;
        max-height:132px !important;
    }
}

/* Responsive refinement: tablet keeps compact rows; small phones stack cleanly. */
@media(min-width:641px) and (max-width:768px){
    section{
        padding:48px 4%;
    }

    .why-grid,
    .service-grid,
    .stats{
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap:16px;
    }

    .service-card-wide{
        grid-column:span 2;
    }

    .why-card,
    .service-card{
        min-height:210px;
        padding:20px 16px;
    }

    .org-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }

    .hero-content p,
    .why-card p,
    .section-subtitle,
    .service-card p,
    .service-card span,
    .stat-box p,
    .cta-section p{
        font-size:16px !important;
        line-height:1.58 !important;
    }
}

@media(max-width:640px){
    :root{
        --site-header-height:78px;
    }

    body{
        padding-top:var(--site-header-height);
    }

    #nav_blk{
        height:var(--site-header-height);
        padding:8px 12px;
    }

    .logo_blk{
        gap:6px;
    }

    .logo_blk img{
        width:42px;
        height:42px;
    }

    .logo-text{
        padding-top:9px;
    }

    .logo-text h1{
        font-size:12px;
    }

    .tagline{
        font-size:4.8px;
        letter-spacing:0.65px;
        line-height:1.25;
    }

    .menu-toggle{
        width:36px;
        height:36px;
        border-radius:11px;
    }

    .menu-toggle::before{
        font-size:24px;
    }

    .content_blk{
        top:var(--site-header-height);
        height:calc(100vh - var(--site-header-height));
        padding:14px;
    }

    .content_blk ul{
        gap:8px;
        padding:0 12px;
    }

    .content_blk ul li a,
    .submenu li a,
    .submenu-side li a{
        padding:11px 12px;
        border-radius:13px;
        font-size:12px;
    }

    .submenu,
    .submenu-side{
        padding:8px !important;
        gap:7px;
        border-radius:14px;
    }

    .banner-container{
        width:94%;
        height:auto;
        min-height:0;
        aspect-ratio:1672 / 941;
        margin:10px auto 18px;
        margin-left:auto;
        margin-right:auto;
        left:auto;
        right:auto;
        padding:0 !important;
        border-radius:12px;
        overflow:hidden;
        background:#001b44;
        box-shadow:0 10px 24px rgba(0,27,68,0.14);
    }

    .carousel{
        width:100%;
        height:auto;
        aspect-ratio:1672 / 941;
        border-radius:12px;
        background:#001b44;
    }

    .carousel-slide img{
        object-fit:contain !important;
        object-position:center;
        background:#001b44;
    }

    .carousel-btn{
        width:30px;
        height:30px;
        font-size:17px;
        border-width:1px;
        background:rgba(255,255,255,0.42);
        color:#001b44;
    }

    .carousel-btn.prev{
        left:7px;
    }

    .carousel-btn.next{
        right:7px;
    }

    .carousel-controls{
        bottom:7px;
    }

    .indicator{
        width:8px;
        height:8px;
    }

    .hero-container,
    .cta-section{
        width:94%;
    }

    .hero-container{
        margin:18px auto;
        padding:16px 12px;
        border-radius:12px;
    }

    .hero-content h1{
        font-size:21px;
        line-height:1.18;
        margin-bottom:12px;
    }

    .section-title h2,
    .organizations .section-title h2{
        font-size:20px;
        line-height:1.18;
    }

    section,
    .why-highlight,
    .products-highlight,
    .stats-highlight,
    .clients-highlight,
    .organizations{
        padding:28px 3%;
    }

    .section-title{
        margin-bottom:18px;
    }

    .why-grid,
    .service-grid,
    .stats{
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap:8px;
    }

    .service-card-wide{
        grid-column:auto;
    }

    .why-card,
    .service-card,
    .stat-box{
        min-height:auto;
        padding:12px 9px;
        border-radius:10px;
    }

    .why-card i,
    .service-card i{
        width:34px;
        height:34px;
        margin-bottom:8px;
        border-radius:10px;
        font-size:15px;
    }

    .why-card h3,
    .service-card h3,
    .service-card-wide h3{
        font-size:13px !important;
        line-height:1.15;
        padding:4px 6px;
        border-left-width:2px;
        border-radius:6px;
        margin-bottom:7px;
    }

    .hero-content p,
    .why-card p,
    .why-us .section-title p,
    .section-subtitle,
    .service-card p,
    .service-card span,
    .stat-box p,
    .cta-section p{
        font-size:11px !important;
        line-height:1.38 !important;
        font-weight:700 !important;
    }

    .hero-content p{
        font-size:12.5px !important;
        line-height:1.45 !important;
        margin-bottom:10px;
    }

    .service-card span{
        margin-top:8px;
        padding:5px 6px;
        gap:4px;
        border-radius:999px;
    }

    .service-card span::after{
        display:none;
    }

    .stats{
        padding:14px 10px;
    }

    .stat-box h2{
        font-size:24px;
    }

    .cta-section{
        margin:28px auto;
        padding:28px 14px;
    }

    .cta-section h2{
        font-size:22px;
    }

    .cta-btn{
        padding:11px 14px;
        font-size:13px;
    }
}

@media(max-width:992px){
    .content_blk .dropdown-side.active > .submenu-side{
        display:flex !important;
        opacity:1 !important;
        visibility:visible !important;
        max-height:none !important;
        margin-top:10px;
        padding:10px;
        overflow:visible;
        flex-direction:column !important;
    }
}

/* Banner fit refinement: keep the certification artwork fully visible. */
.banner-container,
.carousel{
    background:#ffffff !important;
}

.carousel-slide{
    background:#ffffff !important;
}

.carousel-slide img{
    object-fit:cover !important;
    object-position:center !important;
    background:transparent !important;
}

/* Final responsive pass: compact homepage sections for tablet and mobile. */
@media(max-width:1024px){
    html,
    body{
        overflow-x:hidden;
    }

    body{
        padding-top:92px;
    }

    #nav_blk{
        height:92px;
        padding:8px clamp(12px, 3vw, 22px);
    }

    .logo_blk{
        max-width:calc(100% - 58px);
        min-width:0;
        gap:9px;
        overflow:hidden;
    }

    .logo_blk img{
        flex:0 0 auto;
        width:58px;
        height:58px;
        object-fit:contain;
    }

    .logo-text{
        min-width:0;
        padding-top:0;
        align-items:flex-start;
        text-align:left;
    }

    .logo-text h1{
        max-width:100%;
        overflow:hidden;
        font-size:clamp(16px, 3.2vw, 28px);
        line-height:1;
        white-space:nowrap;
        text-overflow:ellipsis;
    }

    .tagline{
        max-width:100%;
        padding-left:0;
        margin-top:4px;
        overflow:hidden;
        font-size:clamp(5.5px, 1.15vw, 9px);
        line-height:1.15;
        letter-spacing:0.8px;
        white-space:nowrap;
        text-overflow:ellipsis;
        -webkit-text-stroke:0.3px rgba(0,0,0,0.72);
    }

    .menu-toggle{
        width:42px;
        height:42px;
        border-radius:12px;
    }

    .content_blk{
        top:92px;
        height:calc(100vh - 92px);
    }

    .banner-container,
    .hero-container,
    .cta-section{
        width:min(94%, 960px);
    }

    .hero-container{
        margin:24px auto;
        padding:24px 20px;
        border-radius:16px;
    }

    .hero-content h1{
        margin-bottom:14px;
        font-size:clamp(24px, 4vw, 36px);
        line-height:1.16;
    }

    .hero-content p{
        margin-bottom:16px;
        color:#1f3654 !important;
        font-size:14px !important;
        font-weight:600 !important;
        line-height:1.58 !important;
        text-align:left;
    }

    .hero-btn{
        padding:11px 22px;
        font-size:14px;
    }

    section,
    .why-highlight,
    .products-highlight,
    .stats-highlight,
    .clients-highlight,
    .organizations{
        padding:42px 4%;
    }

    .section-title{
        margin-bottom:24px;
    }

    .section-title h2,
    .organizations .section-title h2{
        font-size:clamp(24px, 4vw, 34px);
        font-weight:800;
        line-height:1.16;
    }

    .section-subtitle,
    .why-us .section-title p{
        font-size:14px !important;
        font-weight:600 !important;
        line-height:1.45 !important;
    }

    .why-grid,
    .service-grid,
    .stats,
    .org-grid,
    .clients-showcase .org-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
        gap:16px !important;
    }

    .service-card-wide{
        grid-column:auto !important;
    }

    .why-card,
    .service-card,
    .stat-box{
        min-height:0;
        padding:18px 14px;
        border-radius:14px;
    }

    .why-card i,
    .service-card i{
        width:38px;
        height:38px;
        margin-bottom:10px;
        border-radius:11px;
        font-size:16px;
    }

    .why-card h3,
    .service-card h3,
    .service-card-wide h3{
        margin-bottom:8px;
        padding:5px 7px;
        font-size:clamp(14px, 2.4vw, 18px) !important;
        font-weight:800 !important;
        line-height:1.16;
    }

    .why-card p,
    .service-card p,
    .service-card span,
    .stat-box p,
    .cta-section p{
        font-size:13px !important;
        font-weight:600 !important;
        line-height:1.42 !important;
    }

    .service-card span{
        margin-top:10px;
        padding:7px 10px;
        font-size:12px !important;
    }

    .stats{
        padding:0 !important;
    }

    .stat-box{
        min-height:128px;
    }

    .stat-box h2{
        margin-bottom:8px;
        font-size:38px;
        font-weight:800;
    }

    .clients-showcase .client-card,
    .client-card{
        height:145px !important;
        padding:6px !important;
        overflow:hidden !important;
    }

    .clients-showcase .client-card img,
    .client-card img{
        width:100%;
        height:100%;
        max-width:160px !important;
        max-height:118px !important;
        padding:0 !important;
        object-fit:contain;
    }

    .clients-showcase .client-logo-ecil,
    .clients-showcase .client-logo-nfc,
    .clients-showcase .client-logo-drdl,
    .clients-showcase .client-logo-asl,
    .clients-showcase .client-logo-round,
    .clients-showcase .client-logo-principal{
        width:118px !important;
        height:118px !important;
        max-width:118px !important;
        max-height:118px !important;
    }

    .clients-showcase .client-logo-bdl,
    .clients-showcase .client-logo-aurobindo,
    .clients-showcase .client-logo-wide{
        max-width:160px !important;
        max-height:90px !important;
    }

    .cta-section{
        margin:34px auto;
        padding:40px 24px;
        border-radius:18px;
    }

    .cta-section h2{
        font-size:clamp(24px, 4vw, 34px);
        line-height:1.18;
    }
}

@media(max-width:640px){
    body{
        padding-top:74px;
    }

    #nav_blk{
        height:74px;
        padding:7px 10px;
    }

    .logo_blk{
        max-width:calc(100% - 44px);
        gap:6px;
    }

    .logo_blk img{
        width:40px;
        height:40px;
    }

    .logo-text h1{
        font-size:13px;
    }

    .tagline{
        margin-top:3px;
        font-size:5px;
        letter-spacing:0.45px;
    }

    .menu-toggle{
        width:36px;
        height:36px;
        border-radius:10px;
    }

    .menu-toggle::before{
        font-size:23px;
    }

    .content_blk{
        top:74px;
        height:calc(100vh - 74px);
        padding:12px;
    }

    .content_blk > ul{
        gap:7px;
        padding:0;
    }

    .content_blk ul li a,
    .submenu li a,
    .submenu-side li a{
        padding:10px 11px;
        border-radius:12px;
        font-size:12px;
        font-weight:700;
        line-height:1.2;
    }

    .banner-container{
        width:100%;
        margin:0 auto 12px;
        border-radius:0;
    }

    .carousel{
        border-radius:0;
    }

    .carousel-slide img{
        object-fit:contain !important;
    }

    .hero-container,
    .cta-section{
        width:96%;
    }

    .hero-container{
        margin:14px auto;
        padding:14px 10px;
        border-radius:12px;
    }

    .hero-content h1{
        margin-bottom:10px;
        font-size:20px;
        line-height:1.16;
    }

    .hero-content p{
        margin-bottom:9px;
        font-size:11.5px !important;
        font-weight:500 !important;
        line-height:1.42 !important;
    }

    .hero-btn{
        width:100%;
        padding:10px 14px;
        font-size:12px;
        text-align:center;
    }

    section,
    .why-highlight,
    .products-highlight,
    .stats-highlight,
    .clients-highlight,
    .organizations{
        padding:22px 2.5%;
    }

    .section-title{
        margin-bottom:14px;
    }

    .section-title h2,
    .organizations .section-title h2{
        font-size:18px;
        font-weight:800;
        line-height:1.16;
    }

    .section-subtitle,
    .why-us .section-title p{
        font-size:10.5px !important;
        font-weight:500 !important;
        line-height:1.34 !important;
    }

    .why-grid,
    .service-grid,
    .stats,
    .org-grid,
    .clients-showcase .org-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
        gap:8px !important;
    }

    .why-card,
    .service-card,
    .stat-box{
        min-height:0 !important;
        padding:10px 7px !important;
        border-radius:9px !important;
        box-shadow:0 10px 22px rgba(0,27,68,0.12);
    }

    .service-card{
        min-height:156px !important;
    }

    .why-card i,
    .service-card i{
        width:28px;
        height:28px;
        margin-bottom:6px;
        border-radius:8px;
        font-size:12px;
    }

    .why-card h3,
    .service-card h3,
    .service-card-wide h3{
        margin-bottom:5px;
        padding:3px 4px;
        border-left-width:2px;
        border-radius:5px;
        font-size:10.6px !important;
        font-weight:700 !important;
        line-height:1.12;
        overflow-wrap:anywhere;
    }

    .why-card p,
    .service-card p,
    .service-card span,
    .stat-box p,
    .cta-section p{
        font-size:9.2px !important;
        font-weight:500 !important;
        line-height:1.28 !important;
    }

    .service-card span{
        margin-top:6px;
        padding:4px 5px;
        font-size:8.8px !important;
        line-height:1.15 !important;
        letter-spacing:1px;
    }

    .service-card span::after{
        display:none;
    }

    .stats{
        padding:0 !important;
    }

    .stat-box{
        min-height:82px !important;
        display:grid;
        align-content:center;
    }

    .stat-box h2{
        margin-bottom:5px;
        font-size:22px;
        font-weight:800;
    }

    .clients-showcase .org-grid{
        align-items:center;
        justify-items:center;
    }

    .clients-showcase .client-card,
    .client-card{
        height:94px !important;
        padding:4px !important;
        overflow:hidden !important;
    }

    .clients-showcase .client-card img,
    .client-card img{
        max-width:96px !important;
        max-height:78px !important;
    }

    .clients-showcase .client-logo-ecil,
    .clients-showcase .client-logo-nfc,
    .clients-showcase .client-logo-drdl,
    .clients-showcase .client-logo-asl,
    .clients-showcase .client-logo-round,
    .clients-showcase .client-logo-principal{
        width:78px !important;
        height:78px !important;
        max-width:78px !important;
        max-height:78px !important;
    }

    .clients-showcase .client-logo-rci{
        max-width:68px !important;
        max-height:78px !important;
    }

    .clients-showcase .client-logo-bdl,
    .clients-showcase .client-logo-aurobindo,
    .clients-showcase .client-logo-wide{
        max-width:98px !important;
        max-height:58px !important;
    }

    .cta-section{
        margin:22px auto;
        padding:24px 12px;
        border-radius:14px;
    }

    .cta-section h2{
        margin-bottom:10px;
        font-size:18px;
        line-height:1.18;
    }

    .cta-buttons{
        gap:8px;
        margin-top:16px;
    }

    .cta-btn{
        padding:9px 12px;
        font-size:11px;
    }
}

@media(max-width:380px){
    .logo_blk img{
        width:36px;
        height:36px;
    }

    .logo-text h1{
        font-size:12px;
    }

    .tagline{
        font-size:4.5px;
        letter-spacing:0.35px;
    }

    .hero-container{
        padding:12px 9px;
    }

    .hero-content h1{
        font-size:18px;
    }

    .hero-content p{
        font-size:10.8px !important;
    }

    .why-card,
    .service-card{
        padding:9px 6px !important;
    }

    .service-card{
        min-height:148px !important;
    }

    .why-card h3,
    .service-card h3,
    .service-card-wide h3{
        font-size:9.8px !important;
    }

    .why-card p,
    .service-card p,
    .service-card span,
    .stat-box p{
        font-size:8.6px !important;
    }

    .clients-showcase .client-card,
    .client-card{
        height:84px !important;
    }

    .clients-showcase .client-card img,
    .client-card img{
        max-width:88px !important;
        max-height:68px !important;
    }

    .clients-showcase .client-logo-ecil,
    .clients-showcase .client-logo-nfc,
    .clients-showcase .client-logo-drdl,
    .clients-showcase .client-logo-asl,
    .clients-showcase .client-logo-round,
    .clients-showcase .client-logo-principal{
        width:68px !important;
        height:68px !important;
        max-width:68px !important;
        max-height:68px !important;
    }
}

/* Header size boost for compact mobile/tablet views. */
@media(max-width:1024px){
    .logo_blk img{
        width:68px;
        height:68px;
    }

    .logo-text h1{
        font-size:clamp(20px, 3.4vw, 30px);
    }

    .tagline{
        font-size:clamp(7px, 1.18vw, 10px);
        letter-spacing:0.75px;
    }
}

@media(max-width:640px){
    body{
        padding-top:82px;
    }

    #nav_blk{
        height:82px;
        padding:8px 10px;
    }

    .logo_blk{
        max-width:calc(100% - 46px);
        gap:7px;
    }

    .logo_blk img{
        width:48px;
        height:48px;
    }

    .logo-text h1{
        font-size:16px;
    }

    .tagline{
        font-size:6.2px;
        letter-spacing:0.45px;
        line-height:1.18;
    }

    .content_blk{
        top:82px;
        height:calc(100vh - 82px);
    }
}

@media(min-width:641px) and (max-width:1024px){
    .banner-container{
        width:100%;
        height:auto;
        min-height:0;
        aspect-ratio:1672 / 941;
        left:auto;
        right:auto;
        margin:0 auto 18px;
        margin-left:auto;
        margin-right:auto;
        padding:0;
        overflow:hidden;
        border-radius:0;
        background:#ffffff !important;
    }

    .carousel{
        width:100%;
        height:100%;
        aspect-ratio:1672 / 941;
        border-radius:0;
        background:#ffffff !important;
    }

    .carousel-slide img{
        width:100%;
        height:100%;
        object-fit:contain !important;
        object-position:center !important;
        background:#ffffff !important;
    }

    .carousel-btn{
        width:48px;
        height:48px;
        font-size:28px;
    }

    .carousel-btn.prev{
        left:16px;
    }

    .carousel-btn.next{
        right:16px;
    }
}

@media(max-width:380px){
    .logo_blk img{
        width:44px;
        height:44px;
    }

    .logo-text h1{
        font-size:14.5px;
    }

    .tagline{
        font-size:5.6px;
        letter-spacing:0.35px;
    }
}

/* Deployment alignment fixes for desktop and laptop widths. */
@media(min-width:1181px){
    :root{
        --site-header-height:104px;
    }

    body{
        padding-top:var(--site-header-height);
    }

    #nav_blk{
        height:var(--site-header-height);
        gap:18px;
        padding:0 24px;
    }

    .logo_blk{
        flex:0 1 auto;
        min-width:0;
        gap:10px;
    }

    .logo_blk img{
        width:82px;
        height:82px;
        object-fit:contain;
    }

    .logo-text{
        flex:0 1 auto;
        min-width:0;
    }

    .logo-text h1{
        max-width:none;
        overflow:visible;
        font-size:32px;
        line-height:1;
        letter-spacing:0;
        white-space:nowrap;
        text-overflow:clip;
    }

    .tagline{
        max-width:none;
        padding-left:10px;
        margin-top:6px;
        overflow:visible;
        font-size:10.5px;
        line-height:1.15;
        letter-spacing:0;
        white-space:nowrap;
        text-overflow:clip;
        -webkit-text-stroke:0.45px rgba(0,0,0,0.74);
    }

    .content_blk{
        flex:1 1 auto;
        min-width:0;
        overflow:visible;
    }

    .content_blk > ul{
        flex-wrap:nowrap;
        justify-content:flex-end;
        gap:8px;
    }

    .content_blk a,
    .content_blk ul li a{
        padding:7px 8px;
        border-radius:10px;
        font-size:14px;
        line-height:1.15;
        letter-spacing:0;
    }

    .submenu li a,
    .submenu-side li a{
        padding:12px 14px;
        font-size:14px;
    }
}

@media(min-width:993px) and (max-width:1180px){
    :root{
        --site-header-height:96px;
    }

    body{
        padding-top:var(--site-header-height);
    }

    #nav_blk{
        height:var(--site-header-height);
        padding:10px 22px;
    }

    .logo_blk{
        max-width:calc(100% - 62px);
        min-width:0;
        gap:10px;
        overflow:hidden;
    }

    .logo_blk img{
        flex:0 0 auto;
        width:68px;
        height:68px;
        object-fit:contain;
    }

    .logo-text{
        min-width:0;
    }

    .logo-text h1{
        max-width:100%;
        overflow:hidden;
        font-size:28px;
        line-height:1;
        letter-spacing:0;
        white-space:nowrap;
        text-overflow:ellipsis;
    }

    .tagline{
        max-width:100%;
        padding-left:0;
        margin-top:5px;
        overflow:hidden;
        font-size:9px;
        line-height:1.15;
        letter-spacing:0;
        white-space:nowrap;
        text-overflow:ellipsis;
        -webkit-text-stroke:0.35px rgba(0,0,0,0.72);
    }

    .menu-toggle{
        display:flex;
        width:46px;
        height:46px;
        align-items:center;
        justify-content:center;
        flex:0 0 auto;
        border:1px solid rgba(0,174,239,0.22);
        border-radius:14px;
        background:linear-gradient(135deg, #ffffff, #eef8ff);
        box-shadow:0 8px 22px rgba(0,44,90,0.12);
        color:#001b44;
        font-size:0;
        line-height:1;
        z-index:1000000;
    }

    .menu-toggle::before{
        content:"\2630";
        font-size:28px;
        font-weight:800;
    }

    .menu-toggle.active::before{
        content:"\00d7";
        font-size:34px;
    }

    .content_blk{
        position:fixed;
        top:var(--site-header-height);
        left:0;
        width:100%;
        height:calc(100vh - var(--site-header-height));
        padding:22px;
        display:block;
        overflow-y:auto;
        overflow-x:hidden;
        opacity:0;
        visibility:hidden;
        transform:translateX(-100%);
        background:linear-gradient(145deg, rgba(255,255,255,0.98), rgba(232,246,255,0.98));
        border-top:1px solid rgba(0,174,239,0.12);
        box-shadow:0 20px 40px rgba(0,27,68,0.16);
        transition:transform 0.35s ease, opacity 0.35s ease, visibility 0.35s ease;
        z-index:999998;
    }

    .content_blk.active{
        opacity:1;
        visibility:visible;
        transform:translateX(0);
    }

    .content_blk > ul{
        width:min(560px, 100%);
        margin:0 auto;
        padding:0;
        display:flex;
        flex-direction:column;
        align-items:stretch;
        gap:12px;
    }

    .content_blk ul li,
    .content_blk ul li a{
        width:100%;
    }

    .content_blk ul li a{
        display:flex;
        align-items:center;
        justify-content:space-between;
        padding:15px 18px;
        border-radius:16px;
        font-size:15px;
        line-height:1.25;
        letter-spacing:0;
        background:rgba(255,255,255,0.82);
        white-space:normal;
        overflow:visible;
        text-overflow:clip;
        gap:10px;
    }

    .submenu,
    .submenu-side{
        position:static !important;
        width:100% !important;
        min-width:100% !important;
        display:none !important;
        opacity:0;
        visibility:hidden;
        max-height:0;
        margin-top:0;
        padding:0 10px;
        transform:none !important;
        flex-direction:column !important;
        gap:8px;
        overflow:hidden;
        border-radius:18px;
        background:rgba(255,255,255,0.62);
        box-shadow:inset 0 0 0 1px rgba(0,174,239,0.08);
    }

    .dropdown:hover > .submenu,
    .dropdown-side:hover > .submenu-side{
        display:none !important;
    }

    .dropdown.active > .submenu,
    .dropdown-side.active > .submenu-side{
        display:flex !important;
        opacity:1;
        visibility:visible;
        max-height:none;
        margin-top:10px;
        padding:10px;
        overflow:visible;
    }
}

/* Final visibility pass: compact cards and sections while keeping bold weights. */
@media(min-width:1181px){
    .hero-container{
        width:min(92%, 1240px);
        margin:34px auto;
        padding:32px;
        border-radius:16px;
    }

    section,
    .why-highlight,
    .products-highlight,
    .stats-highlight,
    .clients-highlight,
    .organizations{
        padding:48px 4%;
    }

    .section-title{
        margin-bottom:28px;
    }

    .section-title h2,
    .organizations .section-title h2{
        font-size:34px;
        line-height:1.16;
    }

    .section-subtitle,
    .why-us .section-title p{
        max-width:760px;
        font-size:15px !important;
        line-height:1.45 !important;
    }

    .why-grid,
    .service-grid,
    .stats{
        gap:16px;
    }

    .why-card,
    .service-card,
    .stat-box{
        min-height:0;
        padding:20px 18px;
        border-radius:14px;
        gap:10px;
    }

    .why-card i,
    .service-card i{
        width:44px;
        height:44px;
        border-radius:12px;
        font-size:19px;
    }

    .why-card h3,
    .service-card h3,
    .service-card-wide h3{
        padding:6px 8px;
        border-left-width:3px;
        border-radius:8px;
        font-size:20px !important;
        line-height:1.18;
    }

    .why-card p,
    .service-card p,
    .service-card span,
    .stat-box p,
    .cta-section p{
        font-size:14px !important;
        line-height:1.42 !important;
    }

    .service-card span{
        padding:7px 8px 7px 10px;
        letter-spacing:0.8px;
    }

    .service-card span::after{
        width:24px;
        height:24px;
        flex-basis:24px;
        font-size:11px;
    }

    .stats{
        padding:0;
    }

    .stat-box{
        min-height:128px;
    }

    .stat-box h2{
        font-size:36px;
        line-height:1.1;
    }

    .org-grid,
    .clients-showcase .org-grid{
        gap:14px;
    }

    .client-card,
    .clients-showcase .client-card{
        height:145px;
        padding:10px;
        border-radius:12px;
    }

    .client-card img,
    .clients-showcase .client-card img{
        max-width:170px !important;
        max-height:110px !important;
        object-fit:contain;
    }

    .cta-section{
        width:min(92%, 1240px);
        margin:42px auto;
        padding:44px 32px;
        border-radius:18px;
    }

    .cta-section h2{
        font-size:34px;
        line-height:1.16;
    }
}

@media(min-width:1181px) and (max-width:1400px){
    .hero-container{
        width:91%;
        padding:28px 24px;
    }

    .why-grid,
    .service-grid,
    .stats{
        gap:14px;
    }

    .why-card,
    .service-card,
    .stat-box{
        padding:18px 16px;
    }

    .why-card h3,
    .service-card h3,
    .service-card-wide h3{
        font-size:18px !important;
    }

    .why-card p,
    .service-card p,
    .service-card span,
    .stat-box p,
    .cta-section p{
        font-size:13px !important;
        line-height:1.38 !important;
    }

    .section-title h2,
    .organizations .section-title h2,
    .cta-section h2{
        font-size:31px;
    }
}

/* Keep the certification banner fully visible on desktop. */
@media(min-width:1181px){
    .banner-container{
        height:auto;
        min-height:0;
        aspect-ratio:1672 / 941;
    }

    .carousel{
        height:100%;
        aspect-ratio:1672 / 941;
    }

    .carousel-slide img{
        object-fit:contain !important;
        object-position:center !important;
    }
}

/* Latest desktop fit pass for deployed viewport screenshots. */
@media(min-width:1181px){
    .banner-container{
        height:calc(100vh - var(--site-header-height));
        height:calc(100svh - var(--site-header-height));
        min-height:0;
        max-height:calc(100vh - var(--site-header-height));
        max-height:calc(100svh - var(--site-header-height));
        aspect-ratio:auto;
        display:grid;
        place-items:center;
        background:#050b26 !important;
    }

    .carousel{
        width:100%;
        height:100%;
        aspect-ratio:auto;
        background:#050b26 !important;
    }

    .carousel-slide img{
        width:100%;
        height:100%;
        object-fit:contain !important;
        object-position:center !important;
        background:#050b26 !important;
    }

    .intro-showcase{
        width:min(92%, 1240px);
        margin:28px auto;
        padding:30px 28px;
        border-radius:16px;
    }

    .intro-showcase .hero-content h1{
        margin-bottom:16px;
        font-size:38px;
        line-height:1.14;
        letter-spacing:0;
    }

    .intro-showcase .hero-content p{
        margin-bottom:13px;
        color:#1f3654 !important;
        font-size:15px !important;
        font-weight:800 !important;
        line-height:1.48 !important;
        letter-spacing:0;
        word-spacing:0;
        text-align:left;
    }

    .intro-showcase .hero-btn{
        margin-top:4px;
        padding:11px 24px;
        font-size:14px;
    }

    .clients-showcase{
        width:min(92%, 1240px);
        margin:30px auto;
        padding:20px 22px;
        border-radius:16px;
    }

    .clients-showcase .clients-highlight,
    .clients-showcase .organizations{
        padding:24px 2.5% !important;
    }

    .clients-showcase .section-title{
        margin-bottom:18px;
    }

    .clients-showcase .section-title h2{
        font-size:30px;
        line-height:1.16;
    }

    .clients-showcase .org-grid{
        grid-template-columns:repeat(5, minmax(0, 1fr)) !important;
        gap:10px 14px !important;
        align-items:center;
    }

    .clients-showcase .client-card{
        height:108px !important;
        min-height:0;
        padding:6px !important;
        overflow:visible !important;
    }

    .clients-showcase .client-card img{
        max-width:145px !important;
        max-height:78px !important;
        object-fit:contain;
    }

    .clients-showcase .client-logo-round,
    .clients-showcase .client-logo-principal{
        width:76px !important;
        height:76px !important;
        max-width:76px !important;
        max-height:76px !important;
    }

    .clients-showcase .client-logo-rci{
        max-width:74px !important;
        max-height:74px !important;
    }

    .clients-showcase .client-logo-wide,
    .clients-showcase .client-logo-bdl,
    .clients-showcase .client-logo-aurobindo{
        max-width:145px !important;
        max-height:58px !important;
    }
}

@media(min-width:1181px) and (max-width:1400px){
    .intro-showcase{
        width:90%;
        padding:26px 24px;
    }

    .intro-showcase .hero-content h1{
        font-size:34px;
    }

    .intro-showcase .hero-content p{
        font-size:14px !important;
        line-height:1.44 !important;
    }

    .clients-showcase{
        width:90%;
        padding:18px 20px;
    }

    .clients-showcase .clients-highlight,
    .clients-showcase .organizations{
        padding:22px 2% !important;
    }

    .clients-showcase .section-title h2{
        font-size:28px;
    }

    .clients-showcase .client-card{
        height:96px !important;
    }

    .clients-showcase .client-card img{
        max-width:132px !important;
        max-height:68px !important;
    }

    .clients-showcase .client-logo-round,
    .clients-showcase .client-logo-principal{
        width:68px !important;
        height:68px !important;
        max-width:68px !important;
        max-height:68px !important;
    }

    .clients-showcase .client-logo-rci{
        max-width:66px !important;
        max-height:66px !important;
    }

    .clients-showcase .client-logo-wide,
    .clients-showcase .client-logo-bdl,
    .clients-showcase .client-logo-aurobindo{
        max-width:132px !important;
        max-height:52px !important;
    }
}