/* NivAk Technologies — Premium V3 Services Layout */

.services-page {
  margin: 0;
  font-family: var(--v3-font-body);
  background: #fff;
}

.services-page main {
  width: 100%;
}

.services-page main .container {
  width: min(1160px, calc(100% - 48px));
  margin-inline: auto;
}

.services-page .page-hero.services-hero {
  padding: 82px 0 88px;
  background:
    radial-gradient(circle at 82% 24%,rgba(30,91,170,.36),transparent 45%),
    linear-gradient(125deg,#071326,#102d59);
  color: #fff;
}

.services-page .services-hero .page-hero__content {
  max-width: 880px;
}

.services-page .services-hero h1 {
  max-width: 850px;
  margin: 20px 0;
  color: #fff;
  font-family: var(--v3-font-heading);
  font-size: clamp(36px,4.2vw,58px);
  line-height: 1.14;
  letter-spacing: -.045em;
}

.services-page .services-hero p {
  max-width: 700px;
  color: #c3d2e7;
  line-height: 1.8;
}

.services-page .services-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 26px;
}

.services-page .services-hero__actions .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 12px 22px;
  border-radius: 999px;
  font-weight: 700;
  text-decoration: none;
}

.services-page .services-hero__actions .button--primary {
  background: #ff7417;
  color: #fff;
}

.services-page .services-hero__actions .button--secondary,
.services-page .services-hero__actions .button--outline {
  background: #fff;
  color: #071326;
}

.services-page .services-category {
  padding: 62px 0;
  background: #fff;
}

.services-page .services-category:nth-of-type(odd) {
  background: #f4f7fc;
}

.services-page .section-heading {
  max-width: 820px;
  margin-bottom: 28px;
}

.services-page .section-title {
  color: #071b3d;
  font-family: var(--v3-font-heading);
  font-size: clamp(28px,3.1vw,42px);
  line-height: 1.2;
  letter-spacing: -.035em;
}

.services-page .services-catalog-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 20px;
}

.services-page .service-detail-card {
  display: flex;
  min-width: 0;
  background: #fff;
  border: 1px solid #dfe7f2;
  border-radius: 18px;
  box-shadow: 0 12px 34px rgba(7,19,38,.06);
}

.services-page .service-detail-card .card__body {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 26px;
  width: 100%;
}

.services-page .service-detail-card .card__title {
  color: #071b3d;
  font-size: 18px;
  font-weight: 800;
}

.services-page .service-detail-card .card__text {
  flex: 1;
  color: #586b83;
  line-height: 1.75;
}

.services-page .service-detail-card a {
  color: #e96510;
  font-weight: 700;
}

.services-page .section--brand-dark {
  padding: 65px 0;
  background: #071326;
  color: #fff;
}

.services-page .services-benefits {
  padding: 65px 0;
  background: #f4f7fc;
}

.services-page .services-cta-section {
  padding: 55px 0;
}

.services-page .services-cta-section .cta-panel {
  padding: 44px;
  border-radius: 22px;
  background: linear-gradient(125deg,#1769d2,#071326);
  color: #fff;
}

.services-page .nav a[href="/services/"] {
  color: #ff7417;
}

.services-page .nav a[href="/"] {
  color: #fff;
}

@media (max-width: 900px) {
  .services-page .services-catalog-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
}

@media (max-width: 600px) {
  .services-page main .container {
    width: min(100% - 32px,1160px);
  }

  .services-page .page-hero.services-hero {
    padding: 58px 0;
  }

  .services-page .services-category,
  .services-page .section--brand-dark,
  .services-page .services-benefits {
    padding: 44px 0;
  }

  .services-page .services-catalog-grid {
    grid-template-columns: 1fr;
  }

  .services-page .services-cta-section .cta-panel {
    padding: 28px;
  }
}

/* NIVAK SERVICES COMPACT STEP 39 */

.services-page .page-hero.services-hero {
    min-height: 0;
    padding: 48px 0 52px;
}

.services-page .services-hero h1 {
    max-width: 760px;
    margin: 12px 0 14px;
    font-size: clamp(34px, 3.8vw, 52px);
    line-height: 1.12;
}

.services-page .services-hero__actions {
    margin-top: 20px;
}

.services-page .services-category {
    padding-top: 42px;
    padding-bottom: 42px;
}

.services-page .section-heading {
    margin-bottom: 20px;
}

.services-page .section-title {
    margin-top: 10px;
    margin-bottom: 12px;
}

.services-page .services-catalog-grid {
    gap: 14px;
    margin-top: 20px;
}

.services-page .service-detail-card .card__body {
    padding: 22px;
    gap: 9px;
}

.services-page .section--brand-dark,
.services-page .services-benefits {
    padding-top: 48px;
    padding-bottom: 48px;
}

.services-page .services-cta-section {
    padding: 42px 0;
}

@media (max-width: 600px) {
    .services-page .page-hero.services-hero {
        padding: 38px 0 42px;
    }

    .services-page .services-category,
    .services-page .section--brand-dark,
    .services-page .services-benefits {
        padding-top: 34px;
        padding-bottom: 34px;
    }

    .services-page .service-detail-card .card__body {
        padding: 18px;
    }
}


/* NIVAK SERVICES STEP 40 */

/* Why NivAk: compact three-column cards */

.services-page .services-benefits .grid--3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.services-page .services-benefits .card {
  display: block;
  min-width: 0;
  min-height: 0;
  padding: 0;
  background: #ffffff;
  border: 1px solid #dfe7f2;
  border-radius: 18px;
  box-shadow: 0 12px 30px rgba(7,19,38,.06);
}

.services-page .services-benefits .card__body {
  display: block;
  padding: 26px;
}

.services-page .services-benefits .card__title {
  display: block;
  margin: 0 0 12px;
  color: #071b3d;
  font-family: var(--v3-font-heading);
  font-size: 18px;
  font-weight: 800;
}

.services-page .services-benefits .card__text {
  display: block;
  margin: 0;
  color: #586b83;
  font-size: 14px;
  line-height: 1.75;
}

.services-page .services-benefits .section-heading p {
  color: #586b83;
}

/* Contact panel buttons */

.services-page .services-cta-section .cta-panel__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 22px;
}

.services-page .services-cta-section .cta-panel__actions a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 46px;
  padding: 12px 22px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
}

.services-page .services-cta-section .cta-panel__actions a:first-child {
  background: #ff7417;
  color: #ffffff;
}

.services-page .services-cta-section .cta-panel__actions a:not(:first-child) {
  background: #ffffff;
  color: #071326;
}

@media (max-width: 900px) {
  .services-page .services-benefits .grid--3 {
    grid-template-columns: 1fr;
    gap: 14px;
  }
}

@media (max-width: 600px) {
  .services-page .services-benefits .card__body {
    padding: 20px;
  }

  .services-page .services-cta-section .cta-panel__actions {
    flex-direction: column;
    align-items: stretch;
  }
}


/* NIVAK SERVICES PROCESS STEP 42 */

.services-page .section--brand-dark .section-heading {
  max-width: 760px;
}

.services-page .section--brand-dark .section-heading p {
  color: #b8c9df;
  line-height: 1.7;
}

.services-page .services-process-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin-top: 24px;
}

.services-page .services-process-grid > * {
  min-width: 0;
  padding: 24px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 18px;
  background: rgba(255,255,255,.06);
}

.services-page .services-process-grid h3 {
  margin: 0 0 12px;
  color: #ffffff;
  font-family: var(--v3-font-heading);
  font-size: 18px;
  font-weight: 800;
}

.services-page .services-process-grid p {
  margin: 0;
  color: #b8c9df;
  font-size: 14px;
  line-height: 1.7;
}

@media (max-width: 900px) {
  .services-page .services-process-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 600px) {
  .services-page .services-process-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .services-page .services-process-grid > * {
    padding: 20px;
  }
}


/* NIVAK SERVICES COMPACT CARDS STEP 43 */

.services-page .services-catalog-grid {
  align-items: stretch;
  gap: 14px;
}

.services-page .services-catalog-grid .service-detail-card {
  height: auto !important;
  min-height: 0 !important;
  margin: 0;
  padding: 0;
  align-self: stretch;
}

.services-page .services-catalog-grid .service-detail-card .card__body {
  display: flex;
  flex-direction: column;
  justify-content: flex-start !important;
  align-items: flex-start;
  gap: 8px !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 20px 22px !important;
}

.services-page .services-catalog-grid .service-detail-card .card__title {
  margin: 0 !important;
  line-height: 1.35;
}

.services-page .services-catalog-grid .service-detail-card .card__text {
  flex: 0 0 auto !important;
  margin: 0 !important;
  line-height: 1.6;
}

.services-page .services-catalog-grid .service-detail-card a {
  margin-top: 4px !important;
  padding: 0;
  line-height: 1.5;
}

@media (max-width: 600px) {
  .services-page .services-catalog-grid .service-detail-card .card__body {
    padding: 18px !important;
  }
}


/* NIVAK SERVICES HEADING READABILITY STEP 44 */

/* Consistent category labels */

.services-page main .eyebrow,
.services-page main .section-kicker,
.services-page main .section-label {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding: 8px 14px;
  border: 1px solid rgba(255,116,23,.38);
  border-radius: 999px;
  background: #fff3eb;
  color: #a43f00;
  font-family: var(--v3-font-body);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.45;
  letter-spacing: .035em;
  text-transform: none;
}

/* Light section titles and descriptions */

.services-page .services-category .section-title,
.services-page .services-benefits .section-title {
  margin: 14px 0 12px;
  color: #071b3d;
  font-size: clamp(28px,3vw,40px);
  font-weight: 800;
  line-height: 1.2;
}

.services-page .services-category .section-heading p,
.services-page .services-benefits .section-heading p {
  color: #485d78;
  font-size: 15px;
  line-height: 1.7;
}

/* Dark section labels and headings */

.services-page .services-hero .eyebrow,
.services-page .section--brand-dark .eyebrow,
.services-page .services-cta-section .eyebrow {
  color: #ffb17c;
  background: rgba(255,116,23,.12);
  border-color: rgba(255,116,23,.45);
}

.services-page .section--brand-dark .section-title,
.services-page .section--brand-dark h2 {
  color: #ffffff;
}

.services-page .section--brand-dark .section-heading p {
  color: #c8d8eb;
}

/* Improve CTA readability */

.services-page .services-cta-section .cta-panel h2 {
  color: #ffffff;
  font-weight: 800;
}

.services-page .services-cta-section .cta-panel p {
  color: #e2ebf8;
}

/* More consistent section heading rhythm */

.services-page .section-heading {
  margin-bottom: 24px;
}

@media (max-width: 600px) {
  .services-page main .eyebrow,
  .services-page main .section-kicker,
  .services-page main .section-label {
    font-size: 11px;
    padding: 7px 12px;
  }

  .services-page .services-category .section-title,
  .services-page .services-benefits .section-title {
    font-size: clamp(25px,7vw,34px);
  }
}


/* NIVAK UNIVERSAL LABELS STEP 48 */

/* High contrast section labels on light backgrounds */

.services-page .services-category .eyebrow,
.services-page .services-benefits .eyebrow,
.services-page .services-category .section-kicker,
.services-page .services-benefits .section-kicker {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid #e6b58f;
  background: #fff4ec;
  color: #102d59 !important;
  font-family: "Inter", sans-serif;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.4;
  letter-spacing: .025em;
  opacity: 1;
}

/* High contrast labels on navy backgrounds */

.services-page .services-hero .eyebrow,
.services-page .section--brand-dark .eyebrow,
.services-page .services-cta-section .eyebrow,
.services-page .section--brand-dark .section-kicker {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid #b45b27;
  background: #172d49;
  color: #ffffff !important;
  font-family: "Inter", sans-serif;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.4;
  letter-spacing: .025em;
  opacity: 1;
}

@media (max-width: 600px) {
  .services-page main .eyebrow,
  .services-page main .section-kicker {
    font-size: 12px;
    padding: 7px 12px;
  }
}


/* NIVAK REVERSE CTA GRADIENT STEP 50 */

.services-page .services-cta-section .cta-panel {
    background: linear-gradient(
        90deg,
        #071326 0%,
        #102d59 55%,
        #1769d2 100%
    ) !important;
}
