/* ============================================================
   TMG SECURITY — PARTNERS
   Loads with tmg-home.css (tokens, header, footer) and
   tmg-services.css (shared section furniture).

   Visual language: A NETWORK.
   Solutions goes inward to a core; Industries is a map read
   across; Research is a room you enter. Partners is a graph —
   nodes, edges, and the space between organisations. Motion is
   used to show connection, never as decoration.

   Partner logos are third-party brand assets: they are never
   recoloured, cropped, distorted or filtered. Each sits on a
   neutral light plate so the original identity is preserved
   against the dark ground.

   CSS 3D + SVG only. No WebGL, no library.
   ============================================================ */

.ptn{
  --acc:var(--cyan); --acc2:var(--violet);
  --acc-soft:rgba(79,216,234,.13); --acc-line:rgba(79,216,234,.42);
  --glow:0 0 38px rgba(79,216,234,.17);
}
.ptn-grid{
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(79,216,234,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(79,216,234,.04) 1px, transparent 1px);
  background-size:62px 62px;
  transform:translate3d(0, var(--gy,0px), 0);
  mask-image:radial-gradient(ellipse 92% 66% at 50% 24%, #000 14%, transparent 74%);
  -webkit-mask-image:radial-gradient(ellipse 92% 66% at 50% 24%, #000 14%, transparent 74%);
}
.ptn > *{ position:relative; z-index:1; }
.ptn-cap{ font-family:var(--mono); font-size:8px; letter-spacing:1.7px; color:var(--fog); text-align:center; margin-top:var(--s4); }

/* ============================================================
   01 — HERO
   ============================================================ */
.phero{ padding-top:var(--s7); padding-bottom:var(--s6); }
.phero-grid{ display:grid; grid-template-columns:1.04fr .96fr; gap:var(--s6); align-items:center; }
.phero-h{
  font-family:var(--display); font-size:clamp(31px,4.4vw,55px); font-weight:700;
  line-height:1.05; letter-spacing:-1.7px; margin:18px 0 20px; text-wrap:balance;
}
.phero-h span{
  background:linear-gradient(96deg, var(--cyan), var(--violet) 62%, var(--hyper));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.phero-lead{ font-size:16.5px; color:var(--ice); line-height:1.7; max-width:610px; margin-bottom:var(--s4); }
.phero-ctas{ display:flex; gap:12px; flex-wrap:wrap; }

/* --- hero node graph --- */
.pnet-stage{ position:relative; width:100%; max-width:540px; margin:0 auto; aspect-ratio:1/1; perspective:1250px; }
.pnet-rig{
  position:absolute; inset:0; transform-style:preserve-3d;
  transform:translateZ(var(--pz,0px)) rotateX(var(--prx,10deg)) rotateY(var(--pry,-6deg));
  transition:transform .45s var(--ease);
}
.pnet-svg{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.pnet-ring{ fill:none; stroke:var(--line2); stroke-width:1; }
.pnet-ring.dash{ stroke:var(--line); stroke-dasharray:2 9; }
.pnet-edge{
  stroke:rgba(140,165,225,.22); stroke-width:1; fill:none;
  stroke-dasharray:var(--len,200); stroke-dashoffset:var(--len,200);
  transition:stroke-dashoffset 1.1s var(--ease), stroke .45s, stroke-width .45s;
}
.phero.on .pnet-edge{ stroke-dashoffset:0; }
.pnet-edge.lit{ stroke:var(--acc); stroke-width:1.6; }

.pnet-core{
  position:absolute; top:50%; left:50%; width:132px; height:132px;
  transform:translate(-50%,-50%) translateZ(34px); border-radius:50%;
  display:grid; place-items:center; text-align:center;
  background:radial-gradient(circle at 44% 36%, rgba(79,216,234,.26), rgba(6,9,17,.97) 70%);
  border:1px solid rgba(79,216,234,.5);
  box-shadow:0 0 56px rgba(79,216,234,.2), inset 0 0 30px rgba(79,216,234,.12);
}
.pnet-core b{ display:block; font-family:var(--display); font-size:13px; font-weight:700; color:var(--white); line-height:1.15; }
.pnet-core span{ display:block; font-family:var(--mono); font-size:6.5px; letter-spacing:2px; color:var(--acc); margin-top:5px; }

/* Each node carries a partner logo plate. */
.pnet-node{
  position:absolute; left:var(--x); top:var(--y);
  transform:translate(-50%,-50%) translateZ(var(--nz,0px));
  width:58px; height:58px; border-radius:14px; padding:7px;
  background:#fff; border:1px solid var(--line2); overflow:hidden;
  display:grid; place-items:center;
  transition:transform .4s var(--ease), border-color .4s, box-shadow .4s;
}
.pnet-node img{ width:100%; height:100%; object-fit:contain; display:block; }
.pnet-node.lit{ border-color:var(--acc); box-shadow:var(--glow); }
@media (max-width:1000px){
  .phero-grid{ grid-template-columns:1fr; gap:var(--s5); }
  .pnet-stage{ max-width:400px; order:-1; }
  .pnet-node{ width:46px; height:46px; padding:5px; border-radius:11px; }
  .pnet-core{ width:108px; height:108px; }
}
@media (max-width:430px){
  .pnet-stage{ max-width:300px; }
  .pnet-node{ width:38px; height:38px; padding:4px; border-radius:9px; }
  .pnet-core{ width:88px; height:88px; }
  .pnet-core b{ font-size:11px; } .pnet-core span{ font-size:5.5px; letter-spacing:1.4px; }
}

/* ============================================================
   02 — ECOSYSTEM INTRO STRIP
   ============================================================ */
.pstrip{ overflow:hidden; border-block:1px solid var(--line); padding:20px 0; }
.pstrip-track{ display:flex; align-items:center; gap:46px; width:max-content; transform:translate3d(var(--sx,0px),0,0); }
.pstrip-track span{
  font-family:var(--mono); font-size:10px; letter-spacing:2.6px; color:var(--fog); white-space:nowrap;
}
.pstrip-track i{ width:5px; height:5px; border-radius:50%; background:var(--acc); opacity:.5; flex:none; }

/* ============================================================
   03 — PARTNER CARDS
   ============================================================ */
.plog-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.plog{
  position:relative; isolation:isolate; display:flex; flex-direction:column; overflow:hidden;
  border:1px solid var(--line); border-radius:var(--r-lg);
  background:linear-gradient(180deg, rgba(13,20,36,.72), rgba(6,9,17,.9));
  padding:24px 24px 26px; transform-style:preserve-3d;
  transition:transform .35s var(--ease), border-color .35s, box-shadow .35s, opacity .6s, filter .6s;
  opacity:0; transform:translateY(24px) scale(.985); filter:blur(5px);
}
.plog.in{ opacity:1; transform:none; filter:none; }
.plog:hover, .plog:focus-within{ border-color:var(--acc-line); box-shadow:0 22px 58px rgba(0,0,0,.45), var(--glow); }
.plog::before{
  content:''; position:absolute; inset:0; z-index:-1; opacity:var(--pl,0);
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%), rgba(79,216,234,.12), transparent 66%);
  transition:opacity .35s;
}
.plog-top{ display:flex; align-items:center; gap:12px; margin-bottom:18px; }
.plog-n{ font-family:var(--mono); font-size:10px; letter-spacing:2px; color:var(--acc); }
.plog-badge{
  margin-left:auto; font-family:var(--mono); font-size:7px; letter-spacing:1.3px; color:var(--fog);
  border:1px solid var(--line2); border-radius:7px; padding:5px 8px; text-align:right; line-height:1.4;
}
/* Neutral plate: logos keep their own colours and are never filtered. */
.plog-mark{
  height:96px; border-radius:var(--r-md); background:#fff;
  border:1px solid var(--line2); display:grid; place-items:center;
  padding:16px 20px; margin-bottom:18px; overflow:hidden;
}
.plog-mark img{ max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; display:block; }
/* The EuroAmerican asset is a white wordmark — it needs a dark plate. */
.plog-mark.dark{ background:linear-gradient(180deg,#111a2e,#080c18); }
.plog-t{ font-family:var(--display); font-size:17.5px; font-weight:600; letter-spacing:-.3px; line-height:1.3; margin-bottom:9px; }
.plog-d{ font-size:13px; color:var(--fog); line-height:1.7; flex:1; margin-bottom:16px; }
.plog-go{
  display:inline-flex; align-items:center; gap:9px; min-height:44px; align-self:flex-start;
  font-family:var(--mono); font-size:9.5px; letter-spacing:1.6px; color:var(--acc);
  border-top:1px solid var(--line); padding-top:14px; width:100%;
}
.plog-go span{ transition:transform .3s var(--ease); }
.plog:hover .plog-go span{ transform:translateX(4px); }
/* Cards without a verified destination still read as complete, not broken. */
.plog-go.static{ color:var(--fog); }
@media (max-width:1050px){ .plog-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:720px){ .plog-grid{ grid-template-columns:1fr; } }

/* ============================================================
   04 — CONNECTED ECOSYSTEM
   Desktop: a spatial graph. Mobile: an explicit vertical list —
   the desktop layout is not forced onto small screens.
   ============================================================ */
.peco-stage{ position:relative; width:100%; max-width:720px; margin:0 auto; aspect-ratio:1/1; perspective:1400px; }
.peco-world{
  position:absolute; inset:0; transform-style:preserve-3d;
  transform:rotateX(var(--erx,6deg)) rotateY(var(--ery,0deg)); transition:transform .5s var(--ease);
}
.peco-svg{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.peco-edge{
  stroke:rgba(140,165,225,.18); stroke-width:1; fill:none;
  stroke-dasharray:var(--len,260); stroke-dashoffset:var(--len,260);
  transition:stroke-dashoffset .9s var(--ease), stroke .35s, stroke-width .35s;
}
.peco-stage.on .peco-edge{ stroke-dashoffset:0; }
.peco-edge.lit{ stroke:var(--acc); stroke-width:1.8; }
.peco-core{
  position:absolute; top:50%; left:50%; width:150px; height:150px;
  transform:translate(-50%,-50%) translateZ(40px); border-radius:50%;
  display:grid; place-items:center; text-align:center;
  background:radial-gradient(circle at 44% 36%, rgba(79,216,234,.24), rgba(6,9,17,.97) 70%);
  border:1px solid rgba(79,216,234,.5); box-shadow:0 0 60px rgba(79,216,234,.2);
}
.peco-core b{ display:block; font-family:var(--display); font-size:15px; font-weight:700; color:var(--white); line-height:1.15; }
.peco-core span{ display:block; font-family:var(--mono); font-size:6.5px; letter-spacing:2px; color:var(--acc); margin-top:5px; }
.peco-node{
  position:absolute; left:var(--x); top:var(--y);
  transform:translate(-50%,-50%) translateZ(var(--ez,0px)) scale(var(--es,1));
  width:74px; height:74px; border-radius:16px; padding:9px; cursor:pointer;
  background:#fff; border:1px solid var(--line2); display:grid; place-items:center;
  transition:transform .42s var(--ease), border-color .35s, box-shadow .35s;
}
.peco-node.dark{ background:linear-gradient(180deg,#111a2e,#080c18); }
.peco-node img{ width:100%; height:100%; object-fit:contain; display:block; }
.peco-node[aria-pressed="true"], .peco-node:hover{
  border-color:var(--acc); box-shadow:0 0 30px rgba(79,216,234,.4);
  transform:translate(-50%,-50%) translateZ(58px) scale(1.14);
}
/* Info card appears next to the graph, not as a hover-only tooltip. */
.peco-info{
  margin-top:var(--s4); border:1px solid var(--line); border-radius:var(--r-lg);
  background:var(--deep); padding:22px 24px; min-height:118px; max-width:720px; margin-inline:auto;
}
.peco-info .k{ font-family:var(--mono); font-size:8px; letter-spacing:1.8px; color:var(--acc); margin-bottom:9px; }
.peco-info h3{ font-family:var(--display); font-size:18px; font-weight:600; margin-bottom:7px; }
.peco-info p{ font-size:13px; color:var(--fog); line-height:1.7; }

.peco-mobile{ display:none; }
@media (max-width:900px){
  .peco-stage{ display:none; }
  .peco-mobile{ display:flex; flex-direction:column; gap:8px; }
  .peco-row{
    display:flex; align-items:center; gap:14px; padding:13px 15px;
    border:1px solid var(--line); border-radius:var(--r-md); background:var(--deep);
  }
  .peco-row .m{ width:52px; height:52px; flex:none; border-radius:11px; background:#fff; padding:6px; display:grid; place-items:center; }
  .peco-row .m.dark{ background:linear-gradient(180deg,#111a2e,#080c18); }
  .peco-row .m img{ width:100%; height:100%; object-fit:contain; }
  .peco-row b{ display:block; font-family:var(--display); font-size:14px; font-weight:600; }
  .peco-row span{ display:block; font-family:var(--mono); font-size:7.5px; letter-spacing:1.2px; color:var(--fog); margin-top:3px; }
  .peco-info{ margin-top:var(--s4); }
}

/* ============================================================
   05 — CATEGORIES  +  08 — PARTNERSHIP TYPES
   ============================================================ */
.pcat-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:2px; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; }
.pcat{ position:relative; padding:30px 24px 34px; background:var(--deep); transition:background .35s; }
.pcat:hover{ background:var(--panel); }
.pcat::before{
  content:''; position:absolute; left:0; right:0; top:0; height:2px;
  background:linear-gradient(90deg, var(--cyan), var(--violet));
  transform:scaleX(0); transform-origin:left; transition:transform .5s var(--ease);
}
.pcat:hover::before{ transform:scaleX(1); }
.pcat-n{ font-family:var(--mono); font-size:10px; letter-spacing:2px; color:var(--acc); }
.pcat-k{ font-family:var(--display); font-size:18px; font-weight:700; letter-spacing:-.3px; margin:14px 0 10px; }
.pcat-d{ font-size:13.5px; color:var(--fog); line-height:1.7; }
@media (max-width:900px){ .pcat-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .pcat-grid{ grid-template-columns:1fr; } }

.ptype-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.ptype{
  position:relative; isolation:isolate; overflow:hidden;
  padding:30px 28px 32px; border-radius:var(--r-lg);
  border:1px solid var(--line); background:var(--deep);
  transform-style:preserve-3d; transition:transform .35s var(--ease), border-color .35s;
}
.ptype::before{
  content:''; position:absolute; inset:0; z-index:-1; opacity:var(--pl,0);
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%), rgba(124,92,250,.13), transparent 66%);
  transition:opacity .35s;
}
.ptype:hover{ border-color:var(--acc-line); }
.ptype-head{ display:flex; align-items:center; gap:13px; margin-bottom:16px; }
.ptype-n{ font-family:var(--mono); font-size:10px; letter-spacing:2px; color:var(--acc); }
.ptype-ic{
  margin-left:auto; width:40px; height:40px; border-radius:11px; display:grid; place-items:center;
  border:1px solid var(--line2); background:var(--panel); color:var(--fog);
  transition:color .35s, border-color .35s, background .35s, transform .35s var(--ease);
}
.ptype:hover .ptype-ic{ color:var(--acc); border-color:var(--acc-line); background:var(--acc-soft); transform:translateY(-2px); }
.ptype-k{ font-family:var(--display); font-size:19px; font-weight:700; letter-spacing:-.4px; margin-bottom:10px; }
.ptype-d{ font-size:13.5px; color:var(--fog); line-height:1.72; }
.ptype-go{ display:inline-flex; align-items:center; gap:8px; margin-top:15px; font-family:var(--mono); font-size:9px; letter-spacing:1.5px; color:var(--acc); }
.ptype-go span{ transition:transform .3s var(--ease); }
.ptype:hover .ptype-go span{ transform:translateX(4px); }
@media (max-width:820px){ .ptype-grid{ grid-template-columns:1fr; } }

/* ============================================================
   06 — WHY / VALUE CHAIN
   ============================================================ */
.pchain{ display:grid; grid-template-columns:repeat(5,1fr); gap:0; position:relative; }
.pchain::before{ content:''; position:absolute; left:8%; right:8%; top:31px; height:1px; background:var(--line2); }
.pchain-fill{
  position:absolute; left:8%; top:31px; height:1px; width:var(--cp,0%); max-width:84%;
  background:linear-gradient(90deg,var(--cyan),var(--violet)); transition:width 1.3s var(--ease);
}
.pchain-step{ position:relative; text-align:center; padding:0 10px; }
.pchain-dot{
  position:relative; z-index:2; width:14px; height:14px; border-radius:50%; margin:25px auto 0;
  background:var(--void); border:1px solid var(--line2);
  transition:border-color .5s, background .5s, box-shadow .5s;
}
.pchain-step.on .pchain-dot{ border-color:var(--acc); background:var(--acc); box-shadow:0 0 16px var(--acc-soft); }
.pchain-k{ font-family:var(--mono); font-size:8.5px; letter-spacing:2px; color:var(--fog); }
.pchain-step.on .pchain-k{ color:var(--acc); }
.pchain-t{ font-family:var(--display); font-size:15px; font-weight:600; margin-top:15px; }
@media (max-width:820px){
  .pchain{ grid-template-columns:1fr; }
  .pchain::before{ left:7px; right:auto; top:8px; bottom:8px; width:1px; height:auto; }
  .pchain-fill{ left:7px; top:8px; width:1px !important; height:var(--cp,0%); max-width:none;
                background:linear-gradient(180deg,var(--cyan),var(--violet)); transition:height 1.3s var(--ease); }
  .pchain-step{ text-align:left; padding:0 0 22px 32px; }
  .pchain-dot{ position:absolute; left:0; top:3px; margin:0; }
  .pchain-t{ margin-top:3px; }
}

/* ============================================================
   07 — GLOBAL ECOSYSTEM
   ============================================================ */
.pglobe-wrap{ display:grid; grid-template-columns:1fr 1fr; gap:var(--s6); align-items:center; }
.pglobe{ position:relative; width:100%; max-width:460px; margin:0 auto; aspect-ratio:1/1; }
.pglobe svg{ width:100%; height:auto; display:block; overflow:visible; }
.pglobe-mer{ fill:none; stroke:var(--line2); stroke-width:1; }
.pglobe-mer.faint{ stroke:var(--line); }
.pglobe-arc{
  fill:none; stroke:var(--acc); stroke-width:1.3; stroke-opacity:.55;
  stroke-dasharray:var(--len,200); stroke-dashoffset:var(--len,200);
  transition:stroke-dashoffset 1.4s var(--ease);
}
.pglobe.on .pglobe-arc{ stroke-dashoffset:0; }
.pglobe-pt{ fill:var(--acc); }
.pglobe-spin{ transform-origin:50% 50%; animation:pglobeSpin 60s linear infinite; }
@keyframes pglobeSpin{ to{ transform:rotate(360deg); } }
.pglobe-tags{ display:flex; flex-direction:column; gap:8px; }
.pglobe-tag{
  display:flex; align-items:center; gap:12px; min-height:50px; padding:13px 16px;
  border:1px solid var(--line); border-radius:var(--r-md); background:var(--deep);
  font-family:var(--mono); font-size:9.5px; letter-spacing:1.6px; color:var(--ice);
  transition:border-color .3s, background .3s, transform .3s var(--ease);
}
.pglobe-tag:hover{ border-color:var(--acc-line); background:var(--panel); transform:translateX(3px); }
.pglobe-tag i{ width:6px; height:6px; border-radius:50%; background:var(--acc); flex:none; box-shadow:0 0 8px var(--acc); }
@media (max-width:900px){ .pglobe-wrap{ grid-template-columns:1fr; } .pglobe{ max-width:320px; } }

/* ============================================================
   09 — PARTNER WITH US
   ============================================================ */
.pwith{
  position:relative; overflow:hidden;
  border:1px solid var(--line); border-radius:var(--r-xl); padding:var(--s5);
  background:linear-gradient(150deg, rgba(18,27,48,.6), rgba(6,9,17,.88));
}
.pwith::before{
  content:''; position:absolute; top:-40%; right:-12%; width:54%; aspect-ratio:1;
  background:radial-gradient(circle, rgba(124,92,250,.15), transparent 66%); pointer-events:none;
}
.pwith-h{ font-family:var(--display); font-size:clamp(23px,3vw,33px); font-weight:700; letter-spacing:-.9px; line-height:1.16; margin:14px 0 14px; }
.pwith-p{ font-size:14.5px; color:var(--ice); line-height:1.75; margin-bottom:16px; max-width:760px; }
.pwith-areas{ display:flex; flex-wrap:wrap; gap:7px; margin-bottom:var(--s4); }
.pwith-areas li{
  list-style:none; font-family:var(--mono); font-size:8px; letter-spacing:1.2px; color:var(--fog);
  border:1px solid var(--line2); border-radius:8px; padding:6px 10px;
}
.pwith-ctas{ display:flex; gap:12px; flex-wrap:wrap; position:relative; z-index:1; }
/* Magnetic label swap — the alternate text is in the DOM, so it is
   announced normally and does not depend on hover to be reachable. */
.pmag{ position:relative; overflow:hidden; min-width:210px; }
.pmag .a, .pmag .b{ display:block; transition:transform .35s var(--ease), opacity .35s; }
.pmag .b{ position:absolute; inset:0; display:grid; place-items:center; transform:translateY(105%); opacity:0; }
.pmag:hover .a, .pmag:focus-visible .a{ transform:translateY(-105%); opacity:0; }
.pmag:hover .b, .pmag:focus-visible .b{ transform:translateY(0); opacity:1; }
@media (hover:none){ .pmag .a{ transform:none; opacity:1; } .pmag .b{ display:none; } }
.pwith-note{ font-family:var(--mono); font-size:8.5px; letter-spacing:1.3px; color:var(--fog); line-height:1.8; margin-top:var(--s4); }

/* 3-step flow */
.pflow{ display:grid; grid-template-columns:repeat(3,1fr); gap:0; position:relative; margin-top:var(--s5); }
.pflow::before{ content:''; position:absolute; left:14%; right:14%; top:29px; height:1px; background:var(--line2); }
.pflow-fill{
  position:absolute; left:14%; top:29px; height:1px; width:var(--fp,0%); max-width:72%;
  background:linear-gradient(90deg,var(--cyan),var(--violet)); transition:width 1.2s var(--ease);
}
.pflow-step{ position:relative; text-align:center; padding:0 14px; }
.pflow-dot{
  position:relative; z-index:2; width:13px; height:13px; border-radius:50%; margin:23px auto 0;
  background:var(--void); border:1px solid var(--line2); transition:border-color .5s, background .5s;
}
.pflow-step.on .pflow-dot{ border-color:var(--acc); background:var(--acc); }
.pflow-n{ font-family:var(--mono); font-size:9px; letter-spacing:2px; color:var(--fog); }
.pflow-step.on .pflow-n{ color:var(--acc); }
.pflow-t{ font-size:13.5px; color:var(--ice); line-height:1.65; margin-top:14px; }
@media (max-width:720px){
  .pflow{ grid-template-columns:1fr; }
  .pflow::before{ left:6px; right:auto; top:8px; bottom:8px; width:1px; height:auto; }
  .pflow-fill{ left:6px; top:8px; width:1px !important; height:var(--fp,0%); max-width:none;
               background:linear-gradient(180deg,var(--cyan),var(--violet)); transition:height 1.2s var(--ease); }
  .pflow-step{ text-align:left; padding:0 0 20px 30px; }
  .pflow-dot{ position:absolute; left:0; top:3px; margin:0; }
  .pflow-t{ margin-top:3px; }
  .pwith-ctas .cta-btn, .pwith-ctas .cta-ghost, .pmag{ width:100%; }
}

/* ============================================================
   REVEALS + REDUCED MOTION
   ============================================================ */
.ptn [data-rv]{ opacity:0; transform:translateY(20px); transition:opacity .65s var(--ease), transform .65s var(--ease); }
.ptn [data-rv].in{ opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce){
  .ptn *, .ptn *::before, .ptn *::after{ animation:none !important; transition-duration:.01ms !important; }
  .ptn [data-rv]{ opacity:1; transform:none; }
  .ptn-grid{ transform:none; }
  .pnet-edge, .peco-edge, .pglobe-arc{ stroke-dashoffset:0; }
  .plog{ opacity:1; transform:none; filter:none; }
  .pstrip-track{ transform:none; }
  .pglobe-spin{ animation:none; }
}

/* 44px minimum on every control this page owns. */
.ptn .cta-btn, .ptn .cta-ghost{ min-height:44px; display:inline-flex; align-items:center; justify-content:center; }
.ptn .peco-node, .ptn .pglobe-tag{ min-height:44px; }