/* ═══════════════════════════════════════════════════════════════════════
   Competer UI 2026 — loads after main.css and overrides it.
   Tokens → chrome (header/footer) → home sections → cards → PLP/PDP → mobile.
   Occasion colours arrive as --oc-* (set by the competer-occasions plugin).
   ═══════════════════════════════════════════════════════════════════════ */

:root {
  --c-ink:#0B1F3A; --c-primary:#1F5FBF; --c-primary-700:#174A96; --c-primary-50:#EAF1FB;
  /* brand marigold: CTAs, badges, highlights only; never large surfaces */
  --c-accent:#FFD23F; --c-accent-700:#F5A524; --c-accent-50:#FFF6D6; --c-on-accent:#0B1F3A;
  --g-accent:linear-gradient(135deg,#FFD23F,#F5A524);
  --c-ground:#F3F5F9; --c-surface:#FFFFFF; --c-line:#E4E9F0; --c-line-2:#CBD5E1;
  --c-text:#1E293B; --c-muted:#526175; --c-success:#15803D; --c-success-50:#ECFDF5; --c-sale:#DC2626;
  --r-sm:8px; --r-md:12px; --r-lg:16px; --r-xl:22px;
  --sh-sm:0 1px 2px rgba(15,23,42,.05),0 1px 1px rgba(15,23,42,.03);
  --sh-md:0 6px 20px -8px rgba(15,23,42,.14);
  --sh-lg:0 18px 44px -16px rgba(15,23,42,.22);
  --font:'Outfit',system-ui,-apple-system,"Segoe UI",sans-serif;
  --container:1320px;
  /* map old theme tokens onto the new palette so untouched components follow */
  --color-primary:var(--c-primary); --brand-purple:var(--c-primary); --primary-purple:var(--c-primary);
  --color-accent:var(--c-accent); --color-secondary:var(--c-accent); --text-dark:var(--c-ink); --text-gray:var(--c-muted);
}
html{scroll-behavior:auto}
body{background:var(--c-ground);color:var(--c-text);font-family:var(--font);-webkit-font-smoothing:antialiased}
.container{max-width:var(--container)}
.ep-container{max-width:var(--container)}
::selection{background:var(--c-accent-50);color:var(--c-ink)}
:focus-visible{outline:3px solid rgba(31,95,191,.45);outline-offset:2px;border-radius:6px}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ─── Section rhythm ──────────────────────────────────────────────────── */
.sec{padding:40px 0}
.sec--tight{padding:24px 0}
.sec--white{background:var(--c-surface)}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:18px}
.sec-title{font-size:24px;font-weight:800;color:var(--c-ink);letter-spacing:-.02em;margin:0;line-height:1.15}
.sec-sub{font-size:14px;color:var(--c-muted);margin:4px 0 0}
.sec-link{font-size:13.5px;font-weight:700;color:var(--c-primary);text-decoration:none;white-space:nowrap;padding:8px 12px;border-radius:999px;background:var(--c-primary-50)}
.sec-link:hover{background:#dbe7f8}
@media(max-width:768px){.sec{padding:26px 0}.sec-title{font-size:19px}.sec-sub{font-size:12.5px}.sec-link{font-size:12px;padding:6px 10px}}

/* ═══════════════════════════════════════════════════════════════════════
   HEADER
   ═══════════════════════════════════════════════════════════════════════ */
.sticky-header-wrapper{box-shadow:none}
.header-v3{background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:1px solid var(--c-line);box-shadow:none}
.sticky-header-wrapper.header-compact .header-v3{box-shadow:0 6px 18px rgba(15,23,42,.08);background:#fff!important}

/* top strip: one message, occasion-aware */
.topstrip{background:var(--c-ink);color:#E2E8F0;font-size:12.5px;font-weight:600;letter-spacing:.01em}
.topstrip-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:34px}
.topstrip-msg{display:flex;align-items:center;gap:10px;min-width:0}
.topstrip-slider{position:relative;height:18px;overflow:hidden;flex:1;min-width:0}
.topstrip-slide{position:absolute;inset:0;opacity:0;transform:translateY(100%);transition:opacity .45s ease,transform .45s ease;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topstrip-slide.active{opacity:1;transform:none}
.topstrip-links{display:flex;gap:18px;flex-shrink:0}
.topstrip-links a{color:#CBD5E1;text-decoration:none;display:inline-flex;align-items:center;gap:5px}
.topstrip-links a:hover{color:#fff}
.topstrip .oc-countdown{background:rgba(255,255,255,.14);padding:2px 10px;border-radius:999px;font-size:12px}
.header-compact .topstrip{max-height:0;overflow:hidden;transition:max-height .3s ease}
.topstrip{max-height:40px;transition:max-height .3s ease}
.announcement-bar-v3{display:none!important}

/* main row */
.header-top-row{padding:10px 0!important}
.header-flex-pw{display:flex;align-items:center;gap:22px}
.header-logo-container{flex-shrink:0}
.header-logo-img{height:44px;width:auto}
.brand-logo{display:inline-flex;line-height:0}
.header-search-container{flex:1;max-width:760px}
.search-form-v3 input[type=search]{height:46px!important;border:2px solid var(--c-line-2)!important;border-radius:12px!important;padding:0 52px 0 16px!important;font-size:15px!important;background:#F8FAFC!important;color:var(--c-ink)!important}
.search-form-v3 input[type=search]:focus{background:#fff!important;border-color:var(--c-primary)!important;box-shadow:0 0 0 4px rgba(31,95,191,.12)!important}
.search-form-v3 button{position:absolute;right:4px;top:4px;height:38px;width:42px;border-radius:9px;background:var(--c-ink);display:flex;align-items:center;justify-content:center;border:0;cursor:pointer}
.search-form-v3 button svg{stroke:#fff!important;width:19px!important;height:19px!important}
.search-form-v3 button:hover{background:var(--c-primary)}
.header-utility-container{display:flex;align-items:center;gap:6px;margin-left:auto;flex-shrink:0}
.utility-item{display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 12px;border-radius:10px;color:var(--c-text);text-decoration:none;transition:background .15s}
.utility-item:hover{background:var(--c-ground);transform:none;color:var(--c-primary)}
.utility-item:hover .utility-icon{transform:none}
.utility-item .utility-icon{width:auto;height:auto;color:var(--c-ink)}
.utility-item span{font-size:11px;font-weight:700;text-transform:none;letter-spacing:0}
.cart-count-badge{background:var(--c-accent);color:var(--c-on-accent);font-weight:800;font-size:10px;min-width:18px;height:18px;line-height:18px;border-radius:999px;position:absolute;top:-8px;right:-10px;text-align:center;padding:0 5px;border:2px solid #fff}
.btn-login-v3{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 18px;border-radius:10px;background:var(--c-ink);color:#fff!important;font-weight:700;font-size:14px;text-decoration:none;margin-left:6px;box-shadow:none}
.btn-login-v3:hover{background:var(--c-primary);transform:none;box-shadow:none}

/* exam nav row */
.header-bottom-row{background:#fff!important;border-top:1px solid var(--c-line)!important}
.category-nav-container{padding:0 20px!important}
.category-nav>ul{display:flex;align-items:center;gap:2px!important;margin:0;padding:0;list-style:none}
.category-nav>ul>li>a{color:var(--c-text)!important;font-size:14px!important;font-weight:600!important;padding:11px 13px!important;border-radius:8px!important;display:inline-flex;align-items:center;gap:5px;text-decoration:none;transition:background .15s,color .15s}
.category-nav>ul>li>a svg,.category-nav>ul>li>a .icon-chevron-down{stroke:var(--c-muted)!important;opacity:1}
.category-nav>ul>li:hover>a,.category-nav>ul>li>a:hover{background:var(--c-primary-50)!important;color:var(--c-primary)!important}
.category-nav>ul>li:hover>a svg{stroke:var(--c-primary)!important}
.category-nav>ul>li.nav-free>a{color:#15803D!important;font-weight:700!important}
.category-nav>ul>li.nav-free>a svg:first-child{stroke:#15803D!important;width:14px;height:14px}
.category-nav>ul>li.nav-free .mega-menu{min-width:420px!important}
.category-nav>ul>li.nav-free .mega-menu a small{color:var(--c-muted);font-size:12px;margin-left:4px;font-weight:600}
.category-nav>ul>li.nav-deals{margin-left:auto}
.category-nav>ul>li.nav-deals>a{color:var(--c-sale)!important;font-weight:700!important}
.category-nav>ul>li.nav-occasion>a{font-weight:800!important;background:var(--c-accent-50)!important;color:var(--c-ink)!important}
.category-nav>ul>li>a.is-current{box-shadow:inset 0 -3px 0 var(--c-accent)}
.category-nav li.has-dropdown::after{display:none!important}
.category-nav .mega-menu{border-top:3px solid var(--c-primary)!important;border-radius:0 0 14px 14px!important;box-shadow:var(--sh-lg)!important;padding:22px 26px 14px!important}
.category-nav .mega-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:24px}
.category-nav .mega-head{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--c-muted);margin-bottom:8px}
.category-nav .mega-menu a{display:block;padding:7px 8px!important;font-size:14px!important;font-weight:500!important;color:var(--c-text)!important;border-radius:8px!important}
.category-nav .mega-menu a:hover{background:var(--c-ground)!important;color:var(--c-primary)!important}
.category-nav .mega-footer{border-top:1px solid var(--c-line);margin-top:14px;padding-top:12px}
.category-nav .mega-view-all{font-weight:700!important;color:var(--c-primary)!important}

/* mobile header */
.pm-header-pw-mobile{background:#fff}
.pm-mobile-top-row{display:flex;align-items:center;gap:10px;padding:8px 14px 4px}
.pm-menu-toggle-left{display:inline-flex;flex-direction:column;align-items:center;gap:1px;background:none;border:0;color:var(--c-ink);padding:4px 6px;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.pm-mobile-logo-left{flex:1;display:flex}
.pm-mobile-logo-left img{height:34px;width:auto}
.pm-mobile-utility-right{display:flex;align-items:center;gap:6px}
.pm-mobile-utility-right .utility-item{padding:6px 8px}
.pm-mobile-search-row{padding:4px 14px 10px}
.pm-mobile-search-row .search-form-v3 input[type=search]{height:42px!important;border-radius:11px!important;font-size:14px!important}
.pm-mobile-search-row .search-form-v3 button{height:34px;width:38px}
.exam-chips{display:flex;gap:8px;overflow-x:auto;padding:0 14px 10px;scrollbar-width:none;-webkit-overflow-scrolling:touch;background:#fff}
.exam-chips::-webkit-scrollbar{display:none}
.exam-chips a{flex:0 0 auto;font-size:12.5px;font-weight:700;color:var(--c-ink);background:var(--c-ground);border:1px solid var(--c-line);padding:7px 12px;border-radius:999px;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.exam-chips a::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--tc,var(--c-primary))}
.exam-chips a.exam-chip-all{color:var(--c-primary);background:var(--c-primary-50);border-color:transparent}
.exam-chips a.exam-chip-all::before{display:none}
@media(min-width:769px){.exam-chips{display:none!important}}
.header-compact .exam-chips{display:none}

/* mobile drawer */
.mobile-nav-drawer{background:#fff}
.mnav-exam-head{display:flex;align-items:center;gap:12px;padding:12px 14px;cursor:pointer;list-style:none;font-weight:700;color:var(--c-ink)}
.mnav-exam-head::-webkit-details-marker{display:none}
.mnav-exam-ic{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--mc,#1F5FBF) 12%,#fff);color:var(--mc,#1F5FBF)}
.mnav-exam-chev{width:16px;height:16px;margin-left:auto;color:var(--c-muted);transition:transform .2s}
details[open]>.mnav-exam-head .mnav-exam-chev{transform:rotate(180deg)}
.mnav-sublist{display:flex;flex-direction:column;padding:0 14px 8px 60px}
.mnav-sub{padding:8px 0;color:var(--c-text);text-decoration:none;font-size:14px;border-bottom:1px solid var(--c-line)}
.mnav-sub-all{color:var(--c-primary);font-weight:700}
.mobile-login-btn-elite{background:var(--c-primary)!important;border-radius:12px!important}
.mobile-bottom-app-bar{background:#fff;border-top:1px solid var(--c-line);box-shadow:0 -6px 20px rgba(15,23,42,.06)}
.app-bar-item{color:var(--c-muted)}
.app-bar-item.is-active{color:var(--c-primary)}

/* ═══════════════════════════════════════════════════════════════════════
   HERO (default + occasion)
   ═══════════════════════════════════════════════════════════════════════ */
.hero-oc{position:relative;overflow:hidden;background:linear-gradient(120deg,var(--c-ink) 0%,#123D7A 60%,#1F5FBF 100%);color:#fff;padding:34px 0 30px}
.hero-oc::before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 85% 20%,rgba(255,255,255,.14),transparent 40%),radial-gradient(circle at 10% 90%,rgba(255,210,63,.16),transparent 35%);pointer-events:none}
.hero-oc-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:36px;align-items:center}
.hero-oc-eyebrow{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.14);color:#fff;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:6px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.2)}
.hero-oc-eyebrow .chh-dot{width:7px;height:7px;border-radius:50%;background:#4ade80;animation:chhDot 2s infinite}
.hero-oc-title{font-size:38px;font-weight:800;line-height:1.1;letter-spacing:-.02em;margin:14px 0 10px}
.hero-oc-title em{font-style:normal;color:var(--c-accent)}
.hero-oc-sub{font-size:15px;line-height:1.55;opacity:.88;max-width:560px;margin:0 0 18px}
.hero-oc-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.hero-oc-cta{display:inline-flex;align-items:center;gap:8px;height:48px;padding:0 22px;border-radius:12px;background:var(--g-accent);color:var(--c-on-accent);font-weight:800;font-size:15px;text-decoration:none;box-shadow:0 10px 24px -8px rgba(245,165,36,.6)}
.hero-oc-cta:hover{filter:brightness(1.05);color:var(--c-on-accent)}
.hero-oc-cta2{display:inline-flex;align-items:center;height:48px;padding:0 18px;border-radius:12px;border:1.5px solid rgba(255,255,255,.35);color:#fff;font-weight:700;font-size:14px;text-decoration:none}
.hero-oc-cta2:hover{background:rgba(255,255,255,.1)}
.hero-oc-meta{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin-top:16px;font-size:13px}
.hero-oc .oc-countdown{background:rgba(0,0,0,.18);padding:6px 12px;border-radius:999px}
.hero-oc .oc-coupon{color:var(--c-ink)}
.hero-oc-search{display:flex;align-items:center;background:#fff;border-radius:12px;padding:4px 4px 4px 14px;box-shadow:0 12px 30px rgba(0,0,0,.2);max-width:560px;margin:0 0 14px}
.hero-oc-search svg{width:19px;height:19px;stroke:#94a3b8;flex-shrink:0}
.hero-oc-search input{flex:1;border:0;outline:0;font-size:15px;padding:10px 11px;color:var(--c-ink);background:none;min-width:0;font-family:var(--font)}
.hero-oc-search button{height:40px;padding:0 18px;border:0;border-radius:9px;background:var(--c-primary);color:#fff;font-weight:700;cursor:pointer;font-family:var(--font)}
.hero-oc-stats{display:flex;gap:22px;margin-top:18px;flex-wrap:wrap}
.hero-oc-stat strong{display:block;font-size:20px;font-weight:800;line-height:1}
.hero-oc-stat span{font-size:11.5px;opacity:.8;text-transform:uppercase;letter-spacing:.05em}
.hero-oc .chh-marquee{display:grid;gap:12px;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.hero-oc .chh-row{display:flex;gap:12px;width:max-content;animation:chhLeft 55s linear infinite}
.hero-oc .chh-row-right{animation-name:chhRight}
.hero-oc .chh-mq-card{display:block;width:142px;height:148px;border-radius:14px;overflow:hidden;background:#fff;box-shadow:var(--sh-md);flex-shrink:0}
.hero-oc .chh-mq-card img{width:100%;height:100%;object-fit:cover;display:block}
@keyframes chhLeft{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes chhRight{from{transform:translateX(-50%)}to{transform:translateX(0)}}
/* occasion tint: light surface, patterned, dark text */
body.has-occasion .hero-oc{background:linear-gradient(135deg,var(--oc-bg) 0%,var(--oc-bg2) 100%);color:var(--oc-ink)}
body.has-occasion .hero-oc::before{background-image:var(--oc-pattern);background-size:140px 140px;opacity:.08}
body.has-occasion .hero-oc-title em{color:var(--oc-primary)}
body.has-occasion .hero-oc-sub{opacity:.85}
body.has-occasion .hero-oc-eyebrow{background:var(--oc-primary);color:var(--oc-on-primary);border-color:transparent}
body.has-occasion .hero-oc-cta{background:var(--oc-accent);color:#1a1a1a;box-shadow:0 10px 24px -8px color-mix(in srgb,var(--oc-accent) 60%,transparent)}
body.has-occasion .hero-oc-cta2{border-color:color-mix(in srgb,var(--oc-ink) 30%,transparent);color:var(--oc-ink)}
body.has-occasion .hero-oc-cta2:hover{background:rgba(0,0,0,.05)}
body.has-occasion .hero-oc .oc-countdown{background:#fff;color:var(--oc-ink);box-shadow:var(--sh-sm)}
body.has-occasion .hero-oc-search{box-shadow:var(--sh-md)}
body.has-occasion .hero-oc-search button{background:var(--oc-primary);color:var(--oc-on-primary)}
body.has-occasion .hero-oc-stat span{opacity:.7}
@media(max-width:980px){
  .hero-oc{padding:22px 0 18px}
  .hero-oc-grid{grid-template-columns:1fr;gap:18px}
  .hero-oc-title{font-size:26px;margin:10px 0 8px}
  .hero-oc-sub{font-size:13.5px;margin-bottom:14px}
  .hero-oc-cta,.hero-oc-cta2{height:44px;font-size:14px}
  .hero-oc-search{display:none}
  .hero-oc-stats{gap:16px;margin-top:14px}
  .hero-oc-stat strong{font-size:17px}
  .hero-oc .chh-marquee{display:flex;overflow-x:auto;scrollbar-width:none;mask-image:none;margin:0 -20px;padding:0 20px}
  .hero-oc .chh-marquee::-webkit-scrollbar{display:none}
  .hero-oc .chh-row{animation:none}
  .hero-oc .chh-row-right{display:none}
  .hero-oc .chh-mq-card{width:112px;height:118px;border-radius:12px}
}

/* ═══════════════════════════════════════════════════════════════════════
   SHOP BY EXAM TILES
   ═══════════════════════════════════════════════════════════════════════ */
/* Mobile-first wrapping grid, never a strip: 2 columns on phones (icon-left rows), 3 from 600px, 6 at desktop. */
.exam-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:4px 0 8px}
.exam-tile{display:flex;flex-direction:row;align-items:center;text-align:left;gap:10px;min-height:56px;min-width:0;text-decoration:none;padding:8px 10px;border-radius:var(--r-lg);background:#fff;border:1px solid var(--c-line);transition:transform .18s,box-shadow .18s,border-color .18s}
.exam-tile:hover{transform:translateY(-3px);box-shadow:var(--sh-md);border-color:var(--c-accent-700)}
.exam-tile:hover .exam-tile-ic{background:var(--g-accent);color:var(--c-ink)}
.exam-tile-ic{flex:0 0 40px;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--c-accent-50);color:var(--c-ink)}
.exam-tile-ic svg{width:20px;height:20px}
.exam-tile-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.exam-tile-name{font-size:13.5px;font-weight:700;color:var(--c-ink);line-height:1.2;overflow-wrap:anywhere}
.exam-tile-count{font-size:11px;color:var(--c-muted)}
.exam-tile--all{grid-column:1/-1}
.exam-tile--all .exam-tile-ic{background:var(--c-primary-50);color:var(--c-primary)}
@media(min-width:600px){
  .exam-tiles{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:1fr;gap:10px;padding:4px 2px 8px}
  .exam-tile{flex-direction:column;text-align:center;gap:8px;padding:14px 8px 12px}
  .exam-tile-ic{flex-basis:auto;width:56px;height:56px}.exam-tile-ic svg{width:26px;height:26px}
  .exam-tile-txt{align-items:center}.exam-tile-name{font-size:14px}.exam-tile--all{grid-column:auto}
}
@media(min-width:900px){.exam-tiles{grid-template-columns:repeat(6,minmax(0,1fr))}}

/* ═══════════════════════════════════════════════════════════════════════
   TRUST STRIP (compact)
   ═══════════════════════════════════════════════════════════════════════ */
.trust-bar{background:transparent;padding:0 0 8px}
.trust-grid{gap:12px}
.trust-item{padding:14px 16px;border-radius:var(--r-md);border:1px solid var(--c-line);box-shadow:none}
.trust-item::before{display:none}
.trust-item:hover{transform:none;box-shadow:var(--sh-sm);border-color:var(--c-line-2)}
.trust-icon{width:40px;height:40px;border-radius:10px;box-shadow:none}
.trust-item:hover .trust-icon{transform:none}
.trust-text h3{font-size:14px;color:var(--c-ink)}
.trust-text p{font-size:12px;color:var(--c-muted)}
@media(max-width:768px){.trust-grid{grid-template-columns:repeat(2,1fr);gap:8px}.trust-item{padding:10px;border-radius:10px}}

/* ═══════════════════════════════════════════════════════════════════════
   PRODUCT ROWS + CARDS (Flipkart density, white card on grey ground)
   ═══════════════════════════════════════════════════════════════════════ */
.hp-scroll-section{padding:0 0 26px}
.hps-header{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:14px}
.hps-title-group{display:flex;align-items:center;gap:12px}
.hps-icon{width:40px;height:40px;border-radius:11px;display:flex;align-items:center;justify-content:center;background:var(--c-primary-50);color:var(--c-primary)}
.hps-icon svg{width:21px;height:21px}
.hps-title{font-size:22px;font-weight:800;color:var(--c-ink);margin:0;letter-spacing:-.02em;line-height:1.15}
.hps-subtitle{font-size:13px;color:var(--c-muted);margin:3px 0 0}
.hps-view-all{font-size:13.5px;font-weight:700;color:var(--c-primary);text-decoration:none;white-space:nowrap;padding:8px 12px;border-radius:999px;background:var(--c-primary-50)}
.hps-view-all:hover{background:#dbe7f8}
.hps-extra{display:flex;align-items:center;gap:10px;margin-left:auto;margin-right:10px}
.hps-outer{position:relative}
.hps-track{gap:12px;padding:4px 2px 10px}
.hps-arrow{position:absolute;top:40%;z-index:2;width:38px;height:38px;border-radius:50%;background:#fff;border:1px solid var(--c-line);box-shadow:var(--sh-md);color:var(--c-ink);font-size:22px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.hps-prev{left:-14px}.hps-next{right:-14px}
.hps-progress-wrap{height:3px;background:var(--c-line);border-radius:3px;overflow:hidden;margin-top:4px}
.hps-progress-bar{height:100%;background:var(--c-primary);width:20%;border-radius:3px}
.hps-card{width:208px;background:#fff;border-radius:var(--r-lg);border:1px solid var(--c-line);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.hps-card:hover{transform:translateY(-3px);box-shadow:var(--sh-md);border-color:var(--c-line-2)}
.hps-card-img{padding-top:100%;background:#fff}
.hps-card-img img{padding:10px;object-fit:contain}
.hps-badge{top:10px;left:10px;background:var(--c-sale);color:#fff;font-size:10.5px;font-weight:800;padding:4px 8px;border-radius:999px;letter-spacing:.02em}
.hps-badge.pc-badge--occasion{background:var(--oc-accent,var(--c-accent));color:#1a1a1a}
.hps-badge-trend{background:var(--c-accent)!important;color:var(--c-on-accent)!important}
.hps-card-body{padding:10px 12px 8px;gap:5px}
.hps-card-name{font-size:13px;font-weight:600;color:var(--c-text);-webkit-line-clamp:2;line-height:1.35;min-height:2.7em}
.hps-card-meta{align-items:center}
.hps-card-price{gap:6px;align-items:baseline}
.hps-price{font-size:16px;font-weight:800;color:var(--c-ink);font-variant-numeric:tabular-nums}
.hps-mrp{font-size:12px;color:var(--c-muted)}
.hps-off{font-size:12px;font-weight:700;color:var(--c-success)}
.hps-rate-badge{display:inline-flex;align-items:center;gap:3px;background:var(--c-success);color:#fff;font-size:11px;font-weight:700;padding:2px 6px;border-radius:6px}
.hps-rate-badge svg{fill:#fff}
.hps-rate-badge::after{content:"°5";font-size:10px;line-height:1}
.hps-add-btn{margin:0 12px 12px;width:auto;border-radius:9px;background:var(--c-ink);color:#fff;font-size:13px;font-weight:700;padding:10px 0;letter-spacing:0;display:flex;align-items:center;justify-content:center;gap:6px;transition:background .15s,color .15s}
.hps-add-btn:hover{background:var(--g-accent);color:var(--c-on-accent)}
.hps-add-btn[disabled]{background:var(--c-ground);color:var(--c-muted)}
.hps-card-grid{width:auto}
@media(max-width:768px){
  .hp-scroll-section{padding:0 0 18px}
  .hps-title{font-size:18px}.hps-subtitle{font-size:12px}
  .hps-icon{width:34px;height:34px;border-radius:9px}.hps-icon svg{width:18px;height:18px}
  .hps-view-all{font-size:12px;padding:6px 10px}
  .hps-card{width:158px;border-radius:12px}
  .hps-card-img img{padding:8px}
  .hps-card-name{font-size:12px}
  .hps-price{font-size:14px}
  .hps-add-btn{margin:0 10px 10px;padding:9px 0;font-size:12px}
  .hps-arrow{display:none}
}

/* deals row heading shows the countdown */
.deals-row .hps-icon{background:var(--g-accent);color:var(--c-ink)}
.deals-row .oc-countdown{background:var(--c-ink);color:#fff;padding:6px 12px;border-radius:999px;font-size:12.5px}
body.has-occasion .deals-row .hps-icon{background:color-mix(in srgb,var(--oc-accent) 18%,#fff);color:var(--oc-primary)}
body.has-occasion .deals-row .oc-countdown{background:var(--oc-primary);color:var(--oc-on-primary)}
@media(max-width:768px){.hps-extra{display:none}}

/* ═══════════════════════════════════════════════════════════════════════
   SHOP BY BUDGET
   ═══════════════════════════════════════════════════════════════════════ */
.budget-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.budget-tile{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--c-line);border-radius:var(--r-lg);padding:16px 18px;text-decoration:none;transition:transform .18s,box-shadow .18s,border-color .18s}
.budget-tile:hover{transform:translateY(-3px);box-shadow:var(--sh-md);border-color:var(--c-primary)}
.budget-tile-ic{width:46px;height:46px;border-radius:12px;background:var(--c-accent-50);color:var(--c-ink);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:18px;flex-shrink:0}
.budget-tile strong{display:block;font-size:16px;color:var(--c-ink);font-weight:800;line-height:1.2}
.budget-tile span{font-size:12.5px;color:var(--c-muted)}
@media(max-width:768px){.budget-grid{grid-template-columns:repeat(2,1fr);gap:8px}.budget-tile{padding:12px;gap:10px;border-radius:12px}.budget-tile-ic{width:38px;height:38px;font-size:15px}.budget-tile strong{font-size:14px}.budget-tile span{font-size:11px}}

/* ═══════════════════════════════════════════════════════════════════════
   EXISTING HOME SECTIONS restyled (institutes, curated tabs, why us, reviews)
   ═══════════════════════════════════════════════════════════════════════ */
.institute-logos-section{padding:0 0 10px;background:transparent}
.section-title-v4{font-size:22px;color:var(--c-ink)}
.il-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:14px}
.il-head-link{font-size:13.5px;font-weight:700;color:var(--c-primary);text-decoration:none;white-space:nowrap;padding:8px 12px;border-radius:999px;background:var(--c-primary-50)}
.inst-card-v4{background:#fff;border:1px solid var(--c-line);border-radius:var(--r-md)}
.cme-section{background:#fff;border-top:1px solid var(--c-line);border-bottom:1px solid var(--c-line);padding:36px 0}
.cme-title{font-size:22px;color:var(--c-ink)}
.cme-tab{border-radius:999px}
.cme-tab.is-active{background:var(--c-ink);color:#fff}
.cme-chip{background:var(--c-ground);border:1px solid var(--c-line);border-radius:999px}
.cme-chip:hover{border-color:var(--c-primary);color:var(--c-primary)}
.cmp-section{background:transparent;padding:40px 0}
.cmp-title{color:var(--c-ink)}
.cmp-table{background:#fff;border:1px solid var(--c-line);border-radius:var(--r-lg);box-shadow:none}
.cmp-cta-btn{background:var(--c-primary);border-radius:12px}
.tm-section{background:#fff;border-top:1px solid var(--c-line)}
.tm-card{border:1px solid var(--c-line);box-shadow:none}
.brandstrip{background:#fff;border-top:1px solid var(--c-line)}

/* ═══════════════════════════════════════════════════════════════════════
   PLP
   ═══════════════════════════════════════════════════════════════════════ */
.cat-sidebar-inner{background:#fff;border:1px solid var(--c-line);border-radius:var(--r-lg)}
.csr-pill{background:#fff;border:1px solid var(--c-line);border-radius:999px;font-weight:600}
.csr-pill:hover{border-color:var(--c-primary);color:var(--c-primary)}
.cat-main .products,.hps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media(max-width:1100px){.cat-main .products,.hps-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:768px){.cat-main .products,.hps-grid{grid-template-columns:repeat(2,1fr);gap:8px}}

/* ═══════════════════════════════════════════════════════════════════════
   PDP touches (layout already exists; colour + trust emphasis)
   ═══════════════════════════════════════════════════════════════════════ */
.single-product .btn-add-to-bag,.single-product .sp-atc,.single-product button.single_add_to_cart_button{background:var(--g-accent)!important;color:var(--c-on-accent)!important;border-radius:12px!important;font-weight:800!important}
.single-product .btn-add-to-bag:hover,.single-product button.single_add_to_cart_button:hover{filter:brightness(1.05);color:var(--c-on-accent)!important}
.single-product .sp-delivery{background:var(--c-success-50);border:1px solid #BBF7D0;border-radius:12px}
/* Honest trust row: wraps on phones; real order count and "no reviews yet" instead of invented stars */
.sp-star-row{flex-wrap:wrap;row-gap:4px}
.sp-star-link--none{color:var(--c-muted);font-weight:600;min-height:24px;display:inline-flex;align-items:center}
.sp-bought{display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:700;color:var(--c-success);background:var(--c-success-50);border-radius:999px;padding:3px 10px;min-height:24px}
.sp-bought::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--c-success)}
.rv-none{padding:8px 0 4px}
.rv-none-text{color:var(--c-muted);font-size:14px;line-height:1.5;margin:8px 0 0;max-width:60ch}
.oc-pdp-strip{display:flex;align-items:center;gap:10px;background:var(--oc-bg,var(--c-accent-50));border:1px dashed var(--oc-accent,var(--c-accent));color:var(--oc-ink,var(--c-ink));border-radius:12px;padding:10px 14px;font-size:13.5px;margin:12px 0}
.oc-pdp-strip strong{font-weight:800}
.oc-pdp-strip .oc-countdown{margin-left:auto;font-size:12.5px}

/* ═══════════════════════════════════════════════════════════════════════
   CART DRAWER + FOOTER
   ═══════════════════════════════════════════════════════════════════════ */
.cart-drawer-checkout-btn{background:var(--g-accent)!important;color:var(--c-on-accent)!important;border-radius:12px!important;font-weight:800!important}
.cart-drawer-checkout-btn:hover{filter:brightness(1.05);color:var(--c-on-accent)!important}
.cf{background:var(--c-ink)}
.cf-accent{height:4px;background:var(--g-accent)}
.cf-logo{height:44px;width:auto}
.cf-heading{color:#fff;font-weight:800;letter-spacing:.02em}
.cf-links a{color:#CBD5E1}
.cf-links a:hover{color:#fff}
.cf-tagline{color:#CBD5E1}
.cf-wa-btn{background:#25D366;color:#062b12;border-radius:12px;font-weight:800}
.cme-feat{background:var(--c-ink)!important}
.cmp-cta-btn{background:var(--c-ink);border-radius:12px}
.sec-link,.hps-view-all,.il-head-link{background:var(--c-accent-50);color:var(--c-ink)}
.sec-link:hover,.hps-view-all:hover,.il-head-link:hover{background:var(--c-accent)}
.app-bar-item.is-active{color:var(--c-ink)}
.app-bar-item.is-active .app-bar-icon-wrap{background:var(--c-accent-50);border-radius:10px}
@media(max-width:768px){.pm-mobile-logo-left img,.header-logo-img{height:36px}}
.cf-bottom{background:#07152A;border-top:1px solid rgba(255,255,255,.06)}
.cp-seo-links{background:#fff!important;border-top:1px solid var(--c-line)!important}

/* WhatsApp float sits clear of the mobile app bar */
.whatsapp-float{background:#25D366;box-shadow:0 10px 24px -8px rgba(37,211,102,.7)}
@media(max-width:768px){.whatsapp-float{bottom:84px;right:14px;width:48px;height:48px}}

/* ─── Reveal (progressive, content visible without JS) ─────────────────── */
@media(prefers-reduced-motion:no-preference){
  .rv{opacity:0;transform:translateY(16px);transition:opacity .45s ease-out,transform .45s ease-out}
  .rv.in{opacity:1;transform:none}
}

/* Page-to-page transitions (cross-document View Transitions; browsers without support just navigate).
   A cart thumbnail tagged cp-product on click morphs into the product page's first image. */
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.22s;animation-timing-function:cubic-bezier(.2,.8,.2,1)}
::view-transition-group(cp-product){animation-duration:.32s;animation-timing-function:cubic-bezier(.2,.8,.2,1)}
@media(prefers-reduced-motion:reduce){@view-transition{navigation:none}}