@media (max-width: 1100px) {
  .five-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .three-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .project-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .footer-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .intro-content {
    max-width: 680px;
  }

  .home-hero-title {
    max-width: 22ch;
  }

  .home-stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .stat-card {
    min-height: 160px;
  }

  .stat-card-title {
    min-height: 2.5em;
    max-width: 16ch;
  }
}

/* Mobile navigation — tablet and below */
@media (max-width: 1120px) {
  .nav-toggle {
    display: block;
  }

  .nav-menu {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    background: rgba(8, 22, 38, 0.97);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    flex-direction: column;
    align-items: stretch;
    gap: 1rem;
    padding: 0 1rem;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease, padding 0.35s ease;
  }

  .nav-menu.open {
    max-height: 620px;
    padding: 1rem;
  }

  .nav-links,
  .nav-actions {
    flex-direction: column;
    width: 100%;
    gap: 0.75rem;
  }

  .nav-links a {
    white-space: normal;
    display: block;
    padding: 0.35rem 0;
    text-align: center;
  }

  .nav-actions .lang-switch,
  .nav-actions .btn {
    width: 100%;
    justify-content: center;
  }

  .nav-links li,
  .nav-actions .btn {
    width: 100%;
    text-align: center;
  }
}

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

  .two-col,
  .two-grid,
  .footer-grid,
  .ceo-message-grid,
  .fb-brands-grid,
  .contact-layout {
    grid-template-columns: 1fr;
  }

  .contact-layout {
    gap: var(--s-7);
  }

  .contact-map {
    min-height: 320px;
  }

  .contact-map iframe {
    min-height: 320px;
  }


  .ceo-message-content h2 {
    max-width: none;
  }

  .ceo-message-visual {
    max-width: 420px;
    margin-inline: auto;
  }

  .values-panels {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    gap: 0.85rem;
    padding-bottom: 0.5rem;
    -webkit-overflow-scrolling: touch;
  }

  .value-panel {
    flex: 0 0 min(78vw, 280px);
    scroll-snap-align: start;
    max-height: min(70vh, 520px);
  }

  .four-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .logo-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cta-wrap {
    flex-direction: column;
    align-items: flex-start;
  }

  .service-detail-visual .service-detail-grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      "head"
      "list"
      "media";
    row-gap: clamp(1.75rem, 4vw, 2.5rem);
  }

  .service-detail-visual .service-detail-list,
  .service-detail-visual .service-detail-media {
    max-width: none;
  }

  .service-detail-visual .service-image-inner {
    min-height: clamp(240px, 52vw, 360px);
    aspect-ratio: 16 / 10;
    height: auto;
  }

  .home-hero-grid {
    grid-template-columns: 1fr;
  }

  .home-hero-visual {
    order: 2;
    max-width: none;
    width: 100%;
    min-height: auto;
  }

  .home-hero-image-frame {
    min-height: clamp(280px, 52vw, 420px);
  }

  .home-hero-content {
    order: 1;
  }

  .home-hero-title {
    max-width: none;
  }

  .page-hero {
    padding: calc(var(--nav-h) + var(--s-7)) 0 var(--s-7);
  }

  .page-hero h1 {
    font-size: clamp(1.65rem, 5.5vw, 2.35rem);
  }

  .page-hero--about,
  .page-hero--services {
    min-height: clamp(260px, 40vh, 400px);
    align-items: flex-end;
  }

  .page-hero.page-hero--image {
    min-height: clamp(300px, 48vh, 480px);
  }

  .mission-vision-grid {
    gap: var(--s-7);
  }

  .mission-vision-title {
    font-size: clamp(1.35rem, 4vw, 1.75rem);
  }

  .services-typewriter {
    font-size: clamp(1.85rem, 5.5vw, 2.75rem);
  }

  .home-hero .home-hero-grid.container {
    width: min(94%, 1320px);
  }

  .home-hero-desc {
    font-size: clamp(0.92rem, 2.5vw, 1rem);
  }

  .projects-gallery {
    padding-top: calc(var(--nav-h) + var(--s-5));
  }

  .projects-filter-tabs {
    overflow-x: auto;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: 0.25rem;
  }

  .projects-filter-tabs::-webkit-scrollbar {
    display: none;
  }

  .projects-page .construction-filter-btn {
    flex: 0 0 auto;
  }

  .projects-page .projects-portfolio-grid.construction-portfolio-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: auto;
  }
}

@media (max-width: 640px) {
  .container {
    width: min(calc(100% - 1.5rem), var(--container));
  }

  .section {
    padding: clamp(3.75rem, 6vw, 4.5rem) 0;
  }

  .landing-intro {
    min-height: 100svh;
    height: 100svh;
  }

  .intro-content {
    text-align: center;
    margin-inline: auto;
    padding-top: 4.5rem;
    padding-bottom: 6.8rem;
  }

  .intro-title-creative {
    align-items: center;
    text-align: center;
  }

  .intro-line-lead {
    letter-spacing: 0.2em;
  }

  .intro-line-tail {
    margin-inline: auto;
    max-width: 36ch;
  }

  .five-grid,
  .four-grid,
  .three-grid,
  .project-grid,
  .logo-grid,
  .footer-grid {
    grid-template-columns: 1fr;
  }

  .partners-logo-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cta-wrap {
    align-items: stretch;
  }

  .cta-wrap .btn {
    width: 100%;
    justify-content: center;
  }

  .contact-form .btn {
    width: 100%;
  }

  .contact-card {
    padding: var(--s-6);
  }

  .contact-card-item {
    padding: var(--s-4) 0;
  }

  .contact-locations {
    gap: var(--s-4);
  }

  .contact-location p {
    max-width: none;
  }

  .map-placeholder,
  .contact-map {
    min-height: clamp(240px, 58vw, 300px);
  }

  .contact-map iframe {
    min-height: clamp(240px, 58vw, 300px);
  }

  .home-stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
  }

  .hero-actions,
  .home-hero-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .home-hero-title {
    font-size: clamp(1.75rem, 7vw, 2.15rem);
  }

  .values-panels {
    gap: 0.75rem;
  }

  .value-panel {
    flex: 0 0 min(88vw, 300px);
  }

  .stat-card {
    min-height: 148px;
    padding: 1.25rem 0.85rem;
  }

  .stat-card-title {
    font-size: 0.88rem;
    min-height: 2.4em;
    margin-bottom: 0.85rem;
  }

  .stat-card-value {
    font-size: clamp(1.85rem, 7vw, 2.35rem);
  }

  .inline-form {
    width: 100%;
  }

  .inline-form input,
  .inline-form button {
    width: 100%;
  }
}

/* Construction service page */
@media (max-width: 1100px) {
  .construction-timeline {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .construction-step-body h3 {
    min-height: calc(2 * 1.32em + var(--s-3) + 2px);
  }

  .construction-timeline::before {
    display: none;
  }

  .construction-metrics-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .construction-portfolio-item--large {
    grid-column: span 12;
    grid-row: span 1;
  }

  .construction-portfolio-item--wide {
    grid-column: span 12;
  }

  .construction-portfolio-item--tall {
    grid-row: span 1;
  }

  .construction-portfolio-item,
  a.construction-portfolio-item-link {
    grid-column: span 6;
  }

  a.construction-portfolio-item-link.construction-portfolio-item--large,
  a.construction-portfolio-item-link.construction-portfolio-item--wide {
    grid-column: span 12;
  }

  a.construction-portfolio-item-link.construction-portfolio-item--tall {
    grid-row: span 1;
  }
}

@media (max-width: 900px) {
  .construction-quality-grid {
    grid-template-columns: 1fr;
  }

  .construction-cap-grid {
    grid-template-columns: 1fr;
  }

  .construction-timeline {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .construction-step-body h3 {
    min-height: calc(2 * 1.32em + var(--s-3) + 2px);
  }

  .page-hero--construction h1 {
    max-width: none;
  }

  .fb-page .page-hero--food-beverage h1 {
    max-width: none;
  }

  .quarries-page .page-hero--quarries h1 {
    max-width: none;
  }

  .recycling-page .page-hero--recycling h1 {
    max-width: 14ch;
    font-size: clamp(1.85rem, 7vw, 2.35rem);
  }

  .recycling-page .page-hero--recycling .construction-hero-subtitle {
    max-width: 36ch;
    font-size: clamp(0.92rem, 3.4vw, 1.02rem);
  }

  .page-hero.page-hero--recycling {
    min-height: clamp(280px, 36vh, 420px);
    background-position: center 32%;
  }

  .recycling-page .page-hero--recycling .container {
    padding-top: 0;
    padding-bottom: clamp(1.5rem, 4vw, 2rem);
  }

  .supplies-page .page-hero--supplies h1 {
    max-width: 12ch;
    font-size: clamp(1.85rem, 7vw, 2.35rem);
  }

  .supplies-page .page-hero--supplies .construction-hero-subtitle {
    max-width: 36ch;
    font-size: clamp(0.92rem, 3.4vw, 1.02rem);
  }

  .page-hero.page-hero--supplies {
    min-height: clamp(280px, 36vh, 420px);
    background-position: center 32%;
  }

  .supplies-page .page-hero--supplies .container {
    padding-top: 0;
    padding-bottom: clamp(1.5rem, 4vw, 2rem);
  }

  .quarries-experience-grid {
    grid-template-columns: 1fr;
    gap: clamp(2rem, 4vw, 2.5rem);
  }

  .quarries-showcase-media {
    min-height: clamp(240px, 52vw, 360px);
    aspect-ratio: 16 / 9;
    height: auto;
  }

  .fb-experience-grid {
    grid-template-columns: 1fr;
    gap: clamp(2rem, 4vw, 2.5rem);
  }

  .fb-experience .fb-showcase-media {
    min-height: clamp(240px, 52vw, 360px);
    aspect-ratio: 16 / 9;
    height: auto;
  }

  .fb-page .fb-brands-grid {
    grid-template-columns: 1fr;
  }

  .construction-intro {
    margin-top: clamp(-3rem, -6vw, -4rem);
  }

  .construction-intro-actions {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (max-width: 640px) {
  .construction-final-cta-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .construction-intro-card {
    padding: 1.5rem 1.25rem;
  }

  .construction-intro-highlights {
    width: 100%;
  }

  .construction-timeline {
    grid-template-columns: 1fr;
  }

  .construction-step-body h3 {
    min-height: 0;
  }

  .construction-portfolio-grid {
    grid-template-columns: 1fr;
    grid-auto-rows: auto;
  }

  .projects-page .projects-portfolio-grid.construction-portfolio-grid {
    grid-template-columns: 1fr;
    grid-auto-rows: auto;
  }

  .projects-page .construction-portfolio-media {
    aspect-ratio: 4 / 3;
  }

  .construction-portfolio-item,
  .construction-portfolio-item--large,
  .construction-portfolio-item--wide,
  .construction-portfolio-item--tall,
  a.construction-portfolio-item-link,
  a.construction-portfolio-item-link.construction-portfolio-item--large,
  a.construction-portfolio-item-link.construction-portfolio-item--wide,
  a.construction-portfolio-item-link.construction-portfolio-item--tall {
    grid-column: span 1;
    grid-row: span 1;
  }

  .construction-filter-tabs {
    gap: 0.4rem;
  }

  .construction-filter-btn {
    font-size: 0.78rem;
    padding: 0.5rem 0.85rem;
  }

  .construction-metrics-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
  }

  .construction-metric-card {
    padding: 1.35rem 0.85rem;
  }

  .construction-metric-value {
    font-size: clamp(1.85rem, 7vw, 2.35rem);
  }

  .projects-toolbar {
    flex-wrap: wrap;
    gap: var(--s-4);
  }

  .projects-filter-tabs {
    flex: 1 1 100%;
    flex-wrap: wrap;
  }

  .projects-page .construction-filter-btn {
    flex: 1 1 calc(50% - 0.25rem);
  }

  .projects-lightbox-media img {
    max-height: 88vh;
  }

  .construction-portfolio-overlay h3 {
    font-size: clamp(0.95rem, 3.5vw, 1.1rem);
  }

  .construction-portfolio-overlay p {
    font-size: 0.82rem;
  }
}

@media (max-width: 480px) {
  .home-stats-grid {
    grid-template-columns: 1fr;
  }

  .partners-logo-grid {
    grid-template-columns: 1fr;
  }

  .intro-line-lead {
    font-size: clamp(0.62rem, 2.8vw, 0.72rem);
    letter-spacing: 0.14em;
  }

  .intro-wordmark,
  .intro-line:nth-child(2) {
    font-size: clamp(2.5rem, 14vw, 3.5rem);
  }

  .projects-page .construction-filter-btn {
    flex: 1 1 100%;
  }

  .construction-metrics-grid {
    grid-template-columns: 1fr;
  }
}