:root{
  --blue:#336699;
  --blue-dark:#17334d;
  --blue-deep:#0b1e2e;
  --green:#719e0d;
  --green-bright:#8ab51a;
  --ink:#10202d;
  --muted:#687581;
  --line:#dce4e9;
  --paper:#f6f8f9;
  --white:#fff;
  --max:1240px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:#fff;line-height:1.65;overflow-x:hidden}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.container{width:min(calc(100% - 64px),var(--max));margin-inline:auto}

.topbar{background:var(--blue-deep);color:#c5d3dc;font-size:10px;letter-spacing:.14em;text-transform:uppercase}
.topbar-inner{height:34px;display:flex;align-items:center;justify-content:space-between}
.site-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.95);backdrop-filter:blur(14px);border-bottom:1px solid rgba(220,228,233,.85)}
.nav-wrap{height:92px;display:flex;align-items:center;justify-content:space-between;gap:30px}
.brand{width:220px}
.main-nav{display:flex;align-items:center;gap:30px;font-size:12px;font-weight:750}
.main-nav>a{position:relative;color:#465661;transition:.25s}
.main-nav>a:not(.nav-cta)::after{content:"";position:absolute;left:0;bottom:-9px;width:0;height:2px;background:var(--green);transition:.25s}
.main-nav>a:hover,.main-nav>a.active{color:var(--blue)}
.main-nav>a:hover::after,.main-nav>a.active::after{width:100%}
.nav-cta{background:var(--blue);color:#fff!important;padding:12px 17px;border-radius:6px}
.nav-cta:hover{background:var(--blue-dark)}
.menu-toggle{display:none;border:0;background:none;width:42px;height:42px;cursor:pointer}
.menu-toggle span{display:block;width:24px;height:2px;background:var(--ink);margin:5px auto}

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

.hero-banner {
    position: relative;
    min-height: 650px;
    width: 100%;
    overflow: hidden;
    background: #10283b;
    color: #ffffff;
    display: flex;
    align-items: center;
}

/* ---------------------------------------------------------
   BACKGROUND IMAGE
--------------------------------------------------------- */

.hero-banner__image {
    position: absolute;
    inset: 0;
    z-index: 0;

    background-image: url("images/hero-sheq.jpg");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;

    transform: scale(1.01);
}

/* ---------------------------------------------------------
   IMAGE OVERLAY
--------------------------------------------------------- */

.hero-banner__overlay {
    position: absolute;
    inset: 0;
    z-index: 1;

    background:
        linear-gradient(
            90deg,
            rgba(6, 25, 40, 0.94) 0%,
            rgba(8, 29, 45, 0.87) 34%,
            rgba(8, 29, 45, 0.48) 65%,
            rgba(8, 29, 45, 0.30) 100%
        );
}

/* Additional subtle bottom fade */

.hero-banner__overlay::after {
    content: "";
    position: absolute;
    inset: auto 0 0 0;
    height: 180px;

    background: linear-gradient(
        to top,
        rgba(5, 21, 32, 0.55),
        transparent
    );
}


/* ---------------------------------------------------------
   MAIN CONTAINER
--------------------------------------------------------- */

.hero-banner__container {
    position: relative;
    z-index: 3;

    min-height: 650px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding-top: 80px;
    padding-bottom: 105px;
}


/* ---------------------------------------------------------
   HERO CONTENT
--------------------------------------------------------- */

.hero-banner__content {
    width: 100%;
    max-width: 720px;

    /*
       This is the important alignment.
       The content now follows the exact same
       .container width as the rest of the website.
    */
}

.hero-eyebrow {
    display: flex;
    align-items: center;
    gap: 12px;

    margin-bottom: 22px;

    color: #8ab51a;

    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.22em;
    text-transform: uppercase;
}

.hero-eyebrow span {
    display: inline-block;

    width: 34px;
    height: 2px;

    background: #8ab51a;
}


/* ---------------------------------------------------------
   HERO HEADING
--------------------------------------------------------- */

.hero-banner h1 {
    margin: 0;

    max-width: 720px;

    font-size: clamp(48px, 5.3vw, 78px);
    line-height: 0.98;

    font-weight: 800;

    letter-spacing: -0.055em;

    color: #ffffff;
}

.hero-banner h1 em {
    font-style: normal;
    color: #8ab51a;
}


/* ---------------------------------------------------------
   HERO DESCRIPTION
--------------------------------------------------------- */

.hero-banner__content > p {
    max-width: 610px;

    margin-top: 27px;

    color: rgba(255, 255, 255, 0.88);

    font-size: 16px;
    line-height: 1.75;
}


/* ---------------------------------------------------------
   HERO BUTTONS
--------------------------------------------------------- */

.hero-banner__actions {
    display: flex;
    align-items: center;
    gap: 14px;

    margin-top: 34px;
}

.hero-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 14px;

    min-height: 48px;

    padding: 0 21px;

    border-radius: 6px;

    font-size: 11px;
    font-weight: 800;

    letter-spacing: 0.08em;
    text-transform: uppercase;

    transition:
        background-color 0.25s ease,
        color 0.25s ease,
        transform 0.25s ease;
}

.hero-btn span {
    font-size: 17px;
    line-height: 1;
}


/* Primary */

.hero-btn--primary {
    background: #719e0d;
    color: #ffffff;
}

.hero-btn--primary:hover {
    background: #83b213;
    transform: translateY(-2px);
}


/* Outline */

.hero-btn--outline {
    border: 1px solid rgba(255, 255, 255, 0.75);

    color: #ffffff;

    background: rgba(255, 255, 255, 0.04);
}

.hero-btn--outline:hover {
    background: #ffffff;
    color: #17334d;

    transform: translateY(-2px);
}


/* ---------------------------------------------------------
   RIGHT INFORMATION PANEL
--------------------------------------------------------- */

.hero-banner__side-info {
    position: relative;

    display: flex;
    flex-direction: column;

    gap: 17px;

    width: 190px;

    margin-left: 40px;
}

.side-line {
    position: absolute;

    left: -16px;
    top: 2px;

    width: 2px;
    height: calc(100% - 4px);

    background: #719e0d;
}

.side-info-item {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.side-info-item strong {
    color: #ffffff;

    font-size: 10px;
    font-weight: 800;

    letter-spacing: 0.13em;
}

.side-info-item span {
    color: rgba(255, 255, 255, 0.62);

    font-size: 9px;
    line-height: 1.4;
}


/* ---------------------------------------------------------
   BOTTOM HERO BAR
--------------------------------------------------------- */

.hero-banner__bottom {
    position: absolute;

    left: 0;
    right: 0;
    bottom: 0;

    z-index: 4;

    background: rgba(5, 22, 34, 0.72);

    border-top: 1px solid rgba(255, 255, 255, 0.12);

    backdrop-filter: blur(8px);
}

.hero-banner__bottom-inner {
    min-height: 54px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 30px;
}

.hero-bottom-label {
    display: flex;
    align-items: center;
    gap: 9px;

    color: #ffffff;

    font-size: 9px;
    font-weight: 800;

    letter-spacing: 0.13em;
}

.hero-bottom-label span {
    color: #8ab51a;

    font-size: 14px;
}

.hero-bottom-points {
    display: flex;
    align-items: center;
    gap: 13px;

    color: rgba(255, 255, 255, 0.8);

    font-size: 8px;
    font-weight: 700;

    letter-spacing: 0.12em;
}

.hero-bottom-points i {
    display: block;

    width: 4px;
    height: 4px;

    background: #719e0d;

    border-radius: 50%;
}


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

@media (max-width: 1000px) {

    .hero-banner {
        min-height: 610px;
    }

    .hero-banner__container {
        min-height: 610px;

        padding-top: 70px;
        padding-bottom: 100px;
    }

    .hero-banner__content {
        max-width: 650px;
    }

    .hero-banner h1 {
        font-size: clamp(45px, 6vw, 68px);
    }

    .hero-banner__side-info {
        width: 145px;
        margin-left: 25px;
    }

    .hero-bottom-points {
        gap: 8px;
    }
}


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

@media (max-width: 760px) {

    .hero-banner {
        min-height: 690px;
    }

    .hero-banner__image {
        background-position: 62% center;
    }

    .hero-banner__overlay {
        background:
            linear-gradient(
                90deg,
                rgba(6, 25, 40, 0.94) 0%,
                rgba(8, 29, 45, 0.83) 75%,
                rgba(8, 29, 45, 0.65) 100%
            );
    }

    .hero-banner__container {
        min-height: 690px;

        align-items: flex-start;

        padding-top: 85px;
        padding-bottom: 95px;
    }

    .hero-banner__content {
        max-width: 100%;
    }

    .hero-banner h1 {
        max-width: 100%;

        font-size: clamp(42px, 11vw, 58px);
        line-height: 1;

        letter-spacing: -0.045em;
    }

    .hero-banner__content > p {
        max-width: 570px;

        margin-top: 22px;

        font-size: 14px;
        line-height: 1.7;
    }

    .hero-banner__actions {
        margin-top: 27px;
    }

    .hero-banner__side-info {
        display: none;
    }

    .hero-banner__bottom-inner {
        min-height: 52px;

        justify-content: center;
    }

    .hero-bottom-label {
        display: none;
    }

    .hero-bottom-points {
        justify-content: center;

        flex-wrap: wrap;

        font-size: 7px;

        gap: 9px;
    }
}


/* =========================================================
   SMALL PHONES
========================================================= */

@media (max-width: 480px) {

    .hero-banner {
        min-height: 650px;
    }

    .hero-banner__container {
        min-height: 650px;

        padding-top: 72px;
        padding-bottom: 90px;
    }

    .hero-eyebrow {
        font-size: 9px;
        letter-spacing: 0.18em;

        margin-bottom: 18px;
    }

    .hero-eyebrow span {
        width: 25px;
    }

    .hero-banner h1 {
        font-size: 43px;
        line-height: 1.02;
    }

    .hero-banner__content > p {
        font-size: 13px;
    }

    .hero-banner__actions {
        flex-direction: column;
        align-items: flex-start;

        width: 100%;
    }

    .hero-btn {
        min-height: 45px;
    }

    .hero-banner__image {
        background-position: 68% center;
    }

    .hero-bottom-points span:nth-of-type(3),
    .hero-bottom-points i:nth-of-type(2) {
        display: none;
    }
}

.intro{padding:115px 0;background:#fff}
.intro-grid{display:grid;grid-template-columns:.34fr 1fr;gap:70px}
.section-label{font-size:10px;letter-spacing:.19em;font-weight:850;color:var(--green);padding-top:8px}
.medium-heading{font-size:clamp(34px,4vw,55px);line-height:1.08;letter-spacing:-.045em;margin-bottom:25px}
.medium-heading em{font-style:normal;color:var(--blue)}
.lead{max-width:820px;font-size:17px;line-height:1.9;color:#65747f}

.services-section{padding:110px 0;background:var(--paper)}
.section-heading{display:grid;grid-template-columns:1fr 380px;align-items:end;gap:70px;margin-bottom:50px}
.section-heading>p,.standards-head>p{color:var(--muted);font-size:14px;line-height:1.85}
.service-feature{display:grid;grid-template-columns:1.05fr .95fr;background:#fff;margin-bottom:18px}
.service-feature-image{min-height:430px}
.service-feature-image img{width:100%;height:100%;object-fit:cover}
.service-feature-copy{padding:52px 48px;display:flex;flex-direction:column;justify-content:center}
.service-kicker{font-size:10px;letter-spacing:.15em;text-transform:uppercase;font-weight:850;color:var(--green)}
.service-feature h3{font-size:34px;line-height:1.08;letter-spacing:-.035em;margin:14px 0 16px}
.service-feature-copy>p{font-size:14px;color:var(--muted);line-height:1.8}
.service-feature ul,.service-card ul{list-style:none;margin-top:22px;border-top:1px solid var(--line);padding-top:12px}
.service-feature li,.service-card li{font-size:11px;color:#52636e;padding:6px 0;display:flex;gap:9px}
.service-feature li::before,.service-card li::before{content:"+";font-weight:900;color:var(--green)}
.card-link{display:inline-block;margin-top:22px;font-size:10px;text-transform:uppercase;letter-spacing:.12em;font-weight:850;color:var(--blue)}
.card-link span{color:var(--green);margin-left:7px}
.service-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.service-card{background:#fff;min-width:0}
.service-card>img{width:100%;height:245px;object-fit:cover}
.service-card-body{padding:31px 34px 34px}
.service-card h3{font-size:27px;line-height:1.08;letter-spacing:-.035em;margin:13px 0 12px}
.service-card p{font-size:13px;color:var(--muted);line-height:1.8}
.service-card ul{margin-top:18px}
.service-card li{padding:5px 0}

.about-preview{padding:120px 0;background:#fff}
.about-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:90px;align-items:center}
.about-image{position:relative;background:var(--paper);padding:0;min-height:530px;display:flex;align-items:center;overflow:hidden}
.about-image img{width:100%;height:100%;object-fit:cover}
.about-image-caption{position:absolute;left:0;bottom:0;background:rgba(11,30,46,.93);color:#fff;padding:17px 22px;font-size:10px;letter-spacing:.08em;text-transform:uppercase}
.about-copy>p{font-size:15px;color:#64737e;line-height:1.9;max-width:650px;margin-bottom:14px}
.about-highlights{margin:28px 0 30px;border-top:1px solid var(--line)}
.about-highlights div{display:grid;grid-template-columns:175px 1fr;gap:18px;padding:14px 0;border-bottom:1px solid var(--line)}
.about-highlights strong{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--blue)}
.about-highlights span{font-size:11px;color:#6d7b84}
.about-actions{display:flex;align-items:center;gap:24px}
.btn-dark{background:var(--ink);color:#fff}
.btn-dark:hover{background:var(--blue)}
.text-link{font-size:10px;text-transform:uppercase;letter-spacing:.1em;font-weight:850;color:var(--ink)}
.text-link span{color:var(--green);margin-left:7px}

.standards{padding:110px 0;background:var(--paper)}
.standards-head{display:grid;grid-template-columns:1fr 390px;gap:70px;align-items:end;margin-bottom:55px}
.credential-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:40px;align-items:center}
.credential-placeholder{min-height:170px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;position:relative;padding:20px}
.credential-placeholder::before{content:"";position:absolute;inset:0;border:1px dashed #bfcbd2;border-radius:3px}
.credential-placeholder span{font-size:8px;letter-spacing:.17em;color:#8d9ba4}
.credential-placeholder strong{font-size:42px;line-height:1;color:#c1cbd0;margin:11px 0}
.credential-placeholder small{max-width:170px;font-size:9px;color:#7c8a93;line-height:1.5}

.cta-section{background:var(--blue-deep);color:#fff;padding:88px 0;position:relative;overflow:hidden}
.cta-section::after{content:"";position:absolute;width:520px;height:520px;border:1px solid rgba(113,158,13,.2);border-radius:50%;right:-170px;top:-240px}
.cta-grid{position:relative;z-index:2;display:grid;grid-template-columns:1fr auto;gap:60px;align-items:end}
.cta-grid h2{max-width:820px;font-size:clamp(38px,4.5vw,62px);line-height:1.03;letter-spacing:-.045em;margin:16px 0}
.cta-grid h2 em{font-style:normal;color:#9dbfcb}
.cta-grid p{max-width:760px;color:#b6c4cd;font-size:14px;line-height:1.8}
.btn-light{background:#fff;color:var(--ink)}
.btn-light:hover{background:#dfe9ee}

.footer{background:#081824;color:#a9b8c2}
.footer-main{display:grid;grid-template-columns:1.45fr .7fr .95fr 1fr;gap:55px;padding:70px 0 55px}
.footer-brand img{width:220px}
.footer-brand p{max-width:315px;font-size:11px;line-height:1.85;margin-top:19px;color:#82939e}
.footer-col{display:flex;flex-direction:column;gap:10px;font-size:10px}
.footer-col a:hover{color:#fff}
.footer-title{color:#fff;text-transform:uppercase;font-size:9px;letter-spacing:.16em;font-weight:850;margin-bottom:8px}
.designer-link{color:#a6c83a!important;margin-top:7px}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding:19px 0 24px;display:flex;justify-content:space-between;font-size:9px;letter-spacing:.05em;color:#657984}
.footer-bottom a{color:#a6c83a}

.reveal{opacity:0;transform:translateY(20px);transition:opacity .7s ease,transform .7s ease}
.reveal.visible{opacity:1;transform:none}
.delay-1{transition-delay:.1s}

@media(max-width:1050px){
  .main-nav{gap:18px}
  .hero-inner{grid-template-columns:1fr 300px;gap:45px}
  .section-heading,.standards-head{grid-template-columns:1fr 330px}
  .about-grid{gap:55px}
  .footer-main{grid-template-columns:1.2fr .7fr .9fr 1fr}
}
@media(max-width:820px){
  .container{width:min(calc(100% - 38px),var(--max))}
  .topbar-inner span:last-child{display:none}
  .nav-wrap{height:78px}
  .brand{width:190px}
  .menu-toggle{display:block;z-index:101}
  .main-nav{position:absolute;left:19px;right:19px;top:87px;background:#fff;border:1px solid var(--line);padding:22px;display:flex;flex-direction:column;align-items:stretch;gap:0;box-shadow:0 20px 40px rgba(0,0,0,.1);opacity:0;pointer-events:none;transform:translateY(-8px);transition:.25s}
  .main-nav.open{opacity:1;pointer-events:auto;transform:none}
  .main-nav>a{padding:13px 5px}
  .main-nav>a:not(.nav-cta)::after{display:none}
  .nav-cta{text-align:center;margin-top:8px}
  .hero{min-height:720px}
  .hero-inner{display:block;padding:100px 0 80px}
  .hero-side{margin-top:55px;max-width:440px}
  .hero-scroll{left:19px}
  .intro,.services-section,.about-preview,.standards{padding:80px 0}
  .intro-grid{grid-template-columns:1fr;gap:28px}
  .section-heading,.standards-head{display:block}
  .section-heading>p,.standards-head>p{margin-top:20px}
  .service-feature{grid-template-columns:1fr}
  .service-feature-image{min-height:320px}
  .service-feature-copy{padding:36px 30px}
  .service-grid{grid-template-columns:1fr}
  .about-grid{grid-template-columns:1fr}
  .about-image{min-height:400px}
  .credential-gallery{grid-template-columns:1fr 1fr;gap:22px}
  .cta-grid{grid-template-columns:1fr;gap:30px}
  .footer-main{grid-template-columns:1fr 1fr;gap:38px}
}
@media(max-width:520px){
  .container{width:min(calc(100% - 28px),var(--max))}
  .brand{width:165px}
  .hero h1{font-size:48px}
  .hero-copy>p{font-size:14px}
  .hero-actions{align-items:flex-start;flex-direction:column;gap:19px}
  .hero-side{margin-top:42px}
  .medium-heading{font-size:39px}
  .service-feature-image{min-height:250px}
  .service-feature h3{font-size:29px}
  .service-card>img{height:210px}
  .service-card-body{padding:27px}
  .about-image{min-height:320px}
  .about-highlights div{grid-template-columns:1fr;gap:5px}
  .about-actions{align-items:flex-start;flex-direction:column}
  .credential-gallery{grid-template-columns:1fr}
  .credential-placeholder{min-height:145px}
  .footer-main{grid-template-columns:1fr}
  .footer-bottom{flex-direction:column;gap:8px}
}


/* =========================================================
   DBK BRAND HIGHLIGHTS
========================================================= */
:root{
  --dbk-blue:#336699;
  --dbk-blue-dark:#17334d;
  --dbk-green:#719e0d;
  --dbk-green-bright:#8ab51a;
  --dbk-blue-soft:#edf4f9;
  --dbk-green-soft:#f2f7e7;
}

.nav-cta{background:var(--dbk-blue)}
.nav-cta:hover{background:var(--dbk-blue-dark)}
.medium-heading em,.card-link,.text-link span,.service-kicker,.section-label,.eyebrow,.footer-bottom a{color:var(--dbk-green)}
.hero-btn--primary{background:var(--dbk-green)}
.hero-btn--primary:hover{background:var(--dbk-green-bright)}
.about-image-caption{border-left:4px solid var(--dbk-green)}
.about-highlights strong{color:var(--dbk-blue)}
.service-feature,.service-card{border-top:3px solid transparent}
.service-feature:hover,.service-card:hover{border-top-color:var(--dbk-green)}

/* =========================================================
   CORE COMPETENCIES
========================================================= */
.competencies-section{
  padding:105px 0 90px;
  background:linear-gradient(135deg,#f7fafc 0%,#fff 58%,#f4f8eb 100%);
  position:relative;
  overflow:hidden;
}
.competencies-section::before{
  content:"";
  position:absolute;
  width:420px;height:420px;
  border:1px solid rgba(51,102,153,.10);
  border-radius:50%;
  right:-190px;top:-190px;
}
.competencies-intro{
  display:grid;
  grid-template-columns:1fr 390px;
  gap:70px;
  align-items:end;
  margin-bottom:45px;
}
.competencies-intro>p{color:var(--muted);font-size:14px;line-height:1.85}
.competency-list{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  border-top:1px solid var(--line);
}
.competency-item{
  min-height:120px;
  padding:26px 24px;
  display:flex;
  align-items:flex-start;
  gap:17px;
  border-bottom:1px solid var(--line);
}
.competency-item:nth-child(3n+2),.competency-item:nth-child(3n+3){border-left:1px solid var(--line)}
.competency-mark{
  flex:0 0 auto;
  width:31px;height:31px;
  display:grid;place-items:center;
  background:var(--dbk-blue);
  color:#fff;
  font-size:9px;font-weight:850;
  border-radius:50%;
}
.competency-item:nth-child(even) .competency-mark{background:var(--dbk-green)}
.competency-item strong{max-width:250px;color:var(--ink);font-size:12px;line-height:1.5}

/* Profile CTA */
.profile-cta{
  margin-top:38px;
  padding:28px 32px;
  min-height:145px;
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:35px;
  background:var(--dbk-blue-dark);
  color:#fff;
  position:relative;
  overflow:hidden;
}
.profile-cta::after{
  content:"";
  position:absolute;
  width:270px;height:270px;
  border:1px solid rgba(138,181,26,.25);
  border-radius:50%;
  right:-120px;top:-150px;
}
.profile-cta-copy{position:relative;z-index:2}
.profile-cta-label{
  display:block;color:var(--dbk-green-bright);
  font-size:8px;font-weight:850;letter-spacing:.18em;margin-bottom:7px;
}
.profile-cta h3{font-size:27px;line-height:1.1;letter-spacing:-.03em;margin-bottom:6px}
.profile-cta p{color:#c0cdd5;font-size:11px;line-height:1.6;max-width:600px}
.profile-download{
  min-width:275px;min-height:72px;padding:12px 15px;
  display:flex;align-items:center;gap:13px;
  position:relative;z-index:2;
  background:var(--dbk-green);color:#fff;
  transition:.25s;
}
.profile-download:hover{background:var(--dbk-green-bright);transform:translateY(-2px)}
.profile-download-icon{
  width:38px;height:38px;border:1px solid rgba(255,255,255,.4);
  display:grid;place-items:center;font-size:19px;
}
.profile-download small{display:block;font-size:8px;font-weight:800;letter-spacing:.15em;opacity:.8}
.profile-download strong{display:block;font-size:12px;margin-top:2px}
.profile-download-arrow{margin-left:auto;font-size:19px}

/* =========================================================
   PROFESSIONAL CREDENTIALS — REPLACE PNG FILES DIRECTLY
========================================================= */
.credential-gallery{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:48px;
  align-items:center;
}
.credential-logo{
  min-height:155px;
  display:flex;align-items:center;justify-content:center;
  padding:20px;
  background:rgba(255,255,255,.52);
  border:1px dashed #c8d3da;
  transition:.25s;
}
.credential-logo:hover{border-color:var(--dbk-green);background:#fff}
.credential-logo img{
  width:100%;max-width:190px;max-height:105px;
  object-fit:contain;margin:auto;
}

/* =========================================================
   CONTACT DBK CTA BUTTON
========================================================= */

.contact-dbk-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 18px;

    min-width: 175px;
    min-height: 54px;

    padding: 0 22px;

    background: #ffffff;
    color: #17334d;

    border: 1px solid #ffffff;
    border-radius: 7px;

    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.09em;
    text-transform: uppercase;

    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.12);

    transition:
        background-color 0.25s ease,
        color 0.25s ease,
        border-color 0.25s ease,
        transform 0.25s ease,
        box-shadow 0.25s ease;
}

.contact-dbk-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 27px;
    height: 27px;

    border-radius: 50%;

    background: #719e0d;
    color: #ffffff;

    font-size: 15px;
    line-height: 1;

    transition:
        background-color 0.25s ease,
        transform 0.25s ease;
}

.contact-dbk-btn:hover {
    background: #719e0d;
    border-color: #719e0d;
    color: #ffffff;

    transform: translateY(-3px);

    box-shadow: 0 15px 32px rgba(0, 0, 0, 0.20);
}

.contact-dbk-btn:hover .contact-dbk-arrow {
    background: #ffffff;
    color: #17334d;
    transform: translate(2px, -2px);
}

.contact-dbk-btn:focus-visible {
    outline: 3px solid rgba(138, 181, 26, 0.45);
    outline-offset: 4px;
}


/* Mobile */
@media (max-width: 520px) {

    .contact-dbk-btn {
        min-width: 165px;
        min-height: 50px;
        padding: 0 19px;
        gap: 14px;
    }

}

/* =========================================================
   MEET THE DBK TEAM BUTTON
========================================================= */

.meet-team-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;

    min-height: 48px;

    padding: 0 18px;


    border-radius: 6px;

    background: #719e0d;
    color: #ffffff;

    font-size: 10px;
    font-weight: 850;

    letter-spacing: 0.09em;
    text-transform: uppercase;

    transition:
        background-color 0.25s ease,
        color 0.25s ease,
        border-color 0.25s ease,
        transform 0.25s ease,
        box-shadow 0.25s ease;
}


/* Arrow circle */

.meet-team-arrow {
    width: 25px;
    height: 25px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #ffffff;
    color: #719e0d;

    font-size: 14px;
    line-height: 1;

    transition:
        background-color 0.25s ease,
        color 0.25s ease,
        transform 0.25s ease;
}


/* Hover */

.meet-team-btn:hover {
    background: #336699;
    border-color: #336699;
    color: #ffffff;

    transform: translateY(-2px);

    box-shadow: 0 9px 22px rgba(51, 102, 153, 0.18);
}


.meet-team-btn:hover .meet-team-arrow {
    background: #ffffff;
    color: #336699;

    transform: translate(2px, -2px);
}


/* Keyboard accessibility */

.meet-team-btn:focus-visible {
    outline: 3px solid rgba(113, 158, 13, 0.35);
    outline-offset: 4px;
}


/* Mobile */

@media (max-width: 520px) {

    .meet-team-btn {
        min-height: 46px;
        padding: 0 16px;
    }

}


/* =========================================================
   WHATSAPP FLOATING BUTTON
========================================================= */

.whatsapp-float {
    position: fixed;

    right: 25px;
    bottom: 25px;

    width: 58px;
    height: 58px;

    z-index: 999;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #25D366;
    color: #ffffff;

    border-radius: 50%;

    box-shadow:
        0 10px 25px rgba(0, 0, 0, 0.18);

    text-decoration: none;

    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease,
        background-color 0.25s ease;
}


/* Real WhatsApp SVG */

.whatsapp-icon {
    width: 31px;
    height: 31px;

    display: block;

    color: #ffffff;

    fill: currentColor;
}


/* Hover */

.whatsapp-float:hover {
    background: #20bd5a;

    transform: translateY(-4px) scale(1.04);

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


/* Tooltip */

.whatsapp-tooltip {
    position: absolute;

    right: 72px;
    top: 50%;

    transform:
        translateY(-50%)
        translateX(8px);

    white-space: nowrap;

    padding: 9px 13px;

    background: #17334d;
    color: #ffffff;

    border-radius: 5px;

    font-size: 9px;
    font-weight: 700;

    letter-spacing: 0.03em;

    opacity: 0;
    visibility: hidden;

    pointer-events: none;

    transition:
        opacity 0.2s ease,
        transform 0.2s ease,
        visibility 0.2s ease;
}


/* Small tooltip arrow */

.whatsapp-tooltip::after {
    content: "";

    position: absolute;

    right: -5px;
    top: 50%;

    width: 10px;
    height: 10px;

    background: #17334d;

    transform:
        translateY(-50%)
        rotate(45deg);
}


/* Show tooltip */

.whatsapp-float:hover .whatsapp-tooltip {
    opacity: 1;
    visibility: visible;

    transform:
        translateY(-50%)
        translateX(0);
}


/* Mobile */

@media (max-width: 520px) {

    .whatsapp-float {
        width: 53px;
        height: 53px;

        right: 17px;
        bottom: 17px;
    }

    .whatsapp-icon {
        width: 28px;
        height: 28px;
    }

    .whatsapp-tooltip {
        display: none;
    }

}

/* Footer contact */
.footer-phone{font-weight:700}
.footer-phone:hover{color:var(--dbk-green-bright)!important}

@media(max-width:1050px){
  .competencies-intro{grid-template-columns:1fr 330px;gap:45px}
  .competency-list{grid-template-columns:repeat(2,1fr)}
  .competency-item:nth-child(3n+2),.competency-item:nth-child(3n+3){border-left:0}
  .competency-item:nth-child(even){border-left:1px solid var(--line)}
  .credential-gallery{gap:25px}
}
@media(max-width:820px){
  .competencies-section{padding:80px 0}
  .competencies-intro{display:block;margin-bottom:32px}
  .competencies-intro>p{margin-top:20px}
  .competency-list{grid-template-columns:1fr}
  .competency-item{min-height:95px}
  .competency-item:nth-child(even){border-left:0}
  .profile-cta{grid-template-columns:1fr;gap:22px}
  .profile-download{width:100%;min-width:0}
  .credential-gallery{grid-template-columns:1fr 1fr}
}
@media(max-width:520px){
  .competency-item{padding:20px 15px}
  .competency-item strong{font-size:11px}
  .profile-cta{padding:25px 22px}
  .profile-cta h3{font-size:24px}
  .credential-gallery{grid-template-columns:1fr;gap:15px}
  .credential-logo{min-height:125px}
  .whatsapp-float{width:52px;height:52px;right:17px;bottom:17px}
  .whatsapp-tooltip{display:none}
}
