/* Shared mobile enhancement layer */
.mobile-nav-toggle{
  display:none;
  appearance:none;
  border:1.5px solid #d9c5b4;
  background:#fff7f0;
  color:#3b2417;
  border-radius:14px;
  width:46px;
  height:46px;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:background-color .2s ease,border-color .2s ease,color .2s ease,transform .15s ease;
  margin-left:auto;
}
.mobile-nav-toggle:hover,
.mobile-nav-toggle:focus-visible{
  background:#f3e3d7;
  border-color:#c8743d;
  outline:none;
}
.mobile-nav-toggle svg{width:22px;height:22px;display:block}
.mobile-only{display:none}
body.mobile-nav-active{overflow:hidden}

@media (max-width: 960px){
  .mobile-nav-toggle{display:inline-flex}
  .mobile-only{display:block}
  .top-bar{font-size:.8rem;padding:8px 12px}
  header{position:sticky}
  .nav-wrap{
    position:relative;
    gap:12px;
    padding:14px 0;
    flex-wrap:nowrap;
  }
  .logo img{height:42px}
  .nav-right{gap:12px}
  .nav-right .social-links{display:none}
  header nav{
    display:none;
    position:absolute;
    top:calc(100% + 10px);
    left:0;
    right:0;
    z-index:1001;
    background:#fff;
    border:1px solid #e6ddd2;
    border-radius:18px;
    box-shadow:0 18px 40px rgba(0,0,0,.12);
    padding:12px;
  }
  header.mobile-nav-open nav{display:block}
  header nav ul{
    flex-direction:column;
    align-items:stretch;
    gap:4px;
  }
  header nav li{width:100%}
  header nav a{
    width:100%;
    padding:12px 14px;
    border-radius:12px;
    font-size:1rem;
  }
  header nav a:hover,
  header nav a:focus-visible{
    background:#fbf3eb;
    color:#a95d2d;
    outline:none;
  }

  .hero{padding:20px 0 18px}
  .hero-grid,
  .story-grid,
  .cta-grid,
  .contact-grid,
  .two-column,
  .feature-grid,
  .brand-grid,
  .about-grid{
    grid-template-columns:1fr !important;
  }
  .hero-copy{padding:32px 22px !important}
  .hero h2{font-size:clamp(2rem,9vw,2.8rem) !important}
  .hero p{font-size:1rem !important}
  .hero-media,
  .hero-image{min-height:260px}
  .btn-row,
  .hero-btn-row,
  .cta-actions{
    display:flex;
    flex-direction:column;
    gap:12px;
  }
  .btn-row .btn,
  .hero-btn-row a,
  .cta-actions a,
  .btn-row a{
    width:100%;
    text-align:center;
  }

  .footer-grid{
    grid-template-columns:1fr !important;
    gap:24px !important;
    text-align:center;
  }
  .footer-links,
  .footer-social-wrap{
    justify-content:center;
  }

  .custom-form-grid,
  .contact-form-grid,
  .contact-grid-form{
    grid-template-columns:1fr !important;
    gap:14px !important;
  }
  .form-field,
  .form-field-full,
  .contact-form .form-field,
  .contact-form .form-field-full{
    width:100% !important;
    grid-column:auto !important;
  }
  input, select, textarea, button{
    font-size:16px !important;
  }
  textarea{min-height:140px}
  .cf-turnstile{
    max-width:100%;
    overflow-x:auto;
  }

  .shop-layout{
    grid-template-columns:1fr !important;
    gap:18px !important;
  }
  .shop-sidebar{
    position:static !important;
    top:auto !important;
    order:-1;
  }
  .filter-box{
    padding:18px !important;
    border-radius:18px !important;
  }
  .filter-actions{
    display:grid !important;
    grid-template-columns:1fr 1fr;
    gap:10px !important;
  }
  .filter-actions .mini-btn,
  .filter-actions button,
  .filter-actions a{
    width:100%;
    justify-content:center;
  }
  .product-grid-shop{
    grid-template-columns:1fr !important;
    gap:16px !important;
  }
  .shop-card{
    border-radius:18px !important;
    overflow:hidden;
  }
  .shop-card-body{padding:16px !important}
  .shop-card h4{font-size:1.15rem !important}
  .shop-card-actions,
  .shop-modal-actions{
    display:flex !important;
    flex-direction:column !important;
    gap:10px !important;
  }
  .shop-card .mini-btn,
  .shop-modal-actions .mini-btn{
    width:100% !important;
    justify-content:center;
  }
  .shop-modal{
    padding:0 !important;
  }
  .shop-modal-content{
    width:100vw !important;
    max-width:none !important;
    min-height:100dvh;
    max-height:100dvh !important;
    border-radius:0 !important;
    margin:0 !important;
    overflow-y:auto !important;
    padding:20px 16px 24px !important;
  }
  .shop-modal-body{
    grid-template-columns:1fr !important;
    gap:16px !important;
  }
  .shop-modal-image{
    width:100% !important;
    max-height:42vh !important;
    object-fit:cover;
    border-radius:16px !important;
  }
  .shop-modal-meta{
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;
  }
  .shop-inline-cart-tools,
  .shop-cart-tools{
    display:flex;
    flex-direction:column;
    gap:10px;
    align-items:stretch !important;
  }
  .shop-inline-cart-tools > *,
  .shop-cart-tools > *{
    width:100%;
    text-align:center;
    justify-content:center;
  }

  .cart-page-shell{
    grid-template-columns:1fr !important;
    gap:16px !important;
  }
  .cart-items-panel,
  .cart-summary-panel{
    padding:18px !important;
    border-radius:18px !important;
  }
  .cart-line{
    grid-template-columns:76px minmax(0,1fr) !important;
    gap:12px !important;
    padding:14px 0 !important;
  }
  .cart-line-media img{
    width:76px !important;
    height:76px !important;
    object-fit:cover;
    border-radius:14px !important;
  }
  .cart-line-total{
    grid-column:2 !important;
    margin-top:4px;
    text-align:left !important;
  }
  .cart-qty-row{
    gap:8px !important;
  }
  .cart-qty-row button,
  .cart-qty-row .mini-btn{
    min-height:40px;
  }

  .gallery-grid,
  .gallery-cards,
  .materials-grid,
  .featured-grid,
  .faq-grid,
  .collection-grid,
  .card-grid{
    grid-template-columns:1fr !important;
  }
}

@media (max-width: 640px){
  .container{width:min(100%, 92%) !important}
  section{padding-left:0 !important;padding-right:0 !important}
  .hero-copy{padding:26px 18px !important}
  .hero-media,
  .hero-image{min-height:220px}
  .section-heading h2,
  .section-title,
  main h2{
    font-size:clamp(1.6rem,8vw,2.2rem) !important;
    line-height:1.12 !important;
  }
  .top-bar{font-size:.76rem}
  .nav-right a{font-size:1.15rem !important}
  .filter-actions{grid-template-columns:1fr !important}
  .shop-modal-meta{grid-template-columns:1fr !important}
  .cart-line{
    grid-template-columns:1fr !important;
  }
  .cart-line-media img{
    width:100% !important;
    height:auto !important;
    max-width:140px;
  }
  .cart-line-total{grid-column:auto !important}
}

@media (prefers-reduced-motion: reduce){
  .mobile-nav-toggle,
  header nav,
  .shop-modal-content{
    transition:none !important;
  }
}