/* Responsive refinements for touch screens and smaller viewports. */
.hero-grid>*,.intro-grid>*,.expert-grid>*,.formula-grid>*,.testimonial-grid>*,.offer-grid>*,.faq-grid>*{min-width:0}
@media(max-width:1024px){
  .testimonial-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 22px}
  .testimonial-player{aspect-ratio:3/4;max-height:540px}
  .testimonial-caption h3{font-size:14px}
  .intro-copy>p,.section-heading>p,.expert-aside p,.offers-heading>p,.steps-grid p,.contact p,.faq-grid>div>p,.faq-list details>p{font-size:14px}
  .benefit-list p,.ingredient-card p{font-size:13px}
  .benefit-list h3,.offer-card h3{font-size:15px}
  .faq-list summary{font-size:14px;min-height:56px}
  .text-link{font-size:13px;min-height:44px}
  .offer-buy{font-size:13px;min-height:48px}
  .offer-quantity>span,.offer-price .pix-price{font-size:11px}
  .story-note,.offers-foot p,.formula-note>p,.secure-note{font-size:11px}
  .footer-top>div>a:not(.logo){font-size:12px;min-height:30px;display:inline-flex;align-items:center}
  .disclaimer{font-size:10px}
  .gallery-controls button{width:44px;height:44px}
  .watch-link{min-height:44px;font-size:12px}
  .hero-copy>p{font-size:14px}
}
@media(min-width:651px) and (max-width:900px){
  html{scroll-padding-top:98px}
  .navigation{gap:16px}
  .nav-buy{margin-left:auto;min-height:44px}
  .menu-toggle{display:flex;flex-direction:column;gap:6px;justify-content:center;align-items:center;width:44px;height:44px;padding:0;border:0;background:none;flex-shrink:0}
  .menu-toggle>span{width:23px;height:1px;background:#dce6d0;transition:transform .2s}
  .menu-toggle[aria-expanded=true]>span:first-child{transform:translateY(3.5px) rotate(45deg)}
  .menu-toggle[aria-expanded=true]>span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
  .navigation nav{display:none;position:absolute;top:88px;left:0;right:0;padding:20px 5.5% 26px;background:var(--dark);border-bottom:1px solid #ffffff22;flex-direction:column;gap:6px}
  .navigation nav.open{display:flex}
  .navigation nav a{font-size:15px;min-height:44px;display:flex;align-items:center}
  .hero h1{font-size:clamp(46px,7vw,62px);letter-spacing:-3px}
  .hero-actions{gap:12px;flex-wrap:wrap}
  .hero-actions .button{font-size:12px}
  .expert-grid{grid-template-columns:1fr}
  .expert-aside{padding:32px}
  .expert-aside p{max-width:520px}
  .expert-aside h3 br{display:none}
  .expert-aside h3{font-size:32px}
  .aside-spark{margin-bottom:14px}
  .formula-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ingredient-card h3{font-size:18px}
  .footer-top{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px}
}
@media(max-width:800px){
  .intro-grid,.faq-grid{grid-template-columns:1fr;gap:35px}
  .intro-photo>img{height:auto;aspect-ratio:4/3;max-height:480px}
  .intro-copy>p{max-width:none}
  .benefit-list p{max-width:560px}
  .contact-inner{align-items:start}
}
@media(max-width:650px){
  .container{width:88%}
  .navigation{gap:8px}
  .logo>img{width:clamp(94px,30vw,119px)}
  .nav-buy{min-height:44px;font-size:10px;padding:12px 10px;gap:10px}
  .menu-toggle{width:44px;height:44px;align-items:center;flex-shrink:0;padding:0}
  .navigation nav a{font-size:15px;min-height:44px;display:flex;align-items:center}
  .navigation nav{gap:6px}
  .hero-actions{flex-wrap:wrap;gap:12px 20px}
  .hero-actions .button{font-size:12px;min-height:48px;padding:16px 18px}
  .watch-link{font-size:12px;min-height:44px}
  .hero-proof strong{font-size:10px}
  .hero-proof a{font-size:10px;min-height:28px;display:flex;align-items:center}
  .hero .eyebrow{font-size:8px}
  .hero-bottom{font-size:6px;letter-spacing:.8px}
  .hero-bottom a{min-height:44px}
  .eyebrow{font-size:9px}
  .expert-aside .text-link{font-size:13px}
  .ingredient-card{padding:18px}
  .ingredient-card p{min-height:0}
  .ingredient-top>span:first-child{font-size:7px;letter-spacing:.8px}
  .ingredient-type{font-size:8px;letter-spacing:.7px}
  .formula-note>a{font-size:13px;min-height:44px;display:flex;align-items:center}
  .testimonial-grid{gap:25px 18px}
  .community-heading{gap:16px}
  .community-heading h2{font-size:30px}
  .gallery-controls{flex-shrink:0}
  .community-bottom>span{font-size:8px;line-height:1.7}
  .offers-heading h2{font-size:42px}
  .offer-card h3{font-size:14px}
  .offer-price>span:first-child{font-size:11px}
  .offer-price .pix-price{font-size:11px}
  .how-to .section-heading>.button,.contact .button,.closing .button{font-size:13px;min-height:48px}
  .steps-grid h3{font-size:17px}
  .contact .eyebrow{font-size:9px}
  .faq-list summary{font-size:14px;padding-block:20px}
  .footer-top h3{font-size:9px}
  .footer-top>div>a:not(.logo){font-size:13px;min-height:36px}
  .footer-top p{font-size:12px}
  .footer-bottom{font-size:10px;line-height:1.7}
  .disclaimer{font-size:10px;line-height:1.8}
  .whatsapp{bottom:max(16px,env(safe-area-inset-bottom));right:16px}
}
@media(max-width:480px){
  .testimonial-grid,.formula-grid,.offer-grid{grid-template-columns:minmax(0,1fr)}
  .testimonial-player{aspect-ratio:3/4;max-height:460px}
  .testimonial-caption h3{font-size:15px}
  .ingredient-top{min-height:64px}
  .ingredient-art{top:0;width:60px;height:60px}
  .ingredient-card{padding:22px}
  .ingredient-card h3{font-size:20px;min-height:0;overflow-wrap:normal;margin:13px 0}
  .ingredient-card p{font-size:14px;max-width:none;margin-bottom:20px}
  .ingredient-type{padding-top:15px;min-height:0}
  .offer-card{display:grid;grid-template-columns:minmax(88px,.8fr) minmax(0,1.2fr);column-gap:18px;padding:22px}
  .kit-label,.offer-card h3,.offer-quantity,.offer-price{grid-column:2}
  .kit-label{font-size:8px}
  .offer-card h3{min-height:0;margin:10px 0 14px;font-size:14px}
  .kit-bottles{grid-column:1;grid-row:1/5;height:175px;align-self:center;margin:0 -6px}
  .kit-bottles:before{width:104px;height:104px}
  .offer-quantity{border:0;padding-bottom:0}
  .offer-quantity strong{font-size:23px}
  .offer-quantity>span{font-size:12px}
  .offer-price{padding:17px 0 20px}
  .offer-price strong{font-size:30px}
  .offer-price .pix-price{font-size:11px}
  .offer-buy{grid-column:1/-1;font-size:14px;min-height:48px;padding:16px}
  .community-heading h2{font-size:28px}
  .gallery-controls{gap:4px}
  .gallery-controls button{width:44px;height:44px}
  .hero h1{font-size:clamp(44px,13.8vw,58px)}
}
@media(hover:none){.button:hover{transform:none;box-shadow:none}}
