*{
    box-sizing:border-box;
    margin:0;
    padding:0;
}

:root{
    --primary:#1d6fb8;
    --primary-dark:#14568f;
    --primary-soft:#e9f3fb;
    --ink:#1f2937;
    --muted:#6b7280;
    --line:#e7e9ee;
    --surface:#ffffff;
    --canvas:#f7f7f5;
    --success:#11864b;
    --danger:#d63b32;
    --shadow:0 18px 55px rgba(29,33,40,.09);
    --radius-lg:28px;
    --radius-md:20px;
    --radius-sm:14px;
}

html{
    scroll-behavior:smooth;
}

body{
    min-width:320px;
    background:var(--canvas);
    color:var(--ink);
    font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    -webkit-font-smoothing:antialiased;
}

body.drawer-open{
    overflow:hidden;
}

button,
input{
    font:inherit;
}

button,
a{
    -webkit-tap-highlight-color:transparent;
}

button{
    color:inherit;
}

a{
    color:inherit;
    text-decoration:none;
}

img{
    display:block;
    max-width:100%;
}

.shell{
    width:min(1240px,calc(100% - 48px));
    margin-inline:auto;
}

.skip-link{
    position:fixed;
    top:10px;
    left:10px;
    z-index:200;
    padding:10px 14px;
    border-radius:10px;
    background:var(--ink);
    color:#fff;
    transform:translateY(-150%);
}

.skip-link:focus{
    transform:translateY(0);
}

/* Header */

.site-header{
    position:sticky;
    top:0;
    z-index:50;
    padding:14px 0 12px;
    border-bottom:1px solid rgba(231,233,238,.8);
    background:rgba(255,255,255,.94);
    box-shadow:0 4px 20px rgba(29,33,40,.035);
    backdrop-filter:blur(18px);
}

.header-main{
    min-height:50px;
    display:flex;
    align-items:center;
    gap:26px;
}

.brand{
    display:flex;
    align-items:center;
    gap:11px;
    min-width:max-content;
}

.brand-mark{
    width:44px;
    height:44px;
    display:grid;
    place-items:center;
    border-radius:14px;
    color:#fff;
    background:linear-gradient(145deg,var(--primary),var(--primary-dark));
    box-shadow:0 9px 20px color-mix(in srgb,var(--primary) 28%,transparent);
    font-size:22px;
}

.brand-copy{
    display:flex;
    flex-direction:column;
    line-height:1.1;
}

.brand-copy strong{
    max-width:210px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:16px;
    font-weight:800;
    letter-spacing:-.02em;
}

.brand-copy span{
    display:flex;
    align-items:center;
    gap:5px;
    margin-top:6px;
    color:var(--success);
    font-size:11px;
    font-weight:700;
}

.status-dot{
    width:7px;
    height:7px;
    display:inline-block;
    border-radius:50%;
    background:var(--success);
    box-shadow:0 0 0 4px rgba(17,134,75,.1);
}

.delivery-location{
    min-width:210px;
    display:flex;
    align-items:center;
    gap:10px;
    padding:8px 12px;
    border:0;
    border-left:1px solid var(--line);
    background:transparent;
    cursor:pointer;
    text-align:left;
}

.delivery-location__icon{
    width:30px;
    height:30px;
    display:grid;
    place-items:center;
    flex:0 0 auto;
    border-radius:10px;
    background:var(--primary-soft);
    color:var(--primary-dark);
    font-size:18px;
    font-weight:900;
}

.delivery-location span:nth-child(2){
    display:flex;
    flex:1;
    flex-direction:column;
    gap:2px;
}

.delivery-location small{
    color:var(--muted);
    font-size:10px;
}

.delivery-location strong{
    font-size:12px;
}

.delivery-location b{
    color:var(--muted);
    font-size:22px;
    font-weight:400;
}

.desktop-nav{
    display:flex;
    align-items:center;
    gap:24px;
    margin-left:auto;
}

.desktop-nav a{
    color:#4b5563;
    font-size:13px;
    font-weight:650;
    transition:.2s ease;
}

.desktop-nav a:hover{
    color:var(--primary-dark);
}

.header-actions{
    display:flex;
    align-items:center;
    gap:8px;
}

.icon-button,
.cart-button{
    height:42px;
    border:0;
    border-radius:13px;
    cursor:pointer;
    transition:transform .2s ease,background .2s ease;
}

.icon-button:hover,
.cart-button:hover{
    transform:translateY(-2px);
}

.icon-button{
    display:flex;
    align-items:center;
    gap:7px;
    padding:0 12px;
    background:#f4f5f6;
}

.icon-button span{
    font-size:18px;
}

.icon-button b,
.cart-label{
    font-size:12px;
}

.cart-button{
    position:relative;
    display:flex;
    align-items:center;
    gap:8px;
    padding:0 14px;
    background:var(--ink);
    color:#fff;
}

.cart-count{
    min-width:21px;
    height:21px;
    display:grid;
    place-items:center;
    padding:0 5px;
    border-radius:999px;
    background:var(--primary);
    color:#fff;
    font-size:11px;
    font-weight:800;
}

.search-row{
    display:flex;
    align-items:center;
    gap:10px;
    margin-top:12px;
}

.search-box{
    height:48px;
    display:flex;
    flex:1;
    align-items:center;
    gap:11px;
    padding:0 14px;
    border:1px solid transparent;
    border-radius:15px;
    background:#f2f3f4;
    transition:border .2s ease,background .2s ease,box-shadow .2s ease;
}

.search-box:focus-within{
    border-color:color-mix(in srgb,var(--primary) 55%,#fff);
    background:#fff;
    box-shadow:0 0 0 4px color-mix(in srgb,var(--primary) 10%,transparent);
}

.search-box > span{
    color:#4b5563;
    font-size:24px;
    line-height:0;
}

.search-box input{
    width:100%;
    border:0;
    outline:0;
    background:transparent;
    color:var(--ink);
    font-size:14px;
}

.search-box input::placeholder{
    color:#9ca3af;
}

.search-box kbd{
    padding:4px 7px;
    border:1px solid #dedfe3;
    border-radius:6px;
    background:#fff;
    color:#9ca3af;
    font-family:inherit;
    font-size:9px;
}

.filter-button{
    height:48px;
    display:flex;
    align-items:center;
    gap:8px;
    padding:0 16px;
    border:1px solid var(--line);
    border-radius:15px;
    background:#fff;
    cursor:pointer;
}

.filter-button b{
    font-size:12px;
}

/* Hero */

main{
    overflow:hidden;
}

.hero{
    min-height:390px;
    display:grid;
    grid-template-columns:1.08fr .92fr;
    align-items:center;
    margin-top:26px;
    overflow:hidden;
    border-radius:34px;
    background:
        radial-gradient(circle at 78% 20%,color-mix(in srgb,var(--primary) 78%,#fff) 0,transparent 30%),
        linear-gradient(118deg,#18222f 0%,#223349 50%,var(--primary-dark) 100%);
    box-shadow:0 24px 70px rgba(31,41,55,.16);
    color:#fff;
}

.hero-copy{
    position:relative;
    z-index:2;
    padding:56px 0 56px 62px;
}

.eyebrow,
.section-kicker{
    display:inline-flex;
    align-items:center;
    gap:7px;
    color:var(--primary-dark);
    font-size:11px;
    font-weight:850;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.eyebrow{
    padding:7px 11px;
    border:1px solid rgba(255,255,255,.18);
    border-radius:999px;
    background:rgba(255,255,255,.1);
    color:#fff;
    letter-spacing:.1em;
}

.hero h1{
    max-width:580px;
    margin-top:19px;
    font-size:clamp(42px,5vw,68px);
    line-height:.98;
    letter-spacing:-.06em;
}

.hero h1 em{
    color:color-mix(in srgb,var(--primary) 64%,#fff);
    font-style:normal;
}

.hero-copy > p{
    max-width:500px;
    margin-top:19px;
    color:rgba(255,255,255,.73);
    font-size:16px;
    line-height:1.6;
}

.hero-actions{
    display:flex;
    align-items:center;
    gap:19px;
    margin-top:29px;
}

.primary-button{
    min-height:49px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    padding:0 21px;
    border:0;
    border-radius:15px;
    background:var(--primary);
    box-shadow:0 10px 25px color-mix(in srgb,var(--primary) 25%,transparent);
    color:#fff;
    cursor:pointer;
    font-size:13px;
    font-weight:800;
    transition:transform .2s ease,filter .2s ease;
}

.primary-button:hover{
    transform:translateY(-2px);
    filter:brightness(1.05);
}

.primary-button span{
    font-size:19px;
}

.delivery-promise{
    color:rgba(255,255,255,.78);
    font-size:12px;
    font-weight:650;
}

.hero-showcase{
    position:relative;
    align-self:stretch;
    min-height:390px;
}

.showcase-orbit{
    position:absolute;
    border:1px solid rgba(255,255,255,.15);
    border-radius:50%;
}

.showcase-orbit--one{
    width:370px;
    height:370px;
    top:13px;
    right:18px;
}

.showcase-orbit--two{
    width:265px;
    height:265px;
    top:67px;
    right:70px;
}

.showcase-bag{
    position:absolute;
    top:50%;
    right:90px;
    width:230px;
    height:250px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(255,255,255,.23);
    border-radius:42px 42px 55px 55px;
    background:linear-gradient(155deg,rgba(255,255,255,.28),rgba(255,255,255,.08));
    box-shadow:0 35px 80px rgba(0,0,0,.24);
    transform:translateY(-50%) rotate(4deg);
    backdrop-filter:blur(9px);
}

.showcase-bag > span{
    font-size:84px;
    filter:drop-shadow(0 14px 20px rgba(0,0,0,.18));
}

.showcase-bag b{
    margin-top:8px;
    color:rgba(255,255,255,.78);
    font-size:14px;
    line-height:1.2;
    text-align:center;
    text-transform:uppercase;
}

.floating-card{
    position:absolute;
    z-index:3;
    display:flex;
    align-items:center;
    gap:9px;
    padding:11px 14px;
    border:1px solid rgba(255,255,255,.38);
    border-radius:16px;
    background:rgba(255,255,255,.9);
    box-shadow:0 15px 35px rgba(0,0,0,.16);
    color:var(--ink);
    backdrop-filter:blur(12px);
}

.floating-card > span{
    width:31px;
    height:31px;
    display:grid;
    place-items:center;
    border-radius:10px;
    background:var(--primary-soft);
    color:var(--primary-dark);
}

.floating-card div{
    display:flex;
    flex-direction:column;
}

.floating-card small{
    color:var(--muted);
    font-size:9px;
}

.floating-card strong{
    font-size:11px;
}

.floating-card--top{
    top:55px;
    right:24px;
    transform:rotate(3deg);
}

.floating-card--bottom{
    right:290px;
    bottom:52px;
    transform:rotate(-5deg);
}

/* Sections */

.content-section{
    padding-top:64px;
}

.section-heading{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:24px;
    margin-bottom:22px;
}

.section-heading h2{
    margin-top:6px;
    font-size:clamp(24px,2.5vw,33px);
    line-height:1.08;
    letter-spacing:-.04em;
}

.section-kicker--hot{
    color:var(--danger);
}

.text-button{
    display:flex;
    align-items:center;
    gap:8px;
    padding:8px 0;
    border:0;
    background:transparent;
    color:var(--primary-dark);
    cursor:pointer;
    font-size:12px;
    font-weight:800;
}

.text-button span{
    font-size:17px;
}

.categories-list{
    display:flex;
    gap:20px;
    overflow-x:auto;
    padding:8px 3px 18px;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
}

.categories-list::-webkit-scrollbar,
.product-row::-webkit-scrollbar{
    display:none;
}

.category-card{
    min-width:112px;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:11px;
    padding:0;
    border:0;
    background:transparent;
    cursor:pointer;
    scroll-snap-align:start;
    transition:transform .2s ease;
}

.category-card:hover,
.category-card.active{
    transform:translateY(-3px);
}

.category-icon{
    position:relative;
    width:104px;
    height:104px;
    display:grid;
    place-items:center;
    overflow:hidden;
    border-radius:50%;
    background:conic-gradient(
        #f9ce34,
        #ee2a7b 32%,
        #6228d7 60%,
        #2f7ee6 78%,
        #f9ce34
    );
    font-size:40px;
    transition:transform .2s ease,box-shadow .2s ease;
}

.category-icon::before{
    content:"";
    position:absolute;
    inset:4px;
    z-index:0;
    border-radius:50%;
    background:#fff;
}

.category-icon > span{
    position:relative;
    z-index:1;
    width:calc(100% - 14px);
    height:calc(100% - 14px);
    display:grid;
    place-items:center;
    border-radius:50%;
    background:linear-gradient(145deg,var(--primary-soft),#fff);
}

.category-card.active .category-icon{
    transform:scale(1.025);
    box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 55%,#fff),
               0 10px 24px rgba(31,41,55,.14);
}

.category-icon img{
    position:absolute;
    inset:7px;
    z-index:2;
    width:calc(100% - 14px);
    height:calc(100% - 14px);
    border-radius:50%;
    background:#fff;
    object-fit:cover;
}

.category-card > span:last-child{
    max-width:110px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:normal;
    font-size:12px;
    font-weight:750;
    line-height:1.2;
    text-align:center;
}

.category-card.active > span:last-child{
    color:var(--primary-dark);
}

.benefit-strip{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    margin-top:48px;
    overflow:hidden;
    border:1px solid var(--line);
    border-radius:22px;
    background:#fff;
}

.benefit-strip > div{
    display:flex;
    align-items:center;
    gap:13px;
    padding:20px 24px;
}

.benefit-strip > div + div{
    border-left:1px solid var(--line);
}

.benefit-strip > div > span{
    width:40px;
    height:40px;
    display:grid;
    place-items:center;
    flex:0 0 auto;
    border-radius:13px;
    background:var(--primary-soft);
    color:var(--primary-dark);
}

.benefit-strip p{
    display:flex;
    flex-direction:column;
    gap:3px;
}

.benefit-strip strong{
    font-size:12px;
}

.benefit-strip small{
    color:var(--muted);
    font-size:10px;
}

/* Products */

.product-row{
    display:flex;
    gap:16px;
    overflow-x:auto;
    padding:4px 2px 20px;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
}

.product-card{
    position:relative;
    min-width:218px;
    width:218px;
    overflow:hidden;
    border:1px solid var(--line);
    border-radius:22px;
    background:#fff;
    scroll-snap-align:start;
    display:flex;
    flex-direction:column;
    transition:transform .24s ease,box-shadow .24s ease,border .24s ease;
}

.product-card:hover{
    transform:translateY(-5px);
    border-color:#d8dbe1;
    box-shadow:var(--shadow);
}

.product-open{
    width:100%;
    height:100%;
    display:flex;
    flex-direction:column;
    padding:0;
    border:0;
    background:transparent;
    cursor:pointer;
    color:inherit;
    text-align:left;
}

.product-image{
    position:relative;
    aspect-ratio:1 / 1;
    height:auto;
    display:grid;
    place-items:center;
    overflow:hidden;
    background:#f7f7f5;
    border-bottom:1px solid #f0f0ed;
}

.product-image img{
    position:absolute;
    inset:12px;
    width:calc(100% - 24px);
    height:calc(100% - 24px);
    padding:0;
    border-radius:14px;
    background:#fff;
    object-fit:contain;
    object-position:center;
    transition:transform .3s ease;
}

.product-card:hover .product-image img{
    transform:scale(1.04);
}

.emoji-produto{
    font-size:66px;
    filter:drop-shadow(0 12px 16px rgba(31,41,55,.12));
}

.discount-badge{
    position:absolute;
    top:11px;
    left:11px;
    padding:5px 8px;
    border-radius:8px;
    background:var(--danger);
    color:#fff;
    font-size:9px;
    font-weight:850;
}

.favorite-button{
    position:absolute;
    top:10px;
    right:10px;
    width:34px;
    height:34px;
    display:grid;
    place-items:center;
    border:1px solid rgba(231,233,238,.8);
    border-radius:50%;
    background:rgba(255,255,255,.9);
    color:#6b7280;
    cursor:pointer;
    font-size:17px;
}

.product-content{
    flex:1;
    display:flex;
    flex-direction:column;
    padding:14px 14px 16px;
}

.product-category{
    color:var(--muted);
    font-size:9px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.product-card h3{
    min-height:38px;
    margin-top:6px;
    display:-webkit-box;
    overflow:hidden;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    font-size:13px;
    line-height:1.45;
}

.price-block{
    min-height:45px;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    margin-top:auto;
    padding-top:9px;
}

.price-old{
    color:#9ca3af;
    font-size:10px;
    text-decoration:line-through;
}

.price-current{
    color:var(--ink);
    font-size:19px;
    font-weight:850;
    letter-spacing:-.03em;
}

.price-current small{
    color:var(--muted);
    font-size:9px;
    font-weight:500;
}

.add-button{
    position:absolute;
    right:13px;
    bottom:15px;
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border:0;
    border-radius:12px;
    background:var(--primary);
    box-shadow:0 8px 20px color-mix(in srgb,var(--primary) 23%,transparent);
    color:#fff;
    cursor:pointer;
    font-size:22px;
    font-weight:500;
    transition:transform .2s ease;
}

.add-button:hover{
    transform:scale(1.08);
}

.catalog-section{
    padding-bottom:80px;
}

.catalog-heading p{
    margin-top:7px;
    color:var(--muted);
    font-size:12px;
}

.sort-button{
    display:flex;
    align-items:center;
    gap:18px;
    padding:11px 14px;
    border:1px solid var(--line);
    border-radius:12px;
    background:#fff;
    cursor:pointer;
    font-size:11px;
    font-weight:700;
}

.catalog-grid{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:16px;
}

.catalog-grid .product-card{
    min-width:0;
    width:100%;
}

.empty-state{
    width:100%;
    min-height:150px;
    display:grid;
    place-items:center;
    padding:24px;
    border:1px dashed #d5d8de;
    border-radius:20px;
    background:#fff;
    color:var(--muted);
    text-align:center;
}

.catalog-grid > .empty-state{
    grid-column:1 / -1;
}

/* Footer */

.site-footer{
    padding:34px 0 110px;
    border-top:1px solid var(--line);
    background:#fff;
}

.footer-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
}

.brand--footer .brand-mark{
    width:40px;
    height:40px;
}

.brand--footer .brand-copy span{
    color:var(--muted);
}

.footer-inner > p{
    color:var(--muted);
    font-size:12px;
}

/* Cart drawer */

.drawer-backdrop{
    position:fixed;
    inset:0;
    z-index:80;
    background:rgba(13,18,26,.48);
    opacity:0;
    pointer-events:none;
    transition:opacity .25s ease;
    backdrop-filter:blur(3px);
}

.cart-drawer{
    position:fixed;
    top:0;
    right:0;
    bottom:0;
    z-index:90;
    width:min(470px,100%);
    display:flex;
    flex-direction:column;
    background:#fff;
    box-shadow:-24px 0 70px rgba(0,0,0,.16);
    transform:translateX(105%);
    transition:transform .3s cubic-bezier(.2,.8,.2,1);
}

body.drawer-open .drawer-backdrop{
    opacity:1;
    pointer-events:auto;
}

body.drawer-open .cart-drawer{
    transform:translateX(0);
}

.cart-drawer__header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:24px;
    border-bottom:1px solid var(--line);
}

.cart-drawer__header h2{
    margin-top:4px;
    font-size:25px;
    letter-spacing:-.04em;
}

.close-button,
.dialog-close{
    width:40px;
    height:40px;
    display:grid;
    place-items:center;
    border:1px solid var(--line);
    border-radius:13px;
    background:#fff;
    cursor:pointer;
    color:var(--muted);
    font-size:24px;
}

.cart-items{
    flex:1;
    overflow-y:auto;
    padding:8px 24px 20px;
}

.cart-empty{
    height:100%;
    min-height:270px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    color:var(--muted);
    text-align:center;
}

.cart-empty span{
    width:72px;
    height:72px;
    display:grid;
    place-items:center;
    margin-bottom:16px;
    border-radius:50%;
    background:var(--primary-soft);
    font-size:31px;
}

.cart-empty strong{
    color:var(--ink);
    font-size:16px;
}

.cart-empty p{
    max-width:250px;
    margin-top:6px;
    font-size:12px;
    line-height:1.5;
}

.cart-item{
    display:grid;
    grid-template-columns:64px 1fr auto;
    gap:12px;
    align-items:center;
    padding:16px 0;
    border-bottom:1px solid var(--line);
}

.cart-item__image{
    position:relative;
    width:64px;
    height:64px;
    display:grid;
    place-items:center;
    overflow:hidden;
    border-radius:15px;
    background:#f3f4f5;
    font-size:28px;
}

.cart-item__image img{
    position:absolute;
    inset:0;
    background:#f3f4f5;
    width:100%;
    height:100%;
    padding:7px;
    object-fit:contain;
}

.cart-item__info{
    min-width:0;
}

.cart-item__info h3{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#172a3a;
    font-size:14px;
    font-weight:750;
}

.cart-item__info strong{
    display:block;
    margin-top:5px;
    color:var(--primary-dark);
    font-size:15px;
}

.quantity-control{
    display:flex;
    align-items:center;
    gap:8px;
}

.quantity-control button{
    width:34px;
    height:34px;
    display:grid;
    place-items:center;
    border:1px solid #cfd9e1;
    border-radius:9px;
    background:#fff;
    cursor:pointer;
}

.quantity-control span{
    min-width:14px;
    text-align:center;
    font-size:14px;
    font-weight:800;
}

.cart-summary{
    padding:20px 24px 25px;
    border-top:1px solid var(--line);
    background:#f4f7f9;
}

.cart-summary > div{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:10px;
    color:#506575;
    font-size:13px;
}

.cart-summary > div strong{
    color:var(--ink);
}

.cart-summary .cart-total{
    margin:15px 0 17px;
    padding-top:14px;
    border-top:1px dashed #d6d8dc;
    color:var(--ink);
    font-size:16px;
    font-weight:800;
}

.cart-total strong{
    color:#0b5cab!important;
    font-size:22px;
}

.checkout-button{
    width:100%;
    height:56px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    border:0;
    border-radius:15px;
    background:linear-gradient(100deg,var(--primary-dark),var(--primary));
    color:#fff;
    cursor:pointer;
    font-size:15px;
    font-weight:800;
}

.checkout-button:disabled{
    cursor:not-allowed;
    opacity:.45;
}

/* 24/09/2026 — volta do carrinho para a lista de produtos */
.keep-shopping-button{
    width:100%;
    height:48px;
    margin-top:10px;
    border:1.5px solid var(--primary);
    border-radius:15px;
    background:#fff;
    color:var(--primary-dark);
    cursor:pointer;
    font-size:14px;
    font-weight:800;
}

.keep-shopping-button:hover{
    background:var(--primary-soft);
}

.cart-summary > small{
    display:block;
    margin-top:11px;
    color:#6f818e;
    font-size:11px;
    text-align:center;
}

/* Checkout — identidade visual Loja Fácil / Tropical Sistemas */

.checkout-dialog{
    --checkout-primary:var(--primary);
    --checkout-accent:color-mix(in srgb,var(--primary) 82%,#29b6f6);
    --checkout-dark:var(--primary-dark);
    --checkout-ink:#12304b;
    --checkout-soft:var(--primary-soft);
    --checkout-action:#0b5cab;
    --checkout-action-dark:#073f78;
    width:min(1180px,calc(100% - 40px));
    max-height:calc(100dvh - 32px);
    margin:auto;
    padding:0;
    overflow:hidden;
    border:0;
    border-radius:18px;
    background:#eef3f6;
    box-shadow:0 30px 100px rgba(5,34,57,.28);
    color:var(--checkout-ink);
}

.checkout-dialog[open]{
    display:block;
}

.checkout-dialog::backdrop{
    background:rgba(6,24,39,.64);
    backdrop-filter:blur(4px);
}

.checkout-topbar{
    min-height:76px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:13px 26px;
    background:linear-gradient(100deg,var(--checkout-dark),var(--checkout-primary));
    color:#fff;
}

.checkout-brand{
    display:flex;
    align-items:center;
    gap:12px;
}

.checkout-brand__mark{
    width:44px;
    height:44px;
    display:grid;
    place-items:center;
    border:1px solid rgba(255,255,255,.28);
    border-radius:12px;
    background:linear-gradient(145deg,#21a8e9,#0874ba);
    box-shadow:0 8px 20px rgba(0,0,0,.16);
    font-size:13px;
    font-weight:900;
    letter-spacing:-.04em;
}

.checkout-brand div{
    display:flex;
    flex-direction:column;
    gap:2px;
}

.checkout-brand small{
    color:#bfe8ff;
    color:rgba(255,255,255,.8);
    font-size:11px;
    font-weight:800;
    letter-spacing:.1em;
    text-transform:uppercase;
}

.checkout-brand strong{
    font-size:22px;
}

.checkout-close{
    width:40px;
    height:40px;
    display:grid;
    place-items:center;
    border:1px solid rgba(255,255,255,.22);
    border-radius:11px;
    background:rgba(255,255,255,.09);
    color:#fff;
    cursor:pointer;
    font-size:24px;
}

.checkout-progress{
    min-height:54px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    padding:9px 20px;
    border-bottom:1px solid #d9e4eb;
    background:#fff;
}

.checkout-progress span{
    display:flex;
    align-items:center;
    gap:7px;
    color:#617787;
    font-size:12px;
    font-weight:800;
}

.checkout-progress span b{
    width:28px;
    height:28px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#e9f0f4;
    font-size:11px;
}

.checkout-progress span.active{
    color:var(--checkout-primary);
}

.checkout-progress span.active b{
    background:var(--checkout-accent);
    color:#fff;
}

.checkout-progress span.completed{
    color:var(--checkout-primary);
}

.checkout-progress span.completed b{
    background:var(--checkout-soft);
    color:var(--checkout-primary);
}

.checkout-progress i{
    width:55px;
    height:1px;
    background:#d9e4eb;
}

.checkout-layout{
    max-height:calc(100dvh - 162px);
    display:grid;
    grid-template-columns:minmax(0,1fr) 400px;
    overflow:hidden;
}

.checkout-fields{
    overflow-y:auto;
    padding:24px;
}

.checkout-section{
    padding:24px;
    border:1px solid #cbd9e2;
    border-radius:16px;
    background:#fff;
    box-shadow:0 7px 20px rgba(17,61,91,.06);
}

.checkout-section + .checkout-section{
    margin-top:18px;
}

.checkout-section__heading{
    display:flex;
    align-items:flex-start;
    gap:13px;
    margin-bottom:20px;
}

.checkout-section__heading > span{
    flex:0 0 auto;
    width:32px;
    height:32px;
    display:grid;
    place-items:center;
    border-radius:8px;
    background:var(--checkout-primary);
    color:#fff;
    font-size:13px;
    font-weight:900;
}

.checkout-section__heading h3{
    color:#102b40;
    font-size:18px;
    line-height:1.2;
}

.checkout-section__heading p{
    margin-top:4px;
    color:#536c7e;
    font-size:13px;
    line-height:1.45;
}

.checkout-field-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:15px;
}

.checkout-field-grid--address{
    grid-template-columns:140px minmax(0,1fr) 105px;
}

.checkout-field{
    display:flex;
    flex-direction:column;
    gap:8px;
}

.checkout-field--wide{
    grid-column:1 / -1;
}

.checkout-field--street{
    grid-column:auto;
}

.checkout-field > span{
    color:#29495f;
    font-size:11px;
    font-weight:850;
    text-transform:uppercase;
    letter-spacing:.035em;
}

.checkout-field input,
.checkout-field textarea{
    width:100%;
    min-height:48px;
    padding:12px 14px;
    border:1px solid #afc3d0;
    border-radius:10px;
    outline:0;
    background:#fff;
    color:var(--checkout-ink);
    font:inherit;
    font-size:14px;
    transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}

.checkout-field textarea{
    min-height:88px;
    resize:vertical;
}

.checkout-field input:focus,
.checkout-field textarea:focus{
    border-color:var(--checkout-accent);
    background:#fff;
    box-shadow:0 0 0 3px rgba(22,136,204,.12);
}

.checkout-field input::placeholder,
.checkout-field textarea::placeholder{
    color:#718797;
}

.checkout-cep-status{
    min-height:15px;
    color:#526c7d;
    font-size:10px;
    font-weight:700;
    line-height:1.35;
}

.checkout-cep-status:empty{
    display:none;
}

.checkout-cep-status.loading{
    color:var(--checkout-primary);
}

.checkout-cep-status.success{
    color:#147443;
}

.checkout-cep-status.error{
    color:#b42318;
}

.checkout-options{
    display:grid;
    gap:12px;
}

.checkout-options--two{
    grid-template-columns:repeat(2,minmax(0,1fr));
}

.checkout-options--payment{
    grid-template-columns:repeat(4,minmax(0,1fr));
}

.checkout-options--payment .checkout-option__content{
    height:100%;
}

.checkout-option{
    position:relative;
    cursor:pointer;
}

.checkout-option input{
    position:absolute;
    opacity:0;
    pointer-events:none;
}

.checkout-option__content{
    min-height:86px;
    display:grid;
    grid-template-columns:40px 1fr;
    grid-template-rows:auto auto;
    column-gap:12px;
    align-content:center;
    padding:14px;
    border:1px solid #b9ccd8;
    border-radius:12px;
    background:#fff;
    transition:border-color .2s ease,background .2s ease,box-shadow .2s ease;
}

.checkout-option__content b{
    grid-row:1 / 3;
    width:40px;
    height:40px;
    display:grid;
    place-items:center;
    align-self:center;
    border-radius:9px;
    background:var(--checkout-soft);
    color:var(--checkout-primary);
    font-size:15px;
}

.checkout-option__content strong{
    align-self:end;
    color:#15364c;
    font-size:14px;
}

.checkout-option__content small{
    margin-top:3px;
    color:#566f80;
    font-size:11px;
}

.checkout-option input:checked + .checkout-option__content{
    border-color:var(--checkout-primary);
    background:color-mix(in srgb,var(--checkout-primary) 8%,#fff);
    box-shadow:0 0 0 3px color-mix(in srgb,var(--checkout-primary) 14%,transparent);
}

/* 24/09/2026 -- destaque quando o cliente tenta seguir sem escolher o pagamento */
.checkout-options--erro .checkout-option__content{
    border-color:#d93025;
    background:#fff6f5;
}

.checkout-option input:focus-visible + .checkout-option__content{
    outline:3px solid rgba(22,136,204,.2);
}

.checkout-address{
    margin-top:14px;
    padding-top:14px;
    border-top:1px dashed #d6e1e8;
}

.checkout-coverage-note{
    display:flex;
    align-items:flex-start;
    gap:9px;
    margin-top:12px;
    padding:12px 14px;
    border-radius:9px;
    background:color-mix(in srgb,var(--checkout-primary) 9%,#fff);
    color:#34576e;
    font-size:11px;
    line-height:1.45;
}

.checkout-coverage-note > span{
    color:var(--checkout-accent);
    font-size:16px;
}

/* 25/09/2026 — caixa escondida (fora do raio: o aviso é só o pop-up) */
.checkout-coverage-note[hidden]{
    display:none!important;
}

/* 24/09/2026 — estados da caixa de entrega (distância e taxa) */
.checkout-coverage-note p{
    margin:0;
}

.checkout-coverage-note.loading{
    background:#f3f6f9;
    color:#526c7d;
}

.checkout-coverage-note.ok{
    background:#ecf8f1;
    color:#0f5c34;
}

.checkout-coverage-note.aviso{
    background:#fff7e6;
    color:#7a4b00;
}

/* 25/09/2026 — vermelho mais forte para chamar atenção */
.checkout-coverage-note.indisponivel{
    border:2px solid #d93025;
    background:#fde3e0;
    color:#a50e0e;
    font-size:12px;
    font-weight:600;
}

.checkout-coverage-note.indisponivel > span{
    color:#d93025;
}

/* 25/09/2026 — pop-up "Entrega indisponível" */
.delivery-alert-dialog{
    /* 25/09/2026 — centralizado na tela (largura e altura) */
    position:fixed;
    inset:0;
    margin:auto;
    height:fit-content;
    max-height:calc(100dvh - 32px);
    overflow:auto;
    width:min(380px,calc(100% - 32px));
    padding:26px 22px 20px;
    border:0;
    border-top:6px solid #d93025;
    border-radius:18px;
    text-align:center;
    box-shadow:0 24px 60px rgba(0,0,0,.28);
}

.delivery-alert-dialog::backdrop{
    background:rgba(20,10,10,.55);
}

.delivery-alert-icon{
    width:56px;
    height:56px;
    margin:0 auto 12px;
    border-radius:50%;
    background:#d93025;
    color:#fff;
    font-size:32px;
    font-weight:900;
    line-height:56px;
}

.delivery-alert-dialog h2{
    margin:0 0 8px;
    color:#a50e0e;
    font-size:21px;
}

.delivery-alert-dialog p{
    margin:0 0 18px;
    color:#4a2a28;
    font-size:14px;
    line-height:1.45;
}

.delivery-alert-primary,
.delivery-alert-secondary{
    width:100%;
    min-height:48px;
    border-radius:12px;
    cursor:pointer;
    font-size:14px;
    font-weight:800;
}

.delivery-alert-primary{
    border:0;
    background:#d93025;
    color:#fff;
}

.delivery-alert-secondary{
    margin-top:10px;
    border:1.5px solid #d6d8dc;
    background:#fff;
    color:#3d4a55;
}

.checkout-coverage-action{
    margin-top:9px;
    padding:8px 12px;
    border:1.5px solid currentColor;
    border-radius:9px;
    background:#fff;
    color:inherit;
    cursor:pointer;
    font-size:12px;
    font-weight:800;
}

.checkout-coverage-action[hidden]{
    display:none;
}

.checkout-change{
    max-width:240px;
    margin-top:12px;
}

.checkout-change[hidden],
.checkout-address[hidden]{
    display:none!important;
}

.checkout-notes{
    margin-top:14px;
}

.checkout-summary{
    overflow-y:auto;
    padding:24px;
    border-left:1px solid #cbd9e2;
    background:#fff;
}

.checkout-summary__title{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    padding-bottom:15px;
    border-bottom:1px solid #e1e9ee;
}

.checkout-summary__title small{
    color:#5d7484;
    font-size:10px;
    text-transform:uppercase;
    letter-spacing:.06em;
}

.checkout-summary__title h3{
    margin-top:3px;
    font-size:20px;
}

.checkout-summary__title button{
    padding:9px 11px;
    border:1px solid #afc5d2;
    border-radius:8px;
    background:#f5fafc;
    color:var(--checkout-primary);
    cursor:pointer;
    font-size:11px;
    font-weight:800;
}

.checkout-summary__items{
    padding:6px 0;
}

.checkout-summary__details{
    margin-top:8px;
    padding:13px 0;
    border-top:1px solid #dce6ec;
    border-bottom:1px solid #dce6ec;
}

.checkout-summary__details > div{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
    color:#506a7c;
    font-size:12px;
}

.checkout-summary__details > div + div{
    margin-top:9px;
}

.checkout-summary__details strong{
    max-width:62%;
    color:#17384e;
    text-align:right;
}

.checkout-summary-item{
    display:grid;
    grid-template-columns:46px 1fr auto;
    gap:11px;
    align-items:center;
    padding:13px 0;
    border-bottom:1px solid #edf1f4;
}

.checkout-summary-item__image{
    position:relative;
    width:46px;
    height:46px;
    display:grid;
    place-items:center;
    overflow:hidden;
    border-radius:9px;
    background:#f0f4f6;
    font-size:21px;
}

.checkout-summary-item__image img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    padding:4px;
    object-fit:contain;
    background:#f7f9fa;
}

.checkout-summary-item h4{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#18384e;
    font-size:12px;
}

.checkout-summary-item small{
    display:block;
    margin-top:3px;
    color:#607889;
    font-size:10px;
}

.checkout-summary-item > strong{
    color:var(--checkout-dark);
    font-size:12px;
}

.checkout-summary__totals{
    padding:14px 0;
}

.checkout-summary__totals > div{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:9px;
    color:#506a7c;
    font-size:12px;
}

.checkout-summary__totals > div strong{
    color:var(--checkout-ink);
}

.checkout-summary__totals .checkout-summary__total{
    margin:14px 0 0;
    padding-top:13px;
    border-top:1px dashed #ccdbe4;
    color:var(--checkout-ink);
    font-size:15px;
    font-weight:850;
}

.checkout-summary__total strong{
    color:var(--checkout-action)!important;
    font-size:25px;
}

.checkout-confirm{
    width:100%;
    min-height:54px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:11px;
    border:0;
    border-radius:11px;
    background:linear-gradient(100deg,var(--checkout-action-dark),var(--checkout-action));
    box-shadow:0 10px 24px rgba(7,63,120,.24);
    color:#fff;
    cursor:pointer;
    font-size:14px;
    font-weight:850;
}

.checkout-confirm:disabled,
.checkout-mobile-next:disabled{
    cursor:wait;
    opacity:.7;
}

.checkout-security{
    display:flex;
    justify-content:center;
    gap:6px;
    margin-top:11px;
    color:#617887;
    font-size:10px;
    line-height:1.4;
    text-align:center;
}

.checkout-security span{
    color:#1e9c5a;
}

.checkout-mobile-footer{
    display:none;
}

/* Confirmação do pedido */

.order-success-dialog{
    position:fixed;
    inset:0;
    width:min(460px,calc(100% - 30px));
    max-height:calc(100dvh - 30px);
    margin:auto;
    padding:34px;
    overflow-y:auto;
    border:0;
    border-radius:24px;
    background:#fff;
    box-shadow:0 28px 90px rgba(6,34,55,.3);
    color:#17384e;
    text-align:center;
}

.order-success-dialog[open]{
    display:block;
}

.order-success-dialog::backdrop{
    background:rgba(6,24,39,.68);
    backdrop-filter:blur(5px);
}

.order-success-check{
    width:66px;
    height:66px;
    display:grid;
    place-items:center;
    margin:0 auto 16px;
    border-radius:50%;
    background:#e9f7ef;
    color:#16824c;
    font-size:32px;
    font-weight:900;
}

.order-success-dialog > small{
    color:#0b5cab;
    font-size:11px;
    font-weight:850;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.order-success-dialog h2{
    margin-top:7px;
    color:#102b40;
    font-size:28px;
    letter-spacing:-.035em;
}

.order-success-dialog > p{
    max-width:350px;
    margin:10px auto 0;
    color:#597182;
    font-size:13px;
    line-height:1.55;
}

.order-success-code{
    margin-top:22px;
    padding:15px;
    border:1px dashed #9bb5c6;
    border-radius:13px;
    background:#f4f8fb;
}

.order-success-code span,
.order-success-info span{
    display:block;
    color:#647c8c;
    font-size:10px;
    font-weight:750;
    text-transform:uppercase;
}

.order-success-code strong{
    display:block;
    margin-top:5px;
    color:#0b5cab;
    font-size:22px;
    letter-spacing:.03em;
}

.order-success-info{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin-top:12px;
}

.order-success-info > div{
    padding:12px;
    border-radius:11px;
    background:#f4f7f9;
}

.order-success-info strong{
    display:block;
    margin-top:5px;
    color:#17384e;
    font-size:13px;
}

.order-success-button{
    width:100%;
    min-height:52px;
    margin-top:18px;
    border:0;
    border-radius:12px;
    background:linear-gradient(100deg,#073f78,#0b5cab);
    color:#fff;
    cursor:pointer;
    font-size:14px;
    font-weight:850;
}

/* 24/09/2026 -- agradecimento, contagem e marca discreta */
.order-success-thanks{
    margin:16px 0 0;
    color:var(--ink);
    font-size:16px;
    font-weight:800;
    text-align:center;
}

.order-success-countdown{
    display:block;
    min-height:16px;
    margin-top:10px;
    color:#6f818e;
    font-size:12px;
    text-align:center;
}

.order-success-brand{
    margin:18px -10px -12px;
    padding-top:12px;
    border-top:1px solid #e5ebef;
    color:#9aa7b1;
    font-size:10.5px;
    letter-spacing:.02em;
    text-align:center;
}

/* Product details */

.product-dialog{
    width:min(780px,calc(100% - 32px));
    max-height:min(650px,calc(100vh - 40px));
    padding:0;
    overflow:hidden;
    border:0;
    border-radius:27px;
    background:#fff;
    box-shadow:0 30px 100px rgba(0,0,0,.26);
}

.product-dialog[open]{
    display:grid;
    grid-template-columns:1fr 1fr;
}

.product-dialog::backdrop{
    background:rgba(13,18,26,.58);
    backdrop-filter:blur(4px);
}

.dialog-close{
    position:absolute;
    top:16px;
    right:16px;
    z-index:3;
}

.dialog-product-image{
    position:relative;
    min-height:460px;
    display:grid;
    place-items:center;
    background:linear-gradient(145deg,#fafafa,#eceeef);
    font-size:110px;
}

.dialog-product-image img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    max-height:460px;
    padding:48px;
    object-fit:contain;
}

.dialog-product-content{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:58px 42px 42px;
}

.dialog-category{
    color:var(--primary-dark);
    font-size:10px;
    font-weight:850;
    letter-spacing:.1em;
    text-transform:uppercase;
}

.dialog-product-content h2{
    margin-top:11px;
    font-size:31px;
    line-height:1.1;
    letter-spacing:-.045em;
}

.dialog-product-content > p{
    margin-top:15px;
    color:var(--muted);
    font-size:13px;
    line-height:1.65;
}

.dialog-buy-row{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:20px;
    margin-top:40px;
    padding-top:22px;
    border-top:1px solid var(--line);
}

.dialog-buy-row > div{
    display:flex;
    flex-direction:column;
    gap:4px;
}

.dialog-buy-row small{
    color:var(--muted);
    font-size:10px;
}

.dialog-buy-row strong{
    font-size:27px;
    letter-spacing:-.04em;
}

/* 25/09/2026 — quantidade (− / +) e total na tela do produto */
.dialog-buy-row > .dialog-qty{
    flex-direction:row;
    align-items:center;
    gap:14px;
}

.dialog-qty__btn{
    width:44px;
    height:44px;
    border:0;
    border-radius:50%;
    color:#fff;
    cursor:pointer;
    font-size:24px;
    font-weight:800;
    line-height:1;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 4px 10px rgba(0,0,0,.12);
}

.dialog-qty__btn--menos{
    background:#d93025;
}

.dialog-qty__btn--mais{
    background:#1e8e3e;
}

.dialog-qty__btn:disabled{
    cursor:not-allowed;
    opacity:.35;
}

.dialog-qty__valor{
    min-width:34px;
    color:var(--ink);
    font-size:22px;
    font-weight:800;
    text-align:center;
}

/* 25/09/2026 (5.3) — lembrar dados do cliente */
.checkout-remember{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
    gap:8px 16px;
    margin-top:14px;
}

.checkout-remember__check{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:#34576e;
    cursor:pointer;
    font-size:13px;
    font-weight:600;
}

.checkout-remember__check input{
    width:18px;
    height:18px;
    accent-color:var(--primary);
}

.checkout-remember__clear{
    padding:0;
    border:0;
    background:none;
    color:#b42318;
    cursor:pointer;
    font-size:12px;
    font-weight:700;
    text-decoration:underline;
}

.checkout-remember__clear[hidden]{
    display:none;
}

/* 25/09/2026 (5.2) — observação por item */
.dialog-note{
    display:flex;
    flex-direction:column;
    gap:6px;
    margin-top:16px;
    color:var(--muted);
    font-size:12px;
    font-weight:700;
}

.dialog-note textarea{
    width:100%;
    padding:10px 12px;
    border:1.5px solid var(--line);
    border-radius:12px;
    color:var(--ink);
    font:inherit;
    font-size:14px;
    font-weight:500;
    resize:none;
}

.dialog-note textarea:focus{
    border-color:var(--primary);
    outline:none;
}

.cart-item__obs,
.checkout-summary-item__obs{
    display:block;
    margin-top:2px;
    color:#7a5a00;
    font-size:11.5px;
    font-style:italic;
    line-height:1.3;
    overflow-wrap:anywhere;
}

.dialog-total-row{
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    margin-top:14px;
    color:var(--muted);
    font-size:14px;
}

.dialog-total-row strong{
    color:#0b5cab;
    font-size:22px;
}

.dialog-add-button{
    width:100%;
    margin-top:14px;
}

/* Feedback and mobile navigation */

.toast{
    position:fixed;
    left:50%;
    bottom:24px;
    z-index:120;
    max-width:calc(100% - 32px);
    padding:12px 17px;
    border-radius:13px;
    background:var(--ink);
    box-shadow:0 15px 35px rgba(0,0,0,.2);
    color:#fff;
    font-size:12px;
    font-weight:700;
    opacity:0;
    pointer-events:none;
    transform:translate(-50%,18px);
    transition:.25s ease;
}

.toast.show{
    opacity:1;
    transform:translate(-50%,0);
}

.mobile-menu{
    display:none;
}

@media(max-width:1040px){
    .desktop-nav,
    .delivery-location{
        display:none;
    }

    .header-actions{
        margin-left:auto;
    }

    .hero{
        grid-template-columns:1fr .75fr;
    }

    .hero-copy{
        padding-left:42px;
    }

    .showcase-bag{
        right:40px;
    }

    .floating-card--bottom{
        right:210px;
    }

    .catalog-grid{
        grid-template-columns:repeat(4,minmax(0,1fr));
    }
}

@media(max-width:760px){
    body{
        padding-bottom:74px;
    }

    .shell{
        width:calc(100% - 30px);
    }

    .site-header{
        padding:10px 0 11px;
    }

    .header-main{
        min-height:43px;
    }

    .brand{
        gap:9px;
    }

    .brand-mark{
        width:39px;
        height:39px;
        border-radius:12px;
        font-size:19px;
    }

    .brand-copy strong{
        max-width:178px;
        font-size:14px;
    }

    .brand-copy span{
        margin-top:4px;
        font-size:9px;
    }

    .account-button{
        display:none;
    }

    .cart-button{
        width:41px;
        height:41px;
        justify-content:center;
        padding:0;
        border-radius:12px;
    }

    .cart-label{
        display:none;
    }

    .cart-count{
        position:absolute;
        top:-5px;
        right:-5px;
        min-width:19px;
        height:19px;
        border:2px solid #fff;
        font-size:9px;
    }

    .search-row{
        margin-top:10px;
    }

    .search-box{
        height:44px;
        border-radius:13px;
    }

    .search-box input{
        font-size:12px;
    }

    .search-box kbd,
    .filter-button b{
        display:none;
    }

    .filter-button{
        width:44px;
        height:44px;
        justify-content:center;
        padding:0;
        border-radius:13px;
    }

    .hero{
        min-height:245px;
        grid-template-columns:1fr;
        margin-top:14px;
        border-radius:24px;
    }

    .hero-copy{
        padding:28px 24px;
    }

    .eyebrow{
        padding:5px 8px;
        font-size:8px;
    }

    .hero h1{
        max-width:290px;
        margin-top:13px;
        font-size:36px;
    }

    .hero-copy > p{
        max-width:270px;
        margin-top:12px;
        font-size:12px;
        line-height:1.45;
    }

    .hero-actions{
        margin-top:18px;
    }

    .primary-button{
        min-height:42px;
        padding:0 15px;
        border-radius:12px;
        font-size:11px;
    }

    .delivery-promise,
    .hero-showcase{
        display:none;
    }

    .content-section{
        padding-top:39px;
    }

    .section-heading{
        align-items:center;
        gap:14px;
        margin-bottom:16px;
    }

    .section-heading h2{
        margin-top:4px;
        font-size:22px;
    }

    .section-kicker{
        font-size:8px;
    }

    .text-button{
        font-size:10px;
    }

    .categories-list{
        width:calc(100% + 15px);
        gap:13px;
        margin-right:-15px;
    }

    .category-card{
        min-width:92px;
        gap:8px;
        padding:0;
    }

    .category-card:hover,
    .category-card.active{
        box-shadow:none;
    }

    .category-icon{
        width:84px;
        height:84px;
        font-size:32px;
    }

    .category-card > span:last-child{
        max-width:90px;
        font-size:10px;
    }

    .benefit-strip{
        display:flex;
        margin-top:28px;
        overflow-x:auto;
        border-radius:17px;
        scrollbar-width:none;
    }

    .benefit-strip > div{
        min-width:225px;
        padding:15px 17px;
    }

    .benefit-strip > div + div{
        border-left:1px solid var(--line);
    }

    .product-row{
        width:calc(100% + 15px);
        gap:11px;
        margin-right:-15px;
    }

    .product-card{
        min-width:166px;
        width:166px;
        border-radius:17px;
    }

    .emoji-produto{
        font-size:52px;
    }

    .favorite-button{
        top:8px;
        right:8px;
        width:29px;
        height:29px;
        font-size:14px;
    }

    .discount-badge{
        top:8px;
        left:8px;
        padding:4px 6px;
        font-size:8px;
    }

    .product-content{
        padding:11px 11px 13px;
    }

    .product-card h3{
        min-height:34px;
        font-size:11px;
    }

    .price-block{
        min-height:39px;
        margin-top:6px;
    }

    .price-current{
        font-size:16px;
    }

    .add-button{
        right:10px;
        bottom:11px;
        width:32px;
        height:32px;
        border-radius:10px;
        font-size:18px;
    }

    .catalog-section{
        padding-bottom:44px;
    }

    .sort-button{
        display:none;
    }

    .catalog-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:10px;
    }

    .catalog-grid .product-card{
        min-width:0;
        width:100%;
    }

    .site-footer{
        display:none;
    }

    .mobile-menu{
        position:fixed;
        right:0;
        bottom:0;
        left:0;
        z-index:60;
        height:68px;
        display:grid;
        grid-template-columns:repeat(4,1fr);
        padding:7px 8px calc(7px + env(safe-area-inset-bottom));
        border-top:1px solid var(--line);
        background:rgba(255,255,255,.96);
        box-shadow:0 -10px 35px rgba(31,41,55,.08);
        backdrop-filter:blur(15px);
    }

    .mobile-menu button{
        position:relative;
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
        gap:2px;
        border:0;
        border-radius:11px;
        background:transparent;
        color:#8a9099;
        cursor:pointer;
    }

    .mobile-menu button.active{
        color:var(--primary-dark);
    }

    .mobile-menu button > span{
        font-size:20px;
        line-height:1;
    }

    .mobile-menu small{
        font-size:8px;
        font-weight:750;
    }

    .mobile-cart-count{
        position:absolute;
        top:0;
        left:calc(50% + 7px);
        min-width:16px;
        height:16px;
        display:grid;
        place-items:center;
        padding:0 4px;
        border-radius:999px;
        background:var(--danger);
        color:#fff;
        font-size:8px;
    }

    .cart-drawer{
        top:auto;
        width:100%;
        max-height:92vh;
        border-radius:25px 25px 0 0;
        transform:translateY(105%);
    }

    body.drawer-open .cart-drawer{
        transform:translateY(0);
    }

    .cart-drawer__header{
        padding:19px 18px;
    }

    .cart-items{
        min-height:170px;
        padding:6px 18px 16px;
    }

    .cart-summary{
        padding:17px 18px calc(20px + env(safe-area-inset-bottom));
    }

    .checkout-dialog{
        width:100%;
        height:100dvh;
        max-width:none;
        max-height:none;
        margin:0;
        border-radius:0;
    }

    .checkout-topbar{
        min-height:64px;
        padding:10px 15px;
    }

    .checkout-brand__mark{
        width:40px;
        height:40px;
    }

    .checkout-brand strong{
        font-size:16px;
    }

    .checkout-progress{
        justify-content:center;
        min-height:52px;
        gap:7px;
        padding:8px 12px;
        overflow-x:auto;
    }

    .checkout-progress i{
        width:18px;
    }

    .checkout-progress span{
        min-width:max-content;
        gap:5px;
        font-size:10px;
    }

    .checkout-progress span b{
        width:25px;
        height:25px;
    }

    .checkout-layout{
        height:calc(100dvh - 116px);
        max-height:none;
        display:block;
        overflow-y:auto;
        padding-bottom:88px;
    }

    .checkout-fields{
        overflow:visible;
        padding:13px;
    }

    .checkout-section{
        padding:18px;
    }

    .checkout-section__heading h3{
        font-size:18px;
    }

    .checkout-section__heading p{
        font-size:12px;
    }

    .checkout-field > span{
        font-size:11px;
    }

    .checkout-field input,
    .checkout-field textarea{
        min-height:50px;
        font-size:16px;
    }

    .checkout-field-grid,
    .checkout-field-grid--address{
        grid-template-columns:1fr;
    }

    .checkout-field--cep,
    .checkout-field--number{
        max-width:none;
    }

    .checkout-options--payment{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .checkout-options--payment .checkout-option__content{
        min-height:92px;
        grid-template-columns:36px minmax(0,1fr);
        column-gap:9px;
        padding:12px 10px;
    }

    .checkout-options--payment .checkout-option__content b{
        width:36px;
        height:36px;
        font-size:12px;
    }

    .checkout-options--payment .checkout-option__content strong{
        font-size:13px;
    }

    .checkout-options--payment .checkout-option__content small{
        font-size:10px;
    }

    .checkout-summary{
        overflow:visible;
        margin:13px;
        padding:19px;
        border:1px solid #c6d5de;
        border-radius:16px;
    }

    .checkout-layout[data-mobile-step="1"] [data-checkout-step]:not([data-checkout-step="1"]),
    .checkout-layout[data-mobile-step="2"] [data-checkout-step]:not([data-checkout-step="2"]),
    .checkout-layout[data-mobile-step="3"] [data-checkout-step]:not([data-checkout-step="3"]){
        display:none!important;
    }

    .checkout-layout[data-mobile-step="3"] .checkout-fields{
        display:none;
    }

    .checkout-summary .checkout-confirm,
    .checkout-summary .checkout-security{
        display:none;
    }

    .checkout-mobile-footer{
        position:fixed;
        right:0;
        bottom:0;
        left:0;
        z-index:6;
        min-height:76px;
        display:grid;
        grid-template-columns:minmax(88px,1fr) auto;
        align-items:center;
        gap:10px;
        padding:10px 13px calc(10px + env(safe-area-inset-bottom));
        border-top:1px solid #b9cad5;
        background:#fff;
        box-shadow:0 -8px 24px rgba(14,47,70,.13);
    }

    .checkout-mobile-footer > div:first-child{
        display:flex;
        flex-direction:column;
        gap:2px;
    }

    .checkout-mobile-footer small{
        color:#536c7e;
        font-size:10px;
        font-weight:750;
    }

    .checkout-mobile-footer strong{
        color:var(--checkout-action);
        font-size:20px;
        letter-spacing:-.03em;
    }

    .checkout-mobile-actions{
        display:flex;
        gap:8px;
    }

    .checkout-mobile-actions button{
        min-height:48px;
        padding:0 16px;
        border-radius:11px;
        cursor:pointer;
        font-size:13px;
        font-weight:850;
    }

    .checkout-mobile-back{
        border:1px solid #b6c8d4;
        background:#f4f8fa;
        color:#315268;
    }

    .checkout-mobile-next{
        min-width:130px;
        border:0;
        background:linear-gradient(100deg,var(--checkout-action-dark),var(--checkout-action));
        color:#fff;
        box-shadow:0 7px 18px rgba(7,63,120,.25);
    }

    .checkout-layout[data-mobile-step="1"] .checkout-mobile-back{
        display:none;
    }

    .order-success-dialog{
        width:calc(100% - 26px);
        max-height:calc(100dvh - 26px);
        margin:auto;
        padding:28px 20px 24px;
        border-radius:22px;
    }

    .order-success-dialog h2{
        font-size:26px;
    }

    .product-dialog{
        width:100%;
        max-width:none;
        max-height:94vh;
        margin:auto 0 0;
        border-radius:26px 26px 0 0;
    }

    .product-dialog[open]{
        grid-template-columns:1fr;
    }

    .dialog-product-image{
        min-height:260px;
        max-height:38vh;
        font-size:80px;
    }

    .dialog-product-image img{
        max-height:38vh;
        padding:28px;
    }

    .dialog-product-content{
        padding:25px 20px calc(23px + env(safe-area-inset-bottom));
    }

    .dialog-product-content h2{
        font-size:24px;
    }

    .dialog-buy-row{
        margin-top:24px;
    }

    .toast{
        bottom:82px;
    }
}

@media(max-width:390px){
    .brand-copy strong{
        max-width:145px;
    }

    .hero h1{
        font-size:32px;
    }

    .catalog-grid{
        gap:8px;
    }

    .dialog-buy-row{
        align-items:center;
        flex-direction:row;
    }
}

@media(prefers-reduced-motion:reduce){
    html{
        scroll-behavior:auto;
    }

    *,
    *::before,
    *::after{
        scroll-behavior:auto!important;
        transition:none!important;
    }
}

/* ============================================================================
   25/09/2026 (5.5c) — situação da loja: fechada / somente retirada
   ============================================================================ */
.store-status{
    display:flex;
    align-items:center;
    gap:14px;
    margin-top:14px;
    padding:14px 18px;
    border-radius:14px;
    border:2px solid transparent;
    font-size:14px;
    line-height:1.4;
}

.store-status[hidden]{
    display:none!important;
}

.store-status__icon{
    flex:0 0 auto;
    font-size:28px;
}

.store-status__text{
    display:flex;
    flex-direction:column;
    gap:2px;
    flex:1 1 auto;
}

.store-status__text strong{
    font-size:16px;
}

.store-status__link{
    flex:0 0 auto;
    padding:9px 14px;
    border:1.5px solid currentColor;
    border-radius:10px;
    background:#fff;
    color:inherit;
    cursor:pointer;
    font-size:13px;
    font-weight:800;
}

.store-status__link[hidden]{
    display:none;
}

.store-status--fechada{
    border-color:#d93025;
    background:#fde3e0;
    color:#a50e0e;
}

.store-status--retirada{
    border-color:#e0a100;
    background:#fff7e0;
    color:#7a4b00;
}

@media (max-width:640px){
    .store-status{
        flex-wrap:wrap;
        padding:12px 14px;
    }
    .store-status__link{
        width:100%;
    }
}

/* aviso da 1ª inclusão no carrinho: tom neutro (não é erro) */
.store-status-dialog{
    border-top-color:#e0a100;
}

.store-status-dialog .delivery-alert-icon{
    background:#fff7e0;
    font-size:30px;
}

.store-status-dialog h2{
    color:#7a4b00;
}

.store-status-dialog .delivery-alert-primary{
    background:var(--primary);
}

.store-status-dialog .delivery-alert-secondary[hidden]{
    display:none;
}

/* quadro de horários */
.hours-dialog{
    border-top-color:var(--primary);
    text-align:left;
}

.hours-dialog h2{
    color:var(--primary-dark);
    text-align:center;
}

.hours-list{
    margin:0 0 18px;
    padding:0;
    list-style:none;
}

.hours-list li{
    display:flex;
    justify-content:space-between;
    gap:12px;
    padding:9px 4px;
    border-bottom:1px solid #eceff2;
    font-size:14px;
}

.hours-list li.hoje{
    font-weight:800;
    color:var(--primary-dark);
}

.hours-list li.fechado strong{
    color:#9aa3ab;
    font-weight:600;
}

.hours-dialog .delivery-alert-primary{
    background:var(--primary);
}

/* opção Entrega indisponível no checkout */
.checkout-option--indisponivel{
    opacity:.5;
    cursor:not-allowed;
}