/** Shopify CDN: Minification failed

Line 3221:0 Expected identifier but found "."
Line 4683:1 Expected "}" to go with "{"

**/
/*==================================================
01. ROOT VARIABLES
==================================================*/

:root{

/* BRAND COLORS */

--primary:#061B5A;
--secondary:#22C7C8;

--heading:#061B5A;
--text:#455468;
--muted:#64748B;

--white:#FFFFFF;
--light:#F8FAFC;
--border:#E5E7EB;


/* SPACING */

--space-xs:8px;
--space-sm:16px;
--space-md:24px;
--space-lg:40px;
--space-xl:60px;
--space-2xl:90px;


/* BORDER RADIUS */

--radius-sm:12px;
--radius-md:18px;
--radius-lg:24px;


/* SHADOWS */

--shadow-sm:
0 8px 20px rgba(15,23,42,.06);

--shadow-md:
0 20px 60px rgba(15,23,42,.10);

--shadow-lg:
0 30px 80px rgba(15,23,42,.14);


/* CONTAINER */

--container:1400px;


/* TRANSITION */

--transition:.35s ease;

}

/*==================================================
02. RESET
==================================================*/

*,
*::before,
*::after{

box-sizing:border-box;

}

img{

display:block;

max-width:100%;

height:auto;

}

a{

text-decoration:none;

}

button{

font-family:inherit;

cursor:pointer;

}

ul{

margin:0;

padding:0;

list-style:none;

}

/*==================================================
03. LAYOUT
==================================================*/

.wd-container{

max-width:var(--container);

margin:0 auto;

padding:0 48px;

width:100%;

}

.wd-section{

padding:90px 0;

position:relative;

}

/*==================================================
04. TYPOGRAPHY
==================================================*/

.wd-eyebrow{

display:inline-block;

font-size:14px;

font-weight:700;

letter-spacing:2px;

text-transform:uppercase;

color:var(--secondary);

margin-bottom:10px;

}

.wd-title-xl{

font-size:56px;

line-height:1.05;

font-weight:700;

color:var(--primary);

}

.wd-title-lg{

font-size:46px;

line-height:1.1;

font-weight:700;

color:var(--primary);

}

.wd-body{

font-size:18px;

line-height:1.7;

color:var(--muted);

}

/*==================================================
SECTION HEADER
==================================================*/

.wd-section-header{

max-width:760px;

margin:0 0 var(--space-2xl);

text-align:left;

}

.wd-section-title{

margin:18px 0 22px;

font-size:56px;

line-height:1.1;

color:var(--primary);

}

.wd-section-text{

max-width:680px;

font-size:18px;

line-height:1.8;

color:var(--muted);

}

/*=========================================
SECTION HEADER RESPONSIVE
=========================================*/

@media (max-width:991px){

.wd-section-header{

max-width:620px;

margin-bottom:56px;

}

.wd-section-title{

font-size:42px;

}

.wd-section-text{

font-size:17px;

max-width:560px;

}

}

@media (max-width:767px){

.wd-section-header{

max-width:100%;

margin-bottom:32px;

text-align:left;

}

.wd-section-title{

font-size:34px;

line-height:1.15;

margin:0 0 10px;

max-width:none;

text-wrap:balance;

}

.wd-section-text{

font-size:16px;

line-height:1.7;

max-width:42ch;

margin:0;

}

}

@media (max-width:575px){

.wd-section-title{

font-size:30px;

}

}

@media (max-width:390px){

.wd-section-title{

font-size:28px;

}

}

/*==================================================
05. BUTTONS
==================================================*/

.wd-btn{

display:inline-flex;

align-items:center;

justify-content:center;

gap:10px;

padding:18px 34px;

border-radius:14px;

font-size:16px;

font-weight:700;

text-decoration:none;

transition:var(--transition);

border:2px solid transparent;

cursor:pointer;

}

.wd-btn svg{

width:18px;

height:18px;

transition:var(--transition);

flex-shrink:0;

}

/*==================================================
06. CARDS
==================================================*/

.wd-card{

background:var(--white);

border-radius:var(--radius-lg);

box-shadow:var(--shadow-md);

position:relative;

overflow:hidden;

}

/*==================================================
07. UTILITIES
==================================================*/

.text-center{

text-align:center;

}

.mt-40{

margin-top:40px;

}

.mb-40{

margin-bottom:40px;

}

.hidden{

display:none;

}


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

.wd-hero{
    position:relative;
    overflow:hidden;
    min-height:850px;
    display:flex;
    align-items:center;
}

.wd-hero-bg{
    position:absolute;
    inset:0;
    z-index:1;
}

.wd-hero-bg img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

.wd-hero-overlay{
    position:absolute;
    inset:0;
    z-index:2;
    background:
        linear-gradient(
            90deg,
            rgba(248,250,252,.97) 0%,
            rgba(248,250,252,.92) 28%,
            rgba(248,250,252,.72) 48%,
            rgba(248,250,252,.25) 68%,
            rgba(248,250,252,0) 100%
        );
}

.wd-hero-container{
    position:relative;
    z-index:3;
    width:100%;
    max-width:var(--container);
    margin:0 auto;
    padding:80px 48px;
}

.wd-hero-content{
    max-width:640px;
}

.wd-eyebrow{

display:inline-block;
font-size:14px;
font-weight:700;
letter-spacing:2px;
text-transform:uppercase;
color:var(--secondary);
margin-bottom:18px;
}

.wd-title{
    font-size:56px;
    line-height:1.02;
    color:var(--primary);
    font-weight:700;
    margin:0 0 30px;
}

.wd-description{
    max-width:560px;
    font-size:22px;
    line-height:1.7;
    color:#59657C;
    margin-bottom:40px;
}

.wd-buttons{
    display:flex;
    gap:20px;
    margin-bottom:55px;
}

.wd-btn-primary{
display:inline-flex;
align-items:center;
justify-content:center;
padding:18px 34px;
background:var(--primary);
color:var(--white);
font-size:16px;
font-weight:700;
text-decoration:none;
border-radius:14px;
transition:var(--transition);
border:none;
width:fit-content;
}

.wd-btn-primary:hover{
background:var(--secondary);
border-color:var(--secondary);
color:var(--primary);
transform:translateY(-2px);
}

.wd-btn-secondary{
display:inline-flex;
align-items:center;
justify-content:center;
padding:18px 34px;
background:var(--white);
color:var(--primary);
font-size:16px;
font-weight:700;
text-decoration:none;
border-radius:14px;
transition:var(--transition);
border:2px solid var(--primary);
width:fit-content;
}

.wd-btn-secondary:hover{
background:var(--secondary);
color:var(--primary);
border-color:var(--secondary);
transform:translateY(-2px);
}
/* Button Icons */

.wd-btn-primary,
.wd-btn-secondary{

display:inline-flex;
align-items:center;
justify-content:center;
gap:10px;

}

.wd-btn-primary svg,
.wd-btn-secondary svg{

width:18px;
height:18px;
flex-shrink:0;
transition:transform .3s ease;

}

.wd-btn-primary:hover svg{

transform:translateX(4px);

}

.wd-btn-secondary:hover svg{

transform:rotate(90deg);

}

.wd-stats{
display:flex;
gap:45px;
}

.wd-stat{
    display:flex;
    flex-direction:column;
}

.wd-stat strong{
    font-size:22px;
    color:var(--primary);
}

.wd-stat span{
    font-size:15px;
    color:#6B7280;
}

/* ==========================
   HERO PROFILE
========================== */

.wd-profile-wrap{

position:absolute;

right:70px;

bottom:20px;

width:380px;

height:640px;

z-index:20;

}

/* Frosted Glass */

.wd-profile-glass{

position:absolute;

top:0;

left:35px;

width:300px;

height:420px;

background:rgba(255,255,255,.22);

backdrop-filter:blur(8px);

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

border:1px solid rgba(255,255,255,.35);

border-radius:var(--radius-lg);

overflow:hidden;

display:flex;

justify-content:center;

align-items:flex-end;

z-index:1;
box-shadow:
0 25px 80px rgba(255,255,255,.25) inset,
0 30px 80px rgba(15,23,42,.10);

}

/* Michael */

.wd-michael{

position:absolute;

bottom:0;

left:50%;

transform:translateX(-50%);

height:420px;

width:auto;

max-width:none;

object-fit:contain;

}

/* Card */

.wd-profile-card{

position:absolute;

left:35px;

top:175px;

width:300px;

background:#fff;

padding:30px;

border-radius:22px;

box-shadow:0 25px 60px rgba(15,23,42,.12);

z-index:3;

}

/* Heading */

.wd-profile-card h3{

margin:0;

font-size:32px;

font-weight:700;

line-height:1.05;

color:var(--primary);

}

/* Role */

.wd-role{

display:block;

margin-top:8px;

margin-bottom:18px;

font-size:17px;

color:#6B7280;

}

/* Divider */

.wd-divider{

width:70px;

height:3px;

background:var(--secondary);

border-radius:30px;

margin-bottom:16px;

}

/* Features */

.wd-feature{

display:flex;

align-items:center;

gap:14px;

margin-bottom:18px;

}

.wd-feature svg{

flex-shrink:0;

}

.wd-feature span{

font-size:16px;

font-weight:500;

color:var(--text);

line-height:1.5;

}

/* CTA */

.wd-profile-link{

margin-top:12px;

display:flex;

justify-content:space-between;

align-items:center;

text-decoration:none;

font-size:18px;

font-weight:700;

color:var(--primary);

transition:.3s;

}

.wd-profile-link:hover{

color:var(--secondary);

}

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

@media screen and (max-width: 991px){

.wd-hero{
    min-height:auto;
    padding:0;
}
.wd-hero-container{
    padding:36px 20px 24px;
}
.wd-hero-overlay{

background:
linear-gradient(
90deg,
rgba(248,250,252,.92) 0%,
rgba(248,250,252,.82) 38%,
rgba(248,250,252,.50) 68%,
rgba(248,250,252,.08) 100%
);

}

.wd-hero-content{
max-width:100%;
text-align:center;
margin:0 auto;
}

.wd-hero-content{

max-width:100%;

text-align:left;

margin:0;

}

.wd-eyebrow{

display:block;

text-align:left;

margin-bottom:12px;

}

.wd-title{

font-size:38px;

line-height:1.05;

letter-spacing:-1px;

max-width:12ch;

margin:0 0 18px;

}

.wd-description{

font-size:16px;

line-height:1.65;

max-width:32ch;

margin:0 0 28px;

}
.wd-hero-bg{
overflow:hidden;
}

.wd-hero-bg img{
width:100%;

height:100%;

object-fit:cover;

object-position:82% center;

transform:scale(1.18);

}
.wd-buttons{

display:flex;

flex-direction:column;

gap:14px;

margin-bottom:24px;

width:100%;

}


.wd-btn-primary,
.wd-btn-secondary{

display:flex;

align-items:center;

justify-content:center;

width:100%;

min-height:56px;

padding:16px 22px;

font-size:15px;

font-weight:600;

border-radius:12px;

text-align:center;

}

.wd-stats{
    display:none;
}

.wd-stat{
    text-align:center;
}

.wd-stat strong{
    font-size:20px;
}

.wd-stat span{
    font-size:14px;
    line-height:1.4;
}

/* ---------- Profile ---------- */

.wd-profile-wrap{
    position:relative;
    right:auto;
    bottom:auto;
    width:100%;
    height:360px;
    margin-top:0;
}

.wd-profile-glass{
    position:absolute;
    left:50%;
    transform:translateX(-50%);
    width:220px;
    height:280px;


}

.wd-michael{
    position:absolute;
    bottom:0;
    left:50%;
    transform:translateX(-50%);
    height:280px;
    width:auto;
}

.wd-profile-card{
    position:absolute;
    left:50%;
    transform:translateX(-50%);
    top:110px;
    width:240px;
    padding:18px;

}

.wd-profile-card h3{
    font-size:22px;
}

.wd-role{
    font-size:14px;

margin-bottom:14px;
}

.wd-feature{
gap:10px;

margin-bottom:10px;

}

.wd-feature span{
font-size:14px;

line-height:1.4;
}

.wd-profile-link{
    font-size:17px;
}

}

@media screen and (max-width:390px){

.wd-title{
    font-size:34px;
}

.wd-description{
    font-size:17px;
}

.wd-profile-wrap{
    height:520px;
}

.wd-profile-glass{
    width:240px;
    height:320px;
}

.wd-michael{
    height:320px;
}

.wd-profile-card{
    width:260px;
    top:145px;
    padding:20px;
}

.wd-profile-card h3{
    font-size:24px;
}
.wd-buttons{

grid-template-columns:1fr;

gap:10px;

}

.wd-btn-primary{

order:2;

}

.wd-btn-secondary{

order:1;

}
}

/*==================================================
08. ANNOUNCEMENT BAR
==================================================*/

.wd-announcement{
    width:100%;
    background:var(--white);
    border-bottom:1px solid #E5E7EB;
    position:relative;
    z-index:1000;
}

.wd-announcement-container{
    max-width:1400px;
    margin:0 auto;
    padding:12px 48px;
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.wd-announcement-left{
    display:flex;
    align-items:center;
    gap:32px;
}

.wd-announcement-item{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:13px;
    font-weight:500;
    color:var(--primary);
}

.wd-dot{
    width:8px;
    height:8px;
    border-radius:50%;
    background:#2CC9C3;
    flex-shrink:0;
}

.wd-announcement-right{
    display:flex;
    align-items:center;
    gap:20px;
    font-size:13px;
    font-weight:500;
    color:var(--primary);
    font-size:13px;
    font-weight:600;
    padding:0;
}

/* ======================================
   ANNOUNCEMENT BAR
====================================== */

@media screen and (max-width:991px){

.wd-announcement{
    display:block;
    width:100%;
    background:#fff;
    border-bottom:1px solid #E5E7EB;
}

.wd-announcement-container{

    padding:12px 20px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:12px;
}

.wd-announcement-left{
    width:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    gap:14px;
    flex-wrap:wrap;
}

.wd-announcement-item{
    font-size:12px;
    line-height:1.4;
    white-space:nowrap;
}

.wd-announcement-right{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:16px;
    width:100%;
    font-size:12px;
}

.wd-announcement-right button{
    font-size:12px;
}

.wd-announcement-item:nth-child(3),
.wd-announcement-item:nth-child(4),
.wd-announcement-right{

display:none;

}
.wd-dot{
    width:6px;
    height:6px;
}
}

/* ===========================
   LOGO STRIP
=========================== */

.wd-logo-strip{
    background:var(--primary);
    padding:90px 0;
    overflow:hidden;
}

.wd-logo-heading{
    text-align:center;
    font-size:18px;
    font-weight:600;
    color:var(--white);
    margin:0 auto 56px;
    max-width:650px;
    line-height:1.6;
}

.wd-logo-grid{
    display:grid;
    grid-template-columns:repeat(6,1fr);
    gap:48px;
    align-items:center;
}

.wd-logo-item{
    display:flex;
    align-items:center;
    justify-content:center;
}

.wd-logo-item img{
    max-width:140px;
    max-height:60px;
    width:auto;
    height:auto;
    opacity:.65;
    filter:grayscale(100%);
    transition:all .35s ease;
}

.wd-logo-item:hover img{
    opacity:1;
    filter:grayscale(0);
    transform:scale(1.05);
}

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

@media (max-width:991px){

.wd-logo-strip{
    padding:70px 0;
}

.wd-logo-heading{
    font-size:17px;
    margin-bottom:40px;
    padding:0 20px;
}

.wd-logo-grid{
    grid-template-columns:repeat(3,1fr);
    gap:28px 20px;
}

.wd-logo-item{
    min-height:70px;
}

.wd-logo-item img{
    max-width:120px;
    max-height:50px;
}

}

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

@media (max-width:767px){

.wd-logo-strip{
    padding:56px 0;
}

.wd-logo-heading{
    font-size:16px;
    line-height:1.5;
    margin-bottom:32px;
    padding:0 16px;
}

.wd-logo-grid{
    grid-template-columns:repeat(2,1fr);
    gap:22px;
}

.wd-logo-item{
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.08);
    border-radius:var(--radius-md);
    min-height:82px;
    padding:16px;
}

.wd-logo-item img{
    max-width:95px;
    max-height:42px;
    opacity:.85;
    filter:none;
}

}

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

@media (max-width:390px){

.wd-logo-strip{
    padding:48px 0;
}

.wd-logo-grid{
    gap:16px;
}

.wd-logo-item{
    min-height:76px;
    border-radius:16px;
    padding:14px;
}

.wd-logo-item img{
    max-width:85px;
    max-height:38px;
}

}

/*==================================================
15. COMPLETE SOLUTIONS
==================================================*/

.wd-solutions{

background:var(--light);

}

/*------------------------------------
GRID
------------------------------------*/

.wd-solutions-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:32px;

align-items:stretch;

}

/*------------------------------------
CARD
------------------------------------*/

.wd-solution-card{

display:flex;

flex-direction:column;

height:100%;

background:var(--white);

border:1px solid rgba(6,27,90,.05);

border-radius:var(--radius-lg);

overflow:hidden;

box-shadow:var(--shadow-sm);

transition:var(--transition);

}

.wd-solution-card:hover{

transform:translateY(-6px);

border-color:rgba(20,184,166,.25);

box-shadow:var(--shadow-md);

}

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

.wd-solution-card img{

width:100%;

height:180px;

background:linear-gradient(
180deg,
#FFFFFF,
#F8FAFC
);

object-fit:cover;

display:block;

transition:var(--transition);

}

.wd-solution-card:hover img{

transform:scale(1.02);

}

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

.wd-solution-content{

display:flex;

flex-direction:column;

flex:1;

padding:24px;

position:relative;

}

.wd-solution-content::before{

content:"";

width:44px;

height:3px;

background:var(--secondary);

border-radius:20px;

margin-bottom:18px;

display:block;

opacity:.25;

transition:var(--transition);

}

.wd-solution-card:hover .wd-solution-content::before{

width:70px;

opacity:1;

}

.wd-card-number{

display:inline-flex;

align-items:center;

justify-content:center;

width:52px;

height:52px;

margin-bottom:16px;

border:2px solid rgba(20,184,166,.15);

border-radius:50%;

background:linear-gradient(
180deg,
#FFFFFF,
#F5FBFB
);

font-size:15px;

font-weight:700;

letter-spacing:1px;

color:var(--secondary);

transition:var(--transition);

flex-shrink:0;

}

.wd-solution-card:hover .wd-card-number{

background:var(--secondary);

color:var(--white);

border-color:var(--secondary);

transform:scale(1.05);

}

.wd-solution-content h3{

margin:0 0 8px;

font-size:26px;

letter-spacing:-.5px;

font-weight:700;

line-height:1.25;

color:var(--primary);

}

.wd-solution-content p{

margin:0;

font-size:16px;

font-size:15px;

line-height:1.8;

color:var(--muted);

}

@media (max-width:1199px){

.wd-solutions-grid{

gap:24px;

}

.wd-solution-content{

padding:28px;

}

.wd-solution-content h3{

font-size:24px;

}

}

@media (max-width:991px){

.wd-solutions-grid{

grid-template-columns:repeat(2,1fr);

gap:22px;

}

.wd-solution-card img{

height:180px;

}

.wd-solution-content{

padding:24px;

}

.wd-solution-content h3{

font-size:22px;

}

}

/*=========================================
LARGE PHONES
767px
=========================================*/

@media (max-width:767px){

.wd-solutions{

padding:56px 0;

}

.wd-solutions-grid{

grid-template-columns:1fr;

gap:10px;

}


.wd-solution-card{

display:grid;

grid-template-columns:56px 1fr;

align-items:center;

gap:12px;

padding:10px;

background:var(--white);

border-radius:18px;

border:1px solid rgba(6,27,90,.05);

box-shadow:0 8px 20px rgba(15,23,42,.05);

}

.wd-solution-card img{

width:64px;

height:64px;

border-radius:12px;

object-fit:cover;

display:block;

}

.wd-solution-content{

display:flex;

flex-direction:column;

justify-content:center;

padding:0;

gap:2px;

}

.wd-solution-content::before{

display:none;

}

.wd-card-number{

width:auto;

height:auto;

margin:0 0 6px;

padding:0;

background:none;

border:none;

font-size:16px;

font-weight:700;

letter-spacing:1px;

color:var(--secondary);

margin:0;

}

.wd-solution-content h3{

font-size:18px;

line-height:1.2;

font-weight:700;

margin:0;

color:var(--primary);

}

.wd-solution-content p{

display:none;

}

}

/*=========================================
PHONES
575px
=========================================*/

@media (max-width:575px){

.wd-solution-card img{

width:56px;

height:56px;

}

.wd-solution-content{

padding:10px 12px;

}

.wd-card-number{

width:32px;

height:32px;

font-size:11px;

margin-bottom:10px;

}

.wd-solution-content h3{

font-size:16px;

}

}



/*==================================================
12. SHOP BY CATEGORY
==================================================*/

.wd-category{

background:var(--light);

}

/*------------------------------------
CATEGORY GRID
------------------------------------*/

.wd-category-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:32px;

}

/*------------------------------------
CATEGORY CARD
------------------------------------*/

.wd-category-card{

display:flex;

flex-direction:column;

height:100%;

background:var(--white);

border-radius:var(--radius-lg);

overflow:hidden;

text-decoration:none;

box-shadow:var(--shadow-sm);

transition:var(--transition);

}

.wd-category-card:hover{

transform:translateY(-6px);

box-shadow:var(--shadow-md);

}

/*------------------------------------
CATEGORY IMAGE
------------------------------------*/

.wd-category-image{

display:flex;

align-items:center;

justify-content:center;

height:250px;

padding:32px;

background:linear-gradient(
180deg,
#FFFFFF,
#F8FAFC
);

border-bottom:1px solid rgba(6,27,90,.05);

}

.wd-category-image img{

max-width:100%;

max-height:190px;

object-fit:contain;

transition:var(--transition);

}

.wd-category-card:hover img{

transform:scale(1.02);

}

/*------------------------------------
CATEGORY CONTENT
------------------------------------*/

.wd-category-content{

display:flex;

flex-direction:column;

flex:1;

padding:28px;

}

.wd-category-content h3{

margin:0 0 10px;

font-size:30px;

font-weight:700;

line-height:1.25;

color:var(--primary);

}

.wd-category-content p{

margin:0 0 22px;

font-size:16px;

line-height:1.7;

color:var(--muted);

}

.wd-category-link{

display:inline-flex;

align-items:center;

gap:8px;

margin-top:auto;

font-size:15px;

font-weight:700;

color:var(--primary);

transition:var(--transition);

}

.wd-category-card:hover .wd-category-link{

gap:12px;

color:var(--secondary);

}

/*==================================================
RESPONSIVE
==================================================*/

/*=========================================
LARGE TABLETS
1199px
=========================================*/

@media (max-width:1199px){

.wd-category-grid{

gap:24px;

}

.wd-category-content{

padding:24px;

}

.wd-category-content h3{

font-size:26px;

}

}

/*=========================================
TABLETS
991px
=========================================*/

@media (max-width:991px){

.wd-category-grid{

grid-template-columns:repeat(2,1fr);

gap:22px;

}

.wd-category-image{

height:220px;

padding:24px;

}

.wd-category-image img{

max-height:160px;

}

.wd-category-content{

padding:22px;

}

.wd-category-content h3{

font-size:24px;

}

}

/*=========================================
LARGE PHONES
767px
=========================================*/

@media (max-width:767px){

.wd-category{

padding:56px 0;

}

.wd-category-grid{

grid-template-columns:1fr;

gap:18px;

}

.wd-category-card{

box-shadow:0 8px 24px rgba(15,23,42,.05);

}

.wd-category-image{

height:170px;

padding:20px;

}

.wd-category-image img{

max-height:120px;

}

.wd-category-content{

padding:18px;

}

.wd-category-content h3{

font-size:21px;

margin-bottom:6px;

}

.wd-category-content p{

margin-bottom:14px;

font-size:13px;

font-weight:600;

letter-spacing:.4px;

text-transform:uppercase;

color:#7A8798;

}

.wd-category-link{

font-size:15px;

}

}

/*=========================================
PHONES
575px
=========================================*/

@media (max-width:575px){

.wd-category-image{

height:155px;

}

.wd-category-image img{

max-height:110px;

}

.wd-category-content{

padding:16px;

}

.wd-category-content h3{

font-size:20px;

}

.wd-category-link{

font-size:14px;

}

}

/*=========================================
SMALL PHONES
390px
=========================================*/

@media (max-width:390px){

.wd-category-image{

height:145px;

padding:18px;

}

.wd-category-image img{

max-height:100px;

}

.wd-category-content{

padding:14px;

}

.wd-category-content h3{

font-size:18px;

}

.wd-category-content p{

font-size:12px;

}

}

/*==================================================
14. EXPERT GUIDANCE
==================================================*/

.wd-guidance{

background:var(--white);

}

.wd-guidance-wrapper{

max-width:900px;

margin:0 auto;

background:var(--primary);

border-radius:var(--radius-lg);

padding:0;

}

.wd-guidance-content{

display:flex;

flex-direction:column;

justify-content:center;

align-items:flex-start;

padding:72px;

}

.wd-guidance .wd-btn-primary{

margin-top:8px;

}

/*------------------------------------
TYPOGRAPHY
------------------------------------*/

.wd-guidance-label{

color:var(--secondary);

}

.wd-guidance-content h2{

margin:18px 0 24px;

font-size:56px;

font-weight:700;

line-height:1.1;

letter-spacing:-1px;

color:var(--white);

}

.wd-guidance-content p{

margin:0 0 36px;

font-size:18px;

line-height:1.8;

color:rgba(255,255,255,.88);

}

/*------------------------------------
FEATURE LIST
------------------------------------*/

.wd-guidance-content ul{

margin:0 0 40px;

padding:0;

list-style:none;

}

.wd-guidance-content li{

position:relative;

padding-left:34px;

margin-bottom:18px;

font-size:17px;

line-height:1.7;

color:var(--white);

}

.wd-guidance-content li::before{

content:"✓";

position:absolute;

left:0;

color:var(--secondary);

font-weight:700;

}


/*==================================================
RESPONSIVE
==================================================*/

/*=========================================
LARGE TABLETS
1199px
=========================================*/

@media (max-width:1199px){

.wd-guidance-content{

padding:60px;

}

.wd-guidance-content h2{

font-size:48px;

}

.wd-guidance-stats{

width:84%;

}

}

@media (max-width:991px){

.wd-guidance-wrapper{

max-width:100%;

margin:0 24px;

}

.wd-guidance-content{

padding:52px 40px;

text-align:left;

align-items:flex-start;

}

.wd-guidance-content h2{

font-size:42px;

max-width:15ch;

margin:0 0 16px;

}

.wd-guidance-content p{

max-width:42ch;

margin:0 0 28px;

font-size:17px;

}

.wd-guidance-content ul{

display:block;

margin-bottom:32px;

}

}

/*=========================================
LARGE PHONES
767px
=========================================*/

@media (max-width:767px){

.wd-guidance-wrapper{

margin:0 18px;

}

.wd-guidance-content{

padding:40px 28px;

}

.wd-guidance-content h2{

font-size:34px;

line-height:1.15;

margin-bottom:14px;

}

.wd-guidance-content p{

font-size:16px;

line-height:1.7;

margin-bottom:24px;

}

.wd-guidance-content li{

font-size:15px;

margin-bottom:12px;

}

}

@media (max-width:575px){

.wd-guidance-content{

padding:34px 22px;

}

.wd-guidance-content h2{

font-size:30px;

}

}

@media (max-width:575px){

.wd-guidance-content{

padding:34px 22px;

}

.wd-guidance-content h2{

font-size:30px;

}

}

/*==================================================
11. TRUSTED BRANDS
==================================================*/

.wd-brands{

background:var(--white);

}

.wd-brands-header{

max-width:760px;

margin:0 auto var(--space-2xl);

text-align:center;

}

.wd-brands-header .wd-section-title{

font-size:56px;

line-height:1.1;

color:var(--primary);

margin:18px 0 22px;

}

.wd-brands-header .wd-section-text{

font-size:18px;

line-height:1.8;

color:var(--muted);

max-width:650px;

margin:0 auto;

}

.wd-brands-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:32px;

}

.wd-brand-card{

background:var(--white);

border-radius:var(--radius-lg);

box-shadow:var(--shadow-sm);

padding:32px 24px;

display:flex;

flex-direction:column;

align-items:center;

justify-content:center;

text-align:center;

transition:var(--transition);

min-height:220px;

}

.wd-brand-card:hover{

transform:translateY(-8px);

box-shadow:var(--shadow-md);

}

.wd-brand-card img{

width:140px;

height:70px;

object-fit:contain;

margin-bottom:24px;

}

.wd-brand-card h4{

font-size:20px;

font-weight:700;

color:var(--primary);

margin:0 0 8px;

}

.wd-brand-card span{

font-size:15px;

color:var(--muted);

}
/*=========================================
TRUSTED BRANDS
=========================================*/
@media(max-width:1199px){
.wd-brands-grid{

grid-template-columns:repeat(3,1fr);

gap:28px;

}
}
@media(max-width:991px){

.wd-brands-header{

max-width:560px;

margin-bottom:56px;

}

.wd-brands-header .wd-section-title{

font-size:42px;

}

.wd-brands-header .wd-section-text{

font-size:17px;

}

.wd-brands-grid{

grid-template-columns:repeat(2,1fr);

gap:24px;

}

.wd-brand-card{

padding:28px 20px;

min-height:200px;

}
}


@media (max-width:767px){

.wd-brands-header{

max-width:100%;

text-align:left;

margin-bottom:40px;

}

.wd-brands-header .wd-eyebrow{

justify-content:flex-start;

}

.wd-brands-header .wd-section-title{

font-size:30px;

line-height:1.1;

letter-spacing:-1px;

max-width:9ch;

margin:16px 0;

}

.wd-brands-header .wd-section-text{

max-width:100%;

margin:0;

font-size:15px;

line-height:1.7;

}

}


@media(max-width:575px){

.wd-brands-grid{

grid-template-columns:1fr;

gap:18px;

}
.wd-brands-header .wd-section-title{

font-size:30px;

max-width:300px;

}

.wd-brand-card{

flex-direction:row;

justify-content:flex-start;

align-items:center;

text-align:left;

gap:20px;

min-height:auto;

padding:20px;

}

.wd-brand-card img{

width:90px;

margin:0;

flex-shrink:0;

}
}

@media(max-width:390px){

.wd-brands-header .wd-section-title{

font-size:28px;

line-height:1.15;

max-width:12ch;

}

.wd-brand-card{

padding:18px;

gap:16px;

}

.wd-brand-card img{

width:80px;

}
}


/*======================================
PROJECTS ACROSS AFRICA
======================================*/

.wd-projects-africa{

padding:100px 0;
background:#F8FAFC;
}

.wd-projects-header{
max-width:760px;
margin:0 auto 60px;
text-align:center;
}

.wd-projects-layout{
display:grid;
grid-template-columns:1.8fr 1fr;
gap:32px;
align-items:stretch;
}

.wd-project-feature{
position:relative;
border-radius:var(--radius-lg);
overflow:hidden;
min-height:620px;
}

.wd-project-feature img{
width:100%;
height:100%;
object-fit:cover;
display:block;
transition:.4s;
}

.wd-project-feature:hover img{
transform:scale(1.04);
}

.wd-project-feature-overlay{
position:absolute;
left:0;
right:0;
bottom:0;
padding:42px;
background:linear-gradient(to top,rgba(0,0,0,.75),transparent);
color:#fff;
}

.wd-project-feature-overlay span{
font-size:13px;
letter-spacing:2px;
text-transform:uppercase;
color:var(--secondary);
font-weight:700;
}

.wd-project-feature-overlay h3{
font-size:38px;
margin:14px 0 18px;
line-height:1.2;
}

.wd-project-feature-overlay a{
color:#fff;
font-weight:700;
text-decoration:none;
}

.wd-project-list{
display:flex;
flex-direction:column;
gap:24px;
}

.wd-project-item{
display:flex;
gap:18px;
background:#fff;
padding:18px;
border-radius:20px;
text-decoration:none;
transition:.35s;
box-shadow:0 12px 35px rgba(15,23,42,.06);
}

.wd-project-item:hover{
transform:translateY(-6px);
box-shadow:0 20px 50px rgba(15,23,42,.12);
}

.wd-project-item img{
width:160px;
height:160px;
border-radius:16px;
object-fit:cover;
flex-shrink:0;
}

.wd-project-item span{
font-size:13px;
letter-spacing:2px;
text-transform:uppercase;
color:var(--secondary);
font-weight:700;
}

.wd-project-item h4{
font-size:24px;
color:var(--primary);
margin:12px 0;
}

.wd-project-item p{
font-size:16px;
line-height:1.7;
color:var(--muted);
margin:0;
}

@media(max-width:991px){
.wd-projects-layout{
grid-template-columns:1fr;
}

.wd-project-feature{
min-height:500px;
}
}

@media(max-width:640px){
.wd-project-item{
flex-direction:column;
}

.wd-project-item img{
width:100%;
height:220px;
}
}
/*==================================================
16. NEWSLETTER
==================================================*/

.wd-newsletter{

background:var(--light);

}

.wd-newsletter .wd-container{

max-width:980px;

padding:72px;

background:var(--white);

border-radius:var(--radius-xl);

box-shadow:var(--shadow-md);

}

.wd-newsletter-form{

display:flex;

align-items:center;

gap:16px;

max-width:760px;

margin-top:36px;

}

.wd-newsletter-form input{

flex:1;

height:58px;

padding:0 24px;

background:var(--white);

border:1px solid var(--border);

border-radius:var(--radius-md);

font-size:16px;

outline:none;

transition:var(--transition);

}

.wd-newsletter-form input:focus{

border-color:var(--secondary);

box-shadow:0 0 0 4px rgba(34,199,200,.12);

}

.wd-newsletter-form button{

height:58px;

padding:0 32px;

background:var(--primary);

color:var(--white);

border:none;

border-radius:var(--radius-md);

font-size:16px;

font-weight:700;

cursor:pointer;

transition:var(--transition);

}

.wd-newsletter-form button:hover{

background:var(--secondary);

color:var(--primary);

}

.wd-newsletter-benefits{

display:flex;

flex-wrap:wrap;

gap:24px;

margin-top:28px;

}

.wd-newsletter-benefit{

display:flex;

align-items:center;

gap:8px;

font-size:14px;

font-weight:500;

color:var(--muted);

}

.wd-newsletter-success{

margin-top:18px;

color:#16A34A;

font-weight:600;

}

.wd-newsletter-error{

margin-top:18px;

color:#DC2626;

}

/*=========================================
NEWSLETTER
1199px
=========================================*/

@media (max-width:1199px){

.wd-newsletter .wd-container{

max-width:900px;

padding:64px;

}

}

/*=========================================
NEWSLETTER
991px
=========================================*/

@media (max-width:991px){

.wd-newsletter .wd-container{

padding:56px 40px;

}

.wd-newsletter-form{

flex-direction:column;

align-items:stretch;

}

.wd-newsletter-form input,

.wd-newsletter-form button{

width:100%;

}

.wd-newsletter-benefits{

gap:18px;

}

}

/*=========================================
NEWSLETTER
767px
=========================================*/

@media (max-width:767px){

.wd-newsletter .wd-container{

padding:40px 24px;

border-radius:var(--radius-lg);

}

.wd-section-title{

max-width:12ch;

}

.wd-newsletter-form{

gap:14px;

margin-top:28px;

}

.wd-newsletter-form input{

height:54px;

padding:0 18px;

font-size:15px;

}

.wd-newsletter-form button{

height:54px;

font-size:15px;

}

.wd-newsletter-benefits{

display:grid;

grid-template-columns:1fr;

gap:14px;

margin-top:24px;

}

}

/*=========================================
NEWSLETTER
575px
=========================================*/

@media (max-width:575px){

.wd-newsletter .wd-container{

padding:32px 20px;

}

.wd-section-title{

max-width:11ch;

}

.wd-newsletter-benefit{

font-size:14px;

}

}

/*=====================================
PREMIUM FOOTER
======================================*/
.wd-footer{
background:var(--primary);
padding:72px 0 32px;
color:#fff;
}

.wd-footer .page-width{
.wd-container
}

.wd-footer-grid{
display:grid;
grid-template-columns:1.8fr 1fr 1.2fr;
gap:56px;
padding-bottom:56px;
border-bottom:1px solid rgba(255,255,255,.12);
}

.wd-footer-logo{

width:180px;

height:auto;

display:block;

margin-bottom:28px;

}

.wd-footer-about p{
font-size:16px;
line-height:1.75;
color:rgba(255,255,255,.75);
max-width:360px;
margin-bottom:28px;
}

.wd-footer h4{
font-size:17px;
font-weight:700;
margin-bottom:18px;
color:#fff;
}

.wd-footer ul{
list-style:none;
padding:0;
margin:0;
}

.wd-footer ul li{
margin-bottom:12px;
font-size:15px;
line-height:1.6;
color:rgba(255,255,255,.75);
}

.wd-footer a{
text-decoration:none;
color:rgba(255,255,255,.75);
transition:.3s;
}

.wd-footer a:hover{
color:var(--secondary);
}

.wd-footer-social{
display:flex;
gap:14px;
margin-top:28px;
}


.wd-footer-social a{
width:48px;
height:48px;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
background:rgba(255,255,255,.08);
color:#fff;
transition:.3s;
}


.wd-footer-social a:hover{
background:var(--secondary);
color:var(--primary);
transform:translateY(-4px);
}

.wd-footer-bottom{
display:flex;
justify-content:space-between;
align-items:center;
padding-top:24px;
gap:20px;
flex-wrap:wrap;
}

.wd-footer-bottom p{

margin:0;

font-size:15px;

color:rgba(255,255,255,.6);

}

.wd-footer-legal{

display:flex;

gap:28px;

flex-wrap:wrap;

}

.wd-footer-legal a{

font-size:15px;

text-decoration:none;

color:rgba(255,255,255,.6);

transition:.3s;

}

.wd-footer-legal a:hover{

color:var(--secondary);

}

.wd-contact-item{
display:flex;
align-items:flex-start;
gap:12px;
margin-bottom:16px;
}

.wd-contact-item svg{

width:20px;

height:20px;

color:var(--secondary);

flex-shrink:0;

margin-top:3px;

}

.wd-contact-item strong{

display:block;

font-size:15px;

color:var(--white);

margin-bottom:4px;

}

.wd-contact-item span{

display:block;

font-size:15px;

color:rgba(255,255,255,.75);

line-height:1.6;

}
/* ======================================
   FOOTER - TABLET
====================================== */

@media screen and (max-width:991px){

.wd-footer{
padding:56px 0 28px;
}

.wd-footer .page-width{

padding:0 24px;

}

.wd-footer-grid{
grid-template-columns:1fr 1fr;
gap:32px;
padding-bottom:32px;
}

.wd-footer-logo{

width:160px;

margin-bottom:20px;

}

.wd-footer-about p{

max-width:none;

font-size:16px;

margin-bottom:24px;

}

.wd-footer h4{

font-size:18px;

margin-bottom:18px;

}

.wd-footer ul li{

margin-bottom:14px;

font-size:15px;

}

.wd-contact-item{

margin-bottom:18px;

}

.wd-footer-social{

gap:12px;

}

.wd-footer-social a{

width:42px;

height:42px;

}

.wd-footer-bottom{

flex-direction:column;

text-align:center;

gap:18px;

}

.wd-footer-legal{

justify-content:center;

}

}/* ======================================
   FOOTER - PHONE
====================================== */

@media screen and (max-width:640px){

.wd-footer{
padding:48px 0 20px;
}

.wd-footer .page-width{

padding:0 18px;

}

.wd-footer-grid{
grid-template-columns:1fr;
gap:24px;
text-align:left;
}

.wd-footer-logo{
margin:0 0 16px;
width:160px;
}

.wd-footer-about p{

font-size:15px;

line-height:1.7;

}

.wd-footer-social{
justify-content:flex-start;
margin-top:16px;
}

.wd-footer h4{

margin-bottom:16px;

font-size:18px;

}

.wd-footer ul{

padding:0;

}

.wd-footer ul li{

margin-bottom:12px;

}

.wd-contact-item{
justify-content:flex-start;
align-items:flex-start;
text-align:left;
max-width:none;
margin:0 0 16px;
}

.wd-contact-item svg{

margin-top:2px;

}

.wd-footer-bottom{

padding-top:28px;

}

.wd-footer-bottom p{

font-size:14px;

}

.wd-footer-legal{
flex-wrap:wrap;
justify-content:flex-start;
gap:18px;
}

}
*{
    box-sizing:border-box;
}

body{
    overflow-x:hidden;
}

.page-width,
.wd-container{
    width:100%;
    max-width:1400px;
    margin:0 auto;
    padding-left:20px;
    padding-right:20px;
}

section{
    width:100%;
}


/*==================================================
13. FEATURED PRODUCTS
==================================================*/

.wd-featured-products{
    background:var(--white);
}

/* Grid */

.wd-featured-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:32px;
}

/* Product Card */

.wd-product-card{
    display:flex;
    flex-direction:column;
    height:100%;
    background:var(--white);
    border-radius:var(--radius-lg);
    overflow:hidden;
    box-shadow:var(--shadow-sm);
    transition:var(--transition);
}

.wd-product-card:hover{
    transform:translateY(-6px);
    box-shadow:var(--shadow-md);
}

/* Product Image */

.wd-product-image{
    display:flex;
    justify-content:center;
    align-items:center;
    padding:30px;
    aspect-ratio:1;
    background:linear-gradient(
        180deg,
        #FFFFFF,
        #F8FAFC
    );
    border-bottom:1px solid rgba(6,27,90,.05);
}

.wd-product-image a{
    display:flex;
    justify-content:center;
    align-items:center;
    width:100%;
    height:100%;
}

.wd-product-image img{
    width:100%;
    height:100%;
    object-fit:contain;
    transition:var(--transition);
}

.wd-product-card:hover img{
    transform:scale(1.02);
}

/* Product Content */

.wd-product-info{
    display:flex;
    flex-direction:column;
    flex:1;
    padding:28px;
}

.wd-product-brand{
    font-size:13px;
    font-weight:700;
    letter-spacing:2px;
    text-transform:uppercase;
    color:var(--secondary);
}

.wd-product-info h3{
    margin:12px 0;
    font-size:26px;
    line-height:1.3;
}

.wd-product-info h3 a{
    color:var(--primary);
    text-decoration:none;
    transition:var(--transition);
}

.wd-product-card:hover .wd-product-info h3 a{
    color:var(--secondary);
}

.wd-rating{
    margin:12px 0;
    font-size:15px;
    color:#F59E0B;
}

.wd-rating span{
    margin-left:8px;
    font-size:14px;
    font-weight:600;
    color:var(--muted);
}

.wd-product-price{
    margin:18px 0;
    font-size:28px;
    font-weight:700;
    color:var(--primary);
}

.wd-product-shipping{
    margin-bottom:24px;
    font-size:15px;
    color:var(--muted);
}

.wd-product-button{
    display:flex;
    justify-content:center;
    align-items:center;
    height:54px;
    margin-top:auto;
    background:var(--primary);
    color:var(--white);
    border-radius:14px;
    font-size:15px;
    font-weight:700;
    text-decoration:none;
    transition:var(--transition);
}

.wd-product-card:hover .wd-product-button{
    background:var(--secondary);
    color:var(--primary);
}

/*==================================================
LARGE TABLETS
1199px
==================================================*/

@media (max-width:1199px){

.wd-featured-grid{
    gap:24px;
}

.wd-product-info{
    padding:24px;
}

.wd-product-info h3{
    font-size:24px;
}

}

/*==================================================
TABLETS
991px
==================================================*/

@media (max-width:991px){

.wd-featured-grid{
    grid-template-columns:repeat(2,1fr);
    gap:22px;
}

.wd-product-image{
    padding:24px;
}

.wd-product-info{
    padding:22px;
}

.wd-product-info h3{
    font-size:22px;
}

}

/*==================================================
LARGE PHONES
767px
==================================================*/

@media (max-width:767px){

.wd-featured-grid{
    grid-template-columns:1fr;
    gap:18px;
}

.wd-product-card{
    flex-direction:row;
    align-items:stretch;
}

.wd-product-image{
    width:150px;
    aspect-ratio:auto;
    padding:18px;
    border-bottom:none;
    border-right:1px solid rgba(6,27,90,.05);
}

.wd-product-image img{
    max-height:110px;
}

.wd-product-info{
    padding:18px;
}

.wd-product-brand{
    font-size:11px;
    letter-spacing:1.5px;
}

.wd-product-info h3{
    margin:8px 0;
    font-size:20px;
}

.wd-rating{
    margin:8px 0;
    font-size:14px;
}

.wd-product-price{
    margin:12px 0;
    font-size:22px;
}

.wd-product-shipping{
    margin-bottom:16px;
    font-size:13px;
}

.wd-product-button{
    height:46px;
    font-size:14px;
}

}

/*==================================================
PHONES
575px
==================================================*/

@media (max-width:575px){

.wd-product-image{
    width:120px;
    padding:16px;
}

.wd-product-image img{
    max-height:90px;
}

.wd-product-info{
    padding:16px;
}

.wd-product-info h3{
    font-size:18px;
}

.wd-product-price{
    font-size:20px;
}

}

/*==================================================
SMALL PHONES
390px
==================================================*/

@media (max-width:390px){

.wd-product-image{
    width:105px;
    padding:14px;
}

.wd-product-image img{
    max-height:80px;
}

.wd-product-info{
    padding:14px;
}

.wd-product-brand{
    font-size:10px;
}

.wd-product-info h3{
    font-size:17px;
}

.wd-product-price{
    font-size:18px;
}

}

/*==========================
HEADER
==========================*/

html{
    scroll-behavior: smooth;
}

.wd-header{
position:sticky;
top:0;
left:0;
width:100%;
z-index:9999;
}

.wd-navbar{
background:var(--primary);
}

.wd-navbar-container{
max-width:1400px;
margin:auto;
padding:20px 48px;
display:grid;
grid-template-columns:220px 1fr auto;
align-items:center;
gap:60px;
}

.wd-logo{
display:flex;
align-items:center;
}

.wd-logo img{
display:block;
width:170px;
height:auto;
}

.wd-logo a{
display:flex;
align-items:center;
text-decoration:none;
color:#fff;
font-size:28px;
font-weight:700;
}

.wd-navigation{
display:flex;
justify-content:center;
}

.wd-menu{
display:flex;
align-items:center;
justify-content:center;
list-style:none;
margin:0;
padding:0;
gap:40px;
width:100%;
}

.wd-menu>li{
position:relative;
}

.wd-menu>li>a{
display:flex;
align-items:center;
gap:8px;
color:#fff;
font-size:15px;
font-weight:500;
text-decoration:none;
white-space:nowrap;
}

.wd-menu-item{
position:relative;
}

.wd-menu-item>a{
display:flex;
align-items:center;
gap:8px;
color:#fff;
font-size:15px;
font-weight:500;
text-decoration:none;
transition:.25s;
}

.wd-menu-item>a:hover{
color:var(--secondary);
}

.wd-chevron{
font-size:11px;
transition:.3s;
}
.wd-menu-item:hover > .wd-parent-link .wd-chevron svg{
transform:rotate(180deg);
}

.wd-dropdown-item:hover > .wd-child-link .wd-chevron svg{
transform:rotate(-90deg);
}

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

.wd-dropdown{
position:absolute;
top:100%;
left:0;
width:280px;
background:#fff;
padding:16px 0;
border-radius:16px;
box-shadow:0 20px 60px rgba(0,0,0,.12);
list-style:none;
margin:18px 0 0;
opacity:0;
visibility:hidden;
transform:translateY(10px);
transition:.3s;
z-index:999;
}

.wd-menu-item:hover>.wd-dropdown{
opacity:1;
visibility:visible;
transform:none;
}

.wd-dropdown-item{
position:relative;
}

.wd-dropdown-item>a{
display:flex;
justify-content:space-between;
align-items:center;
padding:14px 24px;
text-decoration:none;
color:var(--primary);
font-size:15px;
}

.wd-dropdown-item>a:hover{
background:#F8FAFC;
color:var(--secondary);
}

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

.wd-sub-dropdown{
position:absolute;
top:0;
left:100%;
width:280px;
background:#fff;
padding:16px 0;
border-radius:16px;
box-shadow:0 20px 60px rgba(0,0,0,.12);
list-style:none;
opacity:0;
visibility:hidden;
transform:translateX(12px);
transition:.3s;
}

.wd-dropdown-item:hover>.wd-sub-dropdown{
opacity:1;
visibility:visible;
transform:none;
}

.wd-sub-dropdown a{
display:block;
padding:14px 24px;
text-decoration:none;
color:var(--primary);
font-size:15px;
}

.wd-sub-dropdown a:hover{
background:#F8FAFC;
color:var(--secondary);
}

/*==========================
RIGHT ICONS
==========================*/

.wd-actions{
display:flex;
align-items:center;
gap:24px;
}

.wd-icon{
width:18px;
height:18px;
display:flex;
align-items:center;
justify-content:center;
color:#fff;
}

.wd-icon svg{
width:18px;
height:18px;
}

.wd-cart{
position:relative;
}

.wd-cart-count{
position:absolute;
top:-7px;
right:-7px;
width:18px;
height:18px;
border-radius:50%;
background:var(--secondary);
color:var(--primary);
display:flex;
align-items:center;
justify-content:center;
font-size:10px;
font-weight:700;
}
.wd-drawer-header{
    display:none;
}
/*==========================
MOBILE PLACEHOLDERS
==========================*/

.wd-mobile-toggle{
display:none;
}

.wd-overlay{
display:none;
}

.wd-menu-close{
display:none;
}

.wd-drawer-header{
    display:none;
}
/* ======================================
MOBILE HEADER
====================================== */

.wd-mobile-toggle{
display:none;
}

@media (max-width:991px){

.wd-navbar-container{
display:grid;
align-items:center;
grid-template-columns:40px 1fr auto;
padding:16px 20px;
}

.wd-mobile-toggle{
display:flex;
align-items:center;
justify-content:center;
width:40px;
height:40px;
background:none;
border:none;
color:#fff;
font-size:22px;
line-height:1;
cursor:pointer;
padding:0;
position:relative;
z-index:10001;
}

.wd-mobile-toggle svg{

width:22px;
height:22px;

}

.wd-logo{
flex:1;
display:flex;
justify-content:center;
}

.wd-logo img,
.wd-logo-img{

width:170px;
height:auto;
}

.wd-actions{
display:flex;
align-items:center;
gap:10px;
}

.wd-navigation{
display:none;
}

}
/* ===========================
MOBILE DRAWER
=========================== */

@media (max-width:991px){

.wd-navigation{

position:fixed;

top:0;

left:-290px;

width:290px;

height:100vh;
padding:20px 0 40px;

transition:left .35s cubic-bezier(.22,.61,.36,1),
box-shadow .35s ease;
background:var(--primary);

overflow-y:auto;

transition:left .35s ease;

z-index:9998;

display:block;

}
.wd-navigation.active{

left:0;

}


/* ==========================
   DRAWER HEADER
========================== */

.wd-drawer-header{

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

padding:20px 28px 18px;

border-bottom:1px solid rgba(255,255,255,.08);

}

.wd-drawer-logo{

display:flex;
align-items:center;
text-decoration:none;
width:165px;

height:auto;

display:block;

}

.wd-drawer-logo-img{

height:34px;
width:auto;
display:block;

}

.wd-menu-close-btn{

display:flex;
align-items:center;
justify-content:center;
width:40px;
height:40px;
background:var(--primary);
border:none;
cursor:pointer;
color:var(--white);
padding:0;
border-radius:50%;
transition:background .25s ease;
}

.wd-menu-close-btn:hover{

background:rgba(255,255,255,.08);

}

.wd-menu-close-btn svg{

width:20px;
height:20px;

}

.wd-navigation.active{

left:0;

}

.wd-menu{

display:flex;

flex-direction:column;

padding-top:12px;

gap:0;

}

.wd-menu-item{

width:100%;

border-bottom:1px solid rgba(255,255,255,.08);

}

.wd-menu-item>a{

display:flex;

justify-content:space-between;

align-items:center;

padding:16px 20px;

color:#fff;

font-size:17px;

}

/* First level */

.wd-dropdown{

display:none;

position:static;

background:#0B246F;

box-shadow:none;

margin:0;

padding:0;

width:100%;

opacity:1;

visibility:visible;

transform:none;

border-radius:0;

}

/* Grandchildren */

.wd-sub-dropdown{

display:none;

position:static;

background:#123684;

box-shadow:none;

margin:0;

padding:0;

width:100%;

opacity:1;

visibility:visible;

transform:none;

border-radius:0;

}

/* Parent opened */

.wd-menu-item.open>.wd-dropdown{

display:block;

}

/* Child opened */

.wd-dropdown-item.open>.wd-sub-dropdown{

display:block;

}
.wd-menu-item.open > .wd-parent-link .wd-chevron svg{
transform:rotate(180deg);
}

.wd-dropdown-item.open > .wd-child-link .wd-chevron svg{
transform:rotate(180deg);
}

/* Links */

.wd-dropdown a{

display:flex;

align-items:center;

justify-content:space-between;

padding:14px 28px;

color:#fff;

text-decoration:none;

font-size:15px;

}

.wd-sub-dropdown a{

display:block;

padding:14px 42px;

color:#fff;

text-decoration:none;

font-size:14px;

opacity:.9;

}

@media (max-width:991px){

.wd-parent-link .wd-chevron{
display:none;
}

}
.wd-chevron{
display:flex;
align-items:center;
justify-content:center;
flex-shrink:0;
}

.wd-chevron svg{
width:16px;
height:16px;
transition:transform .3s ease;
}

@media (max-width:991px){

.wd-sub-dropdown{
display:none;
}
}
/* ===========================
   MOBILE OVERLAY
=========================== */

.wd-overlay{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,.45);
opacity:0;
visibility:hidden;
transition:var(--transition);
z-index:9998;
}

body.wd-menu-open .wd-overlay{
opacity:1;
visibility:visible;
}

/*==================================================
18. RESPONSIVE
==================================================*/


/*=========================================
LARGE TABLETS
1200px ↓
=========================================*/

@media (max-width:1199px){



}



/*=========================================
TABLETS
991px ↓
=========================================*/

@media (max-width:991px){
.wd-container{
padding:0 24px;
}
h1{
font-size:46px;
}
h2{
font-size:40px;
}
h3{
font-size:28px;
}
.wd-section{
padding:70px 0;
}
}



/*=========================================
LARGE PHONES
767px ↓
=========================================*/

@media (max-width:767px){
.wd-container{
padding:0 20px;
}
h1{
font-size:38px;
line-height:1.1;
}
h2{
font-size:34px;
line-height:1.15;
}
h3{
font-size:24px;
}
.wd-btn{
width:100%;
justify-content:center;
padding:16px 24px;
}
img{
max-width:100%;
height:auto;
}
.wd-card{
padding:20px;
border-radius:18px;
}
}



/*=========================================
PHONES
575px ↓
=========================================*/

@media (max-width:575px){
.wd-container{
padding:0 16px;
}
h1{
font-size:32px;
}
h2{
font-size:30px;
}
p{
font-size:16px;
line-height:1.7;
}
.wd-section{
padding:56px 0;
}
}



/*=========================================
SMALL PHONES
390px ↓
=========================================*/

@media (max-width:390px){



}