/* Codenixo Products Premium V3
   Exact approved direction: compact product catalog + product detail.
   SVG product visuals: no blurry raster crops.
*/
.products-premium {
  --pp-ink:#071127;
  --pp-copy:#61718e;
  --pp-line:rgba(148,163,184,.20);
  --pp-soft:#f7f9ff;
  --pp-card:#fff;
  --pp-shadow:0 18px 50px -38px rgba(15,23,42,.28);
  color:var(--pp-ink);
  background:#fff;
}
html.dark .products-premium {
  --pp-ink:#f8fafc;
  --pp-copy:#cbd5e1;
  --pp-line:rgba(255,255,255,.10);
  --pp-soft:#07101f;
  --pp-card:#0f172a;
  background:#020617;
}
.products-premium p{color:var(--pp-copy)}
.products-premium a{text-decoration:none}
.pp-eyebrow{
  display:inline-flex;align-items:center;gap:10px;margin:0 0 12px;
  color:var(--brand-dark);font-size:10px;font-weight:850;letter-spacing:.17em;text-transform:uppercase
}
.pp-eyebrow:after{content:"";width:38px;height:1px;background:linear-gradient(90deg,var(--brand),transparent)}
html.dark .pp-eyebrow{color:var(--brand-light)}

@media (min-width:1181px){
  body[data-page="products"] .navbar:not(.scrolled){
    background:transparent!important;border-bottom-color:transparent!important;box-shadow:none!important;
    backdrop-filter:none!important;-webkit-backdrop-filter:none!important
  }
}

/* Index hero */
.pp-hero{
  padding:134px 0 58px;
  overflow:hidden;
  background:radial-gradient(circle at 77% 15%,rgba(99,102,241,.10),transparent 30%),linear-gradient(180deg,#fbfcff,#fff)
}
html.dark .pp-hero{background:radial-gradient(circle at 77% 15%,rgba(99,102,241,.14),transparent 30%),linear-gradient(180deg,#020617,#07101f)}
.pp-hero__grid{display:grid;grid-template-columns:minmax(0,.88fr) minmax(430px,1.12fr);gap:46px;align-items:center}
.pp-hero__title{
  margin:0 0 18px;color:var(--pp-ink);font-family:var(--font-display);
  font-size:clamp(50px,5.2vw,76px);font-weight:800;line-height:.96;letter-spacing:-.058em
}
.pp-hero__lead{max-width:580px;margin:0;font-size:17px;line-height:1.62}
.pp-signals{display:flex;flex-wrap:wrap;gap:17px;margin-top:26px}
.pp-signals span{display:inline-flex;align-items:center;gap:7px;color:#53627f;font-size:11.5px;font-weight:650}
html.dark .pp-signals span{color:#cbd5e1}
.pp-signals i{width:7px;height:7px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 4px rgba(99,102,241,.08)}
.pp-hero__visual{width:min(100%,650px);justify-self:end}
.pp-hero__visual picture{display:block;width:100%}
.pp-hero__visual img{display:block;width:100%;height:auto;image-rendering:auto;filter:drop-shadow(0 24px 30px rgba(15,23,42,.12))}

/* Catalog */
.pp-catalog{padding:36px 0 58px;background:#fff}
html.dark .pp-catalog{background:#020617}
.pp-search{
  display:flex;align-items:center;gap:10px;height:48px;padding:0 15px;border:1px solid var(--pp-line);
  border-radius:11px;background:var(--pp-card);box-shadow:0 10px 30px -28px rgba(15,23,42,.35)
}
.pp-search svg{width:18px;height:18px;fill:none;stroke:#94a3b8;stroke-width:1.8;stroke-linecap:round}
.pp-search input{width:100%;border:0;outline:0;background:transparent;color:var(--pp-ink);font:inherit;font-size:13px}
.pp-filters{display:flex;flex-wrap:wrap;gap:9px;margin:14px 0 22px}
.pp-filters button{
  min-height:38px;padding:0 17px;border:1px solid var(--pp-line);border-radius:10px;background:var(--pp-card);
  color:var(--pp-copy);font-size:11.5px;font-weight:750;cursor:pointer
}
.pp-filters button.is-active{border-color:transparent;background:linear-gradient(180deg,#6c63ff,#5548f0);color:#fff;box-shadow:0 10px 24px -16px rgba(79,70,229,.6)}

.pp-product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.pp-product-card{
  display:block;overflow:hidden;border:1px solid var(--pp-line);border-radius:16px;background:var(--pp-card);
  color:inherit;box-shadow:var(--pp-shadow);cursor:pointer;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease
}
.pp-product-card:hover{transform:translateY(-4px);border-color:rgba(99,102,241,.30);box-shadow:0 26px 62px -40px rgba(79,70,229,.38)}
.pp-product-card:focus-visible{outline:3px solid rgba(99,102,241,.34);outline-offset:3px}
.pp-product-card[hidden]{display:none}
.pp-product-card__visual{position:relative;aspect-ratio:1.64/1;overflow:hidden;background:#eef2ff}
.pp-product-card__visual picture{display:block;width:100%;height:100%}
.pp-product-card__visual img{display:block;width:100%;height:100%;object-fit:cover;image-rendering:auto}
.pp-popular{position:absolute;right:12px;top:12px;padding:6px 11px;border-radius:999px;background:#5b54f7;color:#fff;font-size:10px;font-weight:800}
.pp-product-card__body{padding:17px 17px 18px}
.pp-product-card h3{margin:0 0 7px;color:var(--pp-ink);font-size:17px;line-height:1.24}
.pp-product-card p{min-height:56px;margin:0 0 12px;font-size:12.6px;line-height:1.5}
.pp-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.pp-tags span{padding:4px 7px;border-radius:7px;background:rgba(99,102,241,.08);color:var(--brand-dark);font-size:9.5px;font-weight:750;line-height:1.3}
html.dark .pp-tags span{color:#c7d2fe;background:rgba(99,102,241,.14)}
.pp-product-card__link{display:inline-flex;align-items:center;gap:7px;color:var(--brand-dark);font-size:11.5px;font-weight:850;pointer-events:none}
html.dark .pp-product-card__link{color:var(--brand-light)}
.pp-empty{padding:36px 0;text-align:center;font-size:14px}

/* Custom CTA */
.pp-custom{padding:0 0 66px;background:#fff}
html.dark .pp-custom{background:#020617}
.pp-custom__panel{
  position:relative;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(260px,.65fr) 180px;
  gap:28px;align-items:center;overflow:hidden;padding:32px 34px;border:1px solid rgba(99,102,241,.10);
  border-radius:20px;background:radial-gradient(circle at 90% 50%,rgba(99,102,241,.18),transparent 30%),linear-gradient(135deg,#f8faff,#eef2ff)
}
html.dark .pp-custom__panel{background:radial-gradient(circle at 90% 50%,rgba(99,102,241,.20),transparent 30%),linear-gradient(135deg,#0b1220,#101a31)}
.pp-custom__panel h2{margin:0 0 8px;color:var(--pp-ink);font-family:var(--font-display);font-size:clamp(30px,3vw,42px);line-height:1.04;letter-spacing:-.045em}
.pp-custom__panel p:not(.pp-eyebrow){max-width:560px;margin:0 0 18px;font-size:13px;line-height:1.58}
.pp-custom__points{display:grid;gap:10px}
.pp-custom__points span{display:flex;align-items:center;gap:9px;color:var(--pp-ink);font-size:12px;font-weight:700}
.pp-custom__points i{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#fff;color:var(--brand);font-style:normal;box-shadow:0 8px 20px -14px rgba(79,70,229,.5)}
html.dark .pp-custom__points i{background:#111c33}
.pp-custom__shape{position:relative;width:140px;height:140px;justify-self:center}
.pp-custom__shape i{position:absolute;inset:28px;border:1px solid rgba(99,102,241,.26);transform:rotate(30deg);border-radius:18px}
.pp-custom__shape i:nth-child(2){inset:12px;transform:rotate(60deg);opacity:.7}
.pp-custom__shape i:nth-child(3){inset:44px;background:linear-gradient(145deg,#8b83ff,#5b54f7);border:0;box-shadow:0 22px 40px -25px rgba(79,70,229,.7)}

/* shared buttons */
.pp-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.pp-actions .app-button,.pp-actions .btn-secondary{min-height:48px;padding-inline:24px}
.pp-actions .btn-secondary{border-color:rgba(99,102,241,.15);background:rgba(255,255,255,.82)}
html.dark .pp-actions .btn-secondary{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.15);color:#fff}

/* Detail hero */
.pd-hero{
  padding:126px 0 50px;background:radial-gradient(circle at 80% 12%,rgba(99,102,241,.10),transparent 28%),linear-gradient(180deg,#fbfcff,#fff)
}
html.dark .pd-hero{background:radial-gradient(circle at 80% 12%,rgba(99,102,241,.14),transparent 28%),linear-gradient(180deg,#020617,#07101f)}
.pd-back{display:inline-flex;align-items:center;gap:8px;margin-bottom:24px;color:var(--brand-dark);font-size:10.5px;font-weight:800}
html.dark .pd-back{color:var(--brand-light)}
.pd-hero__grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(480px,1.18fr);gap:50px;align-items:center}
.pd-hero__title{
  margin:0 0 7px;color:var(--pp-ink);font-family:var(--font-display);font-size:clamp(56px,5.7vw,82px);
  font-weight:800;line-height:.92;letter-spacing:-.06em
}
.pd-tagline{margin:0 0 16px!important;color:var(--brand)!important;font-family:var(--font-display);font-size:clamp(24px,2.3vw,34px)!important;font-weight:750;line-height:1.05!important;letter-spacing:-.035em}
.pd-hero__lead{max-width:600px;margin:0;font-size:15px;line-height:1.62}
.pd-hero__visual{width:min(100%,700px);justify-self:end}
.pd-hero__visual picture{display:block;width:100%}
.pd-hero__visual img{display:block;width:100%;height:auto;image-rendering:auto;filter:drop-shadow(0 24px 34px rgba(15,23,42,.13))}

/* tabs */
.pd-tabs-wrap{padding:0 0 24px;background:#fff}
html.dark .pd-tabs-wrap{background:#020617}
.pd-tabs{
  display:flex;gap:2px;overflow:auto;padding:7px;border:1px solid var(--pp-line);border-radius:11px;background:var(--pp-card);
  box-shadow:0 12px 34px -30px rgba(15,23,42,.28)
}
.pd-tabs a{flex:0 0 auto;padding:9px 18px;border-radius:8px;color:var(--pp-copy);font-size:11.5px;font-weight:750}
.pd-tabs a.is-active{color:var(--brand-dark);background:#eef2ff}
html.dark .pd-tabs a.is-active{color:#c7d2fe;background:rgba(99,102,241,.15)}

.pd-section{padding:52px 0;background:#fff;scroll-margin-top:96px}
html.dark .pd-section{background:#020617}
.pd-soft{background:var(--pp-soft)}
html.dark .pd-soft{background:#07101f}
.pd-overview{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(320px,.72fr);gap:70px;align-items:start}
.pd-overview h2,.pd-section-head h2,.pd-technical h2{
  margin:0 0 12px;color:var(--pp-ink);font-family:var(--font-display);font-size:clamp(30px,2.8vw,42px);line-height:1.05;letter-spacing:-.045em
}
.pd-overview p{max-width:760px;margin:0 0 10px;font-size:13.5px;line-height:1.65}
.pd-benefits{display:grid;gap:10px;margin:0;padding:4px 0 0;list-style:none}
.pd-benefits li{display:grid;grid-template-columns:24px 1fr;gap:9px;color:var(--pp-copy);font-size:12.5px;line-height:1.45}
.pd-benefits span{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#eef2ff;color:var(--brand);font-weight:900}
html.dark .pd-benefits span{background:rgba(99,102,241,.14)}

.pd-section-head{display:flex;justify-content:space-between;gap:28px;align-items:end;margin-bottom:22px}
.pd-section-head p{max-width:500px;margin:0;font-size:12.5px;line-height:1.55}
.pd-feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.pd-feature-card{min-height:160px;padding:18px;border:1px solid var(--pp-line);border-radius:14px;background:var(--pp-card);box-shadow:var(--pp-shadow)}
.pd-feature-card__icon{display:grid;place-items:center;width:36px;height:36px;margin-bottom:14px;border-radius:10px;background:#eef2ff;color:var(--brand);font-family:var(--font-mono);font-size:9px;font-weight:850}
html.dark .pd-feature-card__icon{background:rgba(99,102,241,.14)}
.pd-feature-card h3{margin:0 0 6px;color:var(--pp-ink);font-size:15px;line-height:1.3}
.pd-feature-card p{margin:0;font-size:11.5px;line-height:1.52}

.pd-use-cases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.pd-use-cases div{display:grid;grid-template-columns:24px 1fr;gap:9px;align-items:center;min-height:52px;padding:11px 13px;border:1px solid var(--pp-line);border-radius:11px;background:var(--pp-card);color:var(--pp-copy);font-size:12px;font-weight:650}
.pd-use-cases span{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#eef2ff;color:var(--brand);font-weight:900}
html.dark .pd-use-cases span{background:rgba(99,102,241,.14)}

.pd-technical{background:var(--pp-soft)}
html.dark .pd-technical{background:#07101f}
.pd-technical__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:22px}
.pd-technical__grid article{padding:18px;border:1px solid var(--pp-line);border-radius:14px;background:var(--pp-card)}
.pd-technical__grid h3{margin:0 0 8px;color:var(--pp-ink);font-size:14px}
.pd-technical__grid p,.pd-technical__grid li{font-size:11.5px;line-height:1.55}
.pd-technical__grid ul{margin:0;padding-left:18px;color:var(--pp-copy)}

.pd-faq{background:#fff}
html.dark .pd-faq{background:#020617}
.pp-faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px 14px}
.pp-faq-item{overflow:hidden;border:1px solid var(--pp-line);border-radius:11px;background:var(--pp-card)}
.pp-faq-item summary{display:grid;grid-template-columns:1fr 27px;gap:12px;align-items:center;min-height:50px;padding:11px 12px 11px 15px;color:var(--pp-ink);font-size:11.8px;font-weight:750;cursor:pointer;list-style:none}
.pp-faq-item summary::-webkit-details-marker{display:none}
.pp-faq-toggle{position:relative;width:27px;height:27px;border-radius:50%;background:#eef2ff;color:var(--brand)}
html.dark .pp-faq-toggle{background:rgba(99,102,241,.14)}
.pp-faq-toggle:before,.pp-faq-toggle:after{content:"";position:absolute;left:50%;top:50%;width:10px;height:1.5px;border-radius:2px;background:currentColor;transform:translate(-50%,-50%)}
.pp-faq-toggle:after{transform:translate(-50%,-50%) rotate(90deg)}
.pp-faq-item[open] .pp-faq-toggle:after{opacity:0}
.pp-faq-item>div{padding:0 40px 13px 15px}
.pp-faq-item>div p{margin:0;font-size:12px;line-height:1.58}

.pd-final{padding:0 0 64px;background:#fff}
html.dark .pd-final{background:#020617}
.pd-final__panel{
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:center;padding:24px 28px;border-radius:16px;
  background:linear-gradient(110deg,#eef2ff,#f8faff);border:1px solid rgba(99,102,241,.12)
}
html.dark .pd-final__panel{background:linear-gradient(110deg,#101a31,#0b1220)}
.pd-final__panel h2{margin:0 0 5px;color:var(--pp-ink);font-family:var(--font-display);font-size:27px;line-height:1.05;letter-spacing:-.04em}
.pd-final__panel p{margin:0;font-size:12px}

/* Bangla */
html[lang="bn"] .pp-eyebrow,html[lang="bn"] .pd-back{font-family:var(--font-bn);letter-spacing:0;text-transform:none}
html[lang="bn"] .pp-hero__title,html[lang="bn"] .pd-hero__title,html[lang="bn"] .pd-tagline,html[lang="bn"] .pd-overview h2,html[lang="bn"] .pd-section-head h2,html[lang="bn"] .pd-technical h2,html[lang="bn"] .pd-final__panel h2,html[lang="bn"] .pp-custom__panel h2{font-family:var(--font-bn);letter-spacing:-.01em;line-height:1.18}

/* Responsive */
@media(max-width:1060px){
  .pp-hero__grid,.pd-hero__grid{grid-template-columns:1fr 1fr}
  .pp-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pd-feature-grid,.pd-use-cases,.pd-technical__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:820px){
  .pp-hero,.pd-hero{padding:116px 0 50px}
  .pp-hero__grid,.pd-hero__grid,.pd-overview,.pp-custom__panel{grid-template-columns:1fr}
  .pp-hero__visual,.pd-hero__visual{justify-self:start;width:min(100%,660px)}
  .pp-custom__shape{display:none}
  .pd-section-head{display:block}
  .pd-section-head p{margin-top:8px}
}
@media(max-width:620px){
  .pp-hero__title,.pd-hero__title{font-size:clamp(42px,12vw,58px)}
  .pp-product-grid,.pd-feature-grid,.pd-use-cases,.pd-technical__grid,.pp-faq-grid{grid-template-columns:1fr}
  .pp-product-card p{min-height:0}
  .pp-filters{flex-wrap:nowrap;overflow-x:auto;padding-bottom:3px}
  .pp-filters button{flex:0 0 auto}
  .pd-tabs{border-radius:9px}
  .pd-final__panel{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){.pp-product-card{transition:none}}
