/* Golden OS V11.13 — mobile-first visual refinement */
@media (max-width:700px){
  html{scroll-padding-top:104px}
  body.store-page{padding-bottom:76px}
  .store-page .agro-loader{display:none!important}

  /* Header: compact, app-like, not a shrunk desktop header */
  .store-page .topbar{background:color-mix(in srgb,var(--bg2) 96%,transparent);backdrop-filter:saturate(115%);-webkit-backdrop-filter:saturate(115%)}
  .store-page .nav{padding:9px 0 10px;gap:8px}
  .store-page .brand{min-width:0}
  .store-page .brand img{width:34px;height:34px}
  .store-page .brand strong{font-size:13px;white-space:nowrap}
  .store-page .brand small{font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:170px}
  .store-page .theme-toggle{width:40px;min-height:40px;border-radius:12px}
  .store-page #cartBtn{width:auto;min-width:78px;min-height:40px;border-radius:12px;padding:7px 10px}
  .store-page .searchbar{height:44px;border-radius:14px;background:var(--panel);box-shadow:none}
  .store-page .searchbar input{height:42px;font-size:15px}

  /* Hero: one strong message, no oversized illustration on phones */
  .store-page .hero{padding:12px 0 4px}
  .store-page .hero-grid{display:block}
  .store-page .agri-hero{display:block!important;padding:22px 18px!important;border-radius:20px!important;min-height:0!important;background:linear-gradient(145deg,var(--accent-soft),var(--panel))!important}
  .store-page .agri-hero:before{display:none!important}
  .store-page .agri-hero-copy{width:100%}
  .store-page .agri-hero .eyebrow{font-size:10px}
  .store-page .agri-hero h1{font-size:28px!important;line-height:1.32;margin:8px 0 8px;max-width:310px}
  .store-page .agri-hero p{font-size:12px!important;margin-bottom:15px;line-height:1.75}
  .store-page .hero-actions{gap:8px}
  .store-page .hero-actions .btn{min-height:42px;font-size:12px;border-radius:12px}
  .store-page .agri-hero-visual{display:none!important}
  .store-page .agri-hero-topics{display:flex;overflow:auto;gap:7px;margin-top:14px;padding-bottom:2px;scrollbar-width:none}
  .store-page .agri-hero-topics::-webkit-scrollbar{display:none}
  .store-page .agri-hero-topics span{flex:0 0 auto;font-size:9px;padding:5px 8px}
  .store-page .hero-side{grid-template-columns:1fr 1fr!important;gap:8px;margin-top:10px}
  .store-page .hero-side .mini-card{display:block;padding:12px;border-radius:15px;min-height:94px}
  .store-page .hero-side .mini-icon{width:32px;height:32px;margin-bottom:8px;border-radius:10px}
  .store-page .hero-side .mini-card b{font-size:12px;line-height:1.5}
  .store-page .hero-side .mini-card div>span{display:none}
  .store-page .hero-side .mini-card em{font-size:10px;margin-top:5px}

  /* Trust bar: lightweight horizontal rail */
  .store-page .trust-strip{width:100%;padding:10px 14px 12px;gap:8px;border-bottom:0;overflow:auto;scrollbar-width:none}
  .store-page .trust-strip::-webkit-scrollbar{display:none}
  .store-page .trust-item{flex:0 0 auto;min-width:auto!important;display:flex!important;align-items:center!important;text-align:right!important;gap:6px;padding:7px 10px;border:1px solid var(--line);border-radius:999px;background:var(--panel)}
  .store-page .trust-item>span{display:flex}
  .store-page .trust-item>span svg{width:16px;height:16px}
  .store-page .trust-item b{font-size:10px;margin:0;white-space:nowrap}
  .store-page .trust-item small{display:none}

  /* Global section rhythm */
  .store-page .section{padding:17px 0}
  .store-page .section-head{margin-bottom:12px;align-items:flex-end}
  .store-page .section-head h2{font-size:20px;margin:2px 0}
  .store-page .section-head p{font-size:11px;line-height:1.6;max-width:260px}
  .store-page .section-head .eyebrow{font-size:9px}
  .store-page .section-link{font-size:10px;padding:6px 0}

  /* Department cards become a horizontal chooser instead of 3 tall rows */
  .store-page .department-grid{display:flex!important;overflow-x:auto;gap:9px;padding:2px 1px 6px;scroll-snap-type:x proximity;scrollbar-width:none}
  .store-page .department-grid::-webkit-scrollbar{display:none}
  .store-page .department-card{flex:0 0 178px;min-height:90px;padding:12px!important;border-radius:16px;scroll-snap-align:start;align-items:center;flex-wrap:nowrap!important}
  .store-page .department-icon{width:36px;height:36px;flex:0 0 36px}
  .store-page .department-icon svg{width:20px;height:20px}
  .store-page .department-copy b{font-size:12px!important}
  .store-page .department-copy small{font-size:9px;line-height:1.45;margin-top:3px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

  /* What do you need? becomes compact swipeable cards */
  .store-page .need-grid{display:flex!important;overflow-x:auto;gap:9px;padding:2px 1px 6px;scroll-snap-type:x proximity;scrollbar-width:none}
  .store-page .need-grid::-webkit-scrollbar{display:none}
  .store-page .need-card{flex:0 0 148px;min-height:112px!important;padding:13px!important;border-radius:16px;scroll-snap-align:start;gap:5px;text-align:right}
  .store-page .need-card span{font-size:24px}
  .store-page .need-card b{font-size:12px!important}
  .store-page .need-card small{font-size:9px!important;line-height:1.45}

  /* Featured/new/best/recommended: rails, not repeated full 2-col sections */
  .store-page .spotlight-section .section-head p{display:none}
  .store-page .spotlight-products{display:flex!important;overflow-x:auto;gap:11px;padding:2px 1px 8px;scroll-snap-type:x proximity;scrollbar-width:none}
  .store-page .spotlight-products::-webkit-scrollbar{display:none}
  .store-page .spotlight-products>.product-card{flex:0 0 min(72vw,270px);scroll-snap-align:start}

  /* Product cards: shorter, cleaner, readable */
  .store-page #products .products,.store-page #productsGrid.products{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .store-page .product-card{border-radius:15px}
  .store-page .product-img{aspect-ratio:1/1!important;padding:5px!important}
  .store-page .product-card-tools{inset-block-start:7px;inset-inline-end:7px;gap:5px}
  .store-page .pc-tool{width:31px;height:31px;border-radius:9px;font-size:15px;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  .store-page .product-body{padding:10px!important}
  .store-page .product-category{font-size:9px!important;margin-bottom:3px}
  .store-page .product-body h3{font-size:12px!important;line-height:1.5;min-height:36px!important;margin-bottom:6px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
  .store-page .price{font-size:14px!important}
  .store-page .product-meta{padding-top:9px!important;gap:6px!important;margin-top:7px!important}
  .store-page .product-meta .stock{font-size:9px!important}
  .store-page .product-meta .btn{min-height:36px!important;padding:7px 8px!important;font-size:10px!important;border-radius:10px}
  .store-page .tag{font-size:8px!important;padding:3px 5px!important}

  /* Footer: keep trust/contact information, remove excessive vertical bulk on phones */
  .store-page .footer{margin-top:18px;padding-bottom:76px}
  .store-page .footer-hero-inner{padding-block:18px}
  .store-page .footer-hero-inner img{width:40px;height:40px}
  .store-page .footer-hero-inner strong{font-size:17px}
  .store-page .footer-hero-inner span{font-size:10px}
  .store-page .footer-grid{gap:14px;padding-block:18px}
  .store-page .footer-about p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:11px;line-height:1.75}
  .store-page .footer-subtitle{display:none}
  .store-page .footer-col h3{font-size:13px;margin-bottom:9px}
  .store-page .contact-card,.store-page .social-card{padding:9px;border-radius:10px;margin-bottom:7px}
  .store-page .footer-bottom{padding:14px 0;font-size:10px}

  /* Bottom app navigation */
  .store-page .mobile-store-nav{padding:6px 6px max(7px,env(safe-area-inset-bottom));background:color-mix(in srgb,var(--bg2) 97%,transparent);box-shadow:0 -8px 24px rgb(0 0 0 / .08)}
  .store-page .mobile-nav-item{min-height:50px;border-radius:12px}
  .store-page .mobile-nav-item b{font-size:9px}
  .store-page .mobile-nav-icon svg{width:20px;height:20px}

  /* AI panel must feel like a phone sheet, not a desktop floating window */
  .store-page .ai-customer-panel{inset-inline:8px!important;bottom:72px!important;height:min(72dvh,620px)!important;border-radius:20px!important}
  .store-page .ai-panel-head{padding:12px!important}
  .store-page .ai-chat{padding:11px!important}
  .store-page .ai-msg span{font-size:12px!important;line-height:1.65}
  .store-page .ai-quick{gap:6px;padding:8px 10px}
  .store-page .ai-quick button{font-size:9px;padding:7px 9px}
  .store-page .ai-customer-fab{bottom:76px!important;inset-inline-end:10px!important}
}

@media (max-width:390px){
  .store-page .shell{width:calc(100% - 20px)}
  .store-page .agri-hero h1{font-size:25px!important}
  .store-page .hero-side .mini-card{padding:10px;min-height:86px}
  .store-page .department-card{flex-basis:164px}
  .store-page .need-card{flex-basis:138px}
  .store-page .spotlight-products>.product-card{flex-basis:74vw}
  .store-page .product-body{padding:9px!important}
  .store-page .product-body h3{font-size:11px!important}
  .store-page .price{font-size:13px!important}
}
