/* Responsive layer — 6″ phones (~320px) through 32″ monitors (~3840px); layout only */

:root{
  --bp-admin-sidebar: 980px;
  --bp-tablet: 720px;
  --bp-phone: 480px;
  --bp-narrow: 320px;
}

html{
  overflow-x:clip;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

body{
  overflow-x:clip;
  min-width:0;
  font-size:clamp(14px, 0.32vw + 13px, 17px);
}

/* Prevent flex/grid children from forcing horizontal scroll */
.container,
.container--wide,
.site-main,
.admin-main,
.header-inner,
.hero-inner,
.panel,
.panel-body,
.pdp,
.pdp-card,
.cart-item-body,
.contact-layout,
.form-card,
.form-inner,
.collection-browse-layout,
.collection-browse-main,
.admin-reports-panel,
.admin-bulk-toolbar,
.vx-invoice-panel,
.section-home-badge,
.section-home-badge .products-grid--home-matrix{
  min-width:0;
}

/* Long strings (order nos, emails, URLs) */
.admin-reports-table td,
.checkout-confirmation-order-no,
.admin-order-pending-no,
.cart-item-main .name,
.contact-text,
.policy-faq-question span,
.table td{
  overflow-wrap:anywhere;
  word-break:break-word;
}

/* Shared admin / checkout form grids (no layout in site.css) */
.form-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:14px 16px;
}

img,
video,
svg,
canvas{
  max-width:100%;
}

.site-main,
.admin-main{
  min-width:0;
}

/* —— Admin drawer nav (hamburger ≤980px; sidebar slides in) —— */
.admin-menu-btn{
  display:none;
  place-items:center;
  width:44px;
  height:44px;
  padding:0;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.04);
  color:rgba(255,255,255,.9);
  cursor:pointer;
}
.admin-menu-btn svg{
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.65;
  stroke-linecap:round;
}

.admin-table-scroll{
  width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
  scrollbar-color:var(--admin-scrollbar-thumb, rgba(201,162,39,.48)) var(--admin-scrollbar-track, rgba(255,255,255,.05));
}
.admin-table-scroll::-webkit-scrollbar{
  height:8px;
}
.admin-table-scroll::-webkit-scrollbar-thumb{
  border-radius:999px;
}

@media (max-width: 1200px){
  .admin-filter-more{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
  .admin-filter-card--sort{
    grid-column:1 / -1;
  }
}

@media (max-width: 1100px){
  .admin-board-head,
  .admin-products-board-head{
    display:none;
  }
  .admin-board-card-grid,
  .admin-product-card-grid{
    grid-template-columns:1fr 1fr !important;
    gap:12px 14px;
  }
  .admin-board-card-main,
  .admin-product-card-main{
    grid-column:1 / -1;
  }
  .admin-board-card-actions,
  .admin-board-cell--actions,
  .admin-board-cell--adjust,
  .admin-product-card-actions{
    grid-column:1 / -1;
    padding-top:4px;
    border-top:1px solid rgba(255,255,255,.08);
  }
  .admin-board-card-actions .admin-row-actions,
  .admin-product-card-actions .admin-row-actions{
    justify-content:flex-start;
  }
  .admin-board-cell[data-label]::before,
  .admin-product-card-tag::before,
  .admin-product-card-group::before,
  .admin-product-card-price::before,
  .admin-product-card-stock::before,
  .admin-product-card-shop::before{
    display:block;
    margin-bottom:4px;
    font-size:10px;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:rgba(255,255,255,.42);
    content:attr(data-label);
  }
  .admin-body[data-admin-theme="light"] .admin-board-cell[data-label]::before,
  .admin-body[data-admin-theme="light"] .admin-product-card-tag::before,
  .admin-body[data-admin-theme="light"] .admin-product-card-group::before,
  .admin-body[data-admin-theme="light"] .admin-product-card-price::before,
  .admin-body[data-admin-theme="light"] .admin-product-card-stock::before,
  .admin-body[data-admin-theme="light"] .admin-product-card-shop::before{
    color:var(--admin-muted);
  }
  .admin-board-price,
  .admin-product-card-price .admin-product-price{
    text-align:left;
  }
  .admin-board-cell--center,
  .admin-product-card-shop{
    justify-content:flex-start;
  }
}

@media (max-width: 720px){
  .admin-catalog-filters{
    margin:0 10px 12px;
    padding:12px 14px;
  }
  .admin-filter-bar-head{
    flex-direction:column;
    align-items:stretch;
  }
  .admin-filter-bar-badge{
    flex-direction:row;
    align-items:baseline;
    justify-content:center;
    gap:6px;
    min-width:0;
    padding:8px 12px;
  }
  .admin-filter-bar-badge-of{
    margin-top:0;
    text-transform:none;
    letter-spacing:0;
    font-size:12px;
  }
  .admin-filter-search{
    flex-direction:column;
  }
  .admin-filter-search-btn{
    width:100%;
  }
  .admin-filter-quick{
    grid-template-columns:1fr;
  }
  .admin-filter-more{
    grid-template-columns:1fr;
  }
  .admin-filter-card--sort{
    grid-column:auto;
  }
  .admin-catalog-hero{
    padding:14px;
  }
  .admin-catalog-stats{
    width:100%;
  }
  .admin-catalog-stat{
    flex:1;
    min-width:0;
  }
  .admin-board,
  .admin-products-board{
    padding:10px;
  }
  .admin-board-frame,
  .admin-product-frame{
    width:56px;
    height:68px;
  }
  .admin-board-card-grid,
  .admin-product-card-grid{
    grid-template-columns:1fr !important;
  }
  .admin-row-actions{
    flex-wrap:wrap;
  }
  .admin-row-actions .btn{
    flex:1;
    min-width:calc(50% - 4px);
    justify-content:center;
  }
}

/* —— Large desktops & 32″ monitors —— */
@media (min-width: 1200px){
  :root{
    --container: 1180px;
  }
}

@media (min-width: 1400px){
  :root{
    --container: 1240px;
    --container-wide: 1360px;
  }

  .admin-main{
    padding:clamp(18px, 1.6vw, 32px) clamp(18px, 2vw, 40px);
  }
}

@media (min-width: 1680px){
  :root{
    --container: 1280px;
    --container-wide: 1400px;
  }
}

@media (min-width: 1920px){
  :root{
    --container: 1320px;
    --space-gutter: clamp(24px, 2vw, 56px);
  }

  .admin-shell{
    max-width:2200px;
    margin-inline:auto;
  }
}

@media (min-width: 2560px){
  :root{
    --container: 1420px;
    --container-wide: 1520px;
    --space-gutter: clamp(28px, 1.6vw, 64px);
  }

  .admin-shell{
    max-width:2400px;
  }

  .hero-inner{
    max-width:min(720px, 52vw);
  }
}

@media (min-width: 3200px){
  :root{
    --container: 1480px;
    --container-wide: 1580px;
  }

  .admin-shell{
    max-width:2600px;
  }
}

/* —— Tablet landscape & small laptops —— */
@media (max-width: 1100px){
  .section-head{
    flex-wrap:wrap;
    align-items:flex-start;
    gap:12px;
  }

  .panel-head{
    flex-wrap:wrap;
    align-items:flex-start;
  }

  .grid-4,
  .collection-groups-grid{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }
  .lookbook-grid--matrix,
  .products-grid--home-matrix,
  .products-grid--badge-matrix{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }

  .pdp-related-grid{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }

  .gallery-thumbs{
    grid-template-columns:repeat(4, minmax(0, 1fr));
  }
}

/* —— Tablet portrait (admin sidebar → drawer nav) —— */
@media (max-width: 980px){
  .admin-shell{
    grid-template-columns:1fr;
  }

  .admin-sidebar{
    display:none;
  }

  .admin-body.admin-nav-open{
    overflow:hidden;
  }

  .admin-body.admin-nav-open .admin-sidebar{
    display:block;
    position:fixed;
    top:var(--admin-header-offset, 64px);
    left:0;
    bottom:0;
    width:min(280px, 88vw);
    z-index:29;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    box-shadow:12px 0 40px rgba(0,0,0,.35);
  }

  .admin-page-nav{
    padding:8px var(--space-gutter);
    gap:6px 10px;
    font-size:13px;
  }
  .admin-page-back{
    padding:6px 8px;
    font-size:13px;
  }
  .admin-page-nav-current{
    max-width:42vw;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .admin-header-inner{
    gap:8px;
    padding:8px 0;
    flex-wrap:nowrap;
  }

  .admin-header .brand-logo,
  .admin-header .brand-logo--admin{
    --admin-logo-size:40px;
  }

  .admin-brand{
    gap:8px;
    min-width:0;
  }

  .admin-brand span{
    font-size:13px;
    max-width:28vw;
  }

  .admin-actions{
    flex-wrap:nowrap;
    gap:6px;
  }

  .admin-menu-btn{
    display:grid;
  }

  .admin-actions .btn{
    padding:8px 12px;
    font-size:12px;
  }

  .admin-actions .admin-theme-toggle{
    min-width:0;
    padding-inline:10px;
    font-size:11px;
  }

  .admin-main{
    padding:14px var(--space-gutter) 24px;
  }

  .panel-head > div:first-child{
    min-width:0;
    flex:1 1 220px;
  }

  .kpi{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .table{
    min-width:640px;
  }

  .story-page-people-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .admin-main .panel-body:has(> .table){
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }

  .form-card .form-inner{
    grid-template-columns:1fr;
  }

  .form-side{
    padding:18px 16px;
  }

  .contact-layout{
    grid-template-columns:1fr;
    gap:28px;
  }

  .contact-info{
    display:grid;
    gap:18px;
  }

  .section-contact .contact-text,
  .contact-item--stacked .contact-text{
    max-width:none;
    line-height:1.65;
    word-break:break-word;
  }

  .admin-order-series-stats{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px 16px;
  }

  .admin-orders-tools{
    grid-template-columns:1fr;
  }

  .admin-order-pending-top{
    flex-direction:column;
    align-items:stretch;
  }

  .admin-order-pending-top .admin-order-status-form{
    width:100%;
  }

  .checkout-confirmation-order-id{
    padding:14px 16px;
  }
}

/* —— Large phones —— */
@media (max-width: 720px){
  :root{
    --space-gutter: clamp(12px, 4vw, 20px);
  }

  .site-header .brand-logo{
    width:clamp(56px, 14vw, 80px);
    height:clamp(56px, 14vw, 80px);
  }

  .admin-header .brand-logo,
  .admin-header .brand-logo--admin{
    --admin-logo-size:36px;
    width:var(--admin-logo-size);
    height:var(--admin-logo-size);
    max-width:var(--admin-logo-size);
    max-height:var(--admin-logo-size);
  }

  .hero-nav .brand-logo{
    width:clamp(104px, 28vw, 140px);
    height:auto;
  }
  .header-inner--hero .brand--hero{
    min-width:0;
    max-width:min(140px, 38vw);
    align-items:flex-start;
  }

  .admin-brand span{
    font-size:clamp(11px, 3vw, 13px);
    max-width:36vw;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .admin-actions{
    justify-content:flex-end;
    flex-wrap:nowrap;
    gap:6px;
  }

  .panel-body{
    padding:14px 12px;
  }

  .panel-head{
    padding:14px 12px;
  }

  .btn,
  .admin-link,
  .nav-link,
  .icon-btn,
  .menu-btn,
  .admin-menu-btn{
    min-height:44px;
  }

  .icon-btn{
    width:44px;
    height:44px;
  }

  .story-loom-heritage-mark{
    display:none;
  }

  .story-loom-ribbon-quote{
    font-size:clamp(14px, 3.8vw, 17px);
  }

  .auth-tabs{
    grid-template-columns:1fr;
  }

  .auth-tab{
    padding:12px 10px;
  }

  .checkout-steps{
    gap:8px;
  }

  .checkout-step{
    font-size:12px;
    padding:8px 12px;
  }

  .checkout-payment-grid{
    grid-template-columns:1fr;
  }

  .checkout-details-row{
    grid-template-columns:1fr;
    gap:4px;
  }

  .cart-item-body{
    align-items:flex-start;
  }

  .cart-item-side{
    width:100%;
    justify-content:space-between;
  }

  .cart-actions-body{
    flex-direction:column;
    align-items:stretch;
  }

  .cart-actions-body .btn{
    width:100%;
    justify-content:center;
  }

  .grid-4,
  .collection-groups-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
  }
  .lookbook-grid--matrix,
  .products-grid--home-matrix,
  .products-grid--badge-matrix{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
  }

  .gallery-thumbs{
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:8px;
    padding:10px;
  }

  .pdp-related-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .page-head{
    padding-top:8px;
  }

  .page-title{
    font-size:clamp(22px, 5.5vw, 28px);
  }

  .checkout-confirmation-order-no{
    font-size:clamp(18px, 4.8vw, 24px);
    word-break:break-word;
  }

  .admin-order-pending-body{
    grid-template-columns:1fr;
  }

  .admin-order-pending-details{
    grid-template-columns:1fr;
    gap:12px;
    padding:14px;
  }

  .admin-order-pending-detail{
    grid-template-columns:1fr;
    gap:4px;
  }

  .admin-order-pending-actions{
    flex-direction:row;
    flex-wrap:wrap;
    min-width:0;
    width:100%;
  }

  .admin-order-pending-actions form,
  .admin-order-pending-actions .btn{
    width:auto;
    flex:1 1 calc(50% - 5px);
  }

  .admin-order-series-actions .btn{
    width:100%;
    justify-content:center;
  }

  .form-grid{
    grid-template-columns:1fr;
  }

  .modal{
    padding:12px;
    align-items:flex-end;
  }

  .modal-card{
    width:100%;
    max-width:none;
    border-radius:18px 18px 0 0;
  }
}

/* —— Small phones (~6″) —— */
@media (max-width: 480px){
  :root{
    --space-gutter: clamp(10px, 4.5vw, 16px);
  }

  .admin-header-inner{
    padding:8px 0;
    gap:6px;
  }

  .admin-header .brand-logo,
  .admin-header .brand-logo--admin{
    --admin-logo-size:32px;
  }

  .admin-brand span{
    max-width:32vw;
    font-size:12px;
  }

  .admin-actions .btn-ghost{
    display:none;
  }

  .kpi{
    grid-template-columns:1fr;
  }

  .kpi-val{
    font-size:20px;
  }

  .table th,
  .table td{
    padding:8px 8px;
    font-size:12px;
  }

  .panel-title{
    font-size:16px;
  }

  .panel-sub{
    font-size:12px;
  }

  .section-title{
    font-size:clamp(22px, 6vw, 28px);
  }

  .story-page-people-grid{
    grid-template-columns:1fr;
  }

  .form-actions{
    flex-direction:column;
    align-items:stretch !important;
  }

  .form-actions .btn{
    width:100%;
    justify-content:center;
  }

  .pdp-actions{
    flex-direction:column;
  }

  .pdp-actions .btn{
    width:100%;
    justify-content:center;
  }

  .auth-card{
    border-radius:16px;
  }

  .auth-panel{
    padding:18px 16px;
  }

  .auth-title{
    font-size:24px;
  }

  .grid-4,
  .collection-groups-grid,
  .lookbook-grid--matrix,
  .products-grid--home-matrix,
  .products-grid--badge-matrix,
  .products-grid,
  .products-grid--catalog,
  .pdp-related-grid{
    grid-template-columns:1fr;
  }

  .gallery-thumbs{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }

  .admin-order-series-stats{
    grid-template-columns:1fr;
  }

  .footer-banner-tagline{
    font-size:clamp(22px, 6.5vw, 30px);
  }

  .checkout-payment-buttons{
    flex-direction:column;
    align-items:stretch;
  }

  .checkout-payment-buttons .btn{
    width:100%;
    justify-content:center;
  }

  .story-panel,
  .cart-page-panel{
    padding:16px 14px;
  }
}

@media (max-width: 360px){
  .admin-brand span{
    display:none;
  }

  .hero-nav .nav-link,
  .mobile-nav .nav-link{
    font-size:13px;
  }

  .story-loom-chapters{
    padding:16px 14px;
  }

  .h1{
    font-size:clamp(24px, 7vw, 30px);
  }

  .h1-script{
    font-size:clamp(44px, 12vw, 52px);
  }

  .hero-banner{
    min-height:440px;
  }

  .contact-text{
    font-size:14px;
  }

  .admin-order-pending-no{
    font-size:18px;
    word-break:break-word;
  }

  .checkout-confirmation-title{
    font-size:clamp(22px, 6.5vw, 28px);
  }
}

/* —— Mid-size phones & small tablets (6″–7″ portrait) —— */
@media (min-width: 481px) and (max-width: 767px){
  .contact-layout{
    gap:24px;
  }

  .checkout-confirmation-hero{
    text-align:left;
  }
}

/* —— Large laptops (15″–17″) —— */
@media (min-width: 1101px) and (max-width: 1399px){
  .products-grid,
  .products-grid--catalog{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }
  .collection-groups-grid{
    grid-template-columns:repeat(4, minmax(0, 1fr));
  }
  .products-grid--home-matrix,
  .products-grid--badge-matrix{
    grid-template-columns:repeat(4, minmax(0, 1fr));
  }
}

/* —— Wide desktop (24″–27″) —— */
@media (min-width: 1600px) and (max-width: 1919px){
  :root{
    --container: 1260px;
    --container-wide: 1380px;
  }
}

/* —— Safe areas (notched phones) —— */
@supports (padding: max(0px, env(safe-area-inset-left))){
  .whatsapp-fab{
    right:max(16px, env(safe-area-inset-right));
    bottom:max(16px, env(safe-area-inset-bottom));
  }

  .site-main,
  .admin-main{
    padding-bottom:max(0px, env(safe-area-inset-bottom));
  }
}

@media (max-width: 980px){
  .policy-nav-mobile{
    display:block;
    position:sticky;
    top:72px;
    z-index:6;
  }
  .policy-nav--desktop{
    display:none;
  }
  .policy-layout{
    grid-template-columns:1fr;
    gap:20px;
  }
  .policy-contact-card{
    grid-template-columns:1fr;
    align-items:start;
  }
  .policy-contact-actions{
    justify-content:flex-start;
  }
}

/* —— Admin reports, bulk tools, RBAC —— */
@media (max-width: 1100px){
  .admin-reports-range-bar{
    grid-template-columns:auto 1fr auto;
    grid-template-areas:
      "prev copy next"
      "date date date";
  }
  .admin-reports-range-bar > a:first-child{ grid-area:prev; }
  .admin-reports-range-copy{ grid-area:copy; min-width:0; }
  .admin-reports-range-bar > a:nth-child(3),
  .admin-reports-range-bar > span:nth-child(3){ grid-area:next; }
  .admin-reports-date-form{
    grid-area:date;
    width:100%;
    justify-content:flex-start;
  }
  .admin-reports-date-label .input{
    flex:1;
    min-width:0;
    width:100%;
  }
  .admin-groups-picker{
    flex-direction:column;
    align-items:stretch;
  }
  .admin-groups-picker-field,
  .admin-groups-picker-select{
    min-width:0;
    max-width:none;
    width:100%;
  }
  .rbac-access-wrap{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }
  .rbac-access-table{
    min-width:640px;
  }
}

@media (max-width: 720px){
  .admin-reports-period-nav{
    flex-wrap:nowrap;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    gap:6px;
    padding-bottom:4px;
    margin-inline:calc(-1 * var(--space-gutter));
    padding-inline:var(--space-gutter);
    scroll-snap-type:x proximity;
  }
  .admin-reports-period-link{
    flex:0 0 auto;
    scroll-snap-align:start;
    white-space:nowrap;
  }
  .admin-reports-head-actions{
    width:100%;
  }
  .admin-reports-head-actions .btn{
    flex:1 1 auto;
    justify-content:center;
  }
  .admin-reports-range-title{
    font-size:clamp(16px, 4.5vw, 20px);
  }
  .admin-reports-partial-pill{
    margin-left:0;
    margin-top:6px;
    display:inline-flex;
  }
  .admin-reports-stat-value{
    font-size:clamp(18px, 5vw, 22px);
  }
  .admin-reports-chart-col{
    min-width:22px;
  }
  .admin-reports-chart-label{
    font-size:9px;
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .admin-bulk-toolbar{
    padding:14px;
  }
  .admin-bulk-upload-form{
    flex-direction:column;
    align-items:stretch;
  }
  .admin-bulk-upload-file,
  .admin-bulk-upload-mode{
    flex:1 1 auto;
    min-width:0;
    width:100%;
  }
  .admin-bulk-toolbar-actions .btn{
    flex:1 1 calc(50% - 4px);
    justify-content:center;
  }
  .admin-products-search-top,
  .admin-products-search-stats,
  .admin-groups-picker-stats{
    flex-direction:column;
    align-items:stretch;
  }
  .admin-products-search-field,
  .admin-products-search-stats,
  .admin-groups-picker-stats{
    min-width:0;
    width:100%;
  }
  .admin-order-series-actions .btn,
  .admin-order-delete-all-form .btn{
    width:100%;
    justify-content:center;
  }
  .admin-order-no-edit{
    width:100%;
  }
  .admin-order-no-input{
    flex:1;
    max-width:none;
  }
  .vx-inv-page-actions{
    width:100%;
  }
  .vx-inv-page-actions .btn{
    flex:1 1 auto;
    justify-content:center;
  }
}

@media (max-width: 480px){
  .admin-reports-range-bar{
    grid-template-columns:1fr 1fr 1fr;
    grid-template-areas:
      "copy copy copy"
      "prev next date";
    gap:10px;
  }
  .admin-reports-range-copy{
    text-align:center;
  }
  .admin-reports-date-form{
    flex-wrap:wrap;
    justify-content:center;
  }
  .admin-reports-date-form .btn,
  .admin-reports-date-form a.btn{
    flex:1 1 calc(50% - 4px);
    justify-content:center;
  }
  .admin-bulk-toolbar-actions{
    flex-direction:column;
  }
  .admin-bulk-toolbar-actions .btn{
    width:100%;
  }
}

/* —— Storefront: hero, cart, checkout, contact, collections —— */
@media (max-width: 980px){
  .hero-actions .btn{
    min-height:44px;
  }
  .hero-slider-btn{
    width:44px;
    height:44px;
  }
  .section-head .btn{
    flex-shrink:0;
  }
  .footer-banner-inner{
    padding-inline:var(--space-gutter);
  }
  .collection-group-hero{
    min-height:clamp(200px, 42vw, 320px);
  }
  .collection-page-header{
    gap:12px;
  }
  .modal-head{
    flex-wrap:wrap;
  }
  .upi-grid{
    grid-template-columns:1fr;
    justify-items:center;
    text-align:center;
  }
  .upi-qr{
    justify-items:center;
  }
}

@media (max-width: 720px){
  .cart-summary-body{
    flex-direction:column;
    align-items:stretch;
  }
  .cart-summary-total{
    white-space:normal;
    font-size:clamp(18px, 5vw, 22px);
  }
  .cart-item-qty-form{
    width:100%;
    justify-content:space-between;
  }
  .cart-item-remove-btn{
    flex:1 1 auto;
    justify-content:center;
  }
  .cart-order-head{
    flex-direction:column;
    align-items:flex-start;
  }
  .checkout-steps{
    gap:6px;
  }
  .checkout-step{
    flex:1 1 calc(50% - 6px);
    text-align:center;
    justify-content:center;
  }
  .checkout-details-row dd{
    text-align:left;
  }
  .contact-item{
    gap:12px;
  }
  .contact-title-script{
    font-size:clamp(36px, 10vw, 44px);
  }
  .pdp-card h2{
    font-size:clamp(20px, 5.5vw, 24px);
  }
  .pdp-breadcrumbs{
    font-size:12px;
    line-height:1.5;
  }
  .lookbook-hero-body .btn{
    width:100%;
    justify-content:center;
  }
}

@media (max-width: 480px){
  .hero-banner{
    min-height:clamp(440px, 88vh, 560px);
  }
  .hero-inner{
    min-height:280px;
    padding-bottom:56px;
  }
  .hero-actions{
    width:100%;
  }
  .hero-actions .btn{
    width:100%;
    justify-content:center;
  }
  .contact-item{
    flex-direction:column;
    align-items:flex-start;
  }
  .contact-icon{
    width:40px;
    height:40px;
  }
  .contact-form .btn{
    width:100%;
    justify-content:center;
  }
  .cart-item-side{
    flex-direction:column;
    align-items:stretch;
  }
  .cart-item-price{
    text-align:left;
  }
  .cart-item-price .price--sale{
    justify-content:flex-start;
  }
  .checkout-confirmation-hero{
    padding:18px 16px;
  }
  .section-contact{
    padding-top:28px;
  }
}

/* —— Ultra-narrow phones (~5″) —— */
@media (max-width: 320px){
  :root{
    --space-gutter:10px;
  }
  .site-header .brand-logo{
    width:48px;
    height:48px;
  }

  .admin-header .brand-logo,
  .admin-header .brand-logo--admin{
    --admin-logo-size:30px;
    width:var(--admin-logo-size);
    height:var(--admin-logo-size);
    max-width:var(--admin-logo-size);
    max-height:var(--admin-logo-size);
  }

  .hero-nav .brand-logo{
    width:clamp(88px, 26vw, 112px);
    height:auto;
  }
  .header-inner--hero .brand--hero{
    min-width:0;
    max-width:min(112px, 42vw);
    align-items:flex-start;
  }
  .btn,
  .admin-link{
    padding-inline:10px;
    font-size:12px;
  }
  .section-title,
  .page-title{
    font-size:20px;
  }
  .admin-reports-period-link{
    padding:7px 10px;
    font-size:12px;
  }
  .cart-item-qty-input{
    width:44px;
  }
}

/* —— Phone landscape (short viewport) —— */
@media (max-height: 500px) and (orientation: landscape){
  .hero-banner{
    min-height:100vh;
  }
  .hero-inner{
    min-height:220px;
    padding-top:72px;
    padding-bottom:48px;
  }
  body.page-home .hero-inner{
    padding-top:72px;
  }
  .hero-features-wrap{
    margin-top:16px;
  }
  .features.hero-features{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    padding:16px;
    gap:12px;
  }
  .whatsapp-fab{
    width:48px;
    height:48px;
    right:12px;
    bottom:12px;
  }
  .modal{
    align-items:center;
    padding:8px;
  }
  .modal-card{
    max-height:calc(100vh - 16px);
    overflow:auto;
    border-radius:16px;
  }
  .auth-card{
    max-height:calc(100vh - 24px);
    overflow:auto;
  }
}

/* —— Tablets & small laptops (768px–1100px) —— */
@media (min-width: 768px) and (max-width: 1100px){
  .lookbook-grid--matrix,
  .products-grid--home-matrix,
  .products-grid--badge-matrix,
  .section-home-badge .products-grid--home-matrix{
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:16px;
  }
  .collection-groups-grid{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }
  .products-grid--catalog{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }
  .pdp-related-grid{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }
  .contact-layout{
    gap:32px;
  }
  .form-card .form-inner{
    grid-template-columns:1fr;
  }
}

/* —— Standard laptops (13″–15″) —— */
@media (min-width: 1101px) and (max-width: 1599px){
  .products-grid,
  .products-grid--catalog{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }
  .collection-groups-grid,
  .lookbook-grid--matrix,
  .products-grid--home-matrix,
  .products-grid--badge-matrix{
    grid-template-columns:repeat(4, minmax(0, 1fr));
  }
}

/* —— Large desktops & 24″ monitors —— */
@media (min-width: 1920px){
  .site-main > .section,
  .site-main > section{
    max-width:100%;
  }
  .hero-inner{
    max-width:min(600px, 38vw);
  }
  .footer-grid{
    width:min(var(--container-wide), calc(100% - (var(--space-gutter) * 2)));
    margin-inline:auto;
  }
  .story-layout,
  .contact-layout{
    gap:clamp(32px, 3vw, 64px);
  }
  .story-page-hero{
    display:flex;
    justify-content:center;
  }
  .story-page-hero-inner{
    gap:0;
    width:100%;
    max-width:min(100%, 2400px);
    min-height:clamp(560px, 56vh, 720px);
    max-height:min(780px, 76vh);
    overflow:hidden;
  }
  .story-page-hero-copy,
  .story-page-hero-media{
    max-height:min(780px, 76vh);
  }
  .story-page-hero-media img{
    object-position:center 42%;
  }
  .story-page-feather img{
    object-position:center 38%;
  }
  .pdp{
    gap:clamp(16px, 2vw, 32px);
  }
  .admin-reports-chart{
    min-height:200px;
  }
  .admin-reports-chart-col{
    min-width:32px;
  }
}

/* —— 27″ QHD & 32″ UHD monitors —— */
@media (min-width: 2560px){
  .products-grid,
  .products-grid--catalog,
  .pdp-related-grid{
    grid-template-columns:repeat(4, minmax(0, 1fr));
  }
  .collection-groups-grid,
  .lookbook-grid--matrix,
  .products-grid--home-matrix,
  .products-grid--badge-matrix,
  .section-home-badge .products-grid--home-matrix{
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:clamp(20px, 1.2vw, 28px);
  }
  .grid-4{
    grid-template-columns:repeat(4, minmax(0, 1fr));
  }
  .hero-banner{
    min-height:clamp(720px, 72vh, 900px);
  }
  .story-page-hero-inner{
    min-height:clamp(580px, 52vh, 760px);
    max-height:min(860px, 72vh);
  }
  .story-page-hero-copy,
  .story-page-hero-media{
    max-height:min(860px, 72vh);
  }
  .story-page-hero-copy .story-title-main{
    font-size:clamp(28px, 1.35vw, 36px);
  }
  .story-page-hero-copy .story-title-script{
    font-size:clamp(52px, 2.35vw, 66px);
  }
  .story-page-hero-logo{
    width:min(148px, 5.8vw);
  }
  .story-page-legacy .container--wide,
  .story-page-journey .container--wide,
  .story-page-letter .container--wide{
    width:min(1440px, calc(100% - (var(--space-gutter) * 2)));
  }
  .section{
    padding-top:clamp(38px, 2.5vw, 52px);
  }
  .panel-body,
  .admin-main{
    font-size:16px;
  }
  .table th,
  .table td{
    padding:12px 14px;
  }
}

@media (min-width: 3200px){
  :root{
    --container: 1480px;
    --container-wide: 1580px;
    --space-gutter: clamp(32px, 1.4vw, 72px);
  }
  body{
    font-size:17px;
  }
  .story-page-hero-inner{
    max-width:min(100%, 2800px);
    min-height:clamp(620px, 50vh, 800px);
    max-height:min(920px, 68vh);
  }
  .story-page-hero-copy,
  .story-page-hero-media{
    max-height:min(920px, 68vh);
  }
  .story-page-legacy .container--wide,
  .story-page-journey .container--wide,
  .story-page-letter .container--wide{
    width:min(1580px, calc(100% - (var(--space-gutter) * 2)));
  }
  .site-header,
  .admin-header{
    backdrop-filter:blur(12px);
  }
  .hero-inner{
    max-width:min(680px, 34vw);
  }
  .footer-banner-tagline{
    font-size:clamp(28px, 1.6vw, 36px);
  }
  .admin-shell{
    max-width:2800px;
  }
  .kpi{
    gap:16px;
  }
}

@media (max-width: 560px){
  .policy-hero{
    padding-top:24px;
    padding-bottom:22px;
  }
  .policy-title-main{
    font-size:30px;
  }
  .policy-hero-head{
    gap:14px;
  }
  .policy-hero-icon{
    width:44px;
    height:44px;
    border-radius:14px;
  }
  .policy-hero-icon svg{
    width:20px;
    height:20px;
  }
  .policy-section{
    padding:18px 16px 18px 20px;
  }
  .policy-section-head{
    flex-direction:column;
    gap:6px;
  }
  .policy-faq-question{
    grid-template-columns:auto minmax(0, 1fr) auto;
    gap:10px;
    padding:14px 14px;
    font-size:15px;
  }
  .policy-faq-answer{
    padding:0 14px 14px 14px;
  }
  .policy-contact-card{
    padding:20px 18px;
  }
  .policy-contact-actions{
    flex-direction:column;
  }
  .policy-contact-actions .btn{
    width:100%;
    justify-content:center;
  }
}

/* —— Fresh from the loom & badge home sections (4×2 matrix, 6″–32″) —— */
.section-home-badge .products-grid--home-matrix > .product-card--catalog{
  min-width:0;
}

@media (min-width: 3200px){
  .section-home-badge .products-grid--home-matrix{
    gap:clamp(22px, 0.9vw, 32px);
  }
  .section-home-badge .product-card-copy{
    padding:clamp(14px, 0.8vw, 18px) clamp(14px, 0.8vw, 18px) 0;
  }
  .section-home-badge .product-card-body{
    padding:0 clamp(14px, 0.8vw, 18px) clamp(14px, 0.8vw, 20px);
  }
}

@media (min-width: 2560px){
  .section-home-badge{
    padding-bottom:clamp(12px, 1vw, 24px);
  }
  .section-home-badge .products-grid--home-matrix{
    gap:clamp(18px, 1vw, 26px);
  }
  .section-home-badge .section-title{
    font-size:clamp(22px, 0.9vw, 26px);
  }
  .section-home-badge .product-card .name{
    font-size:clamp(14px, 0.45vw + 13px, 16px);
  }
  .section-home-badge .price{
    font-size:clamp(14px, 0.4vw + 13px, 16px);
  }
}

@media (min-width: 1920px){
  .section-home-badge .products-grid--home-matrix{
    gap:clamp(18px, 1.1vw, 24px);
  }
  .section-home-badge .section-head{
    margin-bottom:clamp(14px, 1vw, 20px);
  }
}

@media (min-width: 1200px) and (max-width: 1919px){
  .section-home-badge .products-grid--home-matrix{
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:clamp(16px, 1.2vw, 22px);
  }
}

@media (min-width: 900px) and (max-width: 1100px){
  .section-home-badge .products-grid--home-matrix{
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:14px;
  }
  .section-home-badge .product-card-copy{
    padding:12px 12px 0;
  }
  .section-home-badge .product-card-body{
    padding:0 12px 14px;
  }
  .section-home-badge .product-card .name{
    font-size:13px;
  }
  .section-home-badge .product-card-desc{
    font-size:12px;
    -webkit-line-clamp:2;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }
  .section-home-badge .product-card-view{
    font-size:11px;
    padding:6px 9px;
  }
}

@media (min-width: 768px) and (max-width: 899px){
  .section-home-badge .products-grid--home-matrix{
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:14px;
  }
}

@media (min-width: 481px) and (max-width: 767px){
  .section-home-badge .products-grid--home-matrix{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
  }
  .section-home-badge .product-card-foot{
    flex-wrap:wrap;
    gap:8px;
  }
  .section-home-badge .product-card-price{
    flex:1 1 100%;
  }
  .section-home-badge .product-card-actions{
    width:100%;
    justify-content:space-between;
  }
  .section-home-badge .product-card .name{
    font-size:13px;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }
  .section-home-badge .product-card-desc{
    font-size:12px;
    -webkit-line-clamp:2;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }
}

@media (max-width: 720px){
  .section-home-badge{
    padding-top:clamp(24px, 6vw, 32px);
  }
  .section-home-badge .section-head{
    flex-direction:column;
    align-items:stretch;
    gap:10px;
    margin-bottom:12px;
  }
  .section-home-badge .section-head > div{
    min-width:0;
  }
  .section-home-badge .section-head .btn{
    width:100%;
    justify-content:center;
    min-height:44px;
  }
  .section-home-badge .section-sub{
    font-size:11px;
    font-weight:700;
    letter-spacing:.1em;
    text-transform:uppercase;
    color:rgba(185,133,42,.92);
  }
  .section-home-badge .section-title{
    font-size:clamp(20px, 5.2vw, 26px);
    line-height:1.15;
    overflow-wrap:anywhere;
  }
  .section-home-badge .product-card-copy{
    padding:12px 12px 0;
  }
  .section-home-badge .product-card-body{
    padding:0 12px 14px;
  }
  .section-home-badge .product-card-foot{
    margin-top:10px !important;
    padding-top:10px;
    align-items:center;
  }
  .section-home-badge .product-card-cart-btn{
    width:44px;
    height:44px;
    min-width:44px;
  }
  .section-home-badge .product-card-view{
    min-height:40px;
    padding:8px 12px;
    display:inline-flex;
    align-items:center;
  }
  .section-home-badge .thumb.thumb--photo .badge,
  .section-home-badge .card .thumb.thumb--photo .badge{
    left:10px;
    bottom:10px;
    padding:6px 8px;
    font-size:10px;
  }
}

@media (max-width: 480px){
  .section-home-badge .products-grid--home-matrix{
    grid-template-columns:1fr;
    gap:14px;
  }
  .section-home-badge .product-card--catalog{
    max-width:min(100%, 420px);
    margin-inline:auto;
    width:100%;
  }
  .section-home-badge .product-card .name{
    font-size:15px;
    display:block;
    -webkit-line-clamp:unset;
    overflow:visible;
  }
  .section-home-badge .product-card-desc{
    -webkit-line-clamp:3;
  }
  .section-home-badge .product-card-foot{
    flex-direction:row;
    flex-wrap:nowrap;
    align-items:center;
  }
  .section-home-badge .product-card-price{
    flex:1 1 auto;
    min-width:0;
  }
  .section-home-badge .product-card-actions{
    flex:0 0 auto;
    width:auto;
  }
}

@media (max-width: 320px){
  .section-home-badge .section-title{
    font-size:20px;
  }
  .section-home-badge .product-card--catalog{
    max-width:none;
  }
  .section-home-badge .product-card-view{
    font-size:11px;
    padding:7px 10px;
  }
}

@media (max-height: 500px) and (orientation: landscape) and (max-width: 920px){
  .section-home-badge .products-grid--home-matrix{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:10px;
  }
  .section-home-badge .section-head{
    flex-direction:row;
    flex-wrap:wrap;
    align-items:flex-end;
  }
  .section-home-badge .section-head .btn{
    width:auto;
    flex:0 0 auto;
  }
}

/* —— Pagination + checkout + PDP zoom (plan responsive pass) —— */
.collection-pagination,
.admin-pagination{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:12px;
  margin-top:22px;
  padding-bottom:8px;
}
.collection-pagination-meta,
.admin-pagination-meta{
  font-size:13px;
  color:var(--muted);
}

@media (max-width: 720px){
  .checkout-address-grid,
  .form-card .form-fields{
    gap:10px;
  }
  .pdp-zoom-toolbar{
    padding:10px 12px;
    gap:8px;
  }
  .pdp-zoom-close,
  .pdp-zoom-nav{
    min-width:44px;
    min-height:44px;
  }
  .pdp-zoom-panel{
    width:100%;
    max-width:none;
    border-radius:0;
    min-height:100dvh;
  }
}

@media (max-width: 720px){
  .table.admin-dash-recent-table thead{
    display:none;
  }
  .table.admin-dash-recent-table,
  .table.admin-dash-recent-table tbody,
  .table.admin-dash-recent-table tr,
  .table.admin-dash-recent-table td{
    display:block;
    width:100%;
    min-width:0;
  }
  .table.admin-dash-recent-table tr{
    margin-bottom:12px;
    padding:12px;
    border:1px solid var(--admin-border, rgba(27,27,27,.12));
    border-radius:14px;
    background:var(--admin-surface, rgba(255,255,255,.62));
  }
  .table.admin-dash-recent-table td{
    padding:6px 0;
    border:none;
    text-align:left;
  }
  .table.admin-dash-recent-table td::before{
    content:attr(data-label);
    display:block;
    font-size:11px;
    font-weight:700;
    letter-spacing:.6px;
    text-transform:uppercase;
    color:var(--admin-muted, rgba(27,27,27,.55));
    margin-bottom:2px;
  }
  .table.admin-audit-table thead{
    display:none;
  }
  .table.admin-audit-table,
  .table.admin-audit-table tbody,
  .table.admin-audit-table tr,
  .table.admin-audit-table td{
    display:block;
    width:100%;
    min-width:0;
  }
  .table.admin-audit-table tr{
    margin-bottom:12px;
    padding:12px;
    border:1px solid var(--admin-border, rgba(27,27,27,.12));
    border-radius:14px;
    background:var(--admin-surface, rgba(255,255,255,.62));
  }
  .table.admin-audit-table td{
    padding:6px 0;
    border:none;
    text-align:left;
  }
  .table.admin-audit-table td::before{
    content:attr(data-label);
    display:block;
    font-size:11px;
    font-weight:700;
    letter-spacing:.6px;
    text-transform:uppercase;
    color:var(--admin-muted, rgba(27,27,27,.55));
    margin-bottom:2px;
  }
}

@media (max-width: 480px){
  .admin-actions .admin-theme-toggle{
    display:none;
  }
  .admin-header-inner .admin-brand span{
    max-width:30vw;
  }
  .admin-actions{
    gap:4px;
  }
  .admin-actions .btn-gold{
    padding-inline:12px;
    font-size:12px;
  }
}

/* —— Home hero nav + hero copy: tablet & mobile alignment —— */
@media (max-width: 980px){
  .header-inner--hero{
    display:grid;
    grid-template-columns:minmax(0, 1fr) auto;
    align-items:start;
    justify-content:stretch;
    gap:8px 12px;
    padding:clamp(8px, 1.4vw, 12px) 0 clamp(6px, 1vw, 10px);
  }

  .header-inner--hero .brand--hero{
    min-width:0;
    max-width:min(168px, 36vw);
    align-items:flex-start;
    justify-self:start;
  }

  .hero-nav .brand-logo{
    width:100%;
    max-width:min(168px, 36vw);
    height:auto;
    object-position:left top;
  }

  .header-inner--hero .header-actions{
    align-self:start;
    margin-left:0;
    padding-top:4px;
    gap:6px;
    flex-shrink:0;
  }

  .hero-nav .icon-btn,
  .hero-nav .menu-btn{
    width:38px;
    height:38px;
  }

  body.page-home .hero-inner{
    padding-top:clamp(128px, 28vw, 168px);
    align-items:flex-start;
    width:100%;
    max-width:none;
  }

  .hero-copy,
  .hero-copy--luxury{
    width:100%;
    max-width:100%;
  }

  .hero-banner .container{
    width:min(var(--container-wide), calc(100% - (var(--space-gutter) * 2)));
  }

  .hero-actions{
    justify-content:flex-start;
    flex-wrap:wrap;
    gap:10px;
  }
}

@media (max-width: 768px){
  .header-inner--hero .brand--hero{
    max-width:min(148px, 34vw);
  }

  .hero-nav .brand-logo{
    max-width:min(148px, 34vw);
  }

  body.page-home .hero-inner{
    padding-top:clamp(118px, 30vw, 152px);
  }

  .hero-banner{
    min-height:clamp(480px, 82vh, 680px);
  }
}

@media (max-width: 720px){
  .header-inner--hero .brand--hero{
    max-width:min(132px, 32vw);
  }

  .hero-nav .brand-logo{
    max-width:min(132px, 32vw);
  }

  body.page-home .hero-inner{
    padding-top:clamp(108px, 32vw, 140px);
  }
}

@media (max-width: 480px){
  .header-inner--hero{
    gap:6px 8px;
    padding:6px 0 4px;
  }

  .header-inner--hero .brand--hero{
    max-width:min(116px, 30vw);
  }

  .hero-nav .brand-logo{
    max-width:min(116px, 30vw);
  }

  .header-inner--hero .icon-btn,
  .header-inner--hero .menu-btn{
    width:36px;
    height:36px;
  }

  body.page-home .hero-inner{
    padding-top:clamp(96px, 30vw, 124px);
    min-height:260px;
  }

  .hero-banner .hero-copy--luxury .lead{
    max-width:100%;
  }
}

@media (max-width: 320px){
  .header-inner--hero .brand--hero{
    max-width:min(100px, 32vw);
  }

  .hero-nav .brand-logo{
    max-width:min(100px, 32vw);
  }

  body.page-home .hero-inner{
    padding-top:clamp(88px, 28vw, 108px);
  }
}

@media (prefers-reduced-motion: reduce){
  html{
    scroll-behavior:auto;
  }

  *,
  *::before,
  *::after{
    animation-duration:0.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.01ms !important;
  }
}