:root{
  --ngp-primary:#015857;
  --ngp-surface:#A5E1E1;
  --ngp-gray: rgba(217,217,217,0.32);
  --ngp-bg:#ffffff;
  --ngp-radius-lg: 40px;
  --ngp-radius-md: 22px;
}

.ngp-font-title, .ngp-font-title *{ font-family: "Alata", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important; }
.ngp-font-body, .ngp-font-body *{ font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important; }

.ngp-h1{ font-size: clamp(36px, 5vw, 64px); line-height: 1.05; letter-spacing:-0.02em; margin:0 0 18px; }
.ngp-h2{ font-size: clamp(28px, 3.2vw, 44px); line-height: 1.1; margin:0 0 12px; }
.ngp-lead{ font-size: 18px; max-width: 44ch; }
.ngp-subtitle{ font-size: 18px; color: rgba(0,0,0,.78); max-width: 62ch; margin:0 auto; }

.ngp-btn .elementor-button{ border-radius: 999px !important; padding: 14px 26px !important; font-weight: 700 !important; }
.ngp-btn--primary .elementor-button{ background: var(--ngp-primary) !important; color:#fff !important; border:2px solid var(--ngp-primary) !important; }
.ngp-btn--outline .elementor-button{ background: transparent !important; color:#111 !important; border:2px solid var(--ngp-primary) !important; }
.ngp-btn--xl .elementor-button{ width:100% !important; min-height: 70px !important; font-size: 24px !important; }

.ngp-tools__grid{ display:grid; grid-template-columns: repeat(8, minmax(0,1fr)); gap:18px; margin-top: 24px; }
.ngp-tool__tile{ background: rgba(217,217,217,0.40); box-shadow: 0 8px 20px rgba(0,0,0,0.06); display:grid; place-items:center; border-radius:18px; width:86px; height:86px; margin:0 auto; }
.ngp-tool__name{ margin: 0; font-size: 14px; text-align:center; }

.ngp-cases__wrap{ background: rgba(165,225,225,0.35); border-radius: var(--ngp-radius-lg); padding: 42px 28px; }
.ngp-cases__grid{ display:grid; grid-template-columns: 1fr 1fr; gap:22px; }
.ngp-case-card{ background:#fff; border-radius: 22px; overflow:hidden; box-shadow:0 16px 40px rgba(0,0,0,0.08); }
.ngp-case-card__img img{ width:100%; aspect-ratio: 16/10; object-fit:cover; }
.ngp-case-tag{ color: rgba(1,88,87,0.9); font-size: 13px; font-weight: 600; }
.ngp-case-title{ margin:0; font-size: 22px; }
.ngp-case-desc{ margin:0; color: rgba(0,0,0,0.72); }

.ngp-about__box{ background: rgba(217,217,217,0.22); border-radius: 28px; padding: 30px; }
.ngp-skills__grid{ display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap:18px; text-align:center; margin-top: 18px; }
.ngp-skill__icon{ width:64px; height:64px; border-radius:999px; margin: 0 auto; background: var(--ngp-primary); }

.ngp-cta__card{ background: rgba(165,225,225,0.85); border-radius: 22px; padding: 28px; box-shadow: 0 12px 30px rgba(0,0,0,0.08); }

.ngp-footer{ background: rgba(165,225,225,0.95); }
.ngp-footer__inner{ display:flex; align-items:center; justify-content:space-between; gap:18px; }
.ngp-footer__name{ margin:0; font-size: 32px; }
.ngp-footer__desc{ margin: 6px 0 0; color: rgba(0,0,0,0.72); }
.ngp-footer__icon{ font-size: 42px; }

@media (max-width: 1100px){
  .ngp-tools__grid{ grid-template-columns: repeat(4, minmax(0,1fr)); }
  .ngp-skills__grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 900px){
  .ngp-cases__grid{ grid-template-columns: 1fr; }
}
@media (max-width: 560px){
  .ngp-tools__grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
