/* Website platforms page (custom page website-platforms). Everything is scoped under .pcx so it cannot touch other pages. */
.pcx .pc-ladder{background:linear-gradient(180deg,#f4faff,#fff);border:2px solid var(--line);border-radius:var(--radius-lg);padding:1.6rem 2rem 1.2rem;margin:1.6rem 0 2rem}
.pcx .pc-ladder .track{height:6px;border-radius:6px;background:linear-gradient(90deg,var(--cyan),var(--blue));position:relative;margin:1.2rem 1.5rem 0}
.pcx .pc-stop{position:absolute;top:-10px;transform:translateX(-50%);text-align:center;width:7rem}
.pcx .pc-stop i{display:block;width:26px;height:26px;border-radius:50%;background:#fff;border:5px solid var(--blue);margin:0 auto .5rem;box-shadow:var(--side-glow)}
.pcx .pc-stop b{font:800 1.3rem Poppins,sans-serif;display:block;color:var(--navy)}
.pcx .pc-stop small{display:block;color:var(--muted);font-size:.85rem;line-height:1.3}
.pcx .pc-stop.q i{border-style:dashed}
.pcx .pc-stop.q b{color:var(--cyan-text)}
.pcx .pc-ladder .sp{height:5.8rem}
.pcx .pc-ladder p{margin:.2rem 0 0;color:var(--muted);font-size:.9rem;text-align:center}
.pcx .pc-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:1.4rem;margin:1.2rem 0 2rem}
.pcx .pc-card{grid-column:span 2;background:#fff;border:2px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow-sm)}
.pcx .pc-card:nth-child(n+4){grid-column:span 3}
.pcx .pc-pic{background:linear-gradient(180deg,#eaf5fd,#f6fafe);padding:1.1rem 1.1rem .8rem}
.pcx .pc-body{padding:1.2rem 1.4rem 1.4rem;display:flex;flex-direction:column;gap:.7rem;flex:1}
.pcx .pc-body h3{margin:0;font-size:1.3rem}
.pcx .pc-body p{margin:0;font-size:.98rem}
.pcx .pc-tag{font:700 .75rem Poppins,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--cyan-text)}
.pcx .pc-facts{list-style:none;margin:.2rem 0 0;padding:0;border-top:1px solid var(--line)}
.pcx .pc-facts li{display:flex;justify-content:space-between;gap:1rem;padding:.5rem 0;border-bottom:1px solid var(--line);font-size:.92rem}
.pcx .pc-facts li span:first-child{color:var(--muted)}
.pcx .pc-facts li span:last-child{font-weight:700;text-align:right}
.pcx .pc-price{margin-top:auto;font:800 1.45rem Poppins,sans-serif;color:var(--navy)}
.pcx .pc-price small{font:400 .85rem 'Open Sans';color:var(--muted)}
.pcx .pc-links{margin-top:0;display:flex;gap:1rem;align-items:center;flex-wrap:wrap;padding-top:.3rem}
.pcx .pc-links a:not(.btn){font:700 .92rem Poppins,sans-serif;color:var(--cyan-text)}
.pcx .br{background:#fff;border-radius:.7rem;border:1px solid #c9d6e2;box-shadow:0 .5rem 1.2rem rgba(17,24,39,.10);overflow:hidden;position:relative}
.pcx .br .bar{display:flex;align-items:center;gap:.35rem;background:#e8eef4;padding:.45rem .6rem}
.pcx .br .bar u{width:.55rem;height:.55rem;border-radius:50%;background:#b8c6d3}
.pcx .br .bar em{flex:1;margin-left:.5rem;background:#fff;border-radius:99px;padding:.1rem .7rem;font:400 .7rem 'Open Sans';color:var(--muted);font-style:normal}
.pcx .br .page{padding:.9rem;height:9.5rem;position:relative}
.pcx .ln{height:.5rem;border-radius:4px;background:#d9e3ec;margin:.45rem 0}
.pcx .ln.h{height:.8rem;background:var(--navy)}
.pcx .ln.w60{width:60%}
.pcx .ln.w80{width:80%}
.pcx .blk{background:#dbeaf5;border-radius:.4rem}
.pcx .mk{position:absolute;width:1.5rem;height:1.5rem;border-radius:50%;background:var(--cyan);color:var(--navy);font:700 .75rem/1.5rem Poppins;text-align:center;box-shadow:0 0 0 3px rgba(55,189,242,.3)}
.pcx .sel{outline:2px solid var(--cyan);outline-offset:2px;border-radius:4px}
.pcx .cap{font-size:.8rem;color:var(--muted);margin-top:.7rem;min-height:2.6rem;display:flex;flex-direction:column;gap:.15rem}
.pcx .cap b{color:var(--cyan-text)}
.pcx .code{font:500 .68rem/1.5 ui-monospace,Consolas,monospace;color:#0f4c75;background:#f3f8fc;border-radius:.4rem;padding:.6rem;height:100%}
.pcx .code i{color:#9a5b00;font-style:normal}
.pcx .code s{color:#1b7f4b;text-decoration:none}
.pcx .flow{display:flex;align-items:center;justify-content:space-between;height:100%;gap:.3rem}
.pcx .node{flex:1;text-align:center;font:600 .68rem Poppins;color:var(--navy);background:#dbeaf5;border-radius:.5rem;padding:.7rem .2rem}
.pcx .node.dk{background:var(--navy);color:#fff}
.pcx .arr{color:var(--cyan-dark);font-weight:700}
.pcx .sj{display:grid;grid-template-columns:3.2rem 1fr;gap:.6rem;height:100%}
.pcx .sj .pal{display:grid;gap:.35rem;align-content:start}
.pcx .sj .pal div{height:1.4rem;border-radius:.3rem;background:#dbeaf5}
.pcx .plug{display:grid;grid-template-columns:repeat(4,1fr);gap:.4rem;margin-top:.5rem}
.pcx .plug div{height:2.2rem;border-radius:.45rem;background:#dbeaf5}
.pcx .plug div:nth-child(3n){background:var(--cyan)}
.pcx .pc-table{width:100%;border-collapse:separate;border-spacing:0;border:2px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;font-size:.95rem;margin:1rem 0}
.pcx .pc-table th,.pcx .pc-table td{padding:.85rem 1rem;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.pcx .pc-table thead th{background:var(--navy);color:#fff;font:700 .9rem Poppins}
.pcx .pc-table tbody th{background:#eef6fc;font:700 .88rem Poppins;color:var(--navy);width:15%}
.pcx .pc-table td.big{font:800 1.1rem Poppins;color:var(--navy)}
.pcx .pc-slot{display:inline-block;border:1px dashed var(--cyan-dark);color:var(--cyan-text);border-radius:99px;padding:.1rem .7rem;font-size:.8rem}
.pcx .pc-pick{display:flex;flex-wrap:wrap;gap:.6rem;margin:.8rem 0 2rem}
.pcx .pc-pick a{background:#e6f4fc;color:var(--blue);font:700 .9rem Poppins;border-radius:99px;padding:.55rem 1.1rem;text-decoration:none}
.pcx .pc-links .btn{padding:.6rem 1.2rem;font-size:.9rem}
.pcx .pc-flag{background:#fff7e0;border:1px dashed #d9a400;color:#7a5a00;font:600 .8rem Poppins;padding:.5rem 1rem;text-align:center}
@media(max-width:60rem){.pcx .pc-grid{grid-template-columns:1fr}
.pcx .pc-card,.pcx .pc-card:nth-child(n+4){grid-column:auto}
.pcx .pc-stop small{display:none}
.pcx .pc-ladder .sp{height:3rem}
}
.pcx .rc{background:linear-gradient(180deg,#f4faff,#fff);border:2px solid var(--line);border-radius:var(--radius-lg);padding:1.4rem 1.8rem 1rem;margin:1.6rem 0 2rem}
.pcx .rc-row{display:grid;grid-template-columns:9.5rem 1fr;align-items:center;gap:1rem;padding:.55rem 0}
.pcx .rc-row .nm{font:700 .95rem Poppins;color:var(--navy)}
.pcx .rc-row .nm small{display:block;font:400 .78rem 'Open Sans';color:var(--muted)}
.pcx .rc-track{position:relative;height:2.3rem;background-image:repeating-linear-gradient(90deg,var(--line) 0,var(--line) 1px,transparent 1px,transparent 10%);background-size:100% 100%}
.pcx .rc-bar{position:absolute;top:.3rem;height:1.7rem;border-radius:99px;background:linear-gradient(90deg,var(--cyan),var(--blue));color:#fff;font:700 .78rem/1.7rem Poppins;padding:0 .8rem;white-space:nowrap;box-shadow:var(--shadow-sm)}
.pcx .rc-lab{position:absolute;top:.3rem;font:700 .85rem/1.7rem Poppins;color:var(--navy);white-space:nowrap}
.pcx .rc-bar.dash{background:repeating-linear-gradient(135deg,#e6f4fc 0 10px,#d3eaf8 10px 20px);color:var(--blue);border:2px dashed var(--cyan-dark);box-shadow:none}
.pcx .rc-bar.open{background:linear-gradient(90deg,var(--blue),var(--navy) 60%,rgba(18,23,42,0))}
.pcx .rc-axis{display:grid;grid-template-columns:9.5rem 1fr;gap:1rem}
.pcx .rc-axis div:last-child{display:flex;justify-content:space-between;font:600 .75rem Poppins;color:var(--muted);padding-top:.3rem;border-top:1px solid var(--line)}
.pcx .rc-note{margin:.6rem 0 0;color:var(--muted);font-size:.88rem;text-align:center}
.pcx .dd{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center;padding:2rem 0;border-top:1px solid var(--line)}
.pcx .dd:nth-of-type(even) .dd-pic{order:2}
.pcx .dd-pic{background:linear-gradient(180deg,#eaf5fd,#f6fafe);border-radius:var(--radius-lg);padding:1.4rem}
.pcx .dd-pic .page{height:12rem}
.pcx .dd h3{font-size:1.5rem;margin:.2rem 0 .5rem}
.pcx .dd .two{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1rem 0}
.pcx .dd .two h4{margin:0 0 .3rem;font:700 .82rem Poppins;text-transform:uppercase;letter-spacing:.06em;color:var(--cyan-text)}
.pcx .dd .two ul{margin:0;padding:0;list-style:none;font-size:.92rem}
.pcx .dd .two li{padding:.2rem 0 .2rem 1.3rem;position:relative}
.pcx .dd .two li:before{content:"";position:absolute;left:0;top:.62rem;width:.6rem;height:.6rem;border-radius:50%;background:var(--cyan)}
.pcx .dd .two .no li:before{background:#e0a100}
.pcx .dd .need{font-size:.9rem;color:var(--muted);margin:0}
.pcx .dd .need b{color:var(--navy)}
.pcx .pc-grid.o4 .pc-card,.pcx .pc-grid.o4 .pc-card:nth-child(n+4){grid-column:span 3}
.pcx .shp{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-bottom:.4rem}
.pcx .shp div{height:3.6rem;border-radius:.4rem;background:#dbeaf5;border-bottom:.5rem solid var(--cyan)}
.pcx .cartb{position:absolute;right:.8rem;top:.7rem;background:var(--navy);color:#fff;font:700 .7rem Poppins;border-radius:99px;padding:.15rem .6rem}
.pcx .shop{display:flex;gap:1.4rem;align-items:center;justify-content:space-between;flex-wrap:wrap;background:#eef6fc;border:2px solid var(--line);border-left:6px solid var(--cyan);border-radius:var(--radius-lg);padding:1.2rem 1.6rem;margin:0 0 2rem}
.pcx .shop h3{margin:0 0 .2rem;font-size:1.25rem}
.pcx .shop p{margin:0}
.pcx .others{display:grid;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));gap:1rem;margin:1rem 0}
.pcx .others div{background:#fff;border:2px solid var(--line);border-radius:var(--radius);padding:1rem 1.1rem;font:700 1.05rem Poppins;color:var(--navy);text-align:center}
.pcx .others div small{display:block;font:400 .8rem 'Open Sans';color:var(--muted);margin-top:.2rem}
.pcx .paths{display:grid;gap:1.6rem;margin:1.2rem 0 2rem}
.pcx .path{border:2px solid var(--line);border-radius:var(--radius-lg);padding:1.4rem 1.6rem;background:#fff;box-shadow:var(--shadow-sm)}
.pcx .path h3{margin:0 0 .2rem;font-size:1.3rem}
.pcx .path>p{margin:0 0 1.2rem}
.pcx .steps{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:.8rem;position:relative}
.pcx .steps:before{content:"";position:absolute;left:5%;right:5%;top:1.2rem;height:3px;background:linear-gradient(90deg,var(--cyan),var(--blue));z-index:0}
.pcx .stp{position:relative;z-index:1;text-align:center;font-size:.88rem;line-height:1.35}
.pcx .stp i{display:block;width:2.4rem;height:2.4rem;border-radius:50%;background:#fff;border:3px solid var(--blue);color:var(--navy);font:800 1rem/2rem Poppins;font-style:normal;margin:0 auto .6rem;box-shadow:var(--side-glow)}
.pcx .stp b{display:block;font:700 .92rem Poppins;color:var(--navy);margin-bottom:.15rem}
.pcx .who{display:inline-block;font:700 .75rem Poppins;letter-spacing:.06em;text-transform:uppercase;background:#e6f4fc;color:var(--blue);border-radius:99px;padding:.25rem .8rem;margin-bottom:.6rem}
.pcx .fig{display:flex;gap:.5rem;align-items:center;justify-content:center;background:#fff;border:1px dashed var(--cyan-dark);border-radius:.6rem;padding:.4rem .6rem;font:600 .72rem Poppins;color:var(--cyan-text);margin-top:.5rem}
.pcx .pc-table{font-size:.9rem}
.pcx .pc-table th,.pcx .pc-table td{padding:.75rem .8rem}
.pcx .pc-table td.big{font-size:1rem}
.pcx .fld{height:1.1rem;border:1px solid #c9d6e2;border-radius:.3rem;margin:.45rem 0;background:#fff}
.pcx .chip{display:inline-block;background:var(--cyan);color:var(--navy);font:700 .65rem Poppins;border-radius:99px;padding:.2rem .7rem;margin:.15rem .25rem 0 0}
.pcx .mainpic{display:block;width:100%;border:0;background:none;padding:0;cursor:zoom-in;position:relative;text-align:left;font:inherit}
.pcx .mainpic .zoomchip{position:absolute;right:.6rem;bottom:.6rem;background:var(--navy);color:#fff;font:700 .72rem Poppins;border-radius:99px;padding:.25rem .8rem}
.pcx .thumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem;margin-top:.7rem}
.pcx .th{border:2px solid transparent;border-radius:.6rem;background:none;padding:0;cursor:zoom-in;overflow:hidden}
.pcx .th:hover,.pcx .th:focus-visible,.pcx .mainpic:focus-visible{outline:3px solid var(--cyan);outline-offset:2px}
.pcx .th .br{zoom:.36;pointer-events:none;box-shadow:none}
.pcx .pc-why{background:#e6f4fc;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:.9rem 1.4rem;font-size:.95rem;color:var(--navy)}
.pcx .pc-why b{display:block;font:700 .72rem Poppins;letter-spacing:.08em;text-transform:uppercase;color:var(--cyan-text);margin-bottom:.15rem}
.pcx .lb{position:fixed;inset:0;background:rgba(18,23,42,.93);display:none;align-items:center;justify-content:center;z-index:99999;padding:1rem}
.pcx .lb.on{display:flex}
.pcx .lb-in{max-width:48rem;width:100%;text-align:center;color:#fff}
.pcx .lb-frame{zoom:1.75;width:26rem;max-width:100%;margin:0 auto;text-align:left}
.pcx .lb-frame .page{height:13rem}
.pcx .lb-cap{margin:1.6rem 0 .8rem;font:600 1.05rem Poppins}
.pcx .lb-nav{display:flex;gap:.8rem;justify-content:center;align-items:center}
.pcx .lb-nav button{border:0;border-radius:99px;background:#fff;color:var(--navy);font:700 .9rem Poppins;padding:.55rem 1.2rem;cursor:pointer}
.pcx .lb-count{font:600 .85rem Poppins;color:#cfe3f1;min-width:4rem}
.pcx .lb-x{position:absolute;right:1.2rem;top:1rem;border:0;background:#fff;color:var(--navy);width:2.6rem;height:2.6rem;border-radius:50%;font:700 1.2rem Poppins;cursor:pointer}
.pcx .pc-note-flag{background:#fff7e0;border:1px dashed #d9a400;border-radius:.5rem;padding:.4rem .8rem;font:600 .8rem Poppins;color:#7a5a00;display:inline-block}
@media(max-width:60rem){.pcx .dd{grid-template-columns:1fr}
.pcx .dd:nth-of-type(even) .dd-pic{order:0}
.pcx .steps{grid-auto-flow:row}
.pcx .steps:before{display:none}
.pcx .rc-row,.pcx .rc-axis{grid-template-columns:1fr}
.pcx .dd .two{grid-template-columns:1fr}
}
.svc-body--focus .svc-main:has(.pcx){max-width:none}
.pcx .shot{display:block;width:100%;height:auto;border-radius:.7rem;border:1px solid #c9d6e2;box-shadow:0 .5rem 1.2rem rgba(17,24,39,.10);background:#fff}
.pcx .mainpic .shot,.pcx .dd-pic .shot{aspect-ratio:16/10;object-fit:cover;object-position:top left}
.pcx .th img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top left;border-radius:.5rem;border:1px solid #c9d6e2}
.pcx .lb-in:has(.lb-shot){max-width:64rem}
.pcx .lb-frame.lb-shot{zoom:1;width:auto;max-width:100%}
.pcx .lb-img{display:block;max-width:100%;max-height:66vh;width:auto;height:auto;margin:0 auto;border-radius:.7rem;background:#fff}
.pcx .lb-credit{font:400 .85rem 'Open Sans',sans-serif;color:#cfe3f1;margin:-.5rem 0 .9rem}
.pcx .pcx-credit{font-size:.85rem;color:var(--muted);margin:.5rem 0 1.6rem}
.pcx .pcx-notice{background:#fff7e0;border:2px solid #f0c75e;border-left:8px solid #e0a100;border-radius:var(--radius);padding:1rem 1.3rem;margin:1.2rem 0;color:#4a3800;font-size:1.05rem}
.pcx .pcx-notice b{display:block;font:800 1.15rem Poppins,sans-serif;color:#4a3800;margin-bottom:.15rem}
.pcx .pc-tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.pcx .pc-tablewrap .pc-table{min-width:46rem}
@media(max-width:60rem){.pcx .rc{padding:1rem}.pcx .rc-track{height:3.6rem}.pcx .rc-lab{top:2.05rem;left:0!important}.pcx .rc-bar{top:.2rem}.pcx .rc-bar{overflow:hidden}.pcx .rc-bar.open{font-size:0}.pcx .rc-bar.dash{font-size:.7rem}.pcx .rc-track:has(.rc-bar.open)::after{content:"Quoted per project";position:absolute;left:0;top:2.05rem;font:700 .85rem/1.7rem Poppins,sans-serif;color:var(--navy)}.pcx .rc-axis div:last-child span:nth-child(even){display:none}.pcx .lb-frame{zoom:1.1}}