

:root{
  --glass-bg:      linear-gradient(152deg, rgba(255,255,255,.70), rgba(255,255,255,.38));
  --glass-bg-soft: linear-gradient(152deg, rgba(255,255,255,.58), rgba(255,255,255,.30));
  --glass-border:  rgba(255,255,255,.72);
  --glass-blur:    blur(16px) saturate(155%);
  --glass-shadow:
    inset 0 1px 0 rgba(255,255,255,.90),
    inset 0 -1px 0 rgba(255,255,255,.30),
    0 10px 30px rgba(27,26,22,.07),
    0 2px 8px rgba(27,26,22,.04);
  --glass-shadow-hi:
    inset 0 1px 0 rgba(255,255,255,.95),
    inset 0 -1px 0 rgba(255,255,255,.35),
    0 18px 46px rgba(27,26,22,.11),
    0 4px 12px rgba(27,26,22,.06);
}




.ui-card, .mod, .plan, .why-card, .ag-card, .eng-card,
.svc-card, .saas-card, .cat-card, .plan-card,
.contact-form, .tc-modal-box, .demos-fan-card,
.hdr, .status-banner, .disclaimer, .ag-offer, .ag-shift-col,
.jump-chip, .trust-layer, .lang-toggle, .mobile-lang-toggle,
.mobile-jobs-link, .btn-ghost, .cur-btn, .lvl-btn{
  background:var(--glass-bg);
  border:1px solid var(--glass-border);
  box-shadow:var(--glass-shadow);
}


.trust-layer, .demos-fan-card, .tc-modal-box{
  backdrop-filter:var(--glass-blur);
  -webkit-backdrop-filter:var(--glass-blur);
}


.ui-card, .mod, .plan, .why-card, .ag-card, .eng-card,
.svc-card, .saas-card, .cat-card, .plan-card, .ag-offer{
  position:relative; overflow:hidden;
}
.ui-card::after, .mod::after, .plan::after, .why-card::after,
.ag-card::after, .eng-card::after, .svc-card::after,
.saas-card::after, .cat-card::after, .plan-card::after, .ag-offer::after{
  content:''; position:absolute; inset:0; pointer-events:none; z-index:0;
  background:linear-gradient(148deg, rgba(255,255,255,.42) 0%, rgba(255,255,255,0) 42%);
}

.ui-card > *, .mod > *, .plan > *, .why-card > *, .ag-card > *,
.eng-card > *, .cat-card > *, .plan-card > *, .ag-offer > *{ position:relative; z-index:1; }


a.ui-card:hover, a.mod:hover, .why-card:hover, .ag-card:hover,
.eng-card:hover, .svc-card:hover, .saas-card:hover, .plan:hover{
  box-shadow:var(--glass-shadow-hi);
  border-color:rgba(255,255,255,.88);
}


.plan-featured, .eng-featured, .ag-offer, .cat-card.open{
  background:linear-gradient(152deg, rgba(255,255,255,.74), rgba(253,240,222,.46));
  border-color:rgba(240,130,15,.42);
}


.jump-chip, .trust-layer, .lang-toggle, .mobile-lang-toggle,
.cur-btn, .lvl-btn, .mobile-jobs-link{
  background:var(--glass-bg-soft);
}


nav#mainNav{
  background:linear-gradient(152deg, rgba(255,255,255,.66), rgba(251,248,240,.44));
  backdrop-filter:blur(22px) saturate(170%);
  -webkit-backdrop-filter:blur(22px) saturate(170%);
  border:1px solid rgba(255,255,255,.72);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.92),
    0 8px 30px rgba(27,26,22,.09);
}
nav#mainNav.scrolled{
  background:linear-gradient(152deg, rgba(255,255,255,.80), rgba(251,248,240,.62));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.95),
    0 12px 38px rgba(27,26,22,.13);
}


.mega{
  background:linear-gradient(152deg, rgba(255,255,255,.80), rgba(251,248,240,.58));
  backdrop-filter:blur(26px) saturate(170%);
  -webkit-backdrop-filter:blur(26px) saturate(170%);
  border:1px solid rgba(255,255,255,.76);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.92),
    0 26px 70px rgba(27,26,22,.16);
}


.mobile-nav{
  background:linear-gradient(160deg, rgba(246,242,232,.90), rgba(251,248,240,.82));
  backdrop-filter:blur(28px) saturate(160%);
  -webkit-backdrop-filter:blur(28px) saturate(160%);
}


.section-alt, .site-footer{
  background:linear-gradient(180deg, rgba(255,255,255,.42), rgba(255,255,255,.16));
}


.wa-float{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.42),
    0 10px 30px rgba(240,130,15,.42),
    0 2px 8px rgba(27,26,22,.14);
}


.cta-band .btn-ghost{
  background:linear-gradient(152deg, rgba(255,255,255,.16), rgba(255,255,255,.06));
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  border-color:rgba(255,255,255,.36);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28);
}
.trust-hero-ctas .btn-ghost{
  background:linear-gradient(152deg, rgba(255,255,255,.18), rgba(255,255,255,.07));
  border-color:rgba(255,255,255,.40);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.30);
}

.trust-hero .trust-layer{
  background:linear-gradient(152deg, rgba(255,255,255,.14), rgba(255,255,255,.05));
  border-color:rgba(255,255,255,.20);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22);
}


.dfc-chrome{ background:#1a1a1a; backdrop-filter:none; -webkit-backdrop-filter:none; }
.demos-fan-card{ overflow:hidden; }


@media (max-width:760px){
  :root{ --glass-blur:blur(10px) saturate(140%); }
  .section-alt, .site-footer{ backdrop-filter:none; -webkit-backdrop-filter:none; }
  .ui-card, .mod, .plan, .why-card, .ag-card, .eng-card,
  .svc-card, .saas-card, .cat-card, .plan-card{
    backdrop-filter:none; -webkit-backdrop-filter:none;
    background:linear-gradient(152deg, rgba(255,255,255,.82), rgba(255,255,255,.62));
  }
}


@supports not (backdrop-filter: blur(1px)){
  .ui-card, .mod, .plan, .why-card, .ag-card, .eng-card,
  .svc-card, .saas-card, .cat-card, .plan-card, .contact-form,
  nav#mainNav, .mega, .mobile-nav{
    background:var(--paper);
  }
}


.mega::before{
  content:''; position:absolute; left:0; right:0;
  top:-26px; height:26px;      
  pointer-events:auto;
}
.mega{ pointer-events:none; }
.mega.open{ pointer-events:auto; }


.mega-link, .mega-mod{ display:block; }
.mega-link{ padding:9px 10px; border-radius:8px; }
.mega-link:hover{ background:var(--orange-tint); color:var(--orange-deep); }


.hdr-list{
  max-width:920px; margin:34px auto 0;
  border-top:1px solid var(--line);
}
.hdr{
  display:grid; grid-template-columns:230px 1fr; gap:24px;
  align-items:center; padding:16px 4px;
  border-bottom:1px solid var(--line);
}
.hdr code{ justify-self:start; }
.hdr-desc{ min-width:0; text-align:left; }

@media (max-width:700px){
  .hdr{ grid-template-columns:1fr; gap:8px; padding:15px 2px; }
  .hdr code{ font-size:.74rem; }
}


@media (max-width:900px){
  .mobile-nav{ justify-content:flex-start; }
  .mobile-link{
    font-size:clamp(1.35rem, 5.6vh, 2rem);
    padding:clamp(8px, 1.5vh, 14px) 0;
  }
  .mobile-nav-footer{ margin-top:clamp(14px, 3vh, 30px); }
}

@media (max-width:900px) and (max-height:780px){
  .mobile-nav{ padding-top:calc(92px + env(safe-area-inset-top)); }
  .mobile-link{ font-size:clamp(1.2rem, 4.9vh, 1.7rem); padding:clamp(6px,1.2vh,11px) 0; }
  .mobile-nav-cta{ padding:13px 20px; }
  .mobile-jobs-link{ padding:11px 16px; }
}
