/* Controles exclusivos da navegação por celular. */
.mobile-menu-toggle,.mobile-location,.mobile-nav,.mobile-buybar,.card-buy-short{display:none}
.product-card .card-buy-label{min-width:0}
body.modal-open{overflow:hidden}
html{scroll-padding-top:160px}
.product-about-link{padding:0;text-align:left;text-decoration:underline}

@media(max-width:760px){
 :root{--mobile-nav-height:64px;--mobile-buy-height:78px;--mobile-bottom-offset:calc(var(--mobile-nav-height) + env(safe-area-inset-bottom,0px))}
 html{scroll-padding-top:160px}
 body{font-size:15px;padding-bottom:var(--mobile-bottom-offset);min-width:0}
 body.product-view{--mobile-bottom-offset:calc(var(--mobile-buy-height) + env(safe-area-inset-bottom,0px))}
 .wrap{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));min-width:0}
 button,input,select{font-size:16px}
 input,select{min-height:48px}
 .primary,.outline{min-height:48px;font-size:14px;padding:12px 16px;line-height:1.4}
 .hint,.form-feedback{font-size:12px;line-height:1.6}
 .close-button,.icon-button{width:44px;height:44px;flex-shrink:0}
 .shipping-strip{height:auto;min-height:30px;padding:6px 14px;font-size:11px;line-height:1.4;text-align:center}
 .shipping-strip span:last-child{min-width:0}

 /* Busca e CEP sempre acessíveis, com espaço para o toque. */
 .header-main{grid-template-columns:44px minmax(0,1fr) 44px;gap:8px;min-height:116px;padding-top:8px;padding-bottom:8px}
 .header-main .mobile-menu-toggle{display:grid;grid-column:1;grid-row:1;width:44px;height:44px}
 .header-main>.logo{grid-column:2;grid-row:1;justify-self:center}
 .header-main .logo img{width:95px;height:27px}
 .header-main>.account,.header-main>a.icon-button{display:none}
 .header-main>.cart-button{grid-column:3;grid-row:1;width:44px;height:44px}
 .cart-button #cart-count{min-width:19px;width:auto;height:19px;padding:0 4px;font-size:11px;top:0;right:0}
 .header-main .search{grid-column:1/-1;grid-row:2;height:48px;min-width:0;border:1px solid #ececec;border-radius:8px}
 .search input{font-size:16px;padding:10px 14px;min-width:0;width:100%;min-height:46px}
 .search button{width:48px;flex:0 0 48px}
 .mobile-location{display:flex;align-items:center;gap:8px;min-height:44px;width:100%;padding:10px max(16px,env(safe-area-inset-left,0px));border-top:1px solid #f2f2f2;background:#fff8f9;font-size:12px;text-align:left}
 .mobile-location>.icon,.mobile-location>[data-icon]{flex-shrink:0}
 .mobile-location .icon{width:17px;height:17px}
 .mobile-location>span:nth-child(2){flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .mobile-location strong{font-weight:600}
 .navigation{display:none}
 .mega-menu{top:100%;left:0;right:0;padding:12px 16px;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 8px;max-height:calc(100vh - 224px);max-height:calc(100dvh - 160px - var(--mobile-bottom-offset));overflow:auto;overscroll-behavior:contain;border-top:1px solid var(--line);border-radius:0 0 12px 12px}
 .mega-menu a{display:flex;align-items:center;justify-content:space-between;gap:6px;min-height:48px;padding:10px 8px;font-size:13px;line-height:1.4;border-radius:6px}
 .mega-menu a:active{background:var(--pink)}
 .mega-menu .icon{width:16px;height:16px}

 /* O banner original cabe inteiro, sem o recorte lateral anterior. */
 .hero{height:auto;overflow:visible}
 .hero img{position:static;display:block;left:auto;transform:none;width:100%;min-width:0;max-width:100%;height:auto;aspect-ratio:1351/238;object-fit:contain}
 .hero-bottom{bottom:6px}
 .intro{padding:18px 16px}
 .intro h1{font-size:19px;line-height:1.4;margin:0;letter-spacing:-.4px}
 .intro p{font-size:12px;line-height:1.6;margin-top:8px}
 .benefits{display:flex;overflow-x:auto;gap:20px;padding-top:15px;padding-bottom:15px;scroll-snap-type:x proximity;scrollbar-width:thin;overscroll-behavior-inline:contain}
 .benefit{flex:0 0 228px;justify-content:flex-start;scroll-snap-align:start;gap:12px}
 .benefit>.icon{width:28px;height:28px}
 .benefit strong{font-size:13px;line-height:1.4}
 .benefit small{font-size:12px;line-height:1.4;margin-top:3px}
 .section{padding-top:28px;padding-bottom:16px}
 .section-heading{gap:12px;margin-bottom:18px;align-items:center}
 .section-heading>div,.section-heading>h2{min-width:0;flex:1}
 .section-heading h2{font-size:21px;line-height:1.3;letter-spacing:-.5px}
 .section-heading>a{font-size:12px;max-width:112px;min-height:44px;flex-shrink:0;line-height:1.5}
 .section-heading>.hint{font-size:12px;max-width:120px}
 .eyebrow,.editorial .eyebrow{font-size:11px;letter-spacing:1.5px;margin-bottom:8px}
 .categories{gap:16px;scroll-snap-type:x proximity;overscroll-behavior-inline:contain;padding-bottom:8px}
 .category{flex:0 0 78px;font-size:12px;line-height:1.4;scroll-snap-align:start}
 .category-circle{height:68px;width:68px;margin-bottom:10px}
 .category-circle .icon{width:30px;height:30px}
 .offer-section{margin-top:18px;padding:24px 0}
 .offer-heading p{font-size:12px;line-height:1.5}

 /* Vitrine com dois produtos por linha e nomes legíveis. */
 .products-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .product-card{min-width:0;padding:12px;border-radius:10px}
 .product-picture{height:auto;aspect-ratio:1/1;margin:26px 0 14px;min-width:0}
 .product-picture img{display:block;width:100%;height:100%;object-fit:contain}
 .product-card .favorite{width:44px;height:44px;right:3px;top:3px}
 .favorite .icon{width:22px;height:22px}
 .discount{left:10px;top:13px;font-size:10px;padding:5px 6px}
 .product-brand{font-size:10px;letter-spacing:1px;line-height:1.4;margin-bottom:6px}
 .product-card h3{font-size:13px;line-height:1.5;min-height:58.5px;margin-bottom:10px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden;overflow-wrap:anywhere}
 .product-card .stars{font-size:11px;letter-spacing:1px;line-height:1.5;margin-bottom:10px}
 .stars small{font-size:10px;display:block}
 .old-price{font-size:12px;line-height:1.5}
 .price{font-size:22px;line-height:1.3;white-space:nowrap}
 .price-note{font-size:11px;line-height:1.5;margin:6px 0 14px}
 .product-card .card-buy{min-height:46px;font-size:12px;gap:6px;padding:10px 6px;line-height:1.4}
 .card-buy .icon{width:17px;height:17px}
 .card-buy-label{display:none}
 .card-buy-short{display:inline}
 .brand-section{padding-top:28px;padding-bottom:28px}
 .brand-row{gap:18px;padding:24px 14px}
 .brand-row a{font-size:22px;min-height:44px;display:flex;align-items:center;justify-content:center}
 .editorial{padding:26px 22px;margin-bottom:28px}
 .editorial h2{font-size:25px;line-height:1.3}
 .editorial p{font-size:14px;line-height:1.6}
 .editorial .primary{font-size:14px}

 /* A descrição completa permanece abaixo da área de compra. */
 .breadcrumb{padding-top:20px;margin-bottom:18px;font-size:11px;flex-wrap:wrap;line-height:1.6}
 .product-detail{grid-template-columns:minmax(0,1fr);gap:20px;padding-bottom:28px}
 .product-detail>div{min-width:0}
 .detail-image{height:clamp(240px,80vw,360px)}
 .detail-image .favorite{width:44px;height:44px;display:grid;place-items:center;background:white;border-radius:50%}
 .product-thumbnails{flex-wrap:nowrap;overflow-x:auto;gap:10px;padding:3px 0 8px;scroll-snap-type:x proximity;overscroll-behavior-inline:contain}
 .product-thumbnails button{width:66px;height:70px;flex:0 0 66px;scroll-snap-align:start}
 .product-info .brand-link{font-size:12px;line-height:1.6}
 .product-info h1{font-size:23px;line-height:1.35;margin:10px 0 12px;overflow-wrap:anywhere}
 .product-info>p{display:none}
 .product-info>.red{display:inline-flex;align-items:center;min-height:44px;font-size:13px}
 .product-info .stars{font-size:13px}
 .traits{flex-wrap:wrap;gap:10px;margin-top:12px}
 .traits span{font-size:12px;padding:12px}
 .buy-panel,.delivery-card{padding:20px;border-radius:10px}
 .buy-panel .price{font-size:29px}
 .buy-line{gap:12px;flex-wrap:wrap;align-items:center;margin-top:18px}
 .buy-line>.primary{min-width:130px}
 .quantity{min-height:44px;max-width:100%}
 .quantity button{width:44px;height:44px;font-size:21px;flex-shrink:0}
 .quantity span{min-width:30px;font-size:14px}
 .delivery-card h3{font-size:15px;line-height:1.5}
 .delivery-card p,.description p{font-size:14px;line-height:1.7}
 .delivery-card button{min-height:44px;font-size:14px;margin-top:8px}
 .description{padding:24px 0 30px}
 .description h2{font-size:22px}

 /* Cesta e checkout: controles maiores e formulários em uma coluna. */
 .page-title{padding-top:26px;margin-bottom:22px}
 .page-title h1{font-size:27px;line-height:1.3}
 .page-title p{font-size:14px;line-height:1.6}
 .catalog-toolbar{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;padding-bottom:18px}
 .catalog-toolbar span{font-size:13px}
 .catalog-toolbar select{width:100%;max-width:none;font-size:16px;padding:12px}
 .cart-layout,.checkout-layout{grid-template-columns:minmax(0,1fr);gap:20px}
 .cart-items{padding:16px;min-width:0}
 .cart-items>h3{font-size:14px;line-height:1.5}
 .cart-item{grid-template-columns:44px minmax(0,1fr);gap:12px;position:relative;min-width:0}
 .cart-item>div{min-width:0}
 .cart-item>.item-price{grid-column:2}
 .cart-item>.item-price::before{content:'Subtotal ';font-size:13px;font-weight:400;color:var(--muted)}
 .cart-item img{width:44px;height:75px}
 .cart-item h3{font-size:14px;line-height:1.5;overflow-wrap:anywhere}
 .cart-item .item-price{font-size:15px;white-space:nowrap}
 .cart-item .quantity button{width:44px;height:44px}
 .cart-item .remove{font-size:12px;min-height:44px;padding:12px 0;margin-top:0}
 .summary{padding:20px;min-width:0;border-radius:10px}
 .summary h2{font-size:21px}
 .summary-row{font-size:14px;gap:12px}
 .summary-row.total{font-size:18px}
 .summary .location-summary{font-size:13px;line-height:1.6}
 .summary .outline,.summary small{font-size:12px}
 .summary-item{font-size:13px;line-height:1.5}
 .summary-item>div{min-width:0;overflow-wrap:anywhere}
 .summary-item img{width:40px;height:55px;flex-shrink:0}
 .checkout-safe{font-size:12px;line-height:1.5;text-align:center}
 .checkout-steps{gap:8px;margin-bottom:20px}
 .checkout-step{font-size:12px;gap:6px;line-height:1.4;flex-wrap:wrap}
 .step-circle{width:24px;height:24px;font-size:12px;flex-shrink:0}
 .checkout-card{padding:22px 18px;min-width:0}
 .checkout-card h2{font-size:20px;line-height:1.4}
 .form-grid{grid-template-columns:minmax(0,1fr);gap:16px}
 .form-grid label,.form-label{font-size:14px;line-height:1.5;gap:7px}
 .form-grid input{font-size:16px;padding:13px 12px;width:100%;min-height:48px}
 .form-grid .outline{width:100%}
 .form-actions{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;margin-top:22px}
 .form-actions .text-button{justify-content:center;min-height:44px;font-size:14px}
 .checkout-notice,.checkout-address{font-size:14px;line-height:1.7;overflow-wrap:anywhere}
 .address-edit{font-size:13px;min-height:44px}
 .payment-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:6px}
 .payment-option{min-height:74px;padding:14px;font-size:14px}
 .content-page p{font-size:15px;line-height:1.8}
 .content-page h1{font-size:27px;line-height:1.3}
 .empty{padding:50px 18px}
 .empty p{font-size:14px;line-height:1.7}
 #drawer{width:430px;max-width:100%;padding:20px 16px calc(20px + env(safe-area-inset-bottom,0px));height:100%;height:100dvh;overscroll-behavior:contain}
 .drawer-header{position:sticky;top:0;background:white;z-index:2;padding-bottom:12px;margin-bottom:8px;gap:12px}
 .drawer-header h2{font-size:22px;line-height:1.3}
 #drawer .cart-item{grid-template-columns:44px minmax(0,1fr);gap:12px}
 #drawer .quantity{min-height:44px}
 #drawer .quantity button{width:44px;height:44px}
 #drawer .item-price{font-size:15px}
 dialog{width:450px;max-width:calc(100% - 24px);max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);padding:22px 20px;overflow-y:auto;overscroll-behavior:contain}
 dialog .modal-top{gap:12px;align-items:flex-start}
 dialog .modal-top h2{font-size:21px;line-height:1.35}
 dialog p{font-size:14px;line-height:1.6}
 dialog input{font-size:16px;width:100%}
 .cep-row{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
 .cep-row .primary{padding:12px 16px}
 .cep-result,.error{font-size:14px;line-height:1.6}

 .newsletter h2{font-size:24px;line-height:1.3}
 .newsletter p{font-size:13px;line-height:1.6}
 .newsletter form{grid-template-columns:minmax(0,1fr);gap:12px}
 .newsletter input{font-size:16px;padding:13px 12px}
 .newsletter .consent{font-size:12px;line-height:1.6;flex-wrap:nowrap;align-items:flex-start;gap:10px;min-height:44px}
 .consent input{width:20px;height:20px;min-height:20px;flex-shrink:0;margin:3px 0 0;padding:0}
 .consent>span{min-width:0}
 .footer-grid{gap:26px 20px;grid-template-columns:repeat(2,minmax(0,1fr))}
 .footer-grid>div{min-width:0}
 .footer-grid h3{font-size:14px;line-height:1.4;margin-bottom:12px}
 .footer-grid p{font-size:12px;line-height:1.6}
 .footer-grid a:not(.logo),.footer-grid button{font-size:13px;line-height:1.5;min-height:44px;margin:0;padding:11px 0;text-align:left}
 .social-label{font-size:10px;line-height:1.5}
 .payment-brands{gap:6px}
 .payment-brands b{font-size:10px}
 .safe{font-size:12px;line-height:1.5}
 .footer-bottom{font-size:11px;line-height:1.7;margin-top:26px}

 /* Atalhos ficam fora da área do conteúdo e respeitam a área segura do aparelho. */
 .mobile-nav{position:fixed;bottom:0;left:0;right:0;z-index:25;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));height:calc(var(--mobile-nav-height) + env(safe-area-inset-bottom,0px));padding:5px max(6px,env(safe-area-inset-right,0px)) calc(5px + env(safe-area-inset-bottom,0px)) max(6px,env(safe-area-inset-left,0px));background:white;border-top:1px solid var(--line);box-shadow:0 -4px 18px #00000006}
 .mobile-nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:0;min-height:48px;padding:3px 0;color:#6b6b6b;font-size:10px;line-height:1.2;text-decoration:none}
 .mobile-nav-item .icon{width:23px;height:23px}
 .mobile-nav-item.is-active,.mobile-nav-item[aria-expanded="true"]{color:var(--red);font-weight:700}
 .mobile-nav-item:hover{text-decoration:none}
 .mobile-nav-icon{position:relative;display:flex}
 .mobile-cart-count{position:absolute;top:-5px;right:-12px;min-width:18px;height:18px;padding:2px 4px;border-radius:10px;background:var(--red);color:white;font-size:10px;font-weight:600;line-height:14px;text-align:center}
 body.product-view .mobile-nav{display:none}
 .mobile-buybar{position:fixed;left:0;right:0;bottom:0;z-index:25;display:grid;grid-template-columns:minmax(100px,auto) minmax(0,1fr);align-items:center;gap:14px;height:calc(var(--mobile-buy-height) + env(safe-area-inset-bottom,0px));padding:10px max(16px,env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));background:white;border-top:1px solid var(--line);box-shadow:0 -5px 20px #00000008}
 .mobile-buybar .price{display:block;font-size:24px}
 .mobile-buybar small{display:block;font-size:11px;color:var(--muted);margin-bottom:3px}
 .mobile-buybar .primary{min-width:0;width:100%;min-height:48px;font-size:14px;gap:8px;padding:12px}
 .cookie-notice{bottom:calc(var(--mobile-bottom-offset) + 8px);left:12px;right:12px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;padding:14px;border-radius:10px}
 .cookie-notice p{font-size:12px;line-height:1.5}
 .cookie-notice .primary{min-height:44px;font-size:12px;padding:10px 13px}
 #toast{bottom:calc(var(--mobile-bottom-offset) + 14px);max-width:calc(100% - 32px);width:max-content;padding:14px 18px;font-size:13px;line-height:1.5;text-align:center}
 body.locked .cookie-notice,body.modal-open .cookie-notice{visibility:hidden}
}

@media(max-width:480px){.intro p{display:none}}
@media(max-width:340px){
 .products-grid{grid-template-columns:minmax(0,1fr)}
 .product-picture{height:220px;aspect-ratio:auto}
 .product-card h3{font-size:15px;min-height:0;-webkit-line-clamp:2;line-clamp:2}
 .product-card .card-buy{font-size:14px}
 .card-buy-label{display:inline}
 .card-buy-short{display:none}
 .mobile-buybar{gap:10px}
 .mobile-buybar .price{font-size:22px}
 .mobile-nav-item{font-size:9px}
}
@media(max-width:760px) and (max-height:500px) and (orientation:landscape){
 html{scroll-padding-top:16px}
 header{position:relative}
 .shipping-strip,.mobile-location{display:none}
 .header-main{grid-template-columns:44px 95px minmax(0,1fr) 44px;min-height:64px}
 .header-main .search{grid-column:3;grid-row:1}
 .header-main>.cart-button{grid-column:4}
 .mega-menu{max-height:calc(100vh - 140px);max-height:calc(100dvh - 140px)}
}
