/* Original BIZZMINT palette; later layout and interactions retained. */
/* Original light page backgrounds with dimensional cards and accent colours. */
.hero-actions .button.primary {
  
  
  
  box-shadow:0 4px 0 #18374120, 0 12px 22px #18374120;
}
.photo-arch { box-shadow:0 18px 45px #18374120; }
.hero-signal {    box-shadow:0 7px 0 #18374120, 0 15px 25px #18374120; }
.vision-card {    box-shadow:0 9px 0 #18374120, 0 20px 35px #18374120; }
.connection-toggle {   box-shadow:0 3px 0 #18374120; }
.business-network {
  
  
  border-radius: 18px;
  box-shadow:0 9px 0 #18374120, 0 22px 35px #18374120;
  overflow: hidden;
}
.network-center {    box-shadow:0 0 0 1px #18374120, 0 7px 18px #18374120; }
.network-node {   box-shadow:0 5px 0 #18374120, 0 12px 20px #18374120; }
.network-caption {   left: 18px; right: 18px; bottom: 13px; }
.business-network:not(.is-connected) .network-base {  opacity: .5; }
.business-network:not(.is-connected) .network-node { box-shadow:0 3px 0 #18374120; }

/* Raised surfaces, edge highlights, and modest perspective make services stand out. */
.service-grid {  gap: 25px; perspective: 1400px; isolation: isolate; }
.service-card {
  position: relative;
  overflow: hidden;
  min-height: 335px;
  padding: 30px 28px 24px;
  
  
  
  border-radius: 14px;
  box-shadow:0 7px 0 #18374120, 0 17px 28px #18374120;
  transform-style: preserve-3d;
  --card-lift: 0px;
  --card-rotate-x: 0deg;
  --card-rotate-y: 0deg;
}
.service-card::before {
  content: '';
  position: absolute;
  inset: 0;
  
  pointer-events: none;
}
.service-card::after { content: ''; position: absolute; inset: 1px;  border-radius: 13px; pointer-events: none; }
.js-motion .service-card.reveal.is-visible, .service-card:not(.reveal) {
  transform: translateY(var(--card-lift)) rotateX(var(--card-rotate-x)) rotateY(var(--card-rotate-y));
  transition: transform .35s cubic-bezier(.2,.7,.3,1), opacity .9s, filter .9s, box-shadow .35s;
}
.service-card:hover { --card-lift: -8px;  box-shadow:0 12px 0 #18374120, 0 26px 34px #18374120; }
.service-top, .service-card h3, .service-card p, .service-bottom { position: relative; z-index: 1; }
.service-top { margin-bottom: 26px; }
.service-card h3 {  font-size: 28px; line-height: 1.08; }
.service-card p {  font-size: 17px; line-height: 1.5; }
.service-card .service-icon {    border-radius: 12px; width: 51px; height: 51px; box-shadow:inset 0 1px 0 #18374120, 0 5px 10px #18374120; }
.service-bottom {  padding-top: 18px; margin-top: 25px; }
.service-bottom > span { font-size: 15px; }
.service-bottom > svg { width: 30px; height: 30px; padding: 6px;   border-radius: 50%; }
.service-card:nth-child(3n+2) {   box-shadow:0 7px 0 #18374120, 0 17px 28px #18374120; }
.service-card:nth-child(3n+2):hover {  box-shadow:0 12px 0 #18374120, 0 26px 34px #18374120; }
.service-card:nth-child(3n) {    box-shadow:0 7px 0 #18374120, 0 17px 28px #18374120; }
.service-card:nth-child(3n):hover {  box-shadow:0 12px 0 #18374120, 0 26px 34px #18374120; }
.service-card:focus-visible {  outline-offset: 10px; }

/* Retain the component styling without changing the original page backgrounds. */
.impact-theatre {  border-radius: 15px; box-shadow:0 8px 0 #18374120, 0 23px 35px #18374120; }
.journey-step.is-current .step-no {   box-shadow:0 0 0 8px #18374120, 0 5px 15px #18374120; }
.stage-image {  border-radius: 10px; box-shadow:0 7px 0 #18374120; }
.article-card {   border-radius: 12px; padding: 14px 14px 22px; box-shadow:0 6px 0 #18374120, 0 15px 26px #18374120; transition: translate .3s, box-shadow .3s; }
.article-card:hover { translate: 0 -5px; box-shadow:0 10px 0 #18374120, 0 21px 30px #18374120; }
.article-art { border-radius: 5px; }
.faq-section { padding-top: 85px; }
.page-hero { margin-bottom: 35px; }
.scope-note { padding-left: 20px; padding-right: 20px; }
.detail-sidebar {  box-shadow:0 6px 0 #18374120; }
.form-wrap {   box-shadow:0 7px 0 #18374120, 0 20px 35px #18374120; }
.engagement-card {   box-shadow:0 6px 0 #18374120; }

@media (max-width: 1150px) {
  .service-grid { gap: 23px; }
  .service-card { padding: 26px 23px 22px; min-height: 340px; }
  .service-card h3 { font-size: 26px; }
  .service-card p { font-size: 16px; }
}
@media (max-width: 900px) {
  .service-card { min-height: 310px; }
  .business-network { max-width: 640px; }
  .network-caption { bottom: 16px; }
}
@media (max-width: 700px) {
  .hero { padding-bottom: 46px; }
  .hero .hero-actions .button { font-size: 15px; }
  .hero .hero-actions { gap: 22px; }
  .hero .hero-actions .text-link { font-size: 14px; }
  .connected-section { padding-top: 60px; padding-bottom: 65px; }
  .business-network { border-radius: 14px; }
  .network-caption { bottom: 14px; left: 11px; right: 11px; padding-top: 12px; }
  .service-grid { grid-template-columns: 1fr; gap: 27px; }
  .service-card { min-height: 285px; padding: 26px 25px 23px; border-radius: 13px; }
  .service-card h3 { font-size: 29px; }
  .service-card p { font-size: 18px; max-width: 460px; }
  .service-top { margin-bottom: 22px; }
  .service-card .service-icon { height: 49px; width: 49px; }
  .service-card .small-number { font-size: 10px; }
  .service-bottom { margin-top: 23px; }
  .service-bottom > span { font-size: 16px; }
  .service-bottom > svg { width: 31px; height: 31px; }
  .why-grid h2 { font-size: 44px; }
  .faq-section { padding-top: 65px; }
  .page-hero { margin-bottom: 28px; }
  .article-card { padding: 13px 13px 24px; }
  .scope-note { padding-left: 16px; padding-right: 16px; }
}
@media (max-width: 390px) {
  .hero .hero-actions { gap: 17px; }
  .hero .hero-actions .button { font-size: 13px; gap: 13px; }
  .hero .hero-actions .text-link { font-size: 12px; }
  .service-card { padding: 24px 21px 21px; }
  .service-card h3 { font-size: 28px; }
  .service-card p { font-size: 17px; }
}
@media (prefers-reduced-motion: reduce) {
  .js-motion .service-card.reveal.is-visible, .service-card:not(.reveal) { transform: none; transition: none; }
  .article-card:hover { translate: none; }
}

/* Original colours for the dimensional surfaces. */
.service-card, .service-card:nth-child(n) { background: var(--paper); color: var(--navy); border: 1px solid var(--line); }
.service-card:hover, .service-card:nth-child(n):hover { background: #e9eee1; }
.service-card h3, .service-card:nth-child(n) h3 { color: var(--navy); }
.service-card p, .service-card:nth-child(n) p { color: var(--muted); }
.service-card .small-number, .service-card:nth-child(n) .small-number { color: #7d8a7e; }
.service-card .service-icon, .service-card:nth-child(n) .service-icon { background: #e6ecdf; color: var(--mint); border: 1px solid var(--line); }
.service-card:hover .service-icon, .service-card:nth-child(n):hover .service-icon { background: var(--mint); color: var(--paper); }
.service-card .service-bottom, .service-card:nth-child(n) .service-bottom { border-top: 1px solid var(--line); }
.service-card .service-bottom > svg, .service-card:nth-child(n) .service-bottom > svg { background: transparent; border: 1px solid var(--line); }