/* Ecommerce Empires — main stylesheet
   Palette drives from logo: green / orange / blue / black on white base.
   CSS vars are overridden per-site via admin color pickers (see ee_inline_colors). */

:root{
	--ee-primary:#00A651;
	--ee-accent:#F7941D;
	--ee-info:#1BA7DF;
	--ee-dark:#0B0B0B;
	--ee-light:#FFFFFF;
	--ee-grey-50:#fafafa;
	--ee-grey-100:#f3f4f6;
	--ee-grey-200:#e5e7eb;
	--ee-grey-300:#d1d5db;
	--ee-grey-500:#6b7280;
	--ee-grey-700:#374151;
	--ee-radius:14px;
	--ee-radius-lg:22px;
	--ee-shadow:0 20px 40px -20px rgba(0,0,0,.15);
	--ee-shadow-lg:0 30px 60px -30px rgba(0,0,0,.25);
	--ee-font:"Inter",system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial,sans-serif;
	--ee-font-display:"Poppins","Inter",system-ui,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body.ee-body{margin:0;font-family:var(--ee-font);color:var(--ee-dark);background:var(--ee-light);line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none;transition:color .2s}
a:hover{color:var(--ee-primary)}
button{font-family:inherit}

.ee-container{width:100%;max-width:1200px;margin:0 auto;padding:0 24px}
.ee-section{padding:96px 0;position:relative}
.ee-section-head{margin-bottom:48px;max-width:720px}
.ee-section-head.ee-center{margin-left:auto;margin-right:auto;text-align:center}
.ee-eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:var(--ee-font-display);font-weight:600;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--ee-primary);margin-bottom:14px}
.ee-eyebrow-light{color:var(--ee-accent)}
.ee-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--ee-accent)}
.ee-section-title{font-family:var(--ee-font-display);font-weight:800;font-size:clamp(28px,3.4vw,44px);line-height:1.15;margin:0 0 14px;color:var(--ee-dark);letter-spacing:-.02em}
.ee-section-title-light{color:var(--ee-light)}
.ee-section-sub{color:var(--ee-grey-500);font-size:17px;margin:0}

/* Buttons */
.ee-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 22px;border-radius:999px;border:2px solid transparent;font-weight:600;font-size:15px;cursor:pointer;transition:transform .15s ease,background .2s,color .2s,border-color .2s,box-shadow .2s;line-height:1;white-space:nowrap}
.ee-btn-lg{padding:16px 28px;font-size:16px}
.ee-btn-primary{background:var(--ee-primary);color:#fff;border-color:var(--ee-primary);box-shadow:0 10px 22px -10px rgba(0,166,81,.6)}
.ee-btn-primary:hover{background:#008a44;border-color:#008a44;color:#fff;transform:translateY(-1px)}
.ee-btn-accent{background:var(--ee-accent);color:#fff;border-color:var(--ee-accent)}
.ee-btn-accent:hover{background:#db7f0f;border-color:#db7f0f;color:#fff}
.ee-btn-outline{background:transparent;color:var(--ee-dark);border-color:var(--ee-dark)}
.ee-btn-outline:hover{background:var(--ee-dark);color:#fff}

/* Header */
.ee-header{background:#fff;position:sticky;top:0;z-index:50;border-bottom:1px solid var(--ee-grey-200);box-shadow:0 2px 10px -6px rgba(0,0,0,.08)}
.ee-header-inner{display:flex;align-items:center;gap:24px;padding:14px 24px;min-height:96px}
.ee-brand{display:flex;align-items:center;gap:14px}
.ee-brand-link{display:flex;align-items:center}
/* Header logo — max-height is set inline from the admin "Header Logo Height" setting.
   On narrow screens we scale it down a touch so the nav doesn't crowd it. */
.ee-logo{width:auto;display:block;max-width:100%}
@media(max-width:640px){.ee-logo{max-height:48px!important}}
.ee-brand-text{font-family:var(--ee-font-display);font-weight:800;font-size:22px}
.ee-brand-tag{display:none;color:var(--ee-grey-500);font-size:12px;border-left:1px solid var(--ee-grey-200);padding-left:14px}
@media(min-width:900px){.ee-brand-tag{display:inline}}
.ee-nav{flex:1;display:none}
@media(min-width:960px){.ee-nav{display:block}}
.ee-menu{list-style:none;padding:0;margin:0;display:flex;gap:6px;justify-content:center}
.ee-menu li a{padding:10px 14px;font-weight:500;border-radius:8px;display:inline-block}
.ee-menu li a:hover{background:var(--ee-grey-100);color:var(--ee-primary)}
.ee-header-cta{display:none}
@media(min-width:760px){.ee-header-cta{display:block}}
.ee-burger{display:inline-flex;flex-direction:column;gap:4px;background:transparent;border:0;padding:8px;cursor:pointer}
.ee-burger span{display:block;width:24px;height:2px;background:var(--ee-dark);border-radius:2px;transition:transform .2s,opacity .2s}
@media(min-width:960px){.ee-burger{display:none}}
.ee-header.is-open .ee-nav{display:block;position:absolute;left:0;right:0;top:100%;background:#fff;padding:16px 24px;border-bottom:1px solid var(--ee-grey-200)}
.ee-header.is-open .ee-menu{flex-direction:column;align-items:flex-start;gap:2px}

/* --- HERO — split layout (text left, image right) with fade slider --- */
.ee-hero{padding:0;background:linear-gradient(135deg,#f2fbf6 0%,#ffffff 45%,#eef7ff 100%);position:relative;overflow:hidden}
.ee-hero.ee-hero-split{padding:72px 0 88px}
@media(min-width:900px){.ee-hero.ee-hero-split{padding:96px 0 112px}}

/* Global heading weight — per brand update: 600 everywhere */
h1,h2,h3,h4,h5,h6,
.ee-section-title,.ee-course-title,.ee-review-card h4,
.ee-feedback-quote,.ee-blog-title,.ee-mission-title,
.ee-contact-title,.ee-faq-question,.ee-best-line,.ee-award-text{font-weight:600}

/* Subtle decorative blur blobs behind the hero */
.ee-hero-split::before,.ee-hero-split::after{content:"";position:absolute;border-radius:50%;filter:blur(80px);opacity:.55;pointer-events:none;z-index:0}
.ee-hero-split::before{width:520px;height:520px;background:radial-gradient(circle,rgba(0,166,81,.18),transparent 65%);top:-140px;left:-160px}
.ee-hero-split::after{width:460px;height:460px;background:radial-gradient(circle,rgba(27,167,223,.14),transparent 65%);bottom:-160px;right:-120px}
.ee-hero-split > .ee-container{position:relative;z-index:2}

/* --- HERO floating ecommerce icons --- */
/* Layer sitting above the blur blobs but below the slide content. Icons
   are small inline SVGs (cart, bag, box, card, tag, truck, gift, heart,
   star, dollar, chart, store). They gently drift / float to add life to
   the hero without competing with the text. */
.ee-hero-bg-icons{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:1}
.ee-hero-bg-icon{position:absolute;display:block;opacity:var(--ee-icon-op,.11);will-change:transform}
.ee-hero-bg-icon svg{width:100%;height:100%;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;display:block}

/* Per-icon placement, colour, size, animation.
   --ee-icon-op controls the final opacity for this icon. */
.ee-hero-bg-icon--1 {top:7%;  left:4%;  width:54px;height:54px;color:var(--ee-primary);--ee-icon-op:.13;animation:ee-bg-float-a 12s ease-in-out infinite}
.ee-hero-bg-icon--2 {top:12%; right:6%; width:62px;height:62px;color:var(--ee-accent); --ee-icon-op:.14;animation:ee-bg-float-b 14s ease-in-out -2s infinite}
.ee-hero-bg-icon--3 {top:46%; left:2%;  width:46px;height:46px;color:var(--ee-info);   --ee-icon-op:.14;animation:ee-bg-float-c 15s ease-in-out -4s infinite}
.ee-hero-bg-icon--4 {bottom:18%;left:14%;width:42px;height:42px;color:var(--ee-primary);--ee-icon-op:.10;animation:ee-bg-float-d 13s ease-in-out -1s infinite}
.ee-hero-bg-icon--5 {bottom:7%; right:5%; width:58px;height:58px;color:var(--ee-accent); --ee-icon-op:.13;animation:ee-bg-float-a 16s ease-in-out -6s infinite}
.ee-hero-bg-icon--6 {top:58%; right:3%;  width:50px;height:50px;color:var(--ee-info);   --ee-icon-op:.12;animation:ee-bg-float-b 11s ease-in-out -3s infinite}
.ee-hero-bg-icon--7 {top:3%;  left:48%;  width:40px;height:40px;color:var(--ee-primary);--ee-icon-op:.10;animation:ee-bg-float-c 14s ease-in-out -5s infinite}
.ee-hero-bg-icon--8 {bottom:10%;left:42%; width:44px;height:44px;color:var(--ee-accent); --ee-icon-op:.11;animation:ee-bg-float-d 13s ease-in-out -7s infinite}
.ee-hero-bg-icon--9 {top:32%; right:24%; width:40px;height:40px;color:var(--ee-info);   --ee-icon-op:.10;animation:ee-bg-float-a 15s ease-in-out -4s infinite}
.ee-hero-bg-icon--10{bottom:34%;right:32%;width:38px;height:38px;color:var(--ee-primary);--ee-icon-op:.10;animation:ee-bg-float-b 12s ease-in-out -8s infinite}
.ee-hero-bg-icon--11{top:26%; left:20%;  width:36px;height:36px;color:var(--ee-accent); --ee-icon-op:.09;animation:ee-bg-float-c 14s ease-in-out -6s infinite}
.ee-hero-bg-icon--12{bottom:42%;left:8%;  width:38px;height:38px;color:var(--ee-info);   --ee-icon-op:.10;animation:ee-bg-float-d 16s ease-in-out -3s infinite}

/* Keyframes — four gentle variants so the icons don't march in lockstep. */
@keyframes ee-bg-float-a{
	0%,100%{transform:translate3d(0,0,0) rotate(0)}
	50%    {transform:translate3d(0,-22px,0) rotate(6deg)}
}
@keyframes ee-bg-float-b{
	0%,100%{transform:translate3d(0,0,0) rotate(0)}
	50%    {transform:translate3d(8px,18px,0) rotate(-8deg)}
}
@keyframes ee-bg-float-c{
	0%,100%{transform:translate3d(0,0,0) rotate(0)}
	50%    {transform:translate3d(-12px,-14px,0) rotate(10deg)}
}
@keyframes ee-bg-float-d{
	0%,100%{transform:translate3d(0,0,0) rotate(0)}
	50%    {transform:translate3d(14px,-18px,0) rotate(-5deg)}
}

/* Hide the busier inner icons on smaller screens to protect readability. */
@media(max-width:900px){
	.ee-hero-bg-icon--4,
	.ee-hero-bg-icon--7,
	.ee-hero-bg-icon--8,
	.ee-hero-bg-icon--9,
	.ee-hero-bg-icon--10,
	.ee-hero-bg-icon--11,
	.ee-hero-bg-icon--12{display:none}
}
@media(prefers-reduced-motion:reduce){
	.ee-hero-bg-icon{animation:none !important;opacity:var(--ee-icon-op,.11)}
}

/* The inner box stacks every slide into the same grid cell so we can
   cross-fade without any ghosting / layout shift. It fills the container
   so the heading/image line up with the logo and header CTA above. */
.ee-hero-split-inner{position:relative;display:grid;grid-template-columns:1fr}

/* Every slide shares the same grid cell — the active one fades in,
   the rest stay invisible. */
.ee-hero-split-slide{grid-column:1;grid-row:1;display:grid;grid-template-columns:1fr;gap:36px;align-items:center;opacity:0;visibility:hidden;transition:opacity .9s ease,visibility .9s}
@media(min-width:900px){.ee-hero-split-slide{grid-template-columns:1.05fr 1fr;gap:56px}}
.ee-hero-split-slide.is-active{opacity:1;visibility:visible}

/* -- Copy column -- */
.ee-hero-copy{order:1;padding:8px 0}
@media(min-width:900px){.ee-hero-copy{padding:12px 0}}
.ee-hero-copy .ee-eyebrow{color:var(--ee-primary);background:rgba(0,166,81,.08);border:1px solid rgba(0,166,81,.2);padding:8px 14px;border-radius:999px;font-weight:600;letter-spacing:.12em}
.ee-hero-title{font-family:var(--ee-font-display);font-weight:600;font-size:clamp(26px,3.2vw,44px);line-height:1.14;letter-spacing:-.018em;margin:18px 0 20px;color:var(--ee-dark)}
.ee-hero-title-main{display:block;color:var(--ee-dark)}
.ee-hero-title-accent{display:block;background:linear-gradient(92deg,var(--ee-primary) 0%,#25c26b 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.ee-hero-sub{font-size:clamp(15px,1.3vw,18px);color:var(--ee-grey-600,#4b5563);max-width:560px;margin:0 0 28px;line-height:1.6;font-weight:500}
.ee-hero-ctas{display:flex;gap:12px;flex-wrap:wrap}
.ee-btn-ghost{background:#fff;color:var(--ee-dark);border:1.5px solid var(--ee-grey-200,#e5e7eb);transition:background .3s ease,border-color .3s ease,transform .3s ease,box-shadow .3s ease}
.ee-btn-ghost:hover{background:var(--ee-grey-50,#f8fafc);border-color:var(--ee-primary);color:var(--ee-primary);transform:translateY(-2px);box-shadow:0 8px 22px -10px rgba(0,166,81,.35)}

/* -- Visual column -- */
.ee-hero-visual{order:2;position:relative;border-radius:28px;overflow:hidden;aspect-ratio:4/3;background:linear-gradient(135deg,#e8f7ee,#e7f1fb);box-shadow:0 30px 60px -30px rgba(0,0,0,.22),0 10px 25px -15px rgba(0,0,0,.15)}
@media(min-width:900px){.ee-hero-visual{aspect-ratio:5/4}}
.ee-hero-visual img,.ee-hero-visual .ee-hero-visual-link{display:block;width:100%;height:100%;object-fit:cover}
.ee-hero-visual .ee-hero-visual-link img{border-radius:inherit}
.ee-hero-visual-placeholder{width:100%;height:100%;background:repeating-linear-gradient(45deg,rgba(0,166,81,.06) 0 12px,rgba(27,167,223,.06) 12px 24px)}

/* Stagger reveal inside the active slide */
.ee-hero-split-slide [data-anim]{opacity:0;transform:translate3d(0,14px,0);transition:opacity .7s ease,transform .8s cubic-bezier(.22,.61,.36,1)}
.ee-hero-split-slide [data-anim="visual"]{transform:translate3d(24px,0,0)}
.ee-hero-split-slide.is-active [data-anim]{opacity:1;transform:translate3d(0,0,0)}
.ee-hero-split-slide.is-active [data-anim="eyebrow"]{transition-delay:.10s}
.ee-hero-split-slide.is-active [data-anim="title"]  {transition-delay:.22s}
.ee-hero-split-slide.is-active [data-anim="sub"]    {transition-delay:.36s}
.ee-hero-split-slide.is-active [data-anim="ctas"]   {transition-delay:.50s}
.ee-hero-split-slide.is-active [data-anim="visual"] {transition-delay:.18s}

/* Arrows — always on the sides, vertically centred, sitting just outside
   the content columns so they never overlap the text or image. */
.ee-hero-split-arrow{position:absolute;z-index:5;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.94);border:1px solid var(--ee-grey-200,#e5e7eb);color:var(--ee-dark);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0;box-shadow:0 10px 24px -10px rgba(0,0,0,.2);transition:background .25s ease,transform .25s ease,border-color .25s ease,color .25s ease;top:50%;transform:translateY(-50%)}
.ee-hero-split-arrow svg{width:18px;height:18px}
.ee-hero-split-arrow:hover{background:var(--ee-primary);border-color:var(--ee-primary);color:#fff;transform:translateY(-50%) scale(1.06)}
/* Arrows ride in the empty gutter outside the container — when there's
   room they sit ~30px clear of the content; on narrower viewports they
   clamp to the viewport edge so they're never clipped.
   Formula: (100vw - 100%) / 2 = empty space outside the slider on each
   side. We use max() to negate that, so the arrow's left edge lands on
   the viewport edge — but never further than -80px (which gives the
   ~30px gap on 1340px+ screens). */
.ee-hero-split-arrow--prev{left:-8px}
.ee-hero-split-arrow--next{right:-8px}
@media(min-width:560px){
	.ee-hero-split-arrow--prev{left:-14px}
	.ee-hero-split-arrow--next{right:-14px}
}
@media(min-width:900px){
	.ee-hero-split-arrow{width:50px;height:50px}
	.ee-hero-split-arrow svg{width:20px;height:20px}
	.ee-hero-split-arrow--prev{left:max(calc(6px - (100vw - 100%) / 2), -80px)}
	.ee-hero-split-arrow--next{right:max(calc(6px - (100vw - 100%) / 2), -80px)}
}

/* Dots */
.ee-hero-split-dots{display:flex;gap:10px;justify-content:center;margin-top:48px}
@media(min-width:900px){.ee-hero-split-dots{margin-top:32px}}
.ee-hero-split-dot{width:10px;height:10px;border-radius:50%;border:0;background:rgba(11,11,11,.18);cursor:pointer;padding:0;transition:background .25s ease,width .25s ease,border-radius .25s ease}
.ee-hero-split-dot:hover{background:rgba(11,11,11,.4)}
.ee-hero-split-dot.is-active{background:var(--ee-primary);width:30px;border-radius:6px}

@keyframes spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){
	.ee-hero-split-slide{transition:none}
	.ee-hero-split-slide [data-anim]{transition:none;opacity:1;transform:none}
}

/* --- OVERVIEW --- */
.ee-overview{background:#fff}
.ee-overview-grid{display:flex;flex-direction:column;gap:44px;align-items:stretch}
@media(min-width:900px){.ee-overview-grid{flex-direction:row;align-items:center}}
.ee-overview-media{flex:0 0 auto;width:100%}
.ee-overview-copy{flex:1 1 auto;min-width:0;max-width:100%}
@media(min-width:900px){
	.ee-overview-media{flex:0 0 45%;max-width:45%}
	.ee-overview-copy{flex:1 1 0;min-width:0}
}
.ee-overview-media img,.ee-overview-media .ee-overview-slider,.ee-overview-media .ee-overview-placeholder{display:block;width:100%;max-width:100%;height:auto}
.ee-overview-media img{border-radius:var(--ee-radius-lg);box-shadow:var(--ee-shadow)}
.ee-overview-slider{position:relative;aspect-ratio:4/5;border-radius:var(--ee-radius-lg);overflow:hidden;box-shadow:var(--ee-shadow);background:var(--ee-grey-100)}
.ee-overview-slider .ee-hero-slide{position:absolute;inset:0;opacity:0;transition:opacity .9s ease;pointer-events:none}
.ee-overview-slider .ee-hero-slide.is-active{opacity:1;pointer-events:auto}
.ee-overview-slider .ee-hero-slide img{width:100%;height:100%;object-fit:cover;border-radius:0;box-shadow:none}
.ee-overview-slider .ee-hero-slider-dots{position:absolute;left:0;right:0;bottom:14px;display:flex;justify-content:center;gap:8px;z-index:3}
.ee-overview-slider .ee-hero-slider-dot{width:9px;height:9px;border-radius:50%;border:0;background:rgba(255,255,255,.6);cursor:pointer;padding:0;transition:background .25s ease,transform .25s ease,width .25s ease}
.ee-overview-slider .ee-hero-slider-dot.is-active{background:#fff;width:24px;border-radius:6px}
.ee-overview-placeholder{position:relative;aspect-ratio:1;background:var(--ee-grey-100);border-radius:var(--ee-radius-lg);overflow:hidden}
.ee-hex{position:absolute;width:64px;height:64px;clip-path:polygon(25% 5%,75% 5%,100% 50%,75% 95%,25% 95%,0 50%)}
.ee-hex-green{background:var(--ee-primary);top:18%;left:18%}
.ee-hex-orange{background:var(--ee-accent);top:16%;right:22%}
.ee-hex-blue{background:var(--ee-info);bottom:20%;left:22%}
.ee-hex-dark{background:var(--ee-dark);bottom:18%;right:18%}
.ee-best-line{font-family:var(--ee-font-display);font-size:clamp(20px,2.2vw,26px);color:var(--ee-primary);font-weight:700;margin:0 0 14px;padding-left:16px;border-left:4px solid var(--ee-accent)}
.ee-overview-text{color:var(--ee-grey-700);font-size:17px;margin:0}

/* Overview chip marquees — sit inside the right copy column only, below the body text. */
.ee-overview-marquees{margin-top:28px;display:flex;flex-direction:column;gap:12px;border-radius:var(--ee-radius-lg);padding:4px 0;width:100%;max-width:100%;min-width:0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.ee-overview-marquee{overflow:hidden;min-width:0;max-width:100%}
.ee-overview-marquee-track{display:flex;width:max-content;will-change:transform}
.ee-overview-marquee--left  .ee-overview-marquee-track{animation:ee-marq-left 34s linear infinite}
.ee-overview-marquee--right .ee-overview-marquee-track{animation:ee-marq-right 34s linear infinite}
.ee-overview-marquee:hover .ee-overview-marquee-track{animation-play-state:paused}
.ee-overview-marquee-strip{display:flex;align-items:center;gap:10px;padding-right:10px;flex-shrink:0}
.ee-overview-chip{display:inline-flex;align-items:center;gap:8px;padding:7px 16px 7px 7px;background:linear-gradient(135deg,#E55A12 0%,#F7941D 60%,#FFB356 100%);color:#fff;border-radius:999px;box-shadow:0 8px 20px -16px rgba(229,90,18,.65),inset 0 1px 0 rgba(255,255,255,.25);white-space:nowrap;font-weight:600;font-size:13px;letter-spacing:.01em}
.ee-overview-marquee:nth-child(2) .ee-overview-chip{background:linear-gradient(135deg,#0B0B0B 0%,#2a2a2a 60%,#444 100%);box-shadow:0 8px 20px -16px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.08)}
.ee-overview-chip-img{width:26px;height:26px;border-radius:50%;overflow:hidden;flex-shrink:0;background:#fff;display:block;border:2px solid rgba(255,255,255,.75)}
.ee-overview-chip-img img{width:100%;height:100%;object-fit:cover;display:block}
.ee-overview-chip-dot{width:24px;height:24px;border-radius:50%;background:rgba(255,255,255,.18);flex-shrink:0;border:2px solid rgba(255,255,255,.4)}
.ee-overview-chip-text{line-height:1}
@keyframes ee-marq-left  { from{transform:translateX(0)}     to{transform:translateX(-50%)} }
@keyframes ee-marq-right { from{transform:translateX(-50%)} to{transform:translateX(0)}    }
@media(prefers-reduced-motion:reduce){
	.ee-overview-marquee--left  .ee-overview-marquee-track,
	.ee-overview-marquee--right .ee-overview-marquee-track{animation:none}
}

/* --- COURSES --- */
.ee-courses{background:var(--ee-grey-50)}
.ee-courses-grid{display:grid;grid-template-columns:1fr;gap:26px}
@media(min-width:720px){.ee-courses-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1040px){.ee-courses-grid{grid-template-columns:repeat(3,1fr)}}
.ee-course-card{position:relative;background:#fff;border:1px solid var(--ee-grey-200);border-radius:var(--ee-radius-lg);overflow:hidden;display:flex;flex-direction:column;transition:transform .45s cubic-bezier(.2,.7,.2,1),border-color .35s ease,box-shadow .45s ease;isolation:isolate;will-change:transform}
.ee-course-card::before{content:"";position:absolute;inset:auto 0 0 0;height:3px;background:linear-gradient(90deg,var(--ee-primary),var(--ee-accent),var(--ee-info));transform:scaleX(0);transform-origin:left center;transition:transform .55s ease;z-index:3}
.ee-course-card:hover{border-color:transparent;box-shadow:0 40px 80px -30px rgba(11,11,11,.28);transform:translateY(-8px)}
.ee-course-card:hover::before{transform:scaleX(1)}
.ee-course-media{position:relative;aspect-ratio:16/10;background:linear-gradient(135deg,var(--ee-grey-100),#fff);overflow:hidden}
.ee-course-media > img,.ee-course-cover{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1),filter .5s ease}

/* Horizontal sliding track for gallery cards — images slide right-to-left */
.ee-course-track{position:absolute;inset:0;display:flex;width:100%;height:100%;transition:transform 1200ms cubic-bezier(.65,0,.35,1);will-change:transform}
.ee-course-track .ee-course-img{flex:0 0 100%;width:100%;height:100%;object-fit:cover;opacity:1;transform:none;transition:transform 1.2s cubic-bezier(.2,.7,.2,1),filter .5s ease}

/* Single-image fallback keeps the image as a normal cover image */
.ee-course-media[data-slides="1"] .ee-course-img,
.ee-course-media > .ee-course-img{position:relative;opacity:1;transform:none;display:block}

.ee-course-card:hover .ee-course-media > img,
.ee-course-card:hover .ee-course-cover,
.ee-course-card:hover .ee-course-track .ee-course-img{transform:scale(1.06)}
.ee-course-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,166,81,.0) 35%,rgba(11,11,11,.45));opacity:0;transition:opacity .4s ease;pointer-events:none;z-index:3}
.ee-course-card:hover .ee-course-media::after{opacity:1}
/* Animated colored accent that sweeps across the image on hover */
.ee-course-media::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(0,166,81,.0) 0%,rgba(0,166,81,.25) 45%,rgba(247,148,29,.22) 60%,rgba(0,166,81,0) 100%);transform:translateX(-110%);transition:transform .9s cubic-bezier(.2,.7,.2,1);pointer-events:none;z-index:3;mix-blend-mode:screen}
.ee-course-card:hover .ee-course-media::before{transform:translateX(110%)}
/* Carousel dots — small indicator at the bottom of the image when >1 slides */
.ee-course-media[data-slides="1"]{}
.ee-course-card--gallery .ee-course-media{position:relative}

/* Left/right arrows for course gallery cards */
.ee-course-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.92);border:0;color:var(--ee-dark);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0;opacity:0;box-shadow:0 6px 18px -8px rgba(0,0,0,.4);transition:opacity .3s ease,background .25s ease,color .25s ease,transform .25s ease}
.ee-course-arrow svg{width:16px;height:16px}
.ee-course-card:hover .ee-course-arrow,
.ee-course-media:focus-within .ee-course-arrow{opacity:1}
.ee-course-arrow:hover{background:var(--ee-primary);color:#fff;transform:translateY(-50%) scale(1.08)}
.ee-course-arrow--prev{left:10px}
.ee-course-arrow--next{right:10px}

/* Dots under the gallery card image */
.ee-course-dots{position:absolute;left:0;right:0;bottom:10px;display:flex;gap:6px;justify-content:center;z-index:5}
.ee-course-dot{width:7px;height:7px;border-radius:50%;border:0;background:rgba(255,255,255,.6);cursor:pointer;padding:0;transition:background .25s ease,width .25s ease,border-radius .25s ease}
.ee-course-dot:hover{background:#fff}
.ee-course-dot.is-active{background:#fff;width:20px;border-radius:4px}
.ee-course-cover{display:flex;align-items:center;justify-content:center;color:#fff;background:linear-gradient(135deg,var(--ee-primary),var(--ee-info));font-family:var(--ee-font-display);font-size:48px;font-weight:900;letter-spacing:-.03em}
.ee-course-price{position:absolute;top:14px;right:14px;background:var(--ee-dark);color:#fff;padding:6px 12px;border-radius:999px;font-weight:700;font-size:13px;backdrop-filter:blur(6px);transition:background .3s ease,transform .3s ease,box-shadow .3s ease;z-index:4}
.ee-course-card:hover .ee-course-price{background:var(--ee-primary);transform:translateY(-2px) scale(1.05);box-shadow:0 10px 24px -10px rgba(0,166,81,.6)}
.ee-course-body{padding:26px;display:flex;flex-direction:column;flex:1;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.ee-course-meta{color:var(--ee-grey-500);font-size:13px;margin-bottom:6px}
.ee-course-title{font-family:var(--ee-font-display);font-weight:800;font-size:22px;margin:0 0 8px;transition:color .3s ease,transform .4s ease}
.ee-course-card:hover .ee-course-title{color:var(--ee-primary);transform:translateX(2px)}
.ee-course-desc{color:var(--ee-grey-700);font-size:15px;margin:0 0 16px}
.ee-course-points{list-style:none;padding:0;margin:0 0 20px;display:grid;gap:8px}
.ee-course-points li{display:flex;gap:10px;align-items:flex-start;font-size:15px;color:var(--ee-grey-700)}
.ee-check{flex-shrink:0;width:22px;height:22px;border-radius:50%;background:rgba(0,166,81,.12);color:var(--ee-primary);display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:900;margin-top:1px;transition:background .3s ease,transform .3s ease}
.ee-course-card:hover .ee-check{background:var(--ee-primary);color:#fff}
.ee-course-cta{align-self:flex-start;margin-top:auto;position:relative;overflow:hidden;transition:transform .4s ease,box-shadow .4s ease}
.ee-course-cta::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);transform:translateX(-120%);transition:transform .8s ease}
.ee-course-card:hover .ee-course-cta{transform:translateY(-2px);box-shadow:0 14px 30px -10px rgba(0,166,81,.5)}
.ee-course-card:hover .ee-course-cta::after{transform:translateX(120%)}

/* --- MISSION — dark ecommerce-themed panel --- */
.ee-mission{position:relative;color:#fff;overflow:hidden;isolation:isolate;background:#0f1722}
.ee-mission::before{
	content:"";position:absolute;inset:0;z-index:-2;
	background:
		radial-gradient(circle at 18% 22%,rgba(0,166,81,.22),transparent 42%),
		radial-gradient(circle at 82% 78%,rgba(247,148,29,.20),transparent 44%),
		radial-gradient(circle at 55% 50%,rgba(27,167,223,.10),transparent 55%),
		linear-gradient(135deg,#0d1420 0%,#141c2c 40%,#0a1120 100%);
}
.ee-mission::after{
	content:"";position:absolute;inset:0;z-index:-1;opacity:.14;pointer-events:none;
	background-image:
		url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200' viewBox='0 0 200 200'><g fill='none' stroke='%23ffffff' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round' opacity='0.5'><!-- shopping cart --><path d='M20 40 h12 l6 28 h36 l6 -22 h-48'/><circle cx='46' cy='80' r='4'/><circle cx='78' cy='80' r='4'/><!-- package box --><path d='M120 32 l24 12 l24 -12 l-24 -12 z'/><path d='M120 32 v28 l24 12 v-28'/><path d='M168 32 v28 l-24 12 v-28'/><!-- tag --><path d='M30 120 l30 -30 h24 v24 l-30 30 z'/><circle cx='74' cy='110' r='3'/><!-- storefront --><path d='M120 150 h56 v20 h-56 z'/><path d='M118 150 l6 -16 h48 l6 16'/><path d='M138 170 v-12 h20 v12'/><!-- dollar badge --><circle cx='170' cy='100' r='14'/><path d='M170 92 v16 M166 96 h8 a2 2 0 0 1 0 4 h-8 a2 2 0 0 0 0 4 h8'/></g></svg>");
	background-size:260px 260px;
	mask-image:linear-gradient(180deg,transparent,#000 20%,#000 80%,transparent);
	-webkit-mask-image:linear-gradient(180deg,transparent,#000 20%,#000 80%,transparent);
}
.ee-mission-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr;gap:40px;align-items:center}
@media(min-width:900px){.ee-mission-grid{grid-template-columns:1.1fr .9fr}}
.ee-mission-text{color:rgba(255,255,255,.82);font-size:17px;margin:0 0 22px}
.ee-mission-points{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr;gap:10px}
@media(min-width:560px){.ee-mission-points{grid-template-columns:repeat(2,1fr)}}
.ee-mission-points li{display:flex;gap:10px;align-items:center;background:rgba(255,255,255,.04);padding:12px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(4px);transition:background .3s,border-color .3s,transform .3s}
.ee-mission-points li:hover{background:rgba(255,255,255,.07);border-color:rgba(247,148,29,.35);transform:translateX(4px)}
.ee-mission-points .ee-check{background:rgba(247,148,29,.2);color:var(--ee-accent)}
.ee-mission-media{position:relative}
.ee-mission-media img{border-radius:var(--ee-radius-lg);box-shadow:0 30px 70px -30px rgba(0,0,0,.6)}
.ee-mission-placeholder{aspect-ratio:4/5;border-radius:var(--ee-radius-lg);background:linear-gradient(135deg,var(--ee-primary),var(--ee-info));position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:30px;box-shadow:0 30px 70px -30px rgba(0,0,0,.55)}
.ee-mission-placeholder::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 20%,rgba(247,148,29,.55),transparent 55%)}
.ee-mission-number{font-family:var(--ee-font-display);font-weight:900;font-size:88px;line-height:1;color:#fff;opacity:.9;position:relative}
.ee-mission-caption{position:relative;color:#fff;font-weight:600;letter-spacing:.12em;text-transform:uppercase;font-size:12px;margin-top:6px}

/* --- REVIEWS (Marquee / Talha Reviews style) --- */
/* Reviews / Client stories — warm brand-tinted backdrop with soft glow */
.ee-reviews{position:relative;background:
	radial-gradient(1000px 520px at 0% 0%,rgba(0,166,81,.14),transparent 60%),
	radial-gradient(900px 480px at 100% 100%,rgba(247,148,29,.14),transparent 60%),
	linear-gradient(180deg,#FAFBF7 0%,#FFFFFF 50%,#FFF6EC 100%);
	overflow:hidden}
.ee-reviews::before,.ee-reviews::after{content:"";position:absolute;border-radius:50%;filter:blur(100px);pointer-events:none;opacity:.55;z-index:0}
.ee-reviews::before{width:480px;height:480px;background:rgba(0,166,81,.28);top:-160px;right:-120px}
.ee-reviews::after {width:440px;height:440px;background:rgba(27,167,223,.20);bottom:-180px;left:-140px}
.ee-reviews > .ee-container{position:relative;z-index:1}
.ee-reviews .ee-reviews-marquee{position:relative;z-index:1}
.ee-reviews .ee-section-head{margin-bottom:56px}

.ee-reviews-marquee{position:relative;overflow:hidden;padding:6px 0;mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%)}
.ee-reviews-marquee-gap{margin-top:22px}

.ee-reviews-track{display:flex;gap:0;width:max-content;will-change:transform}
.ee-reviews-track-left{animation:ee-marquee-left 60s linear infinite}
.ee-reviews-track-right{animation:ee-marquee-right 60s linear infinite}
@keyframes ee-marquee-left{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes ee-marquee-right{from{transform:translateX(-50%)}to{transform:translateX(0)}}
.ee-reviews-marquee:hover .ee-reviews-track{animation-play-state:paused}

.ee-reviews-strip{display:flex;gap:22px;padding-right:22px;flex-shrink:0}

.ee-review-card{flex:0 0 380px;width:380px;background:#fff;border:1px solid var(--ee-grey-200);border-radius:var(--ee-radius-lg);padding:26px 28px;box-shadow:0 4px 10px -6px rgba(0,0,0,.06);transition:transform .2s ease,box-shadow .2s ease,border-color .2s}
.ee-review-card:hover{transform:translateY(-4px);border-color:transparent;box-shadow:var(--ee-shadow-lg)}
@media(max-width:560px){.ee-review-card{flex:0 0 300px;width:300px;padding:22px}}

.ee-review-top{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.ee-review-avatar-wrap{position:relative;flex-shrink:0}
.ee-review-photo{width:64px;height:64px;border-radius:50%;object-fit:cover;display:block;background:var(--ee-grey-100);box-shadow:0 6px 18px -10px rgba(0,0,0,.3)}
.ee-review-photo-fallback{display:flex;align-items:center;justify-content:center;font-family:var(--ee-font-display);font-weight:800;font-size:26px;color:#fff;background:linear-gradient(135deg,var(--ee-primary),var(--ee-info))}
.ee-review-verified{position:absolute;right:-2px;bottom:-2px;width:22px;height:22px;border-radius:50%;background:var(--ee-primary);color:#fff;font-size:12px;font-weight:900;display:inline-flex;align-items:center;justify-content:center;border:2px solid #fff}

.ee-review-who{display:flex;flex-direction:column;gap:2px;min-width:0}
.ee-review-name{font-size:16px;font-weight:700;color:var(--ee-dark);line-height:1.2}
.ee-review-role{font-size:13px;color:var(--ee-grey-500);line-height:1.2}
.ee-review-stars{color:var(--ee-accent);font-size:15px;letter-spacing:1px;margin-top:4px}
.ee-star-off{color:var(--ee-grey-200)}

.ee-review-text{color:var(--ee-grey-700);font-size:15.5px;line-height:1.65;margin:0;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}

/* Respect reduced-motion preference */
@media (prefers-reduced-motion: reduce){
	.ee-reviews-track-left,.ee-reviews-track-right{animation:none}
	.ee-reviews-track-right{transform:translateX(-50%)}
}

/* --- FEEDBACK (Carousel / Big Quotes) --- */
.ee-feedback{background:linear-gradient(180deg,var(--ee-grey-50) 0,#fff 100%)}
.ee-feedback-carousel{position:relative;max-width:960px;margin:0 auto}
.ee-feedback-track{position:relative;min-height:280px}
.ee-feedback-slide{position:absolute;inset:0;opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .4s ease,transform .4s ease}
.ee-feedback-slide.is-active{opacity:1;transform:translateY(0);pointer-events:auto;position:relative}
.ee-feedback-card{background:#fff;border:1px solid var(--ee-grey-200);border-radius:var(--ee-radius-lg);padding:40px;display:grid;grid-template-columns:1fr;gap:28px;align-items:center;box-shadow:var(--ee-shadow)}
@media(min-width:720px){.ee-feedback-card{grid-template-columns:180px 1fr;padding:48px}}
.ee-feedback-media img,.ee-feedback-avatar-fallback{width:160px;height:160px;border-radius:50%;object-fit:cover;margin:0 auto;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--ee-accent),var(--ee-primary));color:#fff;font-family:var(--ee-font-display);font-weight:900;font-size:52px}
.ee-quote-mark{font-family:var(--ee-font-display);font-size:74px;line-height:.6;color:var(--ee-accent);display:block;margin-bottom:-6px}
.ee-feedback-text{font-size:clamp(18px,2.1vw,22px);color:var(--ee-dark);line-height:1.55;margin:0 0 18px;font-weight:500}
.ee-feedback-author strong{display:block;font-size:17px;color:var(--ee-primary)}
.ee-feedback-author span{color:var(--ee-grey-500)}
.ee-feedback-controls{display:flex;gap:14px;justify-content:center;align-items:center;margin-top:24px}
.ee-feedback-prev,.ee-feedback-next{width:44px;height:44px;border-radius:50%;background:#fff;border:1px solid var(--ee-grey-200);cursor:pointer;font-size:22px;display:inline-flex;align-items:center;justify-content:center;transition:background .2s,border-color .2s,color .2s}
.ee-feedback-prev:hover,.ee-feedback-next:hover{background:var(--ee-dark);color:#fff;border-color:var(--ee-dark)}
.ee-feedback-dots{display:flex;gap:8px}
.ee-dot-btn{width:10px;height:10px;border-radius:50%;border:0;background:var(--ee-grey-300);cursor:pointer;padding:0;transition:background .2s,transform .2s}
.ee-dot-btn.is-active{background:var(--ee-primary);transform:scale(1.4)}

/* --- BLOG --- */
/* Blog — soft green-tinted brand background with ambient blobs */
.ee-blog{position:relative;background:linear-gradient(180deg,#F4FBF7 0%,#FFFFFF 55%,#FFF8EE 100%);overflow:hidden}
.ee-blog::before,.ee-blog::after{content:"";position:absolute;border-radius:50%;filter:blur(90px);pointer-events:none;z-index:0}
.ee-blog::before{width:520px;height:520px;background:rgba(0,166,81,.18);top:-160px;left:-140px}
.ee-blog::after {width:420px;height:420px;background:rgba(247,148,29,.15);bottom:-180px;right:-120px}
.ee-blog > .ee-container{position:relative;z-index:1}
/* Transparent ecommerce icons scattered across the blog section background */
.ee-blog-bg-icons{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0}
.ee-blog-bg-icons .ee-bg-ic{position:absolute;color:var(--ee-primary);opacity:.07}
.ee-blog-bg-icons .ee-bg-ic:nth-of-type(2n){color:var(--ee-accent)}
.ee-blog-bg-icons .ee-bg-ic:nth-of-type(3n){color:var(--ee-info)}
.ee-blog-bg-icons .ee-bg-ic:nth-of-type(5n){color:var(--ee-dark);opacity:.05}
.ee-blog-bg-icons .ee-bg-ic--cart  {width:110px;height:110px;top:6%;left:4%;transform:rotate(-8deg)}
.ee-blog-bg-icons .ee-bg-ic--bag   {width:78px;height:78px;top:12%;right:8%;transform:rotate(10deg)}
.ee-blog-bg-icons .ee-bg-ic--box   {width:120px;height:120px;top:58%;left:3%;transform:rotate(6deg)}
.ee-blog-bg-icons .ee-bg-ic--tag   {width:72px;height:72px;top:34%;left:46%;transform:rotate(-14deg)}
.ee-blog-bg-icons .ee-bg-ic--dollar{width:90px;height:90px;top:70%;right:6%;transform:rotate(-6deg)}
.ee-blog-bg-icons .ee-bg-ic--truck {width:100px;height:100px;top:2%;left:52%;transform:rotate(4deg)}
.ee-blog-bg-icons .ee-bg-ic--gift  {width:84px;height:84px;top:82%;left:38%;transform:rotate(-10deg)}
.ee-blog-bg-icons .ee-bg-ic--store {width:96px;height:96px;top:44%;right:3%;transform:rotate(8deg)}
.ee-blog-bg-icons .ee-bg-ic--card  {width:110px;height:110px;top:50%;left:24%;transform:rotate(-4deg)}
.ee-blog-bg-icons .ee-bg-ic--chart {width:88px;height:88px;top:20%;left:28%;transform:rotate(12deg)}
.ee-blog-bg-icons .ee-bg-ic--star  {width:70px;height:70px;top:88%;left:10%;transform:rotate(18deg)}
.ee-blog-bg-icons .ee-bg-ic--heart {width:68px;height:68px;top:24%;right:30%;transform:rotate(-10deg)}
@media (max-width:720px){
	.ee-blog-bg-icons .ee-bg-ic{opacity:.05}
	.ee-blog-bg-icons .ee-bg-ic--cart,.ee-blog-bg-icons .ee-bg-ic--box,.ee-blog-bg-icons .ee-bg-ic--card{width:84px;height:84px}
}
.ee-blog-head-row{display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between;align-items:flex-end}
.ee-blog-grid{display:grid;grid-template-columns:1fr;gap:26px;margin-top:28px}
@media(min-width:720px){.ee-blog-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1040px){.ee-blog-grid{grid-template-columns:repeat(3,1fr)}}
.ee-blog-card{position:relative;border:1px solid rgba(11,11,11,.06);border-radius:var(--ee-radius-lg);overflow:hidden;background:#fff;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease,border-color .35s ease;isolation:isolate}
.ee-blog-card::before{content:"";position:absolute;inset:auto 0 0 0;height:3px;background:linear-gradient(90deg,var(--ee-primary),var(--ee-accent),var(--ee-info));transform:scaleX(0);transform-origin:left center;transition:transform .5s ease;z-index:3}
.ee-blog-card:hover{transform:translateY(-6px);box-shadow:0 28px 52px -28px rgba(11,11,11,.22);border-color:transparent}
.ee-blog-card:hover::before{transform:scaleX(1)}
.ee-blog-thumb{display:block;aspect-ratio:16/10;overflow:hidden;background:var(--ee-grey-100);position:relative}
.ee-blog-thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(11,11,11,.18));opacity:0;transition:opacity .35s ease;pointer-events:none}
.ee-blog-card:hover .ee-blog-thumb::after{opacity:1}
.ee-blog-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1),filter .4s ease}
.ee-blog-card:hover .ee-blog-thumb img{transform:scale(1.08)}
.ee-blog-thumb-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--ee-info),var(--ee-primary));color:#fff;font-family:var(--ee-font-display);font-weight:600;font-size:40px}
.ee-blog-body{padding:22px}
.ee-blog-meta{color:var(--ee-grey-500);font-size:13px;margin-bottom:8px;display:flex;gap:8px;flex-wrap:wrap}
.ee-blog-title{font-family:var(--ee-font-display);font-size:22px;font-weight:600;margin:0 0 10px;line-height:1.3;transition:color .25s ease}
.ee-blog-card:hover .ee-blog-title{color:var(--ee-primary)}
.ee-blog-title a{color:inherit;text-decoration:none}
.ee-blog-title a:hover{color:var(--ee-primary)}
.ee-blog-excerpt{color:var(--ee-grey-700);margin:0 0 14px}
.ee-read-more{color:var(--ee-primary);font-weight:600}

/* --- PARTNERS — smooth infinite marquee --- */
.ee-partners{background:var(--ee-grey-50);padding:72px 0;overflow:hidden}
.ee-partners .ee-section-head{margin-bottom:40px}
.ee-partners-marquee{position:relative;overflow:hidden;mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%)}
.ee-partners-track{display:flex;width:max-content;animation:ee-marquee-left 40s linear infinite;will-change:transform}
.ee-partners-marquee:hover .ee-partners-track{animation-play-state:paused}
.ee-partners-strip{display:flex;align-items:center;gap:48px;padding-right:48px;flex-shrink:0}
.ee-partner{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;height:88px;min-width:180px;padding:10px 22px;background:transparent;border:0;transition:opacity .3s ease,transform .3s ease}
.ee-partner img{max-height:56px;width:auto;filter:none;opacity:1;transition:transform .3s ease}
.ee-partner:hover img{transform:translateY(-2px)}
.ee-partner-fallback{font-family:var(--ee-font-display);font-weight:700;font-size:20px;color:var(--ee-grey-500);letter-spacing:-.01em;transition:color .3s ease}
.ee-partner:hover .ee-partner-fallback{color:var(--ee-dark)}
@media (prefers-reduced-motion: reduce){.ee-partners-track{animation:none}}

/* --- FAQ --- */
.ee-faq{background:#fff}
.ee-faq-grid{display:grid;grid-template-columns:1fr;gap:40px}
@media(min-width:900px){.ee-faq-grid{grid-template-columns:.8fr 1.2fr}}
.ee-faq-illus{position:relative;margin-top:30px;height:200px}
.ee-faq-illus .ee-hex{position:relative;display:inline-block;margin-right:-18px}
.ee-faq-illus .ee-hex-green{top:10px}
.ee-faq-illus .ee-hex-orange{top:-14px}
.ee-faq-illus .ee-hex-blue{top:30px}
.ee-faq-list{display:flex;flex-direction:column;gap:12px}
.ee-faq-item{border:1px solid var(--ee-grey-200);border-radius:var(--ee-radius);padding:0;background:#fff;transition:border-color .2s,box-shadow .2s}
.ee-faq-item[open]{border-color:var(--ee-primary);box-shadow:0 6px 18px -8px rgba(0,166,81,.2)}
.ee-faq-item summary{list-style:none;display:flex;align-items:center;gap:16px;padding:18px 22px;cursor:pointer;font-weight:600;font-size:17px;color:var(--ee-dark)}
.ee-faq-item summary::-webkit-details-marker{display:none}
.ee-faq-q{flex:1}
.ee-faq-toggle{width:30px;height:30px;border-radius:50%;background:var(--ee-grey-100);display:inline-flex;align-items:center;justify-content:center;font-weight:900;color:var(--ee-primary);transition:transform .2s}
.ee-faq-item[open] .ee-faq-toggle{transform:rotate(45deg);background:var(--ee-primary);color:#fff}
.ee-faq-a{padding:0 22px 22px;color:var(--ee-grey-700)}
.ee-faq-a p{margin:0}

/* --- CONTACT --- */
/* Contact — bright, airy panel with subtle brand tint */
.ee-contact{position:relative;background:
	radial-gradient(900px 480px at 0% 0%,rgba(0,166,81,.10),transparent 60%),
	radial-gradient(900px 480px at 100% 100%,rgba(247,148,29,.10),transparent 60%),
	linear-gradient(180deg,#FFFFFF 0%,var(--ee-grey-50) 100%);
	overflow:hidden}
.ee-contact > .ee-container{position:relative;z-index:1}
.ee-contact-grid{display:grid;grid-template-columns:1fr;gap:40px;align-items:flex-start}
@media(min-width:900px){.ee-contact-grid{grid-template-columns:.9fr 1.1fr}}
.ee-contact-list{list-style:none;padding:0;margin:28px 0 0;display:flex;flex-direction:column;gap:12px}
.ee-contact-list li{display:flex;gap:14px;align-items:center;background:#fff;padding:16px 18px;border:1px solid var(--ee-grey-200);border-radius:var(--ee-radius);transition:border-color .25s ease,transform .25s ease,box-shadow .25s ease}
.ee-contact-list li:hover{border-color:rgba(0,166,81,.35);transform:translateX(4px);box-shadow:var(--ee-shadow)}
.ee-contact-list li > div{color:var(--ee-dark);font-weight:600;font-size:16px;line-height:1.4}
.ee-contact-list li strong{display:block;font-size:12px;color:var(--ee-grey-500);font-weight:600;letter-spacing:.08em;text-transform:uppercase;margin-bottom:2px}
.ee-contact-list li a{color:inherit;font-weight:inherit;text-decoration:none}
.ee-contact-list li a:hover{color:var(--ee-primary)}
.ee-contact-ic{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--ee-primary),var(--ee-accent));display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;font-size:18px;color:#fff;box-shadow:0 8px 20px -12px rgba(0,166,81,.4)}

.ee-contact-form-wrap{background:#fff;border:1px solid var(--ee-grey-200);border-radius:var(--ee-radius-lg);padding:32px 30px;box-shadow:0 20px 50px -30px rgba(11,11,11,.2);position:relative;overflow:hidden}
.ee-contact-form-wrap::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:linear-gradient(90deg,var(--ee-primary),var(--ee-accent),var(--ee-info))}
.ee-contact-form-fallback h3{margin:0 0 4px;font-size:22px;font-weight:600;color:var(--ee-dark)}
.ee-contact-form-fallback .description{color:var(--ee-grey-700);margin:0 0 16px}
.ee-contact-form-fallback form{display:grid;gap:14px;margin-top:10px}
.ee-contact-form-fallback label{display:flex;flex-direction:column;gap:6px;font-weight:600;font-size:13px;color:var(--ee-grey-700);text-transform:uppercase;letter-spacing:.06em}
.ee-contact-form-fallback input,.ee-contact-form-fallback textarea{border:1px solid var(--ee-grey-200);background:var(--ee-grey-50);border-radius:10px;padding:13px 14px;font-family:inherit;font-size:15px;text-transform:none;letter-spacing:0;color:var(--ee-dark);transition:border-color .2s,box-shadow .2s,background .2s}
.ee-contact-form-fallback input:focus,.ee-contact-form-fallback textarea:focus{outline:none;border-color:var(--ee-primary);background:#fff;box-shadow:0 0 0 4px rgba(0,166,81,.14)}
.ee-contact-form-fallback button{justify-self:start;margin-top:8px}

/* Style WPForms nicely when embedded */
.ee-contact-form-wrap .wpforms-field-label,.ee-contact-form-wrap label{font-weight:600;color:var(--ee-grey-700)}
.ee-contact-form-wrap .wpforms-submit,.ee-contact-form-wrap .wpforms-submit-container button{background:var(--ee-primary)!important;border:0!important;border-radius:999px!important;padding:12px 24px!important;color:#fff!important;font-weight:600!important}

/* --- FOOTER (Empowerers-style) --- */
.ee-footer{position:relative;background:#0a1020;color:#fff;padding:84px 0 0;margin-top:0;overflow:hidden;isolation:isolate}
.ee-footer-bg{
	position:absolute;inset:0;z-index:-1;pointer-events:none;
	background:
		radial-gradient(circle at 10% 10%,rgba(0,166,81,.18),transparent 45%),
		radial-gradient(circle at 90% 90%,rgba(27,167,223,.15),transparent 45%),
		radial-gradient(circle at 60% 20%,rgba(247,148,29,.10),transparent 55%),
		linear-gradient(160deg,#0a1020 0%,#0f1828 50%,#0a1020 100%);
}
.ee-footer-grid{display:grid;grid-template-columns:1fr;gap:40px}
@media(min-width:720px){.ee-footer-grid{grid-template-columns:1.5fr 1fr 1fr 1.3fr;gap:40px}}
.ee-footer-col{min-width:0}
.ee-footer-col p{color:rgba(255,255,255,.68);font-size:15px;margin:12px 0;line-height:1.7}

.ee-footer-brand{display:flex;flex-direction:column;align-items:flex-start}
/* Footer logo — max-height is set inline from the admin "Footer Logo Height" setting. */
.ee-footer-logo{width:auto;max-width:100%;margin-bottom:6px;filter:brightness(1.05)}
.ee-footer-title{color:#fff;margin:0;font-family:var(--ee-font-display);font-size:24px;font-weight:800}
.ee-footer-tagline{display:inline-block;color:var(--ee-primary);font-family:var(--ee-font-display);font-weight:700;font-size:15px;letter-spacing:.02em;margin:4px 0 10px;font-style:italic}
.ee-footer-about{color:rgba(255,255,255,.68);font-size:14px;line-height:1.7;max-width:360px;margin:6px 0 18px}

.ee-footer-heading{margin:0 0 18px;font-family:var(--ee-font-display);font-size:18px;font-weight:800;color:#fff;letter-spacing:.01em}

.ee-footer-links{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.ee-footer-links a{color:rgba(255,255,255,.72);font-size:14.5px;transition:color .25s ease,transform .25s ease;display:inline-block}
.ee-footer-links a:hover{color:var(--ee-primary);transform:translateX(3px)}

/* Contact column with green circle icons */
.ee-footer-contact{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:14px}
.ee-footer-contact-row{display:flex;align-items:flex-start;gap:12px;color:rgba(255,255,255,.78);font-size:14.5px;line-height:1.55}
.ee-footer-contact-row a{color:inherit;transition:color .25s ease}
.ee-footer-contact-row a:hover{color:var(--ee-primary)}
.ee-footer-ic{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:var(--ee-primary);color:#fff;box-shadow:0 8px 20px -10px rgba(0,166,81,.65)}
.ee-footer-ic svg{width:16px;height:16px}

/* Social buttons — circular */
.ee-footer-socials{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap}
.ee-footer-social{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.07);color:#fff;border:1px solid rgba(255,255,255,.08);transition:background .3s ease,color .3s ease,transform .3s ease,border-color .3s ease}
.ee-footer-social svg{width:17px;height:17px}
.ee-footer-social:hover{background:var(--ee-primary);color:#fff;transform:translateY(-2px);border-color:transparent;box-shadow:0 10px 24px -10px rgba(0,166,81,.55)}

/* Bottom copyright bar */
.ee-footer-bottom{border-top:1px solid rgba(255,255,255,.08);margin-top:56px;padding:20px 0;color:rgba(255,255,255,.55);font-size:13.5px}
.ee-footer-bottom-row{display:flex;align-items:center;justify-content:center;text-align:center}
.ee-footer-copy{margin:0}

/* Blog archive & single */
.ee-blog-archive,.ee-single,.ee-page,.ee-404{padding:72px 0}
.ee-archive-title{font-family:var(--ee-font-display);font-weight:800;margin:0 0 32px;font-size:clamp(28px,3.2vw,40px)}
.ee-posts-grid{display:grid;grid-template-columns:1fr;gap:22px}
@media(min-width:720px){.ee-posts-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1040px){.ee-posts-grid{grid-template-columns:repeat(3,1fr)}}
.ee-post-card{border:1px solid var(--ee-grey-200);border-radius:var(--ee-radius-lg);overflow:hidden;background:#fff}
.ee-post-thumb img{width:100%;aspect-ratio:16/10;object-fit:cover}
.ee-post-body{padding:22px}
.ee-post-title{font-family:var(--ee-font-display);font-size:22px;margin:0 0 8px}
.ee-post-meta{font-size:13px;color:var(--ee-grey-500);margin-bottom:10px}

.ee-single-wrap{max-width:820px}
.ee-single-thumb{border-radius:var(--ee-radius-lg);overflow:hidden;margin-bottom:26px}
.ee-single-thumb img{width:100%;height:auto;display:block}
.ee-single-title{font-family:var(--ee-font-display);font-weight:800;font-size:clamp(30px,3.5vw,46px);margin:0 0 16px;line-height:1.15}
.ee-single-meta{display:flex;gap:16px;color:var(--ee-grey-500);font-size:14px;flex-wrap:wrap;margin-bottom:30px}
.ee-single-body p{margin:0 0 18px;font-size:17px;line-height:1.8;color:var(--ee-grey-700)}

.ee-404-inner{text-align:center;padding:60px 0}
.ee-404 h1{font-size:120px;margin:0;font-family:var(--ee-font-display);font-weight:900;color:var(--ee-primary)}

/* --- COMMUNITY — 3 tiles visible per column, top-half blur + bottom-half blur, centre fully sharp --- */
.ee-community{background:#fff;overflow:hidden;position:relative}
.ee-community .ee-section-head{margin-bottom:40px}

/* Stage is sized to show ~3 tile-heights per column.
   At 1200px max-width with 4 cols + 18px gaps, each tile is ~260px square
   → 3 tiles (+ gaps) ≈ 816px. We set stage to 780px so the top & bottom
   tiles are partially cropped/blurred while the centre tile is fully sharp. */
.ee-community-stage{position:relative;max-width:1200px;margin:0 auto;padding:0 24px;height:780px;overflow:hidden}
@media(max-width:960px){.ee-community-stage{height:640px}}
@media(max-width:720px){.ee-community-stage{height:560px}}
@media(max-width:520px){.ee-community-stage{height:480px}}

.ee-community-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;height:100%}
@media(max-width:960px){.ee-community-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:560px){.ee-community-grid{grid-template-columns:repeat(2,1fr);gap:14px}}

.ee-community-col{position:relative;overflow:hidden;height:100%}
.ee-community-track{display:flex;flex-direction:column;will-change:transform}
.ee-community-col--up .ee-community-track{animation:ee-col-up 42s linear infinite}
.ee-community-col--down .ee-community-track{animation:ee-col-down 48s linear infinite}
.ee-community-col:nth-child(1) .ee-community-track{animation-duration:46s}
.ee-community-col:nth-child(2) .ee-community-track{animation-duration:56s}
.ee-community-col:nth-child(3) .ee-community-track{animation-duration:40s}
.ee-community-col:nth-child(4) .ee-community-track{animation-duration:62s}
.ee-community-stage:hover .ee-community-track{animation-play-state:paused}
@keyframes ee-col-up{from{transform:translateY(0)}to{transform:translateY(-50%)}}
@keyframes ee-col-down{from{transform:translateY(-50%)}to{transform:translateY(0)}}

.ee-community-strip{display:flex;flex-direction:column;gap:18px;padding-bottom:18px;flex-shrink:0}
@media(max-width:560px){.ee-community-strip{gap:14px;padding-bottom:14px}}

/* Square tiles — predictable 3-per-column math across image shapes. */
.ee-community-tile{position:relative;border-radius:18px;overflow:hidden;box-shadow:0 10px 24px -14px rgba(0,0,0,.15);background:var(--ee-grey-100);aspect-ratio:1/1;transform:translateZ(0)}
.ee-community-tile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}
.ee-community-tile:hover img{transform:scale(1.04)}

/* ---- BLUR + FADE OVERLAYS ----
   Top overlay covers top ~33% of the stage. At the very top the backdrop is blurred
   heavily + fades to white; at the 33% mark the overlay is fully transparent so the
   centre tile stays 100% sharp. Bottom overlay mirrors. */
.ee-community-fade{position:absolute;left:0;right:0;pointer-events:none;z-index:4}
.ee-community-fade--top{top:0;height:33%;
	background:linear-gradient(180deg,
		rgba(255,255,255,1) 0%,
		rgba(255,255,255,.92) 20%,
		rgba(255,255,255,.55) 55%,
		rgba(255,255,255,0) 100%);
	backdrop-filter:blur(10px);
	-webkit-backdrop-filter:blur(10px);
	mask-image:linear-gradient(180deg,#000 0%,#000 45%,transparent 100%);
	-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 45%,transparent 100%);
}
.ee-community-fade--bottom{bottom:0;height:33%;
	background:linear-gradient(0deg,
		rgba(255,255,255,1) 0%,
		rgba(255,255,255,.92) 20%,
		rgba(255,255,255,.55) 55%,
		rgba(255,255,255,0) 100%);
	backdrop-filter:blur(10px);
	-webkit-backdrop-filter:blur(10px);
	mask-image:linear-gradient(0deg,#000 0%,#000 45%,transparent 100%);
	-webkit-mask-image:linear-gradient(0deg,#000 0%,#000 45%,transparent 100%);
}

.ee-community-empty{text-align:center;color:var(--ee-grey-500);font-size:15px;margin:20px auto 0;max-width:520px}

@media (prefers-reduced-motion: reduce){
	.ee-community-col--up .ee-community-track,
	.ee-community-col--down .ee-community-track{animation:none}
	.ee-community-col--down .ee-community-track{transform:translateY(-50%)}
}

/* --- SCROLL-REVEAL ANIMATIONS for section heads --- */
/* Initial (pre-reveal) state for heading elements inside any section head */
.ee-section-head .ee-eyebrow,
.ee-section-head .ee-section-title,
.ee-section-head .ee-section-sub,
.ee-section-head .ee-section-title-light,
.ee-blog-head-row .ee-section-title,
.ee-blog-head-row .ee-section-sub{
	opacity:0;
	transform:translateY(24px);
	transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1);
	will-change:opacity,transform;
}
/* Stagger the three children so the eyebrow lands first, title second, sub third */
.ee-section-head .ee-eyebrow{transition-delay:.05s}
.ee-section-head .ee-section-title,
.ee-section-head .ee-section-title-light{transition-delay:.18s}
.ee-section-head .ee-section-sub{transition-delay:.32s}

/* Revealed state — JS toggles .ee-reveal on the heading element (or its parent) */
.ee-section.ee-in .ee-section-head .ee-eyebrow,
.ee-section.ee-in .ee-section-head .ee-section-title,
.ee-section.ee-in .ee-section-head .ee-section-title-light,
.ee-section.ee-in .ee-section-head .ee-section-sub,
.ee-reveal.ee-in .ee-eyebrow,
.ee-reveal.ee-in .ee-section-title,
.ee-reveal.ee-in .ee-section-title-light,
.ee-reveal.ee-in .ee-section-sub,
.ee-heading.ee-in{
	opacity:1;
	transform:translateY(0);
}

/* Also support individual reveal for any heading-like element the JS tags */
.ee-heading{opacity:0;transform:translateY(24px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1);will-change:opacity,transform}
.ee-heading.ee-in{opacity:1;transform:translateY(0)}

/* Reveal for hero title / blog row title / any h1..h3 flagged by data-ee-reveal */
[data-ee-reveal]{opacity:0;transform:translateY(24px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
[data-ee-reveal].ee-in{opacity:1;transform:translateY(0)}

/* Respect reduced motion — show everything immediately */
@media (prefers-reduced-motion: reduce){
	.ee-section-head .ee-eyebrow,
	.ee-section-head .ee-section-title,
	.ee-section-head .ee-section-title-light,
	.ee-section-head .ee-section-sub,
	.ee-blog-head-row .ee-section-title,
	.ee-blog-head-row .ee-section-sub,
	.ee-heading,
	[data-ee-reveal]{opacity:1;transform:none;transition:none}
}

/* Accessibility / misc */
:focus-visible{outline:2px dashed var(--ee-primary);outline-offset:3px;border-radius:4px}