/* =============================================================
   FUSHION LENS LIMITED — Responsive Overrides
   Handles inline-grid patterns across page templates
   ============================================================= */

/* ─── Hero contact panel / two-column inline grids ─── */
@media (max-width: 760px) {
  /* Homepage contact panel */
  [style*="grid-template-columns: 1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }

  /* Booking form sidebar */
  [style*="grid-template-columns: 1fr 2fr"] {
    grid-template-columns: 1fr !important;
  }

  /* Contact grid */
  [style*="grid-template-columns: 1fr 1.5fr"] {
    grid-template-columns: 1fr !important;
  }

  [style*="grid-template-columns: 1.5fr 1fr"] {
    grid-template-columns: 1fr !important;
  }

  [style*="grid-template-columns: 1fr 1.5fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
}

/* ─── Session type grids on mobile ─── */
@media (max-width: 760px) {
  [style*="grid-template-columns: repeat(3, 1fr)"] {
    grid-template-columns: 1fr !important;
  }

  [style*="grid-template-columns: repeat(4, 1fr)"] {
    grid-template-columns: 1fr 1fr !important;
  }
}

@media (max-width: 500px) {
  [style*="grid-template-columns: repeat(4, 1fr)"] {
    grid-template-columns: 1fr !important;
  }
}

/* ─── Session card two-col info grids ─── */
@media (max-width: 640px) {
  [style*="grid-template-columns: 1fr 1fr"][style*="gap: var(--sp-5)"] {
    grid-template-columns: 1fr !important;
  }
}

/* ─── Experience page two-column sticky layout ─── */
@media (max-width: 900px) {
  [style*="grid-template-columns: 1fr 1.5fr"] {
    grid-template-columns: 1fr !important;
  }

  [style*="position: sticky; top: 100px"] {
    position: static !important;
  }
}

/* ─── Services page two-col sections ─── */
@media (max-width: 820px) {
  .services-split {
    grid-template-columns: 1fr !important;
  }
}

/* ─── About subjects grid ─── */
@media (max-width: 700px) {
  [style*="grid-template-columns: repeat(3, 1fr)"][style*="gap: var(--sp-4)"] {
    grid-template-columns: 1fr 1fr !important;
  }
}

/* ─── Company details DL ─── */
@media (max-width: 500px) {
  dl[style*="grid-template-columns: auto 1fr"] {
    display: block !important;
  }

  dl[style*="grid-template-columns: auto 1fr"] dt {
    margin-top: 1.25rem !important;
    margin-bottom: 0.25rem !important;
  }
}

/* ─── For businesses subject grid ─── */
@media (max-width: 800px) {
  [style*="grid-template-columns: repeat(4, 1fr)"][style*="max-width: 1000px"] {
    grid-template-columns: 1fr 1fr !important;
  }
}

/* ─── Image strip mobile ─── */
@media (max-width: 600px) {
  .image-strip {
    grid-template-columns: 1fr !important;
  }
}

/* ─── Delivery grid mobile ─── */
@media (max-width: 600px) {
  .delivery-grid {
    grid-template-columns: 1fr !important;
  }
}

/* ─── Session page three-col business features ─── */
@media (max-width: 700px) {
  [style*="grid-template-columns: repeat(3, 1fr)"][style*="max-width: 960px"] {
    grid-template-columns: 1fr !important;
  }
}

/* ─── CTA section inner ─── */
@media (max-width: 600px) {
  .cta-section__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .cta-section__actions .btn {
    text-align: center;
  }
}

/* ─── Service page image aspect ratio on mobile ─── */
@media (max-width: 820px) {
  [style*="aspect-ratio:4/5"] {
    aspect-ratio: 4/3 !important;
  }
}

/* ─── Session card list ─── */
@media (max-width: 640px) {
  .session-card {
    padding: var(--sp-6) var(--sp-5);
  }
}

/* ─── Page hero actions row ─── */
@media (max-width: 500px) {
  .page-hero [style*="display:flex"] {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ─── Footer responsive ─── */
@media (max-width: 500px) {
  .site-footer__logo-panel {
    padding: var(--sp-3) var(--sp-5);
  }

  .site-footer__logo-panel img {
    height: 40px;
  }
}

/* ─── Legal content table ─── */
@media (max-width: 640px) {
  .legal-content dl {
    display: block !important;
  }

  .legal-content dt {
    margin-top: var(--sp-5) !important;
    margin-bottom: var(--sp-2) !important;
  }
}

/* ─── FAQ details ─── */
details summary::-webkit-details-marker {
  display: none;
}

details[open] summary span:last-child {
  content: '−' !important;
  display: inline-block;
}

/* ─── Booking form full-width on mobile ─── */
@media (max-width: 860px) {
  #booking-form .container > div[style*="grid-template-columns: 1fr 2fr"] {
    grid-template-columns: 1fr !important;
  }
}

/* ─── Contact grid mobile ─── */
@media (max-width: 860px) {
  .contact-grid {
    grid-template-columns: 1fr !important;
  }
}

/* ─── Split section responsive ─── */
@media (max-width: 900px) {
  .split-section {
    grid-template-columns: 1fr !important;
    min-height: auto !important;
  }

  .split-section__image {
    min-height: 300px !important;
  }

  .split-section__content {
    order: 2 !important;
  }

  .split-section__image {
    order: 1 !important;
  }
}