/* Elite Equine Group :: home template
   Realizes the "Elite Equine Group" Novamira design. Tokens below are the
   single source of truth; nothing in this file introduces an off-palette value. */

@font-face{font-family:"Lato";src:url("fonts/lato-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Lato";src:url("fonts/lato-700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Lato";src:url("fonts/lato-900.woff2") format("woff2");font-weight:900;font-style:normal;font-display:swap}

:root{
  --ee-bg:#FFFFFF;
  --ee-surface:#FFFFFF;
  --ee-ink:#04243E;
  --ee-accent:#D4AF37;
  --ee-navy:#04243E;
  --ee-gold:#D4AF37;
  /* On cream, flat #D4AF37 only reaches 2.0:1, so anything that is actually
     read (icons, numerals, small labels) uses the deeper gold instead. */
  --ee-gold-deep:#B8860B;
  --ee-gold-grad:linear-gradient(180deg,#C9962F 0%,#F4E38A 18%,#FBF3B9 30%,#E9C765 48%,#D4AF37 72%,#B8860B 100%);
  --ee-muted:#55606B;
  --ee-rule:#E2DDD3;
  --ee-rule-dark:rgba(212,175,55,.22);

  --ee-sm:8px;  --ee-md:16px; --ee-lg:32px; --ee-xl:64px; --ee-section:120px;
  --ee-r-sm:8px; --ee-r-md:16px; --ee-r-lg:28px; --ee-r-pill:999px;

  --ee-font:"Lato",-apple-system,"Segoe UI",sans-serif;
  --ee-font-accent:"Playfair Display",Georgia,serif;
  --ee-max:1400px;
  --ee-gutter:24px;
  --ee-shadow:0 24px 60px -24px rgba(4,36,62,.28);
  --ee-ease:cubic-bezier(.16,1,.3,1);
}

/* Neutralize UA defaults at zero specificity so component rules always win. */
:where(.ee h1,.ee h2,.ee h3,.ee h4,.ee p,.ee ul,.ee ol,.ee li,.ee figure,.ee blockquote){margin:0;padding:0;list-style:none}
.ee *,.ee *::before,.ee *::after{box-sizing:border-box}

.ee{
  background:var(--ee-bg);
  color:var(--ee-muted);
  font-family:var(--ee-font);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
.ee img{max-width:100%;display:block}
.ee a{color:inherit;text-decoration:none}

.ee-wrap{max-width:var(--ee-max);margin-inline:auto;padding-inline:var(--ee-gutter)}
.ee-section{padding-block:var(--ee-section)}

/* ---------- type ---------- */
.ee-display{
  font-family:var(--ee-font);font-weight:900;color:var(--ee-ink);
  font-size:clamp(38px,5.6vw,72px);line-height:1.05;letter-spacing:-1.4px;
  text-wrap:balance;
}
.ee-h2{
  font-family:var(--ee-font);font-weight:900;color:var(--ee-ink);
  font-size:clamp(30px,3.9vw,52px);line-height:1.08;letter-spacing:-1px;
  text-wrap:balance;
}
/* Serif italic accent. 1.12 leading plus bottom reserve so descenders
   (y g j p q) cannot clip against the tight display leading. */
.ee-accent{
  font-family:var(--ee-font-accent);font-weight:600;font-style:italic;
  letter-spacing:-.01em;line-height:1.12;padding-bottom:.06em;display:inline-block;
}
.ee-lede{max-width:62ch;font-size:18px;color:var(--ee-muted)}
.ee-eyebrow{
  font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ee-accent);display:block;margin-bottom:var(--ee-md);
}
.ee-on-dark{color:#fff}
.ee-on-dark .ee-display,.ee-on-dark .ee-h2{color:#fff}
.ee-on-dark .ee-lede{color:rgba(255,255,255,.76)}

/* ---------- buttons ---------- */
.ee-btn{
  display:inline-flex;align-items:center;gap:var(--ee-md);
  background:var(--ee-gold);color:var(--ee-ink);
  font-weight:700;font-size:15px;
  padding:10px 10px 10px 28px;border-radius:var(--ee-r-pill);border:0;cursor:pointer;
  transition:transform .35s var(--ee-ease),background .35s var(--ee-ease);
}
.ee-btn__badge{
  width:38px;height:38px;border-radius:50%;background:var(--ee-ink);color:var(--ee-gold);
  display:grid;place-items:center;transition:transform .45s var(--ee-ease);
}
.ee-btn:hover{transform:translateY(-2px)}
.ee-btn:hover .ee-btn__badge{transform:rotate(45deg)}
.ee-btn:active{transform:scale(.98)}
.ee-btn--ghost{
  background:transparent;color:#fff;padding:10px 4px;
  border-bottom:1px solid rgba(255,255,255,.5);border-radius:0;
}
.ee-btn--ghost:hover{border-bottom-color:var(--ee-gold);color:var(--ee-gold)}
.ee-btn--dark{background:var(--ee-ink);color:var(--ee-gold)}
.ee-btn--dark .ee-btn__badge{background:var(--ee-gold);color:var(--ee-ink)}

/* ---------- nav ---------- */
.ee-nav{
  position:fixed;inset:0 0 auto 0;z-index:90;
  transition:background .4s var(--ee-ease),backdrop-filter .4s var(--ee-ease),box-shadow .4s var(--ee-ease);
}
.ee-nav__in{display:flex;align-items:center;justify-content:space-between;gap:var(--ee-lg);padding-block:20px}
.ee-nav__brand{font-weight:900;font-size:19px;letter-spacing:-.4px;color:#fff;line-height:1.1}
.ee-nav__brand span{color:var(--ee-gold)}
.ee-nav__links{display:flex;gap:28px;align-items:center;white-space:nowrap}
.ee-nav__links a{font-size:15px;color:rgba(255,255,255,.86);transition:color .3s var(--ee-ease)}
.ee-nav__links a:hover{color:var(--ee-gold)}
.ee-nav.is-stuck{background:rgba(4,36,62,.82);backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--ee-rule-dark)}
.ee-nav__toggle{display:none;background:none;border:0;color:#fff;padding:8px;cursor:pointer}

/* ---------- hero ---------- */
.ee-hero{position:relative;min-height:100dvh;display:flex;align-items:flex-end;padding-block:150px var(--ee-xl);isolation:isolate}
.ee-hero__media{position:absolute;inset:0;z-index:-2;overflow:hidden}
.ee-hero__media img{width:100%;height:100%;object-fit:cover;transform:scale(1.06)}
/* Directional navy scrim: heaviest at the lower left where the copy sits. */
.ee-hero::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(to top,rgba(4,36,62,.92) 0%,rgba(4,36,62,.55) 38%,rgba(4,36,62,.12) 68%),
    linear-gradient(to right,rgba(4,36,62,.7) 0%,rgba(4,36,62,.1) 60%);
}
.ee-hero__grid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--ee-xl);align-items:end;width:100%}
/* Absolute measure: this wrapper sits at body font-size, so a ch value here
   would resolve against 17px rather than the 72px display it contains. */
.ee-hero__copy{max-width:min(900px,100%)}
.ee-hero .ee-lede{max-width:52ch;margin-block:var(--ee-lg)}
.ee-hero__cta{display:flex;flex-wrap:wrap;gap:var(--ee-lg);align-items:center}
.ee-hero__eyebrow{color:var(--ee-gold);border:1px solid var(--ee-rule-dark);border-radius:var(--ee-r-pill);padding:6px 16px;display:inline-block;margin-bottom:var(--ee-lg)}

/* floating proof card */
.ee-proof{
  background:rgba(4,36,62,.55);backdrop-filter:blur(16px);
  border:1px solid var(--ee-rule-dark);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
  border-radius:var(--ee-r-lg);padding:26px 28px;min-width:250px;
}
.ee-proof__num{font-size:46px;font-weight:900;color:#fff;line-height:1;letter-spacing:-1.6px;font-variant-numeric:tabular-nums}
.ee-proof__label{font-size:14px;color:rgba(255,255,255,.72);margin-top:6px}
.ee-proof__row{display:flex;align-items:center;margin-top:20px}
.ee-proof__row img{
  width:46px;height:46px;border-radius:50%;object-fit:cover;
  border:2px solid rgba(255,255,255,.85);margin-left:-14px;
  transition:transform .4s var(--ee-ease);
}
.ee-proof__row img:first-child{margin-left:0}
.ee-proof__row:hover img{transform:translateY(-4px)}
.ee-proof__more{
  width:46px;height:46px;border-radius:50%;margin-left:-14px;
  background:var(--ee-gold);color:var(--ee-ink);display:grid;place-items:center;
  font-weight:900;font-size:13px;border:2px solid rgba(255,255,255,.85);
}

/* ---------- logo wall ---------- */
.ee-logos{padding-block:var(--ee-xl);background:var(--ee-bg);border-bottom:1px solid var(--ee-rule)}
.ee-logos__label{text-align:center;font-size:15px;color:var(--ee-muted);margin-bottom:var(--ee-lg)}
.ee-logos__label b{color:var(--ee-ink);font-weight:900}
.ee-marquee{position:relative;overflow:hidden;
  -webkit-mask-image:linear-gradient(to right,transparent,var(--ee-ink) 9%,var(--ee-ink) 91%,transparent);
          mask-image:linear-gradient(to right,transparent,var(--ee-ink) 9%,var(--ee-ink) 91%,transparent)}
.ee-marquee__track{display:flex;width:max-content;gap:72px;align-items:center;animation:ee-scroll 46s linear infinite}
.ee-marquee:hover .ee-marquee__track{animation-play-state:paused}
.ee-marquee__track img{height:42px;width:auto;object-fit:contain;opacity:.62;filter:grayscale(1);transition:opacity .35s var(--ee-ease),filter .35s var(--ee-ease)}
.ee-marquee__track img:hover{opacity:1;filter:grayscale(0)}
@keyframes ee-scroll{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}

/* ---------- about + stats ---------- */
.ee-about__copy{font-size:clamp(21px,2.3vw,30px);line-height:1.45;max-width:30ch;font-weight:700;color:var(--ee-ink);letter-spacing:-.4px}
.ee-about__grid{display:grid;grid-template-columns:1.15fr 1fr;gap:var(--ee-xl);align-items:start}
.ee-about__trail{font-size:17px;color:var(--ee-muted);max-width:60ch}
.ee-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--ee-lg);margin-top:var(--ee-section);border-top:1px solid var(--ee-rule);padding-top:var(--ee-xl)}
.ee-stat__num{font-size:clamp(44px,5vw,68px);font-weight:900;color:var(--ee-ink);line-height:1;letter-spacing:-2px;font-variant-numeric:tabular-nums}
.ee-stat__num i{font-style:normal;color:var(--ee-accent)}
.ee-stat__title{font-weight:700;color:var(--ee-ink);margin-top:var(--ee-md);font-size:16px}
.ee-stat__sub{font-size:14px;margin-top:4px}

/* ---------- difference ---------- */
.ee-diff{display:grid;grid-template-columns:.85fr 1fr;gap:var(--ee-xl);align-items:center}
.ee-diff__media{position:relative;border-radius:var(--ee-r-lg);overflow:hidden;aspect-ratio:3/4}
.ee-diff__media img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ee-ease)}
.ee-diff__media:hover img{transform:scale(1.05)}
.ee-diff__float{
  position:absolute;left:var(--ee-lg);bottom:var(--ee-lg);
  background:var(--ee-surface);border-radius:var(--ee-r-md);padding:18px 22px;
  box-shadow:var(--ee-shadow);display:flex;align-items:center;gap:14px;
}
.ee-diff__float b{display:block;font-size:24px;font-weight:900;color:var(--ee-ink);line-height:1;letter-spacing:-.8px}
.ee-diff__float span{font-size:13px}
.ee-diff__badge{width:40px;height:40px;border-radius:var(--ee-r-sm);background:var(--ee-gold);color:var(--ee-ink);display:grid;place-items:center;flex:none}
.ee-diff__list{margin-top:var(--ee-lg)}
.ee-diff__list li{display:grid;grid-template-columns:24px 1fr;gap:var(--ee-md);padding-block:22px;border-bottom:1px solid var(--ee-rule);color:var(--ee-ink);font-weight:700;font-size:17px}
.ee-diff__list li:first-child{border-top:1px solid var(--ee-rule)}
.ee-diff__list svg{color:var(--ee-accent);margin-top:3px}

/* ---------- services (asymmetric bento, not three equal cards) ---------- */
.ee-serv{display:grid;grid-template-columns:1.35fr 1fr;grid-template-rows:auto auto;gap:var(--ee-lg);margin-top:var(--ee-xl)}
.ee-serv__card{position:relative;border-radius:var(--ee-r-lg);overflow:hidden;background:var(--ee-navy);min-height:280px;display:flex;flex-direction:column;justify-content:flex-end;padding:var(--ee-lg);isolation:isolate}
.ee-serv__card:first-child{grid-row:span 2;min-height:560px}
.ee-serv__card::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,rgba(4,36,62,.94),rgba(4,36,62,.3) 65%)}
.ee-serv__ph{position:absolute;inset:0;z-index:-2;background:linear-gradient(145deg,var(--ee-ink),var(--ee-navy) 70%)}
.ee-serv__card h3{color:#fff;font-size:24px;font-weight:900;letter-spacing:-.6px;line-height:1.2;max-width:18ch}
.ee-serv__card p{color:rgba(255,255,255,.72);font-size:15px;margin-top:var(--ee-sm);max-width:40ch}
.ee-serv__link{display:inline-flex;align-items:center;gap:8px;color:var(--ee-gold);font-weight:700;font-size:14px;margin-top:var(--ee-md)}
.ee-serv__card:hover .ee-serv__link svg{transform:translateX(5px)}
.ee-serv__link svg{transition:transform .4s var(--ee-ease)}

/* ---------- horizontal scroll track ---------- */
.ee-track{position:relative;background:var(--ee-navy)}
.ee-track__pin{min-height:100dvh;display:flex;flex-direction:column;justify-content:center;overflow:hidden;padding-block:var(--ee-xl)}
.ee-track__head{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--ee-lg);margin-bottom:var(--ee-lg)}
.ee-track__rail{display:flex;gap:var(--ee-lg);padding-inline:var(--ee-gutter);will-change:transform}
.ee-card{
  flex:0 0 clamp(260px,26vw,360px);background:rgba(255,255,255,.04);
  border:1px solid var(--ee-rule-dark);border-radius:var(--ee-r-lg);
  padding:var(--ee-lg);min-height:380px;display:flex;flex-direction:column;justify-content:space-between;
  transition:background .4s var(--ee-ease),transform .4s var(--ee-ease);
}
.ee-card:hover{background:rgba(212,175,55,.08);transform:translateY(-4px)}
.ee-card__n{font-size:13px;font-weight:700;color:var(--ee-accent);font-variant-numeric:tabular-nums}
.ee-card h3{color:#fff;font-size:26px;font-weight:900;letter-spacing:-.7px;line-height:1.12;margin-top:var(--ee-md)}
.ee-pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:var(--ee-md)}
.ee-pill{border:1px solid var(--ee-rule-dark);color:var(--ee-gold);border-radius:var(--ee-r-md);padding:4px 12px;font-size:12.5px}
.ee-progress{height:2px;background:var(--ee-rule-dark);margin-top:var(--ee-xl);margin-inline:var(--ee-gutter);position:relative}
.ee-progress__bar{position:absolute;inset:0 auto 0 0;width:0;background:var(--ee-accent);transform-origin:left}

/* ---------- projects ---------- */
.ee-proj{display:grid;grid-template-columns:1.4fr 1fr;gap:var(--ee-lg);margin-top:var(--ee-xl)}
.ee-proj__col{display:grid;gap:var(--ee-lg)}
.ee-proj__item{position:relative;border-radius:var(--ee-r-lg);overflow:hidden;background:linear-gradient(145deg,var(--ee-ink),var(--ee-navy));min-height:300px;display:flex;align-items:flex-end;padding:var(--ee-lg)}
.ee-proj__item--tall{min-height:520px}
.ee-proj__item h3{color:#fff;font-size:22px;font-weight:900;letter-spacing:-.5px;position:relative;z-index:1}
.ee-proj__item::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(4,36,62,.85),transparent 60%)}

/* ---------- process sticky stack ---------- */
.ee-proc{display:grid;grid-template-columns:.8fr 1.2fr;gap:var(--ee-xl);align-items:start}
.ee-proc__head{position:sticky;top:140px}
.ee-proc__steps{display:grid;gap:var(--ee-lg)}
.ee-proc__step{
  background:var(--ee-surface);border:1px solid var(--ee-rule);border-radius:var(--ee-r-lg);
  padding:var(--ee-xl) var(--ee-lg);position:sticky;top:160px;box-shadow:var(--ee-shadow);
}
.ee-proc__step b{font-size:13px;font-weight:700;color:var(--ee-accent);font-variant-numeric:tabular-nums}
.ee-proc__step h3{font-size:26px;font-weight:900;color:var(--ee-ink);letter-spacing:-.7px;margin-block:var(--ee-sm);line-height:1.15}
.ee-proc__step p{max-width:50ch}

/* ---------- testimonials ---------- */
.ee-quote{flex:0 0 clamp(280px,32vw,460px);background:rgba(255,255,255,.04);border:1px solid var(--ee-rule-dark);border-radius:var(--ee-r-lg);padding:var(--ee-lg);display:flex;flex-direction:column;justify-content:space-between;min-height:340px}
.ee-quote p{color:#fff;font-size:19px;line-height:1.5;font-weight:700;letter-spacing:-.3px}
.ee-quote__who{display:flex;align-items:center;gap:14px;margin-top:var(--ee-lg)}
.ee-quote__who img{width:48px;height:48px;border-radius:50%;object-fit:cover}
.ee-quote__who b{display:block;color:#fff;font-size:15px}
.ee-quote__who span{font-size:13.5px;color:rgba(255,255,255,.62)}

/* ---------- finance band ---------- */
.ee-band{background:var(--ee-gold);border-radius:var(--ee-r-lg);padding:var(--ee-xl) var(--ee-lg);display:flex;flex-wrap:wrap;gap:var(--ee-lg);align-items:center;justify-content:space-between}
.ee-band h2{font-size:clamp(26px,3.2vw,40px);font-weight:900;color:var(--ee-ink);letter-spacing:-1px;line-height:1.1;max-width:20ch}
.ee-band p{color:var(--ee-ink);opacity:.78;max-width:46ch;margin-top:var(--ee-sm)}

/* ---------- video ---------- */
.ee-video{position:relative;border-radius:var(--ee-r-lg);overflow:hidden;min-height:60vh;display:grid;place-items:center;background:linear-gradient(145deg,var(--ee-ink),var(--ee-navy))}
.ee-video__play{width:96px;height:96px;border-radius:50%;background:var(--ee-gold);color:var(--ee-ink);display:grid;place-items:center;border:0;cursor:pointer;transition:transform .4s var(--ee-ease)}
.ee-video__play:hover{transform:scale(1.08)}
.ee-video__cap{position:absolute;left:var(--ee-lg);bottom:var(--ee-lg);color:#fff;font-weight:900;font-size:22px;letter-spacing:-.5px}

/* ---------- closing + footer ---------- */
.ee-cta{background:var(--ee-navy);border-radius:var(--ee-r-lg);padding:var(--ee-section) var(--ee-lg);text-align:center}
.ee-cta h2{max-width:20ch;margin-inline:auto}
.ee-foot{background:var(--ee-navy);color:rgba(255,255,255,.7);padding-top:var(--ee-section);overflow:hidden}
.ee-foot__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:var(--ee-xl);padding-bottom:var(--ee-xl)}
.ee-foot h4{color:#fff;font-size:13px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;margin-bottom:var(--ee-md)}
.ee-foot li{margin-bottom:10px;font-size:15px}
.ee-foot a:hover{color:var(--ee-gold)}
.ee-foot__legal{border-top:1px solid var(--ee-rule-dark);padding-block:var(--ee-lg);font-size:13.5px;display:flex;flex-wrap:wrap;gap:var(--ee-md);justify-content:space-between}
.ee-wordmark{
  font-weight:900;letter-spacing:-.04em;line-height:.8;
  /* 10.1vw is the measured size at which the 18 glyphs fill the viewport
     minus both gutters, so the wordmark never overflows at any width. */
  font-size:10.1vw;white-space:nowrap;padding-inline:var(--ee-gutter);
  background:linear-gradient(to bottom,var(--ee-gold),rgba(4,36,62,.15));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  padding-bottom:.08em;
}

/* ---------- reveal ---------- */
.js .ee-reveal{opacity:0;transform:translateY(26px)}
.js .ee-reveal.is-in{opacity:1;transform:none;transition:opacity .8s var(--ee-ease),transform .8s var(--ee-ease)}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  /* Stack the hero before the proof card starts squeezing the headline. */
  .ee-hero__grid{grid-template-columns:1fr;gap:var(--ee-lg)}
  .ee-hero__copy{max-width:none}
  .ee-proof{align-self:start}
}
@media (max-width:1024px){
  .ee-about__grid,.ee-diff,.ee-proc,.ee-serv,.ee-proj{grid-template-columns:1fr}
  .ee-serv__card:first-child{grid-row:auto;min-height:320px}
  .ee-stats{grid-template-columns:repeat(2,1fr)}
  .ee-proc__head{position:static}
  .ee-proc__step{position:static}
  .ee-foot__grid{grid-template-columns:1fr 1fr}
}
@media (max-width:767px){
  :root{--ee-section:72px;--ee-xl:40px}
  .ee{font-size:16px}
  .ee-nav__links{display:none}
  .ee-nav__toggle{display:block}
  .ee-hero{min-height:auto;padding-block:120px var(--ee-xl)}
  .ee-hero__grid{grid-template-columns:1fr;gap:var(--ee-lg)}
  .ee-hero__copy{max-width:none}
  .ee-display{font-size:36px;letter-spacing:-.8px}
  .ee-stats{grid-template-columns:1fr;gap:var(--ee-lg)}
  .ee-foot__grid{grid-template-columns:1fr}
  /* Horizontal tracks unpin and become swipe carousels. */
  .ee-track__pin{min-height:auto;display:block}
  .ee-track__rail{overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;transform:none !important;padding-bottom:var(--ee-md)}
  .ee-card,.ee-quote{scroll-snap-align:start;flex-basis:78vw}
  .ee-progress{display:none}
}

@media (prefers-reduced-motion:reduce){
  .ee *,.ee *::before,.ee *::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
  .ee-marquee__track{animation:none}
  .js .ee-reveal{opacity:1;transform:none}
  .ee-track__rail{transform:none !important}
  .ee-track__pin{min-height:auto}
  .ee-track__rail{overflow-x:auto}
}
.ee :focus-visible{outline:2px solid var(--ee-accent);outline-offset:3px}

/* ============================================================
   Who we are :: horse passing behind the video player
   Composition is derived from the reference: the horse is 1.49x the
   player's width and sits so the player covers its barrel, leaving the
   head and forelegs to the left and the tail beyond the right edge.
   Every number below is a variable so the framing stays tunable.
   ============================================================ */
.ee-who{
  --player-w:80%;      /* player width within the right column        */
  --horse-scale:1.49;  /* horse width as a multiple of player width   */
  --horse-x:-38.1%;    /* horse left, as % of player width            */
  --horse-y:-12.2%;    /* horse top, as % of player height            */
  --horse-travel:118%; /* start offset, as % of the horse's own width */
  overflow-x:clip;
}
.ee-who__grid{
  display:grid;
  grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);
  gap:var(--ee-xl);
  align-items:center;
}
.ee-who__copy{max-width:46ch}
.ee-who__copy h2{margin-bottom:var(--ee-lg)}
/* Justified to match the reference. Hyphenation is what keeps justified
   text from opening rivers at this measure. */
.ee-who__body{
  text-align:justify;
  hyphens:auto;
  -webkit-hyphens:auto;
  font-size:17.5px;
}
.ee-who__quote{
  font-family:var(--ee-font-accent);
  font-style:italic;
  font-size:18px;
  line-height:1.5;
  color:var(--ee-ink);
  margin-top:var(--ee-lg);
  max-width:44ch;
}

/* ---- stage ---- */
.ee-who__stage{position:relative;width:var(--player-w);margin-left:auto;margin-right:auto}
.ee img.ee-who__horse{
  position:absolute;
  z-index:1;
  /* The global `.ee img{max-width:100%}` would otherwise cap the horse at the
     stage width, which is exactly the size it must exceed. */
  max-width:none;
  width:calc(var(--horse-scale) * 100%);
  height:auto;
  left:var(--horse-x);
  top:var(--horse-y);
  pointer-events:none;
  user-select:none;
}
/* The offset is gated behind .js so the composition renders finished for
   no-JS, for crawlers, and for prefers-reduced-motion (which never sets .js). */
.js .ee-who__horse{
  transform:translate3d(var(--horse-travel),0,0);
  transition:transform 1500ms var(--ee-ease);
  will-change:transform;
}
.js .ee-who.is-in .ee-who__horse{transform:translate3d(0,0,0)}

/* ---- player ---- */
.ee-who__player{
  position:relative;
  z-index:2;
  background:var(--ee-navy);
  border-radius:22px;
  padding:14px;
  box-shadow:0 30px 70px -30px rgba(4,36,62,.45);
}
.ee-who__screen{
  position:relative;
  aspect-ratio:16/9;
  border-radius:11px;
  overflow:hidden;
  background:var(--ee-ink);
}
.ee-who__screen video,.ee-who__poster{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
}
.ee-who__poster{transition:opacity 260ms var(--ee-ease)}
.ee-who__player[data-started="1"] .ee-who__poster{opacity:0;pointer-events:none}

.ee-who__big{
  position:absolute;left:50%;top:50%;
  width:84px;height:84px;margin:-42px 0 0 -42px;
  border-radius:50%;
  background:var(--ee-gold);
  color:var(--ee-ink);
  border:0;cursor:pointer;
  display:grid;place-items:center;
  transition:transform 180ms var(--ee-ease),opacity 220ms var(--ee-ease);
}
.ee-who__big:active{transform:scale(.97)}
.ee-who__player[data-started="1"] .ee-who__big{opacity:0;pointer-events:none;transform:scale(.9)}

/* ---- controls ---- */
.ee-who__bar{display:flex;align-items:center;gap:14px;padding:14px 6px 4px}
.ee-who__btn{
  background:transparent;border:1.5px solid var(--ee-gold);color:var(--ee-gold);
  width:36px;height:36px;border-radius:9px;display:grid;place-items:center;
  cursor:pointer;flex:none;
  transition:transform 160ms var(--ee-ease),background 200ms var(--ee-ease);
}
.ee-who__btn:active{transform:scale(.97)}
.ee-who__btn--plain{border-color:transparent}
@media (hover:hover) and (pointer:fine){
  .ee-who__btn:hover{background:rgba(212,175,55,.14)}
}
.ee-who__seek{
  -webkit-appearance:none;appearance:none;
  flex:1;height:22px;background:transparent;cursor:pointer;margin:0;
}
.ee-who__seek::-webkit-slider-runnable-track{
  height:5px;border-radius:999px;
  background:linear-gradient(to right,var(--ee-gold) var(--seek,0%),rgba(212,175,55,.26) var(--seek,0%));
}
.ee-who__seek::-moz-range-track{height:5px;border-radius:999px;background:rgba(212,175,55,.26)}
.ee-who__seek::-moz-range-progress{height:5px;border-radius:999px;background:var(--ee-gold)}
.ee-who__seek::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;
  width:14px;height:14px;border-radius:50%;background:var(--ee-gold);
  margin-top:-4.5px;border:0;
  transition:transform 160ms var(--ee-ease);
}
.ee-who__seek::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--ee-gold);border:0}
.ee-who__seek:active::-webkit-slider-thumb{transform:scale(1.18)}
.ee-who__seek:focus-visible{outline:2px solid var(--ee-gold);outline-offset:4px;border-radius:999px}

/* ---- responsive ---- */
@media (max-width:1024px){
  .ee-who__grid{grid-template-columns:1fr;gap:var(--ee-lg)}
  .ee-who__copy{max-width:none}
  /* Keep the idea (horse passing behind the player) but pull the overhang in
     so nothing crowds the copy or the controls on a narrow column. */
  .ee-who{--player-w:86%;--horse-scale:1.34;--horse-x:-24%;--horse-y:-10%;--horse-travel:96%}
  .ee-who__stage{margin-top:var(--ee-lg)}
}
@media (max-width:767px){
  /* Narrow the player so the horse has room to read either side of it.
     A little crop at the section edges is deliberate: it keeps the sense of
     the horse passing through the frame rather than posing inside it. */
  .ee-who{--player-w:82%;--horse-scale:1.52;--horse-x:-26%;--horse-y:-9%;--horse-travel:88%}
  .ee-who__stage{margin-left:auto;margin-right:0}
  .ee-who__body{text-align:left}
  .ee-who__player{border-radius:16px;padding:10px}
  .ee-who__big{width:62px;height:62px;margin:-31px 0 0 -31px}
  .ee-who__bar{gap:10px;padding:10px 2px 2px}
}
@media (prefers-reduced-motion:reduce){
  .js .ee-who__horse{transform:none;transition:none}
}

/* ============================================================
   v3 refinements: Helvetica display, gold identity, cinematic hero
   ============================================================ */

@font-face{
  font-family:"EE Helvetica";
  src:url("fonts/helvetica-700.woff") format("woff");
  font-weight:700;font-style:normal;font-display:swap;
}
:root{
  --ee-font-display:"EE Helvetica",Helvetica,"Helvetica Neue",Arial,sans-serif;
  --ee-track:-0.07em; /* the brief's -70 */
}

/* ---- headlines ---- */
.ee-display,.ee-h2,.ee-about__copy,.ee-band h2,.ee-stat__num,
.ee-card h3,.ee-serv__card h3,.ee-proj__item h3,.ee-proc__step h3,
.ee-quote p,.ee-wordmark,.ee-nav__brand{
  font-family:var(--ee-font-display);
  font-weight:700;
  letter-spacing:var(--ee-track);
}
.ee-display,.ee-h2{color:var(--ee-ink)}
/* The serif accent keeps its own tracking; the Helvetica value would crush an italic. */
.ee-accent{letter-spacing:-.01em}

/* Gold is a mark, not a text colour, on light grounds. */
.ee-eyebrow{color:var(--ee-ink)}
.ee-on-dark .ee-eyebrow,.ee-hero__eyebrow{color:var(--ee-gold)}
.ee-stat__num i{color:var(--ee-gold-deep)}
.ee-diff__list svg{color:var(--ee-gold-deep)}
.ee-proc__step b{color:var(--ee-gold-deep)}

/* ---- hero: continuous cinematic drift ----
   Minimum scale stays above 1 so the frame never exposes an edge, and the
   whole cycle is 34s so it reads as depth rather than as an animation. */
@keyframes ee-drift{
  0%{transform:scale(1.06)}
  50%{transform:scale(1.14)}
  100%{transform:scale(1.06)}
}
.ee-hero__media img{
  animation:ee-drift 34s ease-in-out infinite;
  will-change:transform;
}
@media (prefers-reduced-motion:reduce){
  .ee-hero__media img{animation:none;transform:scale(1.06)}
}

/* ---- brand logo ---- */
.ee img.ee-nav__logo{width:auto;height:38px;max-width:none;display:block}
@media (max-width:767px){ .ee img.ee-nav__logo{height:30px} }

/* ---- navigation with dropdowns ---- */
.ee-nav__links{gap:26px}
.ee-menu{position:relative}
.ee-menu__top{
  display:inline-flex;align-items:center;gap:6px;
  font-size:15px;color:rgba(255,255,255,.86);background:none;border:0;
  cursor:pointer;padding:6px 0;font-family:inherit;
  transition:color .3s var(--ee-ease);
}
.ee-menu__top svg{transition:transform .3s var(--ee-ease)}
.ee-menu:hover .ee-menu__top,.ee-menu:focus-within .ee-menu__top{color:var(--ee-gold)}
.ee-menu:hover .ee-menu__top svg,.ee-menu:focus-within .ee-menu__top svg{transform:rotate(180deg)}
.ee-menu__panel{
  position:absolute;top:calc(100% + 14px);left:50%;transform:translateX(-50%) translateY(-6px);
  min-width:260px;padding:10px;border-radius:var(--ee-r-md);
  background:rgba(4,36,62,.92);backdrop-filter:blur(16px);
  border:1px solid rgba(212,175,55,.3);
  box-shadow:0 30px 60px -24px rgba(4,36,62,.6);
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .22s var(--ee-ease),transform .22s var(--ee-ease),visibility .22s;
}
.ee-menu:hover .ee-menu__panel,.ee-menu:focus-within .ee-menu__panel{
  opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0);
}
.ee-menu__panel a{
  display:block;padding:9px 14px;border-radius:var(--ee-r-sm);
  font-size:14.5px;color:rgba(255,255,255,.8);white-space:nowrap;
  transition:background .2s var(--ee-ease),color .2s var(--ee-ease);
}
.ee-menu__panel a:hover{background:rgba(212,175,55,.14);color:var(--ee-gold)}

/* ---- CTA: gold gradient ring, no fill ----
   A padding-box fill would sit opaque over the hero photograph, so the ring is
   a masked pseudo-element and the interior stays genuinely transparent. */
.ee-btn{
  background:transparent;
  color:var(--ee-ink);
  position:relative;
  padding:9px 9px 9px 26px;
  isolation:isolate;
}
.ee-btn::before{
  content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;
  background:var(--ee-gold-grad);
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
          mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  pointer-events:none;
}
.ee-on-dark .ee-btn,.ee-nav .ee-btn,.ee-cta .ee-btn{color:#fff}
.ee-btn__badge{background:var(--ee-gold-grad);color:var(--ee-navy)}
.ee-btn:hover{background:transparent;transform:translateY(-2px)}
.ee-btn--dark{background:transparent;color:var(--ee-ink)}
.ee-btn--dark .ee-btn__badge{background:var(--ee-gold-grad);color:var(--ee-navy)}
.ee-btn--ghost::before{display:none}

/* ---- social proof: 5/5 Google reviews ---- */
.ee-proof{border-color:var(--ee-gold)}
.ee-proof__num{font-family:var(--ee-font-display);letter-spacing:var(--ee-track);font-size:42px}
.ee-proof__more{
  background:var(--ee-gold-grad);color:var(--ee-navy);
  font-size:20px;line-height:1;font-weight:700;
}

/* ---- trusted by: label beside the marks ---- */
.ee-logos__row{
  display:grid;grid-template-columns:minmax(200px,250px) minmax(0,1fr);
  gap:var(--ee-lg);align-items:center;
}
.ee-logos__label{
  text-align:left;margin:0;font-size:19px;line-height:1.3;
  font-family:var(--ee-font-display);font-weight:700;
  letter-spacing:var(--ee-track);color:var(--ee-ink);
}
/* Vertical roll. The list repeats its first item last so the loop closes
   without a visible jump back to the top. */
.ee-rot{display:block;height:1.3em;overflow:hidden}
.ee-rot ul{margin:0;padding:0;list-style:none;animation:ee-roll 17s cubic-bezier(.76,0,.24,1) infinite}
.ee-rot li{height:1.3em;line-height:1.3em;color:var(--ee-gold-deep);white-space:nowrap}
@keyframes ee-roll{
  0%,13%{transform:translateY(0)}
  16.6%,30%{transform:translateY(-1.3em)}
  33.3%,46.6%{transform:translateY(-2.6em)}
  50%,63.3%{transform:translateY(-3.9em)}
  66.6%,80%{transform:translateY(-5.2em)}
  83.3%,100%{transform:translateY(-6.5em)}
}
@media (prefers-reduced-motion:reduce){ .ee-rot ul{animation:none} }
@media (max-width:767px){
  .ee-logos__row{grid-template-columns:1fr;gap:var(--ee-md)}
  .ee-logos__label{font-size:17px}
}

/* ---- finance band: gold ring instead of a flat gold ground ---- */
.ee-band{
  background:var(--ee-surface);position:relative;
  border-radius:var(--ee-r-lg);
}
.ee-band::before{
  content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;
  background:var(--ee-gold-grad);
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
          mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;
}
.ee-band h2{color:var(--ee-ink)}
.ee-band p{color:var(--ee-muted);opacity:1}

/* ---- video: minimal player ---- */
.ee-who__player{
  background:transparent;padding:0;border-radius:18px;
  box-shadow:0 34px 70px -30px rgba(4,36,62,.45);
}
.ee-who__screen{border-radius:18px}
.ee-who__bar{
  position:absolute;left:10px;right:10px;bottom:10px;z-index:3;
  background:rgba(4,36,62,.68);backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.14);
  border-radius:12px;padding:8px 12px;gap:12px;
}
.ee-who__btn{width:30px;height:30px;border-radius:8px;border-color:rgba(255,255,255,.34);color:#fff}
.ee-who__btn--plain{border-color:transparent}
.ee-who__seek::-webkit-slider-runnable-track{
  background:linear-gradient(to right,var(--ee-gold) var(--seek,0%),rgba(255,255,255,.28) var(--seek,0%));
}
.ee-who__seek::-webkit-slider-thumb{background:var(--ee-gold)}
.ee-who__seek::-moz-range-thumb{background:var(--ee-gold)}
.ee-who__seek::-moz-range-progress{background:var(--ee-gold)}
.ee-who__big{
  background:var(--ee-gold-grad);color:var(--ee-navy);
  box-shadow:0 14px 34px -10px rgba(4,36,62,.5);
}

/* years badge, overlapping the player's lower left like the reference */
.ee-who__years{
  position:absolute;z-index:4;left:-46px;bottom:-34px;
  width:150px;height:150px;border-radius:50%;
  background:var(--ee-surface);
  box-shadow:0 22px 50px -18px rgba(4,36,62,.34);
  /* Flex, not grid: two auto rows stretch to fill the circle and push the
     label down against the ring. Flex centres the pair as one block. */
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;border:1px solid var(--ee-rule);
}
.ee-who__years::before{
  content:"";position:absolute;inset:7px;border-radius:50%;
  padding:2px;background:var(--ee-gold-grad);
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
          mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
}
.ee-who__years b{
  display:block;font-family:var(--ee-font-display);font-weight:700;
  font-size:40px;line-height:1;letter-spacing:var(--ee-track);
  background:var(--ee-gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.ee-who__years span{
  display:block;margin-top:4px;font-size:9.5px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--ee-ink);
}
@media (max-width:1024px){
  .ee-who__years{width:118px;height:118px;left:-18px;bottom:-24px}
  .ee-who__years b{font-size:31px}
  .ee-who__years span{font-size:8px}
}
@media (max-width:767px){
  .ee-who__years{width:96px;height:96px;left:-10px;bottom:-18px}
  .ee-who__years b{font-size:25px}
  .ee-who__years span{font-size:7px;letter-spacing:.12em}
}

/* ---- mobile nav sheet ---- */
@media (max-width:767px){
  .ee-nav__links[data-open]{
    display:flex;flex-direction:column;align-items:flex-start;gap:6px;
    position:absolute;left:var(--ee-gutter);right:var(--ee-gutter);top:calc(100% + 8px);
    background:rgba(4,36,62,.96);backdrop-filter:blur(16px);
    border:1px solid rgba(212,175,55,.3);border-radius:var(--ee-r-md);
    padding:16px;max-height:72vh;overflow-y:auto;
  }
  .ee-menu,.ee-menu__panel{position:static;min-width:0}
  .ee-menu__panel{
    opacity:1;visibility:visible;pointer-events:auto;transform:none;
    /* Clearing the background is not enough: the blur still paints a visible
       panel behind the nested items. */
    background:transparent;backdrop-filter:none;border:0;box-shadow:none;padding:0 0 0 12px;
    display:none;
  }
  .ee-menu__panel[data-open]{display:block}
  .ee-nav__links .ee-btn{margin-top:10px}
}

/* The minimal player is shorter than the framed one it replaced, so the horse
   is recentred on it instead of hanging most of its legs below the frame. */
.ee-who{--horse-y:-32%}
@media (max-width:1024px){ .ee-who{--horse-y:-27%} }
@media (max-width:767px){ .ee-who{--horse-y:-23%} }

/* The base reset `.ee a{color:inherit}` is (0,1,1) and outranks a single
   component class, so these colours never landed: the finance button fell back
   to muted grey, and every 'See details' link sat on navy at about 2.2:1.
   Qualifying the selector with the element restores the component colour. */
.ee a.ee-btn{color:var(--ee-ink)}
.ee a.ee-serv__link{color:var(--ee-gold)}
.ee-on-dark a.ee-btn,.ee-nav a.ee-btn,.ee-cta a.ee-btn{color:#fff}

/* ============================================================
   v4: feedback round 2
   ============================================================ */

/* ---- hero: lighter scrim so the photograph reads ---- */
.ee-hero::after{
  background:
    linear-gradient(to top,rgba(4,36,62,.74) 0%,rgba(4,36,62,.34) 40%,rgba(4,36,62,.04) 70%),
    linear-gradient(to right,rgba(4,36,62,.42) 0%,rgba(4,36,62,.04) 60%);
}
.ee-scroll-sentinel{position:absolute;top:0;left:0;width:1px;height:1px;pointer-events:none}

/* ---- proof card: white border, star row ---- */
.ee-proof{border-color:rgba(255,255,255,.85)}
.ee-proof__stars{display:flex;gap:3px;color:var(--ee-gold);margin-top:6px}
.ee-proof__label{margin-top:8px}

/* ---- rotating word matches the label ---- */
.ee-rot li{color:var(--ee-ink)}

/* ---- explore link: Ralph Lauren underline ----
   The rule is a pseudo-element so the gap itself can animate; a text
   underline cannot. At rest it sits 6px under the text and rises to 2px. */
.ee a.ee-explore{
  position:relative;display:inline-block;color:#fff;
  text-transform:uppercase;letter-spacing:.08em;font-size:14px;font-weight:700;
  padding-bottom:8px;line-height:1.2;
}
.ee-explore::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:currentColor;transition:transform .3s ease;
}
.ee-explore:hover::after,.ee-explore:focus-visible::after{transform:translateY(-4px)}
@media (prefers-reduced-motion:reduce){ .ee-explore::after{transition:none} }

/* ---- who: subtle play, smaller flat-gold badge, mobile still ---- */
.ee-who__big{
  background:rgba(255,255,255,.16);backdrop-filter:blur(8px);color:#fff;
  border:1px solid rgba(255,255,255,.34);box-shadow:none;
}
.ee-who__years{width:132px;height:132px;left:-40px;bottom:-30px}
.ee-who__years b{font-size:36px;background:none;-webkit-text-fill-color:initial;color:var(--ee-gold)}
.ee-who__mobile{display:none}
@media (max-width:767px){
  .ee-who__stage{display:none}
  .ee-who__mobile{display:block;position:relative;margin-top:var(--ee-lg);border-radius:var(--ee-r-lg);overflow:visible}
  .ee-who__mobile img{width:100%;height:auto;border-radius:var(--ee-r-lg);display:block}
  .ee-who__years--static{position:absolute;left:-6px;bottom:-16px;width:96px;height:96px}
  .ee-who__years--static b{font-size:25px}
  .ee-who__years--static span{font-size:7px;letter-spacing:.12em}
}

/* ---- section pill ---- */
.ee-pilltag{
  position:relative;display:inline-block;padding:6px 16px;border-radius:var(--ee-r-pill);
  font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--ee-ink);
  margin-bottom:var(--ee-md);isolation:isolate;
}
.ee-pilltag::before{
  content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:var(--ee-gold-grad);
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;
}
/* Absolute measure: the wrapper sits at body size, so ch would resolve
   against 17px and fold the two-line heading into six. */
.ee-range__head{max-width:780px;margin-bottom:var(--ee-xl)}

/* ---- elite difference: floating image ---- */
.ee-diffx__grid{display:grid;grid-template-columns:1fr 1.05fr;gap:var(--ee-xl);align-items:center}
.ee-diffx__copy{order:2}
.ee-diffx__media{order:1;position:relative;padding-bottom:16%}
.ee-diffx__large,.ee-diffx__small{margin:0;border-radius:var(--ee-r-lg);overflow:hidden}
.ee-diffx__large img,.ee-diffx__small img{width:100%;height:100%;object-fit:cover;display:block}
.ee-diffx__large{aspect-ratio:3/2}
.ee-diffx__small{
  position:absolute;right:-6%;bottom:0;width:46%;aspect-ratio:3/2;
  box-shadow:0 30px 60px -22px rgba(4,36,62,.45);border:4px solid var(--ee-surface);
  will-change:transform;
}
@media (max-width:1024px){
  .ee-diffx__grid{grid-template-columns:1fr;gap:var(--ee-lg)}
  .ee-diffx__copy{order:1}
  .ee-diffx__media{order:2;padding-bottom:22%}
}
@media (max-width:767px){
  .ee-diffx__media{padding-bottom:26%;margin-bottom:var(--ee-md)}
  /* 56% of the padded column lands at about 45% of the screen. */\n  .ee-diffx__small{width:56%;right:0;bottom:0;border-width:3px}
}

/* ---- our range: accordion + sticky image ---- */
.ee-range__grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--ee-xl);align-items:start}
.ee-range__list{border-top:1px solid var(--ee-rule)}
.ee-range__item{border-bottom:1px solid var(--ee-rule)}
.ee-range__top{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:var(--ee-md);
  background:none;border:0;padding:22px 0;cursor:pointer;text-align:left;color:var(--ee-ink);font-family:inherit;
  min-height:48px;
}
.ee-range__top h3{
  font-family:var(--ee-font-display);font-weight:700;letter-spacing:var(--ee-track);
  font-size:clamp(22px,2.4vw,32px);line-height:1.1;color:var(--ee-muted);
  transition:color .3s var(--ee-ease);
}
.ee-range__item.is-open .ee-range__top h3,.ee-range__top:hover h3{color:var(--ee-ink)}
.ee-range__chev{color:var(--ee-gold-deep);flex:none;transition:transform .4s var(--ee-ease)}
.ee-range__item.is-open .ee-range__chev{transform:rotate(180deg)}
/* 0fr to 1fr keeps the open and close on the compositor with no height maths. */
.ee-range__body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s var(--ee-ease)}
.ee-range__item.is-open .ee-range__body{grid-template-rows:1fr}
.ee-range__inner{overflow:hidden;min-height:0}
.ee-range__inner p{max-width:46ch;color:var(--ee-muted);padding-bottom:6px}
.ee-range__more{display:inline-flex;gap:6px;align-items:center;font-weight:700;font-size:14px;color:var(--ee-ink);padding-bottom:24px}
.ee a.ee-range__more{color:var(--ee-ink)}
.ee-range__more:hover{color:var(--ee-gold-deep)}
.ee-range__mimg{display:none;margin:0 0 var(--ee-md)}
.ee-range__media{position:sticky;top:120px;aspect-ratio:4/5;border-radius:var(--ee-r-lg);overflow:hidden;background:var(--ee-navy)}
.ee-range__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .4s var(--ee-ease)}
.ee-range__media img.is-active{opacity:1}
@media (max-width:767px){
  .ee-range__grid{grid-template-columns:1fr}
  .ee-range__media{display:none}
  .ee-range__top h3{font-size:22px}
  .ee-range__mimg{display:block;border-radius:var(--ee-r-md);overflow:hidden;aspect-ratio:3/2}
  .ee-range__mimg img{width:100%;height:100%;object-fit:cover;display:block}
}
@media (prefers-reduced-motion:reduce){
  .ee-range__body,.ee-range__media img,.ee-range__chev{transition:none}
}

/* ---- projects: bento ---- */
.ee-bento{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:320px;gap:var(--ee-lg)}
.ee-bento__item{position:relative;border-radius:var(--ee-r-lg);overflow:hidden;background:var(--ee-navy);isolation:isolate}
.ee-bento__item--wide{grid-column:span 2}
.ee-bento__item img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ee-ease)}
.ee-bento__item:hover img{transform:scale(1.05)}
.ee-bento__item::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(4,36,62,.9) 0%,rgba(4,36,62,.35) 45%,transparent 70%)}
.ee-bento__copy{position:absolute;left:0;right:0;bottom:0;padding:var(--ee-lg);z-index:1;color:#fff}
.ee-bento__name{display:block;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--ee-gold);margin-bottom:8px}
.ee-bento__name i{font-style:normal;color:rgba(255,255,255,.6);letter-spacing:.06em;text-transform:none;margin-left:8px}
.ee-bento__copy h3{font-family:var(--ee-font-display);font-weight:700;letter-spacing:var(--ee-track);font-size:26px;line-height:1.1;color:#fff}
.ee-bento__copy p{color:rgba(255,255,255,.76);font-size:15px;max-width:48ch;margin-top:8px}
.ee a.ee-bento__more{
  display:inline-flex;align-items:center;gap:14px;margin-top:var(--ee-lg);
  font-weight:700;color:var(--ee-ink);font-size:16px;
}
.ee-bento__more .ee-btn__badge{transition:transform .45s var(--ee-ease)}
.ee-bento__more:hover .ee-btn__badge{transform:rotate(45deg)}
@media (max-width:1024px){ .ee-bento{grid-template-columns:repeat(2,1fr);grid-auto-rows:280px} .ee-bento__item--wide{grid-column:span 2} }
@media (max-width:767px){ .ee-bento{grid-template-columns:1fr;grid-auto-rows:260px} .ee-bento__item--wide{grid-column:auto} .ee-bento__copy{padding:var(--ee-md)} .ee-bento__copy h3{font-size:22px} }

/* ---- closing CTA: scroll-expanding video ----
   The section is taller than the viewport so there is scroll to scrub through;
   the card sticks and grows from a 90% inset rounded panel to full bleed. */
.ee-ctax{position:relative;height:190vh;background:var(--ee-bg)}
.ee-ctax__pin{position:sticky;top:0;height:100vh;display:grid;place-items:center;overflow:hidden}
.ee-ctax__card{
  position:relative;width:90vw;height:84vh;border-radius:24px;overflow:hidden;
  background:var(--ee-navy);isolation:isolate;will-change:width,height,border-radius;
}
.ee-ctax__video,.ee-ctax__scrim{position:absolute;inset:0;width:100%;height:100%}
.ee-ctax__video{object-fit:cover;z-index:0}
.ee-ctax__scrim{z-index:1;background:linear-gradient(to top,rgba(4,36,62,.72),rgba(4,36,62,.42))}
.ee-ctax__content{
  position:relative;z-index:2;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:var(--ee-xl) var(--ee-gutter);gap:var(--ee-md);
  opacity:0;transform:translateY(24px);transition:opacity .6s var(--ee-ease),transform .6s var(--ee-ease);
}
.ee-ctax.is-full .ee-ctax__content{opacity:1;transform:none}
.ee-ctax__content .ee-h2{color:#fff;max-width:22ch}
.ee-ctax__content .ee-lede{max-width:46ch;color:rgba(255,255,255,.82)}
.ee-ctax__eyebrow{
  display:inline-flex;align-items:center;gap:10px;font-family:var(--ee-font-accent);font-style:normal;
  font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.85);
}
.ee-ctax__eyebrow i{width:8px;height:8px;border-radius:50%;background:var(--ee-gold-grad);display:inline-block}
.ee-ctax__toggle{
  position:absolute;right:24px;bottom:24px;z-index:3;width:44px;height:44px;border-radius:50%;
  background:rgba(4,36,62,.55);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.25);
  color:#fff;display:grid;place-items:center;cursor:pointer;transition:transform .16s var(--ee-ease);
}
.ee-ctax__toggle:active{transform:scale(.96)}
.ee-ctax__toggle .ee-ctax__ico-play{display:none}
.ee-ctax__toggle[data-paused="1"] .ee-ctax__ico-play{display:block}
.ee-ctax__toggle[data-paused="1"] .ee-ctax__ico-pause{display:none}
/* Phones and reduced motion: no scrub, just a full-width section. */
@media (max-width:767px), (prefers-reduced-motion:reduce){
  .ee-ctax{height:auto}
  .ee-ctax__pin{position:static;height:auto;display:block}
  .ee-ctax__card{width:100%;height:auto;min-height:88vh;border-radius:0}
  .ee-ctax__content{opacity:1;transform:none;min-height:88vh}
}
@media (max-width:767px){ .ee-ctax__content .ee-h2{font-size:32px} }

/* ---- gallery marquee above the footer ---- */
.ee-gallery{overflow:hidden;padding-block:var(--ee-lg) 0;background:var(--ee-bg)}
.ee-gallery__track{display:flex;gap:16px;width:max-content;animation:ee-gallery 70s linear infinite}
.ee-gallery:hover .ee-gallery__track{animation-play-state:paused}
.ee-gallery__track img{height:280px;width:auto;border-radius:var(--ee-r-md);object-fit:cover;flex:none}
@keyframes ee-gallery{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@media (max-width:767px){ .ee-gallery__track img{height:180px} }
@media (prefers-reduced-motion:reduce){
  .ee-gallery{overflow-x:auto}
  .ee-gallery__track{animation:none}
}

/* ============================================================
   v5: feedback round 3
   ============================================================ */


.ee-ctax__eyebrow,.ee-who__quote{font-family:var(--ee-font-accent)}
.ee-who__quote--plain{font-family:var(--ee-font);font-style:normal;font-weight:700;font-size:17px;color:var(--ee-ink)}

/* ---- nav: transparent at top, hides on scroll down, frosts on scroll up ---- */
.ee-nav{
  background:transparent;box-shadow:none;backdrop-filter:none;
  transition:transform .38s var(--ee-ease),background .38s var(--ee-ease),backdrop-filter .38s var(--ee-ease);
}
.ee-nav.is-stuck{background:transparent;backdrop-filter:none;box-shadow:none}
.ee-nav.is-frost{background:rgba(4,36,62,.34);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.ee-nav.is-hidden{transform:translateY(-100%)}
@media (prefers-reduced-motion:reduce){ .ee-nav{transition:none} }
.ee-nav .ee-explore{font-size:13px}

/* ---- hero: overscan so the parallax never exposes an edge ---- */
.ee-hero__media{inset:-14% 0}

/* ---- underline link variants ---- */
.ee a.ee-explore--ink{color:var(--ee-ink)}

/* ---- proof card: hairline, frosted, no hover ---- */
.ee-proof{
  background:rgba(255,255,255,.08);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border:1px solid rgba(255,255,255,.55);box-shadow:none;
}
.ee-proof__row:hover img{transform:none}
.ee-proof__row img{transition:none}

/* ---- who: years bubble centred on the player's left edge ---- */
.ee-who__years{left:0;bottom:auto;top:50%;transform:translate(-50%,-50%);width:132px;height:132px}
.ee-who__years::before{inset:9px}
.ee-who__years b{font-size:30px}
.ee-who__years span{font-size:8px;letter-spacing:.14em;margin-top:5px}
@media (max-width:1024px){ .ee-who__years{width:112px;height:112px} .ee-who__years b{font-size:25px} .ee-who__years span{font-size:7px} }

/* ---- difference: thinner frame ---- */
.ee-diffx__small{border-width:2px}
@media (max-width:767px){ .ee-diffx__small{border-width:2px} }

/* ---- range: learn more link spacing ---- */
.ee-range__more{margin-bottom:24px;padding-bottom:8px}

/* ---- projects ---- */
.ee-projects{padding-top:40px}
.ee-bento{gap:12px}
.ee-bento__item::after,.ee-bento__copy{opacity:0;transition:opacity .4s var(--ee-ease)}
.ee-bento__item:hover::after,.ee-bento__item:hover .ee-bento__copy,
.ee-bento__item:focus-within::after,.ee-bento__item:focus-within .ee-bento__copy{opacity:1}
@media (hover:none){ .ee-bento__item::after,.ee-bento__copy{opacity:1} }
.ee-bento__foot{text-align:center;margin-top:var(--ee-xl)}

/* ---- services ---- */
.ee-range__head--center{max-width:none;text-align:center}
.ee-range__head--center .ee-h2{max-width:22ch;margin-inline:auto}
.ee-services__grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ee-rule)}
.ee-services__item{padding:var(--ee-xl) var(--ee-lg) var(--ee-xl) 0;border-right:1px solid var(--ee-rule)}
.ee-services__item+.ee-services__item{padding-left:var(--ee-lg)}
.ee-services__item:last-child{border-right:0;padding-right:0}
.ee-services__icon{display:block;width:48px;height:48px;color:var(--ee-gold-deep);margin-bottom:var(--ee-lg)}
.ee-services__icon svg{width:100%;height:100%}
.ee-services__item h3{font-family:var(--ee-font-display);font-weight:700;letter-spacing:var(--ee-track);font-size:26px;line-height:1.12;color:var(--ee-ink);margin-bottom:12px;max-width:16ch}
.ee-services__item p{max-width:34ch}
@media (max-width:767px){
  .ee-services__grid{grid-template-columns:1fr}
  .ee-services__item{border-right:0;border-bottom:1px solid var(--ee-rule);padding:var(--ee-lg) 0}
  .ee-services__item+.ee-services__item{padding-left:0}
  .ee-services__item:last-child{border-bottom:0}
}

/* ---- testimonials carousel ---- */
.ee-testi{overflow:hidden;padding-bottom:var(--ee-section)}
.ee-testi__head{text-align:center;max-width:20ch;margin:0 auto var(--ee-xl)}
.ee-testi__viewport{cursor:grab;user-select:none;-webkit-user-select:none;touch-action:pan-y}
.ee-testi__viewport.is-dragging{cursor:grabbing}
.ee-testi__track{display:flex;gap:16px;width:max-content;will-change:transform}
.ee-tcard{
  position:relative;flex:none;height:560px;border-radius:24px;overflow:hidden;
  width:var(--tw,390px);background:var(--ee-navy);isolation:isolate;
}
.ee-tcard--quote{width:calc(var(--tw,390px) * 1.4);padding:36px;display:flex;flex-direction:column;justify-content:space-between}
.ee-tcard--video img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.ee-tcard--video::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(4,36,62,.82) 0%,rgba(4,36,62,.2) 40%,transparent 65%)}
.ee-tcard--video{cursor:pointer}
.ee-tcard__who{position:relative;z-index:1;color:#fff}
.ee-tcard__who b{display:block;font-size:17px;font-weight:700}
.ee-tcard__who span{display:block;font-size:14px;color:rgba(255,255,255,.66);margin-top:3px}
.ee-tcard--video .ee-tcard__who{position:absolute;left:28px;bottom:28px;right:96px}
.ee-tcard__play{
  position:absolute;right:24px;bottom:24px;z-index:2;width:56px;height:56px;border-radius:50%;
  background:rgba(4,36,62,.5);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.25);
  color:#fff;display:grid;place-items:center;cursor:pointer;transition:transform .16s var(--ee-ease);
}
.ee-tcard__play:active{transform:scale(.96)}
.ee-tcard__quote{
  font-family:var(--ee-font);font-weight:700;color:#fff;
  font-size:clamp(17px,1.5vw,25px);line-height:1.4;letter-spacing:-.2px;
}
.ee-tcard__foot{display:flex;align-items:flex-end;justify-content:space-between;gap:16px}
.ee-tcard__foot .ee-tcard__who span{color:rgba(255,255,255,.55)}
.ee-tcard__head{width:56px;height:56px;border-radius:50%;object-fit:cover;flex:none}
@media (max-width:1024px){ .ee-tcard{--tw:340px;height:500px} }
@media (max-width:767px){
  .ee-tcard,.ee-tcard--quote{width:85vw;height:460px}
  .ee-tcard--quote{padding:26px}
  .ee-tcard__quote{font-size:18px}
  .ee-testi__track{gap:12px}
}
.ee-modal{
  border:0;padding:0;background:transparent;max-width:min(960px,92vw);width:92vw;
  border-radius:18px;overflow:visible;
}
.ee-modal::backdrop{background:rgba(4,36,62,.86);backdrop-filter:blur(6px)}
.ee-modal__video{display:block;width:100%;aspect-ratio:16/9;background:var(--ee-navy);border-radius:18px}
.ee-modal__close{
  position:absolute;top:-52px;right:0;width:40px;height:40px;border-radius:50%;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);color:#fff;
  display:grid;place-items:center;cursor:pointer;
}

/* ---- closing CTA: headline only, no scrim ---- */
.ee-ctax__content .ee-h2{text-shadow:0 2px 24px rgba(4,36,62,.55)}
.ee-ctax__content{gap:0}

/* ---- gallery: tighter, always moving, breathing room above footer ---- */
.ee-gallery{padding-block:var(--ee-lg) var(--ee-xl)}
.ee-gallery__track{gap:6px}
.ee-gallery:hover .ee-gallery__track{animation-play-state:running}

/* ============================================================
   v6: feedback round 4
   ============================================================ */
/* Playfair returns as the single italic voice. One rule, last in the cascade,
   so every accent on the page shares the same weight, tracking and leading. */
@font-face{
  font-family:"Playfair Display";
  src:url("fonts/playfairdisplay-600i.woff2") format("woff2");
  font-weight:600;font-style:italic;font-display:swap;
}
:root{--ee-font-accent:"Playfair Display",Georgia,serif}
.ee .ee-accent{
  font-family:var(--ee-font-accent);font-weight:600;font-style:italic;
  letter-spacing:-.01em;line-height:1.12;padding-bottom:.06em;display:inline-block;
}

/* Hero: clip the overscanned media. The section is a positioned stacking
   context, so without this its image painted over the next section's ground. */
.ee-hero{overflow:hidden}

/* Logo wall as its own band */
.ee-logos{background:var(--ee-surface);padding-block:48px;border-top:1px solid var(--ee-rule);border-bottom:1px solid var(--ee-rule)}

/* Hero CTA pair: same underline treatment, Contact Us in flat gold */
.ee a.ee-explore--gold{color:var(--ee-gold)}

/* Services stack: icon sits where the step number used to */
.ee-proc__icon{display:block;width:44px;height:44px;color:var(--ee-gold-deep);margin-bottom:var(--ee-md)}
.ee-proc__icon svg{width:100%;height:100%}

/* Footer wordmark removed */
.ee-wordmark{display:none}

/* ============================================================
   v7: feedback round 5 (mobile pass, testimonials, footer)
   ============================================================ */
/* White ground everywhere; the cream read as grey between sections. */
:root{--ee-bg:#FFFFFF}
.ee{background:#fff}
.ee-logos{background:#fff}

/* ---- proof card: compact on phones ---- */
@media (max-width:767px){
  .ee-proof{
    display:grid;grid-template-columns:auto 1fr;grid-template-areas:"num row" "stars row" "label row";
    column-gap:16px;align-items:center;padding:14px 16px;min-width:0;width:100%;border-radius:16px;
  }
  .ee-proof__num{grid-area:num;font-size:26px}
  .ee-proof__stars{grid-area:stars;margin-top:2px}
  .ee-proof__stars svg{width:10px;height:10px}
  .ee-proof__label{grid-area:label;margin-top:2px;font-size:12px}
  .ee-proof__row{grid-area:row;margin-top:0;justify-self:end}
  .ee-proof__row img,.ee-proof__more{width:34px;height:34px;margin-left:-10px;font-size:15px}
}

/* ---- who on phones: player only, bubble kept inside the frame ---- */
@media (max-width:767px){
  .ee-who__mobile{display:none}
  .ee-who__stage{display:block;width:100%;margin-top:var(--ee-lg)}
  .ee img.ee-who__horse{display:none}
  .ee-who__player{margin-bottom:34px}
  .ee-who__years{left:12px;top:auto;bottom:-26px;transform:none;width:92px;height:92px}
  .ee-who__years b{font-size:22px}
  .ee-who__years span{font-size:6.5px;letter-spacing:.1em}
}

/* ---- bento: location above the name ---- */
.ee-bento__loc{display:block;font-size:12px;color:rgba(255,255,255,.66);margin-bottom:4px}

/* ---- services stack copy ---- */
.ee-proc__step p{max-width:52ch}

/* ---- testimonials: photo cards ---- */
.ee-tx__head{display:grid;grid-template-columns:1fr 1fr;gap:var(--ee-xl);align-items:end;margin-bottom:var(--ee-xl)}
.ee-tx__lede{max-width:44ch;color:var(--ee-muted);justify-self:end}
.ee-tx__scroller{
  display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 32px) / 3);gap:16px;
  overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;
  cursor:grab;padding-bottom:4px;
}
.ee-tx__scroller::-webkit-scrollbar{display:none}
.ee-tx__scroller.is-dragging{cursor:grabbing;scroll-snap-type:none}
.ee-txcard{scroll-snap-align:start;outline:none}
.ee-txcard__photo{position:relative;margin:0;aspect-ratio:3/4;border-radius:20px;overflow:hidden;background:var(--ee-navy);isolation:isolate}
.ee-txcard__photo img{width:100%;height:100%;object-fit:cover;object-position:top;display:block;user-select:none;-webkit-user-drag:none}
.ee-txcard__photo::before{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(4,36,62,.78),rgba(4,36,62,.1) 45%,transparent 65%)}
.ee-txcard__veil{position:absolute;inset:0;background:rgba(4,36,62,.86);opacity:0;transition:opacity .4s var(--ee-ease)}
.ee-txcard__quote{
  position:absolute;left:26px;right:26px;top:26px;margin:0;color:#fff;
  font-size:clamp(14px,1.05vw,16px);line-height:1.5;font-weight:700;letter-spacing:-.1px;
  opacity:0;transform:translateY(14px);transition:opacity .4s var(--ee-ease),transform .4s var(--ee-ease);
}
.ee-txcard__who{position:absolute;left:26px;right:26px;bottom:24px;color:#fff;z-index:1}
.ee-txcard__who b{display:block;font-size:17px}
.ee-txcard__who span{display:block;font-size:13.5px;color:rgba(255,255,255,.7);margin-top:2px}
.ee-txcard:hover .ee-txcard__veil,.ee-txcard:focus-visible .ee-txcard__veil,.ee-txcard:focus-within .ee-txcard__veil{opacity:1}
.ee-txcard:hover .ee-txcard__quote,.ee-txcard:focus-visible .ee-txcard__quote,.ee-txcard:focus-within .ee-txcard__quote{opacity:1;transform:none}
.ee-txcard__below{display:none}
.ee-tx__nav{display:flex;gap:10px;justify-content:flex-end;margin-top:var(--ee-lg)}
.ee-tx__btn{
  width:44px;height:44px;border-radius:50%;background:transparent;border:1px solid var(--ee-rule);
  color:var(--ee-ink);display:grid;place-items:center;cursor:pointer;
  transition:transform .16s var(--ee-ease),border-color .2s var(--ee-ease);
}
.ee-tx__btn:hover{border-color:var(--ee-gold)}
.ee-tx__btn:active{transform:scale(.96)}
@media (max-width:1024px){ .ee-tx__scroller{grid-auto-columns:calc((100% - 16px) / 2)} }
@media (max-width:767px){
  .ee-tx__head{grid-template-columns:1fr;gap:var(--ee-md);align-items:start}
  .ee-tx__lede{justify-self:start}
  /* Bleed the scroller to the screen edges so a card is 85% of the viewport,
     with the first card still starting on the page gutter. */
  .ee-tx__scroller{grid-auto-columns:85vw;gap:12px;margin-inline:calc(-1 * var(--ee-gutter));padding-inline:var(--ee-gutter);scroll-padding-inline:var(--ee-gutter)}
  /* No hover on phones: the quote reads below the photo in page ink. */
  .ee-txcard__photo::before,.ee-txcard__veil,.ee-txcard__quote,.ee-txcard__who{display:none}
  .ee-txcard__below{display:block;padding:16px 4px 0}
  .ee-txcard__below p{font-size:16px;line-height:1.55;color:var(--ee-ink);font-weight:700}
  .ee-txcard__below b{display:block;margin-top:12px;color:var(--ee-ink)}
  .ee-txcard__below span{display:block;font-size:14px;color:var(--ee-muted)}
  .ee-tx__nav{justify-content:center}
}
@media (prefers-reduced-motion:reduce){ .ee-txcard__veil,.ee-txcard__quote{transition:none} }

/* ---- gallery: native scroll on phones instead of a transformed track ---- */
@media (max-width:767px){
  .ee-gallery{overflow-x:auto;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .ee-gallery::-webkit-scrollbar{display:none}
  .ee-gallery__track{animation:none;width:max-content;gap:6px;padding-inline:var(--ee-gutter)}
  .ee-gallery__track img{scroll-snap-align:start}
}

/* ---- footer ---- */
.ee-foot{padding-top:var(--ee-xl)}
.ee-foot__grid{grid-template-columns:1.3fr 1fr .8fr;gap:var(--ee-xl);padding-block:var(--ee-lg) var(--ee-xl)}
.ee img.ee-foot__brand img,.ee-foot__brand img{width:auto;height:44px;max-width:none;margin-bottom:var(--ee-lg)}
.ee-foot__contact li{display:flex;gap:10px;align-items:flex-start;font-size:15px}
.ee-foot__contact svg{flex:none;margin-top:5px;color:rgba(255,255,255,.7)}
.ee-foot__legal{align-items:center}
.ee-foot__legal a{color:#fff}
.ee-foot__social{display:flex;gap:18px;align-items:center}
.ee-foot__social a{color:rgba(255,255,255,.6);display:grid;place-items:center;transition:color .2s var(--ee-ease)}
.ee-foot__social a:hover{color:var(--ee-gold)}
.ee-foot__top{width:38px;height:38px;border-radius:8px;background:rgba(255,255,255,.08);color:#fff !important;margin-left:8px}
@media (max-width:1024px){ .ee-foot__grid{grid-template-columns:1fr 1fr} }
@media (max-width:767px){ .ee-foot__grid{grid-template-columns:1fr} .ee-foot__legal{flex-direction:column;align-items:flex-start;gap:14px} }

/* ============================================================
   v8: scroll reveal choreography
   One curve, three moves: words rise out of a mask, blocks fade up,
   images wipe open. Everything is transform, opacity or clip-path, driven
   by CSS transitions so it stays interruptible and off the main thread.
   ============================================================ */

/* Blocks: a shorter rise than before, on the strong ease-out. */
.js .ee-reveal{opacity:0;transform:translateY(18px)}
.js .ee-reveal.is-in{opacity:1;transform:none;transition:opacity .7s var(--ee-ease),transform .7s var(--ee-ease)}

/* Words: each word sits in an overflow mask and rises 112% of its own height.
   The mask carries a descender reserve so italic g, y and p never clip. */
.ee-w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.16em;margin-bottom:-.16em}
.ee-w__i{display:inline-block;will-change:transform}
.js .ee-split{opacity:1;transform:none}
.js .ee-split .ee-w__i{transform:translateY(112%)}
.js .ee-split.is-in .ee-w__i{
  transform:none;
  transition:transform .9s var(--ee-ease);
  transition-delay:calc(var(--d,0ms) + var(--i,0) * 45ms);
}

/* Images: wipe open from the top edge. */
.js .ee-clip{opacity:1;transform:none;clip-path:inset(0 0 100% 0)}
.js .ee-clip.is-in{clip-path:inset(0 0 0 0);transition:clip-path .9s var(--ee-ease)}
.js .ee-clip.is-in.ee-diffx__small{transition:clip-path .9s var(--ee-ease) .25s}

/* Reduced motion: no movement, a short fade only. */
@media (prefers-reduced-motion:reduce){
  .js .ee-reveal,.js .ee-split .ee-w__i,.js .ee-clip{opacity:1;transform:none;clip-path:none;transition:none}
}

/* ============================================================
   v9: badge corner, image overlap, mobile testimonial cards
   ============================================================ */

/* ---- FIX 1: years badge tucked into the bottom-left corner ----
   Roughly a third of the disc overlaps the player. The control bar starts
   to the right of it so the play toggle is never covered. */
.ee-who__years{
  width:136px;height:136px;left:0;top:auto;bottom:0;transform:translate(-42%,42%);
  padding:16px;box-sizing:border-box;
}
.ee-who__years::before{inset:8px}
.ee-who__years b{font-size:26px;line-height:1}
.ee-who__years span{font-size:7px;letter-spacing:.12em;line-height:1.35;max-width:76px;white-space:normal;margin-top:5px}
.ee-who__bar{left:96px}
.ee-who__player{margin-bottom:0}
@media (max-width:1024px){ .ee-who__years{width:120px;height:120px} .ee-who__years b{font-size:23px} }
@media (max-width:767px){
  .ee-who__years{width:100px;height:100px;left:0;bottom:0;transform:translate(-30%,55%);padding:12px}
  .ee-who__years b{font-size:20px}
  .ee-who__years span{font-size:6px;max-width:60px}
  .ee-who__player{margin-bottom:56px}
  .ee-who__bar{left:76px}
}

/* ---- FIX 2: layered images ----
   A third of the small image sits over the large one, the rest hangs off the
   bottom edge, and it stays flush with the right margin rather than past it. */
.ee-diffx__media{padding-bottom:21%}
.ee-diffx__small{right:0;bottom:0;box-shadow:0 28px 56px -20px rgba(4,36,62,.5)}
@media (max-width:1024px){ .ee-diffx__media{padding-bottom:21%} }
@media (max-width:767px){ .ee-diffx__media{padding-bottom:25%;margin-bottom:var(--ee-lg)} .ee-diffx__small{right:0;bottom:0} }

/* ---- FIX 3: mobile testimonials, quote inside the card ---- */
.ee-txcard__mark{display:none}
.ee-tx__dots{display:none}
@media (max-width:767px){
  .ee-tx__scroller{
    grid-auto-columns:88vw;gap:12px;
    margin-inline:calc(-1 * var(--ee-gutter));
    padding-inline:calc((100vw - 88vw) / 2);
    scroll-padding-inline:calc((100vw - 88vw) / 2);
  }
  .ee-txcard{scroll-snap-align:center}
  .ee-txcard__below{display:none}
  /* The card grows with its quote: the photo becomes a cover behind flowing
     content, so the longest quote pushes the card taller rather than clipping. */
  .ee-txcard__photo{
    display:flex;flex-direction:column;justify-content:flex-end;
    aspect-ratio:auto;min-height:118vw;padding:22px 20px 22px;
  }
  .ee-txcard__photo img{position:absolute;inset:0;width:100%;height:100%}
  .ee-txcard__photo::before{display:block;background:linear-gradient(to top,rgba(4,36,62,.94) 0%,rgba(4,36,62,.7) 38%,rgba(4,36,62,.15) 60%,transparent 72%)}
  .ee-txcard__veil{display:none}
  .ee-txcard__mark{
    display:block;position:relative;z-index:1;color:#fff;
    font-family:var(--ee-font-display);font-size:44px;line-height:.6;margin-bottom:10px;padding-top:52%;
  }
  .ee-txcard__quote{
    display:block;position:static;opacity:1;transform:none;margin:0;
    font-size:16px;line-height:1.45;font-weight:700;color:#fff;z-index:1;
  }
  .ee-txcard__who{display:block;position:static;margin-top:14px;font-size:14px;color:#fff}
  .ee-txcard__who b{display:inline;font-size:14px}
  .ee-txcard__who span{display:inline;color:rgba(255,255,255,.85);margin:0}
  .ee-txcard__who span::before{content:", "}
  .ee-tx__nav{display:none}
  .ee-tx__dots{display:flex;justify-content:center;gap:8px;margin-top:18px}
  .ee-tx__dot{width:8px;height:8px;border-radius:50%;border:0;padding:0;background:var(--ee-ink);opacity:.25;cursor:pointer;transition:opacity .2s var(--ee-ease),transform .2s var(--ee-ease)}
  .ee-tx__dot.is-active{opacity:1;transform:scale(1.15)}
}

/* The template no longer loads the theme's reset, so the browser's default
   8px body margin was insetting the entire page on every side. */
body.ee{margin:0}

/* ============================================================
   v10: fail-safe reveal
   The hidden state now lives on .ee-armed, which JS adds ONLY to elements
   that start below the fold. Nothing is hidden by default, so a throttled
   observer, a full-page screenshot or no JS at all can never leave real
   content invisible. clip-path is gone: on the sticky product panel it was
   the riskiest move of the set, and a soft rise reads the same.
   ============================================================ */

/* Neutralise every earlier hidden-by-default rule. */
.js .ee-reveal{opacity:1;transform:none}
.js .ee-clip{clip-path:none}
.js .ee-split .ee-w__i{transform:none}

/* Armed blocks */
.js .ee-armed{opacity:0;transform:translateY(18px)}
.js .ee-armed.is-in{opacity:1;transform:none;transition:opacity .7s var(--ee-ease),transform .7s var(--ee-ease)}

/* Armed headlines: words rise out of their mask */
.js .ee-armed.ee-split{opacity:1;transform:none}
.js .ee-armed.ee-split .ee-w__i{transform:translateY(112%)}
.js .ee-armed.ee-split.is-in .ee-w__i{
  transform:none;
  transition:transform .9s var(--ee-ease);
  transition-delay:calc(var(--d,0ms) + var(--i,0) * 45ms);
}

/* Armed imagery: soft rise, never clipped */
.js .ee-armed.ee-clip{opacity:0;transform:translateY(22px);clip-path:none}
.js .ee-armed.ee-clip.is-in{opacity:1;transform:none;transition:opacity .8s var(--ee-ease),transform .8s var(--ee-ease)}

@media (prefers-reduced-motion:reduce){
  .js .ee-armed,.js .ee-armed.ee-clip{opacity:1;transform:none;transition:none}
  .js .ee-armed.ee-split .ee-w__i{transform:none;transition:none}
}

/* ============================================================
   v13: accent baseline + mobile years badge
   ============================================================ */

/* A masked word is an inline-block with overflow hidden, so its baseline is
   its bottom margin edge, not its text baseline. Words inside .ee-accent were
   inheriting that span's taller line-height, making their masks taller and
   dropping them below the rest of the headline. One geometry for every word. */
.ee-split .ee-accent{display:inline;line-height:inherit;padding-bottom:0}
.ee-split .ee-accent .ee-w{padding-bottom:.24em;margin-bottom:-.24em}

/* Phones: the badge was translated off the left edge and clipped. Sit it on
   the player's lower-left corner, fully on screen, with the control bar
   starting clear of it. */
@media (max-width:767px){
  .ee-who__years{width:86px;height:86px;left:10px;bottom:-54px;top:auto;transform:none;padding:10px}
  .ee-who__years::before{inset:6px}
  .ee-who__years b{font-size:19px}
  .ee-who__years span{font-size:6.5px;letter-spacing:.1em;max-width:58px;margin-top:3px}
  .ee-who__bar{left:104px}
  .ee-who__player{margin-bottom:62px}
}

/* ============================================================
   v14: testimonial card polish
   ============================================================ */

/* The name prefix was authored as a CSS escape and the backslash survived the
   write, printing a literal 2014 on the page. It would also have put an em
   dash into a brand that does not use them, so it is removed, not repaired. */
.ee-txcard__who b::before{content:none}

/* Quote marks live in CSS so the phone card can rely on its own large mark
   instead of showing two sets. */
.ee-txcard__quote::before{content:"\201C"}
.ee-txcard__quote::after{content:"\201D"}

@media (max-width:767px){
  .ee-txcard__quote::before,.ee-txcard__quote::after{content:none}
  /* Heavier navy base so white copy holds over a bright, high-key photo. */
  .ee-txcard__photo::before{
    background:linear-gradient(to top,
      rgba(4,36,62,.97) 0%,
      rgba(4,36,62,.93) 28%,
      rgba(4,36,62,.74) 50%,
      rgba(4,36,62,.30) 70%,
      rgba(4,36,62,0) 86%);
  }
}

/* ============================================================
   v15: Elementor compatibility
   _css_classes is applied to the .elementor-element wrapper, not to the
   heading or paragraph inside it. So our component classes style the wrapper
   while Elementor styles the real text node. Make the inner node inherit and
   the existing design system keeps working unchanged on both surfaces.
   ============================================================ */
.ee .elementor-widget-heading .elementor-heading-title,
.ee .elementor-widget-text-editor > .elementor-widget-container,
.ee .elementor-widget-text-editor p{
  font-family:inherit;font-size:inherit;font-weight:inherit;
  line-height:inherit;letter-spacing:inherit;color:inherit;
}
.ee .elementor-widget-text-editor p{margin:0 0 1em}
.ee .elementor-widget-text-editor p:last-child{margin-bottom:0}
/* Elementor gives every widget a bottom margin from its global settings. */
.ee .elementor-widget:not(:last-child){margin-bottom:0}
/* Widgets are block-level and would stretch our inline underline links. */
.ee .elementor-widget-html{width:100%}

/* ============================================================
   v16: pill + inline widgets inside Elementor containers
   An Elementor widget wrapper is a flex item, so it stretches to the full
   container width. Anything that is meant to hug its text (a pill, an inline
   link) has to opt out of that stretch, or an inline-block pill renders as a
   full-width bar.
   ============================================================ */
.ee .elementor-element.ee-pilltag,
.ee .elementor-element.ee-eyebrow,
.ee .elementor-element.ee-explore{
  align-self:flex-start;
  width:auto;
  max-width:max-content;
}