/* Mobile bar hidden by default on desktop */
.mob-bar { display: none; }

/* Filter toggle hidden on desktop */
.filt-toggle { display: none; }
.filt-close { display: none; }

/* Nav close button hidden on desktop */
.sh-nav-close { display: none; }

/* Prevent long words / URLs from breaking mobile layouts */
p, li, td, h1, h2, h3, h4,
.pdp-desc, .acc-body, .tab-panel,
.edu-txt, .rv-text, .ts-desc,
.entry-content, .woocommerce-product-details__short-description {
  overflow-wrap: break-word;
  word-break: break-word;
}

/* iOS safe area — respect notch and home bar */
body {
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
}
.ft-bot {
  padding-bottom: max(16px, env(safe-area-inset-bottom));
}

/* ≤1024px */
@media (max-width:1024px) {
  .hero { grid-template-columns:1fr 380px; min-height:480px; }
  .hero-left { padding:48px 0 48px 32px; }
  .hero-img { margin:24px 20px 24px -32px; }
  .prod-g4 { grid-template-columns:repeat(3,1fr); }
  .rev-g4 { grid-template-columns:repeat(2,1fr); }
  .edu-g3 { grid-template-columns:repeat(2,1fr); }
  .pdp { gap:32px; padding:24px; }
  .chk-before-form { grid-template-columns:1fr; padding:18px 16px 0; }
  .chk-body { grid-template-columns:1fr; padding:16px 16px 40px; gap:12px; }
  .chk-aside { position:static; order:-1; }
  /* Touch devices — no hover, so always show add-to-cart bar */
  .ts-inner { grid-template-columns:repeat(2,1fr); }
  .pc-acts { transform:translateY(0); }
  .pc:hover { transform:none; }
}


  /* Account — narrow sidebar at medium widths */
  .acc-wrap { grid-template-columns: 200px 1fr; gap: 20px; padding: 20px; }

/* Mobile labels — hidden everywhere except inside the 768px media query below */
.acc-orders-row .mobile-label { display: none; }

/* ≤768px */
@media (max-width:768px) {
  .hero { grid-template-columns:1fr; min-height:auto; padding:0; }
  .hero-left { padding:48px 24px; text-align:center; align-items:center; }
  .hero-over { justify-content:center; }
  .hero-img { display:none; }
  .hero__mobile-cta { display:inline-flex; margin-top:24px; }
  .hero-letter { display:none; }
  .hero-proof { justify-content:center; }

  /* Trust strip — 1 column, each item full width */
  .ts-inner { grid-template-columns:1fr !important; --trust-cols:1 !important; }
  .ts-item { width:100%; }

  .prod-sec { padding:32px 16px; }
  .prod-g4 { grid-template-columns:repeat(2,1fr); gap:12px; }
  .rev-sec { padding:40px 16px; }
  .rev-g4 { grid-template-columns:1fr; }

  /* Education — 1 column */
  .edu { padding:32px 16px; }
  .edu-g3 { grid-template-columns:1fr; margin-top:24px; }

  .shop-wrap { grid-template-columns:1fr; padding:16px; }
  .filt { display:none; position:static; }
  .filt.is-open {
    display:flex;
    flex-direction:column;
    position:fixed;
    inset:0;
    z-index:140;
    background:var(--bg);
    padding:24px;
    padding-top:56px;
    overflow-y:auto;
  }
  .filt-close {
    display:flex; align-items:center; justify-content:center;
    position:absolute; top:14px; right:14px; z-index:1;
    width:36px; height:36px; border-radius:50%;
    background:var(--c-p500); border:none;
    font-size:16px; color:#fff; cursor:pointer;
    transition:background .15s;
  }
  .filt-close:hover { background:var(--c-p600); }
  .filt-toggle {
    display:flex;
    align-items:center;
    gap:8px;
    padding:10px 18px;
    background:var(--c-p50);
    border:1px solid var(--bdr);
    border-radius:999px;
    font-size:13px;
    font-weight:600;
    color:var(--c-p500);
    cursor:pointer;
    font-family:var(--fb);
    margin-bottom:16px;
  }
  .shop-sort { flex-direction:column; align-items:flex-start; gap:8px; }
  .shop-sort select, .woocommerce-ordering select, select.orderby { width:100%; }
  .shop-g3, ul.products, ul.products.columns-4, ul.products.columns-3 { grid-template-columns:repeat(2,1fr) !important; gap:12px; padding:0 16px; }
  .pdp { grid-template-columns:1fr; padding:16px; gap:24px; }
  .pdp-gal { position:static; }

  /* Gallery thumbnails — horizontal scroll */
  .pdp-thumbs { overflow-x:auto; -webkit-overflow-scrolling:touch; scroll-snap-type:x mandatory; padding-bottom:4px; }
  .pdp-thumb { flex-shrink:0; scroll-snap-align:start; width:60px; height:60px; }

  /* ATC form — stack qty + button on narrow screens */
  .pdp-info form.cart,
  div.product form.cart { flex-wrap:wrap; }
  .pdp-info .single_add_to_cart_button,
  div.product .single_add_to_cart_button { width:100%; justify-content:center; }

  /* Bulk discount — stack tiers on mobile */
  .bulk-discount-strip__tiers { flex-wrap:wrap; }
  .bulk-discount-strip__tier { flex:1 1 auto; min-width:calc(50% - 4px); }

  /* Trust row — tighter on mobile */
  .pdp-trust { gap:8px 14px; }
  .pdp-ti { font-size:11px; }

  /* Tabs — scrollable row, smaller gap */
  .tabs-list { gap:16px; overflow-x:auto; -webkit-overflow-scrolling:touch; flex-wrap:nowrap; }
  .tab { white-space:nowrap; flex-shrink:0; }

  /* Review cards — tighter padding on mobile */
  .rv-light { padding:14px 16px; }
  .rv-light .rv-av { width:28px; height:28px; font-size:11px; }

  /* Review form — full-width, readable */
  .rv-form .comment-form input[type="text"],
  .rv-form .comment-form input[type="email"],
  .rv-form .comment-form textarea { font-size:16px; } /* prevents iOS zoom on focus */
  .rv-form .comment-form p.stars a { width:32px; height:32px; } /* larger touch target */
  .rv-form .comment-form p.stars a::before { font-size:20px; }

  /* Accordions — slightly more padding for touch */
  .pdp-accs .acc-trig { padding:16px 0; font-size:14px; min-height:48px; }

  /* Hide desktop sticky ATC bar on mobile (mobile bar handles it) */
  .satc { display:none !important; }

  /* Related products — tighter padding */
  .single-product .prod-sec { padding:32px 16px; }
  .sh { padding:10px 16px; }
  .sh-nav { display:none; }
  .sh-nav.is-open {
    display:flex;
    position:fixed;
    inset:0;
    flex-direction:column;
    align-items:stretch;
    background:var(--bg);
    z-index:150;
    padding:80px 24px 32px;
    gap:4px;
    overflow-y:auto;
    text-align:left !important;
  }
  .sh-nav-close {
    position:absolute;
    top:20px;
    right:20px;
    width:44px;
    height:44px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:none;
    border:1px solid var(--bdr);
    border-radius:10px;
    font-size:22px;
    color:var(--tx);
    cursor:pointer;
    transition:background .15s, color .15s;
  }
  .sh-nav-close:hover { background:var(--bg-el); color:var(--c-p500); }
  .sh-nav.is-open .sh-nav-list {
    flex-direction:column;
    align-items:stretch;
    gap:4px;
  }
  .sh-nav.is-open .sh-nav-list .menu-item > a {
    font-size:18px;
    font-weight:600;
    padding:14px 16px;
    border-bottom:1px solid var(--bdr);
    display:block !important;
    width:100%;
    border-radius:8px;
    text-align:left !important;
    transition:background .15s;
  }
  .sh-nav.is-open .sh-nav-list .menu-item > a:hover,
  .sh-nav.is-open .sh-nav-list .menu-item > a:active { background:var(--c-n100); }
  .sh-nav.is-open .sh-nav-list .menu-item:last-child > a { border-bottom:none; }
  .sh-nav.is-open .sub-menu { display:flex !important; position:static; box-shadow:none; border:none; border-radius:0; padding:0 0 0 16px; min-width:0; flex-direction:column; gap:0; }
  .sh-nav.is-open .sub-menu a { font-size:15px; font-weight:500; padding:12px 16px; border-bottom:1px solid var(--bdr); border-radius:8px; color:var(--tx2); text-align:left !important; display:block !important; transition:background .15s; }
  .sh-nav.is-open .sub-menu a:hover,
  .sh-nav.is-open .sub-menu a:active { background:var(--c-n100); }
  .sh-nav.is-open .sub-menu li:last-child a { border-bottom:none; }
  .sh-nav.is-open .menu-item-has-children > a::before { display:none; }
  body.nav-open { overflow:hidden; }
  .sh-acts { display:none; }
  .sh-burger { display:flex; }
  .ft-bot { padding:16px; flex-direction:column; text-align:center; gap:10px; }
  .mc { width:100%; }
  .sec-hdr { flex-direction:column; align-items:flex-start; }
  .woocommerce-cart .woocommerce { padding:16px 16px 0; }
  .cart-main-row { grid-template-columns:1fr; }
  .woocommerce-cart .woocommerce-cart-form { grid-column:1; }
  .cart-collaterals { grid-column:1; position:static; }
  .cart_totals,.cart-aside { position:static; }
  .g-bc { margin-top:12px; }
  .cart-pg-title { font-size:22px; flex-wrap:wrap; word-break:normal; overflow-wrap:normal; }
  .cart-item-hdr { display:none; }
  .cart-row { grid-template-columns:64px 1fr; gap:10px; padding:14px 0; position:relative; }
  .cart-row:hover { margin:0; padding-left:0; padding-right:0; border-radius:0; background:none; }
  .cart-row-thumb { width:64px; height:64px; }
  .cart-row-info { grid-column:2; padding-right:24px; }
  /* Swap to mini-cart layout on mobile */
  .cart-item-hdr,
  .cart-row { display:none; }
  .cart-mobile-items { display:block; border:1px solid var(--bdr); border-radius:var(--r-lg); overflow:hidden; }
  .cart-mobile-items .mc-line { border-bottom:1px solid var(--bdr); }
  .cart-mobile-items .mc-line:last-child { border-bottom:none; }
  .cart-related-grid { grid-template-columns:repeat(2,1fr); gap:12px; }
  .chk-topbar { padding:12px 16px; }
  .chk-steps { padding:12px 16px; overflow-x:auto; }
  .woocommerce-checkout .woocommerce-info { margin:0 16px 12px; }
  .woocommerce-checkout .woocommerce-form-login { margin:0 16px 12px; }
  .chk-login-fields { grid-template-columns:1fr; }
  /* Single-column form fields on mobile */
  .chk-card .woocommerce-billing-fields__field-wrapper,
  .chk-card .woocommerce-shipping-fields__field-wrapper { grid-template-columns:1fr; }
  .chk-card #billing_first_name_field,
  .chk-card #billing_last_name_field,
  .chk-card #billing_postcode_field,
  .chk-card #billing_city_field,
  .chk-card #billing_email_field,
  .chk-card #billing_phone_field,
  .chk-card #shipping_first_name_field,
  .chk-card #shipping_last_name_field,
  .chk-card #shipping_postcode_field,
  .chk-card #shipping_city_field { grid-column:1/-1; }
  /* Breadcrumb mobile */
  .woocommerce-checkout .g-bc { padding:10px 16px 0; font-size:12px; }
  /* Sticky place-order on mobile */
  .chk-payment #payment div.place-order { position:sticky; bottom:0; background:var(--bg); border-top:1px solid var(--bdr); z-index:10; }
  .woocommerce-checkout { padding-bottom:0; }
  .contact-wrap { grid-template-columns:1fr; }
  .contact-card { position:static; }

  /* FAQ — mobile tweaks */
  .faq-wrap { padding:32px 16px 48px; }
  .faq-header { margin-bottom:32px; }
  .faq-question { font-size:14px; padding:14px 4px; }
  .faq-section-title { font-size:18px; }
  .faq-cta { padding:28px 20px; }

  /* Reviews page — mobile tweaks */
  .rvp { padding:32px 16px 48px; }
  .rvp-header { margin-bottom:28px; }
  .rvp-title { font-size:26px; }
  .rvp-overview { grid-template-columns:1fr; gap:0; }
  .rvp-score-block { align-items:center; text-align:center; padding:28px 20px; }
  .rvp-breakdown { width:100%; padding:24px 20px; }
  .rvp-bar-row { grid-template-columns:70px 1fr 36px; gap:8px; }
  .rvp-toolbar { flex-direction:column; align-items:flex-start; gap:10px; }
  .rvp-filters { overflow-x:auto; -webkit-overflow-scrolling:touch; flex-wrap:nowrap; padding-bottom:4px; width:100%; }
  .rvp-filter { flex-shrink:0; }
  .rvp-grid { grid-template-columns:repeat(2,1fr); gap:14px; }
  .rv-light { padding:16px; }

  /* Account — stack to single column */
  .acc-wrap { grid-template-columns:1fr; padding:16px; gap:16px; }
  .acc-nav { position:static; }
  .acc-nav-list { flex-direction:row; flex-wrap:wrap; gap:4px; padding:8px; }
  .acc-nav-item a { padding:8px 12px; font-size:13px; }
  .acc-nav-item a i { display:none; }
  .acc-nav-item.is-active a { border-left:none; border-radius:6px; }
  .acc-content { padding:20px; }
  /* Dashboard orders table — card layout on mobile (same pattern as WC orders page) */
  .acc-orders-table thead { display:none; }
  .acc-orders-table,
  .acc-orders-table tbody,
  .acc-orders-row,
  .acc-orders-row td { display:block; width:100%; }
  .acc-orders-row {
    border:1px solid var(--bdr);
    border-radius:var(--r-sm);
    padding:14px 16px;
    margin-bottom:10px;
  }
  .acc-orders-row td {
    padding:0;
    border:none;
    font-size:13px;
    margin-bottom:6px;
  }
  .acc-orders-row td:last-child { margin-bottom:0; }
  .acc-orders-row td[data-title]::before { display: none; }
  .acc-orders-row .mobile-label {
    display:block;
    font-size:10px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.06em;
    color:var(--txm);
    margin-bottom:2px;
  }
  .acc-orders-num a { font-size:15px; font-weight:700; }
  .acc-orders-act {
    margin-top:6px;
    padding-top:10px;
    border-top:1px solid var(--bdr);
  }
  .acc-orders-act td[data-title]::before { display:none; }
  .acc-orders-act .acc-btn-sm {
    width:100%;
    text-align:center;
    justify-content:center;
    height:36px;
    font-size:13px;
    display:flex;
  }
  .acc-content .woocommerce-Addresses { grid-template-columns:1fr; }
  .acc-addr-grid { grid-template-columns:1fr; }
  .acc-content .form-row-first,
  .acc-content .woocommerce-form-row--first,
  .acc-content .form-row-last,
  .acc-content .woocommerce-form-row--last { width:100%; margin-left:0; display:block; }
  .acc-stats { grid-template-columns:1fr; }

  /* Orders table — card layout on mobile */
  .acc-content .woocommerce-orders-table,
  .acc-content .woocommerce-orders-table thead,
  .acc-content .woocommerce-orders-table tbody,
  .acc-content .woocommerce-orders-table tr,
  .acc-content .woocommerce-orders-table th,
  .acc-content .woocommerce-orders-table td { display:block; width:100%; }
  .acc-content .woocommerce-orders-table thead { display:none; }
  .acc-content .woocommerce-orders-table tbody tr {
    border:1px solid var(--bdr);
    border-radius:var(--r-sm);
    padding:14px 16px;
    margin-bottom:10px;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:6px 12px;
    align-items:center;
  }
  .acc-content .woocommerce-orders-table tbody th,
  .acc-content .woocommerce-orders-table tbody td {
    padding:0;
    border:none;
    font-size:13px;
  }
  .acc-content .woocommerce-orders-table tbody th[data-title]::before,
  .acc-content .woocommerce-orders-table tbody td[data-title]::before {
    content:attr(data-title);
    display:block;
    font-size:10px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.06em;
    color:var(--txm);
    margin-bottom:2px;
  }
  /* Order number — top left, left-aligned */
  .acc-content .woocommerce-orders-table .woocommerce-orders-table__cell-order-number { grid-column:1; text-align:left; }
  .acc-content .woocommerce-orders-table .woocommerce-orders-table__cell-order-number a { font-size:15px; font-weight:700; }
  /* Date — top right */
  .acc-content .woocommerce-orders-table .woocommerce-orders-table__cell-order-date { grid-column:2; text-align:right; }
  .acc-content .woocommerce-orders-table .woocommerce-orders-table__cell-order-date::before { text-align:right; }
  /* Status — second row left */
  .acc-content .woocommerce-orders-table .woocommerce-orders-table__cell-order-status { grid-column:1; }
  /* Total — second row right, "voor X items" on new line */
  .acc-content .woocommerce-orders-table .woocommerce-orders-table__cell-order-total { grid-column:2; text-align:right; }
  .acc-content .woocommerce-orders-table .woocommerce-orders-table__cell-order-total::before { text-align:right; }
  .acc-content .woocommerce-orders-table .woocommerce-orders-table__cell-order-total .woocommerce-Price-amount { display:block; font-weight:600; }
  .acc-content .woocommerce-orders-table .woocommerce-orders-table__cell-order-total { font-size:11px; color:var(--txm); }
  /* Actions — full width */
  .acc-content .woocommerce-orders-table .woocommerce-orders-table__cell-order-actions {
    grid-column:1/-1;
    margin-top:6px;
    padding-top:10px;
    border-top:1px solid var(--bdr);
  }
  .acc-content .woocommerce-orders-table .woocommerce-orders-table__cell-order-actions::before { display:none; }
  .acc-content .woocommerce-orders-table .woocommerce-orders-table__cell-order-actions .button {
    width:100%;
    text-align:center;
    justify-content:center;
    height:36px;
    font-size:13px;
  }

  /* View order */
  .vo-header { flex-direction:column; gap:8px; }
  .vo-items-hdr { display:none; }
  .vo-items-row { grid-template-columns:1fr auto; gap:6px; }
  .vo-items-qty { text-align:left; }
  .vo-items-total { text-align:right; }
  .vo-actions { flex-direction:column; }
  .vo-actions .acc-btn-sm { text-align:center; }

  /* Mobile bottom bar */
  .mob-bar {
    display: flex;
    flex-direction: column;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 200;
    background: var(--bg);
    border-top: 1px solid var(--bdr);
    box-shadow: var(--sh-sm);
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  .mob-bar-nav {
    display: flex;
    justify-content: space-around;
    align-items: center;
    padding: 6px 0 4px;
  }
  .mob-bar-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    font-size: 10px;
    font-weight: 500;
    color: var(--tx2);
    text-decoration: none;
    padding: 4px 12px;
    min-height: 44px;
    justify-content: center;
    transition: color .15s;
    -webkit-tap-highlight-color: transparent;
  }
  .mob-bar-item i { font-size: 18px; }
  .mob-bar-item--active,
  .mob-bar-item:hover { color: var(--c-p500); }
  /* Cart item has an extra wrapper span for the badge — keep it inline so
     the icon + badge still appear as one row above the label text */
  .mob-bar-cart-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .mob-bar-badge {
    position: absolute;
    top: -5px;
    right: -8px;
    background: var(--c-a500);
    color: var(--c-p800);
    font-size: 9px;
    font-weight: 700;
    min-width: 16px;
    height: 16px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 3px;
  }
  .mob-bar-badge.is-hidden { display: none; }

  /* Sticky ATC row */
  .mob-bar-atc {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 16px;
    border-top: 1px solid var(--bdr);
    background: var(--bg);
  }
  .mob-bar-atc[hidden] { display: none; }
  .mob-bar-atc-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
    overflow: hidden;
  }
  .mob-bar-atc-name {
    font-size: 13px;
    font-weight: 600;
    color: var(--tx);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .mob-bar-atc-price { font-size: 13px; color: var(--c-p500); font-weight: 700; }
  .mob-bar-atc-btn {
    flex-shrink: 0;
    height: 44px;
    padding: 0 20px;
    font-size: 13px;
    white-space: nowrap;
  }

  /* Push page content above the bar */
  body { padding-bottom: 64px; }
}

/* ≤600px — account layout safety: stack before 768px if content too narrow */
@media (max-width:600px) {
  .acc-wrap { grid-template-columns: 1fr; padding: 12px; gap: 12px; }
  .acc-nav { position: static; }
}

/* ≤480px */
@media (max-width:480px) {
  .hero-left { padding:32px 16px; }
  .hero-h { font-size:clamp(24px, 7vw, 30px); }
  .prod-g4, ul.products, ul.products.columns-4, ul.products.columns-3 { grid-template-columns:1fr !important; }
  .pc-acts { transform:translateY(0); }
  .pc-acts .btn { font-size:13px; padding:10px 16px; }
  .pc:hover { transform:none; }
  .pdp-title { font-size:24px; }
  .pdp-atc { flex-direction:column; }
  .pdp-atc .btn { width:100%; }
  .pdp { padding:12px; gap:18px; }
  .pdp-main { border-radius:12px; }
  .pdp-thumb { width:52px; height:52px; }
  .pdp-price { font-size:20px; }
  .pdp-badges .badge { font-size:9px; height:20px; }
  .pdp-stock { font-size:12px; }
  .pdp-stock-low { font-size:11px; padding:2px 8px; }
  .pdp-qty-btn { width:40px; min-height:44px; font-size:18px; }
  .pdp-info form.cart .quantity input.qty,
  div.product form.cart .quantity input.qty { width:40px; height:42px; font-size:14px; }
  .pdp-info .single_add_to_cart_button,
  div.product .single_add_to_cart_button { height:44px; font-size:13px; }
  .rv-light { padding:12px 14px; }
  .rv-light .rv-av { width:24px; height:24px; font-size:10px; }
  .rv-light .rv-name { font-size:12px; }
  .rv-light .rv-body { font-size:12px; height:38.4px; }
  .acc-trig { font-size:13px; }
  .btn--lg { height:48px; padding:0 24px; font-size:15px; }
  .cart-related-grid { grid-template-columns:1fr !important; }
  .cart-row { grid-template-columns:48px 1fr; gap:8px; }
  .cart-row-thumb { width:48px; height:48px; }
  .cart-row-name { font-size:14px; }
  .cart-row-cat { font-size:9px; }
  .chk-steps .pg-step > span:last-child { display:none; }
  /* Trust — tighten padding on very small screens */
  .ts-item { padding:14px 16px; }
  .ts-icon { width:34px; height:34px; }

  /* Education — reduce padding */
  .edu-card { padding:20px; }

  /* Reviews page — single column on small screens */
  .rvp-grid { grid-template-columns:1fr; }
  .rvp-title { font-size:22px; }
  .rvp-score-num { font-size:40px; }
  .rvp-filter { padding:6px 12px; font-size:12px; }

  /* FAQ — compact on small screens */
  .faq-question { font-size:13px; }
  .faq-answer p { font-size:13px; }
  .faq-cta-btn { width:100%; justify-content:center; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
