/* Premium Mobile Responsiveness Improvements */
html, body {
  overflow-x: hidden;
  max-width: 100vw;
}

/* Base typography for mobile readability */
@media (max-width: 768px) {
  html {
    font-size: 15px;
  }
  body {
    line-height: 1.6;
  }
  
  /* Text readability improvements */
  h1 { font-size: 2.2rem !important; line-height: 1.2 !important; }
  h2 { font-size: 1.8rem !important; line-height: 1.25 !important; }
  h3 { font-size: 1.5rem !important; line-height: 1.3 !important; }
  h4 { font-size: 1.2rem !important; line-height: 1.4 !important; }
  p, li, span { font-size: 1rem; }
  
  /* Images scaling proportionally */
  img, video, iframe, canvas {
    max-width: 100% !important;
    height: auto !important;
    object-fit: cover;
  }

  /* Padding and whitespace reduction */
  .section-wrap, .main-container {
    padding: 24px 16px !important;
    margin: 24px auto !important;
  }
  .hero {
    padding: 24px 16px !important;
    margin: 16px auto !important;
    gap: 24px !important;
    display: flex !important;
    flex-direction: column-reverse !important; /* Image first on mobile */
  }
  .page-header {
    padding: 24px 20px !important;
    margin-bottom: 24px !important;
  }
  .content-box {
    padding: 20px 16px !important;
  }

  /* Strict Gutenberg FSE Block Mobile Overrides */
  .wp-block-group, .wp-block-cover, .wp-block-cover__inner-container, .wp-block-media-text {
    padding: 24px 16px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100vw !important;
    box-sizing: border-box !important;
  }
  .wp-block-columns {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .wp-block-column {
    width: 100% !important;
    flex-basis: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .wp-block-media-text {
    display: flex !important;
    flex-direction: column !important;
  }
  .wp-block-media-text__media, .wp-block-media-text__content {
    width: 100% !important;
    padding: 0 !important;
  }
  h1.wp-block-heading, h2.wp-block-heading, p.wp-block-paragraph {
    max-width: 100% !important;
    word-break: break-word !important;
  }

  /* Buttons thumb-friendly sizing */
  .btn, button:not(.lang-btn):not(.icon-btn):not(.mobile-hamburger-btn):not(.hilary-drawer-close):not(.hilary-ai-search-btn), .hilary-btn, .variant-pill {
    min-height: 48px;
    padding: 12px 24px !important;
    font-size: 1rem !important;
    width: 100%;
    justify-content: center;
    margin-bottom: 12px;
  }
  
  /* Navigation mobile menu optimization */
  .nav-menu, .nav-links {
    display: none !important;
  }
  .mobile-hamburger-btn {
    display: inline-flex !important;
    min-width: 48px;
    min-height: 48px;
  }
  .top-header, header {
    padding: 12px 16px !important;
    flex-wrap: wrap;
    gap: 12px;
  }
  .logo-text { font-size: 1.1rem !important; }
  .logo-img { width: 40px !important; height: 40px !important; }
  .logo-area { gap: 8px !important; }
  
  /* Product Grids & Layouts */
  .pdp-grid, .products-grid, .related-grid, .category-grid, .reels-grid, .testi-grid, .footer-grid, .business-card, .gallery-col {
    grid-template-columns: 1fr !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
  }
  
  /* specific cart/checkout fixes */
  #cartGridWrap, .checkout-grid {
    grid-template-columns: 1fr !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 24px !important;
  }

  /* Footer adaptations */
  footer {
    padding: 32px 16px !important;
  }
  .footer-grid {
    grid-template-columns: 1fr !important;
    display: flex !important;
    flex-direction: column !important;
  }
  
  /* Forms and Inputs thumb-friendly */
  input, select, textarea {
    font-size: 16px !important; /* Prevents iOS zoom */
    padding: 14px 16px !important;
    min-height: 48px;
    width: 100% !important;
    margin-bottom: 16px;
  }
  
  /* Floating elements adjustments */
  .floating-wa {
    bottom: 80px !important;
    right: 16px !important;
    padding: 12px 20px !important;
    font-size: 0.9rem !important;
  }
  
  /* Remove excessive margins */
  .business-card, .aroma-module, .inci-box, .checkout-module {
    margin: 16px 0 !important;
    padding: 20px !important;
  }
  
  /* Breadcrumb wrapping */
  .breadcrumb-row {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
}

@media (max-width: 480px) {
  h1 { font-size: 1.8rem !important; }
  .top-bar { font-size: 0.75rem !important; justify-content: center !important; text-align: center !important; }
}

/* Animations */
.hero-visual img, .product-img-box img {
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.hero-visual:hover img, .product-card:hover .product-img-box img {
  transform: scale(1.05) !important;
}
/* Hide Google Translate UI for seamless native-like language switching */
body { top: 0 !important; }
.skiptranslate { display: none !important; }
#goog-gt-tt, .goog-te-banner-frame { display: none !important; }
.goog-text-highlight { background-color: transparent !important; box-shadow: none !important; }