/* =============================================================
   Gigamatics — Stylesheet v2
   Subtle, muted, editorial palette designed to age well.
   ============================================================= */

:root{
  --ink:#071A38;         /* headings, primary text — exact logo navy */
  --muted:#55647D;       /* body copy */
  --muted-2:#8492A6;     /* secondary/meta text */
  --accent:#0D3F87;      /* primary accent — darker logo blue */
  --accent-dark:#082C63; /* hover/active state — deeper still */
  --accent-pop:#22D3EE;  /* secondary bright accent — cyan, used for pops/variety */
  --accent-tint:#F3F8FF; /* light section backgrounds — matches reference screenshot */
  --surface:#F7FAFD;     /* alt light background */
  --bg:#FFFFFF;
  --line:#E1E9F2;
  --line-strong:#C3D6E8;
  --radius:999px;
  --radius-card:10px;
  --maxw:1200px;
  --shadow:0 4px 16px rgba(7,26,56,0.07);
  --shadow-hover:0 10px 28px rgba(7,26,56,0.12);

  /* Gradient tones lifted from the logo's own 3D bevel */
  --grad-1:#64B4F0;
  --grad-2:#0D3F87;
  --grad-3:#071A38;
  --logo-gradient:linear-gradient(135deg, var(--grad-1) 0%, var(--grad-2) 55%, var(--grad-3) 100%);
  --logo-gradient-soft:linear-gradient(135deg, rgba(100,180,240,0.16) 0%, rgba(20,80,170,0.12) 55%, rgba(7,26,56,0.08) 100%);
}

/* Soft blurred background texture — used behind FAQ / leadership-style sections
   so they read as having a page-relevant background image without an actual photo. */
.bg-texture{position:relative; overflow:hidden;}
.bg-texture::before{
  content:''; position:absolute; inset:-10%; z-index:0; pointer-events:none;
  background:
    radial-gradient(circle at 15% 20%, rgba(20,80,170,0.18) 0%, transparent 45%),
    radial-gradient(circle at 85% 75%, rgba(34,211,238,0.14) 0%, transparent 50%),
    radial-gradient(circle at 50% 100%, rgba(7,26,56,0.08) 0%, transparent 60%);
  filter:blur(40px);
}
.bg-texture > .wrap{position:relative; z-index:1;}
.bg-texture.grid::before{
  background-image:
    radial-gradient(circle at 15% 20%, rgba(20,80,170,0.18) 0%, transparent 45%),
    radial-gradient(circle at 85% 75%, rgba(34,211,238,0.14) 0%, transparent 50%),
    radial-gradient(rgba(20,80,170,0.14) 1px, transparent 1px);
  background-size:auto, auto, 28px 28px;
}

/* Distinctive underline treatment for small links/labels, in the logo's dark navy */
.underline-link{text-decoration:underline; text-decoration-color:var(--ink); text-underline-offset:3px; text-decoration-thickness:1.5px;}

*{box-sizing:border-box; -webkit-tap-highlight-color:transparent;}
html{scroll-behavior:smooth;}
body{margin:0; font-family:'DM Sans',sans-serif; color:var(--ink); background:var(--bg); font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased;}
h1,h2,h3,h4{font-family:'Sora',sans-serif; margin:0; color:var(--ink); font-weight:700; letter-spacing:-0.01em;}
a{text-decoration:none; color:inherit;}
img{max-width:100%; display:block;}
::selection{background:rgba(53,97,140,0.18); color:var(--ink);}
:focus-visible{outline:2px solid var(--accent); outline-offset:3px;}

.wrap{max-width:var(--maxw); margin:0 auto; padding:0 24px;}
.mono{font-family:'JetBrains Mono',monospace; text-transform:uppercase; letter-spacing:0.12em; font-size:12px; font-weight:500;}
.eyebrow{display:inline-flex; align-items:center; gap:10px; color:var(--accent); margin-bottom:18px;}
.eyebrow::before{content:''; width:22px; height:1px; background:var(--accent);}
.eyebrow.center{justify-content:center;}
.eyebrow.center::before{display:none;}
.hero .eyebrow{color:var(--accent-pop);}
.hero .eyebrow::before{background:var(--accent-pop);}

/* ---------- header ---------- */
header.site{position:sticky; top:0; z-index:50; background:rgba(255,255,255,0.94); backdrop-filter:blur(10px); border-bottom:1px solid var(--line);}
.nav-row{display:flex; align-items:center; justify-content:space-between; padding:14px 0;}
.logo img{height:64px; width:auto;}
nav.primary{display:flex; align-items:center; gap:36px;}
nav.primary ul{list-style:none; display:flex; gap:30px; margin:0; padding:0;}
nav.primary a{font-size:14.5px; font-weight:500; color:var(--ink); padding:8px 0; position:relative;}
nav.primary a::after{content:''; position:absolute; left:0; bottom:0; width:0; height:2px; background:var(--accent); transition:width .2s ease;}
nav.primary a:hover,nav.primary a.active{color:var(--accent);}
nav.primary a:hover::after,nav.primary a.active::after{width:100%;}
.nav-cta{background:var(--accent); color:#FFFFFF !important; padding:12px 28px; font-size:14px; font-weight:700; border-radius:var(--radius); transition:background .2s ease; white-space:nowrap;}
.nav-cta:hover{background:var(--accent-dark); color:#FFFFFF !important;}
.nav-cta:hover{background:var(--accent-dark);}
.burger{display:none; background:none; border:none; cursor:pointer; padding:8px;}
.burger span{display:block; width:22px; height:2px; background:var(--ink); margin:5px 0;}

/* services dropdown */
.has-drop{position:relative;}
.has-drop > a::after{content:'\25BE'; font-size:9px; margin-left:5px; opacity:0.6;}
.dropdown{
  position:absolute; top:100%; left:-16px; background:#fff; border:1px solid var(--line);
  border-radius:var(--radius-card); box-shadow:0 14px 34px rgba(7,26,56,0.12);
  min-width:320px; padding:10px; opacity:0; visibility:hidden; transform:translateY(6px);
  transition:all .18s ease; z-index:60;
}
.has-drop:hover .dropdown{opacity:1; visibility:visible; transform:translateY(0);}
.dropdown a{display:flex; align-items:center; gap:10px; padding:10px 12px; font-size:13.5px; color:var(--ink); border-radius:6px; font-weight:500;}
.dropdown a:hover{background:var(--accent-tint); color:var(--accent);}
.dropdown a::after{content:none;}
.dropdown .d-ic{width:26px; height:26px; border-radius:6px; background:var(--accent-tint); color:var(--accent); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.dropdown .d-ic svg{width:14px; height:14px;}
@media(max-width:960px){
  .dropdown{position:static; opacity:1; visibility:visible; transform:none; box-shadow:none; border:none; border-left:2px solid var(--line); padding:4px 0 4px 16px; margin-top:6px;}
  .has-drop > a::after{display:none;}
}
@media(max-width:960px){
  nav.primary ul{position:fixed; top:92px; left:0; right:0; background:#fff; flex-direction:column; padding:20px 24px; gap:16px; border-bottom:1px solid var(--line); display:none; box-shadow:var(--shadow);}
  nav.primary ul.open{display:flex;}
  .nav-cta{display:none;}
  .burger{display:block;}
}

/* ---------- buttons (pill-shaped, matching WordPress site's hover behavior) ---------- */
.btn{display:inline-flex; align-items:center; gap:8px; padding:14px 30px; border-radius:var(--radius); font-weight:700; font-size:14.5px; transition:all .25s ease; border:1.5px solid transparent; cursor:pointer; font-family:'DM Sans',sans-serif;}
.btn-primary{background:var(--accent); color:#fff; box-shadow:0 4px 16px rgba(20,80,170,0.28);}
.btn-primary:hover{background:var(--accent-pop); color:#051022; transform:translateY(-2px); box-shadow:0 10px 26px rgba(34,211,238,0.35);}
.btn-secondary{background:transparent; color:var(--ink); border-color:var(--line-strong);}
.btn-secondary:hover{border-color:var(--accent); color:var(--accent); background:var(--accent-tint);}
/* used inside dark hero / final-cta sections */
.btn-on-dark{background:transparent; color:#fff; border-color:rgba(255,255,255,0.3);}
.btn-on-dark:hover{border-color:var(--accent-pop); color:var(--accent-pop); background:rgba(34,211,238,0.08); transform:translateY(-2px);}
.btn-row{display:flex; gap:14px; flex-wrap:wrap; margin-top:32px;}
.btn-row.center{justify-content:center;}

/* ---------- hero (dark navy, animated mesh — matches WordPress site) ---------- */
.hero{position:relative; background:var(--ink); border-bottom:none; overflow:hidden; color:#E8F2FC;}
.hero h1,.hero h2,.hero h3{color:#fff;}
.hero::before,.hero::after,.final-cta::before,.final-cta::after{
  content:''; position:absolute; border-radius:50%; filter:blur(90px); opacity:0.35; z-index:0; pointer-events:none;
  animation:heroFloat 14s ease-in-out infinite;
}
.hero::before,.final-cta::before{width:460px; height:460px; background:var(--accent); top:-120px; left:-80px;}
.hero::after,.final-cta::after{width:400px; height:400px; background:var(--accent-pop); bottom:-100px; right:-60px; animation-delay:3s;}
@keyframes heroFloat{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(36px,-26px) scale(1.14);}}
@media (prefers-reduced-motion: reduce){.hero::before,.hero::after,.final-cta::before,.final-cta::after{animation:none;}}
.hero .wrap{position:relative; z-index:2; display:grid; grid-template-columns:1.05fr 0.95fr; gap:48px; align-items:center; padding-top:clamp(56px,8vw,92px); padding-bottom:clamp(48px,7vw,76px);}
@media(max-width:860px){
  .hero .wrap{grid-template-columns:1fr; gap:36px; text-align:center;}
  .hero .wrap > div:first-child{order:1;}
  .hero .wrap > div:last-child,.hero .hero-visual{order:2; max-width:320px; margin:0 auto;}
  .hero .btn-row{justify-content:center;}
  .hero .lead{margin-left:auto; margin-right:auto;}
}
.hero h1{font-size:clamp(34px,4.4vw,52px); line-height:1.14;}
.hero h1 .accent{color:var(--accent-pop);}
.hero p.lead{margin-top:22px; font-size:17.5px; color:#B8CBE8; max-width:520px; line-height:1.65;}
.hero-visual{position:relative; z-index:2;}
.hero-visual svg{width:100%; height:auto; display:block;}

.pagehero{position:relative; background:var(--accent-tint); border-bottom:1px solid var(--line); text-align:center; padding:72px 0 60px;}
.pagehero h1{font-size:clamp(30px,4vw,46px);}
.pagehero p{max-width:620px; margin:20px auto 0; color:var(--muted); font-size:16.5px; line-height:1.7;}

/* ---------- trust strip ---------- */
.trust-strip{border-top:1px solid rgba(255,255,255,0.14); position:relative; z-index:2;}
.trust-strip .wrap{display:flex; flex-wrap:wrap; gap:10px 40px; justify-content:center; padding:20px 24px; align-items:center;}
.trust-strip .item{display:flex; align-items:center; gap:9px; color:#9FB4D6; font-size:13px;}
.trust-strip .dot{width:5px; height:5px; background:var(--accent-pop); border-radius:50%; flex-shrink:0;}

/* ---------- generic section scaffold ---------- */
section.pad{padding:clamp(64px,8vw,100px) 0;}
.section-head{max-width:680px; margin:0 auto 52px; text-align:center;}
.section-head.left{text-align:left; margin:0 0 44px;}
.section-head h2{font-size:clamp(26px,3.2vw,36px); margin-top:12px;}
.section-head p{color:var(--muted); margin-top:14px; font-size:15.5px; line-height:1.65;}
.bg-surface{background:var(--surface);}
.bg-tint{background:var(--accent-tint);}
.bordered{border-top:1px solid var(--line); border-bottom:1px solid var(--line);}

/* ---------- grids & cards ---------- */
.grid-2{display:grid; grid-template-columns:repeat(2,1fr); gap:24px;}
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.grid-4{display:grid; grid-template-columns:repeat(4,1fr); gap:24px;}
.grid-6{display:grid; grid-template-columns:repeat(6,1fr); gap:16px;}
@media(max-width:960px){.grid-3,.grid-4{grid-template-columns:1fr 1fr;} .grid-6{grid-template-columns:repeat(3,1fr);}}
@media(max-width:620px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr;} .grid-6{grid-template-columns:1fr 1fr;}}

.card{background:#fff; border:1px solid var(--line); border-radius:var(--radius-card); padding:32px 28px; transition:box-shadow .25s ease, border-color .25s ease, transform .25s ease;}
.card:hover{box-shadow:var(--shadow-hover); border-color:var(--line-strong); transform:translateY(-3px);}
.card h3{font-size:18.5px;}
.card p{color:var(--muted); font-size:14.5px; margin-top:10px; line-height:1.65;}
.card .link{margin-top:16px; display:inline-block; font-size:13px; font-weight:700; color:var(--accent); text-decoration:underline; text-decoration-color:var(--ink); text-underline-offset:3px;}
.badge{display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; border-radius:10px; background:var(--logo-gradient); color:#fff; margin-bottom:18px; box-shadow:0 4px 12px rgba(7,26,56,0.18);}
.badge svg{display:block;}
.contact-info .ic svg{display:block;}

/* ---------- timeline / process ---------- */
.timeline{display:flex; justify-content:space-between; position:relative; gap:20px;}
.timeline::before{content:''; position:absolute; top:23px; left:6%; right:6%; height:1px; background:var(--line-strong); z-index:0;}
.tstep{flex:1; text-align:center; position:relative; z-index:1;}
.tdot{width:46px; height:46px; border-radius:50%; background:#fff; border:1.5px solid var(--grad-2); margin:0 auto 18px; display:flex; align-items:center; justify-content:center; font-family:'Sora'; font-weight:700; color:var(--grad-2); font-size:14px; transition:all .25s ease;}
.tstep:hover .tdot{background:var(--logo-gradient); color:#fff; border-color:transparent; box-shadow:0 6px 18px rgba(21,50,82,0.25);}
.tstep h3{font-size:17.5px;}
.tstep p{color:var(--muted); font-size:14px; margin-top:8px; max-width:230px; margin-left:auto; margin-right:auto;}
@media(max-width:800px){.timeline{flex-direction:column;} .timeline::before{display:none;}}

/* ---------- split layout ---------- */
.split{display:grid; grid-template-columns:0.95fr 1.05fr; gap:56px; align-items:center;}
.split.reverse > *:first-child{order:2;}
.split.reverse > *:last-child{order:1;}
@media(max-width:900px){.split,.split.reverse > *{grid-template-columns:1fr; order:initial;}}
.deliver-list{list-style:none; margin:0; padding:0;}
.deliver-list li{display:flex; gap:16px; padding:18px 0; border-top:1px solid var(--line);}
.deliver-list li:last-child{border-bottom:1px solid var(--line);}
.deliver-num{width:32px; height:32px; flex-shrink:0; border-radius:6px; background:var(--logo-gradient); color:#fff; font-family:'JetBrains Mono'; font-size:12px; font-weight:700; display:flex; align-items:center; justify-content:center;}
.deliver-list strong{display:block; color:var(--ink); font-size:15px;}
.deliver-list span{color:var(--muted); font-size:13.5px; line-height:1.55;}

/* ---------- accent-top cards (why us) ---------- */
.accent-card{border-top:2px solid var(--accent); padding-top:20px;}
.accent-tag{font-family:'JetBrains Mono'; font-size:11px; color:var(--muted-2); letter-spacing:0.1em;}
.accent-card h3{font-size:17px; margin-top:12px;}
.accent-card p{color:var(--muted); font-size:13.5px; margin-top:10px; line-height:1.6;}

/* ---------- stats ---------- */
.stats-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line);}
.stat{background:#fff; padding:30px 22px; text-align:center;}
.stat .num{font-family:'Sora'; font-weight:700; font-size:36px; background:linear-gradient(120deg, var(--accent) 0%, var(--accent-pop) 100%); -webkit-background-clip:text; background-clip:text; color:transparent;}
.stat .lbl{margin-top:8px; font-size:13.5px; color:var(--muted);}
@media(max-width:800px){.stats-grid{grid-template-columns:1fr 1fr;}}

/* ---------- industries ---------- */
.industry{
  position:relative; overflow:hidden; border-radius:var(--radius-card); padding:26px 20px 22px;
  color:#fff; transition:box-shadow .25s ease, transform .25s ease; min-height:172px;
  display:flex; flex-direction:column; justify-content:flex-end;
}
.industry:hover{box-shadow:0 14px 34px rgba(7,26,56,0.22); transform:translateY(-3px);}
.industry .ind-ic{position:absolute; top:18px; left:18px; opacity:0.85;}
.industry h3{font-size:15px; color:#fff; position:relative; z-index:2;}
.industry p{color:rgba(255,255,255,0.88); font-size:12.5px; margin-top:6px; line-height:1.5; position:relative; z-index:2;}
.industry.ind-1{background:linear-gradient(135deg,#1450AA,#071A38);}
.industry.ind-2{background:linear-gradient(135deg,#0891B2,#0B4A5C);}
.industry.ind-3{background:linear-gradient(135deg,#22D3EE,#0E6E86);}
.industry.ind-4{background:linear-gradient(135deg,#3B5BDB,#1E2A6B);}
.industry.ind-5{background:linear-gradient(135deg,#0B4A5C,#071A38);}
.industry.ind-6{background:linear-gradient(135deg,#1E88B8,#12314F);}

/* ---------- case studies ---------- */
.case-card{background:#fff; border:1px solid var(--line); border-radius:var(--radius-card); overflow:hidden; transition:box-shadow .25s ease, transform .25s ease;}
.case-card:hover{box-shadow:var(--shadow-hover); transform:translateY(-3px);}
.case-thumb{height:160px; background:var(--logo-gradient-soft), linear-gradient(135deg,var(--accent-tint),var(--surface)); display:flex; align-items:center; justify-content:center; border-bottom:1px solid var(--line);}
.case-thumb .tag{font-family:'JetBrains Mono'; font-size:11px; color:var(--accent); letter-spacing:0.1em; text-transform:uppercase;}
.case-body{padding:26px 24px;}
.case-card-flat{border-top:3px solid var(--accent);}
.case-card-flat .case-body{padding-top:24px;}
.case-body .industry-tag{font-family:'JetBrains Mono'; font-size:11px; color:var(--muted-2); letter-spacing:0.08em; text-transform:uppercase;}
.case-body h3{font-size:18px; margin-top:10px;}
.case-body p{color:var(--muted); font-size:14px; margin-top:10px; line-height:1.6;}
.case-body .result{margin-top:16px; padding-top:16px; border-top:1px solid var(--line); font-size:13.5px; color:var(--accent-pop); font-weight:700;}
.case-body .read{margin-top:14px; display:inline-block; font-size:13px; font-weight:700; color:var(--ink); text-decoration:underline; text-decoration-color:var(--ink); text-underline-offset:3px;}

.case-detail-hero{background:var(--accent-tint); border-bottom:1px solid var(--line); padding:64px 0;}
.case-meta{display:flex; gap:28px; flex-wrap:wrap; margin-top:24px; padding-top:24px; border-top:1px solid var(--line-strong);}
.case-meta div strong{display:block; font-size:13px; color:var(--muted-2); font-family:'JetBrains Mono'; text-transform:uppercase; letter-spacing:0.08em; font-weight:500;}
.case-meta div span{display:block; font-size:15px; color:var(--ink); font-weight:600; margin-top:4px;}
.case-body-content{max-width:760px; margin:0 auto;}
.case-body-content h2{font-size:24px; margin-top:44px; margin-bottom:16px;}
.case-body-content h2:first-child{margin-top:0;}
.case-body-content p{color:var(--muted); font-size:15.5px; line-height:1.75; margin:0 0 16px;}
.case-body-content ul{color:var(--muted); font-size:15.5px; line-height:1.75; padding-left:20px;}
.case-body-content li{margin-bottom:8px;}
.case-quote{background:var(--surface); border-left:3px solid var(--accent); padding:22px 26px; margin:28px 0; font-style:italic; color:var(--ink); font-size:15.5px; line-height:1.65;}

/* ---------- leadership / quote ---------- */
.quote-block{max-width:760px; margin:0 auto; text-align:center;}
.quote-photo{width:84px; height:84px; border-radius:50%; background:var(--accent); color:#fff; display:flex; align-items:center; justify-content:center; font-family:'Sora'; font-weight:700; font-size:26px; margin:0 auto 22px;}
.quote-block blockquote{font-family:'Sora'; font-size:clamp(18px,2.1vw,23px); font-weight:600; line-height:1.55; color:var(--ink); margin:0;}
.quote-block .attr{margin-top:22px; color:var(--accent); font-weight:600; font-size:14.5px;}

/* ---------- FAQ ---------- */
.faq{max-width:760px; margin:0 auto;}
.faq-item{border-bottom:1px solid var(--line);}
.faq-q{width:100%; text-align:left; background:none; border:none; color:var(--ink); padding:20px 0; font-family:'Sora'; font-size:15.5px; font-weight:600; display:flex; justify-content:space-between; align-items:center; cursor:pointer; -webkit-tap-highlight-color:transparent; outline:none;}
.faq-q:hover{color:var(--accent);}
.faq-q .plus{color:var(--accent); font-size:20px; transition:transform .2s ease; flex-shrink:0;}
.faq-item.open .plus{transform:rotate(45deg);}
.faq-a{max-height:0; overflow:hidden; transition:max-height .22s ease;}
.faq-a p{padding-bottom:20px; color:var(--muted); font-size:14.5px; line-height:1.65;}

/* ---------- final CTA (reuses hero's dark mesh treatment) ---------- */
.final-cta{background:var(--ink); color:#fff; text-align:center; padding:clamp(64px,8vw,96px) 0; position:relative; overflow:hidden;}
.final-cta .wrap{position:relative; z-index:2;}
.final-cta h2{color:#fff; font-size:clamp(26px,3.4vw,38px);}
.final-cta p{color:rgba(255,255,255,0.72); margin-top:16px; max-width:520px; margin:16px auto 0; font-size:15.5px;}
.final-cta .btn-row{justify-content:center;}
/* visible separator between CTA and footer, since both are dark */
.cta-footer-divider{height:2px; background:linear-gradient(90deg, transparent, var(--accent-pop), var(--accent), transparent); opacity:0.6;}

/* ---------- footer ---------- */
footer.site{background:#040F20; color:rgba(255,255,255,0.65); font-size:13.5px;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:36px; padding:56px 0 36px;}
.footer-logo img{height:48px; width:auto;}
.footer-tag{margin-top:14px; color:rgba(255,255,255,0.5); font-size:13.5px; line-height:1.6; max-width:260px;}
footer h4{font-family:'JetBrains Mono'; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:rgba(255,255,255,0.85); margin-bottom:16px; font-weight:500;}
footer ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px;}
footer a{color:rgba(255,255,255,0.6); transition:color .2s;}
footer a:hover{color:#fff;}
.footer-bottom{border-top:1px solid rgba(255,255,255,0.12); padding:22px 0; display:flex; justify-content:space-between; flex-wrap:wrap; gap:16px; font-size:12.5px; color:rgba(255,255,255,0.45);}
@media(max-width:900px){.footer-grid{grid-template-columns:1fr 1fr;}}

.footer-social{display:flex; gap:12px;}
.footer-social a{
  width:34px; height:34px; border-radius:50%; border:1px solid rgba(255,255,255,0.2);
  display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,0.7);
  transition:all .2s ease;
}
.footer-social a:hover{border-color:var(--accent-pop); color:var(--accent-pop); background:rgba(34,211,238,0.08); transform:translateY(-2px);}
.footer-social svg{width:16px; height:16px; fill:currentColor;}

/* ---------- cookie consent banner ---------- */
.cookie-banner{
  position:fixed; left:20px; right:20px; bottom:20px; z-index:200;
  max-width:640px; margin:0 auto; background:var(--ink); color:#E8F2FC;
  border-radius:12px; padding:22px 24px; box-shadow:0 12px 40px rgba(7,26,56,0.35);
  display:flex; flex-wrap:wrap; align-items:center; gap:18px;
  transform:translateY(140%); transition:transform .4s ease;
}
.cookie-banner.show{transform:translateY(0);}
.cookie-banner p{margin:0; font-size:13.5px; color:rgba(232,242,252,0.82); line-height:1.6; flex:1; min-width:220px;}
.cookie-banner a{color:var(--accent-pop); text-decoration:underline;}
.cookie-banner-actions{display:flex; gap:10px; flex-shrink:0;}
.cookie-btn{padding:10px 20px; border-radius:999px; font-size:13.5px; font-weight:700; cursor:pointer; border:1.5px solid transparent; transition:all .2s ease; font-family:'DM Sans',sans-serif;}
.cookie-btn-accept{background:var(--accent); color:#fff;}
.cookie-btn-accept:hover{background:var(--accent-pop); color:#051022;}
.cookie-btn-reject{background:transparent; color:#E8F2FC; border-color:rgba(255,255,255,0.3);}
.cookie-btn-reject:hover{border-color:#fff;}
@media(max-width:600px){
  .cookie-banner{left:12px; right:12px; bottom:12px; padding:18px; flex-direction:column; align-items:stretch;}
  .cookie-banner-actions{justify-content:flex-end;}
}
.whatsapp-float{
  position:fixed; bottom:24px; right:24px; z-index:100;
  width:58px; height:58px; border-radius:50%; background:#25D366;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 20px rgba(37,211,102,0.45);
  transition:transform .2s ease, box-shadow .2s ease;
}
.whatsapp-float:hover{transform:scale(1.08); box-shadow:0 8px 26px rgba(37,211,102,0.55);}
.whatsapp-float svg{width:30px; height:30px; fill:#fff;}
@media(max-width:600px){.whatsapp-float{bottom:18px; right:18px; width:52px; height:52px;}}

/* ---------- contact form ---------- */
.field{margin-bottom:20px;}
.field label{display:block; font-size:13.5px; font-weight:600; color:var(--ink); margin-bottom:8px;}
.field input,.field textarea,.field select{width:100%; padding:13px 16px; border:1px solid var(--line); border-radius:var(--radius-card); font-family:'DM Sans'; font-size:14.5px; color:var(--ink); background:#fff; transition:border-color .2s, box-shadow .2s;}
.field input:focus,.field textarea:focus,.field select:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(53,97,140,0.12);}
.field textarea{resize:vertical; min-height:130px;}
.field.field-error input,.field.field-error textarea,.field.field-error select{border-color:#D92D20; background:#FEF3F2; box-shadow:0 0 0 3px rgba(217,45,32,0.1);}
.field-error-msg{display:none; color:#D92D20; font-size:12.5px; font-weight:600; margin-top:6px;}
.field.field-error .field-error-msg{display:block;}
.form-msg{padding:16px 20px; border-radius:var(--radius-card); margin-bottom:24px; font-size:14.5px; font-weight:500;}
.form-msg.success{background:#EAF7F0; color:#0F7A4E; border:1px solid #C6EBD6;}
.form-msg.error{background:#FCEEEE; color:#B3261E; border:1px solid #F3C6C4;}
.honeypot{position:absolute; left:-9999px; opacity:0;}
.contact-info{display:flex; flex-direction:column; gap:22px;}
.contact-info .item{display:flex; gap:16px; align-items:flex-start;}
.contact-info .ic{width:38px; height:38px; border-radius:8px; background:var(--accent-tint); display:flex; align-items:center; justify-content:center; flex-shrink:0; color:var(--accent); font-family:'JetBrains Mono'; font-size:11px; font-weight:700;}
.contact-info strong{display:block; color:var(--ink); font-size:14.5px;}
.contact-info span{color:var(--muted); font-size:13.5px;}

/* ---------- interactive engagement CTA (dark split panel + inline form + info cards) ---------- */
.engage-cta{position:relative; background:var(--ink); color:#fff; overflow:hidden; padding:clamp(56px,7vw,88px) 0;}
.engage-cta::before,.engage-cta::after{
  content:''; position:absolute; border-radius:50%; filter:blur(90px); opacity:0.3; z-index:0; pointer-events:none;
  animation:heroFloat 14s ease-in-out infinite;
}
.engage-cta::before{width:420px; height:420px; background:var(--accent); top:-100px; left:-60px;}
.engage-cta::after{width:360px; height:360px; background:var(--accent-pop); bottom:-90px; right:-40px; animation-delay:3s;}
.engage-cta .engage-grid{
  position:relative; z-index:2; display:grid;
  grid-template-columns:1.05fr 0.95fr;
  grid-template-areas: "text cards" "form cards";
  column-gap:48px; row-gap:28px; align-items:start;
}
.engage-text{grid-area:text;}
.engage-cards{grid-area:cards;}
.engage-form-wrap{grid-area:form;}
.engage-cta h2{color:#fff; font-size:clamp(26px,3.2vw,38px); margin-top:12px; line-height:1.2;}
.engage-cta p.lead{color:rgba(232,242,252,0.78); margin-top:16px; font-size:15.5px; line-height:1.65; max-width:480px;}
.engage-form{margin-top:28px; max-width:460px;}
.engage-form .field{margin-bottom:14px;}
.engage-form input,.engage-form textarea{
  width:100%; padding:12px 16px; border-radius:var(--radius-card); border:1px solid rgba(255,255,255,0.18);
  background:rgba(255,255,255,0.06); color:#fff; font-family:'DM Sans',sans-serif; font-size:14px; transition:border-color .2s, background .2s;
}
.engage-form input::placeholder,.engage-form textarea::placeholder{color:rgba(232,242,252,0.45);}
.engage-form .field.field-error input,.engage-form .field.field-error textarea{border-color:#FF8A80 !important; background:rgba(217,45,32,0.12) !important;}
.engage-form .field-error-msg{display:none; color:#FFB4AC; font-size:12px; font-weight:600; margin-top:6px;}
.engage-form .field.field-error .field-error-msg{display:block;}

/* ---------- careers page ---------- */
.job-card{background:#fff; border:1px solid var(--line); border-radius:14px; padding:26px 28px; display:flex; flex-direction:column; height:100%;}
.job-card .job-meta-row{display:flex; flex-wrap:wrap; gap:8px; margin:10px 0 14px;}
.job-tag{background:var(--accent-tint); color:var(--accent); font-size:11.5px; font-weight:700; padding:5px 12px; border-radius:999px; text-transform:uppercase; letter-spacing:0.03em;}
.job-tag.level{background:#F0EDFB; color:#5B3FBF;}
.job-card .job-id{font-family:'JetBrains Mono'; font-size:11.5px; color:var(--muted-2); letter-spacing:0.03em;}
.job-card .job-posted{font-size:12px; color:var(--muted-2); margin-top:auto; padding-top:16px; border-top:1px solid var(--line);}
.job-card ul.job-points{list-style:none; margin:14px 0 0; padding:0;}
.job-card ul.job-points li{position:relative; padding-left:16px; font-size:13.5px; color:var(--muted); line-height:1.6; margin-bottom:6px;}
.job-card ul.job-points li::before{content:''; position:absolute; left:0; top:8px; width:5px; height:5px; border-radius:50%; background:var(--accent);}

.job-row{background:#fff; border:1px solid var(--line); border-radius:14px; padding:32px 34px; display:grid; grid-template-columns:240px 1fr; gap:32px; margin-bottom:20px;}
.job-row:nth-child(even){background:var(--surface);}
.job-row .jr-side{border-right:1px solid var(--line); padding-right:28px;}
.job-row .jr-side .job-id{margin-bottom:10px;}
.job-row .jr-side h3{font-size:19px; margin-bottom:12px;}
.job-row .jr-side .job-meta-row{margin:0 0 14px;}
.job-row .jr-side .job-posted{border-top:none; padding-top:0; margin-top:10px;}
.job-row .jr-main p{margin-bottom:6px;}
@media(max-width:760px){
  .job-row{grid-template-columns:1fr; padding:26px;}
  .job-row .jr-side{border-right:none; border-bottom:1px solid var(--line); padding-right:0; padding-bottom:18px; margin-bottom:18px;}
}

/* ---------- apply page ---------- */
.apply-summary{background:var(--accent-tint); border:1px solid var(--line); border-radius:14px; padding:22px 26px; margin-bottom:32px; display:flex; flex-wrap:wrap; gap:24px; align-items:center;}
.apply-summary .as-item .lbl{font-size:11.5px; text-transform:uppercase; letter-spacing:0.04em; color:var(--muted-2); font-weight:700; margin-bottom:4px;}
.apply-summary .as-item .val{font-size:15.5px; font-weight:700; color:var(--ink);}
.btn-cancel{background:transparent; border:1.5px solid var(--line); color:var(--muted); padding:13px 26px; border-radius:var(--radius); font-weight:700; font-size:14.5px; cursor:pointer; transition:all .2s ease; text-decoration:none; display:inline-flex; align-items:center;}
.btn-cancel:hover{border-color:var(--ink); color:var(--ink);}

/* ---------- careers banner (home / about / contact) ---------- */
.careers-banner{background:var(--accent-tint); border:1px solid var(--line); border-radius:16px; padding:44px 36px; display:flex; flex-direction:column; align-items:center; text-align:center; gap:20px;}
.careers-banner .cb-text h3{font-size:22px; margin-bottom:8px;}
.careers-banner .cb-text p{color:var(--muted); font-size:15px; margin:0; max-width:560px;}
.careers-banner .btn-primary{flex-shrink:0;}
@media(max-width:600px){.careers-banner{padding:28px 22px;}}
.engage-form input:focus,.engage-form textarea:focus{outline:none; border-color:var(--accent-pop); background:rgba(255,255,255,0.1);}
.engage-form textarea{min-height:80px; resize:vertical;}
.engage-form-row{display:flex; gap:12px; flex-wrap:wrap; margin-top:18px;}
.engage-msg{padding:12px 16px; border-radius:var(--radius-card); margin-bottom:16px; font-size:13.5px; font-weight:500;}
.engage-msg.success{background:rgba(34,211,238,0.15); color:#A5F3FC; border:1px solid rgba(34,211,238,0.3);}
.engage-msg.error{background:rgba(220,38,38,0.15); color:#FCA5A5; border:1px solid rgba(220,38,38,0.3);}

.engage-cards{display:flex; flex-direction:column; gap:18px; position:relative; z-index:2;}
.engage-card{background:#fff; border-radius:14px; padding:22px 24px; display:flex; gap:16px; align-items:flex-start; box-shadow:0 10px 30px rgba(0,0,0,0.2); transition:transform .25s ease;}
.engage-card:hover{transform:translateY(-3px);}
.engage-card .ic{width:38px; height:38px; border-radius:10px; background:var(--accent-tint); color:var(--accent); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.engage-card h3{color:var(--ink); font-size:17px; margin:0;}
.engage-card p{color:var(--muted); font-size:13.5px; margin-top:8px; line-height:1.6;}

@media(max-width:900px){
  .engage-cta .engage-grid{grid-template-columns:1fr; grid-template-areas: "text" "cards" "form";}
  .engage-form{max-width:none;}
}
/* ---------- technology ecosystem showcase ---------- */
.tech-card{background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:28px 26px;}
.tech-card .tech-head{display:flex; align-items:center; gap:14px; margin-bottom:22px;}
.tech-card .tech-ic{width:44px; height:44px; border-radius:10px; background:var(--accent-tint); color:var(--accent); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.tech-card h3{font-size:17px;}
.tech-logos{display:flex; flex-wrap:wrap; gap:10px; margin-bottom:20px;}
.tech-logos span{background:#fff; border:1px solid var(--line); border-radius:8px; padding:8px 14px; font-size:13px; font-weight:600; color:var(--ink);}
.tech-tags{border-top:1px solid var(--line); padding-top:16px; display:flex; flex-wrap:wrap; gap:6px 0; font-size:12.5px; color:var(--muted-2);}
.tech-tags span::after{content:'\00a0\00a0|\00a0\00a0';}
.tech-tags span:last-child::after{content:'';}

.cadence-table{width:100%; border-collapse:collapse; margin-top:8px; border:1px solid var(--line);}
.cadence-table thead th{background:var(--ink); color:#fff; text-align:left; padding:16px 20px; font-family:'JetBrains Mono'; font-size:12px; letter-spacing:0.08em; text-transform:uppercase; font-weight:500;}
.cadence-table thead th:last-child{white-space:nowrap;}
.cadence-table tbody tr:nth-child(even){background:var(--surface);}
.cadence-table tbody td{padding:18px 20px; font-size:14.5px; color:var(--muted); border-bottom:1px solid var(--line); vertical-align:top;}
.cadence-table tbody td:first-child{color:var(--ink); font-weight:600; white-space:nowrap;}
.cadence-table tbody td:last-child{color:var(--accent); font-weight:600; white-space:nowrap;}
.cadence-table-wrap{overflow-x:auto; -webkit-overflow-scrolling:touch;}
@media(max-width:700px){ .cadence-table{font-size:13px;} .cadence-table thead th, .cadence-table tbody td{padding:12px 14px;} }

/* Service Coverage cards with sub-bullets */
.card ul.sub-points{list-style:none; margin:12px 0 0; padding:0;}
.card ul.sub-points li{position:relative; padding-left:16px; font-size:13.5px; color:var(--muted); line-height:1.6; margin-bottom:6px;}
.card ul.sub-points li::before{content:''; position:absolute; left:0; top:8px; width:5px; height:5px; border-radius:50%; background:var(--accent);}
.reveal{opacity:0; transform:translateY(14px); animation:revealIn .6s ease forwards;}
@keyframes revealIn{to{opacity:1; transform:translateY(0);}}
/* Safety net: if for any reason the animation doesn't fire (JS disabled browsers
   still support CSS animation, so this mainly guards against edge cases), content
   is still visible by default rather than permanently hidden. */
.no-js .reveal{opacity:1; transform:none; animation:none;}
@media (prefers-reduced-motion: reduce){ .reveal{opacity:1!important; transform:none!important; animation:none!important;} }