/* Dripha responsive v2 — desktop + tablet + mobile */
:root{--header-bg:#fbfaf7;--header-border:rgba(136,97,66,.10)}
html,body{max-width:100%;overflow-x:hidden}
body.menu-open{overflow:hidden}

/* Desktop header: brand/actions on first row, categories on a clean second row. */
@media (min-width:1001px){
  .site-header{background:rgba(251,250,247,.98)}
  .nav-wrap{min-height:auto;display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"brand spacer actions" "nav nav nav";column-gap:22px;row-gap:0;padding-top:12px;padding-bottom:0}
  .brand{grid-area:brand;width:112px;flex:none;align-self:center}
  .brand img{height:62px}
  .nav-actions{grid-area:actions;justify-self:end;align-self:center}
  .main-nav{grid-area:nav;width:100%;display:flex;justify-content:center;align-items:center;gap:clamp(16px,1.55vw,30px);overflow-x:auto;white-space:nowrap;scrollbar-width:none;border-top:1px solid var(--header-border);margin-top:10px;padding:0 4px}
  .main-nav::-webkit-scrollbar{display:none}
  .main-nav a{flex:0 0 auto;padding:14px 0 16px;font-size:12px}
  .main-nav a:after{bottom:9px}
  .menu-toggle{display:none!important}
}

/* Tablet/mobile header: compact top row + real dropdown menu. */
@media (max-width:1000px){
  .site-header{position:sticky;top:0}
  .nav-wrap{position:relative;min-height:74px;display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"brand actions toggle";gap:10px;padding-top:8px;padding-bottom:8px}
  .brand{grid-area:brand;width:82px;flex:none}
  .brand img{height:48px}
  .nav-actions{grid-area:actions;justify-self:end;gap:6px;min-width:0}
  .menu-toggle{grid-area:toggle;display:grid!important;place-items:center;width:42px;height:42px;border:1px solid rgba(136,97,66,.16);border-radius:14px;background:#fff;color:var(--brown);font-size:0;cursor:pointer;margin:0!important}
  .menu-toggle:before{content:"☰";font-size:22px;line-height:1}
  .menu-toggle[aria-expanded="true"]:before{content:"×";font-size:30px;font-weight:300}
  .main-nav{position:fixed!important;top:calc(74px + 27px);right:12px!important;left:12px!important;max-height:calc(100dvh - 120px);overflow:auto;display:none!important;flex-direction:column!important;align-items:stretch!important;gap:4px!important;padding:14px!important;border:1px solid #eee3d7!important;border-radius:22px!important;background:rgba(255,255,255,.985)!important;box-shadow:0 22px 70px rgba(50,32,20,.18)!important;z-index:2000}
  .main-nav.open{display:flex!important}
  .main-nav a{padding:11px 13px!important;border-radius:12px;font-size:12px!important}
  .main-nav a:hover{background:var(--beige)}
  .main-nav a:after{display:none!important}
}

@media (max-width:640px){
  .top-strip{font-size:10px;padding:6px 10px}
  .container{width:min(calc(100% - 24px),1180px)}
  .nav-wrap{min-height:66px;grid-template-columns:auto 1fr auto;gap:7px;padding-top:6px;padding-bottom:6px}
  .brand{width:70px}
  .brand img{height:43px}
  .nav-actions{gap:5px}
  .nav-actions .account-link,.nav-actions .cart-link{padding:7px 9px;font-size:9px;border-radius:12px;white-space:nowrap}
  .nav-actions .cart-link span{min-width:17px;height:17px;font-size:8px;margin-right:4px}
  .nav-actions .icon-link{display:none!important}
  .menu-toggle{width:38px;height:38px;border-radius:12px}
  .main-nav{top:93px!important;right:10px!important;left:10px!important;max-height:calc(100dvh - 110px);border-radius:18px!important}
}

/* Homepage slider: true aspect ratios instead of fixed pixel heights. */
.dripha-home-slider{height:auto!important;aspect-ratio:16/9;min-height:0!important;max-height:none!important;background:#eee7df}
.dripha-home-slide picture{display:block;width:100%;height:100%}
.dripha-home-slide img,.dripha-home-slide video,.dripha-slide-video{width:100%;height:100%;object-fit:cover;object-position:center center}
.dripha-home-slide[data-has-mobile="0"] img,.dripha-home-slide[data-has-mobile="0"] video{object-fit:cover}

@media (min-width:1600px){
  .dripha-home-slider{aspect-ratio:16/8.5}
}
@media (max-width:1000px){
  .dripha-home-slider{aspect-ratio:16/9}
  .dripha-video-logo{width:min(230px,28vw)!important}
}
@media (max-width:767px){
  .dripha-home-slider{aspect-ratio:4/5;background:#eee7df}
  .dripha-home-slide[data-has-mobile="1"] img,.dripha-home-slide[data-has-mobile="1"] video{object-fit:cover}
  .dripha-home-slide[data-has-mobile="0"] img,.dripha-home-slide[data-has-mobile="0"] video{object-fit:contain;background:#eee7df}
  .dripha-video-logo{width:min(180px,44vw)!important}
  .dripha-slider-dots{bottom:12px!important}
  .dripha-slider-arrow{display:none!important}
}

/* Keep commerce sections balanced on all widths. */
@media (min-width:1001px){
  .category-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .product-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (min-width:641px) and (max-width:1000px){
  .category-grid,.product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .section{padding:44px 0}
  .section-head{gap:12px;margin-bottom:22px}
  .section-head h2{font-size:23px;line-height:1.5}
  .section-head p{font-size:11px}
  .category-grid,.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .category-card{min-height:180px;border-radius:20px;padding:15px}
  .category-card h3{font-size:14px;line-height:1.7}
  .category-card .cat-index{font-size:36px}
  .product-image{aspect-ratio:1/1.05}
  .product-title{font-size:12px;line-height:1.7}
  .pattern-feature{border-radius:22px;padding:24px}
  .pattern-feature h2{font-size:25px;line-height:1.6}
  .feature-mark{height:155px}
  .feature-mark img{width:160px}
}

/* Avoid awkward full-width stretching on very large monitors. */
@media (min-width:1800px){
  .container{width:min(1500px,calc(100% - 72px))}
}