/* =========================================================
   Autovens PRO Canvas  (override layer, loaded last — safe to remove)
   Premium tinted canvas + glass surfaces + synced buttons
   ========================================================= */
:root{
  --pro-ink:#140a33;
  --pro-grad:linear-gradient(120deg,#6d3df0 0%,#a21caf 55%,#f43f5e 100%);
  --pro-grad-warm:linear-gradient(120deg,#f43f5e 0%,#f97316 60%,#f59e0b 100%);
  --pro-surface:rgba(255,255,255,.62);
  --pro-border:rgba(124,58,237,.14);
  --pro-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 10px 30px -18px rgba(46,16,101,.35);
}

/* 1. Canvas: blurred aurora mood */
html{background:linear-gradient(160deg,#efe7ff 0%,#f6ecfb 45%,#fff1ea 100%) fixed !important;min-height:100%}
body{background:transparent !important;color:var(--pro-ink);position:relative}
body::before{
  content:"";position:fixed;inset:-15%;z-index:-2;pointer-events:none;
  background:
    radial-gradient(38% 34% at 82% 12%,rgba(124,58,237,.55),transparent 70%),
    radial-gradient(34% 32% at 12% 30%,rgba(236,72,153,.40),transparent 70%),
    radial-gradient(36% 34% at 70% 78%,rgba(56,189,248,.30),transparent 70%),
    radial-gradient(30% 30% at 22% 88%,rgba(251,146,60,.32),transparent 70%);
  filter:blur(70px) saturate(130%);
  animation:proAurora 26s ease-in-out infinite alternate;
}
body::after{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(rgba(255,255,255,.55) 1px,transparent 1.3px) 0 0/24px 24px;
  -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:.6;
}
@keyframes proAurora{
  0%{transform:translate3d(0,0,0) scale(1) rotate(0deg)}
  50%{transform:translate3d(-3%,2%,0) scale(1.08) rotate(6deg)}
  100%{transform:translate3d(3%,-2%,0) scale(1.04) rotate(-5deg)}
}
@media (prefers-reduced-motion:reduce){body::before{animation:none}}

/* 2. Header glass tinted to canvas */
header.sticky{background:rgba(255,255,255,.55) !important;border-bottom:1px solid var(--pro-border) !important}

@layer components {
/* 3. Glass surfaces (cards, trust strip, product cards) */
.card{
  background:var(--pro-surface) !important;
  -webkit-backdrop-filter:saturate(160%) blur(10px);backdrop-filter:saturate(160%) blur(10px);
  border:1px solid var(--pro-border) !important;
  box-shadow:var(--pro-shadow) !important;
}
.group.card{background:#fff !important}
.group.card > a.card-shine{background:linear-gradient(180deg,#fbf9ff,#f1ecff) !important}
.group.card:hover{border-color:rgba(162,28,175,.35) !important}
.section-title{color:var(--pro-ink)}

}

@layer components {
/* 4. Buttons — one gradient family, synced with the canvas */
.btn-primary,.btn-accent,.gbtn{
  background:var(--pro-grad) !important;background-size:180% 100% !important;background-position:0 0 !important;
  color:#fff !important;border:0 !important;border-radius:999px !important;font-weight:700;
  box-shadow:0 10px 22px -10px rgba(124,58,237,.75),inset 0 1px 0 rgba(255,255,255,.3) !important;
  transition:background-position .5s ease,transform .2s ease,box-shadow .25s ease,filter .2s !important;
  position:relative;overflow:hidden;
}
.btn-accent{background:var(--pro-grad-warm) !important;background-size:180% 100% !important;box-shadow:0 10px 22px -10px rgba(244,63,94,.75),inset 0 1px 0 rgba(255,255,255,.3) !important}
.btn-primary:hover,.btn-accent:hover,.gbtn:hover{background-position:100% 0 !important;transform:translateY(-1px);filter:brightness(1.05);box-shadow:0 16px 30px -12px rgba(162,28,175,.7),0 0 0 4px rgba(139,92,246,.15),inset 0 1px 0 rgba(255,255,255,.35) !important}
.btn-primary:active,.btn-accent:active,.gbtn:active{transform:scale(.97)}
.btn-primary::after,.btn-accent::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.45) 50%,transparent 65%);background-size:250% 100%;background-position:150% 0;transition:background-position .7s ease;pointer-events:none}
.btn-primary:hover::after,.btn-accent:hover::after{background-position:-60% 0}

.btn-outline{
  background:rgba(255,255,255,.65) !important;border:1.5px solid rgba(124,58,237,.35) !important;color:#5b21d6 !important;
  border-radius:999px !important;font-weight:700;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  transition:all .25s ease !important;
}
.btn-outline:hover{background:var(--pro-grad) !important;color:#fff !important;border-color:transparent !important;box-shadow:0 10px 22px -10px rgba(124,58,237,.7) !important}

/* "View all →" style links become soft pills */
a.text-brand-600.font-semibold.hover\:underline{
  padding:5px 12px;border-radius:999px;background:rgba(255,255,255,.7);border:1px solid var(--pro-border);
  text-decoration:none !important;transition:all .25s ease;
}
a.text-brand-600.font-semibold.hover\:underline:hover{background:var(--pro-grad);color:#fff !important;border-color:transparent;box-shadow:0 8px 18px -10px rgba(124,58,237,.7)}

}

/* 5. Inputs blend into glass */
.input{background:rgba(255,255,255,.85) !important}

@media (prefers-reduced-motion:reduce){.btn-primary,.btn-accent,.gbtn,.btn-outline{transition:none !important}}

@layer components {
/* 6. Product-card "Add" buttons — sunset orange, stands out from the violet canvas */
.group.card .btn-primary{
  background:linear-gradient(120deg,#ff9a1f 0%,#ff5e3a 55%,#ff2e63 100%) !important;background-size:180% 100% !important;
  box-shadow:0 10px 22px -10px rgba(255,94,58,.85),inset 0 1px 0 rgba(255,255,255,.35) !important;
}
.group.card .btn-primary:hover{
  box-shadow:0 16px 30px -12px rgba(255,46,99,.75),0 0 0 4px rgba(255,138,31,.2),inset 0 1px 0 rgba(255,255,255,.4) !important;
}
}

/* 7. Policy / info pages */
@layer components {
  .card.prose-page{background:rgba(255,255,255,.92) !important}
}
.prose-page{line-height:1.75;color:#2a2346}
.prose-page h2{position:relative;margin:1.8em 0 .6em;padding-left:14px;font-size:1.25rem;font-weight:800;color:#140a33;letter-spacing:-.01em}
.prose-page h2::before{content:"";position:absolute;left:0;top:.2em;bottom:.2em;width:4px;border-radius:4px;background:var(--pro-grad)}
.prose-page > h2:first-child,.prose-page .lang-block > h2:first-child{margin-top:.4em}
.prose-page h3{margin:1.4em 0 .4em;font-size:1.02rem;font-weight:700;color:#4c1d95}
.prose-page p{margin:.5em 0}
.prose-page ul,.prose-page ol{margin:.5em 0 .8em;padding-left:1.4em}
.prose-page ul{list-style:none;padding-left:0}
.prose-page ul li{position:relative;padding-left:1.4em;margin:.35em 0}
.prose-page ul li::before{content:"";position:absolute;left:.2em;top:.7em;width:7px;height:7px;border-radius:50%;background:var(--pro-grad)}
.prose-page ol{list-style:decimal}
.prose-page ol li{margin:.35em 0;padding-left:.2em}
.prose-page ol li::marker{color:#7c3aed;font-weight:800}
.prose-page a{color:#6d28d9;font-weight:600;text-decoration:underline;text-decoration-color:rgba(109,40,217,.35);text-underline-offset:3px}
.prose-page a:hover{color:#be185d}
.prose-page table{width:100%;margin:1em 0;border-collapse:separate;border-spacing:0;border:1px solid var(--pro-border);border-radius:12px;overflow:hidden;font-size:.95em}
.prose-page th{background:linear-gradient(120deg,rgba(109,61,240,.12),rgba(244,63,94,.10));text-align:left;font-weight:800;color:#2e1065}
.prose-page th,.prose-page td{padding:10px 14px;border-bottom:1px solid var(--pro-border);vertical-align:top}
.prose-page tr:last-child td{border-bottom:0}
.prose-page tbody tr:nth-child(even) td{background:rgba(124,58,237,.035)}
.prose-page hr{margin:2.2em 0;border:0;height:2px;background:var(--pro-grad);opacity:.35;border-radius:2px}
.prose-page .lang-switch{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:1.2em}
.prose-page .lang-switch a{display:inline-flex;align-items:center;padding:7px 18px;border-radius:999px;background:var(--pro-grad);color:#fff !important;text-decoration:none;font-weight:700;box-shadow:0 8px 18px -10px rgba(124,58,237,.7)}
.prose-page .lang-switch a + a{background:linear-gradient(120deg,#ff9a1f,#ff2e63)}
.prose-page .lang-block{scroll-margin-top:150px}
.prose-page [lang="bn"]{font-family:"Hind Siliguri","Noto Sans Bengali",Inter,sans-serif;line-height:1.85}
