/* =========================================================
   V18 — Montserrat everywhere, unified sizes, Etude-style motion
   ========================================================= */

@font-face{font-family:"Montserrat";font-weight:300;font-style:normal;font-display:swap;src:url("../../home/assets/fonts/montserrat-latin-300-normal.woff2") format("woff2")}
@font-face{font-family:"Montserrat";font-weight:400;font-style:normal;font-display:swap;src:url("../../home/assets/fonts/montserrat-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Montserrat";font-weight:500;font-style:normal;font-display:swap;src:url("../../home/assets/fonts/montserrat-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Montserrat";font-weight:600;font-style:normal;font-display:swap;src:url("../../home/assets/fonts/montserrat-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Montserrat";font-weight:700;font-style:normal;font-display:swap;src:url("../../home/assets/fonts/montserrat-latin-700-normal.woff2") format("woff2")}

:root{
  --font:"Montserrat",system-ui,sans-serif;
  /* one type scale used across the whole page */
  --fs-eyebrow:11px;
  --fs-body:15px;
  --fs-small:13px;
  --fs-card:22px;
  --fs-h2:clamp(40px,4.6vw,72px);
  --fs-display:clamp(60px,7.6vw,124px);
  --fs-marquee:clamp(64px,9vw,148px);
}

/* ---------- One font for everything ---------- */
html,body,button,input,textarea,select,h1,h2,h3,h4,p,a,span,strong,b,em,i,small{font-family:var(--font) !important}
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto !important}

/* ---------- Unified sizes ---------- */
.eyebrow,.hero-eyebrow,.about-stamp,.project-start-label{font-size:var(--fs-eyebrow) !important;letter-spacing:.22em}

.about-copy h2,.services-head h2,.work-intro h2,.process-title h2,
.etude-process .process-title h2,.why-plus-lead h2{
  font-size:var(--fs-h2) !important;
  line-height:1 !important;
  letter-spacing:-.045em !important;
  font-weight:500 !important;
  margin:0 0 28px !important;
}
.about-copy h2 span,.why-plus-lead h2 span{font-weight:300 !important}

.hero-title{font-size:var(--fs-display) !important;letter-spacing:-.05em !important;font-weight:600 !important}
.hero-title em{font-weight:300 !important}
.cta-inner h2,.etude-cta .cta-inner h2{font-size:var(--fs-display) !important;letter-spacing:-.05em !important;font-weight:600 !important;line-height:.9 !important}
.cta-inner h2 span,.etude-cta .cta-inner h2 span{font-weight:300 !important}

.hero-bottom p,.body-copy p,.services-head p:last-child,.work-intro p:last-child,
.etude-process .process-title>p:last-child,.why-plus-lead>p:last-child,
.etude-cta .cta-bottom>p,.why-plus-answer p,.footer-ref-brand p{
  font-size:var(--fs-body) !important;line-height:1.7 !important
}
.service-card p,.process-list p,.etude-process .process-list p,.footer-contact-row p,.footer-ref-column a{font-size:var(--fs-small) !important}
.service-card h3,.process-list h3,.etude-process .process-list h3,.why-plus-title{
  font-size:var(--fs-card) !important;line-height:1.15 !important;font-weight:500 !important;letter-spacing:-.02em !important
}
.btn,.text-link{font-size:12px !important;font-weight:500;letter-spacing:.04em}
.desktop-nav a{font-size:11px !important;font-weight:500}
.footer-ref-column h3,.footer-ref-contact h3{font-size:14px !important;letter-spacing:.14em !important}

/* ---------- Numbers: same font + same size for every stat ---------- */
.numbers-final .numbers-video-item strong{
  font-family:var(--font) !important;
  font-weight:700 !important;
  font-size:clamp(80px,7.4vw,128px) !important;
  letter-spacing:-.04em !important;
  font-variant-numeric:tabular-nums;
  color:rgba(31,42,68,.07) !important;
}
.numbers-final .numbers-video-item span{
  font-family:var(--font) !important;
  font-size:clamp(22px,1.9vw,34px) !important;
  font-weight:500 !important;
  letter-spacing:-.02em !important;
}
@media(max-width:900px){.numbers-final .numbers-video-item strong{font-size:84px !important}}
@media(max-width:560px){
  .numbers-final .numbers-video-item strong{font-size:56px !important}
  .numbers-final .numbers-video-item span{font-size:19px !important}
}

/* ---------- Marquees with ★ (scroll-reactive, JS driven) ---------- */
.giant-word,.work-marquee{display:block !important;overflow:hidden;white-space:nowrap}
.giant-word{padding:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.work-marquee{height:auto !important;padding:14px 0}
.mq-track{display:inline-flex !important;align-items:center;width:max-content;will-change:transform;animation:none !important}
.mq-track span{
  flex:none;animation:none !important;
  font-size:var(--fs-marquee) !important;font-weight:300 !important;letter-spacing:-.05em !important;
  line-height:1 !important;padding:18px 0 22px !important;
}
.mq-track .mq-star{
  flex:none;font-style:normal;display:inline-block;
  font-size:calc(var(--fs-marquee) * .42);line-height:1;margin:0 .9em;
  color:#c6a75e;
}
/* lower opacity for the ICON MULTIMEDIA band */
.giant-word .mq-track span{color:var(--ink);opacity:.14}
.giant-word .mq-track .mq-star{opacity:.35}
.work-marquee .mq-track span{opacity:.9}
.no-js-motion .mq-track{animation:mqFallback 30s linear infinite !important}
@keyframes mqFallback{to{transform:translateX(-50%)}}

/* ---------- Preloader ---------- */
.preloader{position:fixed;inset:0;z-index:1000;background:#121929;color:#fff;display:flex;flex-direction:column;justify-content:flex-end;padding:0 4.8vw 5vh}
.preloader-inner{display:flex;justify-content:space-between;align-items:flex-end;gap:30px}
.preloader-brand{display:inline-flex;align-items:center;gap:12px;font-size:13px;letter-spacing:.24em;font-weight:600;overflow:hidden}
.preloader-brand .brand-mark{width:22px;height:30px;font-size:16px}
.preloader-count{font-size:clamp(90px,16vw,260px);font-weight:600;line-height:.8;letter-spacing:-.06em;font-variant-numeric:tabular-nums}
.preloader-bar{margin-top:28px;height:1px;background:rgba(255,255,255,.15)}
.preloader-bar i{display:block;height:100%;width:0;background:#c6a75e}
body.is-loading{overflow:hidden}
.no-js-motion .preloader{display:none}

/* ---------- Split text ---------- */
.split-line{display:block;overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
.split-word{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.split-word>i{display:inline-block;font-style:normal;will-change:transform}

/* ---------- Image reveal ---------- */
[data-media]{position:relative}
[data-media] figure,figure[data-media]{overflow:hidden}
.media-cover{position:absolute;inset:0;background:var(--blue);transform-origin:top;z-index:3;pointer-events:none}

/* ---------- Header hide/show ---------- */
.site-header{transition:transform .5s var(--ease),background .35s var(--ease),height .35s var(--ease) !important}
.site-header.hide{transform:translateY(-100%)}

/* ---------- Cursor with label ---------- */
.cursor{display:none;align-items:center;justify-content:center;color:#fff;font-size:0;font-weight:600;letter-spacing:.14em;transition:width .35s var(--ease),height .35s var(--ease),background .35s var(--ease),font-size .2s !important;left:0 !important;top:0 !important}
@media (pointer:fine){.cursor{display:flex}}
.cursor.is-hover{width:44px !important;height:44px !important}
.cursor.is-view{width:96px !important;height:96px !important;background:#c6a75e;border-color:#c6a75e;mix-blend-mode:normal;font-size:11px}

/* ---------- Horizontal portfolio pin ---------- */
.work-pin{overflow:hidden}
.work-track{will-change:transform}
.work-card{cursor:none}
@media (pointer:coarse){.work-card{cursor:auto}}

/* ---------- Process lines draw ---------- */
.process-list article{position:relative}
.process-list article::after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:100%;background:#fbf8f3;transform:scaleX(var(--line-p,0));transform-origin:left;opacity:.55}

/* magnetic */
.btn,.floating-top{will-change:transform}

@media (prefers-reduced-motion:reduce){
  .preloader{display:none}
  .mq-track{animation:mqFallback 60s linear infinite !important}
}

@media (max-width:900px){
  .work-track{width:auto !important;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .work-track::-webkit-scrollbar{display:none}
  .work-card{scroll-snap-align:start}
}

/* hero heading: room for Montserrat's taller letters */
.hero-title{line-height:1 !important;font-size:clamp(52px,6.6vw,112px) !important}
.hero-line{height:auto !important;overflow:hidden;padding-bottom:.08em;margin-bottom:-.06em}
.hero-line i{white-space:nowrap}
@media(max-width:760px){.hero-title{font-size:11vw !important}.hero-line i{white-space:normal}}

/* =========================================================
   V19 — ONE TYPOGRAPHY SYSTEM (Montserrat only)
   Headings 600 · Labels 500 · Text 400
   ========================================================= */
:root{
  --t-display:clamp(48px,6.2vw,104px);   /* hero + CTA */
  --t-h2:clamp(38px,4.2vw,68px);         /* every section title */
  --t-h3:clamp(20px,1.6vw,24px);         /* every card / row / list title */
  --t-body:15px;                          /* every paragraph */
  --t-small:13px;                         /* card text, footer text */
  --t-label:11px;                         /* eyebrows, numbers 01-09, nav */
  --t-button:13px;
  --t-marquee:clamp(56px,8vw,132px);
  --t-stat:clamp(76px,7vw,120px);
  --t-stat-label:clamp(20px,1.7vw,28px);
}

/* reset everything to the same family, no italics, no mixed weights */
*,*::before,*::after{font-family:"Montserrat",system-ui,sans-serif !important;font-style:normal !important}
body{font-weight:400;font-size:var(--t-body);letter-spacing:0}
em,i,b,strong{font-style:normal !important}

/* ---- display: hero + CTA ---- */
.hero-title,.cta-inner h2,.etude-cta .cta-inner h2{
  font-size:var(--t-display) !important;font-weight:600 !important;
  line-height:1.02 !important;letter-spacing:-.03em !important
}
.hero-title em,.cta-inner h2 span,.etude-cta .cta-inner h2 span{font-weight:600 !important}
.hero-title em{color:rgba(255,255,255,.35) !important}
.cta-inner h2 span,.etude-cta .cta-inner h2 span{color:rgba(255,255,255,.35) !important}

/* ---- all section titles identical ---- */
main h2:not(.cta-inner h2),
.about-copy h2,.services-head h2,.work-intro h2,.process-title h2,
.etude-process .process-title h2,.why-plus-lead h2{
  font-size:var(--t-h2) !important;font-weight:600 !important;
  line-height:1.05 !important;letter-spacing:-.03em !important;margin:0 0 28px !important
}
.about-copy h2 span,.why-plus-lead h2 span{font-weight:600 !important;color:#80869a !important}

/* ---- all card / row titles identical ---- */
.service-card h3,.process-list h3,.etude-process .process-list h3,.why-plus-title{
  font-size:var(--t-h3) !important;font-weight:600 !important;line-height:1.2 !important;letter-spacing:-.01em !important
}

/* ---- all paragraphs identical ---- */
main p,.hero-bottom p,.body-copy p,.footer-ref-brand p{
  font-size:var(--t-body) !important;font-weight:400 !important;line-height:1.7 !important;letter-spacing:0 !important
}
.service-card p,.process-list p,.etude-process .process-list p,
.footer-contact-row p,.footer-ref-column a,.footer-ref-bottom p,.work-card>div{
  font-size:var(--t-small) !important;font-weight:400 !important;line-height:1.6 !important;letter-spacing:0 !important
}
.footer-contact-row strong{font-weight:600 !important}

/* ---- labels: eyebrows, 01-09 numbers, nav, stamps ---- */
.eyebrow,.hero-eyebrow,.about-stamp,.hero-scroll,
.service-card>span,.process-list span,.why-plus-no,.work-card b,
.desktop-nav a,.preloader-brand{
  font-size:var(--t-label) !important;font-weight:500 !important;letter-spacing:.18em !important;text-transform:uppercase
}
.footer-ref-column h3,.footer-ref-contact h3{font-size:var(--t-label) !important;font-weight:600 !important;letter-spacing:.18em !important}

/* ---- buttons & links ---- */
.btn,.text-link,.floating-chat-pill,.cta-actions a{
  font-size:var(--t-button) !important;font-weight:500 !important;letter-spacing:.01em !important
}
.brand-name{font-weight:600 !important;letter-spacing:.08em !important}
.mobile-menu a{font-weight:600 !important;letter-spacing:-.02em !important}

/* ---- marquee, numbers, client words ---- */
.mq-track span{font-size:var(--t-marquee) !important;font-weight:600 !important;letter-spacing:-.03em !important}
.numbers-final .numbers-video-item strong{font-size:var(--t-stat) !important;font-weight:600 !important;letter-spacing:-.03em !important}
.numbers-final .numbers-video-item span{font-size:var(--t-stat-label) !important;font-weight:600 !important;letter-spacing:-.01em !important}
.client-word{font-weight:600 !important;letter-spacing:-.02em !important}
.preloader-count{font-weight:600 !important;letter-spacing:-.03em !important}

@media(max-width:760px){
  :root{--t-h2:34px;--t-h3:20px;--t-body:14px;--t-display:11vw;--t-stat:60px;--t-stat-label:18px}
}
.brand,.brand-mark,.floating-chat-pill{font-weight:600 !important}
.brand,.brand-mark,.floating-chat-pill{font-weight:600 !important}

/* ---------- Logo ---------- */
.brand-logo{display:inline-flex;align-items:center;line-height:0}
.brand-logo img{width:auto;height:60px;display:block;transition:height .35s var(--ease)}
.site-header.scrolled .brand-logo img{height:46px}
.footer-ref-logo img{height:78px}
@media(max-width:760px){.brand-logo img{height:40px}.site-header.scrolled .brand-logo img{height:36px}.footer-ref-logo img{height:64px}}
.about-image img{position:relative;height:114% !important;top:-7%}

/* =========================================================
   Header: Services dropdown (all pages)
   ========================================================= */
:root{--t-h2:clamp(34px,3.5vw,56px)}
@media(max-width:760px){:root{--t-h2:32px}}
.nav-drop{position:relative;display:flex;align-items:center}
.nav-drop>a{display:inline-flex;align-items:center;gap:6px}
.nav-chev{width:11px;height:11px;transition:transform .35s var(--ease)}
.nav-drop:hover .nav-chev,.nav-drop:focus-within .nav-chev{transform:rotate(180deg)}
.nav-drop-panel{position:absolute;top:100%;left:50%;padding-top:22px;transform:translate(-50%,10px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .3s var(--ease),transform .4s var(--ease),visibility .3s}
.nav-drop:hover .nav-drop-panel,.nav-drop:focus-within .nav-drop-panel{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)}
.nav-drop-inner{min-width:280px;background:#fbf8f3;border-radius:14px;padding:10px;box-shadow:0 24px 60px rgba(18,25,41,.28)}
.nav-drop-inner::before{content:"";position:absolute;top:16px;left:50%;width:12px;height:12px;background:#fbf8f3;transform:translateX(-50%) rotate(45deg);border-radius:2px}
.desktop-nav .nav-drop-inner a{display:flex !important;justify-content:space-between;align-items:center;gap:20px;padding:13px 14px;border-radius:9px;color:#161e31 !important;opacity:1 !important;font-size:13px !important;font-weight:500 !important;letter-spacing:0 !important;text-transform:none !important;transform:none !important;border-bottom:0 !important;transition:background .25s,color .25s,padding .35s var(--ease) !important}
.desktop-nav .nav-drop-inner a b{font-weight:400;color:#80869a;transition:transform .3s var(--ease),color .25s}
.desktop-nav .nav-drop-inner a:hover{background:#f7f2ea;color:var(--blue) !important;padding-left:18px}
.desktop-nav .nav-drop-inner a:hover b{color:#c6a75e;transform:translate(2px,-2px)}
.desktop-nav .nav-drop-inner a.is-current{color:var(--blue) !important;background:#f7f2ea;font-weight:600 !important}
.desktop-nav .nav-drop-inner .nav-drop-all{border-bottom:1px solid #e8dcc8 !important;border-radius:9px 9px 0 0;margin-bottom:6px;font-weight:600 !important;color:var(--blue) !important}

/* mobile sub-menu */
.mobile-sub{display:flex;flex-direction:column;padding:6px 0 14px 16px;border-bottom:1px solid rgba(255,255,255,.16)}
.mobile-menu .mobile-sub a{font-size:17px !important;font-weight:500 !important;letter-spacing:0 !important;padding:8px 0 !important;border-bottom:0 !important;color:rgba(255,255,255,.75)}
.mobile-menu .mobile-sub a::before{content:"— ";color:#c6a75e}
.mobile-menu{overflow-y:auto}
@media(max-width:760px){.mobile-menu a{font-size:32px !important}}

/* home service cards are now links */
a.service-card{display:block;color:inherit}

/* =========================================================
   V27 — Hero: lighter overlay so the video shows, readable type
   ========================================================= */
.hero-shade{
  background:
    linear-gradient(90deg,rgba(18,25,41,.62) 0%,rgba(18,25,41,.38) 38%,rgba(18,25,41,.08) 68%,rgba(18,25,41,0) 100%),
    linear-gradient(180deg,rgba(18,25,41,.35) 0%,rgba(18,25,41,0) 22%,rgba(18,25,41,0) 55%,rgba(18,25,41,.55) 100%) !important;
}
.hero-grid{opacity:.35}
.hero-inner{justify-content:flex-end !important;padding-bottom:9vh !important}
.hero-title{max-width:980px;font-size:clamp(48px,5.6vw,96px) !important;line-height:1.02 !important;text-shadow:0 2px 30px rgba(18,25,41,.35)}
.hero-title em{color:#fff !important;opacity:.78}
.hero-eyebrow{color:rgba(255,255,255,.85) !important;text-shadow:0 1px 12px rgba(18,25,41,.5)}
.hero-eyebrow::before{content:"";display:inline-block;width:34px;height:1px;background:#c6a75e;vertical-align:middle;margin-right:14px}
.hero-bottom{margin-top:48px !important;border-top-color:rgba(255,255,255,.35) !important}
.hero-bottom p{color:rgba(255,255,255,.92) !important;text-shadow:0 1px 14px rgba(18,25,41,.55)}
.btn-ghost{background:rgba(18,25,41,.25);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-color:rgba(255,255,255,.55) !important}
@media(max-width:760px){
  .hero-shade{background:linear-gradient(180deg,rgba(18,25,41,.35),rgba(18,25,41,.15) 35%,rgba(18,25,41,.7) 100%) !important}
  .hero-title{font-size:11vw !important}
}

/* numbers strip keeps its own background on inner pages */
.page-about .numbers-final{background:#f7f2ea}

/* =========================================================
   V28 — matching footer icons
   ========================================================= */
.footer-contact-row{align-items:center}
.footer-contact-row.compact{margin-bottom:14px}
.footer-contact-icon{width:40px;height:40px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.04);color:#fff;font-size:0}
.footer-contact-icon svg{width:18px;height:18px}
.footer-contact-row:hover .footer-contact-icon{border-color:#c6a75e;color:#c6a75e}
.footer-contact-icon{transition:border-color .3s,color .3s}
.footer-social{gap:10px}
.footer-social a{width:40px;height:40px;font-size:0;color:#fff;border-color:rgba(255,255,255,.18)}
.footer-social a svg{width:18px;height:18px}
.footer-social a:hover{background:#c6a75e;border-color:#c6a75e;color:#121929}
.footer-ref-column a b{display:inline-grid;place-items:center;width:14px;font-size:18px !important}

/* =========================================================
   V30 — scrolling client logos + WhatsApp icon (all pages)
   ========================================================= */
.clients-showcase{padding:0;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}
.clients-marquee{overflow:hidden;position:relative;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.clients-track{display:flex;width:max-content;animation:clientsScroll 38s linear infinite}
.clients-marquee:hover .clients-track{animation-play-state:paused}
@keyframes clientsScroll{to{transform:translateX(-50%)}}
.cl-item{flex:none;width:300px;height:200px;display:grid;place-items:center;border-right:1px solid rgba(255,255,255,.08);transition:background .4s}
.cl-item:hover{background:rgba(255,255,255,.03)}
.cl-item .client-word,.cl-item .client-icon{color:rgba(255,255,255,.28);transition:color .4s}
.cl-item:hover .client-word,.cl-item:hover .client-icon{color:rgba(255,255,255,.75)}
.cl-item .client-word{font-size:clamp(28px,2.4vw,40px)}
.cl-item .client-icon{font-size:46px}
@media(max-width:760px){.cl-item{width:190px;height:130px}.cl-item .client-word{font-size:24px}.cl-item .client-icon{font-size:32px}.clients-track{animation-duration:26s}}
@media (prefers-reduced-motion:reduce){.clients-track{animation-duration:120s}}

.floating-whatsapp{background:#c6a75e !important;box-shadow:0 10px 26px rgba(198,167,94,.35) !important;transition:transform .35s var(--ease)}
.floating-whatsapp svg{width:30px;height:30px;display:block}
.floating-whatsapp:hover{transform:scale(1.08)}
.floating-chat-pill{box-shadow:0 8px 22px rgba(18,25,41,.14) !important}
@media(max-width:760px){.floating-whatsapp svg{width:26px;height:26px}}

/* =========================================================
   V37 — 3-colour palette (Navy #1F2A44 · Warm Beige #E8DCC8 · Soft Gold #C6A75E)
         14px labels · staircase process · dot bullets in footer
   ========================================================= */
:root{--blue:#1f2a44;--blue2:#161e31;--ink:#1f2a44;--paper:#f7f2ea;--beige:#e8dcc8;--gold:#c6a75e;--t-label:14px}
html,body,.page-about{background:#f7f2ea}
.page-about .section-light,.section-light{background:#f7f2ea}
.section-blue{background:#1f2a44}
.scroll-progress{background:#c6a75e}

/* labels: every eyebrow / small caps label at 14px */
.eyebrow,.hero-eyebrow,.about-stamp,.project-start-label,.page-banner .crumbs,
.service-card>span,.process-list span,.why-plus-no,.work-card b,.sv-card-no,.sv-num,.pf-cat,.pf-item-no,
.pr-overview li span,.pr-q-no,.tm-v-no,.tm-card-dep,.ct-label,.ct-field span,.pf-row-label,.ab-cta-label,
.footer-ref-column h3,.footer-ref-contact h3,.pf-vlabel,.pf-hint,.tm-hint,.pf-pillar-no,.pr-no-label{font-size:14px !important;letter-spacing:.14em !important}
.desktop-nav a,.desktop-nav .nav-drop>a{font-size:12px !important;letter-spacing:.14em !important}

/* buttons & accents in palette */
.btn-light{background:#e8dcc8 !important;color:#1f2a44 !important}
.btn-light:hover{background:#c6a75e !important;color:#1f2a44 !important}
.ab-btn{background:#1f2a44}
.ab-btn:hover{background:#c6a75e;color:#1f2a44}
.hero-title em,.cta-inner h2 span,.etude-cta .cta-inner h2 span{color:#e8dcc8 !important;opacity:.75}
.floating-whatsapp{background:#c6a75e !important;box-shadow:0 10px 26px rgba(198,167,94,.4) !important}
.floating-whatsapp svg path{fill:#1f2a44}
.floating-top{background:#e8dcc8 !important;color:#1f2a44 !important}
.floating-chat-pill{background:#fbf8f3 !important;color:#1f2a44 !important}
.footer.footer-reference{background:#121929 !important}
.section-deep,.clients-showcase{background:#161e31 !important}

/* footer: round dots instead of arrows */


/* ---------- Home: staircase process ---------- */
.stair-process{background:#161e31;color:#fff;padding:140px 0 150px;position:relative;overflow:hidden}
.stair-process::before{content:"";position:absolute;width:620px;height:620px;border:1px solid rgba(232,220,200,.08);border-radius:50%;left:-240px;bottom:-260px}
.stair-grid{display:grid;grid-template-columns:.75fr 1.5fr;gap:5vw;align-items:start;position:relative}
.stair-head{position:sticky;top:120px}
.stair-dots{display:flex;gap:6px;margin-bottom:26px}
.stair-dots i{width:10px;height:10px;border-radius:50%;background:#c6a75e}
.stair-dots i:nth-child(2){background:#e8dcc8}
.stair-dots i:nth-child(3){background:#c6a75e;opacity:.6}
.stair-dots i:nth-child(4){background:#e8dcc8;opacity:.6}
.stair-dots i:nth-child(5){background:#c6a75e;opacity:.35}
.stair-process .eyebrow{color:rgba(232,220,200,.7) !important}
.stair-process .stair-head h2{color:#fff;margin:0 0 20px !important;font-size:var(--t-h2) !important;font-weight:600 !important;letter-spacing:-.03em !important;line-height:1.05 !important}
.stair-process .stair-head>p:not(.eyebrow){color:rgba(232,220,200,.75) !important;max-width:340px;margin:0 0 34px !important}
.stair-list{display:flex;flex-direction:column;gap:22px}
.stair-step{display:flex;align-items:stretch;width:min(100%,540px);margin-left:calc(var(--i) * 9%)}
.stair-step.s1{--i:0}.stair-step.s2{--i:1}.stair-step.s3{--i:2}.stair-step.s4{--i:3}.stair-step.s5{--i:4}
.stair-no{position:relative;flex:none;width:92px;display:grid;place-items:center;margin:-10px 0;z-index:2;border-radius:6px 6px 0 6px;
  background:linear-gradient(160deg,#d8bf82,#c6a75e 55%,#a88c48);box-shadow:0 14px 28px rgba(0,0,0,.28)}
.stair-step.s2 .stair-no,.stair-step.s4 .stair-no{background:linear-gradient(160deg,#f3ebdd,#e8dcc8 55%,#cfbfa3)}
.stair-no::before{content:"";position:absolute;left:0;top:-10px;width:26px;height:10px;background:inherit;filter:brightness(.8);clip-path:polygon(0 100%,100% 0,100% 100%)}
.stair-no i{font-style:normal;font-size:36px;font-weight:700;letter-spacing:-.02em;color:#1f2a44}
.stair-step.s1 .stair-no i,.stair-step.s3 .stair-no i,.stair-step.s5 .stair-no i{color:#fff}
.stair-card{flex:1;padding:24px 30px 24px 26px;margin-left:-6px;background:linear-gradient(100deg,#fbf8f3 0%,#f1e8da 70%,#e8dcc8 100%);color:#1f2a44;box-shadow:0 18px 40px rgba(0,0,0,.25);transition:transform .5s var(--ease)}
.stair-step:hover .stair-card{transform:translateX(10px)}
.stair-process .stair-card h3{margin:0 0 6px;font-size:var(--t-h3) !important;font-weight:700 !important;color:#1f2a44}
.stair-process .stair-card p{margin:0;font-size:var(--t-small) !important;line-height:1.55 !important;color:#111111 !important}
@media (max-width:1100px){.stair-grid{grid-template-columns:1fr;gap:56px}.stair-head{position:static}.stair-step{margin-left:calc(var(--i) * 7%)}}
@media (max-width:760px){
  .stair-process{padding:90px 0}
  .stair-step{margin-left:calc(var(--i) * 4%);width:auto}
  .stair-no{width:68px}.stair-no i{font-size:26px}
  .stair-card{padding:18px 18px 18px 20px}
}


/* =========================================================
   V38 — gold numbers strip, round link buttons, gold card hover,
         gold "Selected Projects" band, footer arrows back
   ========================================================= */
/* numbers strip */
.numbers-final,.page-about .numbers-final,.numbers-final .numbers-video{background:#c6a75e !important;border-color:rgba(31,42,68,.15) !important}
.numbers-final .numbers-video-item{border-right-color:rgba(31,42,68,.18) !important;border-bottom-color:rgba(31,42,68,.18) !important}
.numbers-final .numbers-video-item:hover{background:#cfb370 !important}
.numbers-final .numbers-video-item strong{color:rgba(31,42,68,.22) !important}
.numbers-final .numbers-video-item:hover strong{color:rgba(31,42,68,.32) !important}
.numbers-final .numbers-video-item span{color:#fff !important;text-shadow:0 1px 12px rgba(31,42,68,.18)}

/* text links with a round arrow button */
.text-link{display:inline-flex !important;align-items:center;gap:16px !important;border-bottom:0 !important;padding-bottom:0 !important;font-weight:600 !important;color:#1f2a44}
.text-link span{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(31,42,68,.35);font-size:16px;transition:background .35s,color .35s,border-color .35s,transform .45s var(--ease)}
.text-link:hover span{background:#c6a75e;border-color:#c6a75e;color:#121929;transform:rotate(45deg)}

/* home service cards: gold hover with dark text */
.service-card{transition:background .35s var(--ease)}
.service-card:hover{background:#c6a75e !important}
.service-card:hover h3,.service-card:hover p,.service-card:hover>span,.service-card:hover b{color:#121929 !important;opacity:1}

/* Selected Projects band */
.work-marquee{background:#c6a75e;border-bottom:0 !important}
.work-marquee .mq-track span{color:#1f2a44 !important;opacity:1 !important}
.work-marquee .mq-track .mq-star{color:#1f2a44 !important;opacity:.85}

/* footer arrows (as before) */
.footer-ref-column a b{color:#ffffff !important;font-size:22px !important;line-height:1;font-weight:400}
.footer-ref-column a:hover b{color:#c6a75e !important}

/* =========================================================
   V39 — text links as real buttons, gold ICON MULTIMEDIA band, gold footer arrows
   ========================================================= */
.text-link{display:inline-flex !important;align-items:center;gap:18px !important;padding:8px 8px 8px 28px !important;border-radius:999px;background:#1f2a44;color:#f7f2ea !important;font-size:14px !important;font-weight:600 !important;letter-spacing:.02em;border:0 !important;transition:background .35s,color .35s,transform .35s var(--ease)}
.text-link span{width:44px;height:44px;border:0 !important;background:#c6a75e;color:#121929 !important;font-size:16px}
.text-link:hover{background:#c6a75e;color:#121929 !important;transform:translateY(-3px)}
.text-link:hover span{background:#1f2a44;color:#f7f2ea !important;transform:rotate(45deg)}

.giant-word{background:#c6a75e;border-top:0 !important;border-bottom:0 !important}
.giant-word .mq-track span{color:#1f2a44 !important;opacity:1 !important}
.giant-word .mq-track .mq-star{color:#1f2a44 !important;opacity:.85 !important}

.footer-ref-column a b,.footer-ref-column a:hover b{color:#c6a75e !important}

/* =========================================================
   V41 — every scrolling band uses the home style (gold + navy)
   ========================================================= */
.ab-band{background:#c6a75e !important}
.ab-band .mq-track span{color:#1f2a44 !important;opacity:1 !important}
.ab-band .mq-track .mq-star{color:#1f2a44 !important;opacity:.85 !important}
.ab-band-team .mq-track .mq-alt{color:transparent !important;-webkit-text-stroke:1.5px #1f2a44}
/* staircase head on inner pages keeps its light text */
.page-about .stair-process .stair-head h2{color:#fff !important}
.page-about .stair-process .eyebrow{color:rgba(232,220,200,.7) !important;opacity:1}

/* =========================================================
   V42 — one button system, services-style boxes for "Why", even type
   ========================================================= */
/* all buttons = home pill buttons */
.btn{display:inline-flex !important;align-items:center;justify-content:space-between;gap:22px;padding:16px 22px !important;border-radius:999px !important;min-width:176px;font-size:13px !important;font-weight:500 !important;letter-spacing:.01em !important;text-transform:none !important;line-height:1.2;border:1px solid transparent;cursor:pointer;transition:transform .28s var(--ease),background .28s,color .28s,border-color .28s}
.btn span{font-size:14px}
.btn:hover{transform:translateY(-3px)}
.btn-dark{background:#1f2a44 !important;color:#f7f2ea !important}
.btn-dark:hover{background:#c6a75e !important;color:#121929 !important}
.btn-outline{background:transparent !important;color:#1f2a44 !important;border-color:rgba(31,42,68,.45) !important}
.btn-outline:hover{background:#1f2a44 !important;color:#f7f2ea !important;border-color:#1f2a44 !important}
.btn-light{border-color:transparent !important}
.btn-ghost{color:#fff !important;border-color:rgba(232,220,200,.45) !important}
.btn-ghost:hover{background:rgba(232,220,200,.12) !important}
.ct-submit{justify-self:start;font-family:inherit}
.ct-form .btn-dark{background:#e8dcc8 !important;color:#1f2a44 !important}
.ct-form .btn-dark:hover{background:#c6a75e !important;color:#121929 !important}
.ab-card .btn,.sv-hero-actions .btn,.sv-work-text .btn,.pf-list-head .btn{margin-top:0}
.ab-card .btn{margin-inline:auto}
.sv-hero-actions,.ab-cta-actions{display:flex;flex-wrap:wrap;gap:12px}
@media (max-width:760px){.sv-hero-actions .btn{width:auto !important}}

/* "Why" points as navy service-style boxes */
.ab-why-grid{gap:0 !important;border-top:1px solid rgba(232,220,200,.18) !important;border-left:1px solid rgba(232,220,200,.18);padding-top:0 !important;background:#1f2a44;margin-top:70px !important}
.ab-why-grid article{position:relative;min-height:260px;padding:30px 28px 60px;border-right:1px solid rgba(232,220,200,.18);border-bottom:1px solid rgba(232,220,200,.18);transition:background .35s var(--ease)}
.ab-why-grid article span{color:rgba(232,220,200,.55) !important;margin-bottom:44px !important}
.page-about main .ab-why-grid h3{color:#fff !important;margin:0 0 14px !important}
.page-about main .ab-why-grid p{color:rgba(232,220,200,.75) !important;font-size:13px !important}
.ab-why-grid b{position:absolute;right:26px;bottom:22px;font-weight:400;font-size:18px;color:rgba(232,220,200,.6);transition:transform .3s,color .3s}
.ab-why-grid article:hover{background:#c6a75e}
.ab-why-grid article:hover span,.page-about main .ab-why-grid article:hover h3,.page-about main .ab-why-grid article:hover p,.ab-why-grid article:hover b{color:#121929 !important}
.ab-why-grid article:hover b{transform:translate(3px,-3px)}
@media (max-width:1000px){.ab-why-grid{grid-template-columns:1fr 1fr !important}}
@media (max-width:760px){.ab-why-grid{grid-template-columns:1fr !important}.ab-why-grid article{min-height:200px}}

/* same type everywhere: card titles, card text, body text */
main h3,.why-plus-title,.pf-item-t b,.tm-card h3{font-size:var(--t-h3) !important;font-weight:600 !important;letter-spacing:-.01em !important;line-height:1.2 !important}
.service-card p,.ab-what-items p,.ab-why-grid p,.sv-card p,.sv-why-grid p,.pf-info p,.pf-item-t small,.tm-card p,.stair-card p,.pr-step p,.ct-card small,.sv-what .ab-what-items p{font-size:13px !important;line-height:1.6 !important}
main p{font-family:"Montserrat",system-ui,sans-serif !important}

/* =========================================================
   V43 — ONE button design for the whole site
   pill + label + round gold arrow circle
   ========================================================= */
.btn,.text-link,.sv-card-link,.pf-more,.pf-item-link,.ct-wa{
  display:inline-flex !important;align-items:center;justify-content:space-between;gap:16px !important;
  min-width:0 !important;padding:7px 7px 7px 24px !important;border-radius:999px !important;
  font-family:"Montserrat",system-ui,sans-serif !important;font-size:14px !important;font-weight:600 !important;letter-spacing:.01em !important;text-transform:none !important;line-height:1.2 !important;
  border:1px solid transparent !important;background:#1f2a44 !important;color:#f7f2ea !important;
  cursor:pointer;text-decoration:none;transition:background .3s,color .3s,border-color .3s,transform .3s var(--ease) !important}
.btn>span,.text-link>span,.sv-card-link>b,.pf-more>b,.pf-item-link>b,.ct-wa>b{
  flex:none;width:40px !important;height:40px !important;border-radius:50% !important;display:grid !important;place-items:center;
  background:#c6a75e !important;color:#121929 !important;border:0 !important;font-size:15px !important;font-weight:400 !important;line-height:1 !important;
  transform:none;transition:transform .45s var(--ease),background .3s,color .3s !important}
.btn:hover,.text-link:hover,.sv-card:hover .sv-card-link,.pf-more:hover,.pf-item-link:hover,.ct-wa:hover{background:#c6a75e !important;color:#121929 !important;transform:translateY(-3px)}
.btn:hover>span,.text-link:hover>span,.sv-card:hover .sv-card-link>b,.pf-more:hover>b,.pf-item-link:hover>b,.ct-wa:hover>b{background:#1f2a44 !important;color:#f7f2ea !important;transform:rotate(45deg) !important}

/* on dark backgrounds: beige pill */
.btn-light,.hero .btn,.etude-cta .btn,.stair-process .btn,.services .btn,.ct-form .btn,.sv-why .btn{background:#e8dcc8 !important;color:#1f2a44 !important}
/* outline variants (second button) */
.btn-ghost,.btn-outline{background:transparent !important}
.btn-ghost{color:#f7f2ea !important;border-color:rgba(232,220,200,.5) !important}
.btn-outline{color:#1f2a44 !important;border-color:rgba(31,42,68,.45) !important}
.btn-light:hover,.hero .btn:hover,.etude-cta .btn:hover,.stair-process .btn:hover,.services .btn:hover,.ct-form .btn:hover,.btn-ghost:hover,.btn-outline:hover{background:#c6a75e !important;color:#121929 !important;border-color:#c6a75e !important}

/* spacing where these sit */
.sv-card-link{margin-top:16px}
.pf-item-link{margin-top:20px}
.pf-more{margin-top:4px}
.ct-wa{margin-top:26px}
.sv-card-link,.pf-more,.pf-item-link,.ct-wa{border-bottom:1px solid transparent !important}
.cta-actions a.btn,.hero-actions a.btn,.cta-actions .btn,.hero-actions .btn,a.btn,button.btn{font-size:14px !important;font-weight:600 !important;letter-spacing:.01em !important}

/* =========================================================
   V44 — same hover on every box grid (like home "Our Services")
   ========================================================= */
.sv-what .ab-what-items>article,.sv-why-grid article,.pr-q-cards article,.pf-pillars article,.tm-values article{position:relative;transition:background .35s var(--ease),color .35s !important}
.box-arr{position:absolute;right:24px;bottom:20px;font-weight:400;font-size:18px;line-height:1;transition:transform .3s var(--ease),color .3s}
.sv-what .box-arr{color:rgba(31,42,68,.45)}
.sv-why-grid .box-arr{color:rgba(232,220,200,.6)}
.sv-what .ab-what-items>article{padding-bottom:56px !important}
.sv-why-grid article{padding-bottom:58px !important}

/* gold hover + dark text */
.sv-what .ab-what-items>article:hover,.sv-why-grid article:hover,.pr-q-cards article:hover,.pf-pillars article:hover,.tm-values article:hover{background:#c6a75e !important;box-shadow:none !important;transform:none !important}
.sv-what .ab-what-items>article:hover *,.sv-why-grid article:hover *,.pr-q-cards article:hover *,.pf-pillars article:hover *,.tm-values article:hover *{color:#121929 !important}
.page-services main .sv-what .ab-what-items>article:hover h3,.page-services main .sv-what .ab-what-items>article:hover p,
.page-services main .sv-why-grid article:hover h3,.page-services main .sv-why-grid article:hover p,
.page-process main .pr-q-cards article:hover h3,.page-portfolio main .pf-pillars article:hover h3,.page-team main .tm-values article:hover h3{color:#121929 !important}
.sv-what .ab-what-items>article:hover .box-arr,.sv-why-grid article:hover .box-arr{transform:translate(3px,-3px)}
.sv-what .ab-what-items>article:hover .sv-num,.sv-why-grid article:hover span{color:#1f2a44 !important}
/* "Tell us your requirement" tile: gold on hover too */
.sv-what-cta:hover{background:#c6a75e !important}
.sv-what-cta:hover *{color:#121929 !important}

/* V46 — no custom cursor circle; normal mouse pointer everywhere */
.cursor{display:none !important}
.work-card,.work-card *{cursor:pointer !important}
a,button,[role=tab],.pf-panel,.tm-tab,.ct-map-tab,.why-plus-question,.pf-item-q{cursor:pointer}
/* V48 footer social: 3 icons */
.footer-social a:hover svg{color:#121929}

/* =========================================================
   V49 — Client feedback (reviews) in the site palette
   ========================================================= */
.reviews{padding:130px 0;background:#f7f2ea !important;overflow:hidden}
.rv-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:50px}
.reviews .rv-head h2{margin:0 !important;color:#1f2a44;font-size:var(--t-h2) !important;font-weight:600 !important;letter-spacing:-.03em !important;line-height:1.05 !important}
.reviews .eyebrow{color:#1f2a44 !important;opacity:.8}
.rv-nav{display:flex;gap:10px}
.rv-arrow{width:52px;height:52px;border-radius:50%;border:1px solid rgba(31,42,68,.3);background:transparent;color:#1f2a44;font-size:18px;cursor:pointer;transition:background .3s,color .3s,border-color .3s,opacity .3s}
.rv-arrow:hover{background:#c6a75e;border-color:#c6a75e;color:#121929}
.rv-arrow:disabled{opacity:.3;pointer-events:none}
.reviews.is-static .rv-nav,.reviews.is-static .rv-dots{display:none}
.rv-viewport{overflow:hidden;margin:-20px;padding:20px}
.rv-track{display:flex;gap:30px;transition:transform .8s cubic-bezier(.16,1,.3,1);will-change:transform}
.rv-card{flex:0 0 calc((100% - 30px)/2);background:#fbf8f3;border:1px solid rgba(31,42,68,.08);border-radius:14px;padding:42px 48px 36px;box-shadow:0 18px 40px rgba(31,42,68,.08);display:flex;flex-direction:column;transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.rv-card:hover{transform:translateY(-6px);box-shadow:0 28px 54px rgba(31,42,68,.14)}
.rv-stars{display:flex;gap:6px;margin-bottom:22px}
.rv-stars svg{width:22px;height:22px;fill:#c6a75e}
.reviews .rv-text{flex:1;margin:0 0 28px !important;font-size:17px !important;line-height:1.7 !important;font-weight:500 !important;color:#1f2a44 !important}
.rv-person{display:flex;align-items:center;gap:18px;padding-top:26px;border-top:1px solid rgba(31,42,68,.12)}
.rv-quote{width:54px;height:54px;flex:none;border-radius:8px;background:rgba(198,167,94,.18);display:grid;place-items:center}
.rv-quote svg{width:22px;height:22px;fill:#c6a75e}
.rv-person strong{display:block;font-size:17px;font-weight:700;color:#1f2a44;margin-bottom:4px}
.rv-person small{display:block;font-size:14px;color:#111111}
.rv-dots{display:flex;justify-content:center;gap:14px;margin-top:46px}
.rv-dots button{width:14px;height:14px;padding:0;border-radius:50%;border:2px solid #1f2a44;background:transparent;cursor:pointer;transition:background .3s,transform .3s}
.rv-dots button.is-on{background:#1f2a44;transform:scale(1.15)}
.rv-dots button:hover{background:#c6a75e;border-color:#c6a75e}
@media (max-width:900px){.rv-card{flex-basis:100%}}
@media (max-width:760px){
  .reviews{padding:80px 0}
  .rv-head{flex-direction:column;align-items:flex-start;margin-bottom:32px}
  .rv-card{padding:30px 24px 26px}
  .reviews .rv-text{font-size:15px !important}
}

/* =========================================================
   V50 — reviews scroll continuously
   ========================================================= */
.reviews.is-marquee .rv-nav,.reviews.is-marquee .rv-dots{display:none !important}
.reviews.is-marquee .rv-viewport{margin:-20px 0;padding:20px 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)}
.reviews.is-marquee .rv-track{width:max-content;transition:none;animation:rvScroll var(--rv-dur,40s) linear infinite}
.reviews.is-marquee .rv-viewport:hover .rv-track{animation-play-state:paused}
.reviews.is-marquee .rv-card{flex:0 0 clamp(300px,40vw,580px)}
@keyframes rvScroll{to{transform:translateX(calc(-50% - 15px))}}
@media (max-width:760px){.reviews.is-marquee .rv-card{flex-basis:84vw}}
@media (prefers-reduced-motion:reduce){.reviews.is-marquee .rv-track{animation-duration:200s}}

/* =========================================================
   V51 — reviews: full-width strip, even cards, cleaner head
   ========================================================= */
.reviews{padding:130px 0 120px !important;position:relative}
.reviews .rv-head{display:grid !important;grid-template-columns:1fr auto;align-items:end;gap:40px;margin-bottom:46px !important}
.reviews .rv-head h2{margin:0 !important}
.reviews .rv-intro{margin:0 !important;max-width:360px;color:#111111 !important;font-size:15px !important;line-height:1.7 !important;padding-left:22px;border-left:3px solid #c6a75e}
.reviews.is-marquee .rv-viewport{width:100%;margin:0 !important;padding:26px 0 44px !important;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%)}
.reviews.is-marquee .rv-track{gap:28px;align-items:stretch;padding-left:28px}
@keyframes rvScroll{to{transform:translateX(calc(-50% - 14px))}}
.reviews.is-marquee .rv-card{flex:0 0 520px !important;min-height:330px;position:relative;border-radius:16px;padding:40px 42px 32px;background:#fbf8f3;border:1px solid rgba(31,42,68,.08);box-shadow:0 14px 34px rgba(31,42,68,.08)}
.reviews.is-marquee .rv-card:hover{transform:translateY(-6px);box-shadow:0 24px 48px rgba(31,42,68,.14);border-color:rgba(198,167,94,.5)}
.rv-card::after{content:"\201D";position:absolute;right:30px;top:14px;font-size:120px;line-height:1;font-weight:700;color:rgba(198,167,94,.18);font-family:Georgia,serif;pointer-events:none}
.reviews .rv-text{font-size:16px !important;line-height:1.75 !important}
.rv-person strong{font-size:16px}
@media (max-width:900px){.reviews .rv-head{grid-template-columns:1fr;gap:18px}}
@media (max-width:760px){
  .reviews{padding:80px 0 70px !important}
  .reviews.is-marquee .rv-card{flex-basis:82vw !important;min-height:0;padding:28px 24px 24px}
  .rv-card::after{font-size:90px;right:18px}
  .reviews.is-marquee .rv-track{padding-left:16px;gap:16px}
  @keyframes rvScroll{to{transform:translateX(calc(-50% - 8px))}}
}

/* =========================================================
   V54 — black paragraph text, white text in gold bands, more space in staircase
   ========================================================= */
/* paragraphs on light backgrounds */
.section-light p:not(.eyebrow):not(.crumbs),.reviews p:not(.eyebrow){color:#111111}
.reviews .rv-text{color:#111111 !important}
.rv-person small{color:#111111}
.page-about main .ab-intro-text p,.page-about main .ab-split-text p,.page-about main .ab-what-lead>p,.page-about main .ab-cta-text p{color:#111111 !important}

/* gold scrolling bands: white text */
.giant-word .mq-track span,.work-marquee .mq-track span,.ab-band .mq-track span{color:#ffffff !important}
.ab-band-team .mq-track .mq-alt{color:transparent !important;-webkit-text-stroke:1.5px #ffffff !important}

/* staircase: more room between steps */
.stair-list{gap:44px !important}
@media (max-width:760px){.stair-list{gap:34px !important}}
.page-portfolio main .pf-purpose .pf-purpose-big,.page-team main .tm-vision-big{color:#111111 !important}
.page-services main .sv-card .sv-card-tag{color:#111111 !important}


/* =========================================================
   V55 — light text on every dark section, straightening arrows on hover
   ========================================================= */
.section-blue p:not(.eyebrow),.section-deep p:not(.eyebrow),.services p:not(.eyebrow),.etude-cta p:not(.eyebrow),
.sv-why p:not(.eyebrow),.ct-form-wrap p:not(.eyebrow),.pr-quality.section-blue p:not(.eyebrow){color:rgba(255,255,255,.82) !important}
.service-card p{color:rgba(255,255,255,.75) !important}
.service-card:hover p,.service-card:hover h3,.service-card:hover>span,.service-card:hover b{color:#121929 !important}
.ct-form .ct-note{color:rgba(255,255,255,.6) !important}
.ct-form .ct-status{color:#fff !important}

/* every ↗ arrow turns straight (→) on hover */
.service-card b,.box-arr,.ab-why-grid b,.sv-more-links a b,.pf-row-link,.process-list b,.pf-skills li i,.ab-cta-circle,.work-card b{display:inline-block;transition:transform .45s var(--ease),color .3s !important}
.service-card:hover b,.sv-what .ab-what-items>article:hover .box-arr,.sv-why-grid article:hover .box-arr,.ab-why-grid article:hover b,
.sv-more-links a:hover b,.pf-item:hover .pf-row-link,.pf-row:hover .pf-row-link,.ab-cta-circle:hover{transform:rotate(45deg) !important}

/* V56: text on navy fully white */
html body .services .service-card p,html body .service-card p,html body .etude-cta p:not(.eyebrow),html body .etude-cta .cta-bottom>p,
html body .section-blue p:not(.eyebrow),html body .section-deep p:not(.eyebrow),html body .services p:not(.eyebrow),
html body .sv-why p:not(.eyebrow),html body .ct-form-wrap p:not(.eyebrow){color:#ffffff !important;opacity:1}
html body .services .service-card:hover p,html body .services .service-card:hover h3{color:#121929 !important}

/* V57 — home hero without heading text */
.sr-only{position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
#home .hero-bottom{margin-top:0 !important}

/* V58 — new logo hero video: show the full logo on phones */
@media (max-width:760px){
  #home.hero.on-s1{background:#eef0f3}
  #home .hero-slide-1 .hero-video{object-fit:contain !important;object-position:center 22% !important;background:#eef0f3}
}

/* V59 — CTA heading: every word the same solid white (split-word spans were inheriting the faded accent colour) */
html body .cta-inner h2,html body .etude-cta .cta-inner h2,
html body .cta-inner h2 span,html body .etude-cta .cta-inner h2 span,
html body .etude-cta .cta-inner h2 .split-word,html body .etude-cta .cta-inner h2 i{color:#ffffff !important;opacity:1 !important;-webkit-text-fill-color:#ffffff}

/* V60 — Interior Design: wide cards for the extra service */
.service-card-wide{grid-column:1/-1;min-height:220px !important}
.service-card-wide h3{max-width:none !important}
.service-card-wide p{max-width:560px !important}
.sv-card-wide{grid-column:1/-1;display:grid !important;grid-template-columns:1.2fr 1fr;gap:48px;align-items:center}
.sv-card-wide figure{margin:0}
@media (max-width:1000px){.sv-card-wide{grid-template-columns:1fr;gap:0}}

/* V63 — home: HR section below About */
.hr-spot{padding:120px 0 130px;background:#fff}
.hr-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:7vw;align-items:center}
.hr-photo-wrap{position:relative;max-width:480px;width:100%;justify-self:center}
.hr-photo-wrap::before{content:"";position:absolute;inset:26px -26px -26px 26px;border:2px solid #C6A75E;z-index:0;pointer-events:none}
.hr-photo{position:relative;z-index:1;margin:0;aspect-ratio:4/5;width:100%;overflow:hidden}
.hr-photo img{position:relative;z-index:1;width:100%;height:100%;object-fit:cover;display:block}
.hr-copy h2{margin:0 0 30px}
.hr-copy h2,.hr-copy h2 .split-word,.hr-copy h2 i{color:#1F2A44 !important}
.hr-copy h2>span:not(.split-word),.hr-copy h2>span:not(.split-word) .split-word,.hr-copy h2>span:not(.split-word) i{color:#C6A75E !important}
.hr-copy .body-copy p{color:#111111;max-width:560px}
.hr-person{margin:34px 0 36px;padding:18px 0 18px 22px;border-left:3px solid #C6A75E}
.hr-person strong{display:block;font-size:22px;font-weight:600;color:#1F2A44;letter-spacing:-.01em}
.hr-person span{display:block;margin-top:6px;font-size:13px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:#1F2A44;opacity:.75}
.hr-actions{display:flex;flex-wrap:wrap;gap:12px}
@media (max-width:900px){
  .hr-spot{padding:80px 0 90px}
  .hr-grid{grid-template-columns:1fr;gap:70px}
  .hr-photo-wrap{max-width:380px;justify-self:start}
}
@media (max-width:760px){.hr-photo-wrap{max-width:calc(100% - 26px)}.hr-person span{letter-spacing:.06em;white-space:normal}}

/* V72 — hero slider (3 videos) */
.hero-slides{position:absolute;inset:0;overflow:hidden}
.hero-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity 1.1s ease,visibility 0s linear 1.1s}
.hero-slide.is-active{opacity:1;visibility:visible;transition:opacity 1.1s ease,visibility 0s}
.hero-slide .hero-video{transform-origin:center}
.hero-nav{position:relative;z-index:3;display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;gap:22px;align-items:start;margin-bottom:26px}
.hero-dot{background:none;border:0;padding:0;text-align:left;color:#fff;cursor:pointer;font:inherit}
.hero-dot i{display:block;height:2px;background:rgba(255,255,255,.3);overflow:hidden;margin-bottom:12px}
.hero-dot i b{display:block;height:100%;background:#C6A75E;transform:scaleX(0);transform-origin:left center}
.hero-dot span{display:block;font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;opacity:.65;transition:opacity .3s}
.hero-dot span em{font-style:normal;color:#C6A75E;margin-right:8px}
.hero-dot.is-active span,.hero-dot:hover span{opacity:1}
.hero-arrows{display:flex;gap:10px}
.hero-arrow{width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.45);background:transparent;color:#fff;font-size:18px;cursor:pointer;transition:background .25s,border-color .25s,color .25s}
.hero-arrow:hover{background:#C6A75E;border-color:#C6A75E;color:#121929}
@media (max-width:760px){
  .hero-nav{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:22px}
  .hero-dot span{font-size:10px;letter-spacing:.08em}
  .hero-dot span em{display:block;margin:0 0 3px}
  .hero-arrows{display:none}
  #home .hero-slide-product{background:#10151f}
  #home .hero-slide-product .hero-video{object-fit:contain !important;object-position:center 26% !important}
  #home.hero.on-s1 .hero-dot{color:#1F2A44}
  #home.hero.on-s1 .hero-dot i{background:rgba(31,42,68,.25)}
}

/* V73 — hero: text lower, single straight line, three centred dots */
#home .hero-inner{padding-bottom:30px !important}
#home .hero-bottom{border-top:1px solid rgba(255,255,255,.35) !important}
.hero-dots{position:relative;z-index:3;display:flex;justify-content:center;align-items:center;gap:12px;margin-top:34px}
.hero-dots .hero-dot{width:10px;height:10px;padding:0;border:0;border-radius:999px;background:rgba(255,255,255,.45);overflow:hidden;cursor:pointer;transition:width .45s cubic-bezier(.2,.7,.2,1),background .3s}
.hero-dots .hero-dot b{display:block;height:100%;background:#C6A75E;transform:scaleX(0);transform-origin:left center}
.hero-dots .hero-dot.is-active{width:46px;background:rgba(255,255,255,.35)}
.hero-dots .hero-dot:hover{background:rgba(255,255,255,.75)}
@media (max-width:760px){
  .hero-dots{margin-top:26px}
  #home.hero.on-s1 .hero-dots .hero-dot{background:rgba(31,42,68,.3)}
}
/* V73 — CTA with three video panels */
.cta-reels{min-height:760px}
.cta-panels{position:absolute;top:0;right:0;bottom:0;width:38%;display:flex;gap:3px;z-index:1;background:#121929}
.cta-panel{flex:1;position:relative;overflow:hidden;transition:flex .6s cubic-bezier(.2,.7,.2,1)}
.cta-panel video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.cta-panel::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,25,41,.1),rgba(18,25,41,.35));transition:opacity .4s}
.cta-panels:hover .cta-panel{flex:.8}.cta-panels .cta-panel:hover{flex:1.6}
.cta-panel:hover::after{opacity:0}
.cta-reels .cta-inner{position:relative;z-index:2}
.cta-reels .cta-inner>*{max-width:calc(62vw - var(--gutter,60px))}
.cta-reels .cta-bottom{grid-template-columns:1fr !important;gap:28px !important;max-width:min(560px,calc(62vw - 120px)) !important}
.cta-reels .cta-actions{justify-content:flex-start !important}
.cta-reels .cta-orbit{right:auto;left:30%}
@media (max-width:900px){
  .cta-reels{display:flex;flex-direction:column;min-height:0}
  .cta-panels{position:relative;width:100%;height:380px;order:2}
  .cta-reels .cta-inner{padding-top:90px;padding-bottom:60px}
  .cta-reels .cta-inner>*,.cta-reels .cta-bottom{max-width:none !important}
}

/* V74 — tighter gap between the Why section and Client Feedback */
#why.why-plus{padding-bottom:45px !important}
#why + .reviews{padding-top:55px !important}
@media (max-width:760px){#why.why-plus{padding-bottom:30px !important}#why + .reviews{padding-top:40px !important}}

/* V76 — CTA text lines up with the header logo; wider video panels */
.cta-panels{width:46%}
.cta-reels .cta-inner{width:54% !important;max-width:none !important;margin:0 !important;padding-left:4.8vw !important;padding-right:4vw !important;box-sizing:border-box}
.cta-reels .cta-inner>*{max-width:none !important}
.cta-reels .cta-bottom{max-width:560px !important}
.cta-reels .cta-inner h2{font-size:clamp(52px,6vw,118px) !important}
@media (max-width:900px){
  .cta-panels{width:100%;height:440px}
  .cta-reels .cta-inner{width:100% !important;padding-left:20px !important;padding-right:20px !important}
  .cta-reels .cta-bottom{max-width:none !important}
}

/* V78 — Selected Projects: cards 1 and 5 match the height of card 3 */
.work-card-small{margin-top:34px !important}
.work-card-small figure{height:380px !important}
@media (max-width:760px){.work-card-small figure{height:300px !important}}

/* V79 — project images: full width, no edge gaps */
.work-card img{width:100%;display:block}
.work-card img[data-static]{transform:none !important}
.work-card:hover img[data-static]{transform:scale(1.03) !important}

/* V82 — About images shown in full (frame matches image shape, no parallax crop) */
figure[data-fit]{height:auto !important}
figure[data-fit] img{position:static !important;top:0 !important;width:100% !important;height:100% !important;object-fit:cover;display:block}
figure.ab-fit-land{aspect-ratio:3/2 !important}
figure.ab-fit-port{aspect-ratio:3/4 !important}
figure[data-fit]:hover img{transform:none}
.ab-img-small.ab-fit-land{width:100% !important;margin-top:50px}
.about-image-b.ab-fit-port{width:72% !important}
@media (max-width:760px){.about-image-b.ab-fit-port{width:60% !important}.ab-img-small.ab-fit-land{width:85% !important}}

/* V86/87 — About intro: DIXON-i box + Bio+ reel */
.ab-intro-feat{grid-column:1/-1;grid-row:4;display:grid;grid-template-columns:1.35fr 1fr;gap:40px;align-items:stretch;margin-top:80px}
.ab-feat-card{margin:0;display:flex;flex-direction:column}
.ab-feat-media,.ab-feat-video .ab-feat-phone-wrap{flex:1}
.ab-feat-box .ab-feat-media{background:#fff;border:1px solid rgba(31,42,68,.1);display:flex;align-items:center;justify-content:center;overflow:hidden;aspect-ratio:1/1}
.ab-feat-box .ab-feat-media img{width:100%;height:100%;object-fit:contain;display:block;transition:transform .8s var(--ease)}
.ab-feat-box:hover .ab-feat-media img{transform:scale(1.03)}
.ab-feat-video{background:#1F2A44;align-items:center;justify-content:center;padding:40px 20px 0}
.ab-feat-phone{position:relative;width:min(100%,330px);aspect-ratio:9/16;border-radius:28px;overflow:hidden;border:6px solid #121929;box-shadow:0 30px 60px rgba(0,0,0,.35);background:#000}
.ab-feat-phone video{width:100%;height:100%;object-fit:cover;display:block}
.ab-feat-sound{position:absolute;right:12px;bottom:12px;width:42px;height:42px;border-radius:50%;border:0;background:rgba(18,25,41,.7);color:#fff;display:grid;place-items:center;cursor:pointer;transition:background .25s,color .25s}
.ab-feat-sound svg{width:20px;height:20px}.ab-feat-sound .snd-on{display:none}
.ab-feat-sound.is-on .snd-on{display:inline}.ab-feat-sound.is-on .snd-off{display:none}
.ab-feat-sound:hover,.ab-feat-sound.is-on{background:#C6A75E;color:#121929}
.ab-feat-card figcaption{display:flex;justify-content:space-between;gap:16px;padding:16px 0 0;font-size:13px;color:#111}
.ab-feat-card figcaption b{font-weight:600;letter-spacing:.14em;text-transform:uppercase;font-size:11px;color:#C6A75E}
.ab-feat-video figcaption{width:100%;color:#fff;padding:20px 0 22px;margin-top:auto}
@media (max-width:900px){.ab-intro-feat{grid-template-columns:1fr;margin-top:50px;order:5}}

/* V87 — home About: Bio+ machine video in place of the stationery image */
figure.ab-fit-video{aspect-ratio:16/9 !important;height:auto !important;background:#d9d6d0}
figure.ab-fit-video video{width:100%;height:100%;object-fit:cover;display:block}

/* V90 — About intro: Bio+ reel (big) + DIXON-i box (small), shown in full */
figure.ab-fit-reel{aspect-ratio:9/16 !important;position:relative;background:#000;max-width:460px;justify-self:start;width:100%}
figure.ab-fit-reel video{width:100%;height:100%;object-fit:cover;display:block}
figure.ab-fit-reel .ab-feat-sound{z-index:3}
figure.ab-fit-square{aspect-ratio:1/1 !important;background:#fff !important;border:1px solid rgba(31,42,68,.1)}
figure.ab-fit-square img{object-fit:contain !important}
.ab-img-small.ab-fit-square{width:100% !important;margin-top:50px}

/* V95 — About intro: Kothiya pouch slider (big) + Bio+ film (small) */
figure.ab-fit-pouch{aspect-ratio:4/5 !important;position:relative;overflow:hidden;background:radial-gradient(ellipse 70% 60% at 50% 45%,#f6efe2 0%,#e8dcc8 70%,#dccdb2 100%) !important}
.kp-stage{position:absolute;inset:0}
figure.ab-fit-pouch .kp-stage img.kp-slide{padding:6% 8% 4%;box-sizing:border-box;position:absolute !important;inset:0;top:0 !important;left:0;width:100% !important;height:100% !important;object-fit:contain;transform:translateY(105%);transition:none;will-change:transform}
figure.ab-fit-pouch .kp-stage img.kp-slide.is-active{transform:translateY(0);transition:transform 1.1s cubic-bezier(.7,0,.2,1)}
figure.ab-fit-pouch .kp-stage img.kp-slide.is-prev{transform:translateY(-105%);transition:transform 1.1s cubic-bezier(.7,0,.2,1)}
.kp-dots{position:absolute;right:18px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:8px;z-index:2}
.kp-dots i{width:6px;height:6px;border-radius:50%;background:rgba(31,42,68,.25);transition:height .4s,background .4s}
.kp-dots i.on{height:22px;border-radius:4px;background:#C6A75E}
.ab-img-small.ab-fit-video{width:100% !important;margin-top:50px}
@media (max-width:760px){
  figure.ab-img.ab-fit-pouch{height:auto !important;aspect-ratio:4/5 !important;width:100% !important;margin-top:30px !important}
  figure.ab-img-small.ab-fit-video{width:100% !important;margin:16px 0 0 !important;align-self:stretch !important;border:0 !important}
}

/* V129: footer office addresses open Google Maps */
.footer-contact-row p a{color:inherit;text-decoration:none}
.footer-contact-row p a:hover{color:#C6A75E}

/* V130: compact closing CTA band */
.cta:not(.cta-reels){min-height:0 !important;padding-top:96px !important;padding-bottom:96px !important}
.cta.cta-reels{min-height:600px !important}
@media (max-width:760px){.cta:not(.cta-reels){padding-top:64px !important;padding-bottom:64px !important}}

/* V132: Services dropdown always sits above banner images and stays solid while open */
.site-header{z-index:1000 !important}
.nav-drop-panel{z-index:1001;transition:opacity .2s var(--ease),transform .3s var(--ease),visibility 0s linear .2s}
.nav-drop:hover .nav-drop-panel,.nav-drop:focus-within .nav-drop-panel{transition:opacity .2s var(--ease),transform .3s var(--ease),visibility 0s}
.nav-drop-inner{background:#fbf8f3 !important;opacity:1 !important}
.page-banner{isolation:isolate;z-index:0}
.page-banner::before{z-index:-1}

/* V133: tighter closing CTA band */
.cta:not(.cta-reels){padding-top:56px !important;padding-bottom:56px !important}
.cta .cta-bottom{margin-top:36px !important;padding-top:22px !important}
.cta:not(.cta-reels) .cta-inner h2{font-size:clamp(46px,6.2vw,96px) !important}
@media (max-width:760px){.cta:not(.cta-reels){padding-top:44px !important;padding-bottom:44px !important}.cta .cta-bottom{margin-top:26px !important}}

/* V134: GST number */
.footer-gst{margin-left:14px;padding-left:14px;border-left:1px solid rgba(255,255,255,.25);letter-spacing:.06em;white-space:nowrap}
@media (max-width:760px){.footer-gst{display:block;margin:6px 0 0;padding:0;border:0}}
.ct-gst{margin:14px 0 0 !important;font-size:13px;color:#4a5068;letter-spacing:.04em}.ct-gst b{color:#1F2A44;font-weight:600}
.ct-card-office .ct-gst{grid-column:2 / -1}.ct-gst b{display:inline !important;margin-left:6px}

/* V136: lighter hero overlay so the HD videos stay bright */
#home .hero-shade{background:linear-gradient(180deg,rgba(18,25,41,.32) 0%,rgba(18,25,41,0) 22%,rgba(18,25,41,0) 55%,rgba(18,25,41,.45) 100%) !important}

/* V141: centred call icon */
.footer-contact-icon{display:inline-flex !important;align-items:center;justify-content:center;flex:0 0 40px;border-radius:50%}
.footer-contact-icon svg{display:block;width:17px !important;height:17px !important;margin:0 !important}

/* V142: reviews without names */
.rv-person-anon{display:none !important}

/* V145: a little more breathing room above and below the closing CTA */
.cta.cta-reels .cta-inner{padding-top:84px !important;padding-bottom:84px !important}
.cta:not(.cta-reels){padding-top:76px !important;padding-bottom:76px !important}
@media (max-width:760px){.cta.cta-reels .cta-inner{padding-top:60px !important;padding-bottom:60px !important}.cta:not(.cta-reels){padding-top:56px !important;padding-bottom:56px !important}}

/* V146: closing CTA text moved in from the left edge */
.cta-reels .cta-inner{padding-left:max(7.5vw,80px) !important}
@media (max-width:1000px){.cta-reels .cta-inner{padding-left:40px !important;padding-right:24px !important}}
@media (max-width:760px){.cta-reels .cta-inner{padding-left:28px !important;padding-right:20px !important}}