/* Engineering, modular and drilling experiences. Shares tokens with site.css. */
:root{--xp-source:#1c8c7a;--xp-principle:#2584ba;--xp-inferred:#8a6d3b;--xp-proposed:#7c4dbe;--xp-refrigerant:#c9512b;--xp-electrical:#d59a1f;--xp-condensate:#7fa6bd}
.xp-hero{background:linear-gradient(120deg,#08243e 0%,#0e3d60 55%,#1d648b 100%);color:#fff;padding:clamp(60px,7vw,110px) max(4%,calc((100vw - 1288px)/2)) 60px}
.xp-hero h1{max-width:900px;margin-bottom:20px}.xp-hero p{font-size:1.13rem;color:#d7e9f2;max-width:720px;margin:0 0 26px}.xp-hero .eyebrow{color:#9bd3f1}
.xp-hero .hero-actions{margin-top:10px}
.xp-status{max-width:1400px;margin:28px auto 0;padding:0 4%}
.xp-status>div{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;background:#fff7e6;border:1px solid #f0d9a6;border-left:6px solid #d59a1f;border-radius:6px;padding:18px 22px}
.xp-status strong{display:block;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#8a5a00;margin-top:2px}.xp-status p{margin:0;color:#4a4a3a;font-size:.95rem}
.tier{display:inline-flex;align-items:center;gap:6px;font:800 .62rem -apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;padding:4px 8px;border-radius:3px;color:#fff;vertical-align:middle;white-space:nowrap}
.tier-source{background:var(--xp-source)}.tier-principle{background:var(--xp-principle)}.tier-inferred{background:var(--xp-inferred)}.tier-proposed{background:var(--xp-proposed)}
.tier-key{display:flex;flex-wrap:wrap;gap:14px 26px;margin:0 0 30px;padding:0;list-style:none}.tier-key li{display:flex;gap:10px;align-items:center;font-size:.85rem;color:#4f6472}
.xp-section{max-width:1400px;margin:auto;padding:70px 4%}.xp-section>.section-heading{margin-bottom:30px}.xp-section h2{margin:0 0 12px}
.xp-lead{color:var(--muted);max-width:760px;margin:0 0 28px;font-size:1.05rem}
.xp-workbench{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.8fr);gap:28px;align-items:start}
.xp-stage{background:linear-gradient(145deg,#f3f6f7,#e5ecef);border:1px solid #d5e0e6;border-radius:8px;padding:14px;position:relative;min-width:0}
.xp-stage svg{display:block;width:100%;height:auto;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif}
.xp-stage:focus-visible{outline:3px solid #307dc3;outline-offset:3px}
.xp-stage-top{display:flex;justify-content:space-between;gap:12px;align-items:center;margin:0 4px 10px;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:#4f6472;font-weight:800}
.xp-stage-top [role=status]{letter-spacing:0;text-transform:none;font-weight:600;color:#5a6c79}
.xp-controls{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 0}
.xp-controls button,.xp-toggle{border:1px solid #b8cbd6;background:#fff;color:var(--navy);padding:10px 14px;border-radius:4px;font-size:.84rem;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:8px;line-height:1.2}
.xp-controls button[aria-pressed=true],.xp-toggle[aria-pressed=true]{background:var(--navy);color:#fff;border-color:var(--navy)}
.xp-controls button:disabled{opacity:.45;cursor:not-allowed}
.xp-toggle .swatch{width:12px;height:12px;border-radius:2px;display:inline-block;background:currentColor}
.xp-toggle[aria-pressed=true] .swatch{outline:2px solid #ffffff90}
.xp-panel{background:#fff;border:1px solid #d9e4e9;border-radius:8px;padding:24px;min-width:0}
.xp-panel h3{margin:0 0 6px;font-size:1.2rem}.xp-panel p{color:#4f6472;font-size:.92rem}.xp-panel .kicker{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:#4f6f84;font-weight:800;margin:0 0 8px}
.xp-panel ul{padding-left:18px;margin:10px 0}.xp-panel li{padding:3px 0;font-size:.9rem;color:#3f5563}
.xp-quote{border-left:3px solid #cfe0ea;padding:8px 14px;margin:12px 0;background:#f6fafc;font-size:.88rem;color:#2f4858}.xp-quote cite{display:block;font-style:normal;font-size:.76rem;color:#4f6472;margin-top:6px}
.xp-steps{display:flex;flex-direction:column;gap:6px;margin:0;padding:0;list-style:none}
.xp-steps button{width:100%;text-align:left;display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:center;padding:10px 12px;border:1px solid #d9e4e9;background:#fff;border-radius:5px;font-size:.88rem;color:#2f4858;cursor:pointer}
.xp-steps button[aria-current=step]{background:#eaf5fa;border-color:#2584ba;font-weight:700}
.xp-steps span.num{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#dce8ed;color:#123b5b;font-weight:800;font-size:.78rem}
.xp-steps button[aria-current=step] span.num{background:#2584ba;color:#fff}
.xp-progress{height:6px;background:#dce8ed;border-radius:3px;overflow:hidden;margin:12px 4px 0}.xp-progress span{display:block;height:100%;background:#2584ba;width:0;transition:width .4s linear}
.xp-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.xp-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.xp-card{background:#fff;border:1px solid #d9e4e9;border-radius:8px;padding:24px;display:flex;flex-direction:column;gap:10px;min-width:0}
.xp-card .code{font:800 .72rem -apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;letter-spacing:.12em;color:#fff;padding:5px 9px;border-radius:3px;align-self:flex-start}
.xp-card h3{margin:2px 0 0;font-size:1.15rem}.xp-card p{margin:0;color:#4f6472;font-size:.9rem}.xp-card ul{margin:6px 0 0;padding-left:18px;font-size:.86rem;color:#3f5563}.xp-card li{padding:2px 0}
.xp-card details{margin-top:6px;font-size:.86rem}.xp-card summary{cursor:pointer;font-weight:700;color:#0578b1}
.xp-table-wrap{overflow-x:auto;border:1px solid #d5e4eb;border-radius:6px;margin:22px 0}.xp-table{width:100%;min-width:820px;border-collapse:collapse}
.xp-table th,.xp-table td{padding:12px 11px;border-bottom:1px solid #e0e9ee;text-align:left;font-size:.8rem;vertical-align:top}.xp-table thead th{background:#eaf5fa;color:#3d6479;font-weight:800;white-space:nowrap}.xp-table tbody th{font-weight:800;color:#173e59;white-space:nowrap}
.xp-table tbody tr:last-child>*{border-bottom:0}
.cfg{display:grid;grid-template-columns:minmax(280px,.9fr) minmax(0,1.4fr);gap:28px;align-items:start}
.cfg fieldset{border:1px solid #d9e4e9;border-radius:8px;padding:16px 18px 10px;margin:0 0 16px;background:#fff;min-width:0}
.cfg legend{font:800 .72rem -apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#436174;padding:0 6px}
.cfg label{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:start;padding:8px 4px;font-size:.9rem;color:#2f4858;border-radius:4px}
.cfg label:has(input:disabled){color:#7a8b95}.cfg label input{margin:3px 0 0;width:18px;height:18px}.cfg label small{display:block;color:#536b7a;font-size:.78rem;margin-top:2px}
.cfg-note{font-size:.78rem;color:#8a5a00;background:#fff7e6;border:1px solid #f0d9a6;border-radius:4px;padding:8px 10px;margin:4px 0 0}
.cfg-summary{background:#fff;border:1px solid #d9e4e9;border-radius:8px;padding:24px}
.cfg-summary h3{margin:0 0 4px}.cfg-summary dl{display:grid;grid-template-columns:auto 1fr;gap:8px 18px;margin:16px 0;font-size:.88rem}.cfg-summary dt{color:#536b7a;font-weight:700}.cfg-summary dd{margin:0;color:#2f4858}
.cfg-summary ul{padding-left:18px;margin:6px 0;font-size:.86rem;color:#3f5563}
.cfg-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.cfg-warn{display:flex;gap:10px;align-items:flex-start;background:#fdf1ee;border:1px solid #f0c6bb;border-left:5px solid #c9512b;border-radius:4px;padding:10px 12px;font-size:.84rem;color:#6d2a17;margin:10px 0 0}
.path-key{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 0}
.svc-list{margin:0;padding:0;list-style:none;display:grid;gap:8px}.svc-list li{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:10px 12px;border:1px solid #d9e4e9;border-radius:5px;font-size:.86rem;background:#fff}
.svc-list li strong{display:block;color:#173e59}.svc-list li span{color:#5a6c79;font-size:.78rem}
.svc-list .rec{font-size:.66rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:4px 7px;border-radius:3px;background:#fdf1ee;color:#a13c1b;white-space:nowrap}.svc-list .ok{background:#e8f5f2;color:#156a5b}
.feature-modular{max-width:none;background:#071d31;color:#fff;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:60px;align-items:center;padding-left:max(4%,calc((100vw - 1288px)/2));padding-right:max(4%,calc((100vw - 1288px)/2))}
.feature-modular h2{margin:0 0 16px;max-width:600px}.feature-modular p{color:#c9e0ec;font-size:1.08rem;max-width:560px}.feature-modular .eyebrow{color:#9bd3f1}
.feature-modular .concept-pill{display:inline-block;background:#d59a1f;color:#1d1400;font:800 .62rem -apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;padding:5px 9px;border-radius:3px;margin-bottom:16px}
.feature-modular svg{width:100%;height:auto;display:block;border-radius:8px;background:#0e3d60}
.feature-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.feature-links a{display:flex;flex-direction:column;gap:8px;background:var(--paper);border:1px solid #e3ebef;border-radius:8px;padding:26px;transition:box-shadow .2s,transform .2s}
.feature-links a:hover{box-shadow:0 18px 35px #12324917;transform:translateY(-3px)}.feature-links strong{font-size:1.25rem;color:#123b5b;letter-spacing:-.02em}.feature-links span{color:#556b78;font-size:.88rem}
.xp-sources ol{padding-left:20px;columns:2;column-gap:40px;font-size:.86rem;color:#3f5563}.xp-sources li{break-inside:avoid;padding:4px 0}.xp-sources a{color:#0578b1;font-weight:700}.xp-sources small{display:block;color:#536b7a}
.xp-photo-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:20px}.xp-photo-row figure{margin:0;border:1px solid #dce7eb;border-radius:6px;overflow:hidden;background:#f7fafb}.xp-photo-row img{display:block;width:100%;height:220px;object-fit:cover}.xp-photo-row figcaption{padding:12px 14px;font-size:.78rem;color:#4f6472}
.flow-anim{stroke-dasharray:10 8;animation:flow 1.4s linear infinite}.flow-anim.rev{animation-direction:reverse}
@keyframes flow{to{stroke-dashoffset:-36}}
.xp-stage .part{cursor:pointer;transition:opacity .25s}.xp-stage .part:hover rect,.xp-stage .part:hover path,.xp-stage .part:focus-visible rect{stroke:#0f83bd;stroke-width:3}
.xp-stage .part[aria-pressed=true] rect,.xp-stage .part[aria-pressed=true] path.body{stroke:#0f83bd;stroke-width:3}
.xp-stage .dim{opacity:.18}
.xp-stage .mod{transition:transform .7s cubic-bezier(.2,.7,.2,1),opacity .4s;transform-box:view-box}
.xp-stage text{pointer-events:none}
.print-only{display:none}
@media(prefers-reduced-motion:reduce){.flow-anim{animation:none;stroke-dasharray:none}.xp-stage .mod{transition:none}.xp-progress span{transition:none}}
@media(max-width:1280px){.site-header nav{gap:clamp(9px,1.4vw,22px)}.nav-link{font-size:.8rem}.header-cta{padding:12px 14px;font-size:.78rem}}
@media(max-width:1100px) and (min-width:901px){.nav-link{font-size:.74rem}.site-header nav{gap:9px}.header-cta{font-size:.72rem;padding:10px 10px;gap:8px}.header-inner{gap:14px}}
@media(max-width:1024px){.xp-workbench,.cfg{grid-template-columns:1fr}.xp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.feature-modular{grid-template-columns:1fr;gap:30px;padding-left:5%;padding-right:5%}.feature-links{grid-template-columns:1fr 1fr}.xp-sources ol{columns:1}}
@media(max-width:768px){.xp-section{padding:55px 5%}.xp-hero{padding:60px 5% 45px}.xp-status{padding:0 5%}.xp-status>div{grid-template-columns:1fr;gap:6px}.xp-grid,.xp-grid-2,.feature-links,.xp-photo-row{grid-template-columns:1fr}.xp-controls button,.xp-toggle{padding:11px 12px;font-size:.82rem}.xp-photo-row img{height:200px}}
@media(max-width:540px){.xp-hero h1{font-size:2.3rem}.xp-hero p{font-size:1rem}.xp-panel,.xp-card,.cfg-summary{padding:18px}.xp-controls{gap:6px}.xp-steps button{font-size:.82rem}}
@media print{header.site-header,footer.site-footer,.skip,.xp-hero,.xp-controls,.cfg form,.cfg-actions,.feature-links,nav,.xp-status{display:none!important}.print-only{display:block}.cfg{grid-template-columns:1fr}.cfg-summary{border:0;padding:0}body{color:#000}.xp-section{padding:12px 0}a[href]:after{content:""}}

/* Physical cabinet studies retain their own controls: not every configurator variant has CAD. */
.studio-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}.studio-card{min-width:0;background:#fff;border:1px solid #dce4e8;padding:24px;border-radius:12px}.studio-card h3{font-size:24px;margin:0}.studio-card figure{margin:16px 0}.studio-card img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain}.studio-card figcaption{font-size:13px;color:#526576;margin-top:10px}.studio-card a{text-underline-offset:4px}.studio-card .xp-controls{gap:6px}.studio-card .xp-controls button{font-size:13px;padding:10px 12px}@media(max-width:767px){.studio-grid{grid-template-columns:1fr}.studio-card{padding:18px}}
@media(max-width:767px){#assembly-stage,#unit-stage,#cycle-stage,#drill-stage{overflow-x:auto;overscroll-behavior-x:contain}#assembly-stage svg,#unit-stage svg,#cycle-stage svg,#drill-stage svg{min-width:640px;max-width:none}#assembly-stage::before,#unit-stage::before,#cycle-stage::before,#drill-stage::before{content:"Swipe the diagram to inspect details →";display:block;padding:8px 12px;font-size:12px;color:#314f65}}
.cfg>* , .xp-workbench>*{min-width:0}.xp-stage{min-width:0;max-width:100%}#assembly-stage,#unit-stage,#cycle-stage,#drill-stage{max-width:100%;min-width:0}

.cfg-text-preview{margin-top:18px}.cfg-text-preview pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;max-height:480px;overflow:auto;padding:16px;background:#f5f8fa}
