/* One layout responds to the available space on either Concept A URL. */
.hero-grid>*,.categories>*,.products>*,.quiz-layout>*,.essentials-intro>*,.faq-grid>*,.replenish>*,.step>*{min-width:0}
.hero-grid{grid-template-columns:minmax(0,1.04fr) minmax(0,1fr)}
.quiz-layout{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
.essentials-intro{grid-template-columns:repeat(2,minmax(0,1fr))}
.faq-grid{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
.replenish{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
.header-inner>.nav{flex-wrap:wrap;justify-content:flex-end}
.nav a{text-align:center}
.category{grid-template-columns:clamp(54px,6vw,76px) minmax(0,1fr)}
.category img{width:100%;height:auto;aspect-ratio:1}
.category strong{font-size:14px;overflow-wrap:anywhere}
.category span{font-size:12px}
.product-top{flex-wrap:wrap;row-gap:6px}
.product-tag{max-width:calc(100% - 28px);line-height:1.4}
.product h3,.product p,.text-link,summary{overflow-wrap:anywhere}
.product h3{font-size:18px}
.product p{font-size:14px}
.product .text-link{font-size:13px}
.hero h1{overflow-wrap:normal}
.hero-actions{margin-top:24px}
.closing h2+.btn{margin-top:26px}
.product .text-link{display:inline-flex;align-items:center;min-height:44px;width:fit-content}
.community-images{grid-template-columns:repeat(4,minmax(0,1fr));overflow:visible;scroll-snap-type:none;padding-bottom:0}
.community-images img{min-width:0;width:100%}
.detail-photo{text-decoration:none;min-width:0}
.detail-photo>span{display:flex;justify-content:space-between;gap:8px;font-size:12px;font-weight:700;padding-top:13px;line-height:1.5}
.detail-photo:hover>span{text-decoration:underline;text-underline-offset:4px}

@media(max-width:1100px){
  .categories{grid-template-columns:repeat(2,minmax(0,1fr))}
  .category{padding:12px;gap:14px;grid-template-columns:72px minmax(0,1fr)}
  .category strong{font-size:15px}
  .section-heading{align-items:start}
  .section-heading>*{flex:1;min-width:0}
}

@media(max-width:980px){
  .hero{padding-block:32px 38px}
  .hero-grid{display:flex;flex-direction:column;align-items:stretch;gap:22px}
  .hero-copy{display:contents}
  .heritage-signature{order:0;margin:0}
  .hero-copy h1{order:1;font-size:clamp(42px,7.4vw,68px);max-width:850px}
  .hero-gallery{order:6;aspect-ratio:1.55}
  .hero-slide img,.hero-slide video{object-position:var(--mobile-position,50% 40%)}
  .hero-copy .hero-lead{order:2;margin:0;max-width:760px;font-size:17px}
  .hero-copy .hero-value{order:4;margin:0;max-width:760px}
  .hero-copy .hero-actions{order:3;margin:0;flex-direction:row;align-items:center;flex-wrap:wrap;gap:18px}
  .hero-copy .club-note{order:4;margin:0;max-width:650px}
  .products{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 22px}
  .product-photo{aspect-ratio:4/4.65}
  .product-top{font-size:11px;margin-top:17px;letter-spacing:.04em}
  .product-tag{font-size:10px;left:14px;bottom:14px;padding:7px 10px}
  .section-heading{display:block}
  .section-heading p{margin-top:18px;max-width:650px}
  .quiz-layout{grid-template-columns:1fr;gap:25px}
  .quiz-story{display:none}
  .quiz-form{max-width:760px;width:100%;margin-inline:auto}
  .essentials-intro{gap:26px}
  .faq-grid{grid-template-columns:1fr;gap:28px}
  .faq-intro p{max-width:650px}
  .community-heading{display:block}
  .community-heading p{margin-top:10px}
}

@media(max-width:760px){
  .wrap{padding-inline:clamp(18px,4vw,30px)}
  .header-inner>.nav{gap:12px;justify-content:space-between}
  .header-inner>.nav a{min-height:44px;display:flex;align-items:center;justify-content:center}
  .header-inner>.nav .desktop-link{display:none}
  .header-inner>.nav .club-nav{padding:10px 12px}
  .header .logo{width:150px}
  .hero-copy h1{font-size:clamp(39px,8.3vw,60px);max-width:100%}
  .hero-copy .hero-lead{font-size:16px}
  .steps{grid-template-columns:1fr}
  .essentials-intro{grid-template-columns:1fr}
  .essentials-intro .essentials-copy{grid-row:1}
  .replenish{grid-template-columns:1fr;gap:16px}
  .essential-products .product{display:block;padding:0;border:0}
  .essential-products .product-photo{aspect-ratio:1.2;padding:18px}
  .essential-products .product-top{margin-top:17px}
  .essential-products .product h3{font-size:18px}
  .essential-products .product p{font-size:14px;margin:12px 0 13px}
  .community-images{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
}

@media(max-width:600px){
  .hero-grid{gap:20px}
  .hero-gallery{aspect-ratio:1.12}
  .hero-copy .hero-actions{flex-direction:column;align-items:stretch;gap:16px}
  .hero-actions .text-link{text-align:center}
  .categories{gap:12px}
  .category{grid-template-columns:1fr;padding:13px;gap:12px;align-content:start}
  .category img{width:68px;aspect-ratio:1;border-radius:6px}
  .category strong{font-size:14px}
  .category span{font-size:12px;line-height:1.5}
  .section-topline .eyebrow{font-size:10px;line-height:1.5}
  .products,.products:not(.essential-products){grid-template-columns:1fr;gap:25px}
  .products .product,.products:not(.essential-products) .product{
    display:grid;grid-template-columns:minmax(105px,38%) minmax(0,1fr);column-gap:17px;
    padding:0 0 25px;border-bottom:1px solid var(--line);align-content:start;
  }
  .products .product-photo,.products:not(.essential-products) .product-photo{
    grid-column:1;grid-row:1 / 6;align-self:start;aspect-ratio:3/4.2;
  }
  .products .product-top,.products:not(.essential-products) .product-top{
    grid-column:2;margin:2px 0 9px;font-size:10px;align-self:start;gap:6px;
  }
  .products .product h3,.products .product p,.products .product .text-link{grid-column:2}
  .products .product h3,.products:not(.essential-products) .product h3{font-size:17px}
  .products .product p,.products:not(.essential-products) .product p{font-size:14px;margin:10px 0}
  .products .product .text-link{font-size:12px;line-height:1.6}
  .product-tag{font-size:8px;left:8px;bottom:8px;padding:6px;max-width:calc(100% - 16px)}
  .essential-products .product-photo{aspect-ratio:1;padding:12px}
  .press{flex-direction:column;gap:14px}
  .press img{max-width:100%;width:430px}
  .press span{font-size:9px}
  .quiz-form{padding:23px 18px}
  .selection-items{gap:10px}
  .selection .btn{padding-inline:12px}
}

@media(max-width:360px){
  .heritage-signature{gap:9px}
  .heritage-owned{font-size:14px}
  .heritage-since{font-size:20px}
  .heritage-line{width:22px}
  .header-inner>.nav{gap:8px;font-size:10px}
  .header-inner>.nav .club-nav{padding-inline:10px}
  .hero-copy h1{font-size:35px}
  .products .product,.products:not(.essential-products) .product{column-gap:13px;grid-template-columns:105px minmax(0,1fr)}
  .products .product h3,.products:not(.essential-products) .product h3{font-size:16px}
}

/* Use available screen space, including the smaller mobile browser viewport.
   Sections remain natural-height so zoom and larger text never clip content. */
.hero-gallery{height:auto;aspect-ratio:1/1.08;max-height:720px}
.footer{padding-bottom:max(28px,env(safe-area-inset-bottom))}
@media(max-width:980px){
  .hero{padding-block:clamp(22px,3.5vh,32px) 36px;padding-top:clamp(22px,3.5svh,32px)}
  .hero-grid{gap:clamp(16px,2.5vh,22px);gap:clamp(16px,2.5svh,22px)}
  .hero-gallery{height:clamp(300px,48vh,480px);height:clamp(300px,48svh,480px);aspect-ratio:auto;max-height:none}
}
@media(max-width:600px){
  .hero-gallery{height:clamp(320px,52vh,440px);height:clamp(320px,52svh,440px)}
  .gallery-footer{min-height:54px}
}
@media(max-height:500px) and (orientation:landscape){
  .hero-gallery{height:300px}
}
@supports(padding:max(0px)){
  .wrap{padding-left:max(clamp(18px,4vw,56px),env(safe-area-inset-left));padding-right:max(clamp(18px,4vw,56px),env(safe-area-inset-right))}
}
