:root{
  --white:#FFFFFF; --blue:#0067B1; --blue-hover:#00558F;
  --green:#008A5B; --green-hover:#006F49;
  --footer:#063B5C; --ink:#17242B; --muted:#65747B;
  --border:#E6ECEE; --atmo:#F4FAF9; --grad-a:#DCEFF2; --grad-b:#DDF3E9;
  --f-sec:#B8CDD5; --f-green:#42B883; --f-div:#285772;
  --display:'Manrope',-apple-system,system-ui,sans-serif;
  --body:'Inter',-apple-system,system-ui,sans-serif;
  --maxw:1280px;
}
@media(min-width:1600px){:root{--maxw:1440px}}
*{box-sizing:border-box}
html{height:100%}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;background:#fff;color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
header,footer{flex-shrink:0}
main{flex:1 0 auto;width:100%}
h1,h2,h3,h4{font-family:var(--display);margin:0;line-height:1.14;letter-spacing:-.02em;color:var(--ink)}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%}
button{font-family:inherit}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}
.eyebrow{font-family:var(--display);font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--blue)}
.muted{color:var(--muted)}
:focus-visible{outline:2.5px solid var(--blue);outline-offset:3px;border-radius:4px}
.btn{font-family:var(--display);font-weight:700;font-size:15px;border-radius:10px;padding:13px 22px;display:inline-flex;align-items:center;justify-content:center;gap:9px;cursor:pointer;border:1.5px solid transparent;transition:.18s}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--blue);color:#fff}.btn-primary:hover{background:var(--blue-hover)}
.btn-green{background:var(--green);color:#fff}.btn-green:hover{background:var(--green-hover)}
.btn-outline{background:#fff;color:var(--blue);border-color:var(--blue)}.btn-outline:hover{background:var(--blue);color:#fff}
.btn-sm{padding:9px 16px;font-size:14px;border-radius:9px}
.btn-block{width:100%}

/* announcement + header */
.ann{background:var(--footer);color:#fff;font-family:var(--display);font-weight:600;font-size:13px;text-align:center;padding:9px 14px}
.ann b{color:var(--f-green)}
header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);backdrop-filter:saturate(140%) blur(12px);border-bottom:1px solid var(--border)}
.nav{display:flex;align-items:center;gap:20px;height:70px}
.brand{display:flex;align-items:center;gap:8px;flex-shrink:0;cursor:pointer}
.brand img.brand-logo{height:44px;width:auto;display:block}
.mainnav{display:flex;gap:4px;margin-left:6px}
.mainnav>a,.dd>button{font-family:var(--display);font-weight:600;font-size:14px;color:var(--ink);padding:8px 10px;border-radius:8px;background:none;border:none;cursor:pointer;display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.mainnav>a:hover,.dd>button:hover{background:var(--atmo);color:var(--blue)}
.dd{position:relative}
.dd-menu{position:absolute;top:calc(100% + 6px);left:0;background:#fff;border:1px solid var(--border);border-radius:12px;padding:8px;min-width:190px;box-shadow:0 20px 40px -18px rgba(6,59,92,.28);display:none;z-index:60}
.dd.open .dd-menu{display:block}
@media(hover:hover) and (pointer:fine){.dd:hover .dd-menu{display:block}}
.dd-menu a{display:block;padding:9px 12px;border-radius:8px;font-size:14px;font-weight:500}
.dd-menu a:hover{background:var(--atmo);color:var(--blue)}
.nav-right{margin-left:auto;display:flex;align-items:center;gap:10px}
.icon-btn{width:40px;height:40px;display:grid;place-items:center;border-radius:10px;color:var(--ink);border:1px solid transparent;background:none;cursor:pointer;position:relative}
.icon-btn:hover{background:var(--atmo);border-color:var(--border)}
.icon-btn .badge{position:absolute;top:2px;right:0;background:var(--green);color:#fff;font-family:var(--display);font-weight:700;font-size:10px;line-height:1;padding:3px 5px;border-radius:20px;display:none}
.icon-btn .badge.on{display:block}
.menu-toggle{display:none}
.mmenu{display:none;border-top:1px solid var(--border);background:#fff;padding:10px 22px 18px}
.mmenu a{display:block;padding:10px 4px;font-family:var(--display);font-weight:600;font-size:15px;border-bottom:1px solid var(--atmo)}
.mmenu .sub{padding-left:18px;font-weight:500;color:var(--muted);font-size:14px}
.mmenu.open{display:block}

/* views */
.view{display:none}.view.on{display:block}
section.pad{padding:72px 0}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:34px}
.sec-head h2{font-size:32px;font-weight:800;margin-top:8px}
.sec-head p{margin:8px 0 0;color:var(--muted);max-width:460px}
.link-more{font-family:var(--display);font-weight:700;color:var(--blue);font-size:15px;display:inline-flex;align-items:center;gap:7px;white-space:nowrap;cursor:pointer}

/* hero */
.hero{background:radial-gradient(120% 130% at 82% -10%,var(--atmo),#fff 62%)}
.hero .wrap{padding-top:46px;padding-bottom:64px}
.hero-copy{text-align:center;max-width:660px;margin:0 auto 34px}
.hero-copy h1{font-size:clamp(34px,4.6vw,52px);font-weight:800}
.hero-copy h1 .accent{color:var(--green)}
.hero-copy p{font-size:18px;color:var(--muted);margin:14px auto 22px;max-width:520px}
.video-panel{position:relative;border-radius:22px;overflow:hidden;border:1px solid var(--border);aspect-ratio:16/6.5;background:linear-gradient(120deg,#DCEFF2,#EAF4FB 45%,#DDF3E9);box-shadow:0 34px 64px -34px rgba(6,59,92,.3)}
.video-panel video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.video-panel .scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,59,92,.32),rgba(6,59,92,.55))}
.play{position:absolute;inset:0;margin:auto;width:72px;height:72px;border-radius:50%;background:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 14px 30px -8px rgba(6,59,92,.4);border:none;transition:transform .18s}
.play:hover{transform:scale(1.06)}
.video-panel .hs-content{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:14px;padding:40px 60px;pointer-events:none}
.video-panel .hs-content.align-left{align-items:flex-start;text-align:left}
.video-panel .hs-content.align-right{align-items:flex-end;text-align:right}
.video-panel .hs-content .tag{background:#fff;color:var(--blue);font-family:var(--display);font-weight:700;font-size:12px;letter-spacing:.1em;text-transform:uppercase;padding:7px 12px;border-radius:20px}
.video-panel .hs-content h2{color:#fff;font-family:var(--display);font-weight:800;font-size:clamp(26px,4.4vw,48px);line-height:1.14;max-width:720px;text-shadow:0 2px 20px rgba(0,0,0,.28)}
.video-panel .hs-content .hs-sub{color:#fff;font-size:clamp(14px,1.7vw,18px);max-width:560px;opacity:.94;margin:0}
.video-panel .hs-content .hs-cta{pointer-events:auto;margin-top:4px}

/* product card */
.pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.cab-grid{grid-template-columns:repeat(3,1fr)}
.pcard{border:1px solid var(--border);border-radius:16px;overflow:hidden;background:#fff;display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s;cursor:pointer}
.pcard:hover{transform:translateY(-4px);box-shadow:0 24px 46px -28px rgba(6,59,92,.32)}
.pcard .ph{aspect-ratio:1/1;display:grid;place-items:center;position:relative;padding:10px;overflow:hidden}
.pcard .ph svg{height:78%;width:auto}
.pcard .ph img{width:100%;height:100%;object-fit:contain}
.pcard .off{position:absolute;top:12px;left:12px;background:var(--green);color:#fff;font-family:var(--display);font-weight:700;font-size:11px;padding:5px 9px;border-radius:20px}
.pcard .bd{padding:16px 18px 18px;display:flex;flex-direction:column;gap:8px;flex:1}
.pcard h3{font-size:16.5px;font-weight:700;line-height:1.3}
.pcard .sub{font-size:12.5px;color:var(--muted)}
.rate{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
.stars{color:var(--green);letter-spacing:1.5px;font-size:13px}
.price{display:flex;align-items:baseline;gap:8px}
.price .now{font-family:var(--display);font-weight:800;font-size:18px}
.price .mrp{color:var(--muted);text-decoration:line-through;font-size:13.5px}
.pcard .btn{margin-top:auto}

/* tiles */
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.tile{border:1px solid var(--border);border-radius:16px;padding:24px;background:#fff;cursor:pointer;transition:.2s;position:relative;overflow:hidden}
.tile:hover{transform:translateY(-3px);box-shadow:0 20px 40px -26px rgba(6,59,92,.3)}
.tile .ic{width:48px;height:48px;border-radius:12px;display:grid;place-items:center;margin-bottom:16px;background:#E9F3FA;color:var(--blue)}
.tile.g .ic{background:#E5F4EE;color:var(--green)}
.tile h3{font-size:17px;font-weight:700}
.tile p{margin:4px 0 0;font-size:13px;color:var(--muted)}

/* category strip */
.cat-strip-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.cat-strip-head h2{font-size:20px;margin:0}
.cat-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}
.cat-avatar{display:flex;flex-direction:column;align-items:center;gap:10px;cursor:pointer;text-align:center}
.cat-avatar .circle{width:96px;height:96px;border-radius:50%;overflow:hidden;background:var(--atmo,#F4FAF9);display:grid;place-items:center;border:1px solid var(--border);transition:.2s}
.cat-avatar:hover .circle{transform:translateY(-3px);box-shadow:0 16px 30px -18px rgba(6,59,92,.35)}
.cat-avatar .circle img{width:100%;height:100%;object-fit:cover}
.cat-avatar .circle span{font-family:var(--display);font-weight:800;font-size:28px;color:var(--blue)}
.cat-avatar>span{font-size:13.5px;font-weight:600;color:var(--ink)}
@media (max-width:600px){
  .cat-strip{grid-template-columns:repeat(5,minmax(72px,1fr));gap:10px;overflow-x:auto;padding-bottom:6px}
  .cat-avatar .circle{width:64px;height:64px}
  .cat-avatar .circle span{font-size:20px}
  .cat-avatar>span{font-size:11.5px}
}

/* reels */
.reels{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.reel{position:relative;aspect-ratio:9/14;border-radius:16px;overflow:hidden;border:1px solid var(--border)}
.reel .play{width:52px;height:52px}
.reel .views{position:absolute;top:12px;left:12px;background:rgba(6,59,92,.75);color:#fff;font-family:var(--display);font-weight:600;font-size:11.5px;padding:5px 9px;border-radius:20px;display:flex;gap:5px;align-items:center}
.reel .shop{position:absolute;left:10px;right:10px;bottom:10px;background:#fff;border-radius:12px;padding:10px 12px;display:flex;align-items:center;gap:10px;box-shadow:0 10px 24px -10px rgba(6,59,92,.35)}
.reel .shop .t{flex:1;min-width:0}
.reel .shop .t b{display:block;font-family:var(--display);font-size:12.5px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.reel .shop .t span{font-size:12px;color:var(--muted)}
.reel .shop button{flex:none;background:var(--blue);border:none;color:#fff;font-family:var(--display);font-weight:700;font-size:12.5px;padding:8px 12px;border-radius:8px;cursor:pointer}
.reel .shop button:hover{background:var(--blue-hover)}

/* brand band */
.band{background:linear-gradient(135deg,var(--atmo),#fff);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.band .tiles{grid-template-columns:repeat(4,1fr)}

/* IG grid */
.ig{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.ig a{aspect-ratio:1/1;border-radius:12px;border:1px solid var(--border);display:grid;place-items:center;color:var(--blue);transition:.18s;overflow:hidden}
.ig a:hover{transform:scale(1.03);color:var(--green)}
.ig a img{width:100%;height:100%;object-fit:cover;display:block}

/* reviews */
.rev-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.rev{border:1px solid var(--border);border-radius:16px;padding:24px;background:#fff}
.rev .stars{font-size:15px}
.rev h4{font-size:16px;margin:10px 0 6px}
.rev p{font-size:14px;color:var(--muted);margin:0 0 14px}
.rev .who{font-family:var(--display);font-weight:700;font-size:13px}
.rev .who span{color:var(--green);font-weight:600;font-size:12px;display:block}
.score{display:flex;align-items:center;gap:16px;background:var(--atmo);border:1px solid var(--border);border-radius:16px;padding:18px 24px;margin-bottom:26px;width:max-content}
.score .n{font-family:var(--display);font-weight:800;font-size:34px}
.score .d{font-size:13px;color:var(--muted)}

/* shop */
.shop-head{padding:44px 0 8px}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 0}
.chip{font-family:var(--display);font-weight:600;font-size:13.5px;padding:8px 14px;border-radius:30px;border:1px solid var(--border);background:#fff;cursor:pointer;transition:.15s}
.chip:hover{border-color:#cfe0e5}
.chip.active{background:var(--blue);border-color:var(--blue);color:#fff}
.fgroup{font-family:var(--display);font-weight:700;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:18px 0 8px}
.shop-layout{display:grid;grid-template-columns:240px 1fr;gap:36px;align-items:start}
.shop-aside{position:sticky;top:86px}
.shop-aside-head{display:none}
.shop-aside-apply{display:none}
.filter-group{border-bottom:1px solid var(--border);padding:16px 0}
.filter-group:first-child{padding-top:0}
.filter-group h4{font-family:var(--display);font-weight:700;font-size:13.5px;letter-spacing:.04em;text-transform:uppercase;margin-bottom:10px}
.filter-check{display:flex;align-items:center;gap:9px;font-size:14px;color:var(--ink);padding:5px 0;cursor:pointer}
.filter-check input{width:16px;height:16px;accent-color:var(--blue);cursor:pointer}
.filter-price{display:flex;align-items:center;gap:8px}
.filter-price input{width:0;flex:1;border:1.5px solid var(--border);border-radius:8px;padding:8px 10px;font-family:var(--body);font-size:13.5px}
.filter-price span{color:var(--muted)}
.shop-filters-toggle{display:none}
.shop-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px}
@media(max-width:980px){
  .shop-layout{grid-template-columns:1fr}
  .shop-filters-toggle{display:inline-flex;align-items:center;font-family:var(--display);font-weight:700;font-size:14px;border:1.5px solid var(--border);border-radius:10px;padding:10px 18px;background:#fff;cursor:pointer;margin-bottom:18px}
  .shop-aside{display:none;position:fixed;inset:0;z-index:90;background:#fff;overflow:auto;padding:20px 20px 90px}
  .shop-aside.open{display:block}
  .shop-aside-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
  .shop-aside-head .x{border:none;background:none;font-size:20px;cursor:pointer;color:var(--muted)}
  .shop-aside-apply{display:block;position:fixed;left:20px;right:20px;bottom:20px;z-index:91}
  body.shop-filters-lock{overflow:hidden}
}

/* product detail */
.crumbs{font-size:13px;color:var(--muted);padding:20px 0 0}
.crumbs a{cursor:pointer}.crumbs a:hover{color:var(--blue)}
.pd{display:grid;grid-template-columns:1.02fr .98fr;gap:44px;padding:26px 0 60px}
.gal .main{position:relative;aspect-ratio:1/1;border-radius:18px;overflow:hidden;border:1px solid var(--border)}
.gal .slide{position:absolute;inset:0;display:grid;place-items:center;padding:26px;opacity:0;transition:opacity .4s}
.gal .slide.on{opacity:1}
.gal .slide svg{height:100%;width:auto}
.gal .slide img{width:100%;height:100%;object-fit:contain}
.gal .chipname{position:absolute;top:14px;left:14px;background:#fff;color:var(--blue);font-family:var(--display);font-weight:700;font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:6px 11px;border-radius:20px}
.gal .arr{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:50%;background:#fff;border:1px solid var(--border);display:grid;place-items:center;cursor:pointer;color:var(--ink);z-index:3}
.gal .arr:hover{color:var(--blue)}
.gal .arr.l{left:12px}.gal .arr.r{right:12px}
.thumbs{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.thumbs button{width:64px;height:64px;border-radius:10px;border:1.5px solid var(--border);cursor:pointer;display:grid;place-items:center;font-family:var(--display);font-weight:700;font-size:10px;color:var(--muted);background:#fff;padding:4px;text-align:center;line-height:1.2;overflow:hidden}
.thumbs button img{width:100%;height:100%;object-fit:contain;border-radius:7px}
.thumbs button.on{border-color:var(--blue);color:var(--blue)}
.info h1{font-size:clamp(26px,3vw,34px);font-weight:800}
.info .sub{color:var(--muted);margin:8px 0 12px;font-size:15px}
.loved{display:inline-flex;align-items:center;gap:7px;background:#E5F4EE;color:var(--green);font-family:var(--display);font-weight:700;font-size:13px;padding:7px 13px;border-radius:20px;margin:10px 0 18px}
.info .price .now{font-size:28px}
.info .price .save{color:var(--green);font-family:var(--display);font-weight:700;font-size:14px}
.sizes{display:flex;gap:10px;margin:16px 0 8px}
.size{border:1.5px solid var(--border);border-radius:12px;padding:10px 16px;cursor:pointer;background:#fff;text-align:left}
.size b{display:block;font-family:var(--display);font-size:15px}
.size span{font-size:12.5px;color:var(--muted)}
.size.on{border-color:var(--blue);background:#F3F9FD}
.qty{display:inline-flex;align-items:center;border:1.5px solid var(--border);border-radius:12px;overflow:hidden}
.qty button{width:40px;height:44px;border:none;background:#fff;font-size:18px;cursor:pointer;color:var(--ink)}
.qty button:hover{background:var(--atmo)}
.qty span{width:40px;text-align:center;font-family:var(--display);font-weight:700}
.buyrow{display:flex;gap:12px;margin:18px 0 20px;flex-wrap:wrap}
.buyrow .btn{flex:1;min-width:150px}
.offerbox{border:1.5px dashed var(--green);background:#F2FBF7;border-radius:14px;padding:16px 18px;font-size:14px}
.offerbox b{font-family:var(--display)}
.offerbox ul{margin:8px 0 0;padding-left:18px}
.offerbox li{margin:4px 0}
.pd-desc{margin-top:22px;color:#28353c;font-size:15.5px}
.meta-strip{display:flex;gap:18px;flex-wrap:wrap;margin-top:20px}
.meta-strip span{font-size:13px;color:var(--muted);display:inline-flex;gap:7px;align-items:center}

.subsec{padding:44px 0;border-top:1px solid var(--border)}
.subsec h2{font-size:26px;font-weight:800;margin-bottom:22px}
.ing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.ing{border:1px solid var(--border);border-radius:14px;padding:18px;background:#fff}
.ing b{font-family:var(--display);display:block;margin-bottom:4px}
.ing p{margin:0;font-size:13.5px;color:var(--muted)}
.ben li{position:relative;padding-left:30px;margin-bottom:12px;list-style:none;font-size:15.5px}
.ben{padding-left:0;margin:0}
.ben li::before{content:"✓";position:absolute;left:0;top:0;width:20px;height:20px;border-radius:50%;background:#E5F4EE;color:var(--green);font-weight:700;font-size:12px;display:grid;place-items:center;margin-top:3px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.step{border:1px solid var(--border);border-radius:14px;padding:20px;background:#fff}
.step .n{width:32px;height:32px;border-radius:50%;background:var(--blue);color:#fff;font-family:var(--display);font-weight:700;display:grid;place-items:center;margin-bottom:12px}
.step p{margin:0;font-size:14px;color:#28353c}
details.faq{border:1px solid var(--border);border-radius:12px;background:#fff;margin-bottom:10px;overflow:hidden}
details.faq summary{cursor:pointer;font-family:var(--display);font-weight:700;font-size:15px;padding:16px 18px;list-style:none;display:flex;justify-content:space-between;align-items:center}
details.faq summary::after{content:"+";font-size:20px;color:var(--blue)}
details.faq[open] summary::after{content:"–"}
details.faq .a{padding:0 18px 16px;font-size:14.5px;color:var(--muted)}
.hero-cross{border-radius:18px;border:1px solid var(--border);background:linear-gradient(120deg,#DCEFF2,#DDF3E9);padding:30px;display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.hero-cross svg{height:120px;width:auto;flex:none}
.hero-cross .t{flex:1;min-width:240px}
.hero-cross h3{font-size:22px;font-weight:800}
.hero-cross p{margin:6px 0 0;color:#2c5064;font-size:14.5px}

/* cart */
.cartgrid{display:grid;grid-template-columns:1.25fr .75fr;gap:34px;padding:40px 0 70px;align-items:start}
.citem{display:flex;gap:16px;border:1px solid var(--border);border-radius:14px;padding:16px;margin-bottom:14px;background:#fff;align-items:center}
.citem .ph{width:84px;height:84px;border-radius:12px;display:grid;place-items:center;flex:none;padding:8px}
.citem .ph svg{height:100%;width:auto}
.citem .t{flex:1;min-width:0}
.citem .t b{font-family:var(--display);font-size:15px;display:block;line-height:1.3}
.citem .t span{font-size:13px;color:var(--muted)}
.citem .pr{font-family:var(--display);font-weight:800;white-space:nowrap}
.citem .rm{border:none;background:none;color:var(--muted);cursor:pointer;font-size:13px;text-decoration:underline;padding:4px}
.citem .rm:hover{color:#c0392b}
.citem.gift{border-style:dashed;border-color:var(--green);background:#F2FBF7}
.citem.gift .pr{color:var(--green)}
.summary{border:1px solid var(--border);border-radius:16px;padding:24px;background:#fff;position:sticky;top:96px}
.summary h3{font-size:19px;margin-bottom:16px}
.srow{display:flex;justify-content:space-between;font-size:14.5px;margin-bottom:10px}
.srow.total{font-family:var(--display);font-weight:800;font-size:18px;border-top:1px solid var(--border);padding-top:12px;margin-top:12px}
.srow .green{color:var(--green);font-weight:600}
.gbar{margin:6px 0 20px}
.gbar .track{height:8px;background:var(--atmo);border:1px solid var(--border);border-radius:20px;position:relative;margin:26px 6px 8px}
.gbar .fill{position:absolute;left:0;top:-1px;bottom:-1px;background:linear-gradient(90deg,var(--blue),var(--green));border-radius:20px;transition:width .4s}
.gbar .mk{position:absolute;top:50%;width:18px;height:18px;border-radius:50%;background:#fff;border:2px solid var(--border);transform:translate(-50%,-50%);display:grid;place-items:center;font-size:9px;color:#fff}
.gbar .mk.hit{background:var(--green);border-color:var(--green)}
.gbar .lbl{position:absolute;top:-24px;transform:translateX(-50%);font-family:var(--display);font-weight:700;font-size:10.5px;color:var(--muted);white-space:nowrap}
.gbar .msg{font-size:13px;color:var(--muted);text-align:center;margin-top:6px}
.gbar .msg b{color:var(--green)}
.empty-cart{text-align:center;padding:80px 0}
.empty-cart p{color:var(--muted)}

/* checkout */
.ckgrid{display:grid;grid-template-columns:1.2fr .8fr;gap:34px;padding:40px 0 70px;align-items:start}
.card{border:1px solid var(--border);border-radius:16px;padding:26px;background:#fff;margin-bottom:18px}
.card h3{font-size:18px;margin-bottom:16px}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.frow.one{grid-template-columns:1fr}
input[type=text],input[type=tel],input[type=email],input[type=password],input[type=number],input[type=search],input[type=url],input:not([type]),textarea,select{width:100%;border:1.5px solid var(--border);border-radius:10px;padding:12px 13px;font-family:var(--body);font-size:14.5px;color:var(--ink);background:#fff}
input[type=text]:disabled,input[type=tel]:disabled,input[type=email]:disabled,input[type=password]:disabled,input[type=number]:disabled,select:disabled{background:#F6F9FA;color:var(--muted);cursor:not-allowed}
input[type=checkbox],input[type=radio]{width:16px;height:16px;accent-color:var(--blue);cursor:pointer}
::placeholder{color:#9aabb2;opacity:1}
input:focus,textarea:focus{outline:2px solid var(--blue);outline-offset:0;border-color:var(--blue)}
label.f{font-family:var(--display);font-weight:600;font-size:13px;display:block;margin-bottom:6px}
.payopt{display:flex;align-items:center;gap:12px;border:1.5px solid var(--border);border-radius:12px;padding:14px 16px;margin-bottom:10px;cursor:pointer}
.payopt.on{border-color:var(--blue);background:#F3F9FD}
.payopt input{accent-color:var(--blue)}
.payopt b{font-family:var(--display);font-size:14.5px}
.payopt span{font-size:12.5px;color:var(--muted);display:block}

/* confirm */
.confirm{text-align:center;padding:80px 0}
.confirm .ck{width:84px;height:84px;border-radius:50%;background:#E5F4EE;color:var(--green);display:grid;place-items:center;margin:0 auto 22px}
.confirm h1{font-size:32px}
.confirm p{color:var(--muted)}
.oid{font-family:var(--display);font-weight:700;background:var(--atmo);border:1px solid var(--border);border-radius:10px;padding:8px 16px;display:inline-block;margin:14px 0 26px}

/* blog */
.bgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.bpost{border:1px solid var(--border);border-radius:16px;overflow:hidden;background:#fff;cursor:pointer;transition:.2s;display:flex;flex-direction:column}
.bpost:hover{transform:translateY(-4px);box-shadow:0 24px 46px -28px rgba(6,59,92,.32)}
.bpost .th{aspect-ratio:16/10;position:relative}
.bpost .tp{position:absolute;top:14px;left:14px;background:#fff;color:var(--blue);font-family:var(--display);font-weight:700;font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:6px 11px;border-radius:20px}
.bpost .bd{padding:20px;display:flex;flex-direction:column;gap:8px;flex:1}
.bpost h3{font-size:19px;line-height:1.25}
.bpost .meta{font-size:13px;color:var(--muted)}
.bpost p{font-size:14px;color:var(--muted);margin:0}
article.bp{max-width:720px;margin:0 auto;padding:30px 28px 30px}
article.bp .kicker{font-family:var(--display);font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--green)}
article.bp h1{font-size:clamp(30px,4vw,42px);margin:12px 0 14px}
article.bp .meta{color:var(--muted);font-size:14px;margin-bottom:24px}
article.bp .hero-ph{aspect-ratio:16/7;border-radius:16px;border:1px solid var(--border);margin-bottom:30px}
article.bp p{font-size:17.5px;line-height:1.76;color:#28353c;margin:0 0 22px}
article.bp h2{font-size:25px;margin:36px 0 14px}

/* account */
.acct{max-width:920px;margin:0 auto;padding:50px 28px 80px}
.login-card{max-width:420px;margin:0 auto;border:1px solid var(--border);border-radius:18px;padding:34px;background:#fff;box-shadow:0 30px 60px -40px rgba(6,59,92,.3)}
.login-card h2{font-size:24px;margin-bottom:6px}
.login-card .muted{font-size:14px;margin-bottom:22px;display:block}
.otp-row{display:flex;gap:10px;margin:8px 0 6px}
.otp-row input{width:56px;height:56px;text-align:center;font-family:var(--display);font-weight:800;font-size:22px}
.hint{font-size:12.5px;color:var(--muted)}
.err{color:#c0392b;font-size:13px;margin-top:8px;display:none}
.err.on{display:block}
.acct-grid{display:grid;grid-template-columns:230px 1fr;gap:28px;align-items:start}
.acct-nav{border:1px solid var(--border);border-radius:14px;overflow:hidden;background:#fff}
.acct-nav button{display:block;width:100%;text-align:left;padding:14px 18px;border:none;background:#fff;font-family:var(--display);font-weight:600;font-size:14.5px;cursor:pointer;border-bottom:1px solid var(--atmo);color:var(--ink)}
.acct-nav button.on{background:#F3F9FD;color:var(--blue);box-shadow:inset 3px 0 0 var(--blue)}
.order{border:1px solid var(--border);border-radius:14px;padding:18px;margin-bottom:14px;background:#fff}
.order .top{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.order b{font-family:var(--display)}
.status{font-family:var(--display);font-weight:700;font-size:12px;padding:5px 11px;border-radius:20px}
.status.c{background:#E5F4EE;color:var(--green)}
.status.d{background:#E9F3FA;color:var(--blue)}
.order .items{font-size:14px;color:var(--muted)}
.addr{border:1px solid var(--border);border-radius:14px;padding:18px;margin-bottom:12px;background:#fff;display:flex;justify-content:space-between;gap:14px;align-items:flex-start}
.addr b{font-family:var(--display)}
.addr p{margin:4px 0 0;font-size:14px;color:var(--muted)}
.vrow{display:flex;justify-content:space-between;align-items:center;border:1px solid var(--border);border-radius:14px;padding:16px 18px;margin-bottom:12px;background:#fff}
.vrow b{font-family:var(--display);font-size:15px}
.vrow span{font-size:13px;color:var(--muted);display:block}
.vbadge{font-family:var(--display);font-weight:700;font-size:12px;padding:6px 12px;border-radius:20px}
.vbadge.ok{background:#E5F4EE;color:var(--green)}

/* static pages */
.static{max-width:760px;margin:0 auto;padding:56px 28px 80px}
.static h1{font-size:36px;margin:10px 0 18px}
.static p{color:#28353c;font-size:16.5px}

/* footer */
footer{background:var(--footer);color:#fff;padding:64px 0 28px;margin-top:40px}
.f-grid{display:flex;flex-wrap:wrap;gap:36px}
.f-brand{flex:1.5 1 240px}
.f-logo-chip{display:inline-block;background:#fff;border-radius:12px;padding:10px 14px;margin-bottom:14px}
.f-brand img{height:36px;width:auto;display:block}
.f-brand p{color:var(--f-sec);font-size:14px;max-width:280px}
.f-col{flex:1 1 140px}
.f-news{flex:1.4 1 220px}
.f-col h4{font-family:var(--display);font-weight:700;font-size:13.5px;letter-spacing:.06em;text-transform:uppercase;margin-bottom:14px;color:#fff}
.f-col a{display:block;color:var(--f-sec);font-size:14px;padding:5px 0;cursor:pointer}
.f-col a:hover{color:var(--f-green)}
.f-news h4{color:#fff;font-family:var(--display);font-weight:700;font-size:13.5px;letter-spacing:.06em;text-transform:uppercase;margin-bottom:14px}
.f-news p{color:var(--f-sec);font-size:14px;margin:0 0 12px}
.news-row{display:flex;gap:8px}
.news-row input{flex:1;background:#0a4a6f;border:1px solid var(--f-div);color:#fff;border-radius:9px;padding:11px 13px;font-size:14px}
.news-row input::placeholder{color:#84a3b3}
.f-bottom{border-top:1px solid var(--f-div);margin-top:40px;padding-top:20px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;color:var(--f-sec);font-size:13px}

/* wishlist heart on cards */
.heart{position:absolute;top:12px;right:12px;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.92);border:1px solid var(--border);display:grid;place-items:center;cursor:pointer;color:#9aa8ae;z-index:2;transition:.15s}
.heart:hover{color:var(--green)}
.heart.on{color:#008A5B}
.heart.on svg{fill:#008A5B;stroke:#008A5B}
.wish-btn{display:inline-flex;align-items:center;gap:8px;border:1.5px solid var(--border);background:#fff;border-radius:12px;padding:11px 16px;font-family:var(--display);font-weight:700;font-size:14px;color:var(--ink);cursor:pointer}
.wish-btn.on{border-color:var(--green);color:var(--green);background:#F2FBF7}
.wish-btn.on svg{fill:var(--green)}
.coupon-box{margin:12px 0}
.coupon-in{display:flex;gap:8px}
.coupon-in input{flex:1;border:1.5px solid var(--border);border-radius:10px;padding:10px 12px;font-family:var(--body);font-size:14px}
.coupon-on{display:flex;justify-content:space-between;align-items:center;background:#F2FBF7;border:1px dashed var(--green);border-radius:10px;padding:10px 14px;font-size:14px}
.coupon-on button{border:none;background:none;color:var(--muted);text-decoration:underline;cursor:pointer;font-size:13px}
.offers{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.offer{text-align:left;border:1px dashed var(--border);background:#fff;border-radius:10px;padding:8px 12px;cursor:pointer;transition:.15s}
.offer:hover{border-color:var(--green);background:#F2FBF7}
.offer b{display:block;font-family:var(--display);font-size:13px;color:var(--blue)}
.offer span{font-size:11.5px;color:var(--muted)}

/* ===== ADMIN ===== */
body.admin-mode .ann,body.admin-mode>header,body.admin-mode>footer,body.admin-mode>main>.view:not(#v-admin){display:none!important}
#v-admin{display:none}
#v-admin.on{display:block}
.adm{min-height:100vh;display:grid;grid-template-columns:230px 1fr;background:#F6F9FA}
.adm-side{background:var(--footer);color:#fff;padding:24px 16px;position:sticky;top:0;height:100vh;overflow:auto}
.adm-side .logo{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:14px;padding:0 8px}
.adm-side .logo img{height:44px}
.adm-side .tag{font-size:11px;color:var(--f-sec);padding:0 8px;margin-bottom:22px;letter-spacing:.08em;text-transform:uppercase;font-family:var(--display);font-weight:700}
.adm-side button{display:flex;align-items:center;gap:11px;width:100%;text-align:left;background:none;border:none;color:var(--f-sec);font-family:var(--display);font-weight:600;font-size:14.5px;padding:12px 14px;border-radius:10px;cursor:pointer;margin-bottom:3px;transition:.15s}
.adm-side button:hover{background:#0a4a6f;color:#fff}
.adm-side button.on{background:var(--blue);color:#fff}
.adm-side .exit{display:block;margin-top:18px;color:#9fbccb;font-size:13px;text-decoration:none;font-family:var(--display);font-weight:600}
.adm-side .exit.exit2{margin-top:6px}
.adm-side .exit:hover{color:#fff}
.adm-main{padding:32px 34px 60px;overflow:auto}
.adm-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:26px;flex-wrap:wrap}
.adm-head h1{font-size:26px}
.adm-head .sub{color:var(--muted);font-size:14px;margin-top:2px}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:14px}
.metric{background:#fff;border:1px solid var(--border);border-radius:16px;padding:20px}
.metric .l{font-size:12.5px;color:var(--muted);font-family:var(--display);font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.metric .v{font-family:var(--display);font-weight:800;font-size:30px;margin-top:8px;color:var(--ink)}
.metric .d{font-size:12.5px;color:var(--green);margin-top:4px;font-weight:600}
.metric.blue{background:linear-gradient(135deg,#E9F3FA,#fff)}
.metric.green{background:linear-gradient(135deg,#E5F4EE,#fff)}
.panel{background:#fff;border:1px solid var(--border);border-radius:16px;padding:22px;margin-bottom:20px}
.panel h3{font-size:17px;margin-bottom:14px}
.adm-bar{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
.adm-bar .sp{flex:1}
select.adm-sel,.adm-search{border:1.5px solid var(--border);border-radius:10px;padding:10px 13px;font-family:var(--body);font-size:14px;background:#fff;color:var(--ink)}
select.adm-sel{font-family:var(--display);font-weight:600;cursor:pointer;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2365747B' stroke-width='2.5'><path d='m6 9 6 6 6-6'/></svg>");background-repeat:no-repeat;background-position:right 11px center;padding-right:32px;-webkit-appearance:none;appearance:none}
table.atbl{width:100%;border-collapse:collapse;font-size:14px;display:table;table-layout:auto}
table.atbl thead{display:table-header-group}
table.atbl tbody{display:table-row-group}
table.atbl tr{display:table-row}
table.atbl th,table.atbl td{display:table-cell}
table.atbl th{text-align:left;font-family:var(--display);font-weight:700;font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);padding:10px 12px;border-bottom:2px solid var(--border)}
table.atbl td{padding:13px 12px;border-bottom:1px solid var(--atmo);vertical-align:middle}
table.atbl tr:hover td{background:#FAFDFC}
table.atbl .thumb-sm{width:42px;height:42px;border-radius:9px;display:grid;place-items:center;padding:4px}
table.atbl .thumb-sm svg{height:100%;width:auto}
table.atbl .thumb-sm img{width:100%;height:100%;object-fit:contain;border-radius:6px}
.atbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -4px}
.atbl-wrap table.atbl{min-width:640px}
.pill{font-family:var(--display);font-weight:700;font-size:11.5px;padding:5px 10px;border-radius:20px;display:inline-block}
.pill.g{background:#E5F4EE;color:var(--green)}
.pill.b{background:#E9F3FA;color:var(--blue)}
.pill.gray{background:#EEF2F3;color:var(--muted)}
.pill.warn{background:#FDF0E7;color:#C77B33}
.adm-btn{font-family:var(--display);font-weight:700;font-size:13.5px;border-radius:9px;padding:9px 15px;border:1.5px solid transparent;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.adm-btn.pri{background:var(--blue);color:#fff}.adm-btn.pri:hover{background:var(--blue-hover)}
.adm-btn.ol{background:#fff;border-color:var(--border);color:var(--ink)}.adm-btn.ol:hover{border-color:var(--blue);color:var(--blue)}
.adm-btn.dng{background:#fff;border-color:#e6c9c2;color:#c0392b}.adm-btn.dng:hover{background:#c0392b;color:#fff}
.tlink{color:var(--blue);cursor:pointer;font-weight:600}
.tlink:hover{text-decoration:underline}
/* modal */
.modal-bg{position:fixed;inset:0;background:rgba(6,30,45,.55);z-index:200;display:none;align-items:flex-start;justify-content:center;overflow:auto;padding:34px 16px}
.modal-bg.on{display:flex}
.modal{background:#fff;border-radius:18px;width:min(760px,100%);padding:28px;box-shadow:0 40px 80px -30px rgba(6,30,45,.6)}
.modal h2{font-size:22px;margin-bottom:4px}
.modal .mtop{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:18px}
.modal .x{border:none;background:#F0F4F5;width:34px;height:34px;border-radius:9px;cursor:pointer;font-size:18px;color:var(--muted)}
.fgrid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fld{margin-bottom:14px}
.fld label{font-family:var(--display);font-weight:600;font-size:13px;display:block;margin-bottom:6px}
.fld small{color:var(--muted);font-weight:500}
/* Quill rich-text editor: fixed total height, toolbar stays put, only the
   content area below it scrolls (a long field can never push the toolbar,
   or the surrounding modal, out of view). */
.quill-wrap{display:flex;flex-direction:column;border:1px solid var(--border);border-radius:10px;overflow:hidden;background:#fff}
.quill-wrap .ql-toolbar.ql-snow{flex:none;border:none;border-bottom:1px solid var(--border);background:#F4FAF9}
.quill-wrap .ql-container.ql-snow{flex:1;border:none;overflow:hidden;font-family:inherit;font-size:14px}
.quill-wrap .ql-editor{height:100%;overflow-y:auto}
.imggrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:10px;margin-top:8px}
.imgcell{position:relative;aspect-ratio:1;border:1.5px solid var(--border);border-radius:10px;overflow:hidden;background:#F4FAF9}
.imgcell img{width:100%;height:100%;object-fit:contain}
.imgcell .del{position:absolute;top:3px;right:3px;background:rgba(255,255,255,.9);border:none;width:22px;height:22px;border-radius:6px;cursor:pointer;color:#c0392b;font-size:13px}
.imgadd{border:1.5px dashed var(--blue);border-radius:10px;aspect-ratio:1;display:grid;place-items:center;cursor:pointer;color:var(--blue);font-size:24px;background:#F3F9FD}
.rowset .rline{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:8px;margin-bottom:8px;align-items:center}
.rowset .rline.sizes-row{grid-template-columns:1.4fr 1fr 1fr 1fr auto}
.rowset .rline.gift-row{grid-template-columns:1fr 2fr auto}
.rowset input{padding:9px 11px;min-width:0}
.mini-x{border:none;background:#F0F4F5;width:34px;height:38px;border-radius:8px;cursor:pointer;color:#c0392b}
.addline{background:none;border:1px dashed var(--border);border-radius:9px;padding:8px 12px;cursor:pointer;font-family:var(--display);font-weight:600;font-size:13px;color:var(--blue)}
.cust-detail dl{display:grid;grid-template-columns:auto 1fr;gap:8px 18px;font-size:14px;margin:0}
.cust-detail dt{color:var(--muted);font-family:var(--display);font-weight:600}
.gate{min-height:100vh;display:grid;place-items:center;background:var(--footer)}
.gate .box{background:#fff;border-radius:20px;padding:40px;width:min(400px,92%);text-align:center;box-shadow:0 40px 80px -30px rgba(0,0,0,.5)}
.gate img{height:52px;margin:0 auto 18px}
.gate h2{font-size:24px;margin-bottom:6px}
.gate .muted{font-size:14px;margin-bottom:20px;display:block}
@media(max-width:820px){
  .adm{grid-template-columns:1fr}
  .adm-side{position:static;height:auto;display:flex;align-items:center;gap:14px;padding:12px 14px;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .adm-side .logo{margin-bottom:0;flex:none}
  .adm-side .logo img{height:28px}
  .adm-side .tag{display:none}
  .adm-side button{width:auto;white-space:nowrap;margin-bottom:0;flex:none}
  .adm-side .exit{margin-top:0;flex:none}
  .metrics{grid-template-columns:1fr 1fr}
  .fgrid2{grid-template-columns:1fr}
}

/* toast */
#toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,20px);background:var(--footer);color:#fff;font-family:var(--display);font-weight:600;font-size:14px;padding:12px 20px;border-radius:12px;opacity:0;pointer-events:none;transition:.3s;z-index:99;box-shadow:0 16px 34px -12px rgba(6,59,92,.5)}
#toast.on{opacity:1;transform:translate(-50%,0)}

@media(max-width:980px){
  .mainnav{display:none}.menu-toggle{display:grid}
  .pgrid,.tiles,.reels,.cab-grid{grid-template-columns:repeat(2,1fr)}
  .band .tiles{grid-template-columns:repeat(2,1fr)}
  .ig{grid-template-columns:repeat(3,1fr)}
  .rev-grid,.bgrid,.ing-grid,.steps{grid-template-columns:1fr 1fr}
  .pd,.cartgrid,.ckgrid{grid-template-columns:1fr}
  .summary{position:static}
  .acct-grid{grid-template-columns:1fr}
}
@media(max-width:600px){
  .tiles,.reels,.rev-grid,.bgrid,.ing-grid,.steps,.band .tiles{grid-template-columns:1fr}
  .pgrid,.cab-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .pcard .ph{padding:6px}
  .pcard .bd{padding:10px 12px 12px;gap:5px}
  .pcard h3{font-size:14px;line-height:1.25}
  .pcard .sub{font-size:11.5px}
  .pcard .price .now{font-size:15.5px}
  .pcard .price .mrp{font-size:12px}
  .pcard .btn{padding:9px 12px;font-size:13px}
  .ig{grid-template-columns:repeat(2,1fr)}
  .f-brand,.f-col,.f-news{flex-basis:100%}
  .wrap{padding:0 20px}
  .video-panel{aspect-ratio:16/10}
  .video-panel .hs-content{padding:24px 22px;gap:10px}
}
@media(max-width:520px){
  .frow{grid-template-columns:1fr}
  .rowset .rline,.rowset .rline.sizes-row,.rowset .rline.gift-row{grid-template-columns:1fr;gap:6px}
  .rowset .rline .mini-x{justify-self:start;width:44px}
  .metrics{grid-template-columns:1fr}
  .adm-bar{flex-direction:column;align-items:stretch}
  .adm-bar .adm-search,.adm-bar select.adm-sel{width:100%}
  .buyrow{flex-wrap:wrap}
  .buyrow .btn{flex:1 1 100%}
  .buyrow .wish-btn{flex:none;width:48px;padding:11px;justify-content:center}
  .buyrow .wish-btn svg{margin:0}
  .sizes{flex-wrap:wrap}
  .modal{padding:20px}
  .modal-bg{padding:16px 10px}
  .otp-row input{width:46px;height:46px}
  .score{width:100%}
  .hero-cross{flex-direction:column;text-align:center}
  .adm-head{flex-direction:column;align-items:flex-start}
}
@media(prefers-reduced-motion:reduce){*{transition:none !important;animation:none !important}}

/* ============ HERO CAROUSEL ============ */
.video-panel .hs-track{position:absolute;inset:0}
.video-panel .hs-slide{position:absolute;inset:0;opacity:0;transition:opacity .6s ease;pointer-events:none}
.video-panel .hs-slide.on{opacity:1;pointer-events:auto}
.video-panel .hs-slide img,.video-panel .hs-slide video{width:100%;height:100%;object-fit:cover;display:block}
.video-panel .hs-arr{position:absolute;top:50%;transform:translateY(-50%);width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.88);border:none;font-size:20px;line-height:1;cursor:pointer;display:grid;place-items:center;color:var(--footer);z-index:3;transition:.2s}
.video-panel .hs-arr:hover{background:#fff}
.video-panel .hs-arr.l{left:14px}
.video-panel .hs-arr.r{right:14px}
.video-panel .hs-dots{position:absolute;bottom:16px;right:18px;display:flex;gap:6px;z-index:3}
.video-panel .hs-dots button{width:7px;height:7px;border-radius:50%;border:none;background:rgba(255,255,255,.55);cursor:pointer;padding:0;transition:.2s}
.video-panel .hs-dots button.on{background:#fff;width:18px;border-radius:5px}
@media(max-width:600px){.video-panel .hs-arr{width:28px;height:28px;font-size:16px}}

/* ============ OUTLETS ============ */
.outlets-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.outlet-card{border:1px solid var(--border);border-radius:16px;overflow:hidden;background:#fff;display:flex;flex-direction:column;transition:.2s}
.outlet-card:hover{transform:translateY(-4px);box-shadow:0 24px 46px -28px rgba(6,59,92,.32)}
.outlet-img{aspect-ratio:16/10;position:relative;overflow:hidden;display:grid;place-items:center;background:var(--atmo)}
.outlet-img img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.outlet-body{padding:20px;display:flex;flex-direction:column;gap:6px}
.outlet-body h3{font-size:19px}
.outlet-addr{font-size:14px;color:var(--muted);margin:0}
.outlet-line{font-size:13.5px;color:#28353c;margin:2px 0}
.outlet-desc{font-size:13.5px;color:var(--muted);margin-top:6px}
.outlet-desc p{margin:0 0 8px}
.outlet-body .btn{align-self:flex-start;margin-top:10px}
@media(max-width:980px){.outlets-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.outlets-grid{grid-template-columns:1fr}}

/* ============ RICH TEXT (QUILL) ============ */
.ql-host{background:#fff}
.ql-toolbar.ql-snow{border-color:var(--border) !important;border-radius:10px 10px 0 0;font-family:var(--body)}
.ql-container.ql-snow{border-color:var(--border) !important;border-radius:0 0 10px 10px;font-family:var(--body);font-size:14.5px}
.ql-editor{min-height:120px}
.pd-desc p,.pd-detail p,.outlet-desc p{margin:0 0 10px}
.pd-detail{margin-top:14px;color:#28353c;font-size:15.5px}
.pd-detail h2,.pd-detail h3{margin:20px 0 10px}

/* ============ ADMIN: SITE THEME PICKER ============ */
.theme-picker{display:flex;flex-wrap:wrap;gap:12px}
.theme-swatch{border:1.5px solid var(--border);border-radius:12px;padding:10px 14px;display:flex;align-items:center;gap:10px;cursor:pointer;font-size:13.5px;font-weight:600;font-family:var(--display)}
.theme-swatch.on{border-color:var(--blue);background:#F3F9FD}
.theme-swatch-dots{display:flex;gap:3px}
.theme-swatch-dots i{width:12px;height:12px;border-radius:50%;display:block}

/* ============ ADMIN: REPORTS ============ */
.rep-layout{display:grid;grid-template-columns:230px 1fr;gap:20px;align-items:start}
.rep-nav{display:flex;flex-direction:column;gap:2px;background:#fff;border:1px solid var(--border);border-radius:16px;padding:10px}
.rep-group-t{font-family:var(--display);font-weight:700;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:14px 10px 6px}
.rep-group:first-child .rep-group-t{margin-top:4px}
.rep-item{text-align:left;border:none;background:none;padding:9px 10px;border-radius:8px;cursor:pointer;font-size:13.5px;color:#28353c;width:100%}
.rep-item:hover{background:var(--atmo)}
.rep-item.on{background:var(--blue);color:#fff}
.rep-view{min-height:220px}
.rep-chart-wrap{margin:6px 0 22px;max-width:100%}
@media(max-width:820px){.rep-layout{grid-template-columns:1fr}.rep-nav{flex-direction:row;flex-wrap:wrap;overflow-x:auto}.rep-group{display:flex;flex-direction:column}}

table.atbl .thumb-sm video{height:100%;width:auto;object-fit:cover;border-radius:6px}