/* Responsive spacing refinements for phones, tablets, and compact laptops. */
.site-header { box-shadow: 0 8px 30px oklch(0.08 0.04 250 / 12%); }
.brand-lockup { min-width: 0; }
.site-header > nav > .btn-light { display: none; }
.mobile-panel { width: min(22rem, calc(100vw - 2rem)); margin-top: .5rem; box-shadow: 0 18px 45px oklch(0.08 0.04 250 / 24%); }
.mobile-link { display: block; min-height: 2.75rem; padding: .7rem .65rem; }
.mobile-link:last-child { border-bottom: 0; }
.mobile-cta { width: 100%; margin-top: 1rem; }
.solution-card { display: flex; flex-direction: column; }
.solution-card h3 { max-width: 16rem; }
.solution-list { display: grid; gap: .55rem; margin-top: 1.25rem; color: var(--muted-foreground); font-size: .86rem; line-height: 1.45; }
.solution-list li { position: relative; padding-left: 1rem; }
.solution-list li::before { content: ""; position: absolute; left: 0; top: .58em; width: .3rem; height: .3rem; border-radius: 50%; background: var(--cyan); }
.solution-card > a { margin-top: auto; padding-top: 1.6rem; }
.product-list strong { display: block; line-height: 1.35; }
.product-list strong small { display: block; margin-top: .35rem; color: var(--muted-foreground); font-size: .78rem; font-weight: 450; line-height: 1.5; }

@media (max-width: 767px) {
  .shell { width: min(100% - 2rem, 78rem); }
  .site-header nav { height: 4.5rem; }
  .brand-lockup { gap: .65rem; }
  .brand-lockup .logo-mark { width: 2.4rem; height: 2.4rem; }
  .brand-lockup strong { font-size: .82rem; }
  .brand-lockup span span { font-size: .56rem; }
  .mobile-panel { top: 3.75rem; padding: 1rem; }
  .section { padding-block: 4.5rem; }
  .hero { min-height: 720px; }
  .hero .shell { padding-block: 6.5rem 4rem; }
  .hero h1 { font-size: clamp(2.35rem, 9vw, 3rem); }
  .hero .eyebrow { line-height: 1.8; flex-wrap: wrap; row-gap: .3rem; }
  .hero-stat { min-width: 0; padding: .8rem .65rem; }
  .hero-stat strong { font-size: 1rem; }
  .hero-stat span { font-size: .62rem; line-height: 1.4; }
  .section-heading h2 { font-size: clamp(2rem, 8vw, 2.65rem); }
  .service-card { min-height: 0; padding: 1rem; }
  .service-card h3 { font-size: 1.2rem; }
  .solution-list { font-size: .82rem; }
  .feature-card { min-height: 0; padding: 1.5rem; }
  .feature-card h3 { margin-top: 2.25rem; }
  .industry-card { min-height: 0; padding: 1.5rem; }
  .industry-card h3 { margin-top: 2rem; }
  .client-card { min-height: 8rem; padding: 1rem .75rem; }
  .client-logo-placeholder { min-height: 4.5rem; }
  .process-line { margin-top: 3.5rem; }
  .product-list a { grid-template-columns: 2rem minmax(0, 1fr) auto; gap: .75rem; min-height: 4.75rem; }
  .product-list strong { font-size: .95rem; line-height: 1.4; }
  .product-list strong small { font-size: .74rem; line-height: 1.45; }
  .contact-section .shell { padding-block: 4.5rem; }
  .contact-form { padding: 1.25rem; }
}

@media (max-width: 480px) {
  .shell { width: min(100% - 1.5rem, 78rem); }
  .hero { min-height: 760px; }
  .mobile-panel { width: min(21rem, calc(100vw - 1.5rem)); }
  .hero .shell { padding-top: 6rem; }
  .hero h1 { margin-top: 1.25rem; }
  .hero .mt-7 { margin-top: 1.25rem; }
  .hero .mt-10 { margin-top: 1.75rem; }
  .hero .mt-16 { margin-top: 3rem; }
  .btn { width: 100%; }
  .hero-stat { padding-inline: .5rem; }
  .section-heading { gap: 1rem; }
  .section-heading h2 { margin-top: .75rem; }
  .image-frame img { aspect-ratio: 5 / 6; }
  .contact-form .btn { width: 100%; }
}

@media (min-width: 768px) and (max-width: 1199px) {
  .shell { width: min(100% - 4rem, 78rem); }
  .hero .shell { padding-block: 8rem 6rem; }
  .hero h1 { font-size: clamp(3.25rem, 6vw, 4.5rem); }
  .service-card { padding: 1rem; }
  .feature-card, .industry-card { padding: 1.75rem; }
}

@media (min-width: 768px) {
  .client-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 1200px) {
  .client-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}

@media (min-width: 1024px) {
  .site-header > nav > .btn-light { display: inline-flex; }
}