/* ==========================================================================
   Avid Tech Services — "immersive dark" theme (homepage preview)
   Loaded after the page's inline styles, so it overrides them.
   ========================================================================== */

:root{
  --night:#05070C;
  --night-2:#080B12;
  --card-dark:#10131C;
  --grey-bg:#F3F4F7;
  --grad:linear-gradient(90deg,#33E1ED 0%,#FF4FD8 100%);
  --hair:rgba(11,14,21,0.10);
}

body{ background:#fff; }
.band-paper{ background:#fff; }
.band-dim{ background:var(--grey-bg); }
.band-forest{ background:var(--night-2); }

/* ---------- Typography ---------- */
h2.section-title{
  font-size:clamp(30px,4vw,54px);
  font-weight:500;
  line-height:1.1;
  letter-spacing:-0.025em;
  max-width:780px;
  margin-top:18px;
}
.eyebrow{
  font-size:11.5px; font-weight:700; letter-spacing:0.16em;
}
.eyebrow::before{
  width:22px; height:2px; border-radius:2px; background:var(--grad);
}
.section-head{ margin-bottom:64px; }
.section-head .side{ font-size:16px; line-height:1.7; max-width:360px; }
section{ padding:120px 0; }

/* ---------- Buttons ---------- */
.btn{
  text-transform:uppercase; letter-spacing:0.05em;
  font-size:12.5px; font-weight:700; padding:15px 28px;
  transition:background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}
.btn svg{ transition:transform .2s ease; }
.btn:hover svg{ transform:translateX(4px); }
.btn-primary{ color:#05110F; }
.btn-ghost{ border-color:rgba(11,14,21,0.35); }
.btn-ghost:hover{ background:var(--ink); color:#fff; border-color:var(--ink); }
.btn-ghost.on-dark{ border-color:rgba(255,255,255,0.4); color:#fff; }
.btn-ghost.on-dark:hover{ background:rgba(255,255,255,0.08); border-color:#fff; }
.btn-ghost-light{ background:transparent; border-color:rgba(11,14,21,0.35); }
.work-link{
  text-transform:uppercase; letter-spacing:0.08em; font-size:12px; font-weight:700;
}

/* ---------- Header ---------- */
header.nav{
  position:fixed; top:0; left:0; right:0;
  background:transparent;
  border-bottom:1px solid transparent;
  transition:background .3s ease, border-color .3s ease;
}
header.nav.is-compact{
  background:rgba(5,7,12,0.84);
  backdrop-filter:blur(14px) saturate(140%);
  -webkit-backdrop-filter:blur(14px) saturate(140%);
  border-bottom-color:rgba(255,255,255,0.08);
}
section[id]{ scroll-margin-top:72px; }
.nav-inner{ padding:15px 32px; transition:padding .25s ease; }
header.nav.is-compact .nav-inner{ padding-top:10px; padding-bottom:10px; }
.logo{ color:#fff; }
.logo b{ color:var(--accent); }
.nav-links a, .nav-dropdown-trigger{ color:#C6CEDA; font-weight:500; }
.nav-links a:hover, .nav-dropdown:hover .nav-dropdown-trigger, .nav-dropdown.open .nav-dropdown-trigger{ color:#fff; }
.nav-cta .btn{ padding:11px 22px; }
.burger{ border-color:rgba(255,255,255,0.22); color:#fff; }
.mobile-nav-panel{
  background:#07090F; border-bottom:1px solid rgba(255,255,255,0.08);
  box-shadow:0 20px 40px rgba(0,0,0,0.45);
}
.mobile-nav-panel a, .mobile-nav-group summary, .mobile-nav-sublist a{ color:#C6CEDA; }
.mobile-nav-panel a, .mobile-nav-group{ border-bottom-color:rgba(255,255,255,0.08); }
.mobile-nav-group summary::after{ color:#C6CEDA; }
.scroll-progress{
  position:absolute; left:0; bottom:-1px; height:2px; width:0;
  background:var(--grad); pointer-events:none;
}

/* ---------- Hero ---------- */
.hero{
  background:var(--night);
  min-height:100vh; min-height:100svh;
  display:flex; align-items:center;
}
.hero::before{
  background:
    radial-gradient(640px 460px at 88% 6%, rgba(255,79,216,0.20), transparent 70%),
    radial-gradient(520px 380px at 6% 100%, rgba(51,225,237,0.16), transparent 70%);
}
.hero-art{
  position:absolute; inset:0; width:100%; height:100%; display:block;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,0.25) 28%,#000 60%);
  mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,0.25) 28%,#000 60%);
}
.hero-inner{
  width:100%;
  padding-top:calc(72px + clamp(12px,3.5vh,44px));
  padding-bottom:clamp(20px,5vh,56px);
}
.hero h1{
  font-size:clamp(34px,min(5.6vw,8.8vh),78px);
  font-weight:400;
  line-height:1.04;
  letter-spacing:-0.03em;
  margin-top:clamp(10px,2.2vh,22px);
}
.hero h1 em{
  background:var(--grad);
  -webkit-background-clip:text; background-clip:text;
  color:transparent; -webkit-text-fill-color:transparent;
}
.hero p.lead{ font-size:clamp(15px,2.2vh,18px); color:#B4BDC9; max-width:560px; margin-top:clamp(12px,2.6vh,22px); line-height:1.6; }
.hero-ctas{ margin-top:clamp(18px,3.6vh,34px); }
.hero-meta{ margin-top:clamp(18px,4vh,44px); }
.hero-card{
  background:rgba(8,11,18,0.55);
  border:1px solid rgba(255,255,255,0.12);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  box-shadow:0 30px 80px rgba(0,0,0,0.4);
}
.logo-strip{ background:#fff; }

/* ---------- Services (image cards, hover reveal) ---------- */
.services-grid{
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:0; flex-direction:initial;
  width:100vw; position:relative; left:50%; margin-left:-50vw;
  border-radius:0; overflow:hidden; isolation:isolate;
}
.service-card,
.service-card:nth-child(even){
  display:block; position:relative; height:auto; aspect-ratio:4/5; flex-direction:initial;
  border:0; border-radius:0; overflow:hidden; background:var(--night);
  isolation:isolate;
}
.service-card::after{
  content:""; position:absolute; inset:0; z-index:2; pointer-events:none;
  box-shadow:inset 0 0 0 0.5px rgba(255,255,255,0.14);
}
.service-card:hover{ background:var(--night); transform:none; box-shadow:none; }
.service-card .card-media{ position:absolute; inset:0; height:100%; flex:none; }
.service-card .card-media img{ width:100%; height:100%; object-fit:cover; transition:transform .7s ease; }
.service-card:hover .card-media img{ transform:scale(1.06); }
.service-card .card-body{
  position:absolute; inset:0; padding:26px 24px; z-index:1;
  display:flex; flex-direction:column; justify-content:flex-end; gap:0;
  background:linear-gradient(to top, rgba(5,7,12,0.88) 0%, rgba(5,7,12,0.45) 38%, rgba(5,7,12,0) 62%);
  transition:background .35s ease;
}
.service-card:hover .card-body,
.service-card:focus-within .card-body{ background:rgba(5,7,12,0.84); }
.service-card .icon{
  position:absolute; top:20px; left:20px; width:42px; height:42px; border-radius:12px;
  background:rgba(5,7,12,0.45); border:1px solid rgba(255,255,255,0.18);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
}
.service-card .icon svg{ stroke:var(--accent); }
.service-card h3{
  color:#fff; font-size:22px; font-weight:600; letter-spacing:-0.015em; line-height:1.2;
}
.service-card p,
.service-card .work-link{
  max-height:0; opacity:0; overflow:hidden; transform:translateY(8px);
  transition:max-height .45s ease, opacity .35s ease, transform .35s ease, margin .35s ease;
}
.service-card p{ color:#C9D2DE; font-size:14.5px; line-height:1.6; margin-top:0; }
.service-card .work-link{ color:var(--accent); margin-top:0; }
.service-card:hover p,
.service-card:focus-within p{ max-height:170px; opacity:1; transform:none; margin-top:12px; }
.service-card:hover .work-link,
.service-card:focus-within .work-link{ max-height:30px; opacity:1; transform:none; margin-top:14px; }
.services-foot{ border-top-color:var(--hair); }

/* ---------- Stats ---------- */
.stats-band{
  background:
    radial-gradient(900px 420px at 88% 0%, rgba(255,79,216,0.14), transparent 62%),
    radial-gradient(760px 420px at 0% 100%, rgba(51,225,237,0.12), transparent 62%),
    var(--night-2);
}
.stats-grid{
  background:none; border:0; border-radius:0; overflow:visible;
  gap:56px; margin-top:80px;
}
.stat{ background:none; text-align:left; padding:30px 0 0; position:relative; }
.stat::before{
  content:""; position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg,#33E1ED 0%,#FF4FD8 62%,transparent 100%);
}
.stat .n{
  font-size:clamp(54px,7vw,96px); font-weight:300; line-height:1; letter-spacing:-0.035em;
  margin-top:26px;
  background:var(--grad);
  -webkit-background-clip:text; background-clip:text;
  color:transparent; -webkit-text-fill-color:transparent;
}
.stat .l{ font-size:19px; font-weight:500; margin-top:20px; }
.stat .d{ font-size:15px; color:#9BA7B6; margin-left:0; margin-right:0; max-width:320px; line-height:1.65; }

/* ---------- Industries explorer (enhanced by theme.js) ---------- */
.industries-enhanced .industries-grid{
  grid-template-columns:minmax(240px,340px) 1fr;
  gap:72px; align-items:start;
}
.ind-nav{ grid-column:1; grid-row:1; display:flex; flex-direction:column; }
.ind-nav button{
  display:flex; align-items:center; gap:16px; width:100%; text-align:left;
  padding:14px 0; background:none; border:0; border-bottom:1px solid var(--hair);
  font:500 21px/1.2 'Plus Jakarta Sans',system-ui,sans-serif; letter-spacing:-0.01em;
  color:#A2AAB7; cursor:pointer; transition:color .2s ease, padding .2s ease;
}
.ind-nav button .n{ font-size:12px; font-weight:700; letter-spacing:0.1em; color:#C3C9D3; min-width:22px; transition:color .2s ease; }
.ind-nav button .t{ flex:1; }
.ind-nav button .a{ opacity:0; transform:translateX(-6px); transition:opacity .2s ease, transform .2s ease; color:var(--accent-deep); }
.ind-nav button:hover{ color:#5C6573; }
.ind-nav button[aria-selected="true"]{ color:var(--ink); padding-left:6px; border-bottom-color:transparent; position:relative; }
.ind-nav button[aria-selected="true"]::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:2px; background:var(--grad);
}
.ind-nav button[aria-selected="true"] .n{ color:var(--accent-deep); }
.ind-nav button[aria-selected="true"] .a{ opacity:1; transform:none; }
.ind-nav button:focus-visible{ outline:2px solid var(--accent-deep); outline-offset:3px; }

.industries-enhanced .industry-card{
  grid-column:2; grid-row:1; display:none;
  padding:0; border:0; border-radius:0; background:transparent;
}
.industries-enhanced .industry-card.is-active{ display:flex; animation:indIn .45s ease; }
@keyframes indIn{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
.industries-enhanced .industry-card .card-media{ height:clamp(216px,34.8vh,324px); border-radius:24px; margin-bottom:24px; }
.industries-enhanced .industry-card h3{ font-size:clamp(26px,3vw,36px); font-weight:500; letter-spacing:-0.02em; }
.industries-enhanced .industry-card ul{
  margin-top:18px; display:grid; grid-template-columns:1fr 1fr; gap:14px 36px; flex-grow:0;
}
.industries-enhanced .industry-card li{
  background:none; border:0; border-radius:0; padding:0 0 0 20px; position:relative;
  font-size:15.5px; font-weight:500; color:#3F4755; line-height:1.45;
}
.industries-enhanced .industry-card li::before{
  content:""; position:absolute; left:0; top:0.62em; width:10px; height:2px; background:var(--grad);
}
.industries-enhanced .industry-card .work-link{
  align-self:flex-start; margin-top:24px; padding:12px 24px; border:1px solid rgba(11,14,21,0.35);
  border-radius:100px; color:var(--ink); transition:background .2s ease, color .2s ease;
}
.industries-enhanced .industry-card .work-link:hover{ background:var(--ink); color:#fff; text-decoration:none; }

/* ---------- Engagement ---------- */
.engage-card{ border-radius:26px; background:#fff; border-color:var(--hair); }
.engage-card.dark{ background:var(--card-dark); }
.engage-card h3{ font-size:22px; font-weight:600; letter-spacing:-0.015em; }

/* ---------- Selected work (dark cards) ---------- */
.work-card{
  background:var(--card-dark); border:1px solid rgba(255,255,255,0.08); border-radius:26px;
  transition:transform .3s ease, box-shadow .3s ease;
}
.work-card:hover{ transform:translateY(-5px); box-shadow:0 30px 70px rgba(5,7,12,0.35); }
.work-thumb{ height:232px; }
.work-body{ padding:28px 30px 32px; }
.work-body h3{ color:#fff; font-size:20px; font-weight:600; line-height:1.3; letter-spacing:-0.01em; }
.work-body p{
  color:#A9B3C1; font-size:14.5px;
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:5; overflow:hidden;
}
.work-card .work-link{ color:var(--accent); margin-top:20px; }
.work-card .work-link:hover{ color:#fff; text-decoration:none; }

/* ---------- Testimonials & Why us ---------- */
.testimonial-card{ border-radius:26px; padding:36px; border-color:var(--hair); }
.testimonial-quote{ font-size:16.5px; line-height:1.7; }
.why-card{
  background:#fff; border-radius:22px; border-color:var(--hair);
  position:relative; overflow:hidden; padding:34px 26px;
  transition:box-shadow .3s ease, transform .3s ease;
}
.why-card::before{
  content:""; position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg,#33E1ED,#FF4FD8 70%,transparent);
}
.why-card:hover{ background:#fff; box-shadow:0 22px 50px rgba(11,14,21,0.09); transform:translateY(-3px); }
.why-card h3{ font-size:17.5px; font-weight:600; }

/* ---------- Stack / CEO (dark bands) ---------- */
.stack-tab.active{ color:#05110F; }
.stack-cta{ background:var(--grey-bg); }

/* ---------- Contact (dark gradient + white form card) ---------- */
#contact{
  background:
    radial-gradient(820px 520px at 100% 0%, rgba(255,79,216,0.30), transparent 62%),
    radial-gradient(720px 520px at 0% 100%, rgba(51,225,237,0.18), transparent 62%),
    var(--night);
  color:#fff;
}
#contact .eyebrow{ color:#8FF3F9; }
#contact h2.section-title{ color:#fff; }
#contact .contact-list .icon{ background:rgba(255,255,255,0.06); border-color:rgba(255,255,255,0.16); }
#contact .contact-list .icon svg{ stroke:var(--accent); }
#contact .contact-list .t{ color:#fff; }
#contact .contact-list .d{ color:#9BA7B6; }
.form-card{ border:0; border-radius:26px; box-shadow:0 40px 100px rgba(0,0,0,0.5); color:var(--ink); }
.form-error{
  display:none; margin:0 0 16px; padding:12px 16px; border-radius:10px;
  background:rgba(220,60,60,0.08); border:1px solid rgba(220,60,60,0.25);
  font-size:13.5px; color:#B23A3A;
}
.form-error.show{ display:block; }

/* ---------- Footer ---------- */
footer{ background:var(--night); }

/* ---------- Scroll reveal (class added by theme.js only) ---------- */
.js-reveal{ opacity:0; transform:translateY(26px); transition:opacity .75s ease, transform .75s ease; }
.js-reveal.in{ opacity:1; transform:none; }
.service-card.js-reveal.in:hover{ transform:none; }
.work-card.js-reveal.in:hover{ transform:translateY(-5px); }
.why-card.js-reveal.in:hover{ transform:translateY(-3px); }

/* ---------- Responsive ---------- */
@media (max-width:980px){
  .industries-enhanced .industries-grid{ grid-template-columns:1fr; gap:28px; }
  .ind-nav{
    flex-direction:row; gap:8px; overflow-x:auto; padding-bottom:6px; scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }
  .ind-nav::-webkit-scrollbar{ display:none; }
  .ind-nav button{
    width:auto; flex:0 0 auto; white-space:nowrap; font-size:14.5px; font-weight:600;
    padding:10px 18px; border:1px solid var(--hair); border-radius:100px; gap:0;
  }
  .ind-nav button .n, .ind-nav button .a{ display:none; }
  .ind-nav button[aria-selected="true"]{ background:var(--ink); color:#fff; padding-left:18px; border-color:var(--ink); }
  .ind-nav button[aria-selected="true"]::after{ display:none; }
  .industries-enhanced .industry-card{ grid-column:1; grid-row:2; }
  .industries-enhanced .industry-card .card-media{ height:288px; border-radius:20px; }
  .stats-grid{ gap:40px; margin-top:56px; }
  .hero-art{
    -webkit-mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,0.55) 45%,#000 100%);
    mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,0.55) 45%,#000 100%);
    opacity:0.7;
  }
  .hero-inner{ padding-top:96px; padding-bottom:72px; }
}
@media (max-width:600px){
  section{ padding:76px 0; }
  .section-head{ margin-bottom:40px; }
  .industries-enhanced .industry-card ul{ grid-template-columns:1fr; }
  .industries-enhanced .industry-card h3{ font-size:26px; }
  .hero h1{ font-size:clamp(36px,10vw,48px); }
  .hero p.lead{ font-size:16.5px; }
  .testimonial-card{ padding:28px; }
}

@media (prefers-reduced-motion:reduce){
  .js-reveal{ opacity:1; transform:none; transition:none; }
  .service-card, .work-card, .why-card, .service-card .card-media img{ transition:none; }
  .industries-enhanced .industry-card.is-active{ animation:none; }
}

/* ---------- Mobile header ---------- */
@media (max-width:600px){
  .nav-inner{ gap:10px; }
  .logo{ font-size:16px; gap:8px; min-width:0; }
  .logo > span:last-child{ white-space:nowrap; }
  .nav-cta{ gap:8px; flex-shrink:0; }
  .nav-cta .btn{ padding:9px 14px; font-size:11px; }
  .burger{ margin-left:0; width:38px; height:38px; }
}
@media (max-width:430px){
  .nav-cta .btn{ display:none; }
}


/* ---------- Staff augmentation heading: two controlled lines ---------- */
.stack-head{ max-width:980px; }
.stack-title{ max-width:none; }
.stack-desc{ max-width:none; font-size:17px; line-height:1.6; }
.d-br{ display:inline; }

/* ---------- Footer: link columns aligned to the right edge of the canvas ---------- */
.foot-top{
  display:flex; align-items:flex-start; justify-content:flex-end; gap:clamp(40px,6vw,88px);
}
.foot-brand{ margin-right:auto; max-width:300px; }
.foot-col{ min-width:0; }

/* ---------- v2 responsive ---------- */
@media (max-width:980px){
  .services-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .service-card, .service-card:nth-child(even){ aspect-ratio:4/3.3; }
}
@media (max-width:980px){
  .service-card, .service-card:nth-child(even){ flex-direction:initial; height:auto !important; }
  .service-card .card-media{ height:100%; }
  .foot-top{ display:grid; grid-template-columns:repeat(2,1fr); gap:32px; }
  .foot-brand{ grid-column:1 / -1; max-width:none; }
}
/* touch devices and phones have no hover: always show the description */
@media (hover:none), (max-width:600px){
  .service-card .card-body{ background:linear-gradient(to top, rgba(5,7,12,0.92) 0%, rgba(5,7,12,0.7) 55%, rgba(5,7,12,0.1) 100%); }
  .service-card p{ max-height:170px; opacity:1; transform:none; margin-top:10px; }
  .service-card .work-link{ max-height:30px; opacity:1; transform:none; margin-top:12px; }
}
@media (max-width:600px){
  .services-grid{ grid-template-columns:minmax(0,1fr); }
  .service-card, .service-card:nth-child(even){ aspect-ratio:4/3.4; }
  .foot-top{ grid-template-columns:1fr; }
  .d-br{ display:none; }
  .stack-desc{ font-size:15.5px; }
}
@media (prefers-reduced-motion:reduce){
  .service-card .card-media img, .service-card p, .service-card .work-link, .service-card .card-body{ transition:none; }
}


/* ---------- Hero: "How it starts" card ---------- */
.hero-steps{ position:relative; padding:38px 40px 34px; border-radius:28px; }
.hero-steps::before{
  content:""; position:absolute; left:30px; right:30px; top:0; height:2px; border-radius:2px;
  background:linear-gradient(90deg,#33E1ED,#FF4FD8 70%,transparent);
}
.hc-eyebrow{
  display:block; font-size:11.5px; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; color:#8FF3F9;
  margin-bottom:30px;
}
.hc-steps{ list-style:none; margin:0; padding:0; }
.hc-steps li{
  position:relative; display:grid; grid-template-columns:40px 1fr auto; align-items:center; gap:18px;
  padding:0 0 34px;
}
.hc-steps li:last-child{ padding-bottom:0; }
.hc-steps li:not(:last-child)::before{
  content:""; position:absolute; left:19px; top:46px; bottom:6px; width:2px; border-radius:2px;
  background:linear-gradient(180deg,rgba(51,225,237,0.5),rgba(255,79,216,0.3));
}
.hc-node{
  width:40px; height:40px; border-radius:50%; display:grid; place-items:center;
  font-size:14px; font-weight:700; color:var(--accent);
  background:rgba(51,225,237,0.10); border:1px solid rgba(51,225,237,0.45);
  box-shadow:0 0 22px rgba(51,225,237,0.22);
}
.hc-t{ font-size:18px; font-weight:500; color:#fff; letter-spacing:-0.01em; }
.hc-v{ font-size:15px; font-weight:500; color:#A9B4C4; white-space:nowrap; }
.hc-models{
  margin:34px 0 0; padding-top:22px; border-top:1px solid rgba(255,255,255,0.10);
  font-size:13.5px; font-weight:500; letter-spacing:0.02em; color:#8794A6;
}

/* ---------- Contact: dark glass form, matches the theme ---------- */
.form-card{
  position:relative; background:rgba(255,255,255,0.045); color:#fff;
  border:1px solid rgba(255,255,255,0.13); border-radius:28px; padding:40px;
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  box-shadow:0 40px 100px rgba(0,0,0,0.45);
}
.form-card::before{
  content:""; position:absolute; left:32px; right:32px; top:0; height:2px; border-radius:2px;
  background:linear-gradient(90deg,#33E1ED,#FF4FD8 70%,transparent);
}
.form-card .field label{
  font-size:11.5px; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:#9EAABB;
}
.form-card .field input, .form-card .field select, .form-card .field textarea{
  background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.14); color:#fff;
  border-radius:14px; padding:14px 16px; font-size:15px;
  transition:border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.form-card .field input::placeholder, .form-card .field textarea::placeholder{ color:#6F7B8E; }
.form-card .field input:focus, .form-card .field select:focus, .form-card .field textarea:focus{
  border-color:var(--accent); background:rgba(51,225,237,0.06); box-shadow:0 0 0 4px rgba(51,225,237,0.14);
}
.form-card .field select{ color-scheme:dark; }
.form-card .field select option{ background:#0C0F18; color:#fff; }
.form-card .radio-chip{
  border-color:rgba(255,255,255,0.18); color:#C6CEDA; padding:10px 18px; cursor:pointer;
  transition:border-color .2s ease, background .2s ease, color .2s ease;
}
.form-card .radio-chip:hover{ border-color:rgba(255,255,255,0.4); }
.form-card .radio-chip.checked{ background:rgba(51,225,237,0.14); border-color:var(--accent); color:#8FF3F9; }
.form-card .btn-primary{ padding:17px 28px; font-size:13px; margin-top:6px; }
.form-card .btn-primary::after{ content:"→"; font-size:16px; transition:transform .2s ease; }
.form-card .btn-primary:hover::after{ transform:translateX(4px); }
.form-card .btn-primary:disabled{ opacity:0.7; cursor:wait; }
.form-card .form-success h3{ color:#fff; }
.form-card .form-success p{ color:#AAB4C3; }
.form-card .form-success .icon{ background:rgba(51,225,237,0.14); }
.form-card .form-success .icon svg{ stroke:var(--accent); }
.form-card .form-error{ background:rgba(255,90,90,0.10); border-color:rgba(255,120,120,0.35); color:#FFB4B4; }

@media (max-width:600px){
  .hero-steps{ padding:28px 22px 26px; }
  .hc-steps li{ gap:14px; padding-bottom:26px; }
  .hc-t{ font-size:16.5px; }
  .form-card{ padding:28px 22px; border-radius:22px; }
}

.form-card .radio-chip{ text-transform:none; letter-spacing:0; font-size:13.5px; font-weight:600; }
.form-card .field label.radio-chip{ text-transform:none; letter-spacing:0; font-size:13.5px; font-weight:600; color:#C6CEDA; }
.form-card .field label.radio-chip.checked{ color:#8FF3F9; }


/* ---------- Services footer: statement + CTA (no divider) ---------- */
.services-foot{
  margin-top:0; padding-top:84px; border-top:0;
  display:flex; align-items:center; justify-content:space-between; gap:40px; flex-wrap:wrap;
}
.services-foot .sf-copy{ max-width:760px; }
.services-foot p{
  margin-top:16px;
  font-size:clamp(28px,3.4vw,46px); font-weight:400; line-height:1.14; letter-spacing:-0.028em; color:var(--ink);
}
.services-foot p em{
  font-style:normal;
  background:linear-gradient(90deg,#0FA0AD,#E23FC4);
  -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent;
}
.services-foot .btn-primary{
  padding:20px 38px; font-size:13.5px; gap:12px;
  box-shadow:0 14px 40px rgba(51,225,237,0.35);
}
.services-foot .btn-primary::after{ content:"→"; font-size:17px; transition:transform .2s ease; }
.services-foot .btn-primary:hover{ transform:translateY(-2px); box-shadow:0 18px 46px rgba(51,225,237,0.45); }
.services-foot .btn-primary:hover::after{ transform:translateX(4px); }
@media (max-width:760px){
  .services-foot{ padding-top:56px; gap:28px; }
  .services-foot .btn-primary{ width:100%; justify-content:center; }
}


/* ---------- Engagement models: dark section, three glass cards ---------- */
.engage-band{
  background:
    radial-gradient(820px 460px at 0% 0%, rgba(255,79,216,0.13), transparent 62%),
    radial-gradient(760px 460px at 100% 100%, rgba(51,225,237,0.12), transparent 62%),
    var(--night-2);
}
#engagement .eyebrow{ color:#8FF3F9; }
#engagement h2.section-title{ color:#fff; }
#engagement .section-head .side{ color:#9BA7B6; }
#engagement .engage-grid{
  display:grid; grid-template-columns:repeat(3,1fr); grid-template-rows:none; gap:24px;
}
#engagement .engage-card, #engagement .engage-card.dark{
  grid-row:auto; position:relative; overflow:hidden;
  display:flex; flex-direction:column; gap:0;
  padding:40px 34px 38px; border-radius:28px;
  background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.10); color:#fff;
  transition:transform .3s ease, border-color .3s ease, background .3s ease, box-shadow .3s ease;
}
#engagement .engage-card::before{
  content:""; position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg,#33E1ED,#FF4FD8 65%,transparent);
}
#engagement .engage-card:hover{
  transform:translateY(-4px); background:rgba(255,255,255,0.06);
  border-color:rgba(51,225,237,0.38); box-shadow:0 30px 70px rgba(0,0,0,0.4);
}
#engagement .engage-card.js-reveal.in:hover{ transform:translateY(-4px); }
#engagement .engage-card .idx{ display:flex; flex-direction:column; gap:10px; margin-bottom:26px; }
#engagement .engage-card .idx .num{
  font-size:clamp(56px,6vw,76px); font-weight:300; line-height:1; letter-spacing:-0.035em;
  background:var(--grad); -webkit-background-clip:text; background-clip:text;
  color:transparent; -webkit-text-fill-color:transparent;
}
#engagement .engage-card .idx .lbl{
  font-size:11.5px; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; color:#8FF3F9;
}
#engagement .engage-card h3{
  color:#fff; font-size:clamp(24px,2.3vw,30px); font-weight:500; letter-spacing:-0.02em; line-height:1.15;
}
#engagement .engage-card > p{ margin-top:14px; font-size:15.5px; line-height:1.7; color:#A9B4C4; }
#engagement .engage-card ul{
  margin-top:28px; padding-top:26px; border-top:1px solid rgba(255,255,255,0.10); gap:14px;
}
#engagement .engage-card li{ color:#D5DCE6; font-size:15px; line-height:1.5; gap:12px; }
#engagement .engage-card li svg{ stroke:var(--accent); width:17px; height:17px; margin-top:3px; }
.engage-cta{ display:flex; justify-content:center; margin-top:56px; }
.engage-cta .btn-primary{
  padding:19px 36px; font-size:13.5px; box-shadow:0 14px 40px rgba(51,225,237,0.30);
}
.engage-cta .btn-primary:hover{ transform:translateY(-2px); box-shadow:0 18px 46px rgba(51,225,237,0.42); }
@media (max-width:980px){
  #engagement .engage-grid{ grid-template-columns:1fr; }
  #engagement .engage-card, #engagement .engage-card.dark{ padding:32px 26px 30px; }
  .engage-cta{ margin-top:40px; }
  .engage-cta .btn-primary{ width:100%; justify-content:center; }
}


/* ---------- Small-screen safety ---------- */
.stack-cta-info, .stack-cta-top, .stack-cta-desc, .stack-cta-buttons{ min-width:0; }
@media (max-width:420px){
  .stack-cta-top{ flex-wrap:wrap; gap:12px; }
  .stack-cta-desc{ max-width:none; }
  .stack-cta{ padding:24px 18px; }
}

/* ---------- Service cards: keep text clear of the icon at every width ---------- */
@media (min-width:981px) and (max-width:1180px){
  .service-card, .service-card:nth-child(even){ aspect-ratio:3/4; }
  .service-card .card-body{ padding:22px 20px; }
  .service-card h3{ font-size:20px; }
  .service-card p{ font-size:13.5px; line-height:1.55; }
}
@media (min-width:601px) and (max-width:980px){
  .service-card, .service-card:nth-child(even){ min-height:340px; }
}
@media (max-width:600px){
  .service-card, .service-card:nth-child(even){ min-height:310px; }
}
.services-grid > .service-card{ min-width:0; width:100%; justify-self:stretch; }


/* ---------- Mega menus (Services / Industries): white panel, icon + thumbnail tiles ---------- */
.nav-dropdown-panel{
  position:absolute; top:100%; left:0; right:0; width:100%; transform:none; padding:0; z-index:60;
}
header.nav:has(.nav-dropdown:hover), header.nav:has(.nav-dropdown.open){
  background:rgba(5,7,12,0.97);
  border-bottom-color:rgba(255,255,255,0.08);
}
.nav-dropdown-panel::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:
    radial-gradient(620px 260px at 6% 0%, rgba(51,225,237,0.10), transparent 70%),
    radial-gradient(620px 280px at 100% 100%, rgba(255,79,216,0.07), transparent 70%),
    #FFFFFF;
  border-top:1px solid rgba(255,255,255,0.08);
  box-shadow:0 46px 90px rgba(11,14,21,0.28);
}
.nav-dropdown:hover .nav-dropdown-panel, .nav-dropdown.open .nav-dropdown-panel{ animation:megaIn .22s ease-out; }
@keyframes megaIn{ from{ opacity:0; transform:translateY(-6px); } to{ opacity:1; transform:none; } }

.mega{
  max-width:1200px; margin:0 auto; padding:40px 32px 44px;
  display:grid; grid-template-columns:minmax(240px,300px) minmax(0,1fr); gap:0 56px; position:relative;
}
.mega-intro{
  display:flex; flex-direction:column; align-items:flex-start;
  padding-right:48px; border-right:1px solid rgba(11,14,21,0.09);
}
.mega-kicker{
  font-size:11.5px; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; color:var(--accent-deep);
  display:inline-flex; align-items:center; gap:10px;
}
.mega-kicker::before{ content:""; width:22px; height:2px; border-radius:2px; background:var(--grad); }
.nav-links .mega-headline{
  margin:18px 0 0; font-size:25px; font-weight:400; line-height:1.22; letter-spacing:-0.022em; color:var(--ink);
}
.nav-links .mega-cta{
  margin-top:26px; display:inline-flex; align-items:center; gap:10px;
  padding:12px 22px; border-radius:100px; border:1px solid rgba(11,14,21,0.30);
  font-size:12px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink);
  transition:background .2s ease, color .2s ease, border-color .2s ease;
}
.nav-links .mega-cta span{ transition:transform .2s ease; }
.nav-links .mega-cta:hover{ background:var(--ink); border-color:var(--ink); color:#fff; }
.nav-links .mega-cta:hover span{ transform:translateX(4px); }

.mega-grid{ display:grid; gap:14px; align-content:start; }
.mega-grid-services{ grid-template-columns:repeat(4,minmax(0,1fr)); }
.mega-grid-industries{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }

.nav-links .mega-tile{
  display:flex; flex-direction:column; align-items:flex-start; gap:6px; padding:18px 18px 20px;
  border-radius:18px; border:1px solid rgba(11,14,21,0.07); background:#F6F7F9;
  color:var(--ink); transition:border-color .22s ease, background .22s ease, transform .22s ease, box-shadow .22s ease;
}
.nav-links .mega-tile:hover{
  border-color:rgba(15,160,173,0.55); background:#FFFFFF; transform:translateY(-3px); color:var(--ink);
  box-shadow:0 16px 34px rgba(11,14,21,0.10);
}
.mega-icon{
  width:40px; height:40px; border-radius:12px; display:grid; place-items:center; margin-bottom:8px;
  background:var(--accent-soft); color:var(--accent-deep); transition:background .22s ease, color .22s ease;
}
.mega-icon svg{ width:19px; height:19px; }
.nav-links .mega-tile:hover .mega-icon{ background:var(--accent); color:#05110F; }
.mega-tile-title{ font-size:15px; font-weight:600; letter-spacing:-0.01em; line-height:1.3; }
.mega-tile-desc{ font-size:12.5px; line-height:1.45; color:#667085; font-weight:400; }

.nav-links .mega-tile-row{ flex-direction:row; align-items:center; gap:14px; padding:12px 16px 12px 12px; }
.mega-thumb{ width:52px; height:52px; border-radius:12px; overflow:hidden; flex-shrink:0; }
.mega-thumb img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s ease; }
.nav-links .mega-tile-row:hover .mega-thumb img{ transform:scale(1.1); }
.mega-tile-row .mega-tile-title{ flex:1; font-size:15.5px; }
.mega-go{ color:var(--accent-deep); opacity:0.55; transition:transform .2s ease, opacity .2s ease; }
.nav-links .mega-tile-row:hover .mega-go{ transform:translateX(4px); opacity:1; }

@media (max-width:1180px){
  .mega{ grid-template-columns:minmax(220px,260px) minmax(0,1fr); gap:0 36px; }
  .mega-intro{ padding-right:30px; }
  .mega{ padding-top:32px; padding-bottom:36px; }
  .mega-grid{ gap:10px; }
  .nav-links .mega-tile{ padding:14px 14px 16px; border-radius:16px; }
  .mega-icon{ width:34px; height:34px; border-radius:10px; margin-bottom:4px; }
  .mega-icon svg{ width:17px; height:17px; }
  .mega-tile-title{ font-size:14px; }
  .mega-tile-desc{ font-size:12px; }
  .nav-links .mega-tile-row{ padding:10px 12px 10px 10px; gap:10px; }
  .mega-thumb{ width:42px; height:42px; border-radius:10px; }
  .mega-tile-row .mega-tile-title{ font-size:14px; }
  .nav-links .mega-headline{ font-size:22px; }
}
@media (prefers-reduced-motion:reduce){
  .nav-dropdown:hover .nav-dropdown-panel, .nav-dropdown.open .nav-dropdown-panel{ animation:none; }
  .nav-links .mega-tile, .mega-thumb img{ transition:none; }
}

/* ==========================================================================
   Sub-pages (services, industries, about, contact, case studies)
   ========================================================================== */
.case-hero{
  position:relative; overflow:hidden; background:var(--night);
  padding-top:calc(72px + 88px);
}
.case-hero::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(640px 420px at 90% 0%, rgba(255,79,216,0.16), transparent 70%),
    radial-gradient(520px 360px at 4% 100%, rgba(51,225,237,0.13), transparent 70%);
}
.case-hero > .wrap{ position:relative; z-index:1; }
.case-hero .hero-art{
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,0.12) 34%,#000 70%);
  mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,0.12) 34%,#000 70%);
  opacity:0.9;
}
.case-hero h1{
  font-weight:400; letter-spacing:-0.03em; line-height:1.06;
  font-size:clamp(34px,4.6vw,64px);
}
.case-lead{ color:#B4BDC9; }
.case-cta-band{
  background:
    radial-gradient(760px 360px at 100% 0%, rgba(255,79,216,0.22), transparent 62%),
    radial-gradient(640px 360px at 0% 100%, rgba(51,225,237,0.16), transparent 62%),
    var(--night);
}
.case-cta-band h2{ font-weight:400; letter-spacing:-0.028em; }
@media (max-width:980px){
  .case-hero{ padding-top:calc(72px + 56px); }
  .case-hero .hero-art{
    -webkit-mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,0.5) 50%,#000 100%);
    mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,0.5) 50%,#000 100%);
    opacity:0.6;
  }
}
.case-back-link + .eyebrow{ display:flex; width:fit-content; }

/* very small phones: tech-stack tiles on service pages */
@media (max-width:420px){
  .svc-stack-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .svc-stack-tile{ padding:14px 12px; gap:10px; min-width:0; }
  .svc-stack-tile .icon{ width:24px; height:24px; }
  .svc-stack-tile span:not(.icon){ font-size:13px; overflow-wrap:anywhere; min-width:0; }
}