/* SM FARMSS V22 — mobile/tablet layout refinements.
   Loaded last on each website page to preserve existing desktop design. */
*,*::before,*::after{box-sizing:border-box}
html{max-width:100%;scroll-padding-top:108px}
body{max-width:100%;margin:0;overflow-x:clip}
img,video,svg{max-width:100%}
.content-wrap,.store-layout,.feature-two-col,.contact-layout,.craft-grid,.intro-grid,.footer-top,.feature-home-card,.catalog-item,.store-card{min-width:0}
.reveal{max-width:100%}

/* Avoid spilling header/footer on narrow phones */
.footer-top{min-width:0}
.footer-top>*{min-width:0;max-width:100%}
.footer-brand,.footer-links,.footer-socials{min-width:0;max-width:100%;flex-wrap:wrap}
.footer-brand>span{min-width:0;overflow-wrap:anywhere}
.footer-links a{white-space:normal}
.footer-bottom{overflow-wrap:anywhere}
.feature-footer-links a{overflow-wrap:anywhere}

/* Tablet and below */
@media(max-width:1050px){
  .content-wrap{width:calc(100% - 44px)}
  .store-card{grid-template-columns:1fr}
  .store-photo{border-right:0;border-bottom:1px solid #ece7da}
  .store-photo .store-main-image{width:100%;height:270px;min-height:270px;object-fit:cover}
  .store-layout,.store-hero-grid{grid-template-columns:minmax(0,1fr)}
  .store-summary .summary-sticky{position:static}
  .mobile-menu{max-height:calc(100dvh - 108px);overflow-y:auto;overscroll-behavior:contain}
  .mobile-menu a{display:block;min-height:44px}
  .menu-button{min-width:44px;min-height:44px;cursor:pointer}
  .market-tiles{gap:15px}
}

@media(max-width:690px){
  .content-wrap{width:calc(100% - 34px)}
  .page-section{padding:48px 0}
  .main-header{padding:0 14px;height:76px;gap:8px}
  .brand-mark{min-width:0;gap:6px}
  .brand-mark img{width:53px;height:53px;flex:none}
  .brand-letters{font-size:12px;letter-spacing:.02em;white-space:nowrap}
  .brand-letters small{font-size:7px;letter-spacing:.09em;margin-top:4px}
  .nav-actions{gap:8px}
  .origin-pill{display:none}
  .mobile-menu{top:106px;max-height:calc(100dvh - 106px);padding:10px 17px 19px;border-radius:0 0 18px 18px}
  .mobile-menu a{padding:12px 14px;border-radius:12px}

  /* Hero typography respects compact phone heights. */
  .hero{height:min(690px,calc(100svh - 78px));min-height:565px}
  .hero-container{padding:22px 17px;min-width:0}
  .hero h1{font-size:clamp(44px,11.2vw,63px);line-height:1.06;overflow-wrap:normal}
  .hero-copy>p{font-size:12px;line-height:1.75}
  .hero-buttons{display:flex;flex-wrap:wrap;gap:13px}
  .hero-buttons .button{min-height:45px}
  .hero-proof{flex-wrap:wrap;gap:7px}
  .hero-bottom{padding:0 16px;gap:8px}
  .hero-controls{gap:6px}
  .hero-controls>button{min-width:35px;min-height:35px}
  .intro-right h2,.section-top h2,.craft-copy h2,.quote-band h2{font-size:clamp(30px,8.8vw,38px);line-height:1.13}
  .section-top,.markets-head{min-width:0}
  .section-top p,.section-side p{font-size:11px;line-height:1.75}
  .underlined-link{white-space:normal}

  /* Fruit scroller and markets */
  .fruit-scroller{overflow:hidden;width:100%;border-radius:18px}
  .fruit-track .fruit-card{width:clamp(194px,62vw,256px);flex:0 0 clamp(194px,62vw,256px);min-height:285px}
  .fruit-track .fruit-card-bottom strong{font-size:24px}
  .market-tiles{grid-template-columns:minmax(0,1fr)}
  .market-tile{min-height:325px;border-radius:22px}
  .tile-copy{padding:18px}
  .tile-copy h3{font-size:clamp(36px,10vw,46px)}
  .tile-copy p{font-size:11px;line-height:1.65}
  .craft-visual{min-height:270px}
  .craft-visual img{height:270px}
  .craft-label{max-width:calc(100% - 12px);overflow-wrap:anywhere}

  /* Shop form/checkout: controls remain tappable */
  .store-hero{padding:42px 0}
  .store-hero h1{font-size:clamp(36px,10vw,49px);line-height:1.15}
  .store-hero-badges{flex-wrap:wrap}
  .store-photo{padding:12px}
  .store-photo .store-main-image{height:220px;min-height:220px;border-radius:16px}
  .store-gallery{display:flex;flex-wrap:wrap;gap:8px}
  .store-gallery .thumb{height:50px;min-width:50px;border-radius:12px}
  .store-content{padding:17px}
  .store-title-line h2{font-size:29px}
  .unit-switch{display:flex;flex-wrap:wrap;gap:7px}
  .unit-btn{min-height:42px;padding:8px 12px}
  .qty-row{display:flex;flex-wrap:wrap;gap:8px}
  .qty-btn{min-width:42px;min-height:42px}
  .qty-input{width:68px;min-height:42px;font-size:16px}
  .line-total{width:100%;margin-left:0;min-width:0}
  .store-actions{display:flex;flex-direction:column;gap:9px}
  .store-actions .button{width:100%;min-height:44px;justify-content:center}
  .summary-sticky{position:static}
  .summary-send{width:100%;min-height:44px}
  .summary-list,.summary-note{overflow-wrap:anywhere}

  /* Catalog and tracking/reviews forms */
  .catalog-toolbar{gap:12px}
  .catalog-filter{gap:7px}
  .filter-btn{min-height:42px}
  .catalog-img{height:230px}
  .catalog-body h2{font-size:27px}
  .catalog-btns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .catalog-btns button,.catalog-btns a{min-height:44px;padding:10px 8px;overflow-wrap:anywhere}
  .feature-home-section{padding:43px 0}
  .feature-home-card{min-height:auto;padding:20px}
  .feature-home-card h3{font-size:25px}
  .feature-large-icon{margin:14px 0 10px}
  .feature-hero{padding:42px 0}
  .feature-hero h1{font-size:clamp(35px,9.4vw,47px)}
  .feature-section{padding:40px 0}
  .feature-form,.feature-side{padding:17px;min-width:0}
  .feature-form h2,.feature-side h2,.review-top h2,.season-top h2{font-size:clamp(28px,8.4vw,37px)}
  .feature-form input,.feature-form select,.feature-form textarea,.season-filter,.admin-token input{max-width:100%;min-width:0;min-height:44px;font-size:16px}
  .feature-submit{min-height:44px}
  .review-top,.season-top{gap:16px}
  .review-average{white-space:normal}
  .review-field-row{grid-template-columns:minmax(0,1fr)}

  /* Seasonal months: legible January–June / July–December 6 × 2 grid */
  .season-month-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:7px}
  .season-month-grid span{height:34px;border-radius:8px;display:grid;place-items:center;font-size:10px;font-weight:800;color:#647268}
  .season-month-grid span.active{color:#fff}
  .season-row[data-fruit="mango"] .season-month-grid span.active,
  .season-row[data-fruit="banana"] .season-month-grid span.active{color:#153d25}
  .season-month-grid span:nth-child(1)::before{content:'Jan'}
  .season-month-grid span:nth-child(2)::before{content:'Feb'}
  .season-month-grid span:nth-child(3)::before{content:'Mar'}
  .season-month-grid span:nth-child(4)::before{content:'Apr'}
  .season-month-grid span:nth-child(5)::before{content:'May'}
  .season-month-grid span:nth-child(6)::before{content:'Jun'}
  .season-month-grid span:nth-child(7)::before{content:'Jul'}
  .season-month-grid span:nth-child(8)::before{content:'Aug'}
  .season-month-grid span:nth-child(9)::before{content:'Sep'}
  .season-month-grid span:nth-child(10)::before{content:'Oct'}
  .season-month-grid span:nth-child(11)::before{content:'Nov'}
  .season-month-grid span:nth-child(12)::before{content:'Dec'}
  .season-row::after{display:none}
  .season-name{gap:10px}
  .season-name img{height:47px;width:52px}
  .seasonal-highlights{gap:12px}
  .seasonal-highlights img{height:155px}

  /* Reviews homepage is a cropped marquee, not a page-wide overflow. */
  .home-sample-reviews{overflow:hidden;padding:34px 0 36px}
  .home-sample-heading{padding:0 17px}
  .home-sample-heading h2{font-size:clamp(27px,8.5vw,33px)}
  .home-review-marquee{max-width:100vw;overflow:hidden}
  .home-review-set .sample-review-card{width:235px;min-width:235px;max-width:235px;border-radius:18px;min-height:177px}
  .sample-reviews-grid,.home-sample-grid{grid-template-columns:minmax(0,1fr)}
  .sample-review-card{min-width:0}
  .sample-review-filters{gap:7px}
  .sample-filter{min-height:40px}

  /* Footer layout, including narrowest 320px phones. */
  .footer{padding-top:36px}
  .footer .content-wrap{width:calc(100% - 34px)}
  .footer-top{display:flex;flex-direction:column;gap:13px;padding:16px 0 21px;grid-template-columns:none}
  .footer-top>*{width:100%;max-width:100%;min-width:0}
  .footer-brand{display:flex;gap:10px;align-items:center}
  .footer-brand img{width:52px;height:52px;flex:none}
  .footer-brand>span{font-size:12px;letter-spacing:.03em}
  .footer-links{display:flex;justify-content:flex-start;gap:6px 10px;flex-wrap:wrap}
  .footer-links a{padding:7px 9px;font-size:10px}
  .footer-socials{display:flex;justify-content:flex-start;gap:9px;flex-wrap:wrap}
  .social-link.icon-only{width:44px;height:44px;flex:none}
  .feature-footer-links{gap:9px 14px;flex-wrap:wrap}
  .footer-bottom{gap:9px;padding:16px 0 22px;font-size:10px}
  .floating-whatsapp{right:12px;bottom:12px;min-height:44px;min-width:44px;display:flex;align-items:center;justify-content:center;padding:12px 15px}
}
@media(max-width:359px){
  .content-wrap,.footer .content-wrap{width:calc(100% - 28px)}
  .brand-mark img{width:46px;height:46px}
  .brand-letters{font-size:11px}
  .brand-letters small{font-size:6.5px}
  .hero h1{font-size:43px}
  .hero-proof{font-size:7px}
  .store-hero h1{font-size:35px}
  .catalog-badge{font-size:8px}
  .home-review-set .sample-review-card{width:222px;min-width:222px;max-width:222px}
  .season-month-grid{gap:5px}
  .season-month-grid span{font-size:9px;height:32px}
  .footer-top{padding:12px 0 17px}
}
@media(prefers-reduced-motion:reduce){
  .home-review-track,.fruit-track,.announcement-marquee,.marquee-track{animation:none!important;transform:none!important}
  .home-review-marquee,.fruit-scroller{overflow-x:auto;scroll-snap-type:x proximity}
}

/* V28 mobile fixes */
@media (max-width: 690px){
  .intro-section.page-section{padding-top:28px!important;padding-bottom:34px!important}
  .collection.page-section,.markets.page-section,.craft.page-section{padding-top:34px!important;padding-bottom:38px!important}
  .underlined-link{white-space:normal!important;gap:8px!important;line-height:1.35;align-items:center;max-width:100%}
  .section-side .underlined-link,.intro-under .underlined-link{display:inline-flex;flex-wrap:wrap}
  .dual-cta .button{white-space:normal;line-height:1.3;text-align:center;padding:12px 18px;min-height:unset}
  .feature-footer-links{display:grid!important;grid-template-columns:1fr;gap:10px}
  .feature-footer-links a{display:block;width:100%;padding:2px 0;overflow:visible}
  .store-gallery{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:8px!important}
  .store-gallery .thumb{width:100%!important;min-width:0!important;max-width:none!important;height:auto!important;aspect-ratio:1/1;display:block}
  .store-gallery .thumb img{width:100%;height:100%;object-fit:cover}
  .footer-socials{gap:12px}
  .social-link.icon-only svg{width:22px;height:22px}
}
