/* Explanatory diagrams: selectable, responsive HTML labels. */
.why-page .company-hero>div{min-width:0}
.why-page .company-hero h1{overflow-wrap:anywhere;hyphens:auto}
.why-page .reason-grid{gap:20px;background:none;border:0;margin-top:0}
.why-page .diagram-card{display:flex;flex-direction:column;min-width:0;padding:28px;border:1px solid #d6e1ef;border-radius:14px;box-shadow:0 8px 30px #0c315408;position:relative;overflow:hidden}
.why-page .diagram-card>b{font-size:14px;letter-spacing:.1em}
.why-page .diagram-card h3{margin:22px 0 12px;font-size:24px;line-height:1.2;letter-spacing:-.7px;overflow-wrap:anywhere}
.why-page .diagram-card>p{font-size:16px;line-height:1.65;margin:0 0 24px}
.connection-hub{margin:34px 0 22px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 30px;border-radius:14px;background:#09223e;color:#fff;position:relative}
.connection-hub:after{content:"";position:absolute;width:1px;height:22px;background:#9bb6d4;bottom:-22px;left:50%}
.hub-copy{display:flex;align-items:center;gap:24px;font:700 18px/1.4 Manrope,sans-serif}
.hub-brand{display:grid;place-items:center;width:70px;height:70px;flex-shrink:0;border:1px solid #5288b7;border-radius:50%;font:800 24px Manrope,sans-serif;box-shadow:0 0 0 6px #ffffff05}
.hub-stages{display:flex;flex-wrap:wrap;gap:10px;font:500 14px/1.5 "DM Sans",sans-serif;color:#adc5e1;margin-top:8px}
.hub-stages i{font-style:normal;color:#579df5}
.diagram-motion-toggle{flex-shrink:0;min-height:44px;padding:10px 16px;border:1px solid #6f8da9;border-radius:24px;background:transparent;color:#fff;font:600 14px/1.4 "DM Sans",sans-serif;cursor:pointer}
.diagram-motion-toggle:hover{background:#ffffff12;border-color:#b6d4f5}
.diagram-motion-toggle:focus-visible{outline:3px solid #8ed7ff;outline-offset:4px}
.explain-diagram{margin-top:auto;min-height:250px;padding:24px 16px;display:flex;flex-direction:column;justify-content:center;align-items:stretch;border-radius:10px;background:radial-gradient(ellipse at 50% 60%,#e6f0ff 0,transparent 70%),#f6f9fd;border:1px solid #e5edf7;color:#12324d}
.diagram-node{display:flex;align-items:center;justify-content:center;min-width:0;min-height:46px;text-align:center;padding:9px 10px;background:#fff;border:1px solid #cad9eb;border-radius:7px;font:600 14px/1.35 "DM Sans",sans-serif;overflow-wrap:anywhere;position:relative}
.diagram-inputs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.diagram-inputs .diagram-node{padding:10px 5px}
.diagram-merge{width:100%;height:38px;flex:none;overflow:visible;fill:none;stroke:#9eb9d8;stroke-width:1.5}
.signal-line{stroke:#1762ed;stroke-width:2;stroke-dasharray:10 100;animation:diagram-signal 7s linear infinite;animation-play-state:paused}
.node-result{background:#e8f1ff;border-color:#90b6ed;color:#0646a0;font-weight:700}
.node-emphasis{background:#123653;border-color:#123653;color:#fff}
.diagram-arrow{color:#6d95c2;display:block;align-self:center;line-height:24px;font-size:22px;flex:none}
.diagram-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.diagram-branch .diagram-merge{transform:none}
.diagram-flow{display:flex;flex-direction:column;align-items:stretch;position:relative}
.diagram-dialogue{display:grid;grid-template-columns:minmax(0,1fr) 18px 54px 18px minmax(0,1fr);gap:3px;align-items:center;text-align:center}
.diagram-dialogue>.diagram-node{min-height:62px;padding:5px}
.diagram-dialogue>span{font-size:21px;color:#548ab9}
.tjl-node{display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:#123653;color:#fff;font:800 17px Manrope,sans-serif;box-shadow:0 0 0 5px #cdddf255}
.diagram-detail-rail{margin-top:25px;display:grid;gap:8px;border-left:2px solid #a3bede;padding-left:14px}
.diagram-detail-rail .diagram-node{justify-content:flex-start;min-height:36px;padding:6px 10px;text-align:left;border:0;background:transparent}
.diagram-detail-rail .diagram-node:before{content:"";position:absolute;left:-20px;width:9px;height:9px;border:2px solid #f6f9fd;border-radius:50%;background:#1762ed}
.accountability-rail{display:flex;align-items:center;gap:12px;border-bottom:2px solid #9eb9d8;padding-bottom:13px;margin-bottom:15px;font-size:14px;line-height:1.4}
.accountability-rail strong{color:#1762ed;font:800 20px Manrope,sans-serif}
.diagram-outcome,.feedback-return{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:14px;font:600 14px/1.45 "DM Sans",sans-serif;color:#305875;text-align:center}
.feedback-return>span:first-child{color:#1762ed;font-size:28px}
.why-page .validation-grid{margin-top:34px}
.validation-grid .explain-diagram{background:radial-gradient(ellipse at 50% 60%,#183f69,transparent 90%),#0d2946;border-color:#214364;color:#fff}
.validation-grid .diagram-node{background:#153a5c;border-color:#436787;color:#dcecff}
.validation-grid .node-result{background:#1c5cb5;border-color:#518bed;color:#fff}
.validation-grid .diagram-outcome,.validation-grid .feedback-return{color:#b5cde7}
.validation-grid .signal-line{stroke:#6fc6ff}
.validation-grid .diagram-arrow,.validation-grid .feedback-return>span:first-child{color:#77baff}
.diagram-improvement .diagram-flow{margin-left:12px}
.diagram-improvement .diagram-flow:before{content:"";position:absolute;left:-14px;top:23px;bottom:23px;width:14px;border:1px solid #73a4d0;border-right:0;border-radius:8px 0 0 8px}
.diagram-improvement .diagram-flow:after{content:"";position:absolute;left:-5px;top:19px;border-left:5px solid #73a4d0;border-top:4px solid transparent;border-bottom:4px solid transparent}
.why-page .explain-diagram{min-height:300px}
.workflow-heading{display:flex;align-items:center;gap:20px;margin:58px 0 24px}
.workflow-heading h3{font:700 clamp(22px,2.2vw,30px)/1.25 Manrope,sans-serif;margin:0;letter-spacing:-.6px}
.workflow-mark{white-space:nowrap;font:700 14px Manrope,sans-serif;color:#1762ed;border:1px solid #bed3ed;border-radius:24px;padding:12px 17px}
.why-page .diagram-timeline{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px;margin:0;padding:0;border:0;position:relative}
.why-page .diagram-timeline .process-step{border:1px solid #d4e0ef;border-radius:12px;background:#f6f9fd;padding:25px;position:relative;min-width:0}
.why-page .diagram-timeline .process-step h3{font-size:21px;margin:22px 0 10px}
.why-page .diagram-timeline .process-step p{font-size:16px;line-height:1.6;margin:0}
.why-page .diagram-timeline .process-step:nth-child(4){grid-area:2/3}
.why-page .diagram-timeline .process-step:nth-child(5){grid-area:2/2}
.why-page .diagram-timeline .process-step:nth-child(6){grid-area:2/1}
.why-page .step-marker{display:grid;place-items:center;width:44px;height:44px;border:1px solid #aec8ec;border-radius:50%;background:#fff;color:#1762ed;font:700 14px Manrope,sans-serif;animation:diagram-beacon 12s ease-in-out infinite;animation-delay:calc(var(--step-index)*1.8s);animation-play-state:paused}
.step-connector{position:absolute;right:-32px;top:40px;font-size:25px;line-height:24px;color:#759dc9}
.diagram-timeline .process-step:nth-child(3)>.step-connector{right:calc(50% - 10px);top:auto;bottom:-31px;transform:rotate(90deg)}
.diagram-timeline .process-step:nth-child(4)>.step-connector,.diagram-timeline .process-step:nth-child(5)>.step-connector{right:auto;left:-32px;transform:rotate(180deg)}
.workflow-return{display:flex;justify-content:center;gap:16px;align-items:center;padding:17px 24px;border:1px dashed #a7bfdc;border-top:0;border-radius:0 0 18px 18px;margin:20px 20px 0;color:#3d648c;font:600 14px/1.5 "DM Sans",sans-serif;text-align:center}
.workflow-return>span:first-child{font-size:27px;color:#1762ed}
.hiring-timeline{gap:36px!important;border:0;margin-top:42px}
.why-page .hiring-timeline .process-step{padding:0;border:0;position:relative;min-width:0}
.why-page .hiring-timeline .process-step h3{margin:22px 0 12px;line-height:1.4}
.why-page .hiring-timeline .process-step p{font-size:16px;line-height:1.65;margin:0}
.hiring-timeline .step-connector{right:-28px;top:10px;color:#5a8bbe}
.why-page .hiring-timeline .step-marker{background:#163652;border-color:#466988;color:#b6d4fc}
.diagram-in-view .signal-line,.diagram-in-view .step-marker{animation-play-state:running}
.diagrams-paused .signal-line,.diagrams-paused .step-marker{animation-play-state:paused!important}
@keyframes diagram-signal{to{stroke-dashoffset:-220}}
@keyframes diagram-beacon{0%,28%,100%{box-shadow:0 0 0 0 #1762ed00}12%{box-shadow:0 0 0 6px #1762ed16}}
@media(min-width:901px){.why-page .reason-grid:not(.validation-grid){grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1100px){.why-page .diagram-card{padding:22px}.diagram-inputs{grid-template-columns:1fr}.diagram-synthesis .diagram-merge,.diagram-match .diagram-merge,.diagram-alignment .diagram-merge{height:25px}.diagram-synthesis .diagram-merge path,.diagram-match .diagram-merge path,.diagram-alignment .diagram-merge path{d:path("M150 0V38")}.diagram-inputs .diagram-node{min-height:38px;padding:7px}.why-page .validation-grid{grid-template-columns:1fr}.validation-grid .diagram-card{display:grid;grid-template-columns:1fr 1fr;gap:0 30px}.validation-grid .diagram-card>b,.validation-grid .diagram-card>h3,.validation-grid .diagram-card>p{grid-column:1}.validation-grid .explain-diagram{grid-column:2;grid-row:1/4;margin:0;min-height:240px}.validation-grid .diagram-card>h3{margin-top:16px}.validation-grid .diagram-card>p{margin-bottom:0}}
@media(max-width:900px){.why-page .reason-grid:not(.validation-grid){grid-template-columns:repeat(2,minmax(0,1fr))}.why-page .diagram-timeline{gap:24px}.why-page .diagram-timeline .process-step{padding:20px}.diagram-timeline .step-connector{right:-23px}.diagram-timeline .process-step:nth-child(3)>.step-connector{bottom:-25px}.diagram-timeline .process-step:nth-child(4)>.step-connector,.diagram-timeline .process-step:nth-child(5)>.step-connector{left:-23px}.hiring-timeline{grid-template-columns:1fr!important}.hiring-timeline .process-step{padding-left:66px!important;padding-bottom:10px!important}.hiring-timeline .step-marker{position:absolute;left:0;top:0}.hiring-timeline .step-connector{top:auto;bottom:-31px;left:12px;right:auto;transform:rotate(90deg)}.hiring-timeline .process-step h3{margin-top:7px!important}.connection-hub{padding:22px}.hub-copy{gap:18px}}
@media(max-width:620px){.why-page .reason-grid:not(.validation-grid){grid-template-columns:1fr}.connection-hub{align-items:flex-start;flex-direction:column;gap:20px}.hub-copy{font-size:17px}.hub-brand{width:56px;height:56px;font-size:22px}.diagram-motion-toggle{margin-left:74px}.why-page .diagram-card{padding:24px}.validation-grid .diagram-card{display:flex;gap:0}.validation-grid .diagram-card>p{margin-bottom:24px}.validation-grid .explain-diagram{margin-top:auto}.explain-diagram{min-height:240px}.diagram-inputs{grid-template-columns:1fr}.workflow-heading{align-items:flex-start;flex-direction:column;gap:14px;margin-top:42px}.why-page .diagram-timeline{grid-template-columns:1fr;gap:27px}.why-page .diagram-timeline .process-step{grid-area:auto!important;padding:24px 24px 24px 88px;min-height:150px}.diagram-timeline .step-marker{position:absolute;top:24px;left:24px}.why-page .diagram-timeline .process-step h3{margin-top:7px}.diagram-timeline .step-connector,.diagram-timeline .process-step:nth-child(3)>.step-connector,.diagram-timeline .process-step:nth-child(4)>.step-connector,.diagram-timeline .process-step:nth-child(5)>.step-connector{top:auto;bottom:-27px;right:auto;left:35px;transform:rotate(90deg)}.workflow-return{margin:18px 0 0}.why-page .reason-intro h2,.why-page .validation-intro h2{font-size:clamp(32px,8vw,44px);line-height:1.12;letter-spacing:-1.3px}}
@media(prefers-reduced-motion:reduce){.signal-line,.why-page .step-marker{animation:none!important}.diagram-motion-toggle{display:none}}
@media print{.diagram-motion-toggle{display:none}.signal-line,.step-marker{animation:none!important}.diagram-card,.process-step{break-inside:avoid}}
