/* ==========================================================================
   Shokrullahgarage — responsive enhancements (mobile-first, min-width queries)
   Tested widths: 375, 390, 414, 768, 1024, 1280, 1440
   ========================================================================== */

/* Small phones: keep hero buttons full width and tidy */
@media (max-width: 479px) {
  .hero .btn-row .btn, .cta-band .btn-row .btn { flex: 1 1 100%; }
  .brand-word { font-size: 1.35rem; letter-spacing: 0.12em; }
  .step-actions .btn { flex: 1 1 0; padding-inline: 14px; }
  .ba-label { top: 10px; font-size: 0.75rem; padding: 4px 8px; }
  .ba-label-before { left: 10px; }
  .ba-label-after { right: 10px; }
  .ba-knob { width: 44px; height: 44px; }
  .spec-list > div { grid-template-columns: 90px 1fr; }
  .stepper-item { font-size: 0; gap: 0; }
}

@media (min-width: 480px) {
  .gallery-grid { gap: 12px; }
  .choice-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .flash-stack { left: auto; width: min(520px, calc(100% - 32px)); }
}

/* Tablet */
@media (min-width: 768px) {
  :root { --header-h: 76px; }
  .header-cta { display: inline-flex; }
  .service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .field-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .field-grid > .field:has(textarea) { grid-column: 1 / -1; }
  .process-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .process-steps li:last-child { grid-column: 1 / -1; }
  .about-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cta-inner { grid-template-columns: 1fr auto; }
  .hero-scroll { display: block; }
  .gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .gallery-grid > .gallery-item:first-child:nth-last-child(odd) { grid-column: auto; }
  .gallery-item:only-child { grid-column: 1 / -1; }
  .video-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
  .video-grid:has(> :nth-child(2):last-child) { grid-template-columns: repeat(2, minmax(0, 280px)); }
  .video-grid:has(> :only-child) { grid-template-columns: minmax(0, 320px); }
  .steering-photos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stepper-num { display: inline; }
  .footer-bottom { padding-bottom: 32px; }
  .wa-float { right: 24px; bottom: 24px; width: 60px; height: 60px; }
}

/* Small laptop / large tablet */
@media (min-width: 1024px) {
  /* Desktop navigation */
  .nav-toggle { display: none; }
  .primary-nav {
    position: static; inset: auto; padding: 0; background: none; overflow: visible; flex-direction: row;
    opacity: 1; visibility: visible; transform: none; transition: none; margin-left: auto;
  }
  .nav-list { display: flex; gap: 0; border: 0; }
  .nav-link {
    min-height: 44px; padding: 0 9px; border: 0; font-size: 0.95rem; letter-spacing: 0.1em; position: relative;
    color: var(--c-soft); white-space: nowrap;
  }
  .brand-word { font-size: 1.4rem; letter-spacing: 0.1em; }
  .header-cta { padding-inline: 14px; }
  .nav-link::after { content: ""; position: absolute; left: 9px; right: 9px; bottom: 6px; height: 1px; background: var(--c-accent); transform: scaleX(0); transform-origin: left; transition: transform 0.25s var(--ease); }
  .nav-link:hover { color: var(--c-text-strong); }
  .nav-link:hover::after, .nav-link.is-active::after { transform: scaleX(1); }
  .nav-link.is-active { color: var(--c-text-strong); }
  .nav-mobile-extra { display: none; }
  .header-actions { margin-left: 16px; }

  .service-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .service-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .project-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .service-row { grid-template-columns: 1.15fr 1fr; gap: clamp(40px, 5vw, 80px); }
  .service-row.is-reversed .service-row-visual { order: 2; }
  .ba-feature { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: clamp(32px, 4vw, 64px); }
  .ba-feature.is-reversed .ba { order: 2; }
  .ba-feature-wide { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
  .process-steps { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .process-steps li:last-child { grid-column: auto; }
  .process-steps li { padding: 36px 28px 40px; min-height: 260px; }
  .detail-layout { grid-template-columns: minmax(0, 1fr) 380px; gap: clamp(40px, 6vw, 96px); }
  .detail-aside, .spec-card, .quote-aside { position: sticky; top: calc(var(--header-h) + 24px); }
  .quote-layout { grid-template-columns: minmax(0, 1fr) 360px; gap: clamp(40px, 5vw, 80px); }
  .contact-layout { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: clamp(40px, 5vw, 80px); }
  .footer-grid { grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 48px; }
  .gallery-grid { gap: 16px; }
  .hero-content { padding-bottom: 24px; }
}

/* Desktop */
@media (min-width: 1280px) {
  .nav-link { padding: 0 12px; letter-spacing: 0.14em; }
  .nav-link::after { left: 12px; right: 12px; }
  .brand-word { font-size: 1.6rem; letter-spacing: 0.14em; }
  .choice-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Large desktop */
@media (min-width: 1440px) {
  :root { --container: 1360px; }
  .hero-title { max-width: 16ch; }
}

/* Short landscape phones: don't force a full-height hero */
@media (max-height: 520px) and (orientation: landscape) {
  .hero { min-height: auto; padding-top: calc(var(--header-h) + 40px); }
  .case-hero { min-height: auto; }
}

@media print {
  .site-header, .wa-float, .cta-band, .site-footer, .flash-stack { display: none !important; }
  body { background: #fff; color: #000; }
}