/* ==========================================================================
   NEWTECX — product pages (product-<slug>.html)
   One design system for every Newtecx application page, on top of newtecx.css and the
   overview's products.css (hero base, "Built with", closing invitation). One colour system for every
   product: the corporate tokens of newtecx.css (navy, blue, light, slate); a product is told apart by
   its name, content and visuals, never by a colour. Logical properties only (RTL needs no copies).
     A hero (navy) · switcher · B experience (white) · C capabilities (navy) ·
     D business value (light) · E related products + close (white)
   ========================================================================= */
.pd-detail .section{padding-block:clamp(64px,7.5vw,108px);}
.pd-detail .head-stack .h2{margin-top:16px; max-width:760px;}
.pd-detail main [id]{scroll-margin-top:calc(var(--header-h) + 16px);}
.pd-detail .pd-k{margin-bottom:12px;}

/* ---------- A. hero ---------- */
.pd-ph{padding-block:clamp(40px,5vw,72px) clamp(52px,6vw,88px);}
.pd-ph .pd-hero-in{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);}
.pd-own{display:flex; align-items:center; gap:12px; margin-top:4px; font-size:12.5px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:rgba(200,216,255,.78);}
html[dir="rtl"] .pd-own{letter-spacing:.02em;}
.pd-own img{height:20px; width:auto;}
.pd-own i{width:1px; height:18px; background:rgba(255,255,255,.24);}
.pd-ph .h1{margin-top:18px; font-size:clamp(36px,4.2vw,58px);}
html[dir="rtl"] .pd-ph .h1{line-height:1.25; letter-spacing:0;}
.pd-ph .lead{margin-top:16px; max-width:520px; font-size:clamp(18px,1.55vw,22px); font-weight:600; line-height:1.45; color:rgba(236,242,255,.9);}
.pd-ph .pd-btns{margin-top:30px;}
.pd-ph .pd-built{margin-top:30px; padding-top:22px; border-top:1px solid rgba(255,255,255,.1);}
.pd-ph .pd-built .pd-k{margin:0; color:rgba(170,200,255,.66);}
.pd-ph .pd-built li{background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.12); color:#fff;}

/* the real product visual, on one lit stage for every product */
.pd-dv{position:relative; margin:0; display:flex; justify-content:center; align-items:center; min-width:0; isolation:isolate;}
.pd-dv::before{content:""; position:absolute; z-index:-1; inset:4% 6% 10%; border-radius:50%; background:radial-gradient(closest-side, rgba(42,107,255,.5), transparent); filter:blur(30px); opacity:.85;}
.pd-dv::after{content:""; position:absolute; z-index:-1; inset-inline:12%; bottom:-4%; height:12%; border-radius:50%; background:radial-gradient(closest-side, rgba(0,0,0,.55), transparent);}
.pd-dv img{display:block;}
.pd-dv.device img{width:108%; max-width:none; height:auto; margin-inline:-4%; filter:drop-shadow(0 40px 50px rgba(0,0,0,.45));}
.pd-dv.screen{padding:10px; border-radius:20px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); box-shadow:0 60px 100px -50px rgba(0,0,0,.8);}
.pd-dv.screen img{width:100%; height:auto; aspect-ratio:785/330; object-fit:cover; object-position:top center; border-radius:12px;}  /* the approved screen, cropped to where its interface is */
.pd-dv.dark img{width:100%; height:auto; max-height:480px; object-fit:contain; mix-blend-mode:lighten;}
.pd-dv.phones{align-items:flex-start; padding-top:8px;}
.pd-dv.phones .ph{position:relative; display:block; width:31%; flex:none; border-radius:26px; overflow:hidden; background:#fff; box-shadow:0 40px 60px -30px rgba(0,0,0,.7), 0 0 0 6px rgba(255,255,255,.06);}
.pd-dv.phones .ph img{width:100%; height:auto;}
.pd-dv.phones .ph1, .pd-dv.phones .ph3{margin-top:48px; transform:scale(.9);}
.pd-dv.phones .ph1{margin-inline-end:-6%;} .pd-dv.phones .ph3{margin-inline-start:-6%;}
.pd-dv.phones .ph2{z-index:1;}

/* product switcher: a static strip under the hero (never sticky, so it can never cover content) */
.pd-switch{position:relative; z-index:1; background:#fff; border-bottom:1px solid var(--line);}
.pd-switch .wrap{display:flex; align-items:center; gap:clamp(10px,1.4vw,16px); min-height:66px;}
.pd-back{display:inline-flex; align-items:center; gap:8px; font-size:14.5px; font-weight:700; color:var(--muted); white-space:nowrap; transition:color .2s;}
.pd-back svg{width:16px; height:16px; flex:none;}
html[dir="rtl"] .pd-back svg{transform:scaleX(-1);}
.pd-back:hover{color:var(--blue);}
.pd-switch .div{width:1px; height:26px; background:var(--line-strong); flex:none;}
.pd-seg{display:flex; gap:4px; padding:5px; background:var(--light); border:1px solid var(--line-2); border-radius:999px; overflow-x:auto; scrollbar-width:none; min-width:0;}
.pd-seg::-webkit-scrollbar{display:none;}
.pd-seg a{position:relative; padding:9px 11px; border-radius:999px; font-size:13px; font-weight:700; color:var(--muted); white-space:nowrap; transition:background-color .2s, color .2s, box-shadow .2s;}
.pd-seg a:hover{color:var(--ink); background:rgba(255,255,255,.7);}
.pd-seg a[aria-current="page"]{background:#fff; color:var(--navy); font-weight:800; box-shadow:0 2px 8px -2px rgba(14,27,51,.18), 0 0 0 1px rgba(14,27,51,.06);}
.pd-seg a[aria-current="page"]::after{content:""; position:absolute; inset-inline:11px; bottom:4px; height:2px; border-radius:2px; background:var(--blue);}
.pd-seg a:focus-visible{outline-offset:-2px;}

/* ---------- B. experience: what it is, who it serves, what it solves, how it works ---------- */
.pd-xp-in{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:clamp(32px,5vw,80px); align-items:stretch;}
.pd-xp-lead{margin-top:18px; font-size:clamp(20px,1.75vw,25px); font-weight:600; line-height:1.5; letter-spacing:-.01em; color:var(--ink);}
html[dir="rtl"] .pd-xp-lead{letter-spacing:0; line-height:1.7;}
.pd-xp-g{margin-top:28px;}
.pd-sect{display:flex; flex-wrap:wrap; gap:8px;}
.pd-sect a{display:inline-flex; align-items:center; gap:9px; padding:8px 14px 8px 10px; border-radius:999px; font-size:14.5px; font-weight:700; color:var(--ink); background:#fff; border:1px solid var(--line); transition:border-color .2s, color .2s;}
html[dir="rtl"] .pd-sect a{padding:8px 10px 8px 14px;}
.pd-sect a svg{width:18px; height:18px; color:var(--blue);}
.pd-sect a:hover{border-color:var(--blue); color:var(--blue);}
.pd-solves{display:grid; gap:10px;}
.pd-solves li{position:relative; padding-inline-start:26px; font-size:16px; line-height:1.5; color:var(--ink);}
.pd-solves li::before{content:""; position:absolute; inset-inline-start:0; top:.62em; width:14px; height:2px; border-radius:2px; background:var(--blue-soft);}
.pd-svc{display:flex; flex-wrap:wrap; gap:8px 22px;}
.pd-svc a{display:inline-flex; align-items:center; gap:8px; font-size:15px; font-weight:700; color:var(--blue); padding-bottom:2px; border-bottom:2px solid transparent; transition:border-color .2s;}
.pd-svc a::after{content:"\2192";}
html[dir="rtl"] .pd-svc a::after{content:"\2190";}
.pd-svc a:hover{border-bottom-color:currentColor;}

/* how it works: a diagram of the parties and steps in the approved description */
.pd-story{position:relative; display:flex; flex-direction:column; justify-content:center; margin:0; padding:clamp(22px,2.8vw,36px); border-radius:30px; overflow:hidden;
  background:radial-gradient(420px 260px at 50% 0%, var(--blue-ghost), transparent 70%), linear-gradient(170deg, var(--light) 0%, var(--paper-2) 100%); border:1px solid var(--line-2);}
.pd-story::before{content:""; position:absolute; inset:0; background-image:radial-gradient(rgba(14,27,51,.07) 1.2px, transparent 1.2px); background-size:22px 22px; -webkit-mask-image:linear-gradient(to bottom, #000, transparent 80%); mask-image:linear-gradient(to bottom, #000, transparent 80%); pointer-events:none;}
.pd-story > *{position:relative;}
.pd-story figcaption{position:absolute; top:clamp(22px,2.8vw,36px); inset-inline-start:clamp(22px,2.8vw,36px); margin:0;}
.pd-story{min-height:420px; padding-top:clamp(60px,6vw,76px);}
.pd-st-node{display:flex; flex-direction:column; align-items:center; gap:10px; padding:20px 14px; border-radius:18px; text-align:center; background:#fff; border:1px solid var(--line); box-shadow:0 16px 30px -24px rgba(14,27,51,.45);}
.pd-st-node b{font-size:15.5px; font-weight:800; line-height:1.3; color:var(--ink);}
.pd-st-node small{font-size:12.5px; line-height:1.35; color:var(--muted);}
.pd-st-ic{display:grid; place-items:center; width:50px; height:50px; border-radius:14px; color:var(--blue); background:var(--blue-ghost);}
.pd-st-ic svg{width:24px; height:24px;}
.pd-st-ic.logo{background:#fff; border:1px solid var(--line-2);}
.pd-st-ic.logo img{width:34px; height:34px; object-fit:contain;}
.pd-st-node.core{background:var(--navy); border-color:var(--navy); box-shadow:0 26px 44px -24px rgba(14,27,51,.75), 0 0 0 6px var(--blue-ghost);}
.pd-st-node.core b{color:#fff;}
.pd-st-node.core small{color:var(--text-dark);}
.pd-st-node.core .pd-st-ic{color:#fff; background:var(--blue);}
.pd-st-node.out{border-color:rgba(42,107,255,.3);}
.pd-st-link{position:relative; display:flex; align-items:center; justify-content:center;}
.pd-st-link i{display:block; background:var(--blue-soft);}

/* exchange: the party on each side, the product between, what passes through it */
.pd-story.exchange .pd-st-row{display:grid; grid-template-columns:minmax(0,1fr) 34px minmax(0,1.1fr) 34px minmax(0,1fr); align-items:center;}
.pd-story.exchange .pd-st-link.two i{width:100%; height:2px; border-radius:2px;}
.pd-story.exchange .pd-st-link.two::before, .pd-story.exchange .pd-st-link.two::after{content:""; position:absolute; top:50%; width:7px; height:7px; border-top:2px solid var(--blue-soft); border-inline-end:2px solid var(--blue-soft); transform:translateY(-50%) rotate(45deg);}
.pd-story.exchange .pd-st-link.two::before{inset-inline-start:2px; transform:translateY(-50%) rotate(-135deg);}
.pd-story.exchange .pd-st-link.two::after{inset-inline-end:2px;}
html[dir="rtl"] .pd-story.exchange .pd-st-link.two::before{transform:translateY(-50%) rotate(-45deg);}
html[dir="rtl"] .pd-story.exchange .pd-st-link.two::after{transform:translateY(-50%) rotate(135deg);}
.pd-story.exchange .pd-st-node.core{padding-block:22px;}
.pd-st-chan{display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:22px; padding-top:20px; border-top:1px dashed var(--line-strong);}
.pd-st-chan li{display:inline-flex; align-items:center; gap:9px; padding:8px 16px 8px 8px; border-radius:999px; font-size:14px; font-weight:700; color:var(--ink); background:#fff; border:1px solid var(--line);}
html[dir="rtl"] .pd-st-chan li{padding:8px 8px 8px 16px;}
.pd-st-chan .ci{display:grid; place-items:center; width:26px; height:26px; border-radius:50%; color:var(--blue); background:var(--blue-ghost);}
.pd-st-chan svg{width:15px; height:15px;}
.pd-st-base{display:flex; align-items:center; justify-content:center; gap:10px; margin-top:14px; padding:10px 14px; border-radius:14px; font-size:13px; font-weight:700; color:var(--muted); background:#fff; border:1px solid var(--line-2);}
.pd-st-base img{width:22px; height:22px; object-fit:contain;}

/* converge: the records the product brings together, into one view */
.pd-st-in{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px;}
.pd-st-in .pd-st-node{padding:14px 8px; height:100%;}
.pd-st-merge{position:relative; height:34px; margin-inline:12.5%;}
.pd-st-merge::before{content:""; position:absolute; inset-inline:0; top:0; height:16px; border:2px solid var(--blue-soft); border-top:0; border-radius:0 0 12px 12px;}
.pd-st-merge i{position:absolute; inset-inline-start:calc(50% - 1px); top:16px; width:2px; height:18px; background:var(--blue-soft);}
.pd-story.converge > .pd-st-node.core{flex-direction:row; justify-content:center; gap:14px; max-width:340px; margin-inline:auto;}
.pd-story.converge > .pd-st-node.out{flex-direction:row; justify-content:center; gap:12px; max-width:340px; margin-inline:auto;}
.pd-st-link.down{height:30px;}
.pd-st-link.down i{width:2px; height:100%;}
.pd-st-link.down::after{content:""; position:absolute; bottom:0; width:8px; height:8px; border-inline-end:2px solid var(--blue-soft); border-bottom:2px solid var(--blue-soft); transform:rotate(45deg);}

/* flow: the steps in order, top to bottom, each hand-off named */
.pd-st-flow{display:grid; gap:0; max-width:460px; margin-inline:auto;}
.pd-st-flow .pd-st-node{flex-direction:row; justify-content:flex-start; gap:14px; padding:12px 16px; text-align:start;}
.pd-st-flow .pd-st-node b{display:block;}
.pd-st-flow .pd-st-node small{display:block;}
.pd-st-flow .pd-st-node > b + small{margin-top:-4px;}
.pd-st-flow .pd-st-node{display:grid; grid-template-columns:50px minmax(0,1fr); grid-template-rows:auto auto; column-gap:14px; row-gap:2px; align-items:center;}
.pd-st-flow .pd-st-node .pd-st-ic{grid-row:1 / span 2;}
.pd-st-flow .pd-st-node > b:last-child{grid-row:1 / span 2;}
.pd-st-flow .pd-st-node b, .pd-st-flow .pd-st-node small{grid-column:2;}
.pd-st-flow .pd-st-node.core{padding-block:16px;}
.pd-st-step.via .pd-st-link{justify-content:flex-start; gap:14px; height:46px; padding-inline-start:37px;}
.pd-st-step.via .pd-st-link i{order:-1; width:2px; height:100%;}
.pd-st-step.via .pd-st-link span{font-size:12.5px; font-weight:700; letter-spacing:.02em; color:var(--blue); padding:3px 10px; border-radius:999px; background:var(--blue-ghost);}

/* ---------- C. capabilities (navy) ---------- */
.pd-cap-in{display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr); gap:clamp(28px,4.5vw,72px); align-items:start; margin-top:clamp(32px,4vw,52px);}
.pd-cap-in.solo{grid-template-columns:minmax(0,1fr);}
.pd-feat-l{display:grid; border-top:1px solid rgba(255,255,255,.12);}
.pd-feat-l.two{grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:clamp(28px,4vw,56px);}
.pd-feat-l li{display:grid; grid-template-columns:56px auto minmax(0,1fr); gap:18px; align-items:center; padding:24px 0; border-bottom:1px solid rgba(255,255,255,.12);}
.pd-feat-ic{display:grid; place-items:center; width:56px; height:56px; border-radius:16px; color:#cfe0ff; background:rgba(42,107,255,.2); border:1px solid rgba(143,182,255,.18); transition:background-color var(--hover) var(--ease), color var(--hover) var(--ease), border-color var(--hover) var(--ease);}
.pd-feat-l li:hover .pd-feat-ic{background:var(--blue); border-color:var(--blue); color:#fff;}
.pd-feat-ic svg{width:26px; height:26px;}
.pd-feat-l .n{font-size:13px; font-weight:800; letter-spacing:.08em; color:var(--blue-soft);}
.pd-feat-l p{font-size:clamp(17px,1.4vw,20px); font-weight:700; line-height:1.4; color:#fff;}
.pd-fit{padding:clamp(22px,2.6vw,30px); border-radius:24px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12);}
.pd-fit .pd-k{color:rgba(170,200,255,.66);}
.pd-fit-h{display:flex; align-items:center; gap:14px;}
.pd-fit-h img{width:44px; height:44px; padding:7px; border-radius:12px; background:#fff; object-fit:contain;}
.pd-fit-h span{display:block; font-size:12.5px; font-weight:700; color:var(--text-dark-2);}
.pd-fit-h b{display:block; font-size:18px; font-weight:800; color:#fff; line-height:1.3;}
.pd-fit-t{margin-top:16px; font-size:16px; line-height:1.55; color:var(--text-dark);}
.pd-fit ul{display:grid; gap:8px; margin-top:14px;}
.pd-fit li{position:relative; padding-inline-start:16px; font-size:14.5px; line-height:1.45; color:#fff;}
.pd-fit li::before{content:""; position:absolute; inset-inline-start:0; top:.55em; width:6px; height:6px; border-radius:50%; background:var(--blue-soft);}
.pd-fit .textlink{margin-top:20px; white-space:normal;}
.pd-fit .textlink i{font-style:normal; opacity:.6;}

/* ---------- D. business value (light) ---------- */
.pd-ben{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:clamp(32px,4vw,52px);}
.pd-ben li{display:flex; flex-direction:column; gap:14px; padding:4px clamp(18px,2.4vw,36px); border-inline-start:1px solid var(--line-strong);}
.pd-ben li:first-child{border-inline-start:0; padding-inline-start:0;}
.pd-ben .n{display:flex; align-items:center; gap:12px; font-size:13px; font-weight:800; line-height:1; letter-spacing:.1em; color:var(--blue);}
.pd-ben .n::after{content:""; width:28px; height:2px; border-radius:2px; background:var(--blue);}
.pd-ben p{font-size:clamp(18px,1.5vw,21px); font-weight:700; line-height:1.4; color:var(--ink);}
.pd-inval{margin-top:clamp(36px,4.5vw,56px); padding-top:clamp(24px,3vw,32px); border-top:1px solid var(--line);}
.pd-inval ul{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:12px;}
.pd-inval a{display:flex; gap:14px; align-items:flex-start; height:100%; padding:18px 20px; border-radius:18px; background:#fff; border:1px solid var(--line-2); transition:border-color var(--hover) var(--ease), box-shadow var(--hover) var(--ease);}
.pd-inval a:hover{border-color:rgba(42,107,255,.4); box-shadow:0 18px 34px -26px rgba(14,27,51,.45);}
.pd-inval-ic{display:grid; place-items:center; flex:none; width:40px; height:40px; border-radius:12px; color:var(--blue); background:var(--blue-ghost);}
.pd-inval-ic svg{width:20px; height:20px;}
.pd-inval small{display:block; font-size:12px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--faint);}
html[dir="rtl"] .pd-inval small{letter-spacing:.02em;}
.pd-inval b{display:block; margin-top:4px; font-size:16px; font-weight:700; line-height:1.4; color:var(--ink);}

/* ---------- E. related products and the closing invitation (white) ---------- */
.pd-rel{padding-block:clamp(56px,6.5vw,92px) !important;}
.pd-rel-h{display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:22px;}
.pd-rel-l{display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px;}
.pd-rel-l a{display:flex; flex-direction:column; height:100%; border-radius:18px; overflow:hidden; background:#fff; border:1px solid var(--line); transition:border-color var(--hover) var(--ease), transform var(--hover) var(--ease), box-shadow var(--hover) var(--ease);}
.pd-rel-l a:hover{border-color:rgba(42,107,255,.4); transform:translateY(-3px); box-shadow:0 22px 40px -28px rgba(14,27,51,.5);}
.pd-rel-img{display:grid; place-items:center; aspect-ratio:16/10; padding:10px; background:linear-gradient(160deg,#e9effc,#f6f8fd); overflow:hidden;}
.pd-rel-img img{width:100%; height:100%; object-fit:contain;}
.pd-rel-img.dark, .pd-rel-img.sanad{background:var(--navy);}
.pd-rel-img.dark img{mix-blend-mode:lighten;}
.pd-rel-img.sanad img{width:52%; height:auto;}
.pd-rel-b{display:flex; flex-direction:column; gap:3px; padding:14px 16px 16px;}
.pd-rel-b small{font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--faint);}
html[dir="rtl"] .pd-rel-b small{letter-spacing:.02em;}
.pd-rel-b b{font-size:15px; font-weight:800; line-height:1.3; color:var(--ink);}
.pd-rel-b span{font-size:13px; line-height:1.4; color:var(--muted);}
.pd-rel-l li.next a{border-color:var(--navy); box-shadow:0 0 0 1px var(--navy);}
.pd-rel-l li.next small{color:var(--blue);}
.pd-rel .pd-close-in{margin-top:clamp(28px,3.4vw,40px);}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:1200px){
  .pd-rel-l{grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media (max-width:1080px){
  .pd-ph .pd-hero-in{grid-template-columns:minmax(0,1fr);}
  .pd-dv{max-width:640px; width:100%; margin-inline:auto;}
  .pd-dv.device img{width:100%; margin-inline:0;}
  .pd-xp-in{grid-template-columns:minmax(0,1fr);}
  .pd-story{max-width:680px;}
  .pd-cap-in{grid-template-columns:minmax(0,1fr);}
}
@media (max-width:900px){
  .pd-feat-l.two{grid-template-columns:minmax(0,1fr);}
  .pd-ben{grid-template-columns:minmax(0,1fr); gap:0;}
  .pd-ben li, .pd-ben li:first-child{flex-direction:row; align-items:baseline; gap:18px; padding:18px 0; border-inline-start:0; border-top:1px solid var(--line-strong);}
  .pd-ben li:first-child{border-top:0;}
  .pd-ben .n{flex:none; width:64px;}
  .pd-ben .n::after{display:none;}
  .pd-rel-l{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:620px){
  .pd-ph .pd-btns .btn{white-space:normal; text-align:center;}
  .pd-dv.dark img{max-height:300px;}
  .pd-back > span{display:none;}
  .pd-switch .wrap{gap:10px;}
  .pd-seg a{padding:8px 13px;}
  .pd-seg a[aria-current="page"]::after{inset-inline:13px;}
  .pd-story{min-height:0; padding:60px 14px 18px; border-radius:22px;}
  .pd-story figcaption{top:20px; inset-inline-start:16px;}
  .pd-story.exchange .pd-st-row{grid-template-columns:minmax(0,1fr); gap:0;}
  .pd-story.exchange .pd-st-link.two{height:28px;}
  .pd-story.exchange .pd-st-link.two i{width:2px; height:100%;}
  .pd-story.exchange .pd-st-link.two::before{inset-inline-start:auto; top:2px; transform:rotate(-45deg);}
  .pd-story.exchange .pd-st-link.two::after{inset-inline-end:auto; top:auto; bottom:2px; transform:rotate(135deg);}
  html[dir="rtl"] .pd-story.exchange .pd-st-link.two::before{transform:rotate(-45deg);}
  html[dir="rtl"] .pd-story.exchange .pd-st-link.two::after{transform:rotate(135deg);}
  .pd-story.exchange .pd-st-node{flex-direction:row; justify-content:center; gap:12px;}
  .pd-st-in{grid-template-columns:repeat(2,minmax(0,1fr));}
  .pd-st-merge{margin-inline:25%;}
  .pd-feat-l li{grid-template-columns:48px minmax(0,1fr); gap:6px 16px; padding:20px 0;}
  .pd-feat-ic{grid-row:1 / span 2; width:48px; height:48px; border-radius:14px;}
  .pd-feat-l .n{grid-column:2;}
  .pd-feat-l p{grid-column:2;}
  .pd-rel-h{flex-wrap:wrap;}
  .pd-rel-l{grid-template-columns:minmax(0,1fr);}
  .pd-rel-l a{flex-direction:row;}
  .pd-rel-img{width:38%; flex:none; aspect-ratio:auto;}
}
@media (prefers-reduced-motion:reduce){
  .pd-inval a, .pd-rel-l a{transition:none;}
  .pd-rel-l a:hover{transform:none;}
}
@media print{
  .site-header{position:static !important;}
  .pd-switch{display:none;}
}
