/* ═══════ RESPONSIVE ═══════════════════════════════════════ */

/* Large laptop → 4-col shop stays, nothing to override */

/* Standard laptop 1280px */
@media (max-width: 1280px) {
  .shop-products {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Small laptop / large tablet landscape 1100px */
@media (max-width: 1100px) {
  .products-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .shop-products {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Tablet landscape / small laptop 900px */
@media (max-width: 900px) {
  .editorial-row-1 {
    grid-template-columns: 1fr;
  }
  .editorial-row-1 .card:first-child {
    grid-row: auto;
  }
  .editorial-row-1 .card-stack {
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
  }
  .editorial-row-3 {
    grid-template-columns: 1fr 1fr;
  }
  .lookbook-strip {
    grid-template-columns: 1fr 1fr;
  }
  .categories-strip {
    grid-template-columns: repeat(3, 1fr);
  }
  .shop-products {
    grid-template-columns: repeat(2, 1fr);
  }
  .trust-row {
    grid-template-columns: 1fr 1fr;
  }
  .newsletter-section {
    grid-template-columns: 1fr;
  }
  .newsletter-visual {
    display: none;
  }
  .contact-grid {
    grid-template-columns: 1fr;
  }
  .contact-info-side {
    border-right: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  }
  .footer-top {
    grid-template-columns: 1fr 1fr;
    gap: clamp(20px, 4vw, 40px);
  }
  /* Product + cart collapse */
  .product-detail-layout {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .pd-gallery {
    position: static;
    flex-direction: row;
  }
  .pd-thumbs {
    flex-direction: row;
    width: auto;
    height: auto;
    flex-wrap: nowrap;
    overflow-x: auto;
  }
  .pd-thumb {
    width: 64px;
    height: 86px;
    flex-shrink: 0;
  }
  .pd-main-img {
    flex: 1;
  }
  .csp {
    padding: 0 16px 56px;
  }
}

/* Tablet portrait + mobile nav */
@media (max-width: 900px) {
  .main-nav {
    display: none;
  }
  /* Hamburger anchored to the right edge — works on every screen width */
  .hamburger {
    display: flex;
    position: absolute;
    right: clamp(14px, 4vw, 22px);
    left: auto;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
  }
  .mobile-overlay {
    display: block;
  }
  /* Logo anchored to the left edge in LTR */
  .top-nav .logo,
  .hero-nav .logo {
    position: absolute;
    left: clamp(14px, 4vw, 22px);
    right: auto;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 64px;
    height: 56px;
    z-index: 3;
  }
  .top-nav .logo img,
  .hero-nav .logo img {
    width: 64px;
    height: auto;
    max-height: 48px;
    object-fit: contain;
  }
  /* Show nav-actions but hide everything except lang-toggle */
  .top-nav .nav-actions,
  .hero-nav .nav-actions {
    display: flex;
    align-items: center;
    position: absolute;
    right: calc(clamp(14px, 4vw, 22px) + 50px);
    left: auto;
    top: 50%;
    transform: translateY(-50%);
    z-index: 4;
    gap: 0;
  }
  .top-nav .nav-actions > *:not(.lang-toggle),
  .hero-nav .nav-actions > *:not(.lang-toggle) {
    display: none;
  }
  [data-lang="ar"] .top-nav .nav-actions,
  [data-lang="ar"] .hero-nav .nav-actions {
    right: auto;
    left: calc(clamp(14px, 4vw, 22px) + 50px);
  }
  /* Arabic: logo flips to right edge, hamburger stays left */
  [data-lang="ar"] .top-nav .logo,
  [data-lang="ar"] .hero-nav .logo {
    right: clamp(14px, 4vw, 22px);
    left: auto;
  }
  [data-lang="ar"] .hamburger {
    left: clamp(14px, 4vw, 22px);
    right: auto;
  }
  .editorial-row-2 {
    grid-template-columns: 1fr 1fr;
  }
  .products-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .shop-products {
    grid-template-columns: repeat(2, 1fr);
  }
  .categories-strip {
    grid-template-columns: repeat(2, 1fr);
  }
  .footer-top {
    grid-template-columns: 1fr;
  }
  .footer-bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  .col-toggle {
    display: flex;
  }
  .form-row {
    grid-template-columns: 1fr;
  }
  .section {
    padding: clamp(36px, 6vw, 80px) clamp(16px, 4vw, 48px);
  }
  .page-banner {
    padding-top: clamp(40px, 6vw, 72px);
  }
}

/* Mobile 480px */
@media (max-width: 480px) {
  .editorial-row-2 {
    grid-template-columns: 1fr;
  }
  .editorial-row-3 {
    grid-template-columns: 1fr;
  }
  .lookbook-strip {
    grid-template-columns: 1fr;
  }
  .categories-strip {
    grid-template-columns: 1fr 1fr;
  }
  .trust-row {
    grid-template-columns: 1fr;
  }
  .shop-products {
    grid-template-columns: repeat(2, 1fr);
  }
  .email-form {
    flex-direction: column;
  }
  .email-input {
    border-right: 1px solid rgba(255, 255, 255, 0.12);
  }
  .filter-bar {
    flex-direction: column;
    align-items: flex-start;
  }
  .pd-sizes {
    gap: 5px;
  }
  .size-btn {
    width: 40px;
    height: 40px;
    font-size: 11px;
  }
  .csp {
    padding: 0 12px 48px;
  }
}


/* ═══════ PRODUCT DETAIL — MOBILE (≤ 600px) ═══════════════ */
@media (max-width: 600px) {
  .pd-gallery {
    flex-direction: column;
  }
  .pd-main-img {
    width: 100%;
    aspect-ratio: 9 / 16;
    height: auto;
    flex: none;
  }
  .pd-thumbs {
    order: 2;
    flex-direction: row;
    width: 100%;
    height: auto;
    padding: 0 14px 2px;
    overflow-x: auto;
    flex-wrap: nowrap;
  }
  .pd-thumb {
    width: 58px;
    height: 76px;
    flex: 0 0 58px;
  }
}

/* ═══════ CART — MOBILE (≤ 540px / iPhone) ════════════════ */
@media (max-width: 540px) {
  /* Fix iOS Safari auto-zoom on input focus */
  .form-input,
  .form-textarea,
  .form-select {
    font-size: 16px;
  }

  /* Step bar compact */
  .cst-bar {
    padding: 22px 20px 0;
  }
  .cst-num {
    width: 34px;
    height: 34px;
    font-size: 13px;
  }
  .cst-lbl {
    font-size: 9px;
    letter-spacing: 0.1em;
  }
  .cst-line {
    margin: 0 6px;
    margin-bottom: 18px;
  }

  /* Panels edge-to-edge */
  .csp {
    padding: 0 14px 56px;
    margin-top: 20px;
  }

  /* Cart items tighter */
  .cart-item {
    gap: 10px;
    padding: 11px 0;
  }
  .cart-item-img {
    width: 60px;
    height: 76px;
  }
  .cart-item-name {
    font-size: 13px;
    margin-bottom: 3px;
  }
  .cart-item-price {
    font-size: 13px;
    margin-bottom: 7px;
  }
  .cart-item-qty button {
    width: 30px;
    height: 30px;
    font-size: 15px;
  }
  .cart-item-qty span {
    width: 34px;
    height: 30px;
    font-size: 12px;
  }

  /* Step nav buttons */
  .csp-nav {
    margin-top: 20px;
    gap: 8px;
  }
  .csp-back {
    padding: 13px 14px;
    font-size: 11px;
  }
  .csp-next {
    padding: 14px 16px;
    font-size: 12px;
  }

  /* Payment methods */
  .pay-method-box {
    padding: 10px 12px;
    gap: 10px;
  }
  .pay-method-icon {
    font-size: 18px;
  }
  .pay-method-box strong {
    font-size: 11px;
  }
  .pay-method-box span {
    font-size: 10px;
  }

  /* Form fields */
  .form-group {
    margin-bottom: 14px;
  }
}

/* Small mobile 375px */
@media (max-width: 375px) {
  .categories-strip {
    grid-template-columns: 1fr 1fr;
  }
  .trust-row {
    grid-template-columns: 1fr;
  }
  .hero-copy h1 {
    font-size: clamp(28px, 9vw, 40px);
  }
  .page-banner h1 {
    font-size: clamp(26px, 9vw, 44px);
  }
  .policy-tab {
    padding: 12px 14px;
    font-size: 10px;
  }
  .shop-products {
    grid-template-columns: repeat(2, 1fr);
  }
}