/* =================================================================
   Products page — premium catalogue (views/products.php)
   Brand: orange #ff7f00 on warm white, navy #12182b, violet accents.
   ================================================================= */
.pd-page{
  --pd-orange:#ff7f00; --pd-orange-dark:#d96500; --pd-orange-soft:#fff1e2;
  --pd-violet:#6d4aff; --pd-violet-soft:#f1edff;
  --pd-ink:#14161a; --pd-navy:#12182b; --pd-gray:#5d6575; --pd-border:#eceef2; --pd-bg:#fbfbfa;
  --pd-green:#0f7b4a; --pd-green-soft:#e6f6ee; --pd-blue:#2949c7; --pd-blue-soft:#eaefff;
  margin:0; background:var(--pd-bg); color:var(--pd-ink);
  font-family:'Inter','Inter Fallback',sans-serif; -webkit-font-smoothing:antialiased;
}
.pd-page *, .pd-page *::before, .pd-page *::after{ box-sizing:border-box; }
.pd-page main h1, .pd-page main h2, .pd-page main h3{ font-family:'Plus Jakarta Sans','Plus Jakarta Sans Fallback',sans-serif; margin:0; }
.pd-page main p{ margin:0; }
.pd-page main a{ text-decoration:none; color:inherit; }
.pd-page main ul{ list-style:none; margin:0; padding:0; }
.pd-page .sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

.pd-container{ max-width:1240px; margin:0 auto; padding:0 32px; }
.pd-page main :focus-visible{ outline:3px solid var(--pd-orange); outline-offset:3px; border-radius:10px; }

/* ---------- Buttons, eyebrows, badges ---------- */
.pd-btn{
  display:inline-flex; align-items:center; gap:10px; padding:14px 24px; border-radius:12px;
  background:var(--pd-orange); color:#fff !important; font-weight:700; font-size:14.5px; line-height:1;
  box-shadow:0 12px 24px -10px rgba(255,127,0,.55); transition:background .2s, transform .2s, box-shadow .2s;
}
.pd-btn:hover{ background:var(--pd-orange-dark); transform:translateY(-2px); box-shadow:0 16px 28px -12px rgba(255,127,0,.6); }
.pd-btn-ghost{ background:#fff; color:var(--pd-ink) !important; border:1.5px solid var(--pd-border); box-shadow:none; }
.pd-btn-ghost:hover{ background:#fff; border-color:#ffd2a6; box-shadow:0 10px 22px -14px rgba(20,22,26,.35); }
.pd-btn-light{ background:#fff; color:var(--pd-ink) !important; box-shadow:none; }
.pd-btn-light:hover{ background:#fff4e8; }
.pd-btn-outline{ background:transparent; border:1.5px solid rgba(255,255,255,.55); box-shadow:none; }
.pd-btn-outline:hover{ background:rgba(255,255,255,.12); }
.pd-actions{ display:flex; flex-wrap:wrap; gap:14px; }

.pd-eyebrow{
  display:inline-flex; align-items:center; gap:8px; padding:7px 15px; border-radius:50px;
  background:var(--pd-orange-soft); color:#9a4500; /* 5.5:1 on the soft orange */
  font-weight:700; font-size:12px; letter-spacing:.6px; text-transform:uppercase;
}
.pd-eyebrow-dark{ background:rgba(255,255,255,.1); color:#ffc48a; }

.pd-badge{ display:inline-block; padding:5px 11px; border-radius:50px; font-size:11.5px; font-weight:700; line-height:1.2; white-space:nowrap; }
.pd-badge.is-live{ background:var(--pd-green-soft); color:var(--pd-green); }
.pd-badge.is-module{ background:var(--pd-blue-soft); color:var(--pd-blue); white-space:normal; text-align:right; }
.pd-badge.is-demo{ background:#f2f3f6; color:#4a5160; }

/* ---------- Hero ---------- */
.pd-hero{
  position:relative; overflow:hidden; padding:80px 0 70px;
  background:
    radial-gradient(600px 320px at 85% 15%, rgba(109,74,255,.10), transparent 70%),
    radial-gradient(520px 300px at 10% 0%, rgba(255,127,0,.12), transparent 70%),
    linear-gradient(180deg,#fff7ef 0%, var(--pd-bg) 100%);
}
.pd-hero-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:48px; align-items:center; }
.pd-hero h1{ margin-top:22px !important; font-size:56px; line-height:1.06; font-weight:800; letter-spacing:-1.5px; }
.pd-hero h1 span{
  display:block; background:linear-gradient(90deg,var(--pd-orange),#ff4f1f 55%, var(--pd-violet));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.pd-lead{ margin-top:22px !important; font-size:18px; line-height:1.7; color:var(--pd-gray); max-width:540px; }
.pd-hero .pd-actions{ margin-top:32px; }
.pd-hero-facts{ display:flex; flex-wrap:wrap; gap:10px 28px; margin-top:34px !important; color:var(--pd-gray); font-size:14px; }
.pd-hero-facts strong{ color:var(--pd-ink); font-size:16px; margin-right:4px; }
/* System font for the rupee sign only: avoids downloading a whole extra web-font subset for one glyph */
.pd-rupee{ font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif; }

/* Orbit illustration (pure CSS; fixed size so it never shifts the layout) */
.pd-orbit{ position:relative; width:100%; max-width:460px; aspect-ratio:1/1; margin-left:auto; }
.pd-orbit-ring{ position:absolute; inset:8%; border-radius:50%; border:1.5px dashed rgba(255,127,0,.35); }
.pd-orbit-ring-2{ inset:26%; border-color:rgba(109,74,255,.3); }
.pd-orbit-core{
  position:absolute; left:50%; top:50%; width:132px; height:132px; transform:translate(-50%,-50%); border-radius:50%;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  background:linear-gradient(135deg,var(--pd-orange),#ff5a1f 60%, var(--pd-violet)); color:#fff;
  box-shadow:0 26px 50px -18px rgba(255,90,31,.6); font-weight:700; font-size:13px;
}
.pd-orbit-core i{ font-size:34px; }
.pd-orbit-chip{
  position:absolute; display:inline-flex; align-items:center; gap:8px; padding:10px 14px; border-radius:14px;
  background:#fff; border:1px solid var(--pd-border); box-shadow:0 18px 34px -18px rgba(20,22,26,.35);
  font-size:13px; font-weight:700; white-space:nowrap; animation:pd-float 6s ease-in-out infinite;
}
.pd-orbit-chip i{ color:var(--pd-orange); }
.pd-orbit-chip.c1{ left:34%; top:1%; }
.pd-orbit-chip.c2{ right:0; top:22%; animation-delay:-1s; }
.pd-orbit-chip.c3{ right:2%; bottom:20%; animation-delay:-2s; }
.pd-orbit-chip.c4{ left:36%; bottom:0; animation-delay:-3s; }
.pd-orbit-chip.c5{ left:0; bottom:24%; animation-delay:-4s; }
.pd-orbit-chip.c6{ left:2%; top:20%; animation-delay:-5s; }
@keyframes pd-float{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-8px); } }
@media (prefers-reduced-motion: reduce){ .pd-orbit-chip{ animation:none; } }

/* ---------- Category navigation ---------- */
.pd-catnav{ border-top:1px solid var(--pd-border); border-bottom:1px solid var(--pd-border); background:#fff; }
.pd-catnav ul{ display:flex; gap:10px; overflow-x:auto; padding:14px 0 !important; scrollbar-width:thin; }
.pd-catnav a{
  display:inline-flex; align-items:center; gap:8px; padding:10px 16px; border-radius:50px; white-space:nowrap;
  border:1px solid var(--pd-border); font-weight:600; font-size:14px; color:var(--pd-ink); transition:.2s;
}
.pd-catnav a i{ color:var(--pd-orange); }
.pd-catnav a:hover{ border-color:#ffd2a6; background:var(--pd-orange-soft); }

/* ---------- Sections and cards ---------- */
.pd-intro{ padding-top:64px; text-align:center; }
.pd-intro h2{ font-size:34px; font-weight:800; letter-spacing:-.6px; }
.pd-intro p{ margin:12px auto 0 !important; max-width:640px; color:var(--pd-gray); font-size:16px; line-height:1.7; }

.pd-section{ padding:56px 0 18px; scroll-margin-top:100px; }
.pd-head{ display:flex; align-items:center; gap:16px; margin-bottom:26px; }
.pd-head-icon{
  width:52px; height:52px; flex-shrink:0; border-radius:15px; display:flex; align-items:center; justify-content:center;
  background:var(--pd-navy); color:#ffb066; font-size:20px;
}
.pd-head h2{ font-size:26px; font-weight:800; letter-spacing:-.4px; }
.pd-head p{ margin-top:4px !important; color:var(--pd-gray); font-size:15px; }

.pd-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.pd-grid-4{ grid-template-columns:repeat(4,1fr); }
.pd-grid-2{ grid-template-columns:repeat(2,1fr); }
.pd-grid-4 .pd-card{ padding:24px 22px; }
.pd-card{
  position:relative; display:flex; flex-direction:column; height:100%; padding:26px;
  background:#fff; border:1px solid var(--pd-border); border-radius:20px;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.pd-card::before{
  content:''; position:absolute; inset:0 0 auto 0; height:4px; border-radius:20px 20px 0 0;
  background:linear-gradient(90deg,var(--pd-orange),var(--pd-violet)); opacity:0; transition:opacity .25s;
}
.pd-card:hover{ transform:translateY(-6px); border-color:#ffe0bd; box-shadow:0 26px 44px -22px rgba(255,127,0,.32); }
.pd-card:hover::before{ opacity:1; }
.pd-card-top{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:18px; }
.pd-icon{
  width:52px; height:52px; flex-shrink:0; border-radius:15px; display:flex; align-items:center; justify-content:center;
  background:var(--pd-orange-soft); color:var(--pd-orange); font-size:21px;
}
.pd-card h3{ font-size:19px; font-weight:800; }
.pd-card > p{ margin-top:8px !important; color:var(--pd-gray); font-size:14.5px; line-height:1.6; }
.pd-caps{ margin:18px 0 22px !important; display:grid; gap:9px; flex-grow:1; align-content:start; }
.pd-caps li{ display:flex; gap:10px; font-size:14px; line-height:1.45; color:#2b2f36; }
.pd-caps i{ margin-top:3px; color:var(--pd-green); font-size:12px; }
.pd-card-actions{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; padding-top:18px; border-top:1px solid var(--pd-border); }
.pd-link{ display:inline-flex; align-items:center; gap:8px; font-weight:700; font-size:14px; color:var(--pd-orange-dark) !important; }
.pd-link i{ transition:transform .2s; }
.pd-link:hover i{ transform:translateX(4px); }
.pd-link-muted{ color:var(--pd-gray) !important; font-weight:600; }
.pd-link-muted:hover{ color:var(--pd-ink) !important; }

/* ---------- AI capabilities ---------- */
.pd-ai{
  margin-top:56px; padding:76px 0; color:#fff; scroll-margin-top:90px;
  background:radial-gradient(700px 360px at 90% 0%, rgba(109,74,255,.35), transparent 70%), var(--pd-navy);
}
.pd-ai-head{ max-width:700px; }
.pd-ai-head h2{ margin-top:16px !important; font-size:34px; font-weight:800; letter-spacing:-.6px; }
.pd-ai-head p{ margin-top:12px !important; color:#c6cbe0; font-size:16px; line-height:1.7; }
.pd-ai-head a{ color:#ffc48a !important; text-decoration:underline !important; }
.pd-ai-grid{ margin-top:36px; display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.pd-ai-item{
  display:flex; gap:14px; padding:20px; border-radius:16px;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); transition:background .2s, border-color .2s;
}
.pd-ai-item:hover{ background:rgba(255,255,255,.09); border-color:rgba(255,196,138,.35); }
.pd-ai-item .pd-icon{ width:44px; height:44px; border-radius:12px; font-size:17px; background:rgba(255,127,0,.16); color:#ffb066; }
.pd-ai-item h3{ font-size:15.5px; font-weight:700; }
.pd-ai-item p{ margin-top:4px !important; color:#b8bed3; font-size:13.5px; line-height:1.55; }
.pd-ai-more{ margin-top:30px !important; }

/* ---------- AI Lab (research) ---------- */
.pd-lab{ padding-top:76px; scroll-margin-top:90px; }
.pd-lab-head{ text-align:center; max-width:720px; margin:0 auto 34px; }
.pd-lab-head h2{ margin-top:16px !important; font-size:34px; font-weight:800; letter-spacing:-.6px; }
.pd-lab-head p{ margin-top:12px !important; color:var(--pd-gray); font-size:16px; line-height:1.7; }
.pd-lab-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.pd-lab-card{
  position:relative; display:flex; flex-direction:column; gap:12px; padding:26px 24px; border-radius:20px;
  background:linear-gradient(180deg,#fff, #fbf9ff); border:1px solid #e7e1ff;
  transition:transform .25s, box-shadow .25s, border-color .25s;
}
.pd-lab-card:hover{ transform:translateY(-6px); border-color:#cfc2ff; box-shadow:0 26px 44px -24px rgba(109,74,255,.45); }
.pd-lab-card .pd-icon{ background:var(--pd-violet-soft); color:var(--pd-violet); }
.pd-lab-card h3{ font-size:17px; font-weight:800; }
.pd-lab-card p{ color:var(--pd-gray); font-size:14px; line-height:1.6; flex-grow:1; }
.pd-lab-card .pd-link{ color:var(--pd-violet) !important; }
.pd-lab-status{
  align-self:flex-start; padding:5px 11px; border-radius:50px; font-size:11.5px; font-weight:700;
  background:#fff4e5; color:#9a4a00; border:1px dashed #f0b679;
}
.pd-lab-more{ margin-top:30px !important; text-align:center; }

/* ---------- Closing CTA ---------- */
.pd-cta{
  margin:76px 0 80px; padding:44px 48px; border-radius:26px; color:#fff;
  display:flex; align-items:center; justify-content:space-between; gap:28px; flex-wrap:wrap;
  background:radial-gradient(520px 260px at 100% 0%, rgba(109,74,255,.45), transparent 70%), linear-gradient(120deg,#ff7f00,#ff5a1f);
  box-shadow:0 30px 60px -30px rgba(255,90,31,.7);
}
.pd-cta h2{ font-size:30px; font-weight:800; letter-spacing:-.5px; }
.pd-cta p{ margin-top:8px !important; font-size:16px; color:#fff3e6; max-width:560px; }

/* ---------- Responsive ---------- */
@media (max-width:1100px){
  .pd-grid, .pd-grid-4{ grid-template-columns:repeat(2,1fr); }
  .pd-ai-grid{ grid-template-columns:repeat(2,1fr); }
  .pd-lab-grid{ grid-template-columns:repeat(2,1fr); }
  .pd-hero h1{ font-size:46px; }
}
@media (max-width:860px){
  .pd-hero-grid{ grid-template-columns:1fr; }
  .pd-orbit{ max-width:380px; margin:10px auto 0; }
}
@media (max-width:640px){
  .pd-container{ padding:0 16px; }
  .pd-hero{ padding:44px 0 40px; }
  .pd-hero h1{ font-size:34px; letter-spacing:-.8px; }
  .pd-lead{ font-size:16px; }
  .pd-hero .pd-actions a{ flex:1 1 100%; justify-content:center; }
  .pd-orbit{ max-width:320px; }
  .pd-orbit-core{ width:104px; height:104px; }
  .pd-orbit-core i{ font-size:26px; }
  .pd-orbit-chip{ padding:8px 10px; font-size:12px; }
  .pd-grid, .pd-grid-2, .pd-grid-4, .pd-ai-grid, .pd-lab-grid{ grid-template-columns:1fr; }
  .pd-intro{ padding-top:44px; }
  .pd-intro h2, .pd-ai-head h2, .pd-lab-head h2{ font-size:27px; }
  .pd-section{ padding:40px 0 8px; }
  .pd-cta{ padding:32px 24px; margin:56px 0; }
  .pd-cta h2{ font-size:24px; }
  .pd-cta .pd-actions{ width:100%; }
  .pd-cta .pd-actions a{ flex:1; justify-content:center; }
}