
:root{--paper:#fff;--bone:#F6F6FB;--sand:#ECECF5;--ink:#1B1B55;--ink2:#464670;--grey:#66668A;--line:#E1E1EE;--yellow:#F58220;--yellow-d:#DB6A0A;--yellow-t:#B04F00;--yellow-l:#FFEBD7;--blue:#2050E0;--pink:#E0105F;--card:#fff;--onacc:#1B1B55;--ok:#1F7A4D;--err:#B93A22;--errbg:#FCEDEA}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-font-smoothing:antialiased}
body{font-family:'Inter',system-ui,sans-serif;font-size:15px;line-height:1.5;color:var(--ink);background:var(--paper)}
h1,h2,h3,h4{font-family:'Inter Display','Inter',sans-serif;font-weight:700;letter-spacing:-.03em;line-height:1.08}
a{color:inherit;text-decoration:none}
svg{display:block}
.wrap{max-width:min(2000px,94vw);margin:0 auto;padding:0 40px}
.m-wrap{padding:0 18px}
/* announcement */
.announce{background:var(--ink);color:#fff;font-size:13px;text-align:center;padding:9px 16px}
.announce b{color:var(--yellow);font-weight:600}
/* header */
.hdr{border-bottom:1px solid var(--line);background:var(--card)}
.hdr .in{display:flex;align-items:center;gap:36px;height:76px}
.logo{display:flex;align-items:center;gap:10px;font-family:'Inter Display';font-weight:800;font-size:23px;letter-spacing:-.04em}
.logo small{font-weight:500;color:var(--grey);font-size:23px;margin-left:1px;letter-spacing:0}
.nav{display:flex;gap:26px;font-weight:500;font-size:14.5px}
.nav a{padding:6px 0;border-bottom:2px solid transparent}
.nav a.on{border-color:var(--yellow)}
.search{flex:1;max-width:340px;display:flex;align-items:center;gap:10px;height:44px;border:1px solid var(--line);border-radius:6px;padding:0 14px;color:var(--grey);background:var(--bone)}
.hicons{margin-left:auto;display:flex;gap:20px;align-items:center}
.hicons .bag{position:relative}
.hicons .cnt{position:absolute;top:-8px;right:-9px;background:var(--yellow);color:var(--ink);font-size:11px;font-weight:700;border-radius:99px;min-width:18px;height:18px;display:grid;place-items:center}
/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:50px;padding:0 26px;border-radius:6px;font-weight:600;font-size:15px;border:1.5px solid var(--ink);background:var(--card);color:var(--ink);white-space:nowrap}
.btn.pri{background:var(--yellow);border-color:var(--yellow)}
.btn.dark{background:var(--ink);color:#fff}
.btn.sm{height:40px;padding:0 16px;font-size:14px}
.btn.block{width:100%}
.btn.lg{height:56px;font-size:16px;padding:0 32px}
/* generic */
.sec{padding:84px 0}
.sec.bone{background:var(--bone)}
.sec-h{display:flex;justify-content:space-between;align-items:end;margin-bottom:34px}
.sec-h h2{font-size:38px}
.sec-h p{color:var(--ink2);margin-top:10px;max-width:520px}
.link{font-weight:600;border-bottom:2px solid var(--yellow);padding-bottom:1px}
.chip{display:inline-flex;align-items:center;height:34px;padding:0 14px;border:1px solid var(--line);border-radius:99px;font-size:13.5px;font-weight:500;background:var(--card)}
.chip.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.tag{display:inline-block;font-size:11.5px;font-weight:600;background:var(--yellow);padding:3px 8px;border-radius:3px}
.tag.g{background:var(--sand);color:var(--ink2)}
.stars{display:inline-flex;gap:1px;color:var(--yellow-t)}
.muted{color:var(--grey)}
.price{font-weight:700;font-family:'Inter Display'}
.price s{color:var(--grey);font-weight:400;margin-left:6px;font-size:.9em}
/* product tile + card */
.tile{position:relative;aspect-ratio:1/1;border-radius:8px;overflow:hidden;display:grid;place-items:center}
.tile svg.art{width:84%;height:84%}
.pcard .meta{padding:14px 2px 0}
.pcard h4{font-family:'Inter';font-size:15px;font-weight:600;letter-spacing:-.01em;line-height:1.3}
.pcard .row{display:flex;justify-content:space-between;align-items:center;margin-top:6px}
.pcard .r{font-size:12.5px;color:var(--ink2);display:flex;align-items:center;gap:4px}
.pcard .quick{position:absolute;right:10px;bottom:10px;height:38px;padding:0 14px;background:var(--card);border-radius:6px;font-weight:600;font-size:13px;display:flex;align-items:center;gap:7px;border:1px solid var(--line)}
.pcard .wish{position:absolute;right:10px;top:10px;width:36px;height:36px;border-radius:50%;background:var(--card);display:grid;place-items:center}
.pcard .badge{position:absolute;left:10px;top:10px}
.grid{display:grid;gap:28px 24px}
.g4{grid-template-columns:repeat(4,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g2{grid-template-columns:repeat(2,1fr)}.g6{grid-template-columns:repeat(6,1fr)}
/* crop marks on tile */
.crop{position:absolute;inset:14px;pointer-events:none}
.crop i{position:absolute;width:14px;height:14px;border-color:var(--ink);opacity:.55}
.crop i:nth-child(1){left:0;top:0;border-left:1.5px solid;border-top:1.5px solid}
.crop i:nth-child(2){right:0;top:0;border-right:1.5px solid;border-top:1.5px solid}
.crop i:nth-child(3){left:0;bottom:0;border-left:1.5px solid;border-bottom:1.5px solid}
.crop i:nth-child(4){right:0;bottom:0;border-right:1.5px solid;border-bottom:1.5px solid}
/* form */
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:13px;font-weight:600}
.input{height:46px;border:1.5px solid var(--line);border-radius:6px;padding:0 14px;display:flex;align-items:center;font-size:15px;background:var(--card);color:var(--ink)}
.input.ph{color:var(--grey)}
.input.focus{border-color:var(--ink);box-shadow:0 0 0 3px var(--yellow-l)}
.input.err{border-color:var(--err);background:var(--errbg)}
.help{font-size:12.5px;color:var(--grey)}.help.err{color:var(--err)}
.ta{height:96px;align-items:flex-start;padding-top:12px}
.sw{width:30px;height:30px;border-radius:50%;border:1px solid rgba(0,0,0,.18)}
.sw.on{outline:2px solid var(--ink);outline-offset:3px}
.size{min-width:46px;height:42px;border:1.5px solid var(--line);border-radius:6px;display:grid;place-items:center;font-weight:600;font-size:14px;padding:0 10px}
.size.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.size.off{color:#bbb;text-decoration:line-through;background:var(--bone)}
.qty{display:inline-flex;align-items:center;border:1.5px solid var(--line);border-radius:6px;height:42px}
.qty span{width:40px;text-align:center;font-weight:600}
.qty i{width:36px;display:grid;place-items:center;font-style:normal}
.hr{height:1px;background:var(--line);margin:18px 0}
.box{border:1px solid var(--line);border-radius:8px;background:var(--card)}
.pad{padding:24px}
/* footer */
.ftr{background:var(--ink);color:#d9d6cd;padding:70px 0 28px}
.ftr h5{color:#fff;font-size:14px;margin-bottom:16px;font-family:'Inter';font-weight:600}
.ftr li{list-style:none;margin-bottom:10px;font-size:14px}
.ftr .cols{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1.3fr;gap:40px}
.ftr .bot{border-top:1px solid #34332f;margin-top:46px;padding-top:22px;display:flex;justify-content:space-between;font-size:13px;color:#a8a49a}
.pay{display:flex;gap:8px}.pay span{border:1px solid #4a4944;border-radius:4px;padding:3px 8px;font-size:12px;color:#d9d6cd}
.crumb{font-size:13px;color:var(--grey);padding:22px 0}
.crumb b{color:var(--ink);font-weight:500}

.btn.pri,.tag{color:var(--onacc)}.btn.pri{background:var(--yellow);border-color:var(--yellow)}.hicons .cnt{color:var(--onacc)}
.btn{cursor:pointer;font-family:inherit}button.btn{appearance:none}
.theme-forest{--yellow:#1F9D63;--yellow-d:#17794c;--yellow-l:#DDF1E7;--onacc:#fff}
.theme-coral{--yellow:#FF5A3C;--yellow-d:#d9432a;--yellow-l:#FFE3DC;--onacc:#fff}
.theme-indigo{--yellow:#4B5BFF;--yellow-d:#3745d6;--yellow-l:#E3E6FF;--onacc:#fff}
.theme-utility .hdr{border-bottom:2px solid var(--ink)}.theme-utility .sec{padding:48px 0}.theme-utility .sec-h h2{font-size:28px}.theme-utility h1{letter-spacing:-.035em}
.theme-utility .hero{padding-top:32px!important;padding-bottom:40px!important}.theme-utility .hero h1{font-size:46px!important}.theme-utility .collage{display:none}.util-only{display:none}.theme-utility .util-only{display:block}
.flash{background:var(--yellow-l);border-bottom:1px solid var(--yellow);padding:12px 0;font-weight:600}
.err-box{background:var(--errbg);border:1px solid var(--err);color:var(--err);padding:12px 14px;border-radius:6px;margin-bottom:16px;font-size:14px}
a.card-link{display:block}.pcard h4 a:hover{text-decoration:underline}
input.input,select.input,textarea.input{font:inherit;width:100%;outline:none}textarea.input{height:96px;padding:12px 14px;resize:vertical}
input.input:focus,select.input:focus,textarea.input:focus{border-color:var(--ink);box-shadow:0 0 0 3px var(--yellow-l)}
.field label small{font-weight:400;color:var(--grey)}
table.t{width:100%;border-collapse:collapse;font-size:14px}table.t th{text-align:left;color:var(--grey);font-weight:600;padding:10px 8px;border-bottom:1px solid var(--line)}table.t td{padding:12px 8px;border-bottom:1px solid var(--line);vertical-align:top}
.tiers{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:10px 0 18px}.tiers div{border:1px solid var(--line);border-radius:6px;padding:8px;text-align:center;font-size:13px}.tiers div.on{border-color:var(--ink);background:var(--yellow-l)}
#tp{position:fixed;right:16px;bottom:16px;z-index:99;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:0 8px 28px rgba(0,0,0,.14);font-size:13px}
#tp summary{padding:10px 14px;font-weight:600;cursor:pointer;list-style:none}#tp .in{padding:0 14px 14px;width:250px}#tp b{display:block;margin:6px 0}
#tp .row{display:flex;flex-wrap:wrap;gap:6px}#tp button{font:inherit;font-weight:600;border:1.5px solid var(--line);background:#fff;border-radius:6px;padding:5px 9px;cursor:pointer;color:var(--ink)}#tp button.on{background:var(--ink);color:#fff;border-color:var(--ink)}
#tp input[type=color]{width:100%;height:36px;border:1px solid var(--line);border-radius:6px;padding:2px;background:#fff}
.admin-wrap{display:grid;grid-template-columns:210px 1fr;min-height:100vh}.admin-nav{background:var(--ink);color:#fff;padding:24px 18px}.admin-nav a{display:block;padding:9px 10px;border-radius:6px;color:#d9d6cd;margin-bottom:2px}.admin-nav a:hover,.admin-nav a.on{background:#2b2b30;color:#fff}.admin-main{padding:32px 40px;background:var(--bone)}
.badge-s{display:inline-block;padding:2px 9px;border-radius:99px;font-size:12px;font-weight:600;background:var(--sand)}
@media(max-width:820px){.wrap{padding:0 18px}.g4,.g3{grid-template-columns:repeat(2,1fr)}.g6{grid-template-columns:repeat(3,1fr)}.nav,.search{display:none}.hero{grid-template-columns:1fr!important}.hero h1{font-size:44px!important}.collage{height:300px!important}.ftr .cols{grid-template-columns:1fr 1fr}.two-col{grid-template-columns:1fr!important}.sec{padding:48px 0}.hdr .in{gap:14px}}

.tile img.art{max-width:100%;max-height:100%}.tile img.art[src^="/uploads/"]{width:100%;height:100%;object-fit:cover}

/* 3D look for product pictures */
.tile{transform-style:preserve-3d;transition:transform .25s ease,box-shadow .25s ease;box-shadow:0 1px 0 rgba(255,255,255,.7) inset,0 14px 24px -12px rgba(23,23,26,.28),0 2px 6px rgba(23,23,26,.08);will-change:transform}
.tile::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:radial-gradient(circle at var(--mx,30%) var(--my,20%),rgba(255,255,255,.38),rgba(255,255,255,0) 55%),linear-gradient(135deg,rgba(255,255,255,.18),rgba(0,0,0,.06))}
.tile img.art,.tile svg.art{filter:drop-shadow(0 14px 12px rgba(23,23,26,.22))}
.tile img.art[src^="/uploads/"]{filter:none}
.t3d{transform:perspective(900px) rotateX(var(--rx,2deg)) rotateY(var(--ry,-3deg))}
.t3d.live{transition:transform .08s linear,box-shadow .25s ease}
.t3d:hover{box-shadow:0 26px 36px -16px rgba(23,23,26,.4),0 4px 10px rgba(23,23,26,.1)}
@media (prefers-reduced-motion:reduce){.t3d{transform:none!important}}

/* Product cards (listing look) */
.pc2{background:var(--card,#fff);border:1px solid var(--line);border-radius:12px;padding:10px 10px 14px;transition:box-shadow .2s}
.pc2:hover{box-shadow:0 10px 28px -14px rgba(23,23,26,.3)}
.pc2 .tile{display:grid;aspect-ratio:1/1.02;text-decoration:none}
.pc2 .pair{display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.pc2 .pair img{width:60%;height:auto;max-height:90%;object-fit:contain}
.pc2 .pair img+img{margin-left:-12%}
.pc2 .minq{position:absolute;left:10px;bottom:10px;background:var(--ink);color:#fff;font-size:12.5px;font-weight:700;padding:6px 11px;border-radius:999px;z-index:2}
.pc2 .meta{padding:14px 6px 0}
.pc2 h4{font-size:18px;font-weight:700;line-height:1.25;letter-spacing:-.015em}
.pc2 .rate{display:flex;align-items:center;gap:5px;margin:7px 0 12px;font-size:14px}
.pc2 .star{color:#F5A524}
.pc2 .prow{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pc2 .pr{font-size:24px;font-weight:800;letter-spacing:-.02em;color:var(--yellow-t)}
.pc2 s{color:var(--grey);font-size:14px}
.pc2 .off{color:#C62828;font-weight:700;font-size:13.5px}
.pc2 .cartb{margin-left:auto;width:44px;height:44px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center}
.pc2 .cartb:hover{background:var(--yellow);color:var(--onacc)}

/* responsive */
html,body{max-width:100%;overflow-x:hidden}img,video,svg{max-width:100%}
.burger{display:none;background:none;border:0;padding:6px;margin-left:-6px;color:inherit;cursor:pointer}
.drw[hidden]{display:none}.drw{position:fixed;inset:0;z-index:500}.drw-bg{position:absolute;inset:0;background:rgba(0,0,0,.5)}.drw-p{position:absolute;left:0;top:0;bottom:0;width:min(320px,86vw);background:var(--card);padding:16px 20px;overflow-y:auto;display:flex;flex-direction:column}.drw-p a{padding:13px 4px;border-bottom:1px solid var(--line);font-weight:600}.drw-x{align-self:flex-end;background:none;border:0;font-size:30px;line-height:1;cursor:pointer}.drw-s input{width:100%;height:44px;border:1px solid var(--line);border-radius:6px;padding:0 12px;margin:6px 0 10px;font:inherit}
@media(max-width:1100px){.burger{display:block}.hdr .nav,.hdr .search{display:none}.hdr .in{gap:14px}}
@media(max-width:1280px){.nav{gap:18px}.hdr .in{gap:22px}}
@media(max-width:900px){.admin-wrap{grid-template-columns:1fr}.admin-nav{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:4px;padding:10px 12px;align-items:center}.admin-nav>a,.admin-nav>div:not(:last-child){flex:0 0 auto;white-space:nowrap;margin:0}.admin-nav>div:last-child{display:none}.admin-nav a{margin:0}.admin-main{padding:20px 14px;min-width:0}.admin-main .flash{margin:-20px -14px 16px!important;padding:12px 14px!important}}
.admin-main{min-width:0}.admin-main .box{max-width:100%;overflow-x:auto}.admin-main h1{font-size:clamp(24px,6vw,32px)!important}.admin-main table.t{min-width:560px}.admin-main .grid.g4{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.admin-main .grid{max-width:100%}
@media(max-width:560px){.wrap{padding:0 14px}h1{overflow-wrap:anywhere}.btn.lg{max-width:100%}.g4,.g3,.g6{grid-template-columns:repeat(2,1fr)}.ftr .cols{grid-template-columns:1fr}.hero h1{font-size:34px!important}table.t{font-size:13px}}
select.input,input.input,textarea.input{max-width:100%}

.tiers{grid-template-columns:repeat(auto-fill,minmax(104px,1fr))}

@media(max-width:700px){body.has-sticky .wa-fab{bottom:88px!important;padding:10px 14px!important}body.has-sticky #tp{bottom:88px!important}.wa-fab{font-size:13px!important}}
.wrap{padding-left:clamp(14px,4vw,40px)!important;padding-right:clamp(14px,4vw,40px)!important}
.input,select,textarea,input{min-width:0}
@media(max-width:560px){.btn.lg{white-space:normal;text-align:center}}

.sec-h{gap:16px;flex-wrap:wrap}
@media(max-width:900px){.steps4{grid-template-columns:repeat(2,1fr)!important;gap:22px!important}.nlrow{grid-template-columns:1fr!important;gap:18px!important}.sec-h h2{font-size:30px}}
@media(max-width:560px){.steps4{grid-template-columns:1fr!important}.nlform{flex-direction:column}.nlform .btn{width:100%}.sec-h h2{font-size:26px}h2{overflow-wrap:anywhere}div[style*="padding:64px"]{padding:32px 20px!important;flex-direction:column;align-items:flex-start!important}}
details>summary{overflow-wrap:anywhere}

@media(max-width:560px){.shopf select.input{width:calc(50% - 5px)!important;flex:1 1 140px}}

/* ---- landing hero ---- */
.hero2{display:grid;grid-template-columns:1.02fr 1fr;gap:48px;align-items:start;padding-top:44px;padding-bottom:30px}
.h2-cp{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:var(--bone);border:1px solid var(--line);border-radius:14px;padding:10px 12px;font-weight:600;font-size:15px;max-width:560px}.h2-cpi{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:var(--yellow);color:var(--ink);flex:none}.h2-cpi svg{width:20px;height:20px}
.h2-code{margin-left:auto;border:1.5px dashed var(--ink);background:#fff;border-radius:10px;padding:7px 12px;cursor:pointer;font:inherit;font-size:13.5px;display:inline-flex;gap:8px;align-items:center;color:var(--ink)}.h2-cc{color:var(--ink2);font-size:12.5px}
.h2-h{font-size:clamp(42px,5.4vw,78px);line-height:1.02;letter-spacing:-.04em;margin:26px 0 0}.h2-acc{color:var(--yellow-t)}
.h2-p{font-size:19px;color:var(--ink2);margin:20px 0 24px;max-width:540px}
.h2-stats{display:grid;grid-template-columns:1fr 1fr;max-width:540px;border:1px solid var(--line);border-radius:14px;background:var(--bone);margin-bottom:22px;overflow:hidden}.h2-stats>div{display:flex;gap:12px;align-items:center;padding:14px 16px}.h2-stats>div+div{border-left:1px solid var(--line)}.h2-stats b{display:block;font-size:24px;line-height:1.1}.h2-stats span+div span,.h2-stats div div>span{display:block;font-size:14px;color:var(--ink2)}.h2-si{display:grid;place-items:center;width:40px;height:40px;border-radius:10px;background:#fff;color:#F5A524;font-size:20px;flex:none}.h2-si svg{width:22px;height:22px;color:var(--yellow-t)}
.h2-cta{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:26px}
.h2-feat{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:640px}.h2-feat>div{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--line);background:var(--bone);border-radius:12px;padding:12px 14px}.h2-feat svg{flex:none;color:var(--yellow-t);margin-top:2px}.h2-feat span{font-size:13.5px;color:var(--ink2);line-height:1.35}.h2-feat b{display:block;color:var(--ink);font-size:15px}
.h2r{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}.h2c{display:block;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 8px 28px rgba(23,23,26,.08);overflow:hidden;color:inherit}.h2c.c1{margin-top:34px}.h2c.c3{margin-top:34px}.h2c.c2{margin-top:-18px}
.h2t{aspect-ratio:1/1;display:grid;place-items:center;padding:6%}.h2t img{max-width:100%;max-height:100%;object-fit:contain}
.h2m{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:12px 14px 14px}.h2m b{display:block;font-size:17px}.h2m span{font-size:15px;font-weight:700}.h2m small{font-weight:500;color:var(--ink2);font-size:13px}.h2m i{font-style:normal;flex:none;width:38px;height:38px;border-radius:10px;background:var(--yellow);color:var(--ink);display:grid;place-items:center;font-weight:800}
.h2-strip{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;padding-bottom:44px}.h2-strip a{display:flex;gap:10px;align-items:center;border:1px solid var(--line);background:var(--bone);border-radius:12px;padding:8px 10px;color:inherit;min-width:0}.h2st{flex:none;width:46px;height:46px;border-radius:8px;display:grid;place-items:center;overflow:hidden}.h2st img{width:100%;height:100%;object-fit:contain}.h2-strip a>span:last-child{min-width:0}.h2-strip b{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.h2-strip small{font-size:12.5px;color:var(--ink2)}
@media(max-width:1100px){.h2-strip{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){.hero2{grid-template-columns:1fr!important;gap:28px}.h2r{max-width:560px}.h2-feat{grid-template-columns:1fr}.h2-code{margin-left:0}}
@media(max-width:560px){.h2-p{font-size:17px}.h2-stats{grid-template-columns:1fr}.h2-stats>div+div{border-left:0;border-top:1px solid var(--line)}.h2-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.h2c.c1,.h2c.c3{margin-top:18px}.h2c.c2{margin-top:0}.h2m b{font-size:15px}.h2-cta .btn{flex:1 1 100%}.h2-h{font-size:40px!important}}
.theme-utility .hero2{padding-top:32px!important}.theme-utility .h2r{display:none}
.h2-rot{display:inline-block;transition:opacity .26s ease,transform .26s ease}
.h2-acc{display:block;white-space:nowrap;font-size:.8em;line-height:1.15;margin-top:.04em}.h2-rot{display:inline-block;vertical-align:baseline}
@media(max-width:560px){.h2-acc{font-size:.72em}}

/* ---- header refresh ---- */
.hdr{position:sticky;top:0;z-index:80;background:rgba(255,255,255,.88);-webkit-backdrop-filter:saturate(1.4) blur(12px);backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--line);transition:box-shadow .2s}.theme-dark .hdr{background:rgba(24,24,27,.88)}
.hdr.sc{box-shadow:0 6px 24px rgba(23,23,26,.08)}
.hdr .in{height:70px;gap:28px}
.nav{gap:4px;font-size:15px;font-weight:600}.nav a{padding:9px 14px;border-radius:999px;border-bottom:0;color:var(--ink2);transition:background .15s,color .15s}.nav a:hover{background:var(--bone);color:var(--ink)}.nav a.on{background:var(--yellow);color:var(--onacc,#1B1B55);border:0}
.hdr .search{margin-left:auto;display:flex;align-items:center;gap:8px;height:42px;padding:0 14px;border:1px solid var(--line);border-radius:999px;background:var(--bone);width:230px;transition:width .2s,border-color .2s,background .2s}.hdr .search:focus-within{width:300px;border-color:var(--ink);background:#fff}.hdr .search svg{flex:none;color:var(--ink2)}.hdr .search input{border:0;background:none;font:inherit;font-size:14.5px;width:100%;outline:none;min-width:0}
.hicons{display:flex;align-items:center;gap:6px}.hicons .acc{display:flex;align-items:center;gap:7px;height:42px;padding:0 12px;border-radius:999px;font-size:14.5px;font-weight:600}.hicons .acc:hover,.hicons .bag:hover{background:var(--bone)}
.hicons .bag{position:relative;display:grid;place-items:center;width:42px;height:42px;border-radius:50%}
@media(max-width:1280px){.hdr .search{width:190px}.hdr .search:focus-within{width:240px}.nav a{padding:8px 11px}}
@media(max-width:1100px){.hicons .acc span{display:none}.hicons .acc{padding:0;width:42px;justify-content:center}}

/* ---- preview section ---- */
.pvs{margin:56px auto}.pvs-in{background:#16254A;border-radius:32px;padding:56px;display:grid;grid-template-columns:1.05fr 1fr;gap:48px;align-items:center;color:#fff}
.pvs-t{font-size:48px;letter-spacing:-.03em}.pvs-u{display:block;width:40px;height:4px;border-radius:4px;background:var(--yellow);margin:8px 0 28px}
.pvs-h{font-size:44px;line-height:1.08;margin-bottom:30px}.pvs-h em{font-style:normal;color:var(--yellow)}
.pvs-st{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:30px}.pvs-st>div{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:18px}
.pvs-st i{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--yellow);color:#1B1B55;font-style:normal;font-weight:700;font-size:14px;margin-bottom:22px}.pvs-st b{display:block;font-size:17px;margin-bottom:6px}.pvs-st p{font-size:14px;color:#B9C2DA;line-height:1.45}
.pvs-cta{display:inline-flex;align-items:center;gap:10px;background:var(--yellow);color:#1B1B55;font-weight:700;font-size:18px;padding:18px 32px;border-radius:14px;box-shadow:0 10px 28px rgba(245,130,32,.28);transition:transform .15s}.pvs-cta:hover{transform:translateY(-2px)}
.pvs-ck{list-style:none;display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:22px;color:#D5DBEC;font-size:15px}.pvs-ck li:before{content:"\2713";color:#5BD08E;margin-right:8px;font-weight:700}
.pvs-r{background:#fff;color:var(--ink);border-radius:26px;padding:22px 24px 24px}
.pvs-dots{display:flex;align-items:center;gap:6px;margin-bottom:16px}.pvs-dots i{width:10px;height:10px;border-radius:50%;background:#E4E0D6}.pvs-dots b{margin-left:auto;font-size:14px}
.pvs-up{display:flex;align-items:center;gap:16px;padding:14px 16px;border:2px dashed #F58220;background:#FFF3E6;border-radius:16px}.pvs-up span{display:grid;place-items:center;flex:none;width:56px;height:56px;border-radius:14px;background:#1B1B55;color:var(--yellow);font-size:28px;font-weight:700}.pvs-up div{flex:1}.pvs-up b{display:block;font-size:18px}.pvs-up small{color:var(--ink2)}.pvs-up u{display:block;height:8px;border-radius:8px;background:#EDE7D6;margin-top:8px;text-decoration:none}
.pvs-pl{display:flex;align-items:center;gap:8px;font-weight:700;margin:18px 0 12px}.pvs-pl i{width:10px;height:10px;border-radius:50%;background:var(--yellow)}
.pvs-pg{position:relative}.pvs-pp{display:none;grid-template-columns:repeat(3,1fr);gap:10px}.pvs-pp.on{display:grid;animation:pvf .4s}@keyframes pvf{from{opacity:0}to{opacity:1}}
.pvs-c{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;text-align:center;transition:box-shadow .15s}.pvs-c:hover{box-shadow:0 8px 22px rgba(23,23,26,.12)}
.pvs-i{position:relative;display:block;aspect-ratio:1;overflow:hidden}.pvs-i img{width:100%;height:100%;object-fit:cover}.pvs-i em{position:absolute;z-index:1;top:8px;left:8px;background:#16254A;color:#fff;font-style:normal;font-weight:700;font-size:11px;letter-spacing:.04em;text-transform:uppercase;padding:6px 10px;border-radius:8px}
.pvs-c b{display:block;padding:10px 6px;font-size:14px}
.pvs-nav{display:flex;justify-content:center;gap:6px;margin:16px 0 8px}.pvs-nav button{width:9px;height:9px;border:0;border-radius:9px;background:#DDD8CB;cursor:pointer;transition:width .2s}.pvs-nav button.on{width:26px;background:#E8590C}
.pvs-try{display:block;text-align:center;font-weight:700;color:#C2410C}
@media(max-width:1000px){.pvs-in{grid-template-columns:1fr;padding:32px 22px;gap:32px;border-radius:24px}.pvs-t{font-size:38px}.pvs-h{font-size:32px}}
@media(max-width:560px){.pvs-st{grid-template-columns:1fr}.pvs-st i{margin-bottom:10px}.pvs-pp{grid-template-columns:repeat(2,1fr)}.pvs-cta{width:100%;justify-content:center;font-size:16px}.pvs-c b{font-size:13px}}

/* ---- single-line sliders ---- */
.sl{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:4px 2px 8px}.sl::-webkit-scrollbar{display:none}.sl>*{flex:none;scroll-snap-align:start}
.sl-cat>a{width:calc((100% - 100px)/6)}.sl-prod>*{width:calc((100% - 60px)/4)}
.slc{display:flex;justify-content:space-between;margin-top:12px;font-weight:600}.slc .muted{font-weight:400}
.sl-ctl{display:flex;align-items:center;gap:10px}.sl-ctl .link{margin-right:6px;font-weight:600;border-bottom:2px solid var(--ink)}.sl-b{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:#fff;font-size:24px;line-height:1;cursor:pointer;display:grid;place-items:center;padding-bottom:3px}.sl-b:hover{background:var(--ink);color:#fff}
@media(max-width:1000px){.sl-cat>a{width:calc((100% - 40px)/3)}.sl-prod>*{width:calc((100% - 20px)/2)}}
@media(max-width:560px){.sl{gap:14px}.sl-cat>a{width:36%}.sl-prod>*{width:72%}.sl-b{display:none}}

/* ---- media / clients / founder / faq ---- */
.lgs{background:var(--bone);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:26px 0}.lgs-in{display:flex;align-items:center;gap:40px}.lgs-h{flex:0 0 240px}.lgs-h small{display:block;color:#C2410C;font-weight:700;font-size:12px;margin-bottom:6px}.lgs-h h2{font-size:26px}
.lgs-r{display:flex;gap:14px;flex:1;overflow-x:auto;scrollbar-width:none;padding:2px}.lgs-r::-webkit-scrollbar{display:none}.lgs-i{flex:none;display:grid;place-items:center;width:150px;height:84px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px}.lgs-i img{max-width:100%;max-height:100%;object-fit:contain}
.fdr{padding:72px 0}.fdr-in{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:56px;align-items:center;max-width:1100px}.fdr-in:not(:has(.fdr-ph)){grid-template-columns:1fr;max-width:760px}
.fdr-ph{position:relative;border-radius:22px;overflow:hidden;box-shadow:0 18px 44px rgba(23,23,26,.16)}.fdr-ph img{display:block;width:100%;aspect-ratio:1;object-fit:cover}.fdr-ph span{position:absolute;left:14px;bottom:14px;background:#fff;border-radius:99px;padding:6px 12px;font-size:12px;font-weight:700;display:flex;align-items:center;gap:6px}.fdr-ph i{width:8px;height:8px;border-radius:50%;background:#E8590C}
.fdr-t small{color:#C2410C;font-weight:700;font-size:13px}.fdr-t h2{font-size:40px;margin:6px 0 4px}.fdr-r{color:var(--grey);margin-bottom:18px}.fdr-t p{margin-bottom:10px;color:var(--ink2);line-height:1.65}.fdr-t blockquote{border-left:3px solid #E8590C;padding:6px 0 6px 16px;margin:18px 0;font-weight:600;font-size:17px}.fdr-b{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}
.fq-g{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start}.fq-g details{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px 18px}.fq-g summary{font-weight:600;cursor:pointer}.fq-g p{margin-top:10px;color:var(--ink2)}
@media(max-width:900px){.lgs-in{flex-direction:column;align-items:flex-start;gap:16px}.lgs-h{flex:none}.lgs-r{width:100%}.fdr{padding:44px 0}.fdr-in{grid-template-columns:1fr;gap:28px}.fdr-t h2{font-size:32px}.fq-g{grid-template-columns:1fr}}

/* ---- bulk page ---- */
.blk-top{display:flex;justify-content:space-between;align-items:flex-end;gap:28px;flex-wrap:wrap}.blk-cta{display:flex;gap:12px;flex-wrap:wrap}
.blk-pts{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:26px;font-weight:500}.blk-pts b{color:var(--yellow-t)}
.blk-g{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.blk-c{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#fff;display:flex;flex-direction:column}
.blk-i{display:block;aspect-ratio:1;overflow:hidden}.blk-i img{width:100%;height:100%;object-fit:cover}.blk-m{padding:14px 16px 16px;display:flex;flex-direction:column;gap:8px;flex:1}.blk-m h4{font-size:17px;letter-spacing:-.01em}
.blk-p{font-size:15px;color:var(--ink2)}.blk-p b{color:var(--ink);font-size:18px}.blk-p span{display:block;font-size:13.5px;margin-top:2px}.blk-b{display:flex;gap:8px;margin-top:auto;padding-top:6px}.blk-b .btn{flex:1;padding:10px 8px;font-size:14px;text-align:center}
.blk-q{display:grid;grid-template-columns:1fr 1.25fr;gap:56px;align-items:start}
@media(max-width:1100px){.blk-g{grid-template-columns:repeat(3,1fr)}}@media(max-width:820px){.blk-g{grid-template-columns:repeat(2,1fr)}.blk-q{grid-template-columns:1fr;gap:28px}}@media(max-width:480px){.blk-b{flex-direction:column}}

.dsc{color:var(--err,#C62828);font-weight:700}.tbtn .dsc{font-weight:700}

/* ---- header icons ---- */
.hicons{margin-left:auto;gap:2px}.hicons .hi{position:relative;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;border:0;background:none;color:var(--ink);cursor:pointer;padding:0}.hicons .hi:hover{background:var(--bone)}
.hicons .cnt{position:absolute;top:2px;right:0;min-width:20px;height:20px;padding:0 5px;border-radius:99px;background:#1B1B55;color:#fff;font-size:11.5px;font-weight:700;display:grid;place-items:center;box-shadow:0 2px 6px rgba(0,0,0,.28);line-height:1}.hicons .cnt[hidden]{display:none}
.sbar{background:#fff;border-bottom:1px solid var(--line);padding:14px 0;box-shadow:0 14px 24px rgba(23,23,26,.08)}.sbar[hidden]{display:none}.sbar-in{display:flex;gap:10px}.sbar input{flex:1;height:48px;border:1px solid var(--line);border-radius:999px;padding:0 20px;font:inherit;font-size:16px;background:var(--bone);outline:none}.sbar input:focus{border-color:var(--ink);background:#fff}.sbar .btn{border-radius:999px;padding:0 26px}
.wlb{position:absolute;z-index:3;top:10px;right:10px;width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,255,255,.92);color:var(--ink);display:grid;place-items:center;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.15);transition:transform .15s}.wlb:hover{transform:scale(1.08)}.wlb.on{color:#E0364B}.wlb.on svg{fill:#E0364B}
.pcard{position:relative}
@media(max-width:820px){.hdr .nav{display:none}.hicons .hi{width:42px;height:42px}}

.dsc{color:#C62828!important;font-weight:700}.tag.g .dsc{color:#C62828}
.blk-p span b{color:#C62828}.h2-cp .dsc,.off{color:#C62828}
@media(max-width:820px){.collage.h2r{height:auto!important;max-height:none!important;overflow:visible!important}.h2r .h2c{position:static!important;width:auto!important;transform:none!important}}

/* ---- dark mode (set by admin) ---- */
.mode-dark{--paper:#101013;--bone:#18181C;--sand:#222228;--ink:#F3F2EE;--ink2:#BDBAB1;--grey:#8D8A82;--line:#2E2E35;--card:#1A1A1F;--yellow-l:#3A3118;--errbg:#3A1A17;color-scheme:dark}
.mode-dark .btn.dark,.mode-dark .btn.dark:hover{background:var(--ink);color:#1B1B55;border-color:var(--ink)}
.mode-dark .hdr{background:rgba(16,16,19,.88)}.mode-dark .hdr.sc{box-shadow:0 6px 24px rgba(0,0,0,.5)}
.mode-dark .nav a:hover{background:var(--sand)}.mode-dark .hicons .hi:hover{background:var(--sand)}
.mode-dark .sbar,.mode-dark .sbar input:focus,.mode-dark .sl-b,.mode-dark .wlb,.mode-dark .blk-c,.mode-dark .lgs-i,.mode-dark .fq-g details,.mode-dark .pvs-c,.mode-dark .h2c,.mode-dark .pcard,.mode-dark .box,.mode-dark .tbtn{background:var(--card)}
.mode-dark .wlb{color:var(--ink)}.mode-dark .lgs-i img{background:#fff;border-radius:6px;padding:4px}
.mode-dark .pvs-r{background:var(--card);color:var(--ink)}.mode-dark .pvs-up{background:#2A2411}.mode-dark .pvs-dots i{background:#33333A}.mode-dark .pvs-nav button{background:#3A3A42}
.mode-dark .pvs-up b,.mode-dark .pvs-c b{color:var(--ink)}.mode-dark .pvs-up u{background:#3A3420}
.mode-dark .sl-b:hover{background:var(--ink);color:#1B1B55}
.mode-dark .sbar input{background:var(--bone);color:var(--ink)}
.mode-dark .dsc,.mode-dark .pc2 .off{color:#FF6B6B!important}
.mode-dark .input,.mode-dark input,.mode-dark select,.mode-dark textarea{background:var(--card);color:var(--ink);border-color:var(--line)}
.mode-dark .announce{background:#0B1226}
.mode-dark img.art{filter:none}
.mode-dark .ftr{background:#0A0A0C}
.mode-dark .minq,.mode-dark .cartb{background:#000;color:#fff;border:1px solid #3A3A42}
.mode-dark .h2-code,.mode-dark #gprev,.mode-dark #gnext,.mode-dark #zbtn,.mode-dark .gthumb,.mode-dark #cname,.mode-dark .cswt,.mode-dark .cth,.mode-dark #sticky,.mode-dark .top,.mode-dark .ib,.mode-dark #saved,.mode-dark .pane,.mode-dark .drop,.mode-dark .bar,.mode-dark .cs,.mode-dark .btn:not(.pri):not(.dark),.mode-dark .chip:not(.on){background:var(--card);color:var(--ink);border-color:var(--line)}
.mode-dark .btn.pri{color:#1B1B55}.mode-dark .tag{color:#1B1B55}
.mode-dark .notice,.mode-dark .note{background:#2A2411;color:var(--ink)}
.mode-dark #sticky,.mode-dark #gprev,.mode-dark #gnext,.mode-dark #zbtn,.mode-dark #cname{background:var(--card)!important;color:var(--ink)!important}
.mode-dark .pcard .tag,.mode-dark #cname{border:1px solid var(--line)}
@media(max-width:1100px){.burger{display:grid!important;place-items:center;flex:none;width:44px;height:44px;margin-left:-8px;padding:0;border-radius:50%;color:var(--ink)}.burger svg{flex:none;width:26px;height:26px}.hdr .in{gap:6px}.hdr .logo{flex:0 1 auto;min-width:0}.hdr .logo img{max-width:100%;height:auto;max-height:36px}.hicons{margin-left:auto;flex:none}}
@media(max-width:400px){.hicons .hi{width:38px;height:38px}.hicons .hi svg{width:23px;height:23px}}

/* ---- mobile landing, app-style ---- */
.tabbar{display:none}
.h2-tour{display:flex;align-items:center;justify-content:center;gap:14px;text-align:left}.h2-tour b{display:block;font-size:17px}.h2-tour small{display:block;font-size:13px;opacity:.85}.h2-play{display:grid;place-items:center;flex:none;width:44px;height:44px;border-radius:50%;background:#fff;color:#1B1B55}
@media(max-width:820px){
 body{padding-bottom:76px}body.has-sticky{padding-bottom:0}
 .tabbar{position:fixed;left:0;right:0;bottom:0;z-index:70;display:grid;grid-template-columns:repeat(5,1fr);background:var(--paper);border-top:1px solid var(--line);box-shadow:0 -6px 20px rgba(23,23,26,.08);padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
 body.has-sticky .tabbar{display:none}
 .tabbar a{position:relative;display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 2px;border-radius:12px;font-size:11.5px;font-weight:600;color:var(--ink2)}.tabbar a.on{color:var(--ink)}.tabbar a.on svg{color:#C2410C}
 .tabbar .cnt{position:absolute;top:0;left:calc(50% + 6px);min-width:18px;height:18px;padding:0 4px;border-radius:99px;background:#1B1B55;color:#fff;font-style:normal;font-size:11px;font-weight:700;display:grid;place-items:center}.mode-dark .tabbar .cnt{background:var(--yellow);color:#1B1B55}
 .wa-fab{bottom:88px!important}
 .hdr .in{display:grid;grid-template-columns:44px 1fr auto;gap:4px}.hdr .logo{justify-self:center}.hicons .hi[href="/account"],.hicons .hi[href="/wishlist"]{display:none}
 .h2-stats{grid-template-columns:1fr 1fr!important;max-width:none}.h2-stats>div{padding:12px;gap:10px}.h2-stats>div+div{border-left:1px solid var(--line)!important;border-top:0!important}.h2-stats b{font-size:21px}.h2-si{display:none!important}
 .h2-cta{gap:10px}.h2-cta .btn{flex:1 1 100%;border-radius:14px}.h2-cta .btn.pri{order:2}.h2-cta .h2-tour{order:1;background:linear-gradient(135deg,#E8590C,#F5832B);border-color:transparent;color:#fff;box-shadow:0 10px 24px rgba(232,89,12,.28);padding:12px 16px}.h2-cta .h2-tour small{color:#fff}.h2-cta .btn:last-child{order:3}
 .h2r{grid-template-columns:1fr 1fr}
}

/* ---- preview section layout, all screens ---- */
.pvs-in{grid-template-areas:"hd r" "bt r";grid-template-rows:auto 1fr;align-content:center;column-gap:48px;row-gap:0}.pvs-hd{grid-area:hd;align-self:end}.pvs-bt{grid-area:bt;align-self:start}.pvs-r{grid-area:r}
.pvs-up{cursor:pointer}.pvs-up span{overflow:hidden}.pvs-up span img{width:100%;height:100%;object-fit:cover}.pvs-up u i{display:block;height:100%;width:0;border-radius:8px;background:#E8590C;transition:width .25s}.pvs-up b{overflow-wrap:anywhere}
@media(max-width:1000px){.pvs-in{grid-template-areas:"hd" "r" "bt";grid-template-rows:auto;row-gap:26px}.pvs-hd{text-align:center;align-self:auto}.pvs-u{margin:8px auto 22px}.pvs-bt{align-self:auto}.pvs-cta{display:flex;justify-content:center}.pvs-ck{justify-content:center}}
@media(max-width:700px){.pvs{padding:0 12px;margin:36px auto}.pvs-r{padding:16px}.pvs-st{grid-template-columns:repeat(3,1fr);gap:8px}.pvs-st>div{padding:12px 10px}.pvs-st i{margin-bottom:10px;width:28px;height:28px}.pvs-st b{font-size:14px}.pvs-st p{font-size:12px}}
@media(max-width:480px){.pvs-st{grid-template-columns:1fr}.pvs-st>div{display:grid;grid-template-columns:36px 1fr;column-gap:10px;align-items:start}.pvs-st i{grid-row:span 2;margin:0}}

/* ---- contrast fixes ---- */
.pc2 .pr{color:var(--ink)}
.mode-dark{--yellow-t:var(--yellow)}.mode-dark .pc2 .pr{color:var(--ink)}
.pvs-try,.fdr-t small,.lgs-h small{color:#C2410C}.mode-dark .pvs-try{color:#FF9B5E}.mode-dark .fdr-t small,.mode-dark .lgs-h small{color:#FF9B5E}
.wa-fab{background:#12804C!important}
.rate .star,.h2-stats b span{color:#B45309!important}

/* ---- track order ---- */
.trk{padding:56px 0 80px;background:linear-gradient(#FFF1EA 0,var(--bone) 280px)}
.trk-hd{text-align:center;max-width:620px;margin:0 auto 28px}.trk-hd h1{font-size:clamp(32px,5vw,48px);margin:14px 0 10px}.trk-hd p{color:var(--grey);margin:0}
.trk-bd{display:inline-flex;gap:8px;align-items:center;background:#FFE7DB;color:#C2410C;font-weight:700;font-size:12px;letter-spacing:.06em;text-transform:uppercase;padding:7px 14px;border-radius:999px}.trk-bd i{width:8px;height:8px;border-radius:50%;background:#E8590C}
.trk-card{max-width:640px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:22px;padding:18px;box-shadow:0 10px 30px rgba(0,0,0,.05)}
.trk-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;background:var(--bone);border-radius:14px;padding:5px;margin-bottom:18px}
.trk-tabs a{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px;border-radius:10px;font-weight:600;color:var(--grey)}.trk-tabs a.on{background:#fff;color:var(--ink);box-shadow:0 1px 4px rgba(0,0,0,.12)}
.trk-card .field{margin-bottom:14px}.trk-card .input{height:54px;border-radius:12px}
.trk-go{height:54px;border-radius:12px;font-size:16px;background:#E5602F!important;color:#fff!important;border-color:#E5602F!important;box-shadow:0 6px 16px rgba(229,96,47,.3)}
.trk-n{text-align:center;color:var(--grey);font-size:13px;margin:12px 0 2px}
.trk-rw{max-width:640px;margin:22px auto 0}
.trk-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:36px auto 0;max-width:1000px}
.trk-3>div{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px}
.trk-3 h3{font-size:17px;margin:14px 0 6px}.trk-3 p{color:var(--grey);font-size:14px;margin:0 0 8px}.trk-3 a{color:#C2410C;font-weight:700;font-size:14px;margin-right:12px;word-break:break-all}
.trk-ic{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:#FFE7DB;color:#C2410C}
@media(max-width:820px){.trk{padding:36px 0 60px}.trk-3{grid-template-columns:1fr}}
.mode-dark .trk{background:linear-gradient(#2A1A12 0,var(--bone) 280px)}.mode-dark .trk-card,.mode-dark .trk-3>div,.mode-dark .trk-tabs a.on{background:var(--card,#1d1d1d)!important}.mode-dark .trk-bd,.mode-dark .trk-ic{background:#3A2418;color:#FF9B5E}.mode-dark .trk-3 a{color:#FF9B5E}

/* ---- single-line top bar and coupon ---- */
@media(max-width:640px){
.h2-cp{flex-wrap:nowrap;gap:8px;padding:8px 10px;font-size:13px}.h2-cp>span:nth-child(2),.h2-cp>b,.h2-cp>div{min-width:0;white-space:nowrap}.h2-cpi{width:32px;height:32px;flex:none}.h2-cp .cpcode,.h2-cp button,.h2-cp code{flex:none;margin-left:auto;white-space:nowrap}}
@media(max-width:640px){.h2-cp>span:nth-child(2){flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;font-size:13px}.h2-cp .h2-cc{display:none}.h2-code{padding:6px 10px!important;flex:none;margin-left:auto}}

/* ---- news-ticker announcement bar ---- */
.announce{position:relative;display:block;padding:0;min-height:0;background:#1B1B55;color:#fff;white-space:nowrap;overflow:hidden;border-bottom:2px solid #F58220}
.ann-tk{overflow:hidden;height:46px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 36px,#000 calc(100% - 36px),transparent);mask-image:linear-gradient(90deg,transparent,#000 36px,#000 calc(100% - 36px),transparent)}
.ann-tr{display:flex;align-items:center;width:max-content;height:46px;will-change:transform}
.announce:hover .ann-tr{animation-play-state:paused!important}
@keyframes annscroll{from{transform:translateX(0)}to{transform:translateX(var(--shift))}}
.ann-i{flex:none;display:flex;align-items:center;gap:10px;font-size:15px;font-weight:700;color:#fff;margin-right:28px;white-space:nowrap}
.ann-i::after{content:"";order:9;flex:none;width:6px;height:6px;border-radius:50%;background:#F58220;margin-left:28px}
.ann-ic{flex:none;color:#FF7A3D}
a.ann-i:hover .ann-t{text-decoration:underline}
.ann-c{flex:none;display:inline-flex;align-items:center;gap:8px;background:#F58220;color:#fff;border:0;border-radius:7px;padding:6px 12px;font:inherit;font-size:13.5px;font-weight:800;letter-spacing:.04em;cursor:pointer}.ann-c i{width:1px;height:16px;border-left:1px dashed rgba(255,255,255,.7)}.ann-c b{font-weight:800}
.announce b{color:inherit}
@media(max-width:640px){.ann-tk,.ann-tr{height:42px}.ann-i{font-size:14px;margin-right:20px}.ann-i::after{margin-left:20px}.ann-c{font-size:12.5px;padding:5px 10px}}
@media(prefers-reduced-motion:reduce){.ann-tk{overflow-x:auto}.ann-tr{animation:none!important}}

/* ---- hero coupon like reference ---- */
.h2-cp{flex-wrap:nowrap;gap:12px;background:#F4F2EE;border:1.5px solid var(--line);border-radius:16px;padding:10px 12px;max-width:none}
.h2-cpi{background:#F58220!important;color:#fff!important;border-radius:12px;flex:none}.h2-cpi svg{stroke:#fff}
.h2-cp>span:nth-child(2){flex:1 1 auto;min-width:0;font-weight:700;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.h2-code{margin-left:auto;flex:none;border:2px dashed #F58220!important;background:transparent!important;border-radius:12px;padding:8px 16px!important;color:#14203F!important;font-weight:800;letter-spacing:.04em}
.h2-code b{font-weight:800;font-size:15px}.h2-cc{display:none!important}
.h2-code::after{content:"";width:15px;height:15px;background:currentColor;opacity:.55;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Crect x='9' y='9' width='11' height='11' rx='2'/%3E%3Cpath d='M5 15V6a2 2 0 012-2h9'/%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='%23000' stroke-width='2'%3E%3Crect x='9' y='9' width='11' height='11' rx='2'/%3E%3Cpath d='M5 15V6a2 2 0 012-2h9'/%3E%3C/svg%3E") center/contain no-repeat}
@media(max-width:640px){.h2-cp{gap:10px;padding:9px 10px}.h2-cp>span:nth-child(2){font-size:14px}.h2-code{padding:7px 10px!important;margin-left:auto}.h2-code::after{display:none}}
@media(max-width:360px){.h2-cp>span:nth-child(2){font-size:12.5px}.h2-code b{font-size:13px}}
.mode-dark .h2-cp{background:#1B2233}.mode-dark .h2-code{color:#fff!important}

/* footer v2 */
.ftr{padding:64px 0 26px}.ftr .fcols{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:40px}.ftr .fbrand p{margin:18px 0 0;max-width:330px;color:#b7b7d6;font-size:15px;line-height:1.6}.ftr h5{font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:#fff;margin-bottom:18px}.ftr li{font-size:15px;margin-bottom:11px}.ftr li a,.ftr .fci a{color:#c9c9e3}.ftr li a:hover,.ftr .fci a:hover{color:#fff}
.ftr .fsoc{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap}.ftr .fsoc a{width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.2);display:grid;place-items:center;color:#d6d6ee}.ftr .fsoc a:hover{background:var(--yellow);border-color:var(--yellow);color:var(--onacc)}
.ftr .fwa{display:inline-flex;align-items:center;gap:10px;margin-top:22px;background:var(--yellow);color:var(--onacc);font-weight:700;padding:14px 24px;border-radius:999px}.ftr .fwa:hover{background:var(--yellow-d)}
.ftr .fnews{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;margin-top:40px;padding:22px 0;border-top:1px solid rgba(255,255,255,.14)}.ftr .fnews b{display:block;color:#fff;font-size:15px}.ftr .fnews span{color:#b7b7d6;font-size:13.5px}.ftr .fnf{display:flex;gap:10px;flex:0 1 460px;width:100%}.ftr .fnf .input{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2);color:#fff;height:46px}.ftr .fnf .btn{height:46px;white-space:nowrap}
.ftr .fcon{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:26px;padding:28px 0;border-top:1px solid rgba(255,255,255,.14)}.ftr .fci{display:flex;gap:14px;align-items:flex-start}.ftr .fci i{flex:none;width:42px;height:42px;border-radius:12px;background:rgba(255,255,255,.08);display:grid;place-items:center;color:var(--yellow)}.ftr .fci small{display:block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#a9a9cc;margin-bottom:4px}.ftr .fci p{margin:0;color:#fff;font-size:15.5px;line-height:1.5}.ftr .fci p a{color:#fff}
.ftr .fabout{border-top:1px solid rgba(255,255,255,.14);margin:0;padding:24px 0 6px;color:#a9a9cc;font-size:14px;line-height:1.7;max-width:900px}.ftr .bot{border-top:1px solid rgba(255,255,255,.14);margin-top:22px;color:#a9a9cc;gap:12px;flex-wrap:wrap}
@media(max-width:900px){.ftr .fcols{grid-template-columns:1fr 1fr}.ftr .fbrand{grid-column:1/-1}}@media(max-width:560px){.ftr .fcols{grid-template-columns:1fr 1fr;gap:28px 18px}.ftr .fnf{flex-direction:column}.ftr{padding-bottom:90px}}

.h2r{position:relative}.h2-dots{grid-column:1/-1;display:flex;justify-content:center;gap:7px;margin-top:4px}.h2-dots i{width:8px;height:8px;border-radius:99px;background:var(--line);transition:all .25s}.h2-dots i.on{width:22px;background:var(--yellow)}.h2r{touch-action:pan-y}

.cdt{display:flex;align-items:center;gap:10px;background:var(--ink);color:#fff;border-radius:12px;padding:12px 16px;margin-bottom:20px;font-weight:600;font-size:15px}.cdt svg{flex:none;color:var(--yellow)}.cdt .cdn{font-variant-numeric:tabular-nums;background:var(--yellow);color:var(--onacc);padding:2px 8px;border-radius:7px;margin:0 2px}.cdt.low .cdn{animation:cdp 1s infinite}.cdt.end{background:#8a2c1a}@keyframes cdp{50%{opacity:.55}}
.pm-off{display:inline-block;margin-left:6px;background:#E5F5EC;color:#1F7A4D;font-size:12.5px;font-weight:700;padding:2px 8px;border-radius:99px}.pmo.on{border-color:var(--ink)!important;background:var(--yellow-l)}

.wa-btn{background:#fff;color:#128C4A!important;border:1.5px solid #25D366;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:700}.wa-btn:hover{background:#E8F9EF}
.wa-band{background:#128C4A;color:#fff;padding:34px 0}.wa-band .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}.wa-band h2{font-size:clamp(22px,3vw,30px);margin:0 0 6px;color:#fff}.wa-band p{margin:0;color:#d4f3e1}.wa-btn2{background:#fff;color:#128C4A!important;display:inline-flex;align-items:center;gap:10px;font-weight:700}

.aib{position:fixed;right:16px;bottom:16px;z-index:92;width:56px;height:56px;border-radius:50%;border:0;background:var(--ink);color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 6px 20px rgba(27,27,85,.35)}.aib:hover{transform:scale(1.05)}
.aiw{position:fixed;right:16px;bottom:84px;z-index:93;width:370px;max-width:calc(100vw - 32px);height:min(520px,calc(100vh - 120px));background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 16px 48px rgba(27,27,85,.25);display:flex;flex-direction:column;overflow:hidden}.aiw[hidden]{display:none}
.aih{background:var(--ink);color:#fff;padding:14px 16px;display:flex;justify-content:space-between;align-items:center}.aih button{background:none;border:0;color:#fff;font-size:26px;line-height:1;cursor:pointer}
.aim{flex:1;overflow:auto;padding:14px;display:flex;flex-direction:column;gap:10px;background:var(--bone)}.aim>div{max-width:86%;padding:10px 13px;border-radius:14px;font-size:14.5px;line-height:1.5;white-space:pre-wrap;word-wrap:break-word}.ai-b{background:#fff;border:1px solid var(--line);align-self:flex-start;color:var(--ink)}.ai-u{background:var(--yellow);color:var(--onacc);align-self:flex-end;font-weight:600}.ai-b.t{opacity:.6}
.aif{display:flex;gap:8px;padding:10px;border-top:1px solid var(--line);background:#fff}.aif input{flex:1;height:44px;border:1.5px solid var(--line);border-radius:10px;padding:0 12px;font:inherit;font-size:15px}.aif .btn{height:44px;padding:0 16px}
@media(max-width:820px){.aib{bottom:84px;right:12px;width:52px;height:52px}.aiw{bottom:148px;right:12px;height:min(480px,calc(100vh - 190px))}}

.h2t{position:relative}.h2t.has-x{padding:36% 6% 6%}.h2x{position:absolute;left:7%;right:7%;top:6%;z-index:1;line-height:1.02;font-family:'Barlow Condensed','Oswald','Roboto Condensed','Arial Narrow',sans-serif;text-transform:uppercase;pointer-events:none}
.h2x .a{display:block;font-weight:700;font-size:clamp(17px,2.2vw,28px);color:var(--ink);letter-spacing:.005em}.h2x .b{display:block;font-weight:800;font-size:clamp(20px,2.7vw,34px);color:var(--yellow-t);letter-spacing:.005em}.h2x small{display:block;margin-top:5px;font-weight:600;font-size:clamp(10px,1.1vw,13px);letter-spacing:.07em;color:var(--ink2)}
@media(max-width:560px){.h2x .a{font-size:15px}.h2x .b{font-size:18px}.h2x small{font-size:9.5px;letter-spacing:.04em}.h2t.has-x{padding-top:40%}}
.h2t.has-x{display:flex;flex-direction:column;align-items:stretch;padding:6%;aspect-ratio:1/1.08}.h2t.has-x .h2x{position:static;margin-bottom:6px;flex:none}.h2t.has-x img{flex:1 1 0;min-height:0;width:100%;max-width:100%;max-height:none;object-fit:contain;object-position:center bottom}
.h2x .a{font-size:clamp(15px,1.9vw,24px)}.h2x .b{font-size:clamp(17px,2.3vw,29px)}
@media(max-width:560px){.h2x .a{font-size:14px}.h2x .b{font-size:16px}.h2t.has-x{padding-top:6%}}

.h2-up{display:flex;align-items:center;gap:16px;margin-top:22px;padding:20px 22px;border:2px dashed var(--yellow);border-radius:18px;background:var(--yellow-l);color:var(--ink);transition:transform .2s,box-shadow .2s}.h2-up:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(27,27,85,.12)}
.h2-upi{flex:none;width:52px;height:52px;border-radius:14px;background:var(--yellow);color:var(--onacc);display:grid;place-items:center}.h2-upt{flex:1;min-width:0}.h2-upt b{display:block;font-size:17px;line-height:1.3}.h2-upt span{display:block;margin-top:3px;font-size:14px;color:var(--ink2)}.h2-up .btn{flex:none;white-space:nowrap}
.h2-steps{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;counter-reset:st}.h2-steps li{counter-increment:st;position:relative;padding:14px 14px 14px 52px;border:1px solid var(--line);border-radius:14px;background:#fff;line-height:1.3}.h2-steps li:before{content:counter(st);position:absolute;left:14px;top:50%;transform:translateY(-50%);width:28px;height:28px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-weight:700;font-size:14px}.h2-steps b{display:block;font-size:15px}.h2-steps span{font-size:13px;color:var(--ink2)}
@media(max-width:560px){.h2-up{flex-wrap:wrap;padding:16px}.h2-up .btn{width:100%;text-align:center}.h2-steps{grid-template-columns:1fr}}
@media(min-width:901px){.hero2{align-items:stretch}.hero2 .h2l{display:flex;flex-direction:column}.hero2 .h2r{align-self:start}}
.h2l .h2-up{flex:1 1 auto;flex-direction:column;justify-content:center;text-align:center;gap:12px;min-height:0;padding:20px 22px}
.h2-up .h2-upi{width:64px;height:64px;border-radius:18px}.h2-up .h2-upt b{font-size:clamp(18px,1.6vw,22px)}.h2-up .h2-upt span{font-size:14.5px}.h2-up .btn{padding-left:34px;padding-right:34px}
@media(max-width:900px){.h2l .h2-up{flex:none;min-height:0}}

.h2-tiers{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}.h2-tiers>span{background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px 14px;font-size:13.5px;color:var(--yellow-t);font-weight:700;line-height:1.3;text-align:center}.h2-tiers>span b{display:block;color:var(--ink);font-size:15px}

.h2l .h2-bulk{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto 1fr;column-gap:16px;row-gap:12px;align-content:center;text-align:left;padding:18px 20px}
.h2-bulk .h2-upi{width:52px;height:52px;border-radius:14px;grid-row:1}.h2-bulk .h2-upt{grid-row:1;text-align:left}.h2-bulk .h2-upt b{font-size:clamp(16px,1.4vw,19px)}.h2-bulk .h2-upt span{font-size:14px}
.h2-bact{grid-column:1/-1;display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}.h2-bact .h2-tiers{justify-content:flex-start}.h2-bact .btn{margin-left:auto}
.h2-tiers>span{padding:6px 12px}.h2-tiers>span b{font-size:14px}
@media(max-width:560px){.h2l .h2-bulk{grid-template-columns:1fr}.h2-bulk .h2-upi{display:none}.h2-bact .btn{width:100%;margin-left:0}}

/* bulk card in the hero: hidden unless the script finds spare room (see views/home.php) */
.h2l .h2-bulk:not(.on){display:none}

/* Uploaded images can have any size or shape. These boxes keep a fixed size and the image is fitted inside:
   the box is the positioning parent and the image fills it, so percentages never depend on the image itself. */
.lgs-i{position:relative;overflow:hidden;display:block}
.lgs-i img{position:absolute;inset:12px;width:calc(100% - 24px);height:calc(100% - 24px);max-width:none;max-height:none;object-fit:contain}
.h2st{position:relative}
.h2st img{position:absolute;inset:0;max-width:none;max-height:none}
.tile img.art[src^="/uploads/"]{position:absolute;inset:0;width:100%;height:100%;max-width:none;max-height:none;object-fit:cover}
.blk-i{position:relative;overflow:hidden}
.vring{overflow:hidden}.vring img{width:100%;height:100%;object-fit:cover;display:block}
.rph{object-fit:cover}

#pinhint:empty{display:none}
/* The shine that follows the mouse washes out colours when the product photo is zoomed. */
#ptile::after{content:none}
/* Generated design pictures keep their true colours: no mouse shine over them. */
.noshine::after{content:none}
/* Phones: a grid column of 1fr grows to fit its widest child (the coupon strip, long buttons) and pushes the box edges off screen. */
@media(max-width:900px){.hero2{grid-template-columns:minmax(0,1fr)!important}.hero2>*{min-width:0}}
@media(max-width:480px){[style*="grid-template-columns:1fr 1fr"]{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important}.input,select.input,textarea.input{min-width:0;max-width:100%}}
/* Cart lines on phones: smaller picture, the price drops under the details, buttons wrap instead of running off the edge. */
@media(max-width:560px){[style*="grid-template-columns:110px 1fr auto"]{grid-template-columns:84px minmax(0,1fr)!important;gap:6px 14px!important}[style*="grid-template-columns:110px 1fr auto"]>.price{grid-column:2}form[action="/cart/update"]{flex-wrap:wrap}}

/* Admin menu: grouped by module with dropdowns on wide screens, a flat scrolling row on phones */
.admin-nav{position:sticky;top:0;align-self:start;max-height:100vh;overflow-y:auto}
.admin-nav details.ng{margin:4px 0}.admin-nav details.ng summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:9px 10px;border-radius:6px;color:#fff;font-weight:600}
.admin-nav details.ng summary::-webkit-details-marker{display:none}.admin-nav details.ng summary::after{content:"";width:7px;height:7px;border-right:2px solid #a8a49a;border-bottom:2px solid #a8a49a;transform:rotate(45deg);margin-right:3px;transition:transform .15s}
.admin-nav details.ng[open] summary::after{transform:rotate(-135deg)}.admin-nav details.ng summary:hover{background:#2b2b30}
.admin-nav details.ng a{padding:7px 10px 7px 22px;font-size:14.5px}.admin-nav a.nf{display:none}
@media(max-width:900px){.admin-nav{position:static;max-height:none;overflow-y:visible;overflow-x:auto}.admin-nav details.ng{display:none}.admin-nav a.nf{display:block}}

/* keep the sidebar colour for the full height of the page, not just the height of the menu */
.admin-wrap{background:linear-gradient(to right,var(--ink) 210px,var(--bone) 210px)}
@media(max-width:900px){.admin-wrap{background:var(--bone)}}

/* overflow-x:hidden on html and body stops position:sticky, so the admin menu scrolled away with the page. clip hides the overflow without that side effect. */
@supports (overflow:clip){html,body{overflow-x:clip}}
