#cz-figma-root, #cz-figma-root * { box-sizing: border-box; }
#cz-figma-root { direction: rtl; width:100%; max-width:none; background:#fff; color:#111; }
#cz-figma-root * { font-family: Heebo, Arial, sans-serif; }
#cz-figma-root h1,#cz-figma-root h2,#cz-figma-root h3,#cz-figma-root h4,#cz-figma-root h5,#cz-figma-root h6 { font-family: Rubik, Arial, sans-serif; }
html { scroll-behavior:smooth; }


/* Cellular Zamarot responsive fixes v0.5.9 */
html, body { overflow-x: hidden; }
#cz-figma-root { width:100% !important; max-width:100% !important; overflow-x:hidden !important; }

@media (max-width: 700px) {
  #cz-figma-root { font-size:16px !important; }

  #hero {
    min-height:auto !important;
    padding:32px 16px 210px !important;
  }
  #hero h1 {
    font-size:clamp(34px,11vw,44px) !important;
    line-height:1.05 !important;
  }
  #hero p { font-size:16px !important; }
  .hero-phone {
    width:210px !important;
    height:250px !important;
    opacity:.26 !important;
    bottom:-18px !important;
  }
  .hero-phone-left { left:-75px !important; }
  .hero-phone-right { right:-82px !important; }

  .trust-bar {
    position:relative !important;
    bottom:auto !important;
    margin:-150px auto 28px !important;
    width:calc(100% - 24px) !important;
    grid-template-columns:1fr !important;
    gap:0 !important;
    padding:10px 18px !important;
    border-radius:18px !important;
  }
  .trust-bar > * {
    min-width:0 !important;
    border-left:none !important;
    border-bottom:1px solid #E5E7EB !important;
    padding:12px 0 !important;
  }
  .trust-bar > *:last-child { border-bottom:none !important; }

  #shop-preview,
  #services,
  .cz-repair,
  .cz-brands,
  .cz-why-us,
  .cz-reviews,
  .cz-contact {
    padding-left:16px !important;
    padding-right:16px !important;
  }

  #shop-preview { padding-top:34px !important; padding-bottom:34px !important; }
  .shop-categories-grid {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
  }
  .shop-categories-grid > * {
    min-height:104px !important;
    padding:12px 8px !important;
  }

  #services {
    padding-top:42px !important;
    padding-bottom:42px !important;
  }
  .lab-services-grid {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
  }
  .lab-services-grid > * { min-height:104px !important; }

  .cz-repair,
  .cz-brands,
  .cz-why-us,
  .cz-reviews,
  .cz-contact {
    padding-top:54px !important;
    padding-bottom:54px !important;
  }
  .cz-repair-grid,
  .cz-brands-grid,
  .cz-why-grid,
  .cz-contact-grid {
    grid-template-columns:1fr !important;
    gap:24px !important;
  }

  .cz-reviews > div > div:first-child {
    margin-bottom:28px !important;
  }
  #reviews-carousel {
    gap:12px !important;
    width:100% !important;
  }
  #reviews-carousel > div {
    flex:0 0 88% !important;
    min-width:88% !important;
  }
  #reviews-carousel + button,
  #reviews-carousel ~ button {
    width:36px !important;
    height:36px !important;
    font-size:22px !important;
  }

  .cz-footer {
    padding:44px 18px 24px !important;
  }
  .cz-footer-grid {
    grid-template-columns:1fr !important;
    gap:28px !important;
    margin-bottom:34px !important;
  }

  .cz-mobile-menu {
    position:relative !important;
    z-index:999 !important;
  }

  #cz-figma-root img,
  #cz-figma-root iframe {
    max-width:100% !important;
  }
}

@media (min-width:701px) and (max-width:1100px) {
  .shop-categories-grid { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
  .cz-repair-grid,
  .cz-brands-grid,
  .cz-why-grid,
  .cz-contact-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:28px !important; }
  #reviews-carousel > div { flex:0 0 48% !important; min-width:48% !important; }
}


/* v0.6.0 targeted mobile navigation + reviews fixes */
@media (max-width: 700px) {
  /* Inline display values in the React bundle need explicit overrides. */
  #cz-figma-root .cz-desktop-only {
    display:none !important;
  }
  #cz-figma-root .cz-mobile-only {
    display:flex !important;
  }
  #cz-figma-root .cz-mobile-menu {
    display:block !important;
  }

  #cz-figma-root header {
    width:100% !important;
    max-width:100% !important;
  }
  #cz-figma-root .cz-mobile-only {
    width:100% !important;
    min-width:0 !important;
    padding:0 14px !important;
  }
  #cz-figma-root .cz-mobile-only a {
    min-width:0 !important;
  }
  #cz-figma-root .cz-mobile-only strong {
    font-size:17px !important;
    white-space:nowrap !important;
  }

  /* Reviews become a clean swipe carousel on phones. */
  #cz-figma-root .cz-reviews-row {
    display:block !important;
    width:100% !important;
    margin-bottom:28px !important;
  }
  #cz-figma-root .cz-reviews-row > button {
    display:none !important;
  }
  #cz-figma-root #reviews-carousel {
    display:flex !important;
    width:100% !important;
    max-width:100% !important;
    gap:12px !important;
    overflow-x:auto !important;
    padding:0 6px 8px !important;
    scroll-snap-type:x mandatory !important;
    -webkit-overflow-scrolling:touch !important;
  }
  #cz-figma-root #reviews-carousel > div {
    flex:0 0 calc(100% - 12px) !important;
    min-width:calc(100% - 12px) !important;
    max-width:calc(100% - 12px) !important;
    scroll-snap-align:center !important;
  }
  #cz-figma-root #reviews-carousel > div > * {
    width:100% !important;
    max-width:100% !important;
  }

  /* Keep the Google rating badge from overflowing narrow screens. */
  #cz-figma-root .cz-reviews h2 + div {
    max-width:100% !important;
    flex-wrap:wrap !important;
    justify-content:center !important;
    padding:12px 14px !important;
  }
}

@media (min-width:701px) and (max-width:1100px) {
  #cz-figma-root .cz-desktop-only { display:none !important; }
  #cz-figma-root .cz-mobile-only { display:flex !important; }
  #cz-figma-root .cz-mobile-menu { display:block !important; }
}


/* v0.6.1 responsive fixes for About / Warranty / FAQ pages */
.cz-info-page,
.cz-info-page * {
  box-sizing:border-box;
}
.cz-info-page {
  width:100% !important;
  max-width:100% !important;
  overflow-x:hidden !important;
}
.cz-info-inner {
  width:100% !important;
  max-width:900px !important;
}
.cz-info-card,
.cz-faq-list {
  width:100% !important;
  max-width:100% !important;
}

@media (max-width:700px) {
  .cz-info-page {
    padding:20px 12px 48px !important;
  }
  .cz-info-inner {
    width:100% !important;
    max-width:100% !important;
    margin:0 auto !important;
  }
  .cz-info-page header {
    margin-bottom:22px !important;
    padding:0 6px !important;
  }
  .cz-info-page header img {
    height:60px !important;
    max-width:150px !important;
  }
  .cz-info-page header h1 {
    font-size:clamp(30px,9vw,40px) !important;
    line-height:1.12 !important;
    overflow-wrap:anywhere !important;
  }
  .cz-info-page header p {
    font-size:16px !important;
    line-height:1.55 !important;
  }

  .cz-info-card {
    padding:20px 16px !important;
    border-radius:18px !important;
    font-size:16px !important;
    line-height:1.7 !important;
    overflow:hidden !important;
  }
  .cz-info-card h2 {
    font-size:21px !important;
    line-height:1.25 !important;
    overflow-wrap:anywhere !important;
  }

  .cz-faq-list {
    padding:2px 14px !important;
    border-radius:18px !important;
    overflow:hidden !important;
  }
  .cz-faq-item {
    width:100% !important;
    max-width:100% !important;
    overflow:hidden !important;
  }
  .cz-faq-question {
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    padding:18px 0 !important;
    gap:12px !important;
    align-items:flex-start !important;
    font-size:17px !important;
    line-height:1.35 !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    word-break:normal !important;
  }
  .cz-faq-question > span:first-child {
    flex:1 1 auto !important;
    min-width:0 !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
  }
  .cz-faq-question > span:last-child {
    flex:0 0 auto !important;
    width:26px !important;
    text-align:center !important;
  }
  .cz-faq-answer {
    width:100% !important;
    max-width:100% !important;
    padding:0 0 18px !important;
    font-size:15.5px !important;
    line-height:1.75 !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
  }

  .cz-info-page a {
    max-width:100% !important;
  }
}