/* Netsense home components. Maintained module styles: no legacy step-based CSS. */
/* Services: text-only composition, a separately designated featured card, four compact cards. */
#services .services-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.04fr) minmax(0, 1fr);
  gap: 0;
  border-top: 0;
  border-bottom: 0;
  align-items: stretch;
}
#services .services-layout.no-featured {grid-template-columns: minmax(0, 1fr);}
#services .service-featured,
#services .service-card {
  min-width: 0;
  margin: 0;
  background: transparent;
  background-image: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
#services .service-featured {
  padding: 28px 30px 27px 0;
  border-right: 1px solid var(--line);
  min-height: 372px;
}
#services .service-featured > .accordion-trigger,
#services .service-card > .accordion-trigger {
  max-width: none;
  display: flex;
  width: 100%;
  min-width: 0;
  align-items: center;
  gap: 14px;
  cursor: default;
}
#services .card-title {min-width: 0; overflow-wrap: anywhere; font-weight: 600; line-height: 1.25;}
#services .service-featured .card-title {font-size: clamp(21px, 2vw, 26px);}
#services .service-card .card-title {font-size: 17px;}
#services .service-icon {flex: 0 0 42px; display: grid; width: 42px; height: 42px; place-items: center; color: var(--green);}
#services .service-icon svg {display: block; width: 30px; height: 30px;}
#services .service-icon--text {font-size: 23px; font-weight: 600;}
#services .service-featured-body {display: block;}
#services .service-featured .service-copy {max-width: 570px; margin: 20px 0 0 0; padding: 0;}
#services .service-featured .service-copy > p {max-width: 530px; margin: 0; font-size: 16px; line-height: 1.55; color: #b5bdbe;}
#services .service-featured .check-list {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; margin: 23px 0;}
#services .service-featured .check-list li {margin: 0; min-width: 0; font-size: 14px; line-height: 1.45; overflow-wrap: anywhere;}
#services .service-featured .text-link {margin: 0;}
#services .service-small-grid {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; align-content: stretch;}
#services .service-small-grid .service-card {min-height: 186px; padding: 22px 16px 19px 20px;}
#services .service-small-grid > .service-card:nth-child(odd) {border-right: 1px solid var(--line);}
#services .service-small-grid > .service-card:nth-child(n+3) {border-top: 1px solid var(--line);}
#services .service-small-grid .service-card .accordion-panel {display: block; margin: 13px 0 0 0;}
#services .service-small-grid .service-card .accordion-panel p {margin: 0 0 11px; max-width: 300px; font-size: 13px; line-height: 1.5; color: #b5bdbe; overflow-wrap: anywhere;}
#services .service-small-grid .service-card .text-link {margin: 0; font-size: 13px;}
#services .service-featured .text-link svg,
#services .service-card .text-link svg {width: 18px; height: 18px;}
#services .services-all {margin-top: 20px;}
#services .accordion-trigger:focus-visible,
#services .text-link:focus-visible {outline: 2px solid var(--green); outline-offset: 4px;}

/* Additional services: flexible, independently sized columns without empty tracks. */
.additional .additional-grid {display: flex; flex-wrap: wrap; gap: 0; grid-template-columns: none;}
.additional .additional-grid > article {flex: 1 1 185px; min-width: min(100%, 180px); max-width: none; border: 0; border-right: 1px solid var(--line); padding-inline: 24px;}
.additional .additional-grid > article:last-child {border-right: 0;}
.additional .additional-grid > article:nth-child(odd),
.additional .additional-grid > article:nth-child(n+3) {border-top: 0;}
/* Keep the whole card a link; no isolated arrow at the bottom. */
.additional-grid article {min-width: 0;}
.additional-grid .home-additional-link {display: flex; flex-direction: column; min-width: 0; height: 100%; color: inherit; text-decoration: none;}
.additional-grid .home-additional-link:focus-visible {outline: 2px solid var(--green); outline-offset: 4px;}
.additional-grid .home-additional-link h3 {overflow-wrap: anywhere;}
.additional-grid .home-additional-link p {flex: 1 1 auto; overflow-wrap: anywhere;}
.additional-grid .service-icon {display: grid; place-items: center; width: 40px; height: 40px; color: var(--green);}
.additional-grid .service-icon svg {display: block; width: 35px; height: 35px;}
.additional-grid .service-icon--text {font-size: 22px; font-weight: 600;}
/* No detached bottom arrows. */

/* Project cards reuse accepted layout while canonical DETAIL_PICTURE provides real srcset. */
.projects .responsive-project-image,
.projects .responsive-other-image {display: block; min-width: 0; max-width: 100%;}
.projects .responsive-project-image img,
.projects .responsive-other-image img {display: block; max-width: 100%;}
.projects .project-cover-placeholder,
.projects .other-project-mark {display: grid; place-items: center; min-height: 100px; border: 1px solid var(--line); color: var(--green); letter-spacing: .02em;}
.projects .project-cover-placeholder {min-height: 185px; font-size: 40px;}
.projects .other-project-mark {font-size: 22px;}
.projects .project-arrow {display: block;}
.projects .project-arrow svg {display: block; width: 100%; height: 100%;}
.projects .project-card:focus-visible,
.projects .other-card:focus-visible {outline: 2px solid var(--green); outline-offset: 3px;}

@media (min-width: 768px) and (max-width: 1180px) {
  #services .services-layout {grid-template-columns: minmax(0, 1fr);}
  #services .service-featured {min-height: 0; padding: 24px 0; border-right: 0; border-bottom: 1px solid var(--line);}
  #services .service-small-grid .service-card {min-height: 164px; padding-left: 0;}
  #services .service-small-grid > .service-card:nth-child(odd) {padding-right: 20px;}
  #services .service-small-grid > .service-card:nth-child(even) {padding-left: 20px;}
}
@media (max-width: 767px) {
  #services .services-layout {display: block;}
  #services .service-featured, #services .service-small-grid .service-card {min-height: 0; padding: 14px 0; border: 0; border-bottom: 1px solid var(--line);}
  #services .service-featured {border-right: 0;}
  #services .service-small-grid {display: block;}
  #services .service-small-grid .service-card:nth-child(n) {border-right: 0; border-top: 0;}
  #services .service-small-grid .service-card:last-child {border-bottom: 0;}
  #services .service-featured > .accordion-trigger, #services .service-card > .accordion-trigger {gap: 10px; cursor: pointer; min-height: 38px;}
  #services .card-title, #services .service-featured .card-title, #services .service-card .card-title {font-size: 16px; line-height: 1.3;}
  #services .service-icon {display: none !important;}
  #services .accordion-mobile .accordion-panel,
  #services .service-small-grid .service-card .accordion-panel,
  #services .service-featured .service-featured-body {display: none;}
  #services .accordion-mobile .accordion-item.is-open > .accordion-panel,
  #services .service-small-grid .service-card.is-open > .accordion-panel,
  #services .service-featured.is-open > .service-featured-body {display: block;}
  #services .service-featured .service-copy {margin: 0; max-width: none;}
  #services .service-featured .service-copy > p,
  #services .service-small-grid .service-card .accordion-panel p {margin: 8px 0; font-size: 13px; line-height: 1.5;}
  #services .service-featured .check-list {display: none;}
  #services .service-small-grid .service-card .accordion-panel {margin: 0;}
  #services .service-featured .text-link,
  #services .service-small-grid .service-card .text-link {margin: 8px 0 2px;}
  #services .services-all {margin-top: 12px;}
  .additional-grid .home-additional-link {min-height: 100%;}
  .additional-grid .service-icon {width: 26px; height: 26px;}
  .additional-grid .service-icon svg {width: 26px; height: 26px;}
  .additional-grid .service-icon--text {font-size: 18px;}
  /* Arrows intentionally absent. */
}

/* Visual refinement: the new image spans the hero stage, text remains on the left. */
.hero {padding: 0 !important;}
.hero-stage {position: relative; isolation: isolate; overflow: hidden; background: #071014;}
/* Black-teal contrast for the copy; right-hand hero image remains untouched. */
.hero-stage::before {content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(90deg, rgba(5, 12, 15, .96) 0%, rgba(5, 12, 15, .88) 23%, rgba(5, 12, 15, .62) 40%, rgba(5, 12, 15, .28) 55%, rgba(5, 12, 15, 0) 76%);}
.hero-stage .hero-art {position: absolute; z-index: -1; inset: 0; display: block; width: 100%; height: 100%; margin: 0; transform: none; pointer-events: none;}
.hero-stage .hero-art img {display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 54%;}
.hero-stage .hero-grid {position: relative; z-index: 1; display: flex; align-items: center; min-height: 630px; height: auto; padding-block: 68px 55px;}
.hero-stage .hero-copy {position: relative; z-index: 1; width: min(580px, 49%); padding: 0; max-width: none;}
.hero-stage .hero-copy > p {max-width: 535px;}
.hero-stage .hero-copy h1, .hero-stage .hero-copy > p {text-shadow: 0 1px 5px rgba(0,0,0,.65);}
.external-systems .ns-brand-icon {width: 32px; height: 24px; object-fit: contain; display: inline-block; flex: 0 0 32px;}
.adv-grid .big-icon--brand {border: 0; clip-path: none; display: grid; place-items: center; width: 146px; height: 48px; max-width: 100%; background: transparent;}
.adv-grid .big-icon--brand img {display:block; width: 140px; max-width: 100%; height: 37px; object-fit: contain;}
/* The wide card's content shares the heading's start, without the old extra indent. */
#services .service-featured .service-featured-body {display: block; margin-top: 0;}
#services .service-featured .service-copy {margin: 20px 0 0 56px; padding: 0; width: auto; max-width: min(570px, calc(100% - 56px));}
#services .service-featured .service-copy > p,
#services .service-featured .service-copy > .check-list,
#services .service-featured .service-copy > .text-link {margin-left: 0;}
#services .service-small-grid .service-card .accordion-panel {margin-left: 56px;}
#services .service-small-grid .service-card .accordion-panel p,
#services .service-small-grid .service-card .accordion-panel .text-link {margin-left: 0;}
#services .service-icon--brand img {display: block; width: 34px; height: 34px; object-fit: contain;}
#services .service-icon--brand {width: 42px; height: 42px;}
#services .services-layout {border-top: 0; border-bottom: 0;}
#services.services {border-bottom: 0;}
/* Keep the section boundary outside card layout; no extra horizontal rules above/below cards. */
.additional .additional-grid > article:nth-child(odd) {border-right: 1px solid var(--line);}
.additional .additional-grid > article:last-child {border-right: 0;}
.additional .additional-grid .home-additional-link {padding-block: 0;}
.additional .additional-grid h3 {margin-block: 15px 12px;}
.additional .additional-grid p {margin: 0; flex: none;}
.additional .additional-grid .service-icon {display: grid; place-items: center;}
@media (max-width: 1180px) and (min-width: 768px) {
  .hero-stage .hero-grid {min-height: 590px; padding-block: 56px;}
  .hero-stage .hero-copy {width: min(540px, 59%);}
  .hero-stage .hero-art img {object-position: 60% center;}
  .additional .additional-grid > article {flex-basis: 220px;}
  #services .service-featured .service-copy {margin-left: 56px;}
}
@media (max-width: 767px) {
  .hero-stage .hero-grid {display: block; min-height: 0; padding-block: 32px 30px;}
  .hero-stage .hero-copy {display: block; width: 100%; max-width: none; padding: 0;}
  .hero-stage .hero-copy:after {display: none;}
  .hero-stage .hero-copy h1 {font-size: clamp(31px,8vw,40px); line-height: 1.04; max-width: 365px;}
  .hero-stage .hero-copy > p {font-size: 14px; max-width: 100%; line-height: 1.54;}
  .hero-stage .hero-art {display: block; opacity: .18;}
  .hero-stage .hero-art img {object-position: 73% center;}
  .hero-stage::before {background: linear-gradient(90deg, rgba(5, 12, 15, .55), rgba(5, 12, 15, .27) 75%, rgba(5, 12, 15, .1));}
  .hero-stage .hero-actions {display: flex; flex-wrap: wrap;}
  #services .service-featured .service-copy, #services .service-small-grid .service-card .accordion-panel {margin: 0; width: 100%; max-width: none;}
  .additional .additional-grid {display: flex; flex-wrap: wrap; gap: 8px;}
  .additional .additional-grid > article,
  .additional .additional-grid > article:nth-child(odd),
  .additional .additional-grid > article:nth-child(n+3) {flex: 1 1 calc(50% - 4px); min-width: min(100%, 140px); max-width: none; border: 1px solid var(--line); border-radius: 0; padding: 12px 13px;}
}
/* Neutralize old high-specificity mobile rules in home.css. */
@media (min-width: 768px) {
  .additional .additional-grid > article:nth-child(n) {border: 0 !important; border-right: 1px solid var(--line) !important; border-top: 0 !important;}
  .additional .additional-grid > article:last-child {border-right: 0 !important;}
}
@media (max-width: 767px) {
  .additional .additional-grid > article:nth-child(n) {border: 1px solid var(--line) !important;}
}
