/* Cafe School — sticker-book stationery shop.
   Layout: sticky header + category strip, RTL shop with right sidebar, ink-outlined sticker cards. */
@font-face{font-family:"Vazirmatn";src:url(../fonts/Vazirmatn-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Vazirmatn";src:url(../fonts/Vazirmatn-Medium.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Vazirmatn";src:url(../fonts/Vazirmatn-Bold.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Vazirmatn";src:url(../fonts/Vazirmatn-Black.woff2) format("woff2");font-weight:900;font-display:swap}
@font-face{font-family:"Lalezar";src:url(../fonts/Lalezar-Regular.woff) format("woff");font-weight:400;font-display:swap}

:root{
  --ink:#2a1b4a; --ink-2:#4b3d6e; --muted:#73668f;
  --paper:#fbf7ff; --card:#ffffff; --line:#e7ddf6; --line-2:#d6c8ee;
  --pink:#ff7eb6; --pink-d:#e9579a; --sun:#ffd447; --mint:#5fe0c0; --sky:#8fb8ff; --lilac:#c9a7ff; --peach:#ffb59a;
  --good:#0f9a74; --warn:#c77700; --bad:#d63a55;
  --f-display:"Lalezar","Vazirmatn",Tahoma,sans-serif;
  --f-body:"Vazirmatn",Tahoma,"Segoe UI",Arial,sans-serif;
  --r:18px; --r-sm:12px;
  --sh:3px 3px 0 var(--ink); --sh-lg:6px 6px 0 var(--ink);
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:150px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--f-body);font-size:15px;line-height:1.85;direction:rtl;
  background-image:radial-gradient(color-mix(in srgb,var(--lilac) 30%,transparent) 1.1px,transparent 1.5px);background-size:24px 24px}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
h1,h2,h3{line-height:1.4;text-wrap:balance;margin:0}
p{margin:0 0 .8em}
:focus-visible{outline:3px dashed var(--pink-d);outline-offset:3px}
[hidden]{display:none!important}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;right:16px;top:-60px;background:var(--ink);color:#fff;padding:8px 14px;border-radius:10px;z-index:100}
.skip:focus{top:10px}
.wrap{max-width:1240px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.muted{color:var(--muted)}
.hint{display:block;font-size:12.5px;color:var(--muted);line-height:1.7;margin-top:2px}
.link{color:var(--pink-d);font-weight:700;text-decoration:none}
.link:hover{text-decoration:underline}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.eyebrow{display:inline-block;font-size:12.5px;font-weight:700;letter-spacing:.4px;color:var(--ink-2);background:var(--card);border:2px solid var(--ink);border-radius:999px;padding:0 12px}
.sec-title{font-family:var(--f-display);font-weight:400;font-size:26px;color:var(--ink)}
.sec-title small{font-family:var(--f-body);font-size:13px;color:var(--muted);font-weight:500;margin-inline-start:6px}
.page-title{font-family:var(--f-display);font-weight:400;font-size:clamp(26px,4vw,36px)}
.narrow-top{padding-block:22px 10px}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:2.5px solid var(--ink);border-radius:14px;padding:9px 18px;background:var(--card);color:var(--ink);
  font-weight:700;text-decoration:none;box-shadow:var(--sh);transition:transform .12s,box-shadow .12s;white-space:nowrap;line-height:1.6}
.btn:hover{transform:translate(-1px,-2px);box-shadow:4px 5px 0 var(--ink)}
.btn:active{transform:translate(2px,2px);box-shadow:0 0 0 var(--ink)}
.btn[disabled]{opacity:.45;pointer-events:none}
.btn-pink{background:var(--pink)}.btn-sun{background:var(--sun)}.btn-mint{background:var(--mint)}.btn-sky{background:var(--sky)}
.btn-ink{background:var(--ink);color:#fff}
.btn-ghost{box-shadow:none;background:transparent}
.btn-ghost:hover{box-shadow:var(--sh)}
.btn-danger{background:#fff;color:var(--bad);border-color:var(--bad);box-shadow:none}
.btn-sm{padding:3px 10px;font-size:13px;border-width:2px;border-radius:10px;box-shadow:2px 2px 0 var(--ink)}
.btn.wide{width:100%}
.icon-btn{border:0;background:transparent;color:var(--muted);font-size:16px;width:34px;height:34px;border-radius:10px}
.icon-btn:hover{background:color-mix(in srgb,var(--bad) 12%,transparent);color:var(--bad)}

/* header */
.topbar{background:var(--ink);color:#fff;font-size:13px;text-align:center;padding-block:5px}
.site-head{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:var(--sun);border-bottom:2.5px solid var(--ink)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:41;background:var(--sun)}
.head-row{display:flex;align-items:center;gap:16px;padding-block:10px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;flex:none}
.brand img{width:48px;height:48px;transform:rotate(-8deg);transition:transform .2s}
.brand:hover img{transform:rotate(6deg) scale(1.05)}
.brand b{display:block;font-family:var(--f-display);font-weight:400;font-size:27px;line-height:1.1}
.brand small{display:block;font-size:12px;color:var(--ink-2);font-weight:500}
.head-search{flex:1;display:flex;max-width:520px;margin-inline-start:auto;background:#fff;border:2.5px solid var(--ink);border-radius:999px;overflow:hidden;min-width:0}
.head-search input{flex:1;border:0;background:transparent;padding:8px 16px;min-width:0}
.head-search input:focus{outline:none}
.head-search button{border:0;background:var(--pink);border-inline-start:2.5px solid var(--ink);padding:0 14px;display:grid;place-items:center}
.head-nav{display:flex;gap:8px;flex:none}
.hbtn{display:inline-flex;align-items:center;gap:6px;text-decoration:none;font-weight:700;background:#fff;border:2.5px solid var(--ink);border-radius:14px;padding:7px 12px;box-shadow:var(--sh)}
.hbtn:hover{transform:translate(-1px,-1px)}
.cart-btn .count{background:var(--pink);border:2px solid var(--ink);border-radius:999px;min-width:24px;height:24px;display:inline-grid;place-items:center;font-size:12px;padding:0 6px;line-height:1}
.catbar{background:#fff;border-top:2.5px solid var(--ink)}
.catbar-row{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;padding-block:6px}
.catbar-row::-webkit-scrollbar{display:none}
.catbar a{flex:none;text-decoration:none;font-weight:700;font-size:14px;padding:4px 12px;border-radius:999px;color:var(--ink-2)}
.catbar a:hover{background:color-mix(in srgb,var(--lilac) 30%,#fff);color:var(--ink)}

/* flash messages / notices */
.flashes{display:grid;gap:8px;padding-top:14px}
.flash-msg{border:2px solid var(--ink);border-radius:var(--r-sm);padding:10px 14px;background:#fff;font-weight:500}
.flash-msg.ok{background:color-mix(in srgb,var(--mint) 28%,#fff)}
.flash-msg.err{background:color-mix(in srgb,var(--bad) 12%,#fff);border-color:var(--bad)}
.flash-msg.info{background:color-mix(in srgb,var(--sky) 25%,#fff)}
.notice{border:2.5px solid var(--ink);border-radius:var(--r);padding:16px 18px;margin-bottom:18px;background:#fff}
.notice b{display:block;font-size:16px;margin-bottom:4px}
.notice p{margin:0}
.notice.ok{background:color-mix(in srgb,var(--mint) 25%,#fff)}
.notice.warn{background:color-mix(in srgb,var(--sun) 35%,#fff)}
.notice.info{background:color-mix(in srgb,var(--sky) 22%,#fff);margin-block:14px}
.notice form{margin-top:10px}

/* hero */
.hero{padding-block:30px 8px}
.hero-row{display:grid;grid-template-columns:1.15fr .85fr;gap:30px;align-items:center}
.hero h1{font-family:var(--f-display);font-weight:400;font-size:clamp(34px,5.6vw,60px);line-height:1.25;margin-block:12px 10px}
.hero h1 em{font-style:normal;color:var(--pink);-webkit-text-stroke:1.6px var(--ink);paint-order:stroke fill;display:inline-block}
.hero p{color:var(--ink-2);max-width:48ch;font-size:16px}
.hero-cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.hero-card{position:relative;background:var(--lilac);border:2.5px solid var(--ink);border-radius:30px;box-shadow:var(--sh-lg);padding:18px;transform:rotate(-1.5deg);display:grid;gap:12px}
.hero-card.is-off{background:var(--sky)}
.hero-art{width:100%;max-height:250px;object-fit:contain}
.flash-box{background:#fff;border:2.5px solid var(--ink);border-radius:20px;padding:12px 14px;display:grid;gap:6px;text-align:center}
.flash-box b{font-size:15px}
.flash-tag{justify-self:center;background:var(--sun);border:2px solid var(--ink);border-radius:999px;padding:0 12px;font-weight:900;font-size:13px}
.clock{display:flex;justify-content:center;gap:8px;direction:ltr}
.clock div{background:var(--paper);border:2.5px solid var(--ink);border-radius:14px;min-width:64px;padding:2px 4px 4px;box-shadow:2px 2px 0 var(--ink)}
.clock span{display:block;font-family:var(--f-display);font-size:30px;line-height:1.2}
.clock small{font-size:11px;color:var(--muted)}

/* perks */
.perks{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-block:34px}
.perk{display:flex;gap:12px;align-items:center;background:#fff;border:2px solid var(--line-2);border-radius:var(--r);padding:12px 14px}
.perk img{width:44px;height:44px;flex:none}
.perk b{display:block;font-size:15px}.perk small{color:var(--muted);font-size:12.5px;line-height:1.6;display:block}

/* deals */
.deals{margin-top:34px;border:2.5px solid var(--ink);border-radius:28px;padding:20px;box-shadow:var(--sh-lg)}
.deals-day{background:linear-gradient(135deg,color-mix(in srgb,var(--pink) 30%,#fff),color-mix(in srgb,var(--sun) 40%,#fff))}
.deals-week{background:linear-gradient(135deg,color-mix(in srgb,var(--sky) 35%,#fff),color-mix(in srgb,var(--mint) 30%,#fff))}
.deals-head{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.deals-head .sec-title{font-size:30px;margin-top:6px}
.mini-clock{display:flex;align-items:baseline;gap:4px;direction:ltr;background:var(--ink);color:#fff;border-radius:14px;padding:6px 12px}
.mini-clock span{font-family:var(--f-display);font-size:24px;line-height:1;min-width:1.6ch;text-align:center}
.mini-clock small{font-size:11px;opacity:.75;margin-inline-end:6px}
.deal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.deal-card{background:#fff;border:2.5px solid var(--ink);border-radius:22px;overflow:hidden;display:grid;grid-template-columns:42% 1fr;min-width:0}
.deal-img{background:var(--paper);border-inline-start:2.5px solid var(--ink);display:block}
.deal-img img{width:100%;height:100%;object-fit:cover;aspect-ratio:1}
.deal-body{padding:12px 14px;display:flex;flex-direction:column;gap:6px;min-width:0}
.deal-body h3{font-size:15px;font-weight:700;line-height:1.6}
.deal-body h3 a{text-decoration:none}
.deal-pct{align-self:flex-start;background:var(--pink);border:2px solid var(--ink);border-radius:10px;padding:0 8px;font-weight:900;font-size:13px}
.deal-stock{height:8px;border-radius:99px;background:var(--line);overflow:hidden;border:1.5px solid var(--ink)}
.deal-stock span{display:block;height:100%;background:var(--pink)}
.deal-body .btn{margin-top:auto;padding:6px 12px;font-size:14px}
.deal-body form{margin-top:auto}

/* shop layout */
.shop{display:grid;grid-template-columns:270px minmax(0,1fr);gap:26px;align-items:start;margin-top:34px}
.side{position:sticky;top:150px}
.side-toggle{display:none}
.side-body{display:grid;gap:14px}
.side-box{background:#fff;border:2px solid var(--line-2);border-radius:var(--r);padding:14px}
.side-h{font-size:15px;font-weight:900;margin-bottom:8px}
.side-search{display:flex;border:2px solid var(--ink);border-radius:12px;overflow:hidden}
.side-search input{flex:1;border:0;padding:7px 10px;min-width:0;background:transparent}
.side-search input:focus{outline:none}
.side-search button{border:0;background:var(--sun);border-inline-start:2px solid var(--ink);padding:0 10px}
.check{display:flex;gap:8px;align-items:center;font-size:14px;margin-top:10px;cursor:pointer}
.check input{width:18px;height:18px;accent-color:var(--pink-d)}
.side-cats{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.side-cats a{display:flex;justify-content:space-between;align-items:center;text-decoration:none;padding:6px 10px;border-radius:10px;font-weight:500}
.side-cats a span{font-size:12px;color:var(--muted);background:var(--paper);border-radius:99px;padding:0 8px}
.side-cats a:hover{background:var(--paper)}
.side-cats a.on{background:var(--mint);font-weight:700;box-shadow:inset 0 0 0 2px var(--ink)}
.side-cats a.on span{background:#fff}
.side-help{background:color-mix(in srgb,var(--sun) 30%,#fff);border-color:var(--ink)}
.side-help p{font-size:13px;margin:4px 0 0}
.shop-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.sort-form{display:flex;align-items:center;gap:8px;font-size:14px}
.sort-form select{border:2px solid var(--ink);border-radius:10px;padding:4px 10px;background:#fff}

/* product grid + card */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(205px,1fr));gap:18px}
.grid-4{grid-template-columns:repeat(4,1fr)}
.pcard{background:var(--card);border:2.5px solid var(--ink);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;transition:transform .15s,box-shadow .15s;min-width:0}
.pcard:hover{transform:translateY(-3px) rotate(-.6deg);box-shadow:var(--sh)}
.pcard:nth-child(even):hover{transform:translateY(-3px) rotate(.6deg)}
.pcard.is-out{opacity:.72}
.pcard-img{position:relative;display:block;aspect-ratio:1;background:var(--paper);border-bottom:2.5px solid var(--ink)}
.pcard-img img{width:100%;height:100%;object-fit:cover}
.off-badge{position:absolute;top:10px;left:10px;background:var(--pink);border:2px solid var(--ink);border-radius:10px;padding:0 8px;font-weight:900;font-size:14px;transform:rotate(-8deg)}
.off-badge.hot{background:var(--sun)}
.off-badge.big{font-size:20px;padding:2px 12px;top:16px;left:16px}
.tag-badge{position:absolute;bottom:10px;right:10px;background:var(--ink);color:#fff;border-radius:999px;padding:0 10px;font-size:12px;font-weight:700}
.pcard-body{padding:10px 12px 12px;display:flex;flex-direction:column;gap:4px;flex:1}
.pcard-cat{font-size:12px;color:var(--muted);text-decoration:none}
.pcard-cat:hover{color:var(--pink-d)}
.pcard-title{font-size:14.5px;font-weight:700;line-height:1.65}
.pcard-title a{text-decoration:none}
.pcard-title a:hover{color:var(--pink-d)}
.pcard-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:8px;margin-top:auto;padding-top:6px}
.price{display:flex;flex-direction:column;line-height:1.4}
.price s{color:var(--muted);font-size:12.5px}
.price b{font-size:17px;font-weight:900}
.price b small{font-size:12px;font-weight:500}
.price.big{flex-direction:row;align-items:baseline;gap:12px;flex-wrap:wrap}
.price.big b{font-size:28px}
.price.big s{font-size:15px}
.add-btn{flex:none;width:40px;height:40px;border-radius:12px;border:2.5px solid var(--ink);background:var(--mint);font-size:24px;font-weight:700;line-height:1;box-shadow:2px 2px 0 var(--ink)}
.add-btn:hover{background:var(--pink)}
.stock-out{color:var(--bad);font-weight:700;font-size:13px}
.stock-out.big{font-size:16px}
.stock-low{color:var(--warn);font-weight:700;font-size:12.5px}
.stock-ok{color:var(--good);font-weight:700;font-size:13px;margin:0}
.empty{background:#fff;border:2.5px dashed var(--line-2);border-radius:var(--r);padding:30px;text-align:center;display:grid;gap:8px;justify-items:center}
.empty.big{padding:50px 20px}
.empty b{font-size:17px}
.pager{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin-top:24px}
.pager a,.pager span{min-width:40px;height:40px;display:inline-grid;place-items:center;border:2px solid var(--ink);border-radius:12px;background:#fff;text-decoration:none;font-weight:700;padding:0 10px}
.pager .on{background:var(--ink);color:#fff}
.pager span:not(.on){border-color:transparent;background:transparent}

/* seo block */
.seo-text{margin-top:44px;background:#fff;border:2px solid var(--line-2);border-radius:24px;padding:24px 26px;position:relative}
.seo-inner{max-height:230px;overflow:hidden;position:relative;color:var(--ink-2)}
.seo-inner::after{content:"";position:absolute;inset:auto 0 0;height:90px;background:linear-gradient(transparent,#fff)}
.seo-inner.open{max-height:none}.seo-inner.open::after{display:none}
.seo-inner h2{font-family:var(--f-display);font-weight:400;font-size:22px;color:var(--ink);margin:16px 0 6px}
.seo-inner h2:first-child{margin-top:0}
.seo-inner h3{font-size:17px;margin:12px 0 4px}
.seo-inner p,.seo-inner li{max-width:80ch}
.seo-more{margin-top:10px;border:0;background:none;color:var(--pink-d);font-weight:700;padding:0}

/* crumbs + page head */
.crumbs{display:flex;gap:6px;flex-wrap:wrap;font-size:13px;color:var(--muted);padding-top:18px}
.crumbs a{text-decoration:none}.crumbs a:hover{color:var(--pink-d)}
.crumbs b{color:var(--ink);font-weight:500}
.page-head{margin-top:10px}
.page-head h1{font-family:var(--f-display);font-weight:400;font-size:clamp(28px,4.5vw,42px)}
.lead{color:var(--ink-2);font-size:16px;max-width:70ch}

/* product page */
.pd{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:34px;margin-top:14px;align-items:start}
.pd-main{position:relative;border:2.5px solid var(--ink);border-radius:24px;overflow:hidden;background:#fff;box-shadow:var(--sh-lg)}
.pd-main img{width:100%;aspect-ratio:1;object-fit:cover}
.pd-thumbs{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.pd-thumbs button{padding:0;width:74px;height:74px;border:2.5px solid var(--line-2);border-radius:14px;overflow:hidden;background:#fff}
.pd-thumbs button.on{border-color:var(--ink);box-shadow:2px 2px 0 var(--ink)}
.pd-thumbs img{width:100%;height:100%;object-fit:cover}
.pd-info h1{font-family:var(--f-display);font-weight:400;font-size:clamp(28px,3.6vw,40px);margin-block:4px 8px}
.pd-buy{background:#fff;border:2.5px solid var(--ink);border-radius:24px;padding:18px;margin-top:14px;display:grid;gap:12px}
.pd-deal{display:flex;justify-content:space-between;align-items:center;gap:8px;background:var(--sun);border:2px solid var(--ink);border-radius:14px;padding:6px 12px}
.inline-clock{font-family:var(--f-display);font-size:22px;direction:ltr;letter-spacing:1px}
.pd-form{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.qty{display:inline-flex;align-items:center;border:2.5px solid var(--ink);border-radius:14px;overflow:hidden;background:#fff}
.qty button{border:0;background:var(--sun);width:36px;height:40px;font-size:20px;font-weight:900}
.qty input{width:46px;text-align:center;border:0;border-inline:2px solid var(--ink);height:40px;font-weight:700;background:#fff}
.pd-ship{list-style:none;margin:0;padding:12px 0 0;border-top:2px dashed var(--line-2);display:grid;gap:2px;font-size:13.5px;color:var(--ink-2)}
.pd-ship li::before{content:"✦ ";color:var(--pink-d)}
.pd-tabs{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:26px;margin-top:40px;align-items:start}
.pd-desc,.pd-specs{background:#fff;border:2px solid var(--line-2);border-radius:24px;padding:22px}
.prose h2{font-family:var(--f-display);font-weight:400;font-size:22px;margin:18px 0 6px}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:17px;margin:14px 0 4px}
.prose p,.prose li{color:var(--ink-2);max-width:72ch}
.prose ul{padding-inline-start:20px;margin:0 0 .8em}
.pd-specs dl{margin:12px 0 0;display:grid}
.pd-specs dl div{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1.5px dashed var(--line)}
.pd-specs dt{color:var(--muted)}.pd-specs dd{margin:0;font-weight:700;text-align:left}
.related{margin-top:40px}
.related .sec-title{margin-bottom:14px}

/* panels + forms */
.panel{background:#fff;border:2px solid var(--line-2);border-radius:22px;padding:20px;min-width:0}
.panel .sec-title{font-size:22px;margin-bottom:12px;display:flex;align-items:center;gap:8px}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px 14px}
.full{grid-column:1/-1}
.f{display:flex;flex-direction:column;gap:4px;min-width:0}
.f label,.f legend{font-weight:700;font-size:13.5px}
fieldset.f{border:0;padding:0;margin:0}
.f input,.f select,.f textarea{border:2px solid var(--line-2);border-radius:12px;padding:9px 12px;background:var(--paper);width:100%;transition:border-color .15s}
.f input:focus,.f select:focus,.f textarea:focus{border-color:var(--ink);outline:none;background:#fff}
.f.is-err input,.f.is-err select,.f.is-err textarea{border-color:var(--bad);background:color-mix(in srgb,var(--bad) 6%,#fff)}
.field-err{color:var(--bad);font-size:12.5px;font-weight:500}
.panel.is-err{border-color:var(--bad)}
.num-dot{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--sun);border:2px solid var(--ink);font-family:var(--f-body);font-size:15px;font-weight:900}

/* cart */
.cart-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:22px;align-items:start;margin-top:14px}
.cart-row{display:grid;grid-template-columns:84px minmax(0,1fr) auto auto auto;gap:14px;align-items:center;padding-block:12px;border-bottom:1.5px dashed var(--line)}
.cart-row img{border-radius:14px;border:2px solid var(--ink);width:84px;height:84px;object-fit:cover}
.cart-row.warn{background:color-mix(in srgb,var(--sun) 15%,transparent)}
.cart-info{display:flex;flex-direction:column;gap:2px;min-width:0}
.cart-info a{text-decoration:none}
.cart-info small{color:var(--muted)}
.cart-sum{font-weight:900;min-width:90px;text-align:left}
.cart-list .row{margin-top:14px;justify-content:space-between}
.summary{position:sticky;top:150px;display:grid;gap:12px}
.coupon{display:flex;gap:8px}
.coupon input{flex:1;min-width:0;border:2px solid var(--line-2);border-radius:12px;padding:6px 10px;background:var(--paper)}
.coupon .btn{padding:4px 12px}
.coupon-co{max-width:520px;margin-top:16px;align-items:center;flex-wrap:wrap}
.coupon-co label{font-weight:700;font-size:14px}
.sum{margin:0;display:grid;gap:6px}
.sum div{display:flex;justify-content:space-between;gap:10px}
.sum dt{color:var(--ink-2)}.sum dd{margin:0;font-weight:700}
.sum .good dd,.sum .good dt{color:var(--good)}
.sum .tot{border-top:2.5px dashed var(--ink);padding-top:10px;margin-top:4px;font-size:18px}
.sum .tot dt{color:var(--ink);font-weight:900}.sum .tot dd{font-weight:900}

/* checkout */
.steps{display:flex;gap:6px;list-style:none;padding:0;margin:8px 0 18px;font-size:13.5px;font-weight:700;color:var(--muted);flex-wrap:wrap}
.steps li{display:flex;align-items:center;gap:6px}
.steps li+li::before{content:"";width:28px;height:2px;background:var(--line-2)}
.steps .done{color:var(--good)}.steps .on{color:var(--ink)}
.checkout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:22px;align-items:start}
.co-main{display:grid;gap:18px;min-width:0}
.opts{display:grid;gap:10px}
.opt{display:grid;grid-template-columns:auto 40px minmax(0,1fr) auto;gap:12px;align-items:center;border:2px solid var(--line-2);border-radius:16px;padding:12px 14px;background:var(--paper);cursor:pointer;transition:border-color .15s,background .15s}
.opt:hover{border-color:var(--ink)}
.opt input{width:20px;height:20px;accent-color:var(--pink-d)}
.opt b{display:block;font-size:15px}.opt small{display:block;color:var(--muted);font-size:12.5px;line-height:1.6}
.opt em{font-style:normal;font-weight:900;white-space:nowrap}
.opt:has(input:checked){border-color:var(--ink);background:color-mix(in srgb,var(--mint) 22%,#fff);box-shadow:var(--sh)}
.mini-lines{list-style:none;margin:0 0 6px;padding:0;display:grid;gap:8px}
.mini-lines li{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:10px;align-items:center;font-size:13.5px}
.mini-lines img{border-radius:10px;border:2px solid var(--ink);width:48px;height:48px;object-fit:cover}
.mini-lines small{color:var(--muted)}

/* order + account */
.order-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.order-grid,.acc-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
.acc-grid{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}
.acc-side{display:grid;gap:20px}
.kv{margin:0;display:grid}
.kv div{display:grid;grid-template-columns:130px minmax(0,1fr);gap:10px;padding:8px 0;border-bottom:1.5px dashed var(--line)}
.kv dt{color:var(--muted)}.kv dd{margin:0;font-weight:500;word-break:break-word}
.st{display:inline-block;border:2px solid var(--ink);border-radius:999px;padding:0 12px;font-size:12.5px;font-weight:700;white-space:nowrap}
.st-wait{background:var(--sun)}.st-paid{background:var(--mint)}.st-sent{background:var(--sky)}.st-done{background:var(--lilac)}.st-cancel{background:color-mix(in srgb,var(--bad) 25%,#fff)}
.card2card{margin-bottom:18px;display:grid;gap:12px}
.bank-card{max-width:400px;aspect-ratio:1.6;border:2.5px solid var(--ink);border-radius:20px;padding:18px;background:linear-gradient(135deg,var(--pink),var(--lilac) 60%,var(--sky));display:flex;flex-direction:column;justify-content:space-between;box-shadow:var(--sh-lg)}
.bc-bank{font-weight:900}.bc-num{font-family:var(--f-display);font-size:clamp(20px,5vw,28px);letter-spacing:2px;text-align:center}.bc-name{font-weight:700}
.order-list{list-style:none;margin:0;padding:0;display:grid}
.order-list li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 0;border-bottom:1.5px dashed var(--line)}
.order-list a{text-decoration:none;display:grid}
.order-list small{color:var(--muted)}

/* auth */
.auth{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr);gap:30px;align-items:center;padding-block:30px}
.auth-box{max-width:560px;display:grid;gap:12px}
.auth-box.wide-box{max-width:760px;grid-column:1/-1;justify-self:center;width:100%}
.auth-box form{display:grid;gap:12px}
.auth-box form.fgrid{display:grid}
.auth-alt{text-align:center;margin:0}
.auth-alt a{color:var(--pink-d);font-weight:700}
.auth-side{text-align:center;color:var(--ink-2)}
.auth-side img{margin:0 auto 12px;max-height:240px}
.page-prose{max-width:860px;margin-inline:auto}

/* footer */
.site-foot{margin-top:60px;background:var(--ink);color:#efe8ff}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:26px;padding-block:36px}
.brand-foot b{color:#fff}.brand-foot small{color:#c9bde6}
.foot-about p{font-size:13.5px;color:#cfc4ea;margin-top:12px}
.foot-h{font-family:var(--f-display);font-weight:400;font-size:19px;color:var(--sun);margin-bottom:8px}
.foot-links{list-style:none;margin:0;padding:0;display:grid;gap:4px;font-size:14px}
.foot-links a{text-decoration:none}.foot-links a:hover{color:var(--sun)}
.trust-row{display:flex;gap:10px;flex-wrap:wrap}
.seal{width:110px;height:110px;background:#fff;border-radius:16px;display:grid;place-items:center;overflow:hidden}
.seal-empty{background:transparent;border:2px dashed #8b7db0;color:#b3a6d6;font-size:13px;text-align:center;line-height:1.6}
.foot-bottom{border-top:1px solid #45366b;font-size:13px;color:#b3a6d6;padding-block:12px}

/* responsive */
@media (max-width:1100px){.deal-grid{grid-template-columns:1fr 1fr}.grid-4{grid-template-columns:repeat(3,1fr)}.foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:900px){
  .hero-row,.pd,.pd-tabs,.checkout,.cart-layout,.order-grid,.acc-grid,.auth{grid-template-columns:minmax(0,1fr)}
  .hero-card{max-width:440px;justify-self:center;width:100%}
  .shop{grid-template-columns:minmax(0,1fr);gap:16px}
  .side{position:static}
  .side-toggle{display:flex;justify-content:space-between;align-items:center;width:100%;border:2.5px solid var(--ink);border-radius:14px;background:#fff;padding:10px 14px;font-weight:700;box-shadow:var(--sh)}
  .side-toggle::after{content:"▾";transition:transform .2s}
  .side-toggle[aria-expanded="true"]::after{transform:rotate(180deg)}
  .side-body{display:none;margin-top:12px}
  .side-body.open{display:grid}
  .summary{position:static}
  .perks{grid-template-columns:1fr 1fr}
  .auth-side{display:none}
}
@media (max-width:640px){
  .head-row{flex-wrap:wrap;gap:10px}
  .head-search{order:3;flex-basis:100%;max-width:none}
  .hide-sm{display:none}
  .brand b{font-size:23px}.brand img{width:42px;height:42px}
  .deal-grid{grid-template-columns:minmax(0,1fr)}
  .grid,.grid-4{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .pcard-body{padding:8px 10px 10px}
  .pcard-title{font-size:13.5px}
  .price b{font-size:15px}
  .add-btn{width:36px;height:36px;font-size:20px}
  .fgrid{grid-template-columns:minmax(0,1fr)}
  .perks{grid-template-columns:minmax(0,1fr)}
  .cart-row{grid-template-columns:64px minmax(0,1fr) auto;grid-template-areas:"img info rm" "img qty sum"}
  .cart-row>a{grid-area:img}.cart-row img{width:64px;height:64px}.cart-info{grid-area:info}.cart-row .qty{grid-area:qty;justify-self:start}.cart-sum{grid-area:sum}.cart-row .icon-btn{grid-area:rm}
  .opt{grid-template-columns:auto 32px minmax(0,1fr);}
  .opt img{width:32px;height:32px}
  .opt em{grid-column:3}
  .kv div{grid-template-columns:minmax(0,1fr)}
  .seo-text{padding:18px}
  .foot-grid{grid-template-columns:minmax(0,1fr)}
  .clock div{min-width:56px}.clock span{font-size:26px}
  .deals{padding:14px;border-radius:22px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}html{scroll-behavior:auto}}