/* dekada-global.css — Dekada Digital */

/* ══ INDEX BASE DESIGN SYSTEM ══ */

/*
 * ═══════════════════════════════════════════════════════
 *  DEKADA DIGITAL — Global Stylesheet  v1.0
 *  Shared across all pages: index, service pages, our-work, about
 *  Do not embed inline — link via 
 * ═══════════════════════════════════════════════════════
 */

/* ════════════════════════════════════════════════════════
   SECTION 1 · Design system — variables, reset, typography,
   layout, header, navigation, buttons, shared components
   ════════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════
   VARIABLES
═══════════════════════════════════════════════════ */
:root {
  --dark:       #12151c;
  --dark2:      #1a1e2a;
  --white:      #ffffff;
  --offwhite:   #f5f5f3;
  --green:      #abbc3b;
  --gold:       #abbc3b;
  --gold-dim:   rgba(171,188,59,0.12);
  --cream:      #D9D6CE;
  --mutedDark:  rgba(200,200,200,0.6);
  --mutedLight: rgba(18,21,28,0.52);
  --font1: 'GTWalsheimPro','DM Sans',system-ui,sans-serif;
  --font2: 'DM Serif Display',Georgia,serif;
  --content: 1380px;
  --ease: cubic-bezier(0.16,1,0.3,1);
}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0;height:100%;}
body{font-family:var(--font1);font-size:18px;font-weight:400;color:#fff;background:var(--dark);line-height:1.5;overflow:hidden;}
a{text-decoration:none;color:var(--green);}
p{margin:0;}p:not(:last-of-type){padding-bottom:18px;}
ul,ol{padding:0;margin:0;list-style:none;}
h1,h2,h3,h4,h5,h6{margin:0;font-weight:700;}
svg{display:block;}
::-webkit-scrollbar{width:8px;background:var(--dark)}
::-webkit-scrollbar-thumb{background:var(--green);border-radius:4px}

/* ═══════════════════════════════════════════════════
   SNAP SCROLL
═══════════════════════════════════════════════════ */
#sc{height:100vh;overflow-y:scroll;scroll-behavior:smooth;}
.snap{position:relative;width:100%;min-height:100vh;display:flex;flex-direction:column;justify-content:center;overflow:hidden;}

/* ═══════════════════════════════════════════════════
   THEMES (no slant — clean straight edges)
═══════════════════════════════════════════════════ */
.dark {background:var(--dark);color:#fff;}
.dark2{background:var(--dark2);color:#fff;}
.white{background:var(--white);color:var(--dark);}
.white .hl{color:var(--dark);}
.white .hl em{color:var(--green);}
.white .hl span{color:var(--green);}
.white .sm{color:var(--dark);}
.white .tag{color:var(--green);}

/* ═══════════════════════════════════════════════════
   LAYOUT
═══════════════════════════════════════════════════ */
.inner{width:100%;max-width:var(--content);margin:0 auto;padding:0 60px;}

/* ═══════════════════════════════════════════════════
   HEADER
   transparent by default → solid #151515 on scroll
   Left: logo svg + wordmark  |  Centre: nav  |  Right: phone + CTA
═══════════════════════════════════════════════════ */
header {
  position: fixed; top: 0; left: 0; width: 100%; z-index: 1000;
  height: 76px;
  display: flex; align-items: center;
  padding: 0;
  background: transparent;
  border-bottom: 1px solid transparent;
  transition: background .3s ease, border-color .3s ease;
}
header.on {
  background: #151515;
  border-color: rgba(255,255,255,.07);
}
/* Inner wrapper — matches .inner max-width so nav aligns with page content */
.hdr-inner {
  width: 100%;
  max-width: var(--content);
  margin: 0 auto;
  padding: 0 60px;
  display: flex;
  align-items: center;
  height: 100%;
}

/* ── Left: logo area (svg icon + wordmark text) ── */
.hdr-logo {
  display: flex; align-items: center; gap: 8px;
  flex-shrink: 0; text-decoration: none;
  margin-right: 36px;
}
/* Crop viewBox in the HTML to show only the circular mark */
.hdr-logo svg {
  width: 38px; height: 38px; display: block; flex-shrink: 0;
}
.hdr-wordmark {
  font-family: var(--font1);
  font-size: 24px; font-weight: 700;
  color: #fff; letter-spacing: -0.5px;
  line-height: 1; white-space: nowrap;
}

/* ── Centre: nav (takes remaining space, centres itself) ── */
.hdr-nav {
  display: flex; align-items: center;
  flex: 1;
}
.hn {
  display: flex; align-items: center; gap: 0;
  list-style: none; padding: 0; margin: 0;
}
.hn > li { position: relative; }
.hn > li > a {
  display: flex; align-items: center; gap: 6px;
  font-family: var(--font1);
  font-size: 18px; font-weight: 600;
  color: rgba(255,255,255,.7);
  letter-spacing: 0;
  padding: 0 18px;
  height: 76px; line-height: 1;
  white-space: nowrap; position: relative;
  transition: color .2s;
}
.hn > li > a:hover,
.hn > li:hover > a { color: #fff; }
/* chevron */
.hn > li > a .chev {
  width: 12px; height: 12px;
  stroke: currentColor; stroke-width: 2.2; fill: none;
  stroke-linecap: round; stroke-linejoin: round;
  transition: transform .22s ease; flex-shrink: 0;
}
.hn > li:hover > a .chev { transform: rotate(180deg); }
/* green underline */
.hn > li > a::after {
  content: ''; position: absolute;
  bottom: 0; left: 18px; right: 18px;
  height: 2px; background: var(--green);
  transform: scaleX(0); transform-origin: left;
  transition: transform .22s ease;
}
.hn > li > a:hover::after { transform: scaleX(1); }
/* dropdown */
.hn-drop {
  position: absolute; top: 100%; left: 0;
  min-width: 200px; background: #151515;
  border: 1px solid rgba(255,255,255,.08);
  border-top: 2px solid var(--green);
  border-radius: 0 0 4px 4px;
  padding: 8px 0;
  opacity: 0; visibility: hidden; pointer-events: none;
  transform: translateY(6px);
  transition: opacity .2s ease, transform .2s ease, visibility .2s;
  box-shadow: 0 14px 36px rgba(0,0,0,.45);
  z-index: 200;
}
.hn > li:hover .hn-drop { opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0); }
.hn-drop a {
  display: block; font-family: var(--font1);
  font-size: 14px; font-weight: 500;
  color: rgba(255,255,255,.6);
  padding: 9px 20px; white-space: nowrap;
  transition: color .15s, background .15s;
}
.hn-drop a:hover { color: #fff; background: rgba(255,255,255,.04); }

/* ── Right: phone + CTA ── */
.hdr-right {
  display: flex; align-items: center; gap: 18px;
  flex-shrink: 0; margin-left: auto;
}
.hdr-phone {
  display: flex; align-items: center; gap: 7px;
  font-family: var(--font1);
  font-size: 18px; font-weight: 700;
  color: rgba(255,255,255,.7); white-space: nowrap;
  transition: color .2s;
}
.hdr-phone:hover { color: var(--green); }
.hdr-phone svg {
  width: 14px; height: 14px; flex-shrink: 0;
  stroke: var(--green); stroke-width: 1.8; fill: none;
  stroke-linecap: round; stroke-linejoin: round;
}
/* CTA — slide animation, green bg, black text */
.hcta {
  display: inline-flex; align-items: center; justify-content: center;
  overflow: hidden;
  height: 46px; padding: 0 24px;
  background: var(--green); border-radius: 4px;
  font-family: var(--font1); font-size: 18px; font-weight: 700;
  white-space: nowrap; flex-shrink: 0;
  transition: transform .2s ease, box-shadow .2s ease;
  text-decoration: none;
}
.hcta .tw {
  display: flex; flex-direction: column;
  height: 46px; overflow: hidden; flex-shrink: 0;
}
.hcta .t, .hcta .th {
  display: flex; align-items: center; justify-content: center;
  height: 46px; flex-shrink: 0;
  color: var(--dark);
  transition: transform .28s var(--ease);
}
.hcta:hover .t, .hcta:hover .th { transform: translateY(-100%); }
.hcta:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(171,188,59,.4);
}

/* ── Responsive ── */
@media(max-width:1200px) { .hn { display: none; } .hdr-menu-btn { display: flex !important; } }
@media(max-width:680px)  { header { padding: 0; } .hdr-inner { padding: 0 20px; } .hdr-phone { display: none; } }

/* ── Menu burger button — hidden by default, shown ≤1200px via media query above ── */
.hdr-menu-btn {
  display: none; align-items: center; gap: 10px;
  background: none; border: none; cursor: pointer;
  padding: 0; margin-left: 20px; flex-shrink: 0;
  font-family: var(--font1); font-size: 15px; font-weight: 700;
  color: #fff; letter-spacing: 0.3px;
  transition: color .2s;
}
.hdr-menu-btn:hover { color: var(--green); }
/* Animate burger to X when open — use #menu-btn.open */

/* ══════════════════════════════════════════════════
   FULLSCREEN MEGA MENU — dekadadigital.com style
   Slides in from right, full black overlay
══════════════════════════════════════════════════ */
#mega-menu {
  position: fixed; inset: 0; z-index: 1100;
  background: #111;
  display: flex; flex-direction: column;
  opacity: 0; visibility: hidden; pointer-events: none;
  transform: translateX(100%);
  transition: opacity .38s var(--ease), visibility .38s, transform .38s var(--ease);
}
#mega-menu.open {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translateX(0);
}
/* Same header bar inside menu */
.mm-header {
  display: flex; align-items: center;
  height: 76px; padding: 0 44px; flex-shrink: 0;
  border-bottom: 1px solid rgba(255,255,255,.07);
}
.mm-logo-link {
  display: flex; align-items: center; gap: 8px;
  text-decoration: none; margin-right: auto;
}
.mm-logo-link svg { width: 38px; height: 38px; display: block; }
.mm-logo-link span {
  font-family: var(--font1); font-size: 24px; font-weight: 700;
  color: #fff; letter-spacing: -0.5px; line-height: 1;
}
.mm-hdr-right {
  display: flex; align-items: center; gap: 20px;
}
.mm-phone {
  display: flex; align-items: center; gap: 7px;
  font-family: var(--font1); font-size: 15px; font-weight: 700;
  color: rgba(255,255,255,.55); white-space: nowrap;
  transition: color .2s; text-decoration: none;
}
.mm-phone:hover { color: var(--green); }
.mm-phone svg {
  width: 14px; height: 14px;
  stroke: var(--green); stroke-width: 1.8; fill: none;
  stroke-linecap: round; stroke-linejoin: round;
}
.mm-cta {
  display: inline-flex; align-items: center; justify-content: center;
  overflow: hidden; height: 42px; padding: 0 22px;
  background: rgba(171,188,59,.22); border: 1px solid var(--green);
  border-radius: 4px;
  font-family: var(--font1); font-size: 15px; font-weight: 700;
  color: var(--green); white-space: nowrap; flex-shrink: 0;
  text-decoration: none; transition: background .2s, color .2s;
}
.mm-cta:hover { background: var(--green); color: var(--dark); }
/* Close × button */
.mm-close {
  display: flex; align-items: center; gap: 10px;
  background: none; border: none; cursor: pointer;
  padding: 0; margin-left: 8px;
  font-family: var(--font1); font-size: 15px; font-weight: 700;
  color: #fff; letter-spacing: 0.3px;
  transition: color .2s;
}
.mm-close:hover { color: var(--green); }
.mm-close svg {
  width: 22px; height: 22px;
  stroke: #fff; stroke-width: 2; fill: none;
  stroke-linecap: round; stroke-linejoin: round;
  transition: stroke .2s;
}
.mm-close:hover svg { stroke: var(--green); }

/* Menu body */
.mm-body {
  flex: 1; display: flex; overflow: hidden;
  padding: 60px 44px 0;
}
/* Left column: main nav items */
.mm-nav {
  display: flex; flex-direction: column; justify-content: center;
  gap: 0; min-width: 380px; padding-bottom: 40px;
}
.mm-nav-item {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 0;
  border-bottom: 1px solid rgba(255,255,255,.06);
  cursor: pointer; gap: 20px;
  transition: border-color .2s;
}
.mm-nav-item:first-child { border-top: 1px solid rgba(255,255,255,.06); }
.mm-nav-item:hover { border-color: rgba(255,255,255,.12); }
.mm-nav-item-label {
  font-family: var(--font1); font-size: 38px; font-weight: 700;
  color: rgba(255,255,255,.35); letter-spacing: -1px; line-height: 1;
  transition: color .2s;
}
.mm-nav-item.active .mm-nav-item-label,
.mm-nav-item:hover .mm-nav-item-label { color: var(--green); }
.mm-nav-item-arrow {
  width: 22px; height: 22px; flex-shrink: 0;
  stroke: rgba(255,255,255,.25); stroke-width: 1.8; fill: none;
  stroke-linecap: round; stroke-linejoin: round;
  transition: stroke .2s, transform .2s;
}
.mm-nav-item.active .mm-nav-item-arrow,
.mm-nav-item:hover .mm-nav-item-arrow { stroke: var(--green); transform: translateX(4px); }

/* Right column: sub-items */
.mm-sub {
  flex: 1; display: flex; flex-direction: column; padding: 18px 0 40px 80px;
}
.mm-sub-panel {
  display: none; flex-direction: column; gap: 8px;
}
.mm-sub-panel.active { display: flex; }
.mm-sub-panel a {
  font-family: var(--font1); font-size: 22px; font-weight: 500;
  color: rgba(255,255,255,.65); letter-spacing: -0.3px;
  text-decoration: none; padding: 8px 0;
  transition: color .2s;
}
.mm-sub-panel a:hover { color: #fff; }

/* Menu footer */
.mm-footer {
  padding: 32px 44px 36px; flex-shrink: 0;
  border-top: 1px solid rgba(255,255,255,.08);
}
.mm-footer-top {
  display: flex; align-items: center; gap: 28px; margin-bottom: 20px;
}
.mm-footer-cta {
  display: inline-flex; align-items: center; justify-content: center;
  overflow: hidden; height: 54px; padding: 0 32px;
  background: var(--green); border-radius: 4px;
  font-family: var(--font1); font-size: 18px; font-weight: 700;
  color: var(--dark); text-decoration: none;
  transition: box-shadow .2s, transform .2s;
}
.mm-footer-cta:hover { transform: translateY(-2px); box-shadow: 0 8px 28px rgba(171,188,59,.4); }
.mm-footer-quote {
  font-family: var(--font2); font-style: italic;
  font-size: 15px; color: rgba(255,255,255,.4); line-height: 1.5;
}
.mm-footer-bottom {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 16px; padding-top: 20px;
  border-top: 1px solid rgba(255,255,255,.08);
}
.mm-contact-label {
  font-family: var(--font1); font-size: 16px; font-weight: 700; color: #fff;
}
.mm-contact-right {
  display: flex; align-items: center; gap: 32px; flex-wrap: wrap;
}
.mm-contact-right a {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--font1); font-size: 15px; font-weight: 600;
  color: rgba(255,255,255,.6); text-decoration: none;
  transition: color .2s;
}
.mm-contact-right a:hover { color: var(--green); }
.mm-contact-right svg {
  width: 15px; height: 15px; flex-shrink: 0;
  stroke: var(--green); stroke-width: 1.8; fill: none;
  stroke-linecap: round; stroke-linejoin: round;
}

/* Mobile adjustments */
@media(max-width:720px) {
  .mm-header { padding: 0 20px; }
  .mm-body {
    padding: 24px 20px 0;
    flex-direction: column;
    overflow-y: auto;
  }
  .mm-nav { min-width: unset; padding-bottom: 0; }
  .mm-nav-item-label { font-size: 26px; }

  /* On mobile: sub-panel lives INSIDE nav item, below the label */
  .mm-nav-item {
    flex-wrap: wrap;
    align-items: flex-start;
  }
  .mm-nav-item-label { flex: 1; }
  .mm-nav-item-arrow { margin-top: 8px; }

  /* Hide the separate right sub column on mobile */
  .mm-sub { display: none; }

  /* Instead, inline sub-panels inside each nav item */
  .mm-nav-item .mm-inline-sub {
    width: 100%;
    display: none;
    flex-direction: column;
    gap: 0;
    padding: 8px 0 16px 0;
    border-top: 1px solid rgba(255,255,255,.06);
    margin-top: 8px;
  }
  .mm-nav-item.active .mm-inline-sub { display: flex; }
  .mm-nav-item .mm-inline-sub a {
    font-family: var(--font1); font-size: 16px; font-weight: 500;
    color: rgba(255,255,255,.5); text-decoration: none;
    padding: 10px 0;
    border-bottom: 1px solid rgba(255,255,255,.04);
    transition: color .2s;
    display: block;
  }
  .mm-nav-item .mm-inline-sub a:hover { color: var(--green); }
  .mm-nav-item .mm-inline-sub a:last-child { border-bottom: none; }

  /* Arrow rotates on active */
  .mm-nav-item.active .mm-nav-item-arrow { transform: rotate(90deg); stroke: var(--green); }

  .mm-footer { padding: 20px 20px 28px; }
  .mm-footer-top { flex-direction: column; align-items: flex-start; gap: 16px; }
  .mm-phone { display: none; }
  .mm-footer-bottom { flex-direction: column; align-items: flex-start; gap: 12px; }
  .mm-contact-right { flex-direction: column; gap: 12px; }
}

/* ═══════════════════════════════════════════════════
   TYPOGRAPHY
═══════════════════════════════════════════════════ */
.hl{font-size:90px;font-weight:700;line-height:1;letter-spacing:-3px;color:#fff;display:block;}
.hl em{font-style:italic;font-family:var(--font2);font-weight:400;color:var(--green);}
.hl span{color:var(--green);}
.hl--big{font-size:110px;line-height:.92;}
.sm{font-family:var(--font2);font-style:italic;font-weight:400;font-size:44px;line-height:1;letter-spacing:0;margin-bottom:16px;color:#fff;display:block;}
.tag{font-size:12px;font-weight:700;letter-spacing:4px;text-transform:uppercase;color:var(--green);margin-bottom:18px;display:block;}
.muted-dark{color:var(--mutedDark);}
.muted-light{color:var(--mutedLight);}

/* ═══════════════════════════════════════════════════
   BUTTONS
═══════════════════════════════════════════════════ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;overflow:hidden;line-height:1;min-width:200px;height:62px;padding:0 30px;font-weight:700;font-size:18px;font-family:var(--font1);border:none;border-radius:4px;text-decoration:none!important;cursor:pointer;position:relative;transition:box-shadow .22s var(--ease);}
.btn .tw{display:flex;flex-direction:column;width:100%;height:62px;overflow:hidden;flex-shrink:0;}
.btn .t,.btn .th{display:flex;align-items:center;justify-content:center;width:100%;height:62px;flex-shrink:0;white-space:nowrap;transition:transform .28s var(--ease);}
.btn:hover .t,.btn:hover .th{transform:translateY(-100%);}
/* Green button — black text */
.btn-g{background:var(--green);}
.btn-g .t,.btn-g .th{color:var(--dark);}
.btn-g:hover{box-shadow:0 12px 36px rgba(171,188,59,.38);}
/* Outline green */
.btn-og{background:transparent;border:2px solid var(--green);}
.btn-og .t,.btn-og .th{color:var(--green);}
.btn-og:hover{background:var(--green);}
.btn-og:hover .t,.btn-og:hover .th{color:var(--dark);}
/* Outline dark */
.btn-od{background:transparent;border:2px solid var(--dark);}
.btn-od .t,.btn-od .th{color:var(--dark);}
.btn-od:hover{background:var(--dark);}
.btn-od:hover .t,.btn-od:hover .th{color:#fff;}
/* Dark/black button — white text, green text on hover */
.btn-dk{background:var(--dark);}
.btn-dk .t,.btn-dk .th{color:#fff;}
.btn-dk:hover .t,.btn-dk:hover .th{color:var(--green);}
/* .ico mirrors .tw — two stacked SVGs, slide-up on hover */
.btn .ico{
  display:flex;flex-direction:column;
  width:20px;height:20px;
  overflow:hidden;flex-shrink:0;
}
.btn .ico svg{
  width:20px;height:20px;flex-shrink:0;display:block;
  transition:transform .28s var(--ease);
}
.btn:hover .ico svg{transform:translateY(-100%);}
/* Arrow colour matches button text */
.btn-g .ico{color:var(--dark);}
.btn-dk .ico{color:#fff;}
.btn-og .ico{color:var(--green);}
.btn-og:hover .ico{color:var(--dark);}

/* ═══════════════════════════════════════════════════
   LINE ICON WRAP
═══════════════════════════════════════════════════ */
.iw{width:52px;height:52px;border:1.5px solid rgba(171,188,59,.3);border-radius:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-bottom:18px;transition:all .3s;}
.iw svg{width:26px;height:26px;stroke:var(--green);stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.iw--l{border-color:rgba(18,21,28,.13);}
.iw--l svg{stroke:var(--dark);}

/* ═══════════════════════════════════════════════════
   REVEAL
═══════════════════════════════════════════════════ */
.rv{opacity:0;transform:translateY(40px);transition:opacity .8s var(--ease),transform .8s var(--ease);}
.rv.in{opacity:1;transform:translateY(0);}
.d1{transition-delay:.1s}.d2{transition-delay:.2s}.d3{transition-delay:.32s}.d4{transition-delay:.44s}

/* ═══════════════════════════════════════════════════
   SCROLL NAV DOTS
═══════════════════════════════════════════════════ */

/* ══════════════════════════════════
   §1  HERO  — DARK
══════════════════════════════════ */
/* ═══════════════════════════════════════════════
   DESIGN ACCENT SYSTEM — Image 1 elements
   Wave canvas · Mark Ring · Topographic · Halftone
═══════════════════════════════════════════════ */

/* ── Hero wave canvas ── */
#hero{background:var(--dark);position:relative;}
.hero-wave-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;}

/* ── Legacy grid (keep subtle, layered behind wave) ── */
.hero-grid{position:absolute;inset:0;z-index:0;
  background-image:linear-gradient(rgba(171,188,59,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(171,188,59,.025) 1px,transparent 1px);
  background-size:88px 88px;pointer-events:none;}
.hero-glow{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:700px;height:700px;
  background:radial-gradient(circle,rgba(171,188,59,.07) 0%,transparent 60%);
  pointer-events:none;z-index:0;}

/* Gold radial spotlight (from Image 1 hero) */
.hero-gold-glow{
  position:absolute;top:30%;right:8%;
  width:500px;height:500px;
  background:radial-gradient(ellipse,rgba(171,188,59,.06) 0%,transparent 65%);
  pointer-events:none;z-index:0;
}

/* ── MARK RING (10-mark ring, Image 1 accent element) ── */
.hero-ring{
  position:absolute;top:50%;right:6%;
  transform:translateY(-52%);
  width:280px;height:280px;
  z-index:1;pointer-events:none;
}
.hero-ring svg{
  width:100%;height:100%;
  animation:ring-spin 50s linear infinite;
}
@keyframes ring-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
.hero-ring-inner{
  position:absolute;inset:0;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;gap:2px;
}
.hri-top{font-size:10px;font-weight:700;letter-spacing:3.5px;text-transform:uppercase;
  color:rgba(18,21,28,.42);line-height:1;}
.hri-num{font-size:44px;font-weight:900;letter-spacing:-2px;color:var(--green);line-height:1;}
.hri-sub{font-family:var(--font2);font-style:italic;font-size:14px;color:rgba(18,21,28,.38);}

/* ── TOPOGRAPHIC CIRCLE TEXTURE — dark section backgrounds ── */
.topo-bg{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;}
.topo-bg svg{position:absolute;width:100%;height:100%;}

/* ── HALFTONE DOT TEXTURE ── */
.halftone-accent{position:absolute;pointer-events:none;z-index:0;}

/* ── WAVE LINE DIVIDER — between sections ── */
.wave-divider{
  position:absolute;bottom:0;left:0;right:0;height:60px;
  overflow:hidden;z-index:2;pointer-events:none;
}

/* ── GOLD EYEBROW TAG variant ── */
.tag-gold{
  display:inline-flex;align-items:center;gap:8px;
  font-size:11px;font-weight:700;letter-spacing:4px;text-transform:uppercase;
  color:var(--green);margin-bottom:14px;
}
.tag-gold::before,.tag-gold::after{
  content:'';display:inline-block;width:24px;height:1px;background:var(--green);
}

/* ── DECADE TICKER STRIP (hero bottom) ── */
/* ── 10 LINES accent (vertical bars, Image 1) ── */
.ten-lines{
  display:flex;align-items:flex-end;gap:5px;
  height:40px;
}
.ten-lines span{
  display:block;width:2px;background:var(--green);
  border-radius:1px;
}

/* ── CONCENTRIC CIRCLE ICON override ── */
.icon-concentric{
  width:52px;height:52px;position:relative;
}
.icon-concentric svg{width:52px;height:52px;}

/* ── X ROMAN NUMERAL accent ── */
.roman-x-accent{
  position:absolute;
  font-family:var(--font2);font-style:italic;
  font-size:220px;font-weight:700;
  color:rgba(171,188,59,.025);
  line-height:1;pointer-events:none;
  user-select:none;z-index:0;
}

/* ── PROGRESS ARC accent ── */
.progress-arc{position:relative;display:inline-block;}
.progress-arc svg{display:block;}

/* z-index fix — ensure hero content is above canvas elements */
.hero-c,.hero-bar{position:relative;z-index:2;}

/* ── RESPONSIVE: hide ring on smaller screens ── */
@media(max-width:1100px){.hero-ring{display:none;}.roman-x-accent{display:none;}}

.hero-c{position:relative;z-index:2;text-align:center;padding-bottom:60px;}
.eyebrow{display:inline-flex;align-items:center;gap:14px;font-size:12px;font-weight:700;letter-spacing:5px;text-transform:uppercase;color:var(--green);margin-bottom:32px;opacity:0;animation:fu .8s .2s var(--ease) forwards;}
.eyebrow::before,.eyebrow::after{content:'';width:28px;height:1px;background:var(--green);}
.hero-hl{opacity:0;animation:fu .9s .42s var(--ease) forwards;}
.hero-desc{font-size:21px;color:rgba(255,255,255,.52);max-width:680px;margin:32px auto 52px;line-height:1.65;opacity:0;animation:fu .9s .65s var(--ease) forwards;}
.hero-link-btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--font1);font-size:16px;font-weight:700;
  color:rgba(255,255,255,.65);
  background:none;border:none;
  padding:0;text-decoration:none;
  transition:color .22s;
  cursor:pointer;
  white-space:nowrap;
}
.hero-link-btn svg{
  width:18px;height:18px;flex-shrink:0;
  transition:transform .25s var(--ease);
}
/* Gap stays fixed — only arrow moves, so adjacent btn never shifts */
.hero-link-btn:hover{color:var(--green);}
.hero-link-btn:hover svg{transform:translateX(5px);}

.hero-btns{display:flex;align-items:center;gap:28px;justify-content:center;flex-wrap:wrap;opacity:0;animation:fu .9s .82s var(--ease) forwards;}
.hero-bar{position:absolute;bottom:0;left:0;width:100%;background:rgba(0,0,0,.5);padding:13px 0;z-index:5;text-align:center;}
.hero-bar p{font-size:12px;font-weight:700;letter-spacing:3.5px;text-transform:uppercase;color:rgba(255,255,255,.35);margin:0;}
@keyframes fu{from{opacity:0;transform:translateY(36px);}to{opacity:1;transform:translateY(0);}}

/* ══════════════════════════════════
   §2  VALUE PROPS  — WHITE
══════════════════════════════════ */
#values{background:var(--white);}
.vals{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;}
.vals-left .hl{font-size:72px;}
.vals-right{display:flex;flex-direction:column;gap:38px;}
.val{display:flex;gap:20px;align-items:flex-start;}
.val .iw{margin-bottom:0;}
.val-title{font-size:18px;font-weight:700;color:var(--dark);margin-bottom:6px;letter-spacing:-.3px;}
.val-text{font-size:15px;color:var(--mutedLight);line-height:1.65;}

/* ══════════════════════════════════
   §3  SERVICES  — DARK
══════════════════════════════════ */
#services{background:var(--dark);}
.srv-hd{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:20px;margin-bottom:48px;}
.srv-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;width:100%;}
.sc{background:var(--dark2);padding:42px 38px;position:relative;overflow:hidden;transition:background .3s;cursor:default;}
.sc::before{content:'';position:absolute;inset:0;background:var(--green);transform:scaleY(0);transform-origin:bottom;transition:transform .45s var(--ease);z-index:0;}
.sc:hover::before{transform:scaleY(1);}
.sc>*{position:relative;z-index:1;}
.sc:hover .iw{border-color:rgba(18,21,28,.18);}
.sc:hover .iw svg{stroke:var(--dark);}
.sc-num{font-size:11px;font-weight:700;letter-spacing:3px;color:rgba(171,188,59,.45);margin-bottom:16px;display:block;transition:color .3s;}
.sc:hover .sc-num{color:rgba(18,21,28,.35);}
.sc-title{font-size:22px;font-weight:700;color:#fff;letter-spacing:-.4px;margin-bottom:10px;transition:color .3s;}
.sc-desc{font-size:15px;color:var(--mutedDark);line-height:1.65;transition:color .3s;}
.sc:hover .sc-title,.sc:hover .sc-desc{color:var(--dark);}
.sc-link{display:inline-flex;align-items:center;gap:6px;margin-top:18px;font-size:13px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--green);transition:color .3s;}
.sc:hover .sc-link{color:var(--dark);}
.sc-link svg{width:14px;height:14px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;}

/* ══════════════════════════════════
   §4  ABOUT  — WHITE
══════════════════════════════════ */
#about{background:var(--white);}
.about{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;}
.about-vis{position:relative;background:var(--dark);border-radius:4px;overflow:hidden;min-height:480px;}
.av-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(171,188,59,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(171,188,59,.06) 1px,transparent 1px);background-size:40px 40px;}
.av-glow{position:absolute;top:28%;left:18%;width:250px;height:250px;background:radial-gradient(circle,rgba(171,188,59,.15) 0%,transparent 70%);border-radius:50%;pointer-events:none;}
.av-stats{position:absolute;bottom:0;left:0;right:0;background:rgba(18,21,28,.92);backdrop-filter:brightness(.95);padding:26px 34px;display:grid;grid-template-columns:1fr 1fr;gap:22px;}
.stn{font-size:40px;font-weight:700;letter-spacing:-2px;color:#fff;line-height:1;display:block;margin-bottom:3px;}
.stn span{color:var(--green);}
.stl{font-size:12px;color:rgba(200,200,200,.42);font-weight:500;}
.about-txt .hl{font-size:68px;color:var(--dark);margin-bottom:22px;}
.about-txt p{font-size:17px;color:var(--mutedLight);line-height:1.72;}
.checks{margin-top:28px;display:flex;flex-direction:column;gap:12px;}
.chk{display:flex;align-items:center;gap:12px;font-size:15px;color:var(--mutedLight);font-weight:500;}
.chk svg{width:20px;height:20px;stroke:var(--green);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;}

/* ══════════════════════════════════════════════
   §5  OUR WORK  — DARK  (Dilate slider style)
══════════════════════════════════════════════ */
#work{background:var(--dark);}

/* 2-column top header */
.work-hd{
  display:grid;grid-template-columns:1fr 1fr;gap:60px;
  align-items:start;margin-bottom:44px;
}
.work-hd-left .sm{color:#fff;font-size:clamp(20px,2vw,26px);margin-bottom:8px;}
.work-hd-left .hl{font-size:clamp(38px,5vw,68px);color:#fff;letter-spacing:-2px;}
.work-hd-left .hl em{color:var(--green);font-style:normal;}
.work-hd-right{padding-top:28px;font-size:16px;color:rgba(200,200,200,.58);line-height:1.75;}
.work-hd-right em{font-style:italic;color:rgba(200,200,200,.75);}

/* Slider outer — clips slides, shows peek of next */
.work-slider-outer{
  position:relative;
  overflow:hidden;
  /* allow partial view of next slide */
  padding-right:0;
}

/* Slider track */
.work-slider{
  display:flex;
  gap:20px;
  transition:transform .55s var(--ease);
  will-change:transform;
  cursor:grab;
  user-select:none;
  padding: 0 60px;
}
.work-slider.dragging{
  transition:none;
  cursor:grabbing;
}

/* Each slide: primary card takes ~70% of viewport, next card peeks */
.ws{
  flex: 0 0 calc(70vw - 80px);
  max-width: 860px;
  min-width: 300px;
  background:#1a1a1a;
  border-radius:8px;
  overflow:hidden;
  transition:transform .4s var(--ease), box-shadow .4s, opacity .4s;
  opacity:.45;
  transform:scale(0.97);
  pointer-events:none;
}
.ws.active{
  opacity:1;
  transform:scale(1);
  pointer-events:auto;
}
.ws.next-slide{ opacity:.65; }

/* Browser chrome bar */
.ws-chrome{
  height:32px;background:#252525;
  display:flex;align-items:center;padding:0 14px;gap:7px;
  border-bottom:1px solid rgba(255,255,255,.05);
  flex-shrink:0;
}
.ws-dot{width:10px;height:10px;border-radius:50%;}
.ws-dot:nth-child(1){background:#ff5f57;}
.ws-dot:nth-child(2){background:#ffbd2e;}
.ws-dot:nth-child(3){background:#28c840;}
.ws-url{
  flex:1;margin-left:10px;height:18px;background:#1a1a1a;border-radius:3px;
  display:flex;align-items:center;padding:0 10px;
  font-size:10px;color:rgba(255,255,255,.28);letter-spacing:.3px;font-family:monospace;
}

/* Viewport area */
.ws-viewport{width:100%;aspect-ratio:16/9;position:relative;overflow:hidden;}
.ws-bg{position:absolute;inset:0;transition:transform .7s var(--ease);}
.ws.active:hover .ws-bg{transform:scale(1.02);}
.ws-bg-1{background:linear-gradient(145deg,#0d1f0f 0%,#162d18 40%,#1c3820 70%,#0a1812 100%);}
.ws-bg-2{background:linear-gradient(145deg,#0d0e1a 0%,#141526 40%,#1a1b36 70%,#0a0b18 100%);}
.ws-bg-3{background:linear-gradient(145deg,#1a0d0a 0%,#2a1810 40%,#301e12 70%,#1a0d0a 100%);}
.ws-bg-4{background:linear-gradient(145deg,#0a1520 0%,#142030 40%,#1a2840 70%,#0a1520 100%);}
.ws-bg-5{background:linear-gradient(145deg,#14080d 0%,#221020 40%,#2c1828 70%,#14080d 100%);}

/* Skeleton content lines */
.ws-lines{position:absolute;inset:0;padding:20px;display:flex;flex-direction:column;gap:9px;opacity:.18;pointer-events:none;}
.ws-lines span{display:block;height:8px;background:rgba(255,255,255,.7);border-radius:2px;}
.ws-lines span:nth-child(1){width:52%;}
.ws-lines span:nth-child(2){width:35%;}
.ws-lines span:nth-child(3){width:80%;margin-top:8px;height:72px;}
.ws-lines span:nth-child(4){width:48%;}
.ws-lines span:nth-child(5){width:65%;}

/* Arrow button overlay on hover */
.ws-arrow-overlay{
  position:absolute;top:50%;left:50%;
  transform:translate(-50%,-50%) scale(0.8);
  width:56px;height:56px;border-radius:50%;
  background:rgba(255,255,255,.14);
  backdrop-filter:blur(8px);
  display:flex;align-items:center;justify-content:center;
  opacity:0;transition:opacity .3s,transform .3s var(--ease);
}
.ws-arrow-overlay svg{width:22px;height:22px;stroke:#fff;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.ws.active:hover .ws-arrow-overlay{opacity:1;transform:translate(-50%,-50%) scale(1);}

/* Label below card */
.ws-label{padding:18px 22px 22px;}
.ws-title{font-size:17px;font-weight:700;color:#fff;letter-spacing:-.3px;margin-bottom:4px;}
.ws-cat{font-size:13px;font-style:italic;font-family:var(--font2);color:rgba(171,188,59,.8);}

/* Navigation row: arrows, counter, progress, "View All" */
.work-nav{
  display:flex;align-items:center;gap:14px;
  padding:24px 60px 0;
}
.wnav-btn{
  width:50px;height:50px;border-radius:50%;
  background:transparent;border:1.5px solid rgba(255,255,255,.2);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;transition:all .22s var(--ease);flex-shrink:0;
}
.wnav-btn svg{width:18px;height:18px;stroke:#fff;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;transition:stroke .2s;}
.wnav-btn:hover{background:var(--green);border-color:var(--green);}
.wnav-btn:hover svg{stroke:var(--dark);}
.wnav-btn:disabled{opacity:.25;cursor:default;pointer-events:none;}

/* Counter e.g. "01 / 05" */
.wnav-counter{
  font-size:14px;letter-spacing:.5px;
  color:rgba(200,200,200,.4);font-family:var(--font1);
  min-width:60px;
}
.wnav-counter strong{color:#fff;font-weight:700;}

/* Progress bar */
.wnav-progress{
  flex:1;height:2px;background:rgba(255,255,255,.08);border-radius:1px;overflow:hidden;
}
.wnav-fill{height:100%;background:var(--green);border-radius:1px;transition:width .55s var(--ease);}

/* View all link */
.wnav-all{
  font-size:15px;font-weight:700;color:rgba(200,200,200,.5);
  text-decoration:none;display:flex;align-items:center;gap:8px;transition:color .2s;
}
.wnav-all:hover{color:var(--green);}
.wnav-all svg{width:15px;height:15px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;}

/* Responsive */
@media(max-width:900px){
  .work-hd{grid-template-columns:1fr;gap:20px;}
  .ws{flex:0 0 calc(80vw);}
  .work-slider{padding:0 24px;}
  .work-nav{padding:20px 24px 0;}
  .wnav-all span{display:none;}
}
@media(max-width:580px){
  .ws{flex:0 0 calc(88vw);}
  .work-slider{gap:14px;}
}

/* ══════════════════════════════════════════════════════
   §6  PROCESS  — WHITE  (vertical timeline — screenshot)
══════════════════════════════════════════════════════ */
#process{
  background:var(--white);
  /* Allow internal scroll so timeline rows animate as user scrolls down */
}

/* Top 2-col header */
.proc-top{
  display:grid;grid-template-columns:1fr 1.6fr;gap:60px;
  align-items:start;margin-bottom:64px;
}
.proc-top-left{
  font-family:var(--font2);font-style:italic;font-weight:400;
  font-size:clamp(22px,2.5vw,32px);
  color:rgba(18,21,28,.55);line-height:1.35;
}
.proc-top-right{
  font-size:clamp(28px,3.5vw,50px);font-weight:700;
  color:var(--dark);letter-spacing:-1.5px;line-height:1.1;
}
/* highlight block — exact screenshot style */
.proc-top-right mark{
  background:rgba(18,21,28,.08);
  color:var(--dark);
  padding:2px 6px;
  border-radius:2px;
}

/* Timeline rows */
.proc-rows{display:flex;flex-direction:column;position:relative;}

.proc-row{
  display:grid;
  grid-template-columns:220px 70px 1fr;
  gap:0;
  position:relative;
  min-height:180px;
}

/* Left: label + title */
.proc-left{
  padding:0 0 40px;
  display:flex;flex-direction:column;justify-content:flex-start;
  padding-top:2px;
}
.proc-label{font-size:12px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:rgba(18,21,28,.38);margin-bottom:8px;display:block;}
.proc-name{font-size:clamp(26px,3vw,38px);font-weight:700;color:var(--dark);letter-spacing:-1px;line-height:1;}
/* ── All steps start dimmed; .active class added/removed by JS ── */
.proc-label{
  transition: color .4s var(--ease);
}
.proc-name{
  transition: color .4s var(--ease);
}

/* Dimmed (default) */
.proc-row .proc-name  { color: rgba(18,21,28,.25); }
.proc-row .proc-label { color: rgba(18,21,28,.18); }

/* Active (JS-applied) */
.proc-row.active .proc-name  { color: var(--dark); }
.proc-row.active .proc-label { color: rgba(18,21,28,.45); }

/* Center: timeline line + circle */
.proc-mid{
  display:flex;flex-direction:column;align-items:center;
  position:relative;
}

/* Line segments — all start grey */
.proc-line{
  width: 2px; flex: 1;
  background: rgba(18,21,28,.12);
  position: relative;
  /* clip-path trick for animated green fill from top */
  overflow: hidden;
}
/* Green animated fill inside each line */
.proc-line::after{
  content:'';
  position:absolute;
  top:0;left:0;right:0;
  height:0%;                        /* grows to 100% when active */
  background: rgba(171,188,59,.7);
  transition: height .55s var(--ease);
}
.proc-row.active .proc-line::after { height: 100%; }

/* ════════════════════════════════════════════
   COMPARISON SECTION — Traditional vs Dekada
════════════════════════════════════════════ */
.cmp-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:start;
}
/* Left column */
.cmp-eyebrow{
  font-family:'Courier New',monospace;
  font-size:11px;font-weight:700;letter-spacing:3px;
  text-transform:uppercase;color:var(--green);
  display:flex;align-items:center;gap:8px;
  margin-bottom:20px;
}
.cmp-eyebrow svg{stroke:var(--green);}
.cmp-h2{
  font-family:var(--font1);
  font-size:clamp(32px,4.5vw,60px);
  font-weight:900;letter-spacing:-2px;
  line-height:1.0;text-transform:uppercase;
  color:#fff;margin-bottom:22px;
}
.cmp-accent{color:var(--green);display:block;}
.cmp-desc{
  font-size:16px;color:rgba(200,200,200,.55);
  line-height:1.7;margin-bottom:32px;
  max-width:420px;
}
.cmp-list{list-style:none;display:flex;flex-direction:column;gap:12px;}
.cmp-list li{
  font-family:'Courier New',monospace;
  font-size:12px;font-weight:700;letter-spacing:1.5px;
  text-transform:uppercase;color:rgba(200,200,200,.42);
  display:flex;align-items:center;gap:10px;
}
.cmp-dot{
  width:6px;height:6px;border-radius:50%;
  background:var(--green);flex-shrink:0;
}
.cmp-hi{color:var(--green);}
/* Right column — bars */
.cmp-right{display:flex;flex-direction:column;gap:24px;}
.cmp-group{display:flex;flex-direction:column;gap:6px;}
.cmp-row{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.cmp-label{
  font-family:'Courier New',monospace;
  font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;
}
.cmp-trad{color:rgba(200,200,200,.35);}
.cmp-dek{color:#fff;}
.cmp-val{
  font-family:'Courier New',monospace;
  font-size:11px;font-weight:700;letter-spacing:1px;
  white-space:nowrap;flex-shrink:0;
}
.cmp-trad-v{color:rgba(200,200,200,.32);}
.cmp-dek-v{color:var(--green);}
/* Bar track */
.cmp-bar{
  width:100%;height:4px;
  background:rgba(255,255,255,.07);
  border-radius:2px;overflow:hidden;
}
/* Bar fill — starts at 0, animates to data-w% on scroll-in */
.cmp-fill{
  height:100%;width:0%;border-radius:2px;
  transition:width 1.2s cubic-bezier(.16,1,.3,1);
}
.cmp-fill-trad{background:rgba(180,180,180,.28);}
.cmp-fill-dek{background:var(--green);}
/* Responsive */
@media(max-width:960px){
  .cmp-grid{grid-template-columns:1fr;gap:44px;}
}
@media(max-width:580px){
  .cmp-label{font-size:10px;letter-spacing:0.8px;}
  .cmp-val{font-size:10px;}
}

/* ════════════════════════════════════════════
   EFFICIENCY ANALYSIS — white section #about
   Left: title+desc  |  Right: bars stacked
════════════════════════════════════════════ */
/* New 2-col wrapper */
.cmpd-new-layout{
  display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:start;
}
.cmpd-left-col{}
.cmpd-desc{
  font-size:16px;color:var(--mutedLight);
  line-height:1.72;
}
/* Right column: groups stacked vertically */
.cmpd-right-col{
  display:flex;flex-direction:column;gap:18px;
}
.cmpd-group{display:flex;flex-direction:column;gap:6px;}
.cmpd-row{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.cmpd-row.mt8{margin-top:6px;}
.cmpd-lbl{font-size:13px;font-weight:600;letter-spacing:.2px;line-height:1.3;}
.cmpd-trad{color:rgba(18,21,28,.38);}
.cmpd-dek{color:var(--dark);font-weight:700;}
.cmpd-val{font-size:12px;font-weight:700;white-space:nowrap;flex-shrink:0;}
.cmpd-trad-v{color:rgba(18,21,28,.30);}
.cmpd-dek-v{color:var(--green);}
/* Bar track — double height (8px) */
.cmpd-bar{
  width:100%;height:8px;
  background:rgba(18,21,28,.07);
  border-radius:4px;overflow:hidden;
}
.cmpd-fill{
  height:100%;width:0%;border-radius:4px;
  transition:width 1.4s cubic-bezier(.16,1,.3,1);
}
.cmpd-fill-trad{background:rgba(18,21,28,.18);}
.cmpd-fill-dek{background:var(--green);}
/* Responsive */
@media(max-width:1100px){
  .cmpd-new-layout{grid-template-columns:1fr;gap:40px;}
}
/* Remove old unused classes */

/* ── proc step-4 CTA: WHITE bg default, green on hover / when step 4 active ── */
.proc-step4-cta{background:#fff;}
.proc-row.active .proc-step4-cta{background:var(--green);}
.proc-row.active .proc-step4-cta .t,
.proc-row.active .proc-step4-cta .th{color:var(--dark);}

/* Circle — tiny grey pip by default; number hidden */
.proc-circle{
  width:52px; height:52px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0; position:relative; z-index:2; margin:0;
  background:#d4d4d0;
  transform:scale(0.28);
  box-shadow:none;
  transition: background .45s var(--ease), box-shadow .45s var(--ease), transform .5s var(--ease);
}
/* Number text — invisible until active */
.proc-circle .proc-num{
  font-size:18px; font-weight:700; letter-spacing:-.5px;
  color:var(--dark);
  opacity:0;
  transform:scale(1.4);
  transition: opacity .3s var(--ease) .15s, transform .35s var(--ease) .1s;
}
/* Active: circle bursts open green, number fades in */
.proc-row.active .proc-circle{
  background:var(--green);
  transform:scale(1);
  box-shadow:0 0 0 7px rgba(171,188,59,.18);
}
.proc-row.active .proc-circle .proc-num{
  opacity:1;
  transform:scale(1);
}

/* Right: description */
.proc-right{
  padding: 0 0 40px 36px;
  padding-top: 4px;
}
.proc-right p{
  font-size:16px; line-height:1.72;
  color: rgba(18,21,28,.22);
  transition: color .4s var(--ease);
}
.proc-row.active .proc-right p { color: var(--mutedLight); }
.proc-right strong{
  font-weight:700;
  color: rgba(18,21,28,.22);
  transition: color .4s var(--ease);
}
.proc-row.active .proc-right strong { color: var(--dark); }

.proc-cta{margin-top:8px;}

/* ══════════════════════════════════════════════════════
   §7  GROW SECTION  — Dilate "Grow your brand" style
══════════════════════════════════════════════════════ */
#testi{background:#1a1a1a;}

.grow-top{text-align:center;max-width:860px;margin:0 auto 52px;padding:0 40px;}
.grow-eyebrow{font-family:var(--font2);font-style:italic;font-weight:400;font-size:20px;color:rgba(200,200,200,.5);margin-bottom:18px;display:block;}
.grow-headline{font-size:clamp(40px,6vw,80px);font-weight:700;line-height:1.05;letter-spacing:-2.5px;color:#fff;margin-bottom:28px;}
.grow-headline em{color:var(--green);font-style:normal;}
.grow-subtext{font-size:16px;color:rgba(200,200,200,.5);line-height:1.72;max-width:500px;margin:0 auto;}
.grow-subtext em{font-style:italic;color:rgba(200,200,200,.65);}

/* Three pull-quote cards — staggered heights */
.grow-quotes{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;align-items:start;padding:0 40px;max-width:var(--content);margin:0 auto 48px;width:100%;}

/* Bottom statement + CTA */
.grow-bottom{text-align:center;max-width:660px;margin:0 auto;padding:0 40px 12px;}
.grow-statement{font-size:18px;font-weight:600;color:#fff;line-height:1.65;margin-bottom:32px;}
.grow-statement em{color:var(--green);font-style:normal;}

/* Hairline divider */
.grow-divider{width:calc(100% - 80px);max-width:var(--content);margin:0 auto;height:1px;background:rgba(255,255,255,.08);}

@media(max-width:860px){.grow-quotes{grid-template-columns:1fr;gap:14px;}.gq--mid{margin-top:0;}}
@media(max-width:600px){.grow-top,.grow-bottom{padding:0 20px;}.grow-quotes{padding:0 20px;}.grow-headline{font-size:36px;letter-spacing:-1px;}}

/* ══════════════════════════════════
   §8  CONTACT  — WHITE
══════════════════════════════════ */
#contact{background:var(--white);}
.contact{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;}
.cl .hl{font-size:70px;color:var(--dark);margin-bottom:20px;}
.cl .sm{color:var(--dark);}
.cl p{font-size:17px;color:var(--mutedLight);line-height:1.7;}
.cdet{margin-top:30px;display:flex;flex-direction:column;gap:14px;}
.crow{display:flex;align-items:center;gap:12px;font-size:16px;color:var(--mutedLight);}
.crow .ci{width:20px;height:20px;flex-shrink:0;}
.crow .ci svg{width:20px;height:20px;stroke:var(--green);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.cform{background:var(--dark);padding:44px;border-radius:4px;}
.cform h3{font-size:22px;font-weight:700;color:#fff;margin-bottom:26px;letter-spacing:-.4px;}
.fg{margin-bottom:16px;}
.fg label{display:block;font-size:11px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;color:rgba(200,200,200,.4);margin-bottom:7px;}
.fg input,.fg textarea,.fg select{width:100%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:4px;padding:13px 16px;font-size:15px;font-family:var(--font1);color:#fff;outline:none;transition:border-color .2s;}
.fg input:focus,.fg textarea:focus,.fg select:focus{border-color:var(--green);}
.fg textarea{resize:vertical;min-height:98px;}
.fg select option{background:var(--dark2);color:#fff;}
.fg2{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.fnote{font-size:12px;color:rgba(200,200,200,.28);margin-top:12px;text-align:center;}

/* ══════════════════════════════════
   §9  FOOTER  — DARK (Dilate-style)
══════════════════════════════════ */
#footer{background:#0c0e14;min-height:auto;}
/* Zone 1: quote strip */
/* ── sf-top: DEKADA.DIGITAL + email row (dekadadigital.com style) ── */

/* Left: small DEKADA.DIGITAL label */

.sft-d{color:var(--green);}
/* Right: large email + copy badge */
.sft-right{
  position:relative;
  display:flex;flex-direction:column;
  align-items:flex-end;
}
/* Email — huge, light grey default → green on hover */

/* Copy badge — hidden by default, slides in on hover */
.sft-copy{
  position:absolute;bottom:-34px;right:0;
  display:inline-flex;align-items:center;gap:6px;
  padding:7px 14px;
  background:#fff;border:none;border-radius:20px;
  font-family:var(--font1);font-size:12px;font-weight:600;
  color:#111;cursor:pointer;white-space:nowrap;
  opacity:0;transform:translateY(-4px);pointer-events:none;
  transition:opacity .2s,transform .2s;
  box-shadow:0 2px 12px rgba(0,0,0,.22);
}
.sft-copy.visible{
  opacity:1;transform:translateY(0);pointer-events:auto;
}
.sft-copy.copied{background:var(--green);color:#111;}
.sft-copy-label{}
@media(max-width:900px){
  
  
  .sft-right{align-items:flex-start;}
}

.fqi{max-width:var(--content);margin:0 auto;padding:56px 60px 48px;width:100%;display:flex;align-items:center;justify-content:space-between;gap:48px;flex-wrap:wrap;}
.fq{font-family:var(--font2);font-style:italic;font-weight:400;font-size:clamp(24px,2.8vw,40px);color:rgba(255,255,255,.82);line-height:1.28;letter-spacing:-.5px;max-width:700px;flex:1;min-width:260px;}
.fqc{display:flex;flex-direction:column;gap:14px;flex-shrink:0;}
.fphone{display:flex;align-items:center;gap:11px;font-size:22px;font-weight:700;color:#fff;letter-spacing:-.4px;transition:color .2s;}
.fphone:hover{color:var(--green);}
.fphone svg{width:18px;height:18px;stroke:var(--green);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;}
.faddr{display:flex;align-items:center;gap:11px;font-size:14px;color:rgba(200,200,200,.4);}
.faddr svg{width:15px;height:15px;stroke:rgba(200,200,200,.38);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;}
/* Zone 2: cols */
.fcz{width:100%;border-bottom:1px solid rgba(255,255,255,.07);}
.fci{max-width:var(--content);margin:0 auto;padding:48px 60px 40px;width:100%;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:44px;}
.flogo{display:flex;align-items:center;gap:4px;font-size:26px;font-weight:700;color:#fff;letter-spacing:-1px;margin-bottom:14px;text-decoration:none;}
.flogo span{color:var(--green);}
.ftagline{font-size:14px;color:rgba(200,200,200,.36);line-height:1.7;max-width:280px;margin-bottom:26px;}
.fsoc{display:flex;gap:10px;}
.fsoc a{width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;transition:all .22s;}
.fsoc a:hover{border-color:var(--green);background:rgba(171,188,59,.06);}
.fsoc a svg{width:15px;height:15px;stroke:rgba(200,200,200,.4);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round;transition:stroke .22s;}
.fsoc a:hover svg{stroke:var(--green);}

/* Detail rows — same indent/size as link items */
.fnav-detail{
  font-size:14px;color:rgba(200,200,200,.36);
  cursor:default;display:flex;align-items:center;gap:7px;
  line-height:1.4;
}
/* Indent to align with the ::before gap on link items */
.fnav-detail::before{content:'';width:0;height:1px;display:block;flex-shrink:0;}
/* HQ label — slightly brighter, uppercase micro-label */
.fnav-hq{
  font-size:11px;font-weight:700;letter-spacing:2px;
  text-transform:uppercase;color:rgba(255,255,255,.45);
  margin-top:2px;
}
/* Thin separator line between links and detail block */
.fnav ul{display:flex;flex-direction:column;gap:10px;}
/* Get In Touch — tight gap for all items */
.fnav-tight ul{gap:5px;}
.fnav li.fnav-detail{margin-top:0;}
/* Remove underline from tel/email links in footer */
.fnav li a{font-size:14px;color:rgba(200,200,200,.46);transition:color .2s;display:inline-flex;align-items:center;gap:7px;text-decoration:none!important;}
.fnav li a::before{content:'';width:0;height:1px;background:var(--green);transition:width .22s var(--ease);display:block;flex-shrink:0;}
.fnav li a:hover{color:var(--green);}
.fnav li a:hover::before{width:10px;}
/* Zone 3: bottom bar */
.fbot{max-width:var(--content);margin:0 auto;padding:17px 60px;width:100%;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;}
.fcopy{font-size:13px;color:rgba(200,200,200,.2);}
.flinks{display:flex;gap:22px;}
.flinks a{font-size:13px;color:rgba(200,200,200,.24);transition:color .2s;}
.flinks a:hover{color:var(--green);}

/* ══════════════════════════════════
   RESPONSIVE
══════════════════════════════════ */
@media(max-width:1200px){
  .hl{font-size:66px;letter-spacing:-2px;}
  .hl--big{font-size:82px;}
  .sm{font-size:34px;}
  .vals,.about,.contact{grid-template-columns:1fr;gap:50px;}
  .about-vis{min-height:300px;}
  .srv-grid{grid-template-columns:1fr 1fr;}
  .wgrid{grid-template-columns:1fr;grid-template-rows:auto;}
  .wi:nth-child(1){grid-row:span 1;min-height:300px;}
  .wi:nth-child(2),.wi:nth-child(3){min-height:220px;}
  .proc-row{grid-template-columns:160px 60px 1fr;}
  .fci{grid-template-columns:1fr 1fr;gap:36px;}
  .fbrand{grid-column:span 2;}
  .testi-featured-inner,.testi-strip{grid-template-columns:1fr;}
  .tqi{border-right:none;border-bottom:1px solid rgba(255,255,255,.07);}
  .tqs{border-right:none;border-bottom:1px solid rgba(255,255,255,.07);}
}
@media(max-width:860px){
  header{padding:0 24px;}
  .hn{display:none;}
  .inner{padding-left:24px;padding-right:24px;}
  .fqi,.fci,.fbot{padding-left:24px;padding-right:24px;}
  .hl{font-size:50px;letter-spacing:-1.5px;}
  .srv-grid{grid-template-columns:1fr;}
  .hero-btns{flex-direction:column;align-items:center;}
  .proc-row{grid-template-columns:120px 56px 1fr;}
  .proc-top{grid-template-columns:1fr;}
}
@media(max-width:580px){
  .proc-row{grid-template-columns:1fr;}
  
  .proc-left{padding-bottom:10px;}
  .proc-right{padding-left:0;padding-bottom:32px;}
  .cl .hl{font-size:42px;}
  .fg2{grid-template-columns:1fr;}
}

.hn > li > a::after{display:none!important;}
@media(min-width:861px){.wk-nav{display:none;} .proj-nav{display:none;}}

/* ════════════════════════════════════════════════════════
   SECTION 2 · Footer
   ════════════════════════════════════════════════════════ */
.sf-top{
  width:100%;
  display:flex;align-items:center;justify-content:space-between;
  padding:36px 60px;
  border-bottom:1px solid rgba(255,255,255,.08);
  gap:24px;
}
.sft-inner-row{max-width:var(--content);margin:0 auto;padding:44px 60px;display:flex;align-items:center;justify-content:space-between;gap:32px;width:100%;box-sizing:border-box;}
.sft-brand{font-family:var(--font1);font-size:18px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,.6);white-space:nowrap;flex-shrink:0;}
.sft-email{font-family:var(--font1);font-size:clamp(28px,5.5vw,78px);font-weight:700;color:var(--green)!important;text-decoration:none;letter-spacing:-2px;line-height:1.1;white-space:nowrap;cursor:pointer;transition:color .22s;}
.sft-email:hover{color:var(--green);}
.sft-right{
  position:relative;
  display:flex;flex-direction:column;
  align-items:flex-end;
}
.sft-copy{
  position:absolute;bottom:-34px;right:0;
  display:inline-flex;align-items:center;gap:6px;
  padding:7px 14px;
  background:#fff;border:none;border-radius:20px;
  font-family:var(--font1);font-size:12px;font-weight:600;
  color:#111;cursor:pointer;white-space:nowrap;
  opacity:0;transform:translateY(-4px);pointer-events:none;
  transition:opacity .2s,transform .2s;
  box-shadow:0 2px 12px rgba(0,0,0,.22);
}
.sft-copy.visible{
  opacity:1;transform:translateY(0);pointer-events:auto;
}
.sft-copy.copied{background:var(--green);color:#111;}
.fnav h5{font-size:11px;font-weight:700;letter-spacing:3.5px;text-transform:uppercase;color:rgba(255,255,255,.45)!important;margin-bottom:18px;}
.sf-top,.sft-inner-row{padding-left:28px!important;padding-right:28px!important;}
.sft-inner-row{flex-direction:column!important;align-items:flex-start!important;gap:16px!important;}
.sft-right{width:100%!important;}

.sf-top,.sft-inner-row{padding-left:20px!important;padding-right:20px!important;}

/* ════════════════════════════════════════════════════════
   SECTION 3 · Contact section layout
   ════════════════════════════════════════════════════════ */
.contact-sec{background:var(--dark)!important;padding:96px 0;position:relative;overflow:hidden;}
.contact-wrap{display:grid;grid-template-columns:1fr 1.2fr;gap:80px;align-items:start;}
.contact-left .tag{background:rgba(171,188,59,.12);color:var(--green);border-color:rgba(171,188,59,.25);}
.contact-detail{display:flex;align-items:center;gap:12px;font-size:15px;color:rgba(255,255,255,.55);text-decoration:none;transition:color .2s;margin-bottom:10px;}
.contact-detail:hover{color:var(--green);}
.contact-detail svg{width:17px;height:17px;stroke:var(--green);stroke-width:1.8;fill:none;flex-shrink:0;}

.contact-left > .hl{font-size:clamp(36px,7vw,56px)!important;}
.contact-sec{padding:64px 0!important;}

/* ════════════════════════════════════════════════════════
   SECTION 4 · Contact form (cf-*)
   ════════════════════════════════════════════════════════ */
.cf{display:flex;flex-direction:column;gap:16px;}
.cf-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.cf-field{display:flex;flex-direction:column;gap:6px;}
.cf-label{font-size:13px;font-weight:600;color:rgba(255,255,255,.55);}
.cf-req{color:var(--green);}
.cf-opt{font-size:12px;font-weight:400;color:rgba(255,255,255,.3);}
.cf input,.cf textarea{background:rgba(255,255,255,.05);border:1.5px solid rgba(255,255,255,.1);border-radius:6px;padding:14px 16px;font-family:var(--font1);font-size:15px;color:#fff;width:100%;box-sizing:border-box;transition:border-color .2s;outline:none;}
.cf input::placeholder,.cf textarea::placeholder{color:rgba(255,255,255,.25);}
.cf input:focus,.cf textarea:focus{border-color:var(--green);}
.cf textarea{resize:vertical;min-height:120px;}
.cf-phone-wrap{display:flex;}
.cf-country-selector{position:relative;flex-shrink:0;}
.cf-country-btn{display:flex;align-items:center;gap:7px;background:rgba(255,255,255,.07);border:1.5px solid rgba(255,255,255,.1);border-right:none;border-radius:6px 0 0 6px;padding:0 14px;height:50px;cursor:pointer;font-family:var(--font1);font-size:13px;font-weight:600;color:rgba(255,255,255,.7);white-space:nowrap;transition:background .2s,border-color .2s;min-width:88px;}
.cf-country-btn:hover{background:rgba(255,255,255,.1);}
.cf-country-btn[aria-expanded="true"]{border-color:var(--green);}
.cf-country-flag{font-size:18px;line-height:1;}
.cf-country-dial{font-size:13px;font-weight:700;}
.cf-country-chevron{width:13px;height:13px;flex-shrink:0;transition:transform .25s var(--ease);opacity:.45;margin-left:2px;}
.cf-country-btn[aria-expanded="true"] .cf-country-chevron{transform:rotate(180deg);}
.cf-country-drop{position:absolute;top:calc(100% + 6px);left:0;width:280px;background:#1c202c;border:1.5px solid rgba(255,255,255,.12);border-radius:8px;box-shadow:0 16px 48px rgba(0,0,0,.55);z-index:9999;overflow:hidden;}
.cf-country-search-wrap{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid rgba(255,255,255,.07);}
.cf-country-search-wrap svg{width:14px;height:14px;flex-shrink:0;opacity:.35;}
.cf-country-search{background:none;border:none;outline:none;font-family:var(--font1);font-size:14px;color:#fff;width:100%;}
.cf-country-search::placeholder{color:rgba(255,255,255,.28);}
.cf-country-list{list-style:none;padding:4px 0;max-height:220px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.12) transparent;}
.cf-country-list::-webkit-scrollbar{width:4px;}
.cf-country-list::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:2px;}
.cf-country-list li{display:flex;align-items:center;gap:9px;padding:9px 12px;cursor:pointer;font-size:13px;color:rgba(255,255,255,.65);transition:background .15s;}
.cf-country-list li:hover{background:rgba(255,255,255,.05);}
.cf-country-list li.cf-active{background:rgba(171,188,59,.1);color:var(--green);}
.cf-li-flag{font-size:16px;flex-shrink:0;width:22px;text-align:center;}
.cf-li-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.cf-li-dial{font-size:11px;color:rgba(255,255,255,.3);flex-shrink:0;}
.cf-country-list li.cf-active .cf-li-dial{color:var(--green);}
.cf-phone-input{background:rgba(255,255,255,.05);border:1.5px solid rgba(255,255,255,.1);border-left:none;border-radius:0 6px 6px 0;padding:0 16px;height:50px;font-family:var(--font1);font-size:15px;color:#fff;flex:1;min-width:0;box-sizing:border-box;outline:none;transition:border-color .2s;}
.cf-phone-input::placeholder{color:rgba(255,255,255,.25);}
.cf-phone-input:focus{border-color:var(--green);}
.cf-counter{font-size:12px;color:rgba(255,255,255,.3);text-align:right;margin-top:2px;}
.cf-expand{border:1.5px solid rgba(255,255,255,.1);border-radius:6px;overflow:hidden;}
.cf-expand-toggle{display:flex;align-items:center;gap:10px;width:100%;background:rgba(255,255,255,.04);border:none;padding:14px 18px;cursor:pointer;font-family:var(--font1);font-size:14px;font-weight:700;color:var(--green);transition:background .2s;}
.cf-expand-toggle:hover{background:rgba(255,255,255,.07);}
.cf-expand-chevron{width:16px;height:16px;margin-left:auto;flex-shrink:0;transition:transform .3s var(--ease);}
.cf-expand-toggle.open .cf-expand-chevron{transform:rotate(180deg);}
.cf-expand-body{max-height:0;overflow:hidden;transition:max-height .4s var(--ease);padding:0 18px;}
.cf-expand-body.open{max-height:400px;padding:0 18px 18px;}
.cf-services{display:flex;flex-direction:column;gap:0;margin-top:8px;border:1.5px solid rgba(255,255,255,.1);border-radius:6px;overflow:hidden;}
.cf-svc-item{display:flex;align-items:center;gap:12px;padding:13px 16px;cursor:pointer;transition:background .18s;border-bottom:1px solid rgba(255,255,255,.06);}
.cf-svc-item:last-child{border-bottom:none;}
.cf-svc-item:hover{background:rgba(171,188,59,.06);}
.cf-svc-item input[type="checkbox"]{width:16px;height:16px;accent-color:var(--green);flex-shrink:0;cursor:pointer;}
.cf-svc-item span{font-size:15px;color:rgba(255,255,255,.75);}
.cf-privacy{display:flex;align-items:flex-start;gap:10px;padding:4px 0;}
.cf-privacy input[type="checkbox"]{width:16px;height:16px;accent-color:var(--green);flex-shrink:0;margin-top:2px;cursor:pointer;}
.cf-privacy label{font-size:13px;color:rgba(255,255,255,.4);line-height:1.55;cursor:pointer;}
.cf-submit{background:var(--green);color:var(--dark);font-family:var(--font1);font-size:16px;font-weight:800;padding:0 36px;height:58px;border-radius:6px;border:none;cursor:pointer;width:100%;letter-spacing:.3px;transition:background .22s;}
.cf-submit:hover{background:#c8d84a;}
.cf-row{grid-template-columns:1fr;}

/* ════════════════════════════════════════════════════════
   SECTION 5 · Global responsive / mobile
   ════════════════════════════════════════════════════════ */

/* ── Header: hide desktop nav, show burger ── */
@media(max-width:860px){
  .hdr-nav{display:none!important;}
  #menu-btn{display:flex!important;}
  .hdr-inner{padding:0 20px;}
  .hdr-cta{display:none!important;}
  .hdr-phone{display:none!important;}
}
.hn > li > a::after{display:none!important;}
@media(min-width:861px){.wk-nav{display:none;}.proj-nav{display:none;}}

/* ── Footer responsive ── */
@media(max-width:860px){
  .sf-top,.sft-inner-row{padding-left:28px!important;padding-right:28px!important;}
  .sft-inner-row{flex-direction:column!important;align-items:flex-start!important;gap:16px!important;}
  .sft-right{width:100%!important;}
  
  .fci{padding:40px 28px 32px!important;flex-direction:column!important;gap:32px!important;}
  .fbot{padding:16px 28px!important;flex-direction:column!important;gap:8px!important;text-align:center!important;}
  .flinks{justify-content:center!important;flex-wrap:wrap!important;gap:12px 20px!important;}
}
@media(max-width:480px){
  .sf-top,.sft-inner-row{padding-left:20px!important;padding-right:20px!important;}
  .fci{padding:32px 20px 24px!important;}
  .fbot{padding:14px 20px!important;}
}

/* ── Contact section & form responsive ── */
@media(max-width:860px){
  
  .contact-left > .hl{font-size:clamp(36px,7vw,56px)!important;}
}
@media(max-width:480px){
  .contact-sec{padding:64px 0!important;}
  .cf-row{grid-template-columns:1fr!important;}
}

/* ── Inner padding on mobile ── */
@media(max-width:860px){.inner{padding-left:28px;padding-right:28px;}}
@media(max-width:680px){.inner{padding-left:20px;padding-right:20px;}}

/* ══ INDEX CUSTOM OVERRIDES ══ */

body{overflow:auto!important;overflow-x:hidden;background:var(--dark);}

#hero{height:95vh;max-height:1200px;}

.hero-ring svg{width:100%;height:100%;animation:ring-spin 50s linear infinite;}
@keyframes ring-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}

/* Logo ticker */
.logo-ticker-outer{overflow:hidden;-webkit-mask-image:linear-gradient(to right,transparent 0%,black 8%,black 92%,transparent 100%);mask-image:linear-gradient(to right,transparent 0%,black 8%,black 92%,transparent 100%);}
.logo-ticker{display:flex;align-items:center;width:max-content;animation:logoScroll 32s linear infinite;}
.logo-ticker-outer:hover .logo-ticker{animation-play-state:paused;}
@keyframes logoScroll{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}
.logo-item{display:flex;align-items:center;justify-content:center;padding:0 44px;height:60px;flex-shrink:0;border-right:1px solid rgba(18,21,28,.08);filter:grayscale(1) opacity(.35) brightness(1.4);transition:filter .35s ease;}
.logo-item img{height:40px;width:auto;max-width:140px;display:block;object-fit:contain;}
.logo-item:hover{filter:grayscale(0) opacity(1) brightness(1);}
/* Work section */
.work-hd-row{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:52px;gap:24px;}
.work-view-all{display:flex;align-items:center;gap:8px;font-family:var(--font1);font-size:16px;font-weight:600;color:rgba(255,255,255,.7);white-space:nowrap;text-decoration:none;transition:color .2s;padding-bottom:6px;}
.work-view-all:hover{color:var(--green);}.work-view-all svg{width:18px;height:18px;transition:transform .2s;}.work-view-all:hover svg{transform:translateX(4px);}
.work-cards-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.wk-card{background:#1a1e26;border:1.5px solid rgba(255,255,255,.1);border-radius:10px;overflow:hidden;transition:transform .35s var(--ease),box-shadow .35s,border-color .35s;}
.wk-card:hover{transform:translateY(-6px);box-shadow:0 24px 56px rgba(0,0,0,.55);border-color:rgba(171,188,59,.3);}
.wk-screen{position:relative;aspect-ratio:16/9;overflow:hidden;background:#0d1a0a;}
.wk-screen img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .65s var(--ease);}.wk-card:hover .wk-screen img{transform:scale(1.04);}
.wk-live{position:absolute;top:12px;right:12px;background:var(--green);color:var(--dark);font-family:var(--font1);font-size:12px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;padding:4px 12px;border-radius:20px;}
.wk-body{padding:16px 18px 20px;}.wk-meta{display:flex;align-items:center;gap:10px;margin-bottom:10px;}
.wk-type{font-size:13px;color:rgba(255,255,255,.4);}.wk-badge{background:var(--green);color:var(--dark);font-size:11px;font-weight:800;letter-spacing:1px;text-transform:uppercase;padding:3px 9px;border-radius:4px;}
.wk-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;}.wk-name{font-size:18px;font-weight:800;color:#fff;line-height:1.2;}
.wk-arrow{width:34px;height:34px;border-radius:50%;flex-shrink:0;border:1.5px solid rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.4);transition:all .2s;text-decoration:none;}
.wk-arrow svg{width:14px;height:14px;}.wk-card:hover .wk-arrow{border-color:var(--green);color:var(--green);}
/* GQ slider */.gq-slider-outer:active{cursor:grabbing;}
@media(max-width:860px){.gq-slider .gq{flex:0 0 75vw;width:75vw;}.gq-slider .gq--mid{flex:0 0 75vw;width:75vw;}}.gq-dot{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.2);cursor:pointer;transition:background .2s,transform .2s;}.gq-dot

.contact-left 

.contact-detail svg{width:17px;height:17px;stroke:var(--green);stroke-width:1.8;fill:none;flex-shrink:0;}

.cf input,.cf textarea{background:rgba(255,255,255,.05);border:1.5px solid rgba(255,255,255,.1);border-radius:6px;padding:14px 16px;font-family:var(--font1);font-size:15px;color:#fff;width:100%;box-sizing:border-box;transition:border-color .2s;outline:none;}
.cf input::placeholder,.cf textarea::placeholder{color:rgba(255,255,255,.25);}.cf input:focus,.cf textarea:focus{border-color:var(--green);}
.cf textarea{resize:vertical;min-height:120px;}

.cf-country-btn[aria-expanded="true"]{border-color:var(--green);}

.cf-country-btn[aria-expanded="true"] 

.cf-country-search-wrap svg{width:14px;height:14px;flex-shrink:0;opacity:.35;}

.cf-country-search::placeholder{color:rgba(255,255,255,.28);}

.cf-country-list::-webkit-scrollbar{width:4px;}.cf-country-list::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:2px;}
.cf-country-list li{display:flex;align-items:center;gap:9px;padding:9px 12px;cursor:pointer;font-size:13px;color:rgba(255,255,255,.65);transition:background .15s;}
.cf-country-list li:hover{background:rgba(255,255,255,.05);}.cf-country-list li

.cf-country-list li.cf-active 

.cf-phone-input::placeholder{color:rgba(255,255,255,.25);}

.cf-expand-toggle.open 
.cf-expand-body

.cf-svc-item input[type="checkbox"]{width:16px;height:16px;accent-color:var(--green);flex-shrink:0;cursor:pointer;}.cf-svc-item span{font-size:15px;color:rgba(255,255,255,.75);}

.cf-privacy input[type="checkbox"]{width:16px;height:16px;accent-color:var(--green);flex-shrink:0;margin-top:2px;cursor:pointer;}
.cf-privacy label{font-size:13px;color:rgba(255,255,255,.4);line-height:1.55;cursor:pointer;}

.sft-copy
.sft-copy

.flogo span{color:var(--green);}

.fsoc a{width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;transition:all .22s;}
.fsoc a:hover{border-color:var(--green);background:rgba(171,188,59,.06);}
.fnav h5{font-size:11px;font-weight:700;letter-spacing:3.5px;text-transform:uppercase;color:rgba(255,255,255,.45)!important;margin-bottom:18px;}

@media(max-width:900px){.work-cards-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:560px){.work-cards-grid{grid-template-columns:1fr;}.work-hd-row{flex-direction:column;align-items:flex-start;}}

@media(max-width:580px){#hero{height:auto;min-height:95svh;}}
#page-wrap #footer{min-height:auto!important;scroll-snap-align:none!important;}

/* Hero left-align */

.eyebrow,.hero-hl,

/* ── Index works carousel (mobile) ── */
@media(max-width:860px){
  #work
  #work 
  .work-cards-grid{
    display:flex!important;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    scroll-behavior:smooth;
    -webkit-overflow-scrolling:touch;
    gap:14px;
    padding:0 0 16px 0;
    scrollbar-width:none;
    margin-left:-24px;
    margin-right:-24px;
    padding-left:24px;
  }
  .work-cards-grid::-webkit-scrollbar{display:none;}
  .wk-card{
    flex:0 0 98%!important;
    scroll-snap-align:start;
    max-width:none;
    min-width:0;
  }
  
  .wk-prev-btn,.wk-next-btn{
    width:48px;height:48px;
    border-radius:50%;
    background:rgba(255,255,255,.08);
    border:1.5px solid rgba(255,255,255,.25);
    display:flex;align-items:center;justify-content:center;
    cursor:pointer;flex-shrink:0;
    color:#fff;
    transition:background .2s,border-color .2s;
  }
  .wk-prev-btn:hover,.wk-next-btn:hover{
    background:var(--green);border-color:var(--green);color:var(--dark);
  }
  .wk-prev-btn svg,.wk-next-btn svg{stroke:currentColor;}
}
@media(max-width:680px){
  .work-cards-grid{margin-left:-20px;margin-right:-20px;padding-left:20px;}
}

/* ════════════════════════════════════════════
   SHARED MOBILE — injected on all 7 pages
   ════════════════════════════════════════════ */

/* ── Header: hide nav, show burger on mobile ── */
@media(max-width:860px){
  
  #menu-btn{display:flex!important;}
  
  
  
}

/* ── Nav underline off ── */
.hn > li > a::after{display:none!important;}

/* ════════════════════════════════════════════
   INDEX PAGE RESPONSIVE EXTRAS
   ════════════════════════════════════════════ */

/* ════════════════════════════════════════════
   FOOTER RESPONSIVE
   ════════════════════════════════════════════ */
@media(max-width:860px){
  .sf-top,
  
  
  
  
  
  
}
@media(max-width:480px){
  .sf-top,
  
  
}

/* ── Index: Efficiency Analysis section ── */

/* ── Index: Work section header ── */
@media(max-width:680px){
  .work-hd-row{flex-direction:column!important;align-items:flex-start!important;gap:20px!important;}
  .work-cards-grid{grid-template-columns:1fr 1fr!important;}
}
@media(max-width:480px){
  .work-cards-grid{grid-template-columns:1fr!important;}
}
/* ── Index: values section mobile ── */

/* ── Index: snap sections padding ── */
@media(max-width:680px){
  .snap 
  #hero 
}
/* ── Process section (index) ── */
@media(max-width:680px){
  
  
  .proc-right p{font-size:14px!important;}
}

/* ══ CLIENTS SECTION ══ */
.ab-sec{padding:96px 0;position:relative;overflow:hidden;}
.ab-white{background:#fff;}
#clients{background:#fff;}

/* ══ EFFICIENCY BARS (Traditional vs Dekada) ══ */

.cmpd-row

/* ══ PROCESS SECTION — proc-top ══ */
#process{background:var(--white);}

/* ══ MOBILE RESPONSIVE FIXES ══ */
@media(max-width:900px){
  
  .ab-sec 
}
@media(max-width:680px){
  .ab-sec{padding:72px 0;}
  .ab-sec 
  
  /* Process: proc-top stacks */
  
  
  
}
@media(max-width:480px){
  .ab-sec{padding:56px 0;}
}

/* ══ INDEX CUSTOM CSS (mobile + extra overrides) ══ */
/*
 * ═══════════════════════════════════════════════════════
 *  DEKADA DIGITAL — Custom Overrides  (final_index_home_custom.css)
 *  All changes to the design live here.
 *  Base CSS is frozen in the two <style> blocks inside the HTML.
 * ═══════════════════════════════════════════════════════
 */

/* ══ SCROLL + BODY ══ */
body{overflow:auto!important;overflow-x:hidden;background:var(--dark);}

/* ══ HERO ══ */
#hero{height:95vh;max-height:1200px;}
.hero-c{position:relative;z-index:2;text-align:left;padding-bottom:60px;}
.hero-btns{display:flex;align-items:center;gap:28px;justify-content:flex-start;flex-wrap:wrap;opacity:0;animation:fu .9s .82s var(--ease) forwards;}

/* ══ HERO RING ══ */
.hero-ring{position:absolute;top:200px;right:6%;transform:none;width:220px;height:220px;z-index:1;pointer-events:none;}
.hero-ring svg{width:100%;height:100%;animation:ring-spin 50s linear infinite;}
@keyframes ring-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
.hero-ring-inner{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:2px;}
.hri-top{font-size:9px;font-weight:600;letter-spacing:5px;text-transform:uppercase;color:rgba(255,255,255,.45);line-height:1.2;font-family:var(--font1);}
.hri-mid{font-size:17px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--green);line-height:1.2;font-family:var(--font1);}
.hri-num{font-size:48px;font-weight:900;letter-spacing:-2px;color:var(--green);line-height:1;font-family:var(--font1);}
.hri-sub{font-size:17px;font-weight:700;letter-spacing:4px;text-transform:uppercase;color:rgba(255,255,255,.9);line-height:1.2;font-family:var(--font1);}

/* ══ SERVICES 2×2 ══ */
.srv-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;width:100%;}
.sc{background:var(--dark2);padding:42px 38px;border-radius:10px;position:relative;overflow:hidden;transition:background .3s;cursor:default;}

/* ══ EFFICIENCY BARS ══ */
.cmpd-bar{width:100%;height:14px;background:rgba(18,21,28,.07);border-radius:7px;overflow:hidden;}
.cmpd-fill{height:100%;width:0%;border-radius:7px;transition:width 1.4s cubic-bezier(.16,1,.3,1);}

/* ══ TESTIMONIALS — quote font + author split ══ */

/* ══ CLIENT LOGOS ══ */
.logo-item img{height:56px;width:auto;max-width:196px;display:block;object-fit:contain;}
.logo-ticker-outer{padding:40px 0;overflow:hidden;
  -webkit-mask-image:linear-gradient(to right,transparent 0%,black 8%,black 92%,transparent 100%);
  mask-image:linear-gradient(to right,transparent 0%,black 8%,black 92%,transparent 100%);}

/* ══ HEADER — burger (hidden desktop, 3-line mobile) ══ */
.hdr-menu-btn{display:none;align-items:center;justify-content:center;width:40px;height:40px;border-radius:8px;background:rgba(255,255,255,.08);border:none;color:#fff;cursor:pointer;transition:background .2s;}
.hdr-menu-btn:hover{background:rgba(255,255,255,.15);}
.burger-label{display:none;}
.burger{display:flex;flex-direction:column;gap:5px;width:22px;flex-shrink:0;}
.burger span{display:block;height:2px;background:currentColor;border-radius:2px;transition:all .32s var(--ease);transform-origin:left center;}
.burger span:nth-child(1){width:22px;}
.burger span:nth-child(2){width:15px;}
.burger span:nth-child(3){width:9px;}
#menu-btn.open .burger span:nth-child(1){transform:translateY(7px) rotate(45deg);width:22px;}
#menu-btn.open .burger span:nth-child(2){opacity:0;transform:scaleX(0);}
#menu-btn.open .burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);width:22px;}

/* ══ FOOTER — EMAIL US supra + email size ══ */
.sft-inner-row{max-width:var(--content);margin:0 auto;padding:44px 60px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:12px;width:100%;box-sizing:border-box;}
.sft-brand{font-family:var(--font1);font-size:11px;font-weight:700;letter-spacing:4px;text-transform:uppercase;color:rgba(255,255,255,.5);}
.sft-email{font-size:clamp(32px,5vw,72px)!important;letter-spacing:-2px;line-height:1.1;}

/* ══ SECTION HEADINGS — uniform across all sections ══ */
#values .hl,#clients .hl,#services .hl,#about .hl,
#work .hl,#process .hl,#testi .grow-headline,#contact .hl{
  font-size:clamp(38px,5vw,66px)!important;
  letter-spacing:-2px;line-height:1.05;
}
.hl--big{font-size:90px!important;}

/* ══ LAYOUT HELPERS (no inline styles in HTML) ══ */
.sec-inner{position:relative;z-index:2;}
.sec-inner--96{padding:96px 0;}
.sec-inner--96-80{padding:96px 0 80px;}
.sec-inner--96-48{padding:96px 0 48px;}
.sec-inner--80{padding:80px 0;}
.sec-inner--c{text-align:center;}
.sec-inner-hero{flex:1;display:flex;align-items:center;}
.bg-topo{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;opacity:.55;}
.bg-ring{position:absolute;top:-10px;right:-10px;width:460px;height:460px;overflow:hidden;pointer-events:none;z-index:0;}
.bg-ring--bot{top:auto;bottom:-10px;}
.wave-div{position:absolute;left:0;right:0;height:64px;pointer-events:none;z-index:0;}
.wave-div--top{top:0;}
.wave-div--bot{bottom:0;}
.sm-dark{display:block;color:var(--dark);}
.sm-white{display:block;color:#fff;margin-top:4px;}
.sm-muted{color:rgba(255,255,255,.55);}
.hl-block{display:block;margin-top:4px;line-height:1.1;}
.hl-dark{color:var(--dark);display:block;}
.hl-white{color:#fff;margin-top:0;line-height:1;}
.sec-desc{font-size:17px;color:var(--mutedLight);line-height:1.75;max-width:560px;margin-top:24px;}
.sec-desc--centered{margin:20px auto 44px;text-align:center;}
.mt-40{margin-top:40px;}
.mt-44{margin-top:44px;}
.mt-form{margin-top:16px;}
.proc-line--hidden{height:0;display:none;}
.proc-line--flex{flex:1;}
.proc-line--sm{height:24px;}
.proc-line--lg{height:40px;flex:0 0 40px;}
.contact-intro{font-size:16px;color:rgba(255,255,255,.5);line-height:1.7;margin-top:20px;max-width:400px;}
.contact-details{display:flex;flex-direction:column;gap:10px;margin-top:32px;}
.form-note{margin-top:14px;font-size:13px;color:rgba(255,255,255,.3);text-align:center;line-height:1.5;}

/* ══ MOBILE RESPONSIVE ══ */
@media(max-width:860px){
  /* Header */
  .hdr-nav{display:none!important;}
  #menu-btn{display:flex!important;}
  .hdr-inner{padding:0 20px;}
  .hdr-cta{display:none!important;}
  /* Inner breathing room */
  .inner{padding-left:24px;padding-right:24px;}
  /* Hero */
  #hero{height:auto;min-height:95svh;}
  .hero-ring{display:none!important;}
  .hero-c{padding-bottom:40px;}
  .hero-btns{flex-direction:column;align-items:flex-start;gap:16px;}
  .hl--big{font-size:clamp(42px,10vw,72px)!important;}
  /* Section headings scale */
  #values .hl,#clients .hl,#services .hl,#about .hl,
  #work .hl,#process .hl,#testi .grow-headline,#contact .hl{font-size:clamp(30px,7vw,54px)!important;}
  /* Section padding */
  .sec-inner--96,.sec-inner--96-80,.sec-inner--96-48{padding:60px 0;}
  .sec-inner--80{padding:48px 0;}
  /* Values */
  .vals{grid-template-columns:1fr;gap:40px;}
  /* Clients */
  .logo-ticker-outer{padding:28px 0;}
  /* Services */
  .srv-hd{flex-direction:column;gap:12px;}
  /* About */
  .about{grid-template-columns:1fr;gap:40px;}
  .about-vis{min-height:240px;}
  /* Work — single card 89% + 10% peek */
  .work-hd-row{flex-direction:column;align-items:flex-start;gap:16px;}
  .work-cards-grid{display:flex!important;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;gap:16px;padding:0 24px 16px;scrollbar-width:none;-ms-overflow-style:none;}
  .work-cards-grid::-webkit-scrollbar{display:none;}
  .wk-card{flex:0 0 98%!important;scroll-snap-align:start;max-width:none;}
  .wk-nav{display:none;}
  /* Process — keep proc-left + proc-mid visible */
  .proc-top{grid-template-columns:1fr;gap:24px;margin-bottom:40px;}
  .proc-row{grid-template-columns:140px 56px 1fr;}
  .proc-name{font-size:clamp(22px,5vw,34px);}
  /* Testimonials */
  .grow-top{padding:0;}
  .grow-headline{font-size:clamp(32px,8vw,56px)!important;}
  /* Contact */
  .contact-wrap{grid-template-columns:1fr!important;gap:40px!important;}
  /* Footer */
  .sft-inner-row{padding:32px 24px;}
  .sft-email{font-size:clamp(28px,8vw,52px)!important;white-space:normal;word-break:break-word;}
  .fqi{padding:40px 24px 32px;}
  .fci{padding:36px 24px 28px;grid-template-columns:1fr 1fr;}
  .fbot{padding:14px 24px;flex-direction:column;align-items:flex-start;gap:8px;}
}
@media(max-width:580px){
  .inner{padding-left:20px;padding-right:20px;}
  .work-cards-grid{padding:0 20px 16px;}
  .wk-card{flex:0 0 98%!important;}
  .proc-row{grid-template-columns:110px 44px 1fr;}
  .proc-name{font-size:20px;}
  .proc-right p{font-size:14px;}
  .proc-right{padding-left:20px;}
  .srv-grid{grid-template-columns:1fr;}
  .fci{grid-template-columns:1fr;gap:28px;}
  .sft-inner-row{padding:28px 20px;}
  #values .hl,#clients .hl,#services .hl,#about .hl,
  #work .hl,#process .hl,#testi .grow-headline,#contact .hl{font-size:clamp(26px,8vw,44px)!important;}
}
@media(min-width:861px){.wk-nav{display:none;}.proj-nav{display:none;}}

/* ══ ABOUT + WORK PAGES (scoped to #page-wrap) ══ */

body{overflow:auto!important;overflow-x:hidden;background:var(--dark);}
/* Hero */
.pk-hero{background:var(--dark);padding:140px 0 80px;position:relative;overflow:hidden;}
.pk-hero::before{content:'';position:absolute;inset:0;z-index:0;background-image:linear-gradient(rgba(171,188,59,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(171,188,59,.018) 1px,transparent 1px);background-size:90px 90px;}
.pk-hero-inner{max-width:var(--content);margin:0 auto;padding:0 60px;position:relative;z-index:2;}
.pk-hero-hl{font-size:clamp(52px,8vw,110px);font-weight:900;letter-spacing:-3px;line-height:.95;color:#fff;margin:12px 0 32px;}
.pk-hero-hl em{color:var(--green);font-style:italic;font-family:var(--font2);font-weight:400;}

/* Filter */
.pk-filter-wrap{background:var(--dark);border-bottom:1px solid rgba(255,255,255,.07);position:sticky;top:0;z-index:20;}
.pk-filter-inner{max-width:var(--content);margin:0 auto;padding:0 60px;display:flex;align-items:center;gap:8px;overflow-x:auto;scrollbar-width:none;}
.pk-filter-inner::-webkit-scrollbar{display:none;}
.pk-filter-btn{display:flex;align-items:center;gap:7px;padding:18px 18px;background:none;border:none;cursor:pointer;font-family:var(--font1);font-size:13px;font-weight:700;letter-spacing:.5px;color:rgba(255,255,255,.4);border-bottom:2px solid transparent;white-space:nowrap;transition:color .2s,border-color .2s;flex-shrink:0;}
.pk-filter-btn:hover{color:rgba(255,255,255,.8);}.pk-filter-btn
.pk-filter-count{background:rgba(171,188,59,.15);color:var(--green);font-size:11px;font-weight:700;padding:2px 7px;border-radius:10px;}
.pk-filter-btn.active .pk-filter-count{background:var(--green);color:var(--dark);}
/* Grid */
.pk-section{padding:64px 0 96px;background:var(--dark);}
.pk-grid-wrap{max-width:var(--content);margin:0 auto;padding:0 60px;}
.pk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.pk-grid-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:36px;}
.pk-grid-count{font-size:13px;color:rgba(255,255,255,.3);}
.pk-empty{grid-column:1/-1;text-align:center;padding:80px 20px;color:rgba(255,255,255,.3);font-size:16px;display:none;}
/* Card */
.pk-card{background:#1a1e26;border:1.5px solid rgba(255,255,255,.08);border-radius:10px;overflow:hidden;transition:border-color .3s;}
.pk-card:hover{border-color:rgba(171,188,59,.25);}
.pk-card.pk-hidden{display:none;}
.pk-screen{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--dark2);}
.pk-screen img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .65s var(--ease);}.pk-card:hover .pk-screen img{transform:scale(1.04);}
.pk-live{position:absolute;top:12px;right:12px;background:var(--green);color:var(--dark);font-size:11px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;padding:4px 12px;border-radius:20px;}
.pk-meta{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:12px;}
.pk-type{font-size:12px;color:rgba(255,255,255,.35);flex-shrink:0;}
.pk-tag{font-size:10px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;background:rgba(171,188,59,.12);color:var(--green);padding:3px 8px;border-radius:4px;white-space:nowrap;}
.pk-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;text-decoration:none;}
.pk-name{font-size:18px;font-weight:800;color:#fff;line-height:1.15;margin-bottom:2px;}.pk-sub{font-size:13px;color:rgba(255,255,255,.35);}
.pk-arrow{width:34px;height:34px;border-radius:50%;flex-shrink:0;border:1.5px solid rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.3);transition:all .2s;}
.pk-arrow svg{width:14px;height:14px;}.pk-card:hover .pk-arrow{border-color:var(--green);color:var(--green);}

.contact-left 

.contact-detail svg{width:17px;height:17px;stroke:var(--green);stroke-width:1.8;fill:none;flex-shrink:0;}

.cf input,.cf textarea{background:rgba(255,255,255,.05);border:1.5px solid rgba(255,255,255,.1);border-radius:6px;padding:14px 16px;font-family:var(--font1);font-size:15px;color:#fff;width:100%;box-sizing:border-box;transition:border-color .2s;outline:none;}
.cf input::placeholder,.cf textarea::placeholder{color:rgba(255,255,255,.25);}.cf input:focus,.cf textarea:focus{border-color:var(--green);}
.cf textarea{resize:vertical;min-height:120px;}

.cf-phone input{border-radius:0 6px 6px 0!important;}

.cf-expand-toggle.open 
.cf-expand-body

.cf-svc-item input[type="checkbox"]{width:16px;height:16px;accent-color:var(--green);flex-shrink:0;cursor:pointer;}.cf-svc-item span{font-size:15px;color:rgba(255,255,255,.75);}

.cf-privacy input[type="checkbox"]{width:16px;height:16px;accent-color:var(--green);flex-shrink:0;margin-top:2px;cursor:pointer;}
.cf-privacy label{font-size:13px;color:rgba(255,255,255,.4);line-height:1.55;cursor:pointer;}

.fnav h5{font-size:11px;font-weight:700;letter-spacing:3.5px;text-transform:uppercase;color:rgba(255,255,255,.45)!important;margin-bottom:18px;}

@media(max-width:1100px){.pk-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:680px){.pk-hero-inner,.pk-grid-wrap{padding-left:24px;padding-right:24px;}.pk-filter-inner{padding-left:24px;}.pk-grid{grid-template-columns:1fr;}}
#page-wrap #page-wrap #footer{min-height:auto!important;scroll-snap-align:none!important;}
 50%{transform:rotate(180deg) translateY(-12px)}

/* Stagger each ring so they draw one after another */

/* When section enters view: draw the lines */

/* ══════════════════════════════════════
   RESPONSIVE — SHARED ACROSS ALL PAGES
   ══════════════════════════════════════ */

/* ── 1100px — large tablet / small laptop ── */
@media(max-width:1100px){
  
  /* Service page heroes */
  
  .hero-img-col{height:45vh;order:-1;}
  .hero-text-col{padding:36px 40px 52px;}
  /* Index hero */
  
  .hero-ring-col{display:none;}
  /* Values section */
  
  
  /* Features grid */
  .feat-grid{grid-template-columns:1fr 1fr;gap:1px;}
  /* Project grids */
  .proj-grid{grid-template-columns:1fr 1fr;}
  .work-cards-grid{grid-template-columns:1fr 1fr;}
  /* Service cards */
  
  /* FAQ grid */
  .lfaq-grid > div:first-child,.lfaq-grid > div:last-child{width:100%;}
  [style*="grid-template-columns:1fr 1fr"]{grid-template-columns:1fr!important;}
  /* Comparison */
  
  /* Stats bar */
  
  /* About hero */
  .ab-hero-sub{grid-template-columns:1fr;gap:40px;}
  .ab-hero-stats{align-items:flex-start;text-align:left;}
  .ab-vals-grid{grid-template-columns:1fr 1fr;}
  .tm-grid{grid-template-columns:1fr 1fr;}
  /* Portfolio */
  .pk-grid{grid-template-columns:1fr 1fr;}
}

/* ── 860px — tablet ── */
@media(max-width:860px){
  
  .hero-text-col{padding:32px 28px 48px;}
  /* Work/project grids go single col */
  .work-cards-grid{grid-template-columns:1fr 1fr;}
  .wk-card .wk-screen{aspect-ratio:16/10;}
  /* Testimonial slider */
  
  
  
  /* Logo ticker items */
  .logo-item{padding:0 28px;}
  /* pk filter */
  .pk-filter-inner{padding-left:28px;}
  .pk-grid-wrap{padding-left:28px;padding-right:28px;}
  /* Hero stats in about */
  .ab-hero-inner{padding:0 28px;}
}

/* ── 680px — mobile ── */
@media(max-width:680px){
  /* Base */
  
  /* Service hero */
  .hero-text-col{padding:28px 20px 44px;}
  .hero-img-col{height:38vh;}
  .pg-bc{font-size:11px;}
  /* Headings */
  .hl,
  /* Index hero */
  #page-wrap #hero{height:auto;min-height:95svh;}
  
  
  /* Services grid */
  
  
  /* Values */
  
  /* Work section */
  .work-hd-row{flex-direction:column;align-items:flex-start;gap:16px;}
  .work-cards-grid{grid-template-columns:1fr;}
  .wk-card .wk-name{font-size:16px;}
  /* Features */
  .feat-grid{grid-template-columns:1fr;}
  .feat-card{padding:28px 22px;}
  /* Project grids */
  .proj-grid{grid-template-columns:1fr;}
  /* Process */
  
  
  
  
  
  .proc-right p{font-size:14px;}
  /* FAQ */
  .lfaq-body{padding-right:8px;}
  .lfaq-q{font-size:15px;}
  /* Comparison */
  
  /* GQ slider */
  
  
  
  
  /* Testimonials nav */
  
  /* Work nav */
  .work-hd-row{padding:0;}
  /* Contact */
  
  
  /* Stats */
  
  
  .ab-vals-grid{grid-template-columns:1fr;}
  .tm-grid{grid-template-columns:1fr 1fr;}
  .ab-hero-inner{padding:0 20px;}
  .ab-hero-hl{font-size:clamp(40px,12vw,72px);letter-spacing:-2px;}
  .ab-hero-stats{gap:20px;}
  /* Portfolio */
  .pk-grid{grid-template-columns:1fr;}
  .pk-filter-inner{padding-left:16px;}
  .pk-grid-wrap{padding-left:20px;padding-right:20px;}
  .pk-hero-inner{padding:0 20px;}
  
  /* Logo ticker */
  .logo-item{padding:0 20px;}
  /* Section headings */
  .pg-hero-bar p{font-size:10px;letter-spacing:2.5px;}
  /* About page sections */
  .ab-sec 
  /* Proc letstalk btn */
  .proc-letstalk{padding:0 18px!important;height:46px!important;font-size:14px!important;}
}

/* ── 480px — small mobile ── */
@media(max-width:480px){
  .tm-grid{grid-template-columns:1fr;}
  
  .feat-grid{grid-template-columns:1fr;}
  .work-cards-grid,
  
  
  
.cf-coun}

.cf-country-btn[aria-expanded="true"] 

.cf-country-list li.cf-active 

/* ── Portfolio cards — vertical image card ── */
.pk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.pk-card{
  background:#13161f;
  border-radius:16px;
  overflow:hidden;
  position:relative;
  cursor:pointer;
  transition:border-color .3s;
  border:1px solid rgba(255,255,255,.06);
}
.pk-card:hover{box-shadow:none;}
.pk-card.pk-hidden{display:none;}
/* Image area */
.pk-img-wrap{
  position:relative;
  width:100%;
  aspect-ratio:4/4.14;
  overflow:hidden;
  background:var(--dark2);
}
.pk-img-wrap img{
  width:100%;height:100%;
  object-fit:cover;display:block;
  transition:transform .65s var(--ease);
}
.pk-card:hover .pk-img-wrap img{transform:scale(1.05);}
/* Gradient overlay on image */
.pk-img-wrap::after{
  content:'';
  position:absolute;inset:0;
  background:linear-gradient(to bottom,transparent 40%,rgba(13,16,25,.85) 100%);
  z-index:1;
  pointer-events:none;
}
/* Logo on image — top left */

/* Badge on image — bottom left */
.pk-img-badge{
  position:absolute;bottom:16px;left:16px;z-index:2;
  background:rgba(0,0,0,.55);
  backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.12);
  border-radius:20px;
  padding:5px 13px;
  font-size:12px;font-weight:700;
  color:#fff;white-space:nowrap;
}
/* Placeholder when no image */
.pk-img-placeholder{
  width:100%;height:100%;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#1a1e2a,#0d1020);
}
/* Card body — below image */

.pk-meta{display:flex;align-items:center;gap:8px;margin-bottom:10px;flex-wrap:wrap;}
.pk-tag{font-size:10px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;background:rgba(171,188,59,.12);color:var(--green);padding:3px 8px;border-radius:4px;}
.pk-type{font-size:12px;color:rgba(255,255,255,.35);}
.pk-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;text-decoration:none;}
.pk-name{font-size:20px;font-weight:800;color:#fff;line-height:1.15;display:block;}
.pk-sub{font-size:13px;color:rgba(255,255,255,.35);display:block;margin-top:3px;}
.pk-arrow{width:36px;height:36px;border-radius:50%;flex-shrink:0;border:1.5px solid rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.3);transition:all .2s;}
.pk-arrow svg{width:14px;height:14px;}
.pk-card:hover .pk-arrow{border-color:var(--green);color:var(--green);}
/* Hero stats */

/* Testimonials on ourwork */

/* Responsive */
@media(max-width:1100px){.pk-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:680px){
  .pk-grid{grid-template-columns:1fr;}
  .pk-name{font-size:18px;}
  .pk-hero-inner{padding:0 20px;}
  .pk-filter-inner{padding-left:16px;}
  .pk-grid-wrap{padding-left:20px;padding-right:20px;}
}

/* ── Hero (service-page style) ── */
.pk-hero{
  background:var(--dark);
  min-height:60vh;
  display:flex;align-items:flex-end;
  padding:140px 0 80px;
  position:relative;overflow:hidden;
}
.pk-hero::before{
  content:'';position:absolute;inset:0;z-index:0;
  background-image:linear-gradient(rgba(171,188,59,.02) 1px,transparent 1px),linear-gradient(90deg,rgba(171,188,59,.02) 1px,transparent 1px);
  background-size:90px 90px;
}
.pk-hero-inner{max-width:var(--content);margin:0 auto;padding:0 60px;}
/* Breadcrumb */
.pg-bc{display:flex;align-items:center;gap:8px;font-size:12px;color:rgba(255,255,255,.3);margin-bottom:20px;flex-wrap:wrap;}
.pg-bc a{color:rgba(255,255,255,.3);transition:color .2s;text-decoration:none;}.pg-bc a:hover{color:var(--green);}
.pg-bc-sep{color:rgba(255,255,255,.15);}
/* Stats — 50% smaller */

/* Card body fade */

/* Remove logo overlay */

/* ── Testimonials (from index) ── */

.grow-headline em{color:var(--green);font-style:normal;}

.grow-subtext em{font-style:italic;color:rgba(200,200,200,.65);}

.grow-statement em{color:var(--green);font-style:normal;}

.grow-top,

@media(max-width:860px){.pk-hero{padding:120px 0 60px;}.pk-hero-inner{padding:0 28px;}}
@media(max-width:680px){.pk-hero{padding:110px 0 52px;}.pk-hero-inner{padding:0 20px;}}

/* ── Definitive overrides ── */

/* ── Portfolio page final rules ── */

.pk-body{position:relative;padding:20px 22px 22px;background:linear-gradient(to top,#13161f 60%,rgba(13,16,25,0) 100%);margin-top:-56px;z-index:2;}
.pk-img-logo{display:none;}

/* ── pk-stats: 50% smaller ── */

/* ── Testimonials section ── */
.pk-testi{background:var(--dark);padding:96px 0;position:relative;overflow:hidden;}

.gq-slider 
.gq-slider 
.gq-slider .gq
.gq-slider .gq 
.gq-slider 
.gq-slider .gq
.gq-dot

.wnav-btn svg{width:18px;height:18px;stroke:#fff;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;transition:stroke .2s;}

.wnav-btn:hover svg{stroke:var(--dark);}

/* ── Stats: no border-top, 30% bigger numbers ── */
.pk-stats{display:flex;align-items:center;gap:32px;margin-top:28px;flex-wrap:wrap;}
.pk-stat-val{font-size:clamp(16px,1.8vw,22px);font-weight:900;letter-spacing:-.5px;color:#fff;line-height:1;display:block;}
.pk-stat-lbl{font-size:9px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--green);margin-top:5px;display:block;}
.pk-stat-div{width:1px;height:22px;background:rgba(255,255,255,.15);flex-shrink:0;}

/* ── Testimonials white version ── */
.pk-testi-white{background:#fff!important;}
.pk-testi-white 
.pk-testi-white 
.pk-testi-white .grow-headline em{color:var(--green)!important;}
.pk-testi-white 
.pk-testi-white 
.pk-testi-white 
.pk-testi-white 
.pk-testi-white .gq-slider 
.pk-testi-white .gq-slider .gq
.pk-testi-white .gq-slider .gq 
.pk-testi-white 
.pk-testi-white 
.pk-testi-white .wnav-btn svg{stroke:var(--dark)!important;}
.pk-testi-white 
.pk-testi-white .wnav-btn:hover svg{stroke:var(--dark)!important;}
.pk-testi-white .gq-dot{background:rgba(0,0,0,.2)!important;}
.pk-testi-white .gq-dot
@media(max-width:680px){.pk-stats{gap:20px;}.pk-stat-div{height:18px;}}

/* ── Dot band divider ── */
.pk-dot-divider{
  position:relative;
  width:100%;
  height:120px;
  background:#fff;
  overflow:hidden;
}

/* ── Country phone selector ── */

.cf-country-btn[aria-expanded="true"]{border-color:var(--green);background:rgba(171,188,59,.06);}

.cf-country-btn[aria-expanded="true"] 

.cf-country-search-wrap svg{width:14px;height:14px;flex-shrink:0;opacity:.35;}

.cf-country-search::placeholder{color:rgba(255,255,255,.28);}

.cf-country-list::-webkit-scrollbar{width:4px;}
.cf-country-list::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:2px;}
.cf-country-list li{display:flex;align-items:center;gap:9px;padding:9px 12px;cursor:pointer;font-size:13px;color:rgba(255,255,255,.65);transition:background .15s;}
.cf-country-list li:hover{background:rgba(255,255,255,.05);}
.cf-country-list li

.cf-country-list li.cf-active 

.cf-phone-input::placeholder{color:rgba(255,255,255,.25);}

/* Mega menu — direct link items (no sub-panel) */
a.mm-nav-item.mm-nav-link{
  display:flex;align-items:center;
  text-decoration:none;
  cursor:pointer;
}
a.mm-nav-item.mm-nav-link:hover 

.hn > li > a::after{display:none!important;}

/* ══ About page ══ */
.ab-hero{background:var(--dark);min-height:72vh;display:flex;align-items:flex-end;padding:140px 0 80px;position:relative;overflow:hidden;}
.ab-hero::before{content:'';position:absolute;inset:0;z-index:0;background-image:linear-gradient(rgba(171,188,59,.02) 1px,transparent 1px),linear-gradient(90deg,rgba(171,188,59,.02) 1px,transparent 1px);background-size:90px 90px;}
.ab-hero-sub{display:grid;grid-template-columns:1fr 1fr;gap:60px;margin-top:32px;align-items:start;}
.ab-hero-desc{font-size:17px;color:rgba(255,255,255,.5);line-height:1.75;}
.ab-hero-stats{display:flex;flex-direction:column;gap:24px;align-items:flex-end;text-align:right;}
.ab-stat-val{font-size:clamp(36px,5vw,60px);font-weight:900;letter-spacing:-2px;color:#fff;line-height:1;display:block;}
.ab-stat-val em{color:var(--green);font-style:normal;}
.ab-stat-lbl{font-size:11px;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:rgba(255,255,255,.35);margin-top:4px;display:block;}
.ab-sec{padding:96px 0;position:relative;overflow:hidden;}
.ab-dark{background:var(--dark);}.ab-white{background:#fff;}
.ab-vals-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:48px;}
.ab-val{background:rgba(255,255,255,.04);border:1.5px solid rgba(255,255,255,.08);border-radius:10px;padding:28px 24px;transition:border-color .3s,background .3s;}
.ab-val:hover{border-color:rgba(171,188,59,.3);background:rgba(255,255,255,.06);}
.tm-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:48px;}
.tm-card{background:rgba(255,255,255,.04);border:1.5px solid rgba(255,255,255,.08);border-radius:10px;padding:28px 22px;text-align:center;transition:border-color .3s,transform .3s var(--ease);}
.tm-card:hover{border-color:rgba(171,188,59,.3);transform:translateY(-4px);}
.tm-avatar{width:68px;height:68px;border-radius:50%;background:rgba(171,188,59,.12);border:2px solid rgba(171,188,59,.3);display:flex;align-items:center;justify-content:center;margin:0 auto 14px;}
.tm-initials{font-size:22px;font-weight:900;color:var(--green);}
.tm-name{font-size:16px;font-weight:700;color:#fff;margin-bottom:4px;}
.tm-role{font-size:11px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--green);margin-bottom:10px;}
.tm-bio{font-size:12px;color:rgba(255,255,255,.4);line-height:1.6;}
@media(max-width:1100px){.ab-hero-sub{grid-template-columns:1fr;gap:32px;}.ab-hero-stats{align-items:flex-start;text-align:left;flex-direction:row;flex-wrap:wrap;gap:28px;}.ab-vals-grid{grid-template-columns:1fr 1fr;}.tm-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:680px){.ab-hero{padding:110px 0 60px;}.ab-vals-grid{grid-template-columns:1fr;}.tm-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:480px){.tm-grid{grid-template-columns:1fr;}}

/* ═══ ABOUT PAGE: override index-page ID selectors that set white bg ═══ */
#page-wrap #values  { background: #12151c !important; }
#team    { background: #12151c !important; }
#mission { background: #ffffff !important; }
#page-wrap #clients { background: #ffffff !important; }
#page-wrap #hero    { background: #12151c !important; min-height: 72vh !important; }

/* ═══ Dark section text always readable ═══ */
#page-wrap #values .hl, #page-wrap #values h1, #page-wrap #values h2, #page-wrap #values h3, #page-wrap #values h4 { color: #fff !important; }
#page-wrap #values 
#page-wrap #values 
#page-wrap #values .ab-val h4 { color: #fff !important; }
#page-wrap #values .ab-val p  { color: rgba(255,255,255,.5) !important; }
#page-wrap #values 
#page-wrap #values .iw svg    { stroke: #fff !important; }
#team .hl, #team h1, #team h2, #team h3 { color: #fff !important; }
#team 
#team 

/* ═══ Logo ticker — missing from base ═══ */
.logo-ticker-outer {
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 8%, black 92%, transparent 100%);
  mask-image: linear-gradient(to right, transparent 0%, black 8%, black 92%, transparent 100%);
}
.logo-ticker {
  display: flex !important;
  align-items: center;
  width: max-content;
  animation: logoScroll 32s linear infinite;
}
.logo-ticker-outer:hover .logo-ticker { animation-play-state: paused; }
@keyframes logoScroll { 0%{transform:translateX(0);} 100%{transform:translateX(-50%);} }
.logo-item {
  display: flex !important;
  align-items: center;
  justify-content: center;
  padding: 0 44px !important;
  height: 60px;
  flex-shrink: 0;
  border-right: 1px solid rgba(18,21,28,.08);
  filter: grayscale(1) opacity(.35) brightness(1.4);
  transition: filter .35s;
  min-width: unset !important;
  width: auto !important;
}
.logo-item img {
  height: 40px;
  width: auto;
  max-width: 140px;
  display: block;
  object-fit: contain;
}
.logo-item:hover { filter: grayscale(0) opacity(1) brightness(1); }

/* ═══ Hero: remove border-top on sub, no bg-topo ═══ */
.ab-hero-sub { border-top: none !important; }
.ab-hero::before {
  content: '';
  position: absolute; inset: 0; z-index: 0;
  background-image:
    linear-gradient(rgba(171,188,59,.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(171,188,59,.02) 1px, transparent 1px);
  background-size: 90px 90px;
}

/* ════════════════════════════════════════════
   SHARED MOBILE — injected on all 7 pages
   ════════════════════════════════════════════ */

/* ── Header: hide nav, show burger on mobile ── */
@media(max-width:860px){
  
  #menu-btn{display:flex!important;}
  
  
  
}

/* ── Nav underline off ── */
.hn > li > a::after{display:none!important;}

/* ════════════════════════════════════════════
   ABOUT PAGE RESPONSIVE
   ════════════════════════════════════════════ */
@media(max-width:860px){
  .ab-hero-sub{grid-template-columns:1fr!important;gap:28px!important;}
  .ab-hero-stats{flex-direction:row!important;flex-wrap:wrap!important;align-items:flex-start!important;text-align:left!important;gap:20px!important;}
  .ab-vals-grid{grid-template-columns:1fr 1fr!important;}
  .tm-grid{grid-template-columns:1fr 1fr!important;}
  .ab-hero-inner{padding:0 28px!important;}
}
@media(max-width:480px){
  .ab-vals-grid{grid-template-columns:1fr!important;}
  .tm-grid{grid-template-columns:1fr!important;}
  .ab-hero-inner{padding:0 20px!important;}
  .ab-stat-val{font-size:clamp(28px,8vw,44px)!important;}
}

/* ════════════════════════════════════════════
   FOOTER RESPONSIVE
   ════════════════════════════════════════════ */
@media(max-width:860px){
  .sf-top,
  
  
  
  
  
  
}
@media(max-width:480px){
  .sf-top,
  
  
}

/* ── About: Mission section mobile ── */

/* ── About: Clients ticker ── */
@media(max-width:680px){
  .logo-item{padding:0 28px!important;}
  .logo-item img{height:30px!important;}
}
/* ── About: Hero sub ── */
@media(max-width:480px){
  .ab-hero-sub{gap:20px!important;}
}

/* ══ SERVICE PAGES (scoped to #page-wrap) ══ */

body{overflow:auto!important;overflow-x:hidden;background:var(--dark);}

.pg-hero::before{content:'';position:absolute;inset:0;z-index:0;background-image:linear-gradient(rgba(171,188,59,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(171,188,59,.025) 1px,transparent 1px);background-size:80px 80px;}
.hero-text-col{display:flex;align-items:flex-start;padding:28px 60px 60px;position:relative;z-index:2;}
.hero-text-wrap{width:100%;}
.hero-img-col{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--dark);}
.hero-img-inner{position:absolute;inset:-20%;background-size:contain;background-repeat:no-repeat;background-position:center;}
.hero-img-col::after{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background-image:linear-gradient(to bottom,var(--dark) 0%,transparent 38%),linear-gradient(to top,var(--dark) 0%,transparent 38%),linear-gradient(to right,var(--dark) 0%,transparent 45%),linear-gradient(to left,var(--dark) 0%,transparent 30%),radial-gradient(ellipse at center,transparent 35%,rgba(18,21,28,.65) 100%);}
.pg-bc{display:flex;align-items:center;gap:8px;font-size:12px;color:rgba(255,255,255,.3);margin-bottom:20px;flex-wrap:wrap;}
.pg-bc a{color:rgba(255,255,255,.3);transition:color .2s;}.pg-bc a:hover{color:var(--green);}
.pg-bc-sep{color:rgba(255,255,255,.15);}
.pg-hero-bar{position:absolute;bottom:0;left:0;width:100%;background:rgba(0,0,0,.45);padding:12px 0;border-top:1px solid rgba(171,188,59,.1);text-align:center;z-index:10;}
.pg-hero-bar p{font-size:11px;font-weight:700;letter-spacing:3.5px;text-transform:uppercase;color:rgba(255,255,255,.32);margin:0;}
.pg-sec{padding:96px 0;position:relative;overflow:hidden;}
.pg-dark{background:var(--dark);}.pg-white{background:#fff;}
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:52px;}
.feat-card{background:#f8f8f6;padding:38px 30px;position:relative;overflow:hidden;transition:background .3s;cursor:default;}
.feat-card::before{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--green);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease);}
.feat-card:hover{background:#f0f0ee;}.feat-card:hover::before{transform:scaleX(1);}
.feat-icon{width:46px;height:46px;border:1.5px solid rgba(171,188,59,.25);border-radius:10px;background:#fff;display:flex;align-items:center;justify-content:center;margin-bottom:18px;}
.feat-title{font-size:17px;font-weight:700;color:var(--dark);margin-bottom:8px;}
.feat-text{font-size:14px;color:var(--mutedLight);line-height:1.65;}
.proj-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.proj-card{background:var(--dark2);border-radius:8px;overflow:hidden;transition:transform .35s var(--ease),box-shadow .35s;}
.proj-card:hover{transform:translateY(-6px);box-shadow:0 24px 52px rgba(0,0,0,.5);}
.proj-screen{aspect-ratio:16/10;overflow:hidden;position:relative;background:#0d1a0a;}
.proj-screen img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .65s var(--ease);}.proj-card:hover .proj-screen img{transform:scale(1.04);}
.proj-stat{position:absolute;top:12px;right:12px;background:var(--green);color:var(--dark);font-size:11px;font-weight:700;letter-spacing:.5px;padding:4px 10px;border-radius:16px;}
.proj-info{padding:16px 18px 20px;}.proj-meta{display:flex;align-items:center;gap:8px;margin-bottom:6px;}
.proj-type{font-size:12px;color:rgba(200,200,200,.4);}.proj-tag{font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--green);background:rgba(171,188,59,.1);padding:2px 7px;border-radius:3px;}
.proj-name-row{display:flex;align-items:center;justify-content:space-between;}.proj-name{font-size:16px;font-weight:700;color:#fff;}
.proj-arrow{width:32px;height:32px;border-radius:50%;border:1px solid rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.4);flex-shrink:0;transition:all .2s;}
.proj-card:hover .proj-arrow{border-color:var(--green);color:var(--green);}.proj-arrow svg{width:13px;height:13px;}
.lfaq-wrap{max-width:860px;}.lfaq-item{border-bottom:1px solid rgba(18,21,28,.09);}.lfaq-item:first-child{border-top:1px solid rgba(18,21,28,.09);}
.lfaq-q{display:flex;align-items:center;justify-content:space-between;padding:22px 0;cursor:pointer;gap:20px;font-size:17px;font-weight:700;color:var(--dark);background:none;border:none;width:100%;text-align:left;font-family:var(--font1);transition:color .2s;line-height:1.3;}
.lfaq-q:hover .lfaq-icon{color:var(--green);}
.lfaq-icon{width:32px;height:32px;flex-shrink:0;border:1.5px solid currentColor;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:transform .3s var(--ease),background .2s;}
.lfaq-q.open .lfaq-icon{background:var(--green);border-color:var(--green);transform:rotate(45deg);}.lfaq-q.open .lfaq-icon svg{stroke:var(--dark);}
.lfaq-icon svg{width:14px;height:14px;stroke:currentColor;stroke-width:2.5;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.lfaq-ans{max-height:0;overflow:hidden;transition:max-height .45s var(--ease);}.lfaq-ans .lfaq-body{padding:0 52px 22px 0;font-size:16px;color:var(--mutedLight);line-height:1.72;}
.proc-letstalk{background:#fff;border-color:#fff;transition:background .28s var(--ease),color .28s,border-color .28s;overflow:visible;}
.proc-letstalk:hover,.proc-letstalk.is-active{background:var(--green);border-color:var(--green);}
.proc-letstalk:hover .t,.proc-letstalk:hover .th,.proc-letstalk.is-active .t,.proc-letstalk.is-active 

.contact-left 

.contact-detail svg{width:17px;height:17px;stroke:var(--green);stroke-width:1.8;fill:none;flex-shrink:0;}

.cf input,.cf textarea{background:rgba(255,255,255,.05);border:1.5px solid rgba(255,255,255,.1);border-radius:6px;padding:14px 16px;font-family:var(--font1);font-size:15px;color:#fff;width:100%;box-sizing:border-box;transition:border-color .2s;outline:none;}
.cf input::placeholder,.cf textarea::placeholder{color:rgba(255,255,255,.25);}.cf input:focus,.cf textarea:focus{border-color:var(--green);}
.cf textarea{resize:vertical;min-height:120px;}

.cf-country-btn[aria-expanded="true"]{border-color:var(--green);}

.cf-country-btn[aria-expanded="true"] 

.cf-country-search-wrap svg{width:14px;height:14px;flex-shrink:0;opacity:.35;}

.cf-country-search::placeholder{color:rgba(255,255,255,.28);}

.cf-country-list::-webkit-scrollbar{width:4px;}.cf-country-list::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:2px;}
.cf-country-list li{display:flex;align-items:center;gap:9px;padding:9px 12px;cursor:pointer;font-size:13px;color:rgba(255,255,255,.65);transition:background .15s;}
.cf-country-list li:hover{background:rgba(255,255,255,.05);}.cf-country-list li

.cf-country-list li.cf-active 

.cf-phone-input::placeholder{color:rgba(255,255,255,.25);}

.cf-expand-toggle.open 
.cf-expand-body

.cf-svc-item input[type="checkbox"]{width:16px;height:16px;accent-color:var(--green);flex-shrink:0;cursor:pointer;}.cf-svc-item span{font-size:15px;color:rgba(255,255,255,.75);}

.cf-privacy input[type="checkbox"]{width:16px;height:16px;accent-color:var(--green);flex-shrink:0;margin-top:2px;cursor:pointer;}
.cf-privacy label{font-size:13px;color:rgba(255,255,255,.4);line-height:1.55;cursor:pointer;}

.sft-copy
.sft-copy

.flogo span{color:var(--green);}

.fsoc a{width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;transition:all .22s;}
.fsoc a:hover{border-color:var(--green);background:rgba(171,188,59,.06);}
.fnav h5{font-size:11px;font-weight:700;letter-spacing:3.5px;text-transform:uppercase;color:rgba(255,255,255,.45)!important;margin-bottom:18px;}

/* ── Work slider: 85vw card + 15vw peek (mobile) ── */

@media(max-width:1100px){.hero-img-col{height:42vh;order:-1;}.hero-text-col{padding:40px 24px 56px;}.feat-grid{grid-template-columns:1fr 1fr;}.proj-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:680px){.pg-sec{padding:72px 0;}.feat-grid,.proj-grid{grid-template-columns:1fr;}.lfaq-body{padding-right:14px;}}
#page-wrap #page-wrap #footer{min-height:auto!important;scroll-snap-align:none!important;}

/* ── Service page hero: breadcrumbs top, content centered ── */
.hero-text-col{
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  align-items:flex-start;
  padding:28px 60px 60px;
  position:relative;
  z-index:2;
}
.hero-text-col > .pg-bc{
  flex-shrink:0;
  margin-bottom:0;
}
.hero-text-col > .hero-text-wrap{
  flex:1;
  display:flex;
  flex-direction:column;
  justify-content:center;
  width:100%;
}
@media(max-width:1100px){
  .hero-text-col{padding:32px 40px 52px;}
}
@media(max-width:680px){
  .hero-text-col{padding:24px 20px 44px;}
}

/* ── Testimonial slider ── */

/* ══ GLOBAL FIXES ══ */
.lfaq-ans.open{max-height:600px;}
.lfaq-q:hover{color:var(--green);}

/* ── About + Work hero: office background image ── */
.ab-hero{position:relative;overflow:hidden;background-color:var(--dark);}
.pk-hero{position:relative;overflow:hidden;background-color:var(--dark);}
.ab-hero::before,.pk-hero::before{
  content:'';position:absolute;inset:0;
  background:url('dekada-office.png') center center / cover no-repeat;
  opacity:0.22;z-index:0;
}

/* ── Work hero: same height as About hero ── */
.pk-hero{
  background:var(--dark);
  min-height:72vh;
  display:flex;
  align-items:flex-end;
  padding:110px 0 60px;
  position:relative;
  overflow:hidden;
}

/* ── Service page hero: two-column split ── */
.pg-hero{
  position:relative;
  min-height:80vh;
  display:flex;
  align-items:center;
  background:var(--dark);
  overflow:hidden;
}
.pg-hero .inner{
  position:relative;
  z-index:2;
  padding-top:120px;
  padding-bottom:80px;
}
.pg-hero .hero-img-col{
  position:absolute;
  right:0;
  top:0;
  bottom:0;
  width:52%;
  z-index:1;
}
.pg-hero .hero-img-inner{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
}
/* Dark gradient overlay — left fade so text reads cleanly */
.pg-hero .hero-img-col::before{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(to right, var(--dark) 0%, transparent 40%);
  z-index:2;
}
@media(max-width:860px){
  .pg-hero{flex-direction:column;min-height:auto;padding-bottom:0;}
  .pg-hero .inner{padding-top:100px;padding-bottom:40px;}
  .pg-hero .hero-img-col{position:relative;width:100%;height:240px;margin-top:0;}
  .pg-hero .hero-img-col::before{background:linear-gradient(to bottom, var(--dark) 0%, transparent 40%);}
}

/* Process CTA: dark text on white bg, white text when active */
.proc-letstalk .t,
.proc-letstalk .th{color:var(--dark)!important;}
.proc-letstalk:hover .t,.proc-letstalk:hover .th,
.proc-letstalk.is-active .t,.proc-letstalk.is-active .th{color:#fff!important;}
.proc-letstalk:hover,.proc-letstalk.is-active{background:var(--green)!important;border-color:var(--green)!important;}

/* ═══════════════════════════════════════════════════════════
   CONSOLIDATED MOBILE FIXES
   ═══════════════════════════════════════════════════════════ */

/* ── Burger: force visible on mobile ── */
@media(max-width:860px){
  .hdr-menu-btn,#menu-btn{display:flex!important;align-items:center;justify-content:center;}
  .hdr-nav,nav.hdr-nav{display:none!important;}
  .hdr-cta,.hdr-phone{display:none!important;}
  .hdr-inner{padding:0 20px;}
  .inner{padding-left:20px;padding-right:20px;}

  /* Sections — compact vertical padding */
  .ab-sec,.pg-sec,.snap:not(#hero):not(#footer){padding-top:52px!important;padding-bottom:52px!important;}
  section .inner{padding-top:0;padding-bottom:0;}

  /* About page */
  .ab-hero{min-height:60vh;padding:80px 0 40px;}
  .ab-cols{grid-template-columns:1fr!important;gap:32px!important;}
  .ab-val{padding:24px!important;}
  .ab-team-grid{grid-template-columns:1fr 1fr!important;gap:20px!important;}
  .ab-mission-wrap{grid-template-columns:1fr!important;gap:28px!important;}

  /* Work / Portfolio */
  .pk-hero{min-height:56vh;padding:80px 0 36px;}
  .pk-grid{grid-template-columns:1fr!important;gap:20px!important;}
  .pk-filter{flex-wrap:wrap;gap:8px;}
  .pk-filter-btn{padding:6px 14px;font-size:13px;}
  .wk-card{flex:0 0 98%!important;scroll-snap-align:start;max-width:none;}
  .work-cards-grid{padding:0 20px 16px;gap:14px;}

  /* Service pages */
  .pg-hero{min-height:auto;flex-direction:column;}
  .pg-hero .inner{padding-top:90px;padding-bottom:36px;width:100%;}
  .pg-hero .hero-img-col{position:relative;width:100%;height:220px;margin-top:0;}
  .pg-hero .hero-img-col::before{background:linear-gradient(to bottom,var(--dark) 0%,transparent 50%);}

  .srv-scope-grid,.scope-grid{grid-template-columns:1fr!important;gap:16px!important;}
  .srv-work-grid,.srv-works-grid{grid-template-columns:1fr 1fr!important;gap:16px!important;}
  .srv-work-card,.wk-card-sm{min-height:160px!important;}
  .faq-wrap,.lfaq-wrap{max-width:100%!important;}

  /* Process */
  .proc-top{grid-template-columns:1fr!important;gap:20px;margin-bottom:32px;}
  .proc-rows{gap:0;}
  .proc-row{grid-template-columns:40px 1fr!important;gap:16px;padding:20px 0;}
  .proc-left{display:none!important;}
  .proc-circle{width:36px;height:36px;font-size:13px;}
  .proc-right{padding-left:0;}
  .proc-name{font-size:clamp(18px,4vw,26px);}
  .proc-right p{font-size:14px;line-height:1.65;}
  #proc-letstalk,.proc-letstalk{margin-top:28px;display:inline-flex;}

  /* Testimonials */
  .grow-top{padding:0;}
  .grow-headline{font-size:clamp(28px,7vw,48px)!important;}

  /* Contact */
  .contact-wrap{grid-template-columns:1fr!important;gap:32px!important;}
  .cf-form{gap:16px!important;}
  .cf-row{grid-template-columns:1fr!important;gap:14px!important;}

  /* Footer */
  .sft-inner-row{padding:28px 20px;}
  .sft-email{font-size:clamp(26px,7vw,48px)!important;white-space:normal;word-break:break-word;}
  .fqi{padding:32px 20px 24px;}
  .fci{padding:28px 20px;grid-template-columns:1fr 1fr;}
  .fbot{padding:12px 20px;flex-direction:column;align-items:flex-start;gap:8px;font-size:13px;}

  /* Clients logo ticker */
  .logo-ticker-outer{padding:24px 0;}
  .logo-item img{height:40px;}

  /* Values */
  .vals{grid-template-columns:1fr!important;gap:24px!important;}
  .val{padding:24px 20px!important;}
}

/* ── Small phones ── */
@media(max-width:480px){
  .inner{padding-left:16px;padding-right:16px;}
  .hdr-inner{padding:0 16px;}
  .ab-team-grid{grid-template-columns:1fr!important;}
  .srv-work-grid,.srv-works-grid{grid-template-columns:1fr!important;gap:14px!important;}
  .fci{grid-template-columns:1fr!important;gap:20px;}
  .sft-email{font-size:clamp(22px,8vw,40px)!important;}
  .proc-name{font-size:18px;}
}

/* ══ Testimonials: single-row slider, no wrapping columns ══ */

/* .gq-author: 2 line-height gaps below .gq content */

/* Burger menu contact — left-aligned */
.mm-contact-right{
  display:flex;
  flex-direction:column;
  align-items:flex-start!important;
  justify-content:flex-start;
  gap:14px;
  flex-wrap:nowrap;
}
.mm-contact-right a{
  display:flex;
  align-items:center;
  gap:10px;
  font-family:var(--font1);
  font-size:15px;
  font-weight:600;
  color:rgba(255,255,255,.65);
  text-decoration:none;
  transition:color .2s;
}
.mm-contact-right a:hover{color:var(--green);}

/* Our Work pk-section: green bg accent pattern */
.pk-section{
  position:relative;
  padding:64px 0 96px;
  background:var(--dark);
  overflow:hidden;
}
.pk-section::before{
  content:'';
  position:absolute;
  top:-120px;right:-80px;
  width:480px;height:480px;
  background:radial-gradient(ellipse at center, rgba(171,188,59,.18) 0%, transparent 70%);
  pointer-events:none;
  z-index:0;
}
.pk-section::after{
  content:'';
  position:absolute;
  bottom:-60px;left:-60px;
  width:320px;height:320px;
  background:radial-gradient(ellipse at center, rgba(171,188,59,.10) 0%, transparent 70%);
  pointer-events:none;
  z-index:0;
}
.pk-section .pk-grid-wrap,
.pk-section .inner{position:relative;z-index:2;}

/* ══ Header: always solid on mobile (no transparent state) ══ */
@media(max-width:860px){
  header{
    background:#151515!important;
    border-bottom:1px solid rgba(255,255,255,.08)!important;
    backdrop-filter:none!important;
  }
}

/* ═══════════════════════════════════════════════════════════
   FINAL MOBILE MASTER — overrides all previous conflicts
   ═══════════════════════════════════════════════════════════ */
@media(max-width:860px){

  /* ── Global spacing reset ── */
  .inner{padding-left:20px!important;padding-right:20px!important;}
  section .inner{padding-top:0!important;padding-bottom:0!important;}

  /* ── INDEX HERO ── */
  #hero{height:auto!important;min-height:0!important;padding:0!important;}
  #hero .inner.hero-c,
  #hero .sec-inner-hero{padding-top:100px!important;padding-bottom:48px!important;}
  .hero-ring{display:none!important;}
  .hero-btns{flex-direction:column;align-items:flex-start;gap:14px;}
  .hero-desc{font-size:16px!important;}

  /* ── ABOUT HERO ── */
  .ab-hero{min-height:0!important;padding:100px 0 48px!important;}
  .ab-hero-sub{grid-template-columns:1fr!important;gap:24px!important;}
  .ab-hero-stats{flex-direction:row!important;flex-wrap:wrap!important;gap:20px!important;align-items:flex-start!important;text-align:left!important;}
  .ab-hero-inner{padding:0!important;}

  /* ── WORK HERO ── */
  .pk-hero{min-height:0!important;padding:100px 0 48px!important;}
  .pk-hero-inner{padding:0!important;}
  .pk-hero-hl{font-size:clamp(36px,9vw,60px)!important;line-height:1.05!important;}

  /* ── SERVICE HERO ── */
  .pg-hero{min-height:0!important;flex-direction:column!important;padding:0!important;}
  .pg-hero .inner{padding-top:90px!important;padding-bottom:36px!important;width:100%!important;max-width:100%!important;}
  .pg-hero .hero-img-col{position:relative!important;width:100%!important;height:200px!important;top:auto!important;right:auto!important;bottom:auto!important;}
  .pg-hero .hero-img-col::before{background:linear-gradient(to bottom,var(--dark) 0%,transparent 60%)!important;}
  .hero-text-wrap .hl,.pg-hero .hl{font-size:clamp(30px,8vw,52px)!important;}

  /* ── SNAP SECTIONS (non-hero, non-footer) ── */
  .snap:not(#hero):not(#footer){
    min-height:0!important;
    padding-top:48px!important;
    padding-bottom:48px!important;
    scroll-snap-align:none!important;
  }
  .ab-sec,.pg-sec{padding-top:48px!important;padding-bottom:48px!important;}

  /* ── SECTION HEADINGS ── */
  #values .hl,#clients .hl,#services .hl,#about .hl,
  #work .hl,#process .hl,#testi .grow-headline,#contact .hl{
    font-size:clamp(28px,7vw,44px)!important;
    letter-spacing:-1.5px!important;
  }

  /* ── WORK CARDS ── */
  .work-cards-grid{
    display:flex!important;
    overflow-x:auto!important;
    scroll-snap-type:x mandatory!important;
    gap:12px!important;
    padding:0 20px 16px!important;
    scrollbar-width:none!important;
  }
  .work-cards-grid::-webkit-scrollbar{display:none!important;}
  .wk-card{flex:0 0 90%!important;scroll-snap-align:start!important;max-width:none!important;}

  /* ── PROCESS SECTION ── */
  #process{scroll-snap-align:none!important;}
  .proc-top{grid-template-columns:1fr!important;gap:20px!important;margin-bottom:28px!important;}
  .proc-rows{gap:0!important;}
  .proc-row{
    display:grid!important;
    grid-template-columns:48px 1fr!important;
    gap:14px!important;
    padding:18px 0!important;
    align-items:start!important;
  }
  .proc-left,.proc-mid{display:none!important;}
  .proc-circle{width:40px!important;height:40px!important;font-size:13px!important;flex-shrink:0;}
  .proc-right{padding-left:0!important;}
  .proc-name{font-size:clamp(17px,4.5vw,24px)!important;margin-bottom:6px!important;}
  .proc-right p{font-size:14px!important;line-height:1.65!important;margin:0!important;}

  /* ── PROCESS CTA ── */
  .proc-letstalk,#proc-letstalk{
    display:inline-flex!important;
    margin-top:24px!important;
    margin-left:0!important;
  }

  /* ── SERVICES GRID ── */
  .srv-grid{grid-template-columns:1fr!important;gap:16px!important;}
  .sc{padding:28px 22px!important;}

  /* ── TESTIMONIALS ── */
  .grow-top{padding:0!important;}
  .grow-headline{font-size:clamp(26px,7vw,44px)!important;}

  /* ── VALUES ── */
  .vals{grid-template-columns:1fr!important;gap:20px!important;}
  .val{padding:24px 20px!important;}

  /* ── CONTACT ── */
  .contact-wrap{grid-template-columns:1fr!important;gap:28px!important;}
  .cf-row{grid-template-columns:1fr!important;gap:14px!important;}
  .contact-intro{font-size:15px!important;}

  /* ── FOOTER ── */
  .sft-inner-row{padding:32px 20px!important;}
  .sft-email{
    font-size:clamp(24px,7vw,44px)!important;
    white-space:normal!important;
    word-break:break-word!important;
    letter-spacing:-1px!important;
  }
  .fqi{padding:32px 20px 24px!important;}
  .fci{padding:24px 20px!important;grid-template-columns:1fr 1fr!important;}
  .fbot{padding:12px 20px!important;flex-direction:column!important;align-items:flex-start!important;gap:8px!important;font-size:12px!important;}

  /* ── LOGO TICKER ── */
  .logo-ticker-outer{padding:24px 0!important;}
  .logo-item img{height:36px!important;}

  /* ── ABOUT PAGE SECTIONS ── */
  .ab-cols{grid-template-columns:1fr!important;gap:24px!important;}
  .ab-team-grid{grid-template-columns:1fr 1fr!important;gap:16px!important;}
  .ab-mission-wrap{grid-template-columns:1fr!important;gap:24px!important;}
  .ab-val{padding:20px!important;}

  /* ── WORK/PORTFOLIO PAGE ── */
  .pk-grid{grid-template-columns:1fr!important;gap:16px!important;}
  .pk-filter{flex-wrap:wrap!important;gap:8px!important;justify-content:flex-start!important;}
  .pk-filter-btn{padding:7px 14px!important;font-size:13px!important;}
  .pk-section{padding:48px 0!important;}

  /* ── SERVICE PAGE INNER SECTIONS ── */
  .srv-scope-grid,.scope-grid{grid-template-columns:1fr!important;gap:14px!important;}
  .srv-works-grid,.srv-work-grid{grid-template-columns:1fr 1fr!important;gap:14px!important;}
  .lfaq-wrap{max-width:100%!important;}
  .lfaq-q{padding:16px 0!important;}
}

/* ── Small phones ≤480px ── */
@media(max-width:480px){
  .inner{padding-left:16px!important;padding-right:16px!important;}
  .ab-hero{padding:90px 0 36px!important;}
  .pk-hero{padding:90px 0 36px!important;}
  .pg-hero .inner{padding-top:80px!important;padding-bottom:28px!important;}
  .wk-card{flex:0 0 92%!important;}
  .fci{grid-template-columns:1fr!important;gap:18px!important;}
  .ab-team-grid{grid-template-columns:1fr!important;}
  .srv-works-grid,.srv-work-grid{grid-template-columns:1fr!important;}
  .sft-email{font-size:clamp(22px,8vw,38px)!important;}
  .proc-row{grid-template-columns:40px 1fr!important;gap:10px!important;}
}

/* ══ Testimonials: author row with avatar photo ══ */

/* ══ Avatar: photo-like circle with person silhouette ══ */
/* Person silhouette using CSS pseudo-elements */
/* Initials on top of silhouette — hidden since silhouette replaces it */

/* ═══════════════════════════════════════════════════
   TESTIMONIALS — DEFINITIVE RULES
   ═══════════════════════════════════════════════════ */

/* Outer overflow wrapper */
.gq-slider-outer {
  overflow: hidden;
  width: 100%;
  margin-top: 40px;
  cursor: grab;
}
.gq-slider-outer:active { cursor: grabbing; }

/* Slider track — display:flex to show cards horizontally */
.gq-slider {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: flex-start;
  gap: 24px;
  padding: 8px 60px 20px;
  transition: transform .55s cubic-bezier(.25,.46,.45,.94);
  will-change: transform;
  user-select: none;
}

/* Individual card — NO display:flex (flex child only) */
.gq {
  flex: 0 0 320px;
  width: 320px;
  box-sizing: border-box;
  font-family: var(--font2);
  font-style: italic;
  font-size: 16px;
  line-height: 1.7;
  color: rgba(255,255,255,.85);
  background: var(--dark2);
  border-radius: 10px;
  padding: 32px 28px 28px;
  position: relative;
}
.gq--mid {
  flex: 0 0 340px;
  width: 340px;
}

/* Author row: avatar left, name+role right — flex row here only */
.gq-author {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12px;
  margin-top: 2em;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,.08);
}

/* Avatar — image style */
.gq-avatar {
  width: 44px;
  height: 44px;
  min-width: 44px;
  border-radius: 50%;
  overflow: hidden;
  border: 2px solid rgba(171,188,59,.45);
  flex-shrink: 0;
}
.gq-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}

/* Avatar fallback — photo-like silhouette, NO display:flex */
.gq-avatar-fallback {
  width: 44px;
  height: 44px;
  min-width: 44px;
  border-radius: 50%;
  border: 2px solid rgba(171,188,59,.45);
  background: linear-gradient(160deg,#2a2e1e 0%,#1a1e10 100%);
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
}
/* Head */
.gq-avatar-fallback::before {
  content: '';
  position: absolute;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: rgba(171,188,59,.75);
  top: 7px;
  left: 50%;
  transform: translateX(-50%);
}
/* Shoulders */
.gq-avatar-fallback::after {
  content: '';
  position: absolute;
  width: 28px;
  height: 18px;
  border-radius: 50% 50% 0 0;
  background: rgba(171,188,59,.5);
  bottom: -3px;
  left: 50%;
  transform: translateX(-50%);
}
.gq-avatar-fallback > span { display: none; }

/* Name + role — stacked block */
.gq-author-text {
  display: block;
}
.gq-name {
  display: block;
  font-family: var(--font1);
  font-size: 13px;
  font-weight: 700;
  color: rgba(255,255,255,.85);
  font-style: normal;
  line-height: 1.3;
  margin-bottom: 2px;
}
.gq-role {
  display: block;
  font-family: var(--font1);
  font-size: 12px;
  color: rgba(255,255,255,.4);
  font-style: normal;
  line-height: 1.3;
}

/* Navigation dots — NO display:flex (block row via inline-block) */
.gq-nav {
  text-align: center;
  padding: 20px 0 60px;
}
.gq-dots {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.gq-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(255,255,255,.2);
  cursor: pointer;
  transition: all .25s;
}
.gq-dot.active {
  background: var(--green);
  transform: scale(1.4);
}
.gq-dot:hover:not(.active) { background: rgba(255,255,255,.45); }

/* Prev / next arrow buttons */
.gq-prev, .gq-next {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,.15);
  background: rgba(255,255,255,.06);
  color: #fff;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all .2s;
  vertical-align: middle;
  margin: 0 12px;
}
.gq-prev:hover, .gq-next:hover {
  background: var(--green);
  border-color: var(--green);
}

/* Mobile */
@media (max-width: 860px) {
  .gq-slider { padding: 8px 20px 16px; gap: 16px; }
  .gq, .gq--mid { flex: 0 0 82vw; width: 82vw; }
}
@media (max-width: 480px) {
  .gq, .gq--mid { flex: 0 0 86vw; width: 86vw; }
}

/* ═══════════════════════════════════════════════════
   SERVICES CARD GRID — image-style 3×2 layout
   ═══════════════════════════════════════════════════ */
.srv-img-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  width: 100%;
}

.svc-card {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  min-height: 420px;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

/* Background image layer */
.svc-card-bg {
  position: absolute;
  inset: 0;
  background: var(--svc-bg, linear-gradient(135deg,#0d1a10,#1a2d1a));
  background-size: cover;
  background-position: center;
  transition: transform .5s cubic-bezier(.25,.46,.45,.94);
  z-index: 0;
}
.svc-card:hover .svc-card-bg {
  transform: scale(1.04);
}

/* Dark gradient overlay — content readability */
.svc-card-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(8,10,14,.96) 0%,
    rgba(8,10,14,.6)  45%,
    rgba(8,10,14,.15) 100%
  );
  z-index: 1;
}

/* Arrow button — top right */
.svc-arrow {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.2);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  z-index: 3;
  transition: background .25s, border-color .25s, transform .25s;
}
.svc-card:hover .svc-arrow {
  background: var(--green);
  border-color: var(--green);
  transform: rotate(45deg);
}

/* Card text content — bottom aligned */
.svc-card-body {
  position: relative;
  z-index: 2;
  padding: 24px 24px 28px;
}

.svc-num {
  display: block;
  font-family: var(--font1);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--green);
  margin-bottom: 10px;
}

.svc-title {
  font-family: var(--font1);
  font-size: clamp(22px, 2.2vw, 30px);
  font-weight: 800;
  color: #fff;
  line-height: 1.1;
  margin: 0 0 12px;
  letter-spacing: -0.5px;
}

.svc-desc {
  font-family: var(--font1);
  font-size: 14px;
  color: rgba(255,255,255,.55);
  line-height: 1.65;
  margin: 0;
  max-width: 320px;
}

/* Mobile */
@media (max-width: 860px) {
  .srv-img-grid {
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }
  .svc-card { min-height: 280px; }
  .svc-title { font-size: clamp(18px,4.5vw,24px); }
  .svc-card-body { padding: 18px 18px 20px; }
}
@media (max-width: 480px) {
  .srv-img-grid { grid-template-columns: 1fr; gap: 12px; }
  .svc-card { min-height: 220px; }
}