:root{

--bg:#fff8f5;
--card:#ffffff;

--text:#121212;
--text-light:#6d6d6d;

--red:#d42027;
--red-hover:#bc1d23;

--border:#f0e3dc;

--radius-xs:12px;
--radius-sm:18px;
--radius-md:24px;
--radius-lg:32px;

--shadow:
0 10px 30px rgba(0,0,0,.06);

--container:1360px;

}

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

html{
scroll-behavior:smooth;
min-height:100%;
}

body{
min-height:100vh;
background:var(--bg);
font-family:
Inter,
system-ui,
sans-serif;

color:var(--text);

overflow-x:hidden;
display:flex;
flex-direction:column;
}

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

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

button{
font-family:inherit;
cursor:pointer;
border:none;
}

.mobile-header-phone{
display:none;
}

/* Final responsive overrides */
@media(max-width:820px){
.mobile-menu{
z-index:30000;
}
.mobile-menu-panel{
z-index:30001;
}
.desktop-nav,
.header-phone{
display:none;
}
.yoko-header .header-inner{
display:grid;
grid-template-columns:52px minmax(0,1fr) 52px;
align-items:center;
height:82px;
gap:10px;
}
.yoko-header .brand-logo-link{
grid-column:2;
justify-self:center;
min-width:0;
}
.yoko-header .brand-logo-badge{
height:60px;
min-width:156px;
padding:9px 15px;
border-radius:18px;
}
.yoko-header .brand-logo-badge img{
height:39px;
max-width:138px;
}
.yoko-header .brand-copy{
display:none;
}
.header-actions{
display:contents;
}
.yoko-header .cart-button{
display:none;
}
.mobile-header-phone{
grid-column:3;
justify-self:end;
width:50px;
height:50px;
border-radius:16px;
display:grid;
place-items:center;
background:linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.055));
border:1px solid rgba(255,255,255,.12);
box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 28px rgba(0,0,0,.14);
}
.mobile-header-phone .header-phone-icon{
width:38px;
height:38px;
border-radius:13px;
box-shadow:0 8px 20px rgba(212,32,39,.24);
}
.burger-button{
display:flex;
grid-column:1;
justify-self:start;
background:linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.055));
border:1px solid rgba(255,255,255,.12);
box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 28px rgba(0,0,0,.14);
}
.header-inner{
gap:12px;
}
.site-footer{
padding:34px 0 104px;
}
.site-footer-inner{
grid-template-columns:1fr;
align-items:stretch;
gap:14px;
padding-left:18px;
padding-right:18px;
max-width:100%;
}
.site-footer-brand{
grid-column:auto;
min-width:0;
padding-bottom:4px;
}
.site-footer-inner nav,
.site-footer-links{
grid-column:auto;
grid-template-columns:1fr 1fr;
}
}

@media(max-width:640px){
.account-top{
align-items:flex-start;
flex-direction:column;
margin-bottom:22px;
}

.delivery-modal{
position:fixed;
inset:0;
display:none;
align-items:center;
justify-content:center;
padding:18px;
background:rgba(18,18,18,.58);
backdrop-filter:blur(12px);
z-index:30050;
}

.delivery-modal.active{
display:flex;
}

.delivery-modal-card{
width:min(460px,100%);
max-height:min(680px,calc(100dvh - 36px));
overflow:auto;
padding:24px;
border:1px solid rgba(25,20,18,.08);
border-radius:28px;
background:#fff;
box-shadow:0 26px 80px rgba(25,20,18,.24);
position:relative;
}

.delivery-close{
position:absolute;
top:14px;
right:14px;
width:42px;
height:42px;
border-radius:14px;
background:#f7f2ef;
color:var(--text);
font-size:25px;
font-weight:900;
box-shadow:none;
}

.delivery-modal-card h2{
max-width:calc(100% - 52px);
margin:0 0 8px;
font-size:30px;
line-height:1.05;
font-weight:900;
letter-spacing:0;
}

.delivery-modal-card p{
margin:0 0 18px;
color:var(--text-light);
font-size:15px;
line-height:1.5;
}

.delivery-methods{
display:grid;
gap:10px;
}

.delivery-method{
min-height:74px;
padding:14px 16px;
border:1px solid rgba(25,20,18,.08);
border-radius:18px;
background:#fff;
color:var(--text);
text-align:left;
box-shadow:0 10px 28px rgba(25,20,18,.06);
}

.delivery-method:hover{
border-color:rgba(212,32,39,.24);
background:#fff7f4;
box-shadow:0 14px 34px rgba(212,32,39,.1);
}

.delivery-method:first-child{
border-color:var(--red);
background:linear-gradient(135deg,var(--red),#f0444b);
color:#fff;
box-shadow:0 18px 38px rgba(212,32,39,.2);
}

.delivery-method:first-child .delivery-method-price,
.delivery-method:first-child .delivery-method-meta{
color:rgba(255,255,255,.88);
}

.delivery-method-title{
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
font-size:17px;
font-weight:900;
}

.delivery-method-price{
color:var(--red);
white-space:nowrap;
}

.delivery-method-meta{
display:block;
margin-top:6px;
color:var(--text-light);
font-size:13px;
line-height:1.4;
}
.account-top .logout-btn{
width:100%;
}
.account-bonus-panel{
grid-template-columns:1fr;
padding:22px;
border-radius:22px;
}
.account-bonus-panel h2{
font-size:26px;
}
.menu-toolbar{
grid-template-columns:auto minmax(0,1fr);
}
.menu-toolbar .search-toggle{
display:none;
}
.menu-toolbar .search-box,
.menu-toolbar.search-open .search-box{
display:block;
width:100%;
opacity:1;
pointer-events:auto;
}
.category-links{
grid-column:1 / -1;
}
.menu-toolbar > .cart-button.menu-cart-button{
display:none;
}
.site-footer-inner{
grid-template-columns:1fr;
gap:14px;
padding-left:16px;
padding-right:16px;
}
.site-footer-brand{
grid-template-columns:1fr;
gap:12px;
min-width:0;
}
.site-footer-brand .brand-logo-link{
grid-row:auto;
width:100%;
min-width:0;
display:grid;
grid-template-columns:1fr;
justify-items:start;
}
.site-footer-info{
padding:14px 16px;
border-radius:16px;
width:100%;
min-width:0;
}
.site-footer-inner nav,
.site-footer-links{
display:grid;
grid-template-columns:1fr 1fr;
gap:10px;
width:100%;
min-width:0;
}
.site-footer-inner nav a,
.site-footer-links a{
text-align:center;
min-width:0;
padding-left:10px;
padding-right:10px;
}
}

@media(max-width:1100px){
.account-favorite-products{
grid-template-columns:repeat(3,minmax(0,1fr));
}
}

@media(max-width:820px){
.account-favorite-products{
grid-template-columns:repeat(2,minmax(0,1fr));
}

.account-orders-grid{
grid-template-columns:repeat(2,minmax(0,1fr));
}

.product-modal-card{
grid-template-columns:1fr;
height:min(760px,90vh);
overflow:auto;
}

.product-modal-image img{
height:280px;
}

.product-modal-content{
overflow:visible;
padding:30px;
}

.product-modal-content h2{
font-size:34px;
}

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

@media(max-width:640px){
.account-favorite-products{
grid-template-columns:1fr;
}

.account-orders-grid{
grid-template-columns:1fr;
}

.account-favorite-card .product-image{
width:112px;
height:112px;
}

.favorite-remove-btn{
top:8px;
left:8px;
right:auto;
width:34px;
height:34px;
border-radius:12px;
font-size:22px;
}

.product-modal,
.delivery-modal{
padding:14px;
}

.product-modal-content{
padding:24px;
}

.product-modal-content h2{
font-size:30px;
}

.close-modal,
.delivery-close{
top:14px;
right:14px;
}

.option-choice{
align-items:flex-start;
flex-direction:column;
}

.option-choice-meta{
white-space:normal;
}

.auth-modal{
padding:14px;
align-items:flex-end;
}

.auth-card{
max-width:none;
padding:28px 20px 22px;
border-radius:26px;
}

.auth-close{
top:14px;
right:14px;
}

.auth-mark{
width:48px;
height:48px;
margin-bottom:14px;
}

.auth-steps{
top:24px;
left:82px;
}

.auth-card h2{
font-size:28px;
padding-right:42px;
}

.auth-card p{
font-size:14px;
margin-bottom:18px;
}

.auth-code-grid{
gap:6px;
}

.auth-code-grid input{
height:50px;
font-size:21px;
border-radius:14px;
}

.auth-code-actions{
align-items:flex-start;
flex-direction:column;
gap:6px;
}
}

@media(max-width:992px){
.account-bonus-panel{
grid-template-columns:1fr;
}
}

@media(max-width:640px){
.account-top{
align-items:flex-start;
flex-direction:column;
margin-bottom:22px;
}
.account-top .logout-btn{
width:100%;
}
.account-bonus-panel{
padding:22px;
border-radius:22px;
}
.account-bonus-panel h2{
font-size:26px;
}
}

.desktop-nav{
display:flex;
align-items:center;
gap:34px;
font-weight:800;
}
.desktop-nav a.active{
color:var(--red);
}
.header-actions{
display:flex;
align-items:center;
gap:12px;
}
.header-phone{
display:flex;
flex-direction:column;
align-items:flex-end;
gap:2px;
font-weight:900;
}
.header-phone span{
font-size:12px;
font-weight:800;
color:var(--text-light);
}
.burger-button{
display:none;
width:46px;
height:46px;
border-radius:14px;
background:linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.055));
border:1px solid rgba(255,255,255,.12);
box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 28px rgba(0,0,0,.14);
align-items:center;
justify-content:center;
flex-direction:column;
gap:5px;
}
.burger-button span{
width:20px;
height:2px;
border-radius:999px;
background:#fff;
}
.mobile-menu{
position:fixed!important;
inset:0;
z-index:30000;
background:rgba(0,0,0,.48);
backdrop-filter:blur(8px);
}
.mobile-menu-panel{
position:relative;
z-index:30001;
margin-left:auto;
width:min(360px,88vw);
height:100%;
padding:24px;
background:#fff;
display:flex;
flex-direction:column;
gap:24px;
box-shadow:-20px 0 60px rgba(0,0,0,.18);
}
body.mobile-menu-open{
overflow:hidden;
overflow-x:hidden;
touch-action:none;
}
.mobile-menu-close{
width:42px;
height:42px;
border-radius:14px;
background:#f2eee8;
font-size:28px;
font-weight:900;
flex:0 0 auto;
line-height:1;
}

.mobile-menu-head{
display:flex;
align-items:flex-start;
justify-content:space-between;
gap:14px;
}

.mobile-menu-head .brand-logo-link{
min-width:0;
gap:10px;
}

.mobile-menu-head .brand-logo-badge{
height:54px;
min-width:138px;
padding:8px 12px;
border-radius:16px;
}

.mobile-menu-head .brand-logo-badge img{
height:34px;
max-width:116px;
}

.mobile-menu-head .brand-copy{
display:grid;
max-width:150px;
}

.mobile-menu nav{
display:grid;
gap:8px;
font-size:20px;
font-weight:900;
min-height:0;
}
.mobile-menu nav a{
display:flex;
align-items:center;
justify-content:space-between;
padding:14px 16px;
border:1px solid var(--border);
border-radius:16px;
background:#fff8f5;
color:var(--text);
}
.mobile-menu nav a.active{
background:var(--red);
border-color:var(--red);
color:#fff;
}
.mobile-phone,
.mobile-menu-contact{
margin-top:4px;
}
.mobile-menu-contact{
display:grid;
gap:10px;
padding:12px;
border-radius:22px;
background:#151515;
color:#fff;
}

.mobile-contact-row{
display:grid;
grid-template-columns:42px minmax(0,1fr);
gap:12px;
align-items:center;
padding:10px;
border-radius:16px;
background:rgba(255,255,255,.07);
color:#fff;
}

.mobile-contact-icon{
width:42px;
height:42px;
border-radius:14px;
display:grid;
place-items:center;
background:linear-gradient(135deg,var(--red),#ff6b36);
color:#fff;
box-shadow:0 10px 24px rgba(212,32,39,.24);
}

.mobile-contact-icon svg{
width:18px;
height:18px;
fill:none;
stroke:currentColor;
stroke-width:2.2;
stroke-linecap:round;
stroke-linejoin:round;
}

.mobile-contact-row span:last-child{
display:grid;
gap:5px;
min-width:0;
}

.mobile-contact-row small{
font-size:11px;
font-weight:900;
text-transform:uppercase;
color:rgba(255,255,255,.58);
}

.mobile-contact-row strong{
font-size:17px;
font-weight:900;
overflow-wrap:anywhere;
}

.mobile-bottom-nav{
display:none;
}

.to-top-button{
position:fixed;
right:32px;
bottom:32px;
z-index:9000;
width:54px;
height:54px;
border-radius:18px;
display:grid;
place-items:center;
background:var(--red);
color:#fff;
box-shadow:0 18px 42px rgba(212,32,39,.28);
opacity:0;
visibility:hidden;
pointer-events:none;
transform:translateY(14px) scale(.94);
transition:opacity .22s ease,visibility .22s ease,transform .22s ease,background .22s ease,box-shadow .22s ease;
}

.to-top-button.visible{
opacity:1;
visibility:visible;
pointer-events:auto;
transform:translateY(0) scale(1);
}

.to-top-button:hover{
background:var(--red-hover);
transform:translateY(-2px) scale(1.02);
box-shadow:0 22px 48px rgba(212,32,39,.34);
}

.to-top-button svg{
width:24px;
height:24px;
fill:none;
stroke:currentColor;
stroke-width:2.4;
stroke-linecap:round;
stroke-linejoin:round;
}
.site-footer{
margin-top:auto;
padding:42px 0 40px;
border-top:1px solid rgba(255,255,255,.08);
background:
radial-gradient(circle at 14% 0,rgba(212,32,39,.18),transparent 34%),
linear-gradient(180deg,#1a1717,#101010);
color:#fff;
overflow:hidden;
}
.site-footer-inner{
display:grid;
grid-template-columns:minmax(260px,1.25fr) minmax(220px,.8fr) minmax(240px,.85fr) minmax(190px,.58fr);
align-items:center;
gap:16px;
font-weight:800;
min-width:0;
}
.site-footer-links{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:10px;
min-width:0;
}
.site-footer-links a{
min-height:52px;
display:grid;
place-items:center;
padding:10px 14px;
border:1px solid rgba(255,255,255,.12);
border-radius:16px;
color:rgba(255,255,255,.78);
background:rgba(255,255,255,.045);
transition:transform .22s ease,border-color .22s ease,background .22s ease,color .22s ease;
text-align:center;
min-width:0;
}
.site-footer-links a:hover{
transform:translateY(-1px);
border-color:rgba(255,255,255,.28);
color:#fff;
background:rgba(255,255,255,.09);
}
.site-footer-brand{
display:grid!important;
grid-template-columns:auto;
align-items:center;
min-width:0;
}
.site-footer .brand-logo-link{
min-width:0;
max-width:100%;
display:inline-grid;
justify-self:start;
}
.site-footer .brand-logo-badge{
background:linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.045));
border:1px solid rgba(255,255,255,.14);
box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 16px 34px rgba(0,0,0,.18);
min-width:164px;
max-width:100%;
}
.site-footer .brand-copy{
min-width:0;
}
.site-footer .brand-copy strong,
.site-footer .brand-copy small{
color:#fff;
}
.site-footer .brand-copy small{
color:rgba(255,255,255,.62);
}
.site-footer-info{
display:flex;
align-items:center;
gap:12px;
min-height:68px;
padding:11px 14px;
border:1px solid rgba(255,255,255,.12);
border-radius:18px;
background:linear-gradient(135deg,rgba(255,255,255,.10),rgba(255,255,255,.045));
box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
min-width:0;
color:#fff;
text-decoration:none;
transition:transform .22s ease,border-color .22s ease,background .22s ease;
}
.site-footer-info:hover{
transform:translateY(-1px);
border-color:rgba(255,255,255,.2);
background:linear-gradient(135deg,rgba(255,255,255,.13),rgba(255,255,255,.06));
}
.site-footer-icon{
width:42px;
height:42px;
border-radius:14px;
display:grid;
place-items:center;
flex:0 0 auto;
background:linear-gradient(135deg,var(--red),#ff6b36);
box-shadow:0 10px 24px rgba(212,32,39,.24);
color:#fff;
}
.site-footer-icon svg{
width:18px;
height:18px;
fill:none;
stroke:currentColor;
stroke-width:2.2;
stroke-linecap:round;
stroke-linejoin:round;
}
.site-footer-info div{
display:grid;
gap:5px;
min-width:0;
line-height:1;
}
.site-footer-info small{
color:rgba(255,255,255,.62);
font-size:12px;
font-weight:900;
text-transform:uppercase;
}
.site-footer-info strong,
.site-footer-info a{
color:#fff;
font-size:16px;
font-weight:900;
white-space:normal;
overflow-wrap:anywhere;
}

.site-footer-contact{
box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 14px 30px rgba(0,0,0,.12);
}
.site-footer-legal{
grid-column:1/-1;
display:flex;
flex-wrap:wrap;
align-items:center;
gap:8px 14px;
padding-top:18px;
margin-top:4px;
border-top:1px solid rgba(255,255,255,.10);
color:rgba(255,255,255,.58);
font-size:12px;
font-weight:800;
line-height:1.45;
min-width:0;
}
.site-footer-legal strong{
color:#fff;
font-size:13px;
font-weight:900;
}
.site-footer-legal span{
min-width:0;
overflow-wrap:anywhere;
}
.studio-credit{
display:inline-flex;
align-items:center;
justify-content:center;
gap:10px;
width:fit-content;
padding:10px 12px;
border-radius:999px;
border:1px solid rgba(255,255,255,.1);
background:rgba(255,255,255,.06);
color:rgba(255,255,255,.58);
text-decoration:none;
}
.studio-credit span{font-size:12px;font-weight:700;}
.studio-credit img{width:96px;height:auto;display:block;filter:brightness(0) invert(1);opacity:.94;}
.studio-credit:hover{background:rgba(255,255,255,.1);}
.payment-options label small{
display:block;
margin-top:4px;
color:var(--text-light);
font-size:12px;
font-weight:700;
}

@keyframes skeletonShimmer{
0%{background-position:140% 0}
100%{background-position:-140% 0}
}

.skeleton-title,
.skeleton-count,
.skeleton-product-image,
.skeleton-product-body span,
.skeleton-product-foot i,
.skeleton-product-foot b,
.skeleton-media,
.skeleton-stack span,
.skeleton-pill,
.summary-skeleton span{
background:linear-gradient(100deg,#ece7df 18%,#faf8f5 42%,#ece7df 68%);
background-size:240% 100%;
animation:skeletonShimmer 1.25s ease-in-out infinite;
}

.loading-category{
min-height:720px;
}

.skeleton-title{
width:220px;
height:44px;
border-radius:14px;
}

.skeleton-count{
width:82px;
height:24px;
border-radius:999px;
}

.loading-card{
min-height:0;
overflow:hidden;
background:#fff;
border-radius:28px;
box-shadow:var(--shadow);
display:flex;
flex-direction:column;
}

.skeleton-product-image{
width:100%;
aspect-ratio:1/1;
height:auto;
}

.skeleton-product-body{
padding:22px;
display:grid;
gap:14px;
}

.skeleton-product-body span{
height:18px;
border-radius:999px;
}

.skeleton-product-body span:first-child{
height:28px;
width:78%;
}

.skeleton-product-body span.short{
width:52%;
}

.skeleton-product-foot{
display:flex;
justify-content:space-between;
align-items:center;
gap:20px;
margin-top:28px;
}

.skeleton-product-foot i{
width:104px;
height:34px;
border-radius:999px;
}

.skeleton-product-foot b{
width:48px;
height:48px;
border-radius:16px;
}

.loading-list{
display:grid;
gap:16px;
}

.loading-item{
min-height:126px;
}

.skeleton-media{
width:116px;
height:96px;
border-radius:18px;
}

.skeleton-stack{
flex:1;
display:grid;
gap:12px;
}

.skeleton-stack span{
height:18px;
border-radius:999px;
}

.skeleton-stack span:first-child{
height:26px;
width:62%;
}

.skeleton-stack .short{
width:42%;
}

.skeleton-pill{
width:116px;
height:44px;
border-radius:14px;
}

.summary-skeleton{
display:grid;
gap:16px;
}

.summary-skeleton span{
height:18px;
border-radius:999px;
}

.summary-skeleton span:first-child{
height:30px;
width:58%;
}

.summary-skeleton .wide{
height:54px;
border-radius:16px;
}

.checkout-count-loading,
.checkout-value-loading,
.checkout-loading-line i,
.checkout-loading-line span,
.checkout-loading-line b{
background:linear-gradient(100deg,#ece7df 18%,#faf8f5 42%,#ece7df 68%);
background-size:240% 100%;
animation:skeletonShimmer 1.25s ease-in-out infinite;
color:transparent;
}

.checkout-count-loading{
display:inline-block;
width:86px;
height:20px;
border-radius:999px;
}

.checkout-value-loading{
display:inline-block;
width:86px;
height:22px;
border-radius:999px;
}

.checkout-loading-list{
display:grid;
gap:12px;
min-height:258px;
}

.checkout-loading-line{
display:grid;
grid-template-columns:70px minmax(0,1fr) 76px;
gap:12px;
align-items:center;
min-height:76px;
padding:10px;
border:1px solid var(--border);
border-radius:18px;
background:#fff;
}

.checkout-loading-line i{
width:58px;
height:58px;
border-radius:14px;
}

.checkout-loading-line span{
height:18px;
border-radius:999px;
}

.checkout-loading-line b{
height:24px;
border-radius:999px;
}

@media(max-width:820px){
.skeleton-title{
width:180px;
height:36px;
border-radius:12px;
}

.skeleton-count{
width:74px;
height:22px;
}

.skeleton-product-body{
padding:16px;
gap:12px;
}

.skeleton-product-body span:first-child{
height:24px;
}

.skeleton-product-foot{
margin-top:12px;
}

.skeleton-media{
width:92px;
height:92px;
border-radius:18px;
}

.skeleton-pill{
width:92px;
height:40px;
}
}

@media(max-width:640px){
.loading-category{
min-height:0;
}

.loading-card{
border-radius:18px;
padding:10px 8px 12px;
box-shadow:0 12px 30px rgba(25,20,18,.07);
}

.skeleton-product-image{
border-radius:0;
}

.skeleton-product-body{
width:100%;
padding:8px 2px 0;
gap:8px;
}

.skeleton-product-body span{
height:12px;
}

.skeleton-product-body span:first-child{
height:30px;
width:86%;
}

.skeleton-product-body span.short{
width:58%;
}

.skeleton-product-foot{
justify-content:center;
gap:8px;
margin-top:4px;
}

.skeleton-product-foot i{
width:68px;
height:30px;
}

.skeleton-product-foot b{
width:30px;
height:30px;
border-radius:999px;
}

.cart-item.loading-item{
grid-template-columns:78px minmax(0,1fr) 42px;
gap:12px;
min-height:118px;
}

.cart-item.loading-item .skeleton-media{
width:78px;
height:78px;
border-radius:17px;
}

.cart-item.loading-item .skeleton-stack{
gap:9px;
}

.cart-item.loading-item .skeleton-pill{
grid-column:2;
width:86px;
height:34px;
}

.checkout-loading-list{
min-height:0;
}

.checkout-loading-line{
grid-template-columns:56px minmax(0,1fr);
gap:10px;
min-height:70px;
padding:9px;
}

.checkout-loading-line i{
width:52px;
height:52px;
}

.checkout-loading-line b{
grid-column:2;
width:78px;
}

.account-loading-row{
height:156px;
}
}

.container{
width:100%;
max-width:var(--container);
margin:0 auto;
padding:0 32px;
}

/* ======================
HEADER
====================== */

.header{
position:static;

z-index:1000;

background:#161616;

backdrop-filter:
blur(20px);

border-bottom:
1px solid rgba(255,255,255,.08);
box-shadow:0 14px 40px rgba(0,0,0,.12);
}

.header-inner{

height:90px;

display:flex;
align-items:center;
justify-content:space-between;
gap:40px;
}

.logo{
display:flex;
align-items:center;
gap:14px;
}

.brand-logo-link{
min-width:0;
gap:12px;
}

.brand-logo-badge{
height:54px;
min-width:148px;
padding:9px 14px;
border-radius:16px;
background:linear-gradient(135deg,#191919,#2a1712);
display:inline-flex;
align-items:center;
justify-content:center;
box-shadow:0 14px 32px rgba(0,0,0,.16);
}

.brand-logo-badge img{
width:auto;
height:34px;
max-width:132px;
object-fit:contain;
}

.brand-copy{
display:grid;
gap:2px;
line-height:1.05;
}

.brand-copy strong{
font-size:24px;
font-weight:900;
letter-spacing:0;
}

.brand-copy small{
max-width:190px;
color:var(--text-light);
font-size:12px;
font-weight:800;
line-height:1.2;
}

.logo-mark{
width:44px;
height:44px;

border-radius:14px;

background:var(--red);

display:flex;
align-items:center;
justify-content:center;

color:#fff;

font-size:18px;
font-weight:800;
}

.logo-text{
font-size:26px;
font-weight:900;
letter-spacing:-1px;
}

.nav{
display:flex;
gap:36px;
}

.nav a{
font-weight:600;
color:rgba(255,255,255,.84);
transition:.25s;
}

.nav a:hover{
color:#fff;
}

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

.cart-button{
min-height:54px;
padding:8px 10px 8px 16px;
display:inline-flex;
align-items:center;
gap:10px;
border-radius:18px;
background:var(--red);
color:#fff;
font-weight:800;
box-shadow:0 12px 28px rgba(212,32,39,.22);
transition:.3s;
}

.cart-button:hover{
background:var(--red-hover);
transform:translateY(-1px);
box-shadow:0 16px 34px rgba(212,32,39,.28);
}

.cart-button-icon,
.cart-icon{
width:22px;
height:22px;
position:relative;
display:inline-block;
flex:0 0 auto;
background:currentColor;
-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 8h15l-2 8H8L6 4H3'/%3E%3Cpath d='M9 20h.01M18 20h.01'/%3E%3C/svg%3E") center/contain no-repeat;
mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 8h15l-2 8H8L6 4H3'/%3E%3Cpath d='M9 20h.01M18 20h.01'/%3E%3C/svg%3E") center/contain no-repeat;
}

.cart-button-icon::before,
.cart-icon::before{
content:none;
}

.cart-button-text{
line-height:1;
}

.cart-button-count{
min-width:34px;
height:34px;
padding:0 10px;
display:inline-flex;
align-items:center;
justify-content:center;
border-radius:12px;
background:#fff;
color:var(--red);
line-height:1;
}

.auth-modal{
position:fixed;
inset:0;
display:none;
align-items:center;
justify-content:center;
padding:24px;
background:rgba(0,0,0,.68);
z-index:12000;
}

.auth-modal.active{
display:flex;
}

.auth-card{
width:100%;
max-width:460px;
padding:34px;
border-radius:28px;
background:#fff;
box-shadow:0 24px 80px rgba(0,0,0,.24);
position:relative;
overflow:hidden;
}

.auth-close{
position:absolute;
top:16px;
right:16px;
width:38px;
height:38px;
border-radius:12px;
background:#fff1ea;
font-size:24px;
font-weight:800;
}

.auth-mark{
width:56px;
height:56px;
margin-bottom:18px;
border-radius:16px;
background:linear-gradient(135deg,var(--red),#ff6837);
color:#fff;
display:flex;
align-items:center;
justify-content:center;
font-weight:900;
font-size:22px;
box-shadow:0 14px 32px rgba(212,32,39,.24);
}

.auth-card h2{
font-size:30px;
line-height:1.1;
font-weight:900;
margin-bottom:10px;
}

.auth-card p{
color:var(--text-light);
line-height:1.55;
margin-bottom:22px;
}

.auth-form{
display:grid;
gap:14px;
}

.auth-form input{
height:54px;
padding:0 16px;
border:1px solid var(--border);
border-radius:16px;
font:inherit;
font-weight:800;
outline:none;
transition:border-color .18s ease,box-shadow .18s ease;
}

.auth-form input:focus{
border-color:var(--red);
box-shadow:0 0 0 4px rgba(212,32,39,.1);
}

.auth-error{
min-height:20px;
color:var(--red);
font-size:14px;
font-weight:700;
}

.auth-steps{
position:absolute;
top:28px;
left:104px;
display:flex;
gap:8px;
}

.auth-steps span{
width:8px;
height:8px;
border-radius:999px;
background:#f0deda;
transition:.18s ease;
}

.auth-steps span.active{
width:28px;
background:var(--red);
}

.auth-step{
display:none;
gap:14px;
}

.auth-step.active{
display:grid;
}

.auth-field{
display:grid;
gap:8px;
font-weight:900;
}

.auth-field span{
font-size:13px;
color:var(--text-light);
}

.auth-legal{
margin:0;
}

.auth-code-head{
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
font-weight:900;
}

.auth-back,
.auth-link-btn{
background:transparent;
color:var(--red);
font-weight:900;
}

.auth-code-grid{
display:grid;
grid-template-columns:repeat(6,minmax(0,1fr));
gap:8px;
}

.auth-code-grid input{
height:58px;
padding:0;
text-align:center;
font-size:24px;
font-weight:900;
border-radius:16px;
}

.auth-code-actions{
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
min-height:22px;
font-size:13px;
font-weight:800;
color:var(--text-light);
}

.auth-link-btn:disabled{
color:var(--text-light);
cursor:not-allowed;
opacity:.72;
}

.auth-main-btn{
width:100%;
}

.legal-check{
display:flex;
align-items:flex-start;
gap:12px;
padding:14px;
border:1px solid var(--border);
border-radius:16px;
background:#fff;
color:var(--text-light);
font-size:14px;
line-height:1.45;
font-weight:700;
}

.legal-check.compact{
padding:0;
border:0;
background:transparent;
font-size:13px;
}

.legal-check input{
width:20px;
height:20px;
margin-top:1px;
accent-color:var(--red);
flex:0 0 auto;
}

.legal-check a{
color:var(--red);
font-weight:900;
}

.cookie-notice{
position:fixed;
left:50%;
bottom:20px;
z-index:14000;
width:min(860px,calc(100% - 32px));
transform:translateX(-50%);
display:flex;
align-items:center;
justify-content:space-between;
gap:18px;
padding:16px 18px;
border:1px solid var(--border);
border-radius:20px;
background:rgba(255,255,255,.96);
box-shadow:0 18px 50px rgba(0,0,0,.16);
backdrop-filter:blur(18px);
}

.cookie-notice p{
margin:0;
color:var(--text-light);
font-size:14px;
line-height:1.45;
font-weight:700;
}

.cookie-notice a{
color:var(--red);
font-weight:900;
}

.cookie-notice button{
min-height:42px;
padding:0 18px;
border-radius:14px;
background:#121212;
color:#fff;
font-weight:900;
white-space:nowrap;
}

/* ======================
BUTTONS
====================== */

.btn{
height:58px;

padding:0 28px;

border-radius:18px;

display:inline-flex;
align-items:center;
justify-content:center;

font-weight:700;

transition:.3s;
}

.btn-primary{
background:var(--red);
color:#fff;
}

.btn-primary:hover{
background:var(--red-hover);
}

.btn-secondary{

background:#fff;

border:
1px solid var(--border);
}

.btn-secondary:hover{
background:#f5f5f5;
}

/* ======================
HERO
====================== */

.hero{
padding:
80px 0
60px;
}

.hero-grid{

display:grid;

grid-template-columns:
1.2fr
0.8fr;

gap:40px;

align-items:center;
}

.hero-content h1{

font-size:82px;
line-height:.95;

font-weight:900;

letter-spacing:-4px;

margin-bottom:24px;
}

.hero-content p{

font-size:20px;

line-height:1.7;

color:var(--text-light);

margin-bottom:36px;
}

.hero-buttons{
display:flex;
gap:14px;
}

.hero-banner{

height:520px;

border-radius:40px;

overflow:hidden;

position:relative;

background:
linear-gradient(
135deg,
#121212,
#272727
);

box-shadow:
var(--shadow);
}

.hero-banner img{
width:100%;
height:100%;
object-fit:cover;
}

.hero-overlay{

position:absolute;
inset:0;

background:
linear-gradient(
180deg,
transparent,
rgba(0,0,0,.5)
);
}

/* ======================
PROMO
====================== */

.promo-section{
padding:40px 0 80px;
}

.promo-grid{

display:grid;

grid-template-columns:
repeat(3,1fr);

gap:24px;
}

.promo-card{

padding:34px;

background:#fff;

border-radius:30px;

box-shadow:
var(--shadow);

position:relative;

overflow:hidden;
}

.promo-card.red{
background:
linear-gradient(
135deg,
#d42027,
#ef3a42
);

color:#fff;
}

.promo-card h3{
font-size:30px;
margin-bottom:12px;
}

.promo-card p{
line-height:1.7;
}

.promotions-page{
padding:60px 0 110px;
background:
radial-gradient(circle at 12% 0%,rgba(255,87,51,.08),transparent 34%),
linear-gradient(180deg,#fff8f5 0%,#fff 62%);
}

.promotions-head{
display:flex;
align-items:flex-start;
justify-content:space-between;
gap:24px;
margin-bottom:34px;
}

.promotions-head p{
max-width:720px;
color:var(--text-light);
font-size:18px;
line-height:1.65;
}

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

.promotion-card{
min-height:360px;
position:relative;
display:flex;
align-items:flex-end;
overflow:hidden;
border-radius:30px;
background:#141414;
color:#fff;
box-shadow:0 24px 70px rgba(45,24,17,.12);
text-decoration:none;
transition:transform .24s ease,box-shadow .24s ease;
}

.promotion-card:hover{
transform:translateY(-5px);
box-shadow:0 30px 80px rgba(45,24,17,.18);
}

.promotion-card::after{
content:"";
position:absolute;
inset:0;
background:linear-gradient(180deg,rgba(0,0,0,.04) 0%,rgba(0,0,0,.24) 38%,rgba(0,0,0,.78) 100%);
z-index:1;
}

.promotion-image{
position:absolute;
inset:0;
}

.promotion-image img{
width:100%;
height:100%;
object-fit:cover;
display:block;
transition:transform .65s ease;
}

.promotion-card:hover .promotion-image img{
transform:scale(1.06);
}

.promotion-content{
position:relative;
z-index:2;
display:grid;
gap:12px;
padding:34px;
max-width:680px;
}

.promotion-content strong{
font-size:32px;
line-height:1.04;
font-weight:900;
letter-spacing:-.4px;
}

.promotion-content span{
max-width:520px;
font-size:17px;
line-height:1.5;
font-weight:800;
color:rgba(255,255,255,.88);
}

.promo-loading-card{
height:360px;
border-radius:30px;
background:linear-gradient(90deg,#fff 0%,#f7eee9 45%,#fff 90%);
background-size:220% 100%;
animation:skeletonShimmer 1.2s linear infinite;
box-shadow:0 24px 70px rgba(45,24,17,.08);
}

/* ======================
CATEGORIES
====================== */

.categories{
padding:40px 0;
}

.categories-row{

display:flex;
flex-wrap:wrap;

gap:12px;
}

.category-chip{

padding:
14px 20px;

background:#fff;

border:
1px solid var(--border);

border-radius:999px;

font-weight:700;

transition:.3s;
}

.category-chip:hover{

background:var(--red);

color:#fff;

border-color:var(--red);
}

/* ======================
PRODUCTS
====================== */

.products{
padding:40px 0 100px;
}

.section-title{

font-size:54px;
font-weight:900;

margin-bottom:40px;

letter-spacing:-2px;
}

.products-grid{

display:grid;

grid-template-columns:
repeat(4,1fr);

gap:24px;
}

.product-card{

background:#fff;

border-radius:28px;

overflow:hidden;

box-shadow:
var(--shadow);

transition:.3s;
}

.product-card:hover{

transform:
translateY(-6px);
}

.product-image{

display:block;
width:100%;
aspect-ratio:1/1;
height:auto;

overflow:hidden;
background:#eee;
}

.product-image img{

display:block;
width:100%;
height:100%;

object-fit:cover;

transition:.5s;
}

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

.product-body{
padding:22px;
}

.product-title{

font-size:22px;
font-weight:800;

margin-bottom:10px;
}

.product-description{

color:var(--text-light);

font-size:14px;

line-height:1.6;

margin-bottom:18px;
}

.product-footer{

display:flex;
justify-content:space-between;
align-items:center;
}

.product-price{

font-size:24px;
font-weight:900;
}

.product-add{

width:48px;
height:48px;
display:grid;
place-items:center;

border-radius:14px;

background:var(--red);

color:#fff;

font-size:22px;
}

.product-add-price{
display:none;
}

/* ======================
CART
====================== */

.cart-layout{

display:grid;

grid-template-columns:
1fr 420px;

gap:30px;
}

.cart-items{

background:#fff;

padding:30px;

border-radius:30px;

box-shadow:var(--shadow);
}

.cart-summary{

background:#fff;

padding:30px;

border-radius:30px;

box-shadow:var(--shadow);

position:sticky;
top:110px;
}

.cart-total{

display:flex;
justify-content:space-between;

font-size:28px;
font-weight:900;

margin:24px 0;
}

/* ======================
FORM
====================== */

.form-card{

background:#fff;

padding:36px;

border-radius:30px;

box-shadow:var(--shadow);
}

.form-group{
margin-bottom:18px;
}

.form-group label{

display:block;

margin-bottom:8px;

font-weight:700;
}

.input{

width:100%;

height:58px;

padding:0 18px;

border:
1px solid var(--border);

border-radius:16px;

background:#fff;
}

textarea.input{

height:140px;

padding-top:16px;

resize:none;
}

/* ======================
PROFILE
====================== */

.profile-header{

padding:40px;

background:#fff;

border-radius:30px;

box-shadow:var(--shadow);

display:flex;
justify-content:space-between;
align-items:center;
}

.profile-name{

font-size:36px;
font-weight:900;
}

.bonus-card{

margin-top:24px;

padding:32px;

background:
linear-gradient(
135deg,
#d42027,
#ef3a42
);

color:#fff;

border-radius:30px;
}

.bonus-value{

font-size:54px;
font-weight:900;
}

/* ======================
FOOTER
====================== */

.footer{

padding:80px 0;

border-top:
1px solid var(--border);
}

.footer-inner{

display:flex;
justify-content:space-between;
align-items:center;
gap:30px;
}

.legal-page{
padding:54px 0 90px;
}

.legal-layout{
max-width:920px;
display:grid;
gap:18px;
}

.legal-card{
padding:30px;
border-radius:28px;
background:#fff;
box-shadow:var(--shadow);
}

.legal-card h2{
margin-bottom:12px;
font-size:26px;
line-height:1.15;
}

.legal-card p,
.legal-card li{
color:var(--text-light);
line-height:1.7;
}

.legal-card ul{
padding-left:20px;
display:grid;
gap:8px;
}

/* ======================
RESPONSIVE
====================== */

@media(max-width:1200px){

.products-grid{
grid-template-columns:
repeat(3,1fr);
}

}

@media(max-width:992px){

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

.cart-layout{
grid-template-columns:1fr;
}

.products-grid{
grid-template-columns:
repeat(2,1fr);
}

.promo-grid{
grid-template-columns:1fr;
}

}

@media(max-width:768px){

.nav{
display:none;
}

.hero-content h1{
font-size:58px;
}

.section-title{
font-size:42px;
}

.products-grid{
grid-template-columns:1fr;
}

.container{
padding:0 20px;
}

}

@media(max-width:480px){

.hero-content h1{
font-size:46px;
}

.logo-text{
font-size:22px;
}

.btn{
width:100%;
}

.hero-buttons{
flex-direction:column;
}

}

/* ======================
SECONDARY PAGES
====================== */

.light-theme{
background:var(--bg);
}

.yoko-header{
position:static;
z-index:1000;
background:#161616;
backdrop-filter:blur(20px);
border-bottom:1px solid rgba(255,255,255,.08);
box-shadow:0 14px 40px rgba(0,0,0,.12);
}

.yoko-header .logo{
color:#fff;
}

.yoko-header nav{
display:flex;
gap:30px;
}

.yoko-header nav a{
font-weight:700;
color:rgba(255,255,255,.82);
}

.yoko-header nav a:hover,
.yoko-header nav a.active{
color:#fff;
}

.yoko-header .brand-copy strong{
color:#fff;
}

.yoko-header .brand-copy small,
.yoko-header .header-phone span{
color:rgba(255,255,255,.62);
}

.yoko-header .header-phone{
color:#fff;
display:inline-flex;
flex-direction:row;
align-items:center;
justify-content:flex-start;
gap:12px;
min-height:58px;
padding:9px 14px 9px 10px;
border:1px solid rgba(255,255,255,.12);
border-radius:18px;
background:linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.055));
box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 28px rgba(0,0,0,.14);
text-decoration:none;
transition:transform .25s ease,border-color .25s ease,background .25s ease;
white-space:nowrap;
}

.yoko-header .header-phone:hover{
transform:translateY(-1px);
border-color:rgba(255,255,255,.22);
background:linear-gradient(135deg,rgba(255,255,255,.16),rgba(255,255,255,.075));
}

.header-phone-icon{
width:40px;
height:40px;
border-radius:14px;
display:grid;
place-items:center;
background:linear-gradient(135deg,var(--red),#ff6b36);
color:#fff;
box-shadow:0 10px 24px rgba(212,32,39,.28);
flex:0 0 auto;
}

.header-phone-icon svg,
.header-phone-clock svg{
width:18px;
height:18px;
fill:none;
stroke:currentColor;
stroke-width:2.2;
stroke-linecap:round;
stroke-linejoin:round;
}

.header-phone-copy{
display:grid;
gap:5px;
line-height:1;
min-width:0;
}

.header-phone-copy strong{
font-size:16px;
font-weight:900;
color:#fff;
letter-spacing:.1px;
}

.header-phone-copy small{
display:inline-flex;
align-items:center;
gap:6px;
font-size:12px;
font-weight:800;
color:rgba(255,255,255,.7);
}

.header-phone-clock{
width:16px;
height:16px;
display:inline-grid;
place-items:center;
color:#ffcf6d;
flex:0 0 auto;
}

.yoko-header .burger-button{
background:rgba(255,255,255,.12);
box-shadow:none;
}

.yoko-header .burger-button span{
background:#fff;
}

.mobile-menu .brand-logo-link{
color:var(--text);
}

.mobile-menu .brand-copy strong{
color:var(--text);
}

.mobile-menu .brand-copy small{
color:var(--text-light);
}

.site-footer-brand{
display:grid!important;
}

.page-title{
font-size:56px;
line-height:1;
font-weight:900;
letter-spacing:-2px;
margin-bottom:36px;
}

.cart-page,
.checkout-page,
.account-page,
.favorites-page,
.addresses-page,
.orders-page,
.notifications-page{
padding:60px 0 100px;
}

.cart-item{
display:grid;
grid-template-columns:110px 1fr auto auto 40px;
align-items:center;
gap:22px;
padding:18px 0;
border-bottom:1px solid var(--border);
}

.cart-item:last-child{
border-bottom:0;
}

.cart-item img{
width:110px;
height:90px;
object-fit:cover;
border-radius:18px;
}

.cart-info h3{
font-size:20px;
margin-bottom:8px;
}

.cart-desc{
color:var(--text-light);
}

.cart-options{
margin-top:8px;
color:var(--text-light);
font-size:13px;
line-height:1.5;
}

.cart-qty,
.qty-box{
display:flex;
align-items:center;
gap:10px;
}

.cart-qty button,
.qty-box button{
width:36px;
height:36px;
border-radius:12px;
background:#f3f3f3;
font-size:18px;
font-weight:800;
}

.cart-price,
.cart-sum{
font-weight:900;
font-size:20px;
white-space:nowrap;
}

.remove-btn{
width:38px;
height:38px;
border-radius:12px;
background:#fff1f1;
color:var(--red);
font-size:22px;
font-weight:900;
}

.empty-cart{
padding:26px;
border-radius:20px;
background:#fff1ea;
color:var(--text-light);
font-weight:800;
text-align:center;
}

.summary-row,
.summary-item,
.summary-total{
display:flex;
justify-content:space-between;
gap:20px;
padding:12px 0;
border-bottom:1px solid var(--border);
}

.summary-row.total,
.summary-total{
border-bottom:0;
font-size:24px;
font-weight:900;
}

.summary-note{
padding:12px 0;
color:var(--text-light);
font-size:14px;
font-weight:700;
line-height:1.45;
}

.summary-note.warning{
color:var(--red);
}

.promo{
display:flex;
gap:10px;
margin:24px 0;
}

.promo input,
.checkout-form input,
.checkout-form textarea{
width:100%;
border:1px solid var(--border);
border-radius:16px;
background:#fff;
font:inherit;
}

.promo input,
.checkout-form input{
height:54px;
padding:0 16px;
}

.promo button,
.checkout-btn,
.place-order-btn,
.add-cart-btn,
.back-home{
min-height:52px;
padding:0 20px;
border-radius:16px;
background:var(--red);
color:#fff;
font-weight:800;
display:inline-flex;
align-items:center;
justify-content:center;
}

.checkout-btn,
.place-order-btn{
width:100%;
}

.checkout-layout,
.account-grid{
display:grid;
grid-template-columns:1fr 420px;
gap:30px;
align-items:start;
}

.checkout-head{
display:flex;
align-items:flex-start;
justify-content:space-between;
gap:24px;
margin-bottom:34px;
}

.checkout-head .page-title{
margin-bottom:12px;
}

.checkout-head p{
max-width:680px;
color:var(--text-light);
font-size:18px;
line-height:1.6;
}

.back-link{
min-height:46px;
padding:0 18px;
border-radius:14px;
background:#fff;
border:1px solid var(--border);
display:inline-flex;
align-items:center;
justify-content:center;
font-weight:800;
white-space:nowrap;
}

.checkout-layout-polished{
grid-template-columns:minmax(0,1fr) 440px;
}

.checkout-form,
.order-summary,
.profile-card,
.account-section,
.address-item,
.address-add,
.history-order,
.notification-card{
background:#fff;
border-radius:30px;
box-shadow:var(--shadow);
}

.checkout-form,
.order-summary,
.profile-card,
.account-section,
.address-item,
.address-add,
.notification-card{
padding:30px;
}

.checkout-form-polished{
display:grid;
gap:24px;
}

.checkout-form-polished input,
.checkout-form-polished textarea,
.checkout-time-fields select{
margin:0;
outline:none;
transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}

.checkout-form-polished input:focus,
.checkout-form-polished textarea:focus,
.checkout-time-fields select:focus{
border-color:var(--red);
box-shadow:0 0 0 4px rgba(212,32,39,.1);
}

.checkout-card-head{
display:flex;
align-items:flex-start;
gap:14px;
}

.checkout-card-head > span{
width:34px;
height:34px;
border-radius:12px;
background:var(--red);
color:#fff;
display:inline-flex;
align-items:center;
justify-content:center;
font-weight:900;
flex:0 0 auto;
}

.checkout-card-head h3{
font-size:22px;
font-weight:900;
margin-bottom:4px;
}

.checkout-card-head p{
color:var(--text-light);
font-size:14px;
line-height:1.45;
}

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

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

.checkout-contact-fields{
gap:14px;
}

.checkout-input-field{
position:relative;
display:grid;
grid-template-columns:42px minmax(0,1fr);
grid-template-rows:auto auto;
column-gap:12px;
align-items:center;
min-height:82px;
padding:14px 16px;
border:1px solid var(--border);
border-radius:20px;
background:#fffaf7;
transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}

.checkout-input-field:focus-within{
border-color:var(--red);
background:#fff;
box-shadow:0 14px 34px rgba(212,32,39,.12);
}

.checkout-input-icon{
grid-row:1 / 3;
width:42px;
height:42px;
border-radius:15px;
display:inline-flex;
align-items:center;
justify-content:center;
background:#fff;
color:var(--red);
font-size:17px;
font-weight:900;
box-shadow:0 8px 20px rgba(45,24,17,.08);
}

.checkout-input-copy{
font-size:12px;
line-height:1.1;
font-weight:900;
text-transform:uppercase;
letter-spacing:.06em;
color:#8a7f79;
}

.checkout-form-polished .checkout-input-field input{
height:auto;
min-height:30px;
padding:0;
border:0;
border-radius:0;
background:transparent;
font-size:18px;
font-weight:800;
color:var(--text);
box-shadow:none;
}

.checkout-form-polished .checkout-input-field input:focus{
box-shadow:none;
}

.checkout-form-polished .checkout-input-field input::placeholder{
color:#b3aaa5;
font-weight:700;
}

.checkout-form-polished .checkout-input-field input[readonly]{
color:#5f5752;
cursor:default;
}

.checkout-input-field:has(input[readonly]){
background:#f7f2ee;
}

.checkout-fields.muted{
opacity:.58;
}

.checkout-fields.muted input,
.checkout-fields.muted textarea{
background:#f6f1ee;
color:var(--text-light);
cursor:not-allowed;
}

.delivery-choice-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:12px;
}

.delivery-choice{
min-height:126px;
padding:16px;
border:1px solid var(--border);
border-radius:18px;
background:#fff;
display:flex;
flex-direction:column;
gap:10px;
cursor:pointer;
transition:.2s;
margin:0;
font-weight:700;
}

.delivery-choice.active{
border-color:var(--red);
box-shadow:0 14px 30px rgba(212,32,39,.12);
}

.delivery-choice input{
position:absolute;
width:auto;
height:auto;
opacity:0;
pointer-events:none;
}

.delivery-choice-title{
display:flex;
align-items:flex-start;
justify-content:space-between;
gap:10px;
font-weight:900;
line-height:1.2;
}

.delivery-choice-title strong{
color:var(--red);
white-space:nowrap;
}

.delivery-choice-meta{
color:var(--text-light);
font-size:13px;
line-height:1.45;
}

.payment-options{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:12px;
}

.payment-options label{
min-height:54px;
padding:0 16px;
border:1px solid var(--border);
border-radius:16px;
display:flex;
align-items:center;
gap:10px;
font-weight:800;
background:#fff;
margin:0;
cursor:pointer;
transition:.18s ease;
}

.payment-options input{
width:18px;
height:18px;
margin:0;
accent-color:var(--red);
flex:0 0 auto;
}

.payment-options label:has(input:checked){
border-color:var(--red);
box-shadow:0 12px 26px rgba(212,32,39,.1);
}

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

.checkout-time-mode{
min-height:58px;
padding:14px 16px;
border:1px solid var(--border);
border-radius:16px;
background:#fff;
display:flex;
align-items:center;
gap:10px;
font-weight:900;
cursor:pointer;
transition:.2s;
margin:0;
}

.checkout-time-mode.active{
border-color:var(--red);
box-shadow:0 14px 30px rgba(212,32,39,.12);
}

.checkout-time-mode.disabled{
opacity:.52;
background:#f6f1ee;
cursor:not-allowed;
}

.checkout-time-mode input{
width:18px;
height:18px;
margin:0;
accent-color:var(--red);
flex:0 0 auto;
}

.checkout-time-fields{
grid-column:1/-1;
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:12px;
padding:14px;
border:1px solid var(--border);
border-radius:18px;
background:#fff;
}

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

.checkout-time-fields select{
height:52px;
border:1px solid var(--border);
border-radius:14px;
padding:0 14px;
font:inherit;
font-weight:800;
background:#fff;
}

.checkout-time-fields small{
grid-column:1/-1;
color:var(--text-light);
font-weight:700;
line-height:1.35;
}

.no-call-option{
padding:18px;
border:1px solid var(--border);
border-radius:18px;
background:#fff;
display:flex;
align-items:flex-start;
gap:12px;
cursor:pointer;
margin:0;
transition:.18s ease;
}

.no-call-option input{
width:20px;
height:20px;
margin-top:2px;
accent-color:var(--red);
flex:0 0 auto;
}

.no-call-option:has(input:checked){
border-color:var(--red);
background:#fff8f6;
box-shadow:0 12px 28px rgba(212,32,39,.1);
}

.checkout-form-polished .legal-check{
display:flex;
align-items:flex-start;
gap:12px;
padding:18px;
border-radius:18px;
margin:0;
background:#fff;
font-weight:800;
}

.checkout-form-polished .legal-check input{
width:20px;
height:20px;
margin:2px 0 0;
accent-color:var(--red);
flex:0 0 auto;
}

.no-call-option span{
display:grid;
gap:4px;
}

.no-call-option strong{
font-size:16px;
font-weight:900;
}

.no-call-option small{
color:var(--text-light);
font-size:13px;
line-height:1.45;
}

.order-summary-polished{
position:sticky;
top:110px;
}

.summary-head{
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
margin-bottom:18px;
}

.summary-head h3{
font-size:24px;
font-weight:900;
}

.summary-head span{
color:var(--text-light);
font-weight:800;
}

.checkout-items-toggle{
width:100%;
min-height:48px;
margin-bottom:14px;
padding:0 14px;
border:1px solid var(--border);
border-radius:16px;
background:#fff;
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
font-weight:900;
}

.checkout-items-toggle b{
color:var(--red);
font-size:13px;
}

.checkout-items-toggle::after{
content:"";
width:9px;
height:9px;
border-right:2px solid currentColor;
border-bottom:2px solid currentColor;
transform:rotate(45deg);
transition:.18s ease;
}

.checkout-items-toggle[aria-expanded="true"]::after{
transform:rotate(225deg);
}

.checkout-items{
display:grid;
gap:14px;
max-height:0;
overflow:hidden;
transition:max-height .24s ease;
}

.checkout-items.expanded{
max-height:640px;
overflow:auto;
padding-right:2px;
}

.checkout-item{
position:relative;
display:grid;
grid-template-columns:76px 1fr auto;
gap:14px;
align-items:start;
padding:14px;
padding-left:18px;
border-radius:20px;
background:#fff;
border:1px solid var(--border);
box-shadow:0 10px 24px rgba(31,24,20,.045);
overflow:hidden;
}

.checkout-item::before{
content:"";
position:absolute;
left:0;
top:14px;
bottom:14px;
width:4px;
border-radius:0 999px 999px 0;
background:var(--red);
}

.checkout-item img{
width:76px;
height:64px;
object-fit:cover;
border-radius:14px;
background:#fff8f5;
}

.checkout-item-title{
font-size:16px;
font-weight:900;
margin-bottom:4px;
}

.checkout-item-meta{
color:var(--text-light);
font-size:13px;
font-weight:800;
}

.checkout-item-options{
display:grid;
gap:4px;
margin-top:8px;
color:var(--text-light);
font-size:13px;
line-height:1.35;
}

.checkout-item-price{
font-weight:900;
white-space:nowrap;
color:var(--red);
}

.summary-divider{
height:1px;
background:var(--border);
margin:20px 0 6px;
}

.form-block{
margin-bottom:28px;
}

.form-block h3{
margin-bottom:16px;
}

.checkout-form input,
.checkout-form textarea{
margin-bottom:12px;
}

.checkout-form textarea{
min-height:120px;
padding:16px;
resize:vertical;
}

.checkout-form label{
display:block;
margin-bottom:12px;
font-weight:700;
}

.checkout-form-polished input,
.checkout-form-polished textarea{
margin:0;
}

.checkout-form-polished .checkout-input-field{
display:grid;
margin:0;
font-weight:inherit;
}

.checkout-form-polished .checkout-input-field input{
margin:0;
}

.checkout-form-polished .delivery-choice,
.checkout-form-polished .payment-options label,
.checkout-form-polished .checkout-time-mode,
.checkout-form-polished .no-call-option,
.checkout-form-polished .legal-check{
display:flex;
margin:0;
}

.checkout-form-polished .delivery-choice{
flex-direction:column;
align-items:stretch;
}

.checkout-form-polished .payment-options label,
.checkout-form-polished .checkout-time-mode{
align-items:center;
}

.checkout-form-polished .no-call-option,
.checkout-form-polished .legal-check{
align-items:flex-start;
}

.checkout-form-polished .payment-options input,
.checkout-form-polished .checkout-time-mode input,
.checkout-form-polished .no-call-option input,
.checkout-form-polished .legal-check input{
width:20px;
height:20px;
margin:0;
padding:0;
flex:0 0 auto;
}

.checkout-form-polished .no-call-option input,
.checkout-form-polished .legal-check input{
margin-top:2px;
}

.profile-card{
text-align:center;
}

.profile-avatar{
width:86px;
height:86px;
margin:0 auto 18px;
border-radius:28px;
background:var(--red);
color:#fff;
display:flex;
align-items:center;
justify-content:center;
font-size:36px;
font-weight:900;
}

.account-content{
display:grid;
gap:24px;
}

.account-dashboard{
display:grid;
gap:24px;
}

.account-top{
display:flex;
align-items:center;
justify-content:space-between;
gap:24px;
margin-bottom:34px;
}

.account-top .page-title{
margin-bottom:12px;
}

.account-subtitle{
color:var(--text-light);
font-size:18px;
line-height:1.6;
}

.logout-btn{
min-height:46px;
padding:0 18px;
border-radius:14px;
background:#fff;
border:1px solid var(--border);
font-weight:800;
color:var(--text);
}

.logout-btn:hover{
color:var(--red);
border-color:var(--red);
}

.logout-btn.mobile{
display:none;
}

.account-bonus-panel{
padding:28px;
border-radius:24px;
background:#fff;
box-shadow:var(--shadow);
display:grid;
grid-template-columns:minmax(0,1fr) minmax(260px,360px);
gap:24px;
align-items:center;
}

.account-kicker{
display:block;
margin-bottom:8px;
color:var(--red);
font-size:13px;
font-weight:900;
text-transform:uppercase;
}

.account-bonus-panel h2{
margin:0 0 8px;
font-size:34px;
font-weight:900;
}

.account-bonus-panel p{
margin:0;
color:var(--text-light);
font-weight:800;
}

.bonus-card{
margin-top:24px;
padding:22px;
border-radius:22px;
background:linear-gradient(135deg,#d42027,#ef3a42);
color:#fff;
text-align:left;
}

.bonus-card.compact{
margin-top:0;
}

.bonus-title{
font-size:14px;
font-weight:800;
opacity:.86;
margin-bottom:8px;
}

.bonus-value{
font-size:30px;
line-height:1;
font-weight:900;
}

.bonus-hint{
margin-top:10px;
font-size:13px;
line-height:1.45;
opacity:.86;
}

.bonus-spend-row label{
display:grid;
justify-items:end;
gap:4px;
min-width:128px;
}

.summary-row.bonus-spend-row{
margin:14px 0;
padding:16px;
border:1px solid rgba(212,32,39,.18);
border-radius:18px;
background:linear-gradient(135deg,#fff8f6,#fff);
box-shadow:0 12px 28px rgba(212,32,39,.08);
align-items:center;
}

.summary-row.bonus-spend-row > span{
font-size:16px;
font-weight:900;
color:var(--red);
}

.bonus-spend-row input{
width:132px;
height:44px;
padding:0 12px;
border:1px solid rgba(212,32,39,.24);
border-radius:14px;
font-weight:900;
text-align:right;
background:#fff;
outline:none;
transition:.18s ease;
}

.bonus-spend-row input:focus{
border-color:var(--red);
box-shadow:0 0 0 4px rgba(212,32,39,.1);
}

.bonus-spend-row small{
color:var(--text-light);
font-size:12px;
font-weight:800;
white-space:nowrap;
}

.account-loading-text{
min-height:30px;
border-radius:999px;
color:transparent!important;
background:linear-gradient(100deg,rgba(255,255,255,.22) 18%,rgba(255,255,255,.44) 42%,rgba(255,255,255,.22) 68%);
background-size:240% 100%;
animation:skeletonShimmer 1.25s ease-in-out infinite;
}

.account-loading-text.short{
width:72%;
min-height:16px;
}

.account-loading-list{
display:grid;
gap:14px;
}

.account-orders-grid,
.account-orders-list{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:14px;
align-items:stretch;
}

.account-loading-row{
height:126px;
border-radius:18px;
background:linear-gradient(100deg,#ece7df 18%,#faf8f5 42%,#ece7df 68%);
background-size:240% 100%;
animation:skeletonShimmer 1.25s ease-in-out infinite;
}

.account-order-card{
display:grid;
grid-template-columns:1fr;
gap:14px;
padding:18px;
border:1px solid var(--border);
border-radius:22px;
background:#fff;
box-shadow:0 10px 24px rgba(31,24,20,.045);
min-width:0;
}

.account-order-top,
.account-order-meta,
.account-order-actions{
display:flex;
align-items:center;
justify-content:space-between;
gap:14px;
}

.account-order-top{
align-items:flex-start;
}

.account-order-title{
display:grid;
gap:6px;
min-width:0;
}

.order-number{
display:inline-flex;
align-items:center;
min-height:34px;
width:max-content;
max-width:100%;
padding:0 10px;
border-radius:12px;
background:#fff1f1;
color:var(--red);
font-size:14px;
font-weight:900;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}

.order-date{
color:var(--text-light);
font-size:12px;
font-weight:800;
line-height:1.25;
}

.account-order-meta{
padding-top:12px;
border-top:1px solid var(--border);
color:var(--text-light);
font-weight:800;
}

.account-order-meta strong{
color:var(--text);
font-size:20px;
font-weight:900;
}

.account-order-actions{
align-self:end;
justify-content:space-between;
min-width:0;
margin-top:auto;
}

.order-detail-btn{
min-height:44px;
padding:0 14px;
border-radius:14px;
background:#fff1f1;
color:var(--red);
font-weight:900;
flex:1 1 auto;
}

.order-repeat-icon{
width:44px;
height:44px;
border-radius:14px;
display:grid;
place-items:center;
background:var(--red);
color:#fff;
box-shadow:0 12px 24px rgba(212,32,39,.2);
}

.account-orders-pagination{
display:flex;
grid-column:1 / -1;
align-items:center;
justify-content:center;
gap:10px;
padding-top:4px;
}

.account-orders-pagination button{
width:42px;
height:42px;
border-radius:14px;
background:#fff1f1;
color:var(--red);
font-size:24px;
font-weight:900;
}

.account-orders-pagination button:disabled{
opacity:.45;
cursor:not-allowed;
transform:none!important;
}

.account-orders-pagination span{
min-width:72px;
text-align:center;
color:var(--text-light);
font-size:14px;
font-weight:900;
}

@media(max-width:1100px){
.account-orders-grid,
.account-orders-list{
grid-template-columns:repeat(2,minmax(0,1fr));
}
}

@media(max-width:760px){
.account-orders-grid,
.account-orders-list{
grid-template-columns:1fr;
}
}

.account-favorite-products{
grid-template-columns:repeat(4,minmax(0,1fr));
align-items:stretch;
}

.account-favorite-card{
position:relative;
min-width:0;
cursor:pointer;
}

.account-favorite-card .product-image{
cursor:pointer;
}

.account-favorite-card .product-body{
display:block;
}

.account-favorite-card .product-description{
flex:none;
}

.account-favorite-card .product-actions{
min-width:0;
display:block;
}

.account-empty{
grid-column:1 / -1;
}

.favorite-remove-btn{
position:absolute;
top:12px;
right:12px;
z-index:4;
width:40px;
height:40px;
border-radius:14px;
background:rgba(255,255,255,.94);
color:var(--red);
font-size:25px;
line-height:1;
font-weight:900;
box-shadow:0 10px 24px rgba(0,0,0,.14);
transition:.2s;
}

.favorite-remove-btn:hover{
background:var(--red);
color:#fff;
transform:translateY(-1px);
}

.product-modal,
.delivery-modal,
.order-detail-modal{
position:fixed;
inset:0;
display:none;
align-items:center;
justify-content:center;
padding:24px;
background:rgba(0,0,0,.72);
backdrop-filter:blur(8px);
z-index:12000;
}

.product-modal.active,
.delivery-modal.active,
.order-detail-modal.active{
display:flex;
}

.order-detail-card{
width:min(640px,100%);
height:min(720px,88vh);
border-radius:28px;
background:#fff;
box-shadow:0 24px 80px rgba(0,0,0,.24);
position:relative;
display:flex;
flex-direction:column;
overflow:hidden;
}

.order-detail-close{
position:absolute;
top:14px;
right:14px;
width:40px;
height:40px;
border-radius:14px;
background:#fff1ea;
font-size:24px;
font-weight:900;
z-index:4;
box-shadow:0 10px 24px rgba(0,0,0,.08);
transition:transform .2s ease, background .2s ease, color .2s ease;
}

.order-detail-close:hover{
background:var(--red);
color:#fff;
transform:translateY(-1px);
}

.order-detail-scroll{
flex:1 1 auto;
min-height:0;
overflow-y:auto;
padding:34px 34px 18px;
}

.order-detail-action-bar{
flex:0 0 auto;
padding:18px 34px 30px;
border-top:1px solid var(--border);
background:#fff;
box-shadow:0 -18px 36px rgba(255,255,255,.94);
}

.order-detail-action-bar .modal-cart-button{
width:100%;
min-height:58px;
}

.order-detail-card h2{
font-size:34px;
line-height:1;
font-weight:900;
padding-right:42px;
margin-bottom:18px;
}

.order-detail-meta{
display:flex;
justify-content:space-between;
gap:16px;
padding:14px;
border-radius:18px;
background:#fff8f5;
font-weight:900;
margin-bottom:14px;
}

.order-detail-meta span{
color:var(--text-light);
}

.order-detail-items{
display:grid;
gap:10px;
}

.order-detail-item{
display:grid;
grid-template-columns:1fr auto;
gap:14px;
padding:14px;
border:1px solid var(--border);
border-radius:18px;
}

.order-detail-item.unavailable{
background:#f3f3f3;
border-color:#e2e2e2;
color:#8a8a8a;
filter:grayscale(1);
}

.order-detail-item div{
display:grid;
gap:5px;
min-width:0;
}

.order-detail-item span,
.order-detail-item small,
.order-detail-item em{
color:var(--text-light);
font-size:13px;
font-weight:800;
line-height:1.35;
}

.order-detail-item em{
color:#8a3f3f;
font-style:normal;
}

.order-detail-item b{
white-space:nowrap;
color:var(--red);
}

.order-detail-item.unavailable b{
color:#8a8a8a;
}

.product-modal-card{
width:100%;
max-width:900px;
height:min(720px,88vh);
display:grid;
grid-template-columns:minmax(0,1fr) minmax(0,1fr);
overflow:hidden;
border-radius:32px;
background:#fff;
box-shadow:0 24px 80px rgba(0,0,0,.24);
}

.product-modal-image{
min-height:0;
background:#fff1ea;
overflow:hidden;
}

.product-modal-image img{
width:145%;
height:100%;
object-fit:cover;
object-position:right center;
transform:translateX(-31%);
max-width:none;
}

.product-modal-content{
min-height:0;
display:flex;
flex-direction:column;
overflow:hidden;
}

.modal-scroll-area{
flex:1 1 auto;
min-height:0;
overflow-y:auto;
padding:42px 42px 18px;
}

.modal-scroll-area h2{
font-size:42px;
line-height:1;
font-weight:900;
margin-bottom:18px;
}

.modal-scroll-area p{
line-height:1.7;
color:var(--text-light);
margin-bottom:22px;
}

.modal-price{
font-size:38px;
font-weight:900;
white-space:nowrap;
}

.modal-action-bar{
flex:0 0 auto;
display:grid;
grid-template-columns:auto minmax(180px,1fr);
align-items:center;
gap:16px;
padding:18px 42px 42px;
border-top:1px solid var(--border);
background:#fff;
box-shadow:0 -18px 34px rgba(255,255,255,.94);
}

.close-modal,
.delivery-close{
position:fixed;
top:22px;
right:22px;
z-index:12002;
width:48px;
height:48px;
border-radius:50%;
background:#fff;
font-size:26px;
font-weight:900;
box-shadow:0 12px 34px rgba(0,0,0,.18);
}

.nutrition-grid{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:10px;
margin:18px 0 24px;
}

.nutrition-item{
padding:12px;
border-radius:16px;
background:#fff1ea;
}

.nutrition-value{
font-size:18px;
font-weight:900;
}

.nutrition-label{
margin-top:4px;
color:var(--text-light);
font-size:12px;
font-weight:800;
}

.options-block{
margin:18px 0 24px;
}

.options-block h3{
font-size:18px;
font-weight:900;
margin-bottom:12px;
}

.option-group{
margin-bottom:16px;
}

.option-group-title{
font-size:14px;
font-weight:900;
margin-bottom:8px;
}

.option-list{
display:grid;
gap:8px;
}

.option-choice{
display:flex;
align-items:center;
justify-content:space-between;
gap:14px;
padding:12px 14px;
border:1px solid var(--border);
border-radius:16px;
background:#fff;
font-weight:800;
}

.option-choice input{
accent-color:var(--red);
}

.option-choice-main{
display:flex;
align-items:center;
gap:10px;
}

.option-choice-meta{
color:var(--text-light);
font-size:13px;
white-space:nowrap;
}

.modal-cart-button{
gap:10px;
width:100%;
}

.delivery-modal{
z-index:13000;
}

.delivery-modal-card{
width:100%;
max-width:560px;
padding:28px;
border-radius:24px;
background:#fff;
box-shadow:0 24px 80px rgba(0,0,0,.22);
position:relative;
}

.delivery-modal-card h2{
font-size:30px;
line-height:1.1;
font-weight:900;
margin-bottom:10px;
}

.delivery-modal-card p{
color:var(--text-light);
line-height:1.55;
margin-bottom:22px;
}

.delivery-methods{
display:grid;
gap:12px;
}

.delivery-method{
min-height:58px;
padding:14px 18px;
border-radius:18px;
background:#eef0f2;
text-align:left;
transition:.2s;
}

.delivery-method:hover{
background:#e6e9ed;
}

.delivery-method:first-child{
background:#ff5a00;
color:#fff;
}

.delivery-method:first-child .delivery-method-price,
.delivery-method:first-child .delivery-method-meta{
color:rgba(255,255,255,.9);
}

.delivery-method-title{
display:flex;
align-items:center;
justify-content:space-between;
gap:14px;
font-weight:900;
font-size:18px;
}

.delivery-method-price{
color:var(--red);
white-space:nowrap;
}

.delivery-method-meta{
display:block;
margin-top:6px;
color:var(--text-light);
font-size:14px;
line-height:1.5;
}

.section-head{
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
margin-bottom:18px;
}

.section-head h3{
font-size:24px;
font-weight:900;
}

.section-head a,
.text-btn{
color:var(--red);
font-weight:800;
background:transparent;
}

.order-sum{
font-size:18px;
font-weight:900;
text-align:right;
margin-bottom:8px;
}

.profile-facts{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:12px;
}

.profile-facts div{
padding:16px;
border-radius:18px;
background:#fff1ea;
}

.profile-facts span{
display:block;
color:var(--text-light);
font-size:13px;
font-weight:700;
margin-bottom:8px;
}

.profile-facts strong{
font-size:15px;
}

.order-card,
.favorite-item,
.address-card{
display:flex;
justify-content:space-between;
gap:16px;
padding:16px 0;
border-bottom:1px solid var(--border);
}

.favorite-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:16px;
}

.favorite-item{
display:block;
padding:0;
border:0;
font-weight:800;
}

.favorite-item img{
width:100%;
height:130px;
object-fit:cover;
border-radius:18px;
margin-bottom:10px;
}

.favorite-item span{
display:block;
margin-top:6px;
color:var(--red);
font-weight:900;
}

.addresses-grid,
.orders-list{
display:grid;
gap:20px;
}

.address-top,
.address-actions,
.history-order{
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
}

.address-top span,
.order-status,
.history-status{
padding:8px 12px;
border-radius:999px;
background:#f3f3f3;
font-size:13px;
font-weight:800;
}

.delivered,
.history-status.delivered{
background:#e8f7ef;
color:#187a42;
}

.address-actions{
justify-content:flex-start;
margin-top:18px;
}

.address-actions button{
height:42px;
padding:0 14px;
border-radius:12px;
font-weight:800;
}

.address-actions .danger{
background:#fff1f1;
color:var(--red);
}

.address-add{
min-height:150px;
display:flex;
align-items:center;
justify-content:center;
gap:14px;
border:2px dashed var(--border);
box-shadow:none;
font-weight:900;
}

.address-add .plus{
width:44px;
height:44px;
border-radius:14px;
background:var(--red);
color:#fff;
display:flex;
align-items:center;
justify-content:center;
font-size:24px;
}

.history-order{
padding:24px;
}

.history-price{
font-size:22px;
font-weight:900;
}

.notification-card{
display:flex;
align-items:flex-start;
gap:18px;
margin-bottom:18px;
}

.notification-icon{
width:48px;
height:48px;
border-radius:16px;
background:#f3f3f3;
display:flex;
align-items:center;
justify-content:center;
font-size:24px;
}

.order-success{
position:fixed;
inset:0;
display:none;
align-items:center;
justify-content:center;
background:rgba(0,0,0,.68);
padding:24px;
z-index:13000;
backdrop-filter:blur(10px);
}

.order-success.show{
display:flex;
}

.success-card{
width:100%;
max-width:480px;
padding:40px;
border-radius:30px;
background:#fff;
text-align:center;
box-shadow:0 28px 90px rgba(0,0,0,.24);
}

.success-icon{
width:76px;
height:76px;
margin:0 auto 20px;
border-radius:50%;
background:#e8f7ef;
color:#187a42;
display:flex;
align-items:center;
justify-content:center;
font-size:34px;
font-weight:900;
}

.success-card h2{
font-size:34px;
line-height:1.05;
font-weight:900;
margin-bottom:14px;
}

.success-card p{
display:grid;
gap:8px;
color:var(--text-light);
font-size:17px;
line-height:1.5;
margin-bottom:26px;
}

.success-order-number{
color:var(--text);
font-size:20px;
font-weight:900;
}

.success-card .back-home{
width:100%;
}

.yoko-toast{
position:fixed;
left:50%;
bottom:28px;
transform:translate(-50%, 20px);
padding:14px 18px;
border-radius:16px;
background:#121212;
color:#fff;
font-weight:800;
opacity:0;
transition:.3s;
z-index:15000;
}

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

@media(max-width:820px){
.yoko-toast{
bottom:calc(98px + env(safe-area-inset-bottom));
width:min(320px,calc(100% - 32px));
text-align:center;
z-index:15000;
}
}

/* Refined cart page */
.cart-page{
background:
radial-gradient(circle at 12% 0%,rgba(255,87,51,.08),transparent 34%),
linear-gradient(180deg,#fff8f5 0%,#fff 58%);
}

.cart-page .page-title{
margin-bottom:32px;
font-size:64px;
letter-spacing:-1.6px;
}

.cart-layout{
grid-template-columns:minmax(0,1fr) minmax(360px,420px);
gap:36px;
align-items:start;
}

.cart-items,
.cart-summary{
border:1px solid rgba(16,16,16,.06);
box-shadow:0 24px 70px rgba(45,24,17,.08);
}

.cart-items{
padding:8px 34px;
border-radius:34px;
}

.cart-item{
grid-template-columns:104px minmax(0,1fr) 126px 116px 46px;
gap:24px;
padding:28px 0;
border-bottom:1px solid #f1dfd7;
}

.cart-item img{
width:104px;
height:104px;
border-radius:22px;
object-fit:cover;
background:#f7f0ec;
box-shadow:0 10px 24px rgba(35,20,15,.08);
}

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

.cart-info h3{
font-size:24px;
line-height:1.1;
margin-bottom:9px;
letter-spacing:-.2px;
}

.cart-desc{
max-width:560px;
font-size:16px;
line-height:1.45;
color:#6f6a67;
}

.cart-options{
display:flex;
flex-wrap:wrap;
gap:6px;
margin-top:12px;
font-size:12px;
font-weight:800;
color:#7b7470;
}

.cart-qty{
justify-self:end;
gap:8px;
padding:5px;
border-radius:16px;
background:#f7f3f1;
}

.cart-qty button{
width:38px;
height:38px;
border-radius:12px;
background:#fff;
box-shadow:0 6px 14px rgba(30,20,15,.06);
transition:transform .18s ease,background .18s ease,color .18s ease;
}

.cart-qty button:hover{
transform:translateY(-1px);
background:var(--red);
color:#fff;
}

.cart-qty span{
min-width:26px;
text-align:center;
font-weight:900;
font-size:17px;
}

.cart-price,
.cart-sum{
justify-self:end;
font-size:22px;
letter-spacing:-.2px;
}

.remove-btn{
width:46px;
height:46px;
border-radius:16px;
background:#fff3f3;
color:var(--red);
box-shadow:none;
transition:transform .18s ease,background .18s ease,color .18s ease;
}

.remove-btn:hover{
transform:translateY(-1px);
background:var(--red);
color:#fff;
}

.cart-summary{
padding:34px;
border-radius:34px;
top:124px;
}

.cart-summary h3{
display:flex;
align-items:center;
gap:10px;
margin-bottom:18px;
font-size:26px;
line-height:1.1;
letter-spacing:-.2px;
}

.cart-summary h3::before{
content:"";
width:12px;
height:12px;
border-radius:999px;
background:var(--red);
box-shadow:0 0 0 7px rgba(212,32,39,.1);
}

.cart-summary .summary-row{
padding:15px 0;
font-size:16px;
color:#5f5854;
}

.cart-summary .summary-row span:last-child{
font-weight:800;
color:var(--text);
}

.cart-summary .summary-row.total{
align-items:flex-end;
margin-top:4px;
padding-top:20px;
font-size:28px;
color:var(--text);
}

.cart-summary .summary-row.total span:last-child{
font-size:34px;
letter-spacing:-.6px;
}

.cart-summary .summary-note{
margin:12px 0;
padding:12px 14px;
border-radius:16px;
background:#fff6f1;
}

.cart-summary .promo{
display:grid;
grid-template-columns:minmax(0,1fr) 138px;
gap:12px;
margin:26px 0 20px;
}

.cart-summary .promo input{
height:58px;
border-color:#ead8cf;
background:#fffaf7;
}

.cart-summary .promo input:focus{
outline:0;
border-color:var(--red);
box-shadow:0 0 0 4px rgba(212,32,39,.1);
}

.cart-summary .promo button,
.cart-summary .checkout-btn{
min-height:58px;
border-radius:18px;
transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;
}

.cart-summary .promo button:hover,
.cart-summary .checkout-btn:hover{
transform:translateY(-2px);
box-shadow:0 16px 34px rgba(212,32,39,.24);
filter:saturate(1.08);
}

.cart-summary .checkout-btn{
font-size:17px;
}

.cart-items .empty-cart{
margin:24px 0;
background:#fff6f1;
}

@media(max-width:992px){

.checkout-layout,
.account-grid{
grid-template-columns:1fr;
}

.promotions-grid{
grid-template-columns:1fr;
}

.checkout-layout-polished{
grid-template-columns:1fr;
}

.order-summary-polished{
position:static;
}

.delivery-choice-grid,
.payment-options{
grid-template-columns:1fr;
}

.cart-page .page-title{
font-size:48px;
}

.cart-layout{
grid-template-columns:1fr;
gap:22px;
}

.cart-summary{
position:static;
}

.cart-item{
grid-template-columns:92px minmax(0,1fr) auto;
gap:16px;
}

.cart-item img{
width:92px;
height:92px;
}

.cart-qty{
grid-column:2;
justify-self:start;
}

.cart-price,
.cart-sum{
grid-column:3;
align-self:end;
}

.remove-btn{
grid-column:3;
grid-row:1;
align-self:start;
justify-self:end;
}

.favorite-grid{
grid-template-columns:repeat(2,1fr);
}

}

@media(max-width:768px){

.yoko-header nav{
display:none;
}

.cart-page{
padding-top:36px;
}

.cart-page .page-title{
font-size:42px;
margin-bottom:22px;
}

.cart-items,
.cart-summary{
border-radius:24px;
}

.cart-items{
padding:4px 18px;
}

.cart-item{
grid-template-columns:78px minmax(0,1fr) 42px;
gap:12px;
padding:20px 0;
}

.cart-item img{
width:78px;
height:78px;
border-radius:17px;
box-shadow:none;
filter:none;
}

.cart-info h3{
font-size:18px;
margin-bottom:6px;
}

.cart-desc{
display:-webkit-box;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
overflow:hidden;
font-size:13px;
line-height:1.35;
}

.cart-options{
font-size:11px;
line-height:1.35;
}

.cart-qty{
grid-column:2;
grid-row:2;
justify-self:start;
margin-left:0;
padding:4px;
}

.cart-qty button{
width:34px;
height:34px;
border-radius:11px;
}

.cart-qty span{
font-size:15px;
}

.cart-price,
.cart-sum{
grid-column:2;
grid-row:3;
justify-self:start;
align-self:center;
font-size:18px;
}

.remove-btn{
width:42px;
height:42px;
border-radius:14px;
font-size:20px;
}

.cart-summary{
padding:24px;
}

.cart-summary h3{
font-size:22px;
}

.cart-summary .summary-row.total{
font-size:22px;
}

.cart-summary .summary-row.total span:last-child{
font-size:28px;
}

.cart-summary .promo{
grid-template-columns:1fr;
gap:10px;
}

.cart-summary .promo button,
.cart-summary .checkout-btn{
width:100%;
}

.promotions-page{
padding:36px 0 96px;
}

.promotions-head{
display:grid;
gap:14px;
margin-bottom:22px;
}

.promotions-head .page-title{
font-size:42px;
margin-bottom:12px;
}

.promotions-head p{
font-size:15px;
line-height:1.55;
}

.promotion-card,
.promo-loading-card{
min-height:300px;
height:auto;
border-radius:24px;
}

.promotion-content{
padding:24px;
}

.promotion-content strong{
font-size:25px;
}

.promotion-content span{
font-size:15px;
}

.checkout-contact-fields{
grid-template-columns:1fr;
}

.checkout-input-field{
min-height:76px;
padding:12px 14px;
border-radius:18px;
}

.checkout-form-polished .checkout-input-field input{
font-size:16px;
}

body{
padding-bottom:86px;
}

.mobile-bottom-nav{
position:fixed;
left:12px;
right:12px;
bottom:12px;
z-index:12000;
height:68px;
display:grid;
grid-template-columns:repeat(4,1fr);
gap:4px;
padding:8px;
border:1px solid rgba(16,16,16,.08);
border-radius:24px;
background:rgba(255,255,255,.94);
box-shadow:0 18px 46px rgba(25,20,18,.18);
backdrop-filter:blur(18px);
transform:translateY(0);
opacity:1;
visibility:visible;
pointer-events:auto;
transition:opacity .2s ease,visibility .2s ease,transform .22s ease;
}

body.modal-open .mobile-bottom-nav{
opacity:0;
visibility:hidden;
pointer-events:none;
transform:translateY(calc(100% + 22px));
}

body.mobile-menu-open .mobile-bottom-nav{
opacity:1!important;
visibility:visible!important;
pointer-events:auto!important;
transform:translateY(0)!important;
z-index:32000!important;
}

body.mobile-menu-open.modal-open .mobile-bottom-nav{
opacity:1!important;
visibility:visible!important;
pointer-events:auto!important;
transform:translateY(0)!important;
z-index:32000!important;
}

.to-top-button{
display:none;
}

.mobile-tab{
position:relative;
border-radius:18px;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:3px;
color:var(--text-light);
font-size:11px;
font-weight:900;
text-decoration:none;
line-height:1;
}

.mobile-tab.active{
background:#fff1f1;
color:var(--red);
}

.mobile-tab-icon{
width:22px;
height:22px;
display:grid;
place-items:center;
}

.mobile-tab-icon svg{
width:22px;
height:22px;
fill:none;
stroke:currentColor;
stroke-width:2.2;
stroke-linecap:round;
stroke-linejoin:round;
}

.mobile-tab-badge{
position:absolute;
top:4px;
right:12px;
min-width:18px;
height:18px;
padding:0 5px;
border-radius:999px;
display:grid;
place-items:center;
background:var(--red);
color:#fff;
font-size:11px;
font-weight:900;
}

.mobile-cart-tab.cart-added{
animation:mobileCartPulse .62s cubic-bezier(.2,1.35,.28,1);
background:#fff1f1;
color:var(--red);
}

.mobile-cart-tab.cart-added .mobile-tab-icon{
animation:mobileCartIcon .62s cubic-bezier(.2,1.35,.28,1);
}

.mobile-cart-tab.cart-added .mobile-tab-badge{
animation:mobileCartBadge .62s cubic-bezier(.2,1.35,.28,1);
box-shadow:0 0 0 8px rgba(212,32,39,.14);
}

@keyframes mobileCartPulse{
0%{transform:scale(1)}
35%{transform:translateY(-5px) scale(1.08)}
70%{transform:translateY(1px) scale(.98)}
100%{transform:translateY(0) scale(1)}
}

@keyframes mobileCartIcon{
0%{transform:rotate(0) scale(1)}
38%{transform:rotate(-8deg) scale(1.18)}
75%{transform:rotate(4deg) scale(.98)}
100%{transform:rotate(0) scale(1)}
}

@keyframes mobileCartBadge{
0%{transform:scale(1)}
32%{transform:scale(1.45)}
72%{transform:scale(.94)}
100%{transform:scale(1)}
}

}

@media(max-width:640px){
.header-inner,
.yoko-header .header-inner{
height:82px;
grid-template-columns:52px minmax(0,1fr) 52px;
gap:10px;
}

.yoko-header .brand-logo-badge{
height:60px;
min-width:156px;
padding:9px 15px;
border-radius:18px;
}

.yoko-header .brand-logo-badge img{
height:39px;
max-width:138px;
}

.brand-copy{
display:none;
}

.site-footer .brand-copy{
display:grid;
max-width:220px;
}

.site-footer .brand-copy strong{
font-size:22px;
}

.site-footer .brand-copy small{
font-size:12px;
}

.site-footer .brand-logo-badge{
min-width:118px;
width:max-content;
max-width:100%;
}

.site-footer{
margin-bottom:calc(-86px - env(safe-area-inset-bottom));
padding-bottom:calc(104px + 86px + env(safe-area-inset-bottom));
}

.site-footer-inner{
grid-template-columns:1fr;
align-items:stretch;
gap:12px;
}

.site-footer .brand-logo-link{
justify-self:start;
}

.site-footer-info{
width:100%;
min-height:64px;
padding:10px 12px;
border-radius:16px;
}

.site-footer-icon{
width:40px;
height:40px;
border-radius:13px;
}

.site-footer-info strong{
font-size:15px;
}

.site-footer-links{
display:grid;
grid-template-columns:1fr 1fr;
gap:10px;
width:100%;
min-width:0;
}

.site-footer-links a{
min-height:48px;
border-radius:14px;
padding:9px 10px;
}

.site-footer-legal{
display:grid;
gap:5px;
padding-top:14px;
font-size:11px;
line-height:1.45;
}

.site-footer-legal strong{
font-size:12px;
}

.logo-text{
font-size:22px;
}

.cart-button{
min-height:48px;
border-radius:16px;
}

.cart-button-text{
display:none;
}

.menu-toolbar{
grid-template-columns:auto minmax(0,1fr);
align-items:center;
}
.menu-toolbar .search-toggle{
display:none;
}
.menu-toolbar .search-box{
display:block;
width:100%;
opacity:1;
pointer-events:auto;
}
.menu-toolbar .search-box input{
height:46px;
border-radius:14px;
font-size:15px;
}
.category-links{
grid-column:1 / -1;
width:100%;
padding-bottom:2px;
}

.order-detail-modal{
align-items:center;
padding:10px 10px calc(14px + env(safe-area-inset-bottom));
z-index:40000;
}

.order-detail-card{
width:100%;
height:min(820px,94dvh);
max-height:calc(100dvh - 24px - env(safe-area-inset-bottom));
border-radius:26px;
overflow:hidden;
}

.order-detail-scroll{
padding:28px 24px 14px;
}

.order-detail-action-bar{
position:sticky;
left:0;
right:0;
bottom:0;
z-index:1;
padding:12px 18px calc(12px + env(safe-area-inset-bottom));
background:rgba(255,255,255,.96);
backdrop-filter:blur(16px);
}

.order-detail-card h2{
font-size:28px;
padding-right:48px;
}

.order-detail-meta{
align-items:flex-start;
flex-direction:column;
gap:6px;
}

.order-detail-item{
grid-template-columns:1fr;
gap:10px;
}

.order-detail-item b{
justify-self:start;
}

.menu-toolbar > .cart-button.menu-cart-button{
display:none;
}
.menu-cart-button .cart-button-text{
display:none;
}
.products-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:28px 16px;
}
.product-card{
min-height:0;
border-radius:18px;
display:flex;
flex-direction:column;
align-items:center;
background:#fff;
box-shadow:0 12px 30px rgba(25,20,18,.07);
overflow:hidden;
padding:10px 8px 12px;
position:relative;
text-align:center;
}
.product-card:hover{
transform:none;
}
.product-image{
width:100%;
height:auto;
aspect-ratio:1/1;
margin:0;
border-radius:0;
align-self:start;
background:transparent;
overflow:visible;
}
.product-image::after{
content:none;
position:absolute;
left:18%;
right:18%;
bottom:7%;
height:15%;
border-radius:50%;
background:rgba(0,0,0,.12);
filter:blur(10px);
z-index:0;
pointer-events:none;
}
.product-image img{
position:relative;
z-index:1;
width:100%;
height:100%;
object-fit:contain;
filter:none;
transition:transform .25s ease;
}
.product-body{
min-width:0;
width:100%;
padding:8px 2px 0;
display:flex;
flex-direction:column;
align-items:center;
}
.product-title{
width:100%;
min-height:38px;
max-height:calc(1.22em * 2);
font-size:14px;
line-height:1.22;
font-weight:900;
margin-bottom:8px;
display:-webkit-box;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
overflow:hidden;
text-overflow:ellipsis;
}
.product-description{
display:none;
}
.product-meta{
display:none;
}
.product-footer{
display:flex;
justify-content:center;
align-items:center;
width:100%;
}
.product-price{
display:none;
}
.product-actions{
display:flex;
justify-content:center;
}
.product-add{
width:auto;
min-width:0;
height:30px;
min-height:30px;
padding:0 12px;
border-radius:999px;
background:#f4f5f7;
color:#111;
box-shadow:none;
font-size:13px;
font-weight:900;
transition:transform .18s ease,background .18s ease,color .18s ease;
}
.product-add:hover{
background:#ffe8e8;
color:var(--red);
transform:translateY(-1px);
}
.product-add .cart-icon{
display:none;
}
.product-add-price{
display:inline;
white-space:nowrap;
}
.qty-control{
height:30px;
border-radius:999px;
padding:2px;
background:#f4f5f7;
box-shadow:none;
}
.qty-control button{
width:26px;
height:26px;
border-radius:999px;
background:#fff;
}
.qty-control span{
min-width:24px;
font-size:13px;
}
.favorite-toggle{
top:2px;
right:2px;
left:auto;
width:30px;
height:30px;
border-radius:999px;
font-size:16px;
background:rgba(255,255,255,.88);
box-shadow:0 8px 18px rgba(0,0,0,.08);
}

.checkout-form,
.order-summary,
.profile-card,
.account-section,
.address-item,
.address-add,
.notification-card,
.legal-card{
padding:22px;
border-radius:22px;
}

.checkout-card-head h3{
font-size:20px;
}

.cookie-notice{
align-items:stretch;
flex-direction:column;
bottom:12px;
padding:14px;
border-radius:18px;
}

.cookie-notice button{
width:100%;
}

.page-title{
font-size:42px;
}

.checkout-head{
flex-direction:column;
align-items:stretch;
}

.checkout-fields.two{
grid-template-columns:1fr;
}

.checkout-time-box,
.checkout-time-fields{
grid-template-columns:1fr;
}

.checkout-item{
grid-template-columns:64px 1fr;
}

.checkout-item-price{
grid-column:2;
}

.promo,
.history-order{
flex-direction:column;
align-items:stretch;
}

.favorite-grid{
grid-template-columns:1fr;
}

}

/* Final responsive overrides */
@media(max-width:820px){
.mobile-menu{
z-index:30000;
}
.mobile-menu-panel{
z-index:30001;
}
.product-modal-card{
grid-template-columns:1fr;
height:min(760px,90vh);
max-height:90vh;
overflow:hidden;
}
.product-modal-content{
min-height:0;
}
.product-modal-image img{
height:280px;
}
.modal-scroll-area{
padding:30px 30px 16px;
}
.modal-action-bar{
grid-template-columns:auto minmax(180px,1fr);
padding:16px 30px 30px;
}
}

@media(max-width:640px){
.account-top{
align-items:flex-start;
flex-direction:column;
margin-bottom:22px;
}
.account-top .logout-btn{
width:100%;
}
.account-bonus-panel{
grid-template-columns:1fr;
padding:22px;
border-radius:22px;
}
.account-bonus-panel h2{
font-size:26px;
}
.menu-toolbar{
grid-template-columns:auto minmax(0,1fr);
}
.menu-toolbar .search-toggle{
display:none;
}
.menu-toolbar .search-box,
.menu-toolbar.search-open .search-box{
display:block;
width:100%;
opacity:1;
pointer-events:auto;
}
.category-links{
grid-column:1 / -1;
}
.menu-toolbar > .cart-button.menu-cart-button{
position:fixed;
right:18px;
bottom:18px;
z-index:9000;
display:inline-flex;
height:58px;
min-height:58px;
border-radius:20px;
}
.modal-scroll-area{
padding:24px 24px 14px;
}
.modal-action-bar{
grid-template-columns:1fr;
gap:10px;
padding:14px 24px 24px;
}
.modal-price{
font-size:30px;
}
}

@media(max-width:820px){
.header .header-inner,
.yoko-header .header-inner{
display:grid;
grid-template-columns:52px minmax(0,1fr) 52px;
align-items:center;
justify-content:normal;
height:82px;
gap:10px;
}

.header .nav,
.header .desktop-nav,
.yoko-header .nav,
.yoko-header .desktop-nav,
.header .header-phone,
.yoko-header .header-phone,
.header .cart-button,
.yoko-header .cart-button{
display:none!important;
}

.header .brand-logo-link,
.yoko-header .brand-logo-link{
grid-column:2;
justify-self:center;
display:flex;
min-width:0;
gap:0;
}

.header .brand-copy,
.yoko-header .brand-copy{
display:none!important;
}

.header .brand-logo-badge,
.yoko-header .brand-logo-badge{
height:60px;
min-width:156px;
padding:9px 15px;
border-radius:18px;
}

.header .brand-logo-badge img,
.yoko-header .brand-logo-badge img{
height:39px;
max-width:138px;
}

.header .header-actions,
.yoko-header .header-actions{
grid-column:3;
justify-self:end;
display:flex;
align-items:center;
justify-content:flex-end;
gap:0;
}

.header .burger-button,
.yoko-header .burger-button{
grid-column:auto;
justify-self:auto;
display:flex;
width:50px;
height:50px;
border-radius:16px;
background:linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.055));
border:1px solid rgba(255,255,255,.12);
box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 28px rgba(0,0,0,.14);
}

.header .mobile-header-phone,
.yoko-header .mobile-header-phone{
grid-column:1;
justify-self:start;
width:50px;
height:50px;
border-radius:16px;
display:grid!important;
place-items:center;
background:linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.055));
border:1px solid rgba(255,255,255,.12);
box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 28px rgba(0,0,0,.14);
}

.header .mobile-header-phone .header-phone-icon,
.yoko-header .mobile-header-phone .header-phone-icon{
width:38px;
height:38px;
border-radius:13px;
box-shadow:0 8px 20px rgba(212,32,39,.24);
}

.header .mobile-menu,
.yoko-header .mobile-menu,
body > .mobile-menu{
position:fixed!important;
inset:0;
width:100vw;
max-width:100vw;
z-index:30000;
display:block;
background:rgba(0,0,0,.54);
backdrop-filter:blur(8px);
overflow:hidden;
overflow-x:hidden;
}

.header .mobile-menu[hidden],
.yoko-header .mobile-menu[hidden],
body > .mobile-menu[hidden]{
display:none!important;
}

.header .mobile-menu-panel,
.yoko-header .mobile-menu-panel,
body > .mobile-menu .mobile-menu-panel{
position:absolute;
top:0;
right:0;
bottom:0;
width:min(360px,calc(100vw - 24px));
max-width:100vw;
height:100dvh;
margin:0;
padding:18px;
box-sizing:border-box;
border-radius:24px 0 0 24px;
background:#fff;
box-shadow:-24px 0 70px rgba(0,0,0,.26);
overflow-x:hidden;
overflow-y:auto;
display:flex;
flex-direction:column;
gap:16px;
}

.header .mobile-menu-panel nav,
.yoko-header .mobile-menu-panel nav,
body > .mobile-menu .mobile-menu-panel nav{
display:grid!important;
gap:8px;
flex:0 0 auto;
}

.header .mobile-menu-panel nav a,
.yoko-header .mobile-menu-panel nav a,
body > .mobile-menu .mobile-menu-panel nav a{
min-height:48px;
display:flex;
align-items:center;
padding:0 14px;
border:1px solid rgba(212,32,39,.14);
border-radius:14px;
background:#fff8f5;
color:var(--text)!important;
font-size:16px;
font-weight:900;
text-decoration:none;
}

.header .mobile-menu-panel nav a.active,
.yoko-header .mobile-menu-panel nav a.active,
body > .mobile-menu .mobile-menu-panel nav a.active{
border-color:var(--red);
background:var(--red);
color:#fff!important;
box-shadow:0 12px 26px rgba(212,32,39,.2);
}

.header .mobile-menu-contact,
.yoko-header .mobile-menu-contact,
body > .mobile-menu .mobile-menu-contact{
margin-top:4px;
flex:0 0 auto;
}
}

@media(max-width:640px){
.menu-toolbar{
grid-template-columns:auto minmax(0,1fr);
align-items:center;
}

.menu-toolbar .search-toggle{
display:inline-flex!important;
grid-row:1;
}

.menu-toolbar .search-box{
display:block;
grid-column:2;
grid-row:1;
width:0;
min-width:0;
opacity:0;
pointer-events:none;
overflow:hidden;
}

.menu-toolbar.search-open .search-box{
width:100%;
opacity:1;
pointer-events:auto;
}

.menu-toolbar .category-links{
grid-column:2;
grid-row:1;
min-width:0;
width:100%;
padding-bottom:0;
}

.menu-toolbar.search-open .category-links{
display:none;
}

.menu-toolbar .search-box input{
height:46px;
border-radius:14px;
font-size:15px;
}
}

/* Motion polish */
@keyframes yokoOverlayIn{
from{opacity:0;}
to{opacity:1;}
}

@keyframes yokoOverlayOut{
from{opacity:1;}
to{opacity:0;}
}

@keyframes yokoModalIn{
from{opacity:0;transform:translateY(18px) scale(.97);}
to{opacity:1;transform:translateY(0) scale(1);}
}

@keyframes yokoModalOut{
from{opacity:1;transform:translateY(0) scale(1);}
to{opacity:0;transform:translateY(14px) scale(.98);}
}

@keyframes yokoPanelIn{
from{opacity:0;transform:translateX(28px);}
to{opacity:1;transform:translateX(0);}
}

@keyframes yokoPanelOut{
from{opacity:1;transform:translateX(0);}
to{opacity:0;transform:translateX(28px);}
}

.product-modal.active,
.delivery-modal.active,
.order-detail-modal.active,
.story-modal.active,
.auth-modal.active,
.mobile-menu:not([hidden]){
animation:yokoOverlayIn .22s ease both;
}

.product-modal.active.is-closing,
.delivery-modal.active.is-closing,
.order-detail-modal.active.is-closing,
.story-modal.active.is-closing,
.auth-modal.active.is-closing,
.mobile-menu.is-closing{
animation:yokoOverlayOut .2s ease both;
pointer-events:none;
}

.product-modal.active .product-modal-card,
.delivery-modal.active .delivery-modal-card,
.order-detail-modal.active .order-detail-card,
.story-modal.active .story-frame,
.auth-modal.active .auth-card{
animation:yokoModalIn .28s cubic-bezier(.2,.9,.24,1) both;
}

.product-modal.active.is-closing .product-modal-card,
.delivery-modal.active.is-closing .delivery-modal-card,
.order-detail-modal.active.is-closing .order-detail-card,
.story-modal.active.is-closing .story-frame,
.auth-modal.active.is-closing .auth-card{
animation:yokoModalOut .2s ease both;
}

.mobile-menu:not([hidden]) .mobile-menu-panel{
animation:yokoPanelIn .28s cubic-bezier(.2,.9,.24,1) both;
}

.mobile-menu.is-closing .mobile-menu-panel{
animation:yokoPanelOut .2s ease both;
}

:where(button,.btn,.cart-button,.product-add,.delivery-method,.option-choice,.option-tile,.cheese-button,.size-choice span,.exclude-chip span,.mobile-tab,.mobile-menu-panel nav a,.checkout-btn,.place-order-btn):not(:disabled){
transition:
transform .18s ease,
box-shadow .18s ease,
background-color .18s ease,
border-color .18s ease,
color .18s ease,
filter .18s ease;
}

@media(hover:hover){
:where(button,.btn,.cart-button,.product-add,.delivery-method,.option-choice,.option-tile,.cheese-button,.mobile-tab,.mobile-menu-panel nav a,.checkout-btn,.place-order-btn):not(:disabled):hover{
transform:translateY(-1px);
filter:saturate(1.04);
}

.mobile-menu-panel nav a:not(.active):hover,
.delivery-method:hover,
.option-choice:hover,
.option-tile:hover,
.cheese-button:hover{
box-shadow:0 12px 26px rgba(25,20,18,.08);
}
}

:where(button,.btn,.cart-button,.product-add,.delivery-method,.option-choice,.option-tile,.cheese-button,.mobile-tab,.mobile-menu-panel nav a,.checkout-btn,.place-order-btn):not(:disabled):active{
transform:translateY(0) scale(.98);
}

@media(prefers-reduced-motion:reduce){
*,
*::before,
*::after{
animation-duration:.01ms!important;
animation-iteration-count:1!important;
scroll-behavior:auto!important;
transition-duration:.01ms!important;
}
}