/* Two product paths, built as responsive HTML illustrations. */
.ways{margin-top:112px;padding:56px 24px 64px;background:#f1f1f3;color:#111;font-family:var(--font)}
.ways-in{max-width:1280px;margin:auto}.ways-heading{text-align:center;max-width:960px;margin:0 auto 60px}.ways-pill{display:inline-block;margin:0 0 20px;padding:7px 14px;border-radius:99px;background:white;font-size:14px;font-weight:500;line-height:1.2}.ways-heading h2{margin:0;font-size:40px;font-weight:500;letter-spacing:-.02em;line-height:1.05;text-wrap:balance}.ways-sub{max-width:760px;margin:24px auto 0;font-size:18px;line-height:1.5;letter-spacing:-.03em;color:#85858d;text-wrap:pretty}.ways-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.ways-card{min-width:0;padding:28px;border:1px solid #e9e9eb;border-radius:26px;background:#fff;box-shadow:0 1px 2px #00000003}.ways-card h3{margin:0 0 24px;font-size:22px;line-height:1.25;font-weight:500;letter-spacing:-.02em}.ways-card h3 a{color:inherit;text-decoration:none}.ways-card h3 a:hover{text-decoration:underline;text-underline-offset:5px}.ways-card h3 a:focus-visible{outline:2px solid #ad2029;outline-offset:5px}.ways-art{position:relative;container-type:inline-size;aspect-ratio:1.285;overflow:hidden;border-radius:18px;background:linear-gradient(125deg,#fce7e3 0%,#f3dce9 45%,#d8b8ec 78%,#b4bbfa 100%)}.ways-copy{margin-top:32px}.ways-copy h4{margin:0 0 10px;font-size:18px;font-weight:500;letter-spacing:-.02em;line-height:1.3}.ways-copy>p{margin:0;font-size:18px;font-weight:400;line-height:1.5;letter-spacing:-.03em;color:#85858d}.ways-window{position:absolute;left:9.4%;top:8%;width:88%;height:95%;border-radius:2.2cqw;background:#fff;overflow:hidden;box-shadow:0 1cqw 5cqw #342f4430}.ways-bar{position:relative;height:5.8cqw;display:flex;align-items:center;gap:2cqw;padding:0 2cqw;background:#f6f6f8;border-bottom:1px solid #ebebee;font-size:1.65cqw;color:#27272b}.ways-bar b{position:absolute;left:50%;transform:translateX(-50%);font-size:inherit;font-weight:600;white-space:nowrap}.ways-lights{display:flex;gap:.8cqw}.ways-lights i{height:1.55cqw;width:1.55cqw;border-radius:50%;background:#ff5f57}.ways-lights i:nth-child(2){background:#febc2e}.ways-lights i:nth-child(3){background:#28c840}.ways-arrows{font-size:3cqw;color:#a4a4ab;letter-spacing:1cqw}.ways-person{display:flex;gap:1cqw;align-items:center;padding:2.5cqw 3cqw}.ways-person>.ways-avatar{width:3.8cqw;height:3.8cqw;border-radius:50%}.ways-person b{display:block;font-size:1.8cqw}.ways-person small{display:block;margin-top:.3cqw;font-size:1.25cqw;color:#999}.ways-dashboard{display:grid;grid-template-columns:minmax(0,1fr) 18cqw;gap:2cqw;padding:0 3cqw}.ways-traces{height:48cqw;position:relative;border:1px solid #e2e3e9;border-radius:1.6cqw;overflow:hidden}.ways-traces>svg{position:absolute;inset:0;width:100%;height:100%}.ways-energy{position:absolute;top:.8cqw;left:46%;transform:translateX(-50%);border-radius:99px;background:#b72130;color:white;padding:.55cqw 1.1cqw;font-size:1.2cqw;font-weight:600;white-space:nowrap}.ways-pulse,.ways-breath{position:absolute;right:1.4cqw;top:1.3cqw;font-size:1.2cqw;font-weight:500;text-align:right;color:#f04a60}.ways-breath{top:58%;color:#333}.ways-traces small{display:block;font-size:1.15cqw;color:#777}.ways-traces small b{color:#333}.ways-camera{height:27cqw;overflow:hidden;border-radius:1.5cqw;position:relative;background:#eee5d9}.ways-camera>.ways-avatar{width:100%;height:100%;object-fit:cover}.ways-camera>span{position:absolute;bottom:1cqw;left:1cqw;padding:.4cqw .65cqw;border-radius:99px;background:white;color:#b4596d;font-size:1.1cqw}.ways-dashboard aside>p{font-size:1.3cqw;color:#888;margin:1.8cqw 0 1cqw}.ways-answer{font-size:1.1cqw;color:#999;border-radius:.8cqw;background:#f4f4f6;margin:.8cqw 0;padding:1cqw;white-space:nowrap}.ways-answer:first-of-type{background:#fbedef}.ways-answer b{color:#555;font-weight:500}.ways-scrub{margin:1.5cqw 23cqw 0 3cqw;border-top:.6cqw solid #dedee3;position:relative}.ways-scrub i{position:absolute;left:50%;top:-.8cqw;height:1cqw;width:1cqw;border-radius:50%;background:#b72130}.ways-scrub small{display:block;text-align:right;color:#999;font-size:1.1cqw;margin-top:1cqw}.ways-phone{position:absolute;left:4.5%;top:36%;width:30%;height:auto;aspect-ratio:71.6/147.6;border:.8cqw solid #d8d8de;border-radius:5cqw;background:#fff;box-shadow:0 1cqw 4cqw #27213230;overflow:hidden}.ways-status{height:5.5cqw;position:relative;padding:1.5cqw 2cqw;font-size:1.4cqw}.ways-status>i{position:absolute;left:36%;top:1cqw;width:32%;height:2.5cqw;border-radius:99px;background:#000}.ways-face{width:73%;aspect-ratio:1;margin:1cqw auto;border:.55cqw dotted #bb90c8;border-radius:50%;padding:.6cqw;overflow:hidden;background:#f3f0eb}.ways-face>.ways-avatar{width:100%;height:100%;border-radius:50%}.ways-reading{display:flex;gap:1cqw;align-items:center;justify-content:center;margin:1.4cqw auto;color:#c34f67;font-size:1.3cqw}.ways-reading span{background:#f3f3f6;color:#aaa;padding:.7cqw;border-radius:99px;font-size:1.15cqw}.ways-reading b{color:#555}.ways-question{padding:1.4cqw 2cqw;background:#fff;box-shadow:0 -1cqw 3cqw #00000009;border-radius:2.7cqw}.ways-question>i{display:block;width:4cqw;height:.5cqw;background:#ddd;border-radius:99px;margin:0 auto 1.5cqw}.ways-question small{display:block;font-size:1.1cqw;color:#999;margin-bottom:1.2cqw}.ways-question>b{display:block;font-size:1.35cqw}.ways-rating{display:flex;gap:.65cqw;margin-top:2cqw}.ways-rating span{display:grid;place-items:center;width:4cqw;height:3.5cqw;border-radius:.7cqw;background:#eeeef1;font-size:1.4cqw;color:#555}.ways-rating .selected{background:#b72130;color:white}.ways-low{display:flex;justify-content:space-between;font-size:1.1cqw;color:#999;margin-top:.7cqw}.ways-code-window{position:absolute;left:7.5%;top:8%;width:105%;height:95%;overflow:hidden;border-radius:2cqw;background:#1e1e25;box-shadow:0 1cqw 4cqw #342f4430}.ways-code-window .ways-bar{background:#292930;border-color:#292930;color:#c3c3cc}.ways-code-window .ways-arrows{color:#666673}.ways-code-window .ways-bar b{left:49%}.ways-code{padding:4.2cqw 4.4cqw;font-family:var(--mono),monospace}.ways-code-line{display:flex;align-items:baseline;gap:1.6cqw;min-height:4.3cqw;font-size:2.1cqw;line-height:1.8;white-space:pre;color:#d0d0d8}.ways-code-line>i{width:3cqw;flex:none;text-align:right;font-style:normal;color:#737381}.ways-code-line code{font:inherit}.ways-code-line:first-child code{color:#798793}.ways-code-line:nth-child(7){background:#2d2d37}.ways-code .kw{color:#f47ab3}.ways-code .str{color:#fc8c7d}
@media(max-width:1144px){.ways-heading h2{font-size:28px;line-height:1.15}}
@media(max-width:760px){.ways{margin-top:72px;padding:40px 6.25vw}.ways-heading{margin-bottom:32px;text-align:left}.ways-pill{font-size:13px;margin-bottom:18px}.ways-sub{margin-top:16px}.ways-grid{grid-template-columns:minmax(0,1fr);gap:20px}.ways-card{padding:20px;border-radius:24px}.ways-card h3{font-size:22px;margin-bottom:20px}.ways-copy{margin-top:24px}.ways-art{border-radius:14px}.ways-copy>p{font-size:18px;line-height:1.5}}
@media(prefers-reduced-motion:no-preference){.ways-card h3 a{transition:color .15s}.ways-card h3 a:hover{color:#ad2029}}

/* Reuse the working SDK browser inside the existing product-card footprint. */
.ways-dynamic{display:flex;flex-direction:column;background:#0b0b0c}
.ways-dynamic .ways-live{display:flex;flex-direction:column;flex:1;min-height:0;width:100%;padding:0;background:#0b0b0c;overflow:hidden}
.ways-dynamic .sdw-b{height:42px;padding:0 16px;background:#1b1b1d}
.ways-dynamic .sdw-u{display:none!important}
.ways-dynamic .sdw-go{right:16px;height:24px;padding:0 10px;font-size:11px}
.ways-dynamic .sdw-f{padding:0 16px;font-size:11px;line-height:30px}
.ways-dynamic .sdw-c{font-size:clamp(9px,2.25cqw,14px);line-height:1.7;padding:12px 0 20px}
.ways-dynamic .sdw-l i{width:36px;padding-right:12px}
.ways-dynamic .sd-tabs{position:static;display:flex;flex:none;flex-wrap:nowrap;align-items:center;justify-content:flex-start;gap:4px;width:100%;margin:0;padding:8px 12px;background:#151516;border-top:1px solid #29292c;box-sizing:border-box}
.ways-dynamic .sd-tabs button{flex:1;min-width:0;height:28px;padding:0 8px;border:0;border-radius:99px;background:transparent;color:#a1a1a8;font:400 12px/1 var(--font);cursor:pointer}
.ways-dynamic .sd-tabs button.is-on{background:#333337;color:#fff}
.ways-dynamic .sd-tabs button:focus-visible{outline:2px solid #fff;outline-offset:1px}
.ways-dynamic .sd-od{display:none!important}
@media(max-width:639px){.ways-dynamic .sdw-b{height:32px;padding:0 10px}.ways-dynamic .sdw-d{gap:5px}.ways-dynamic .sdw-d i{width:8px;height:8px}.ways-dynamic .sdw-go{right:10px;height:21px;padding:0 8px;font-size:10px}.ways-dynamic .sdw-f{font-size:9px;line-height:24px;padding:0 10px}.ways-dynamic .sdw-c{padding-top:8px}.ways-dynamic .sdw-l i{width:25px;padding-right:8px}.ways-dynamic .sd-tabs{padding:5px 6px;gap:2px}.ways-dynamic .sd-tabs button{height:24px;padding:0 4px;font-size:10px}}

.ways-link{display:inline-flex;align-items:center;gap:10px;min-height:44px;margin-top:16px;color:#111;text-decoration:none;font:500 16px/1.3 var(--font);letter-spacing:-.03em}
.ways-link:hover{text-decoration:none}.ways-link:hover .ways-link-label{text-decoration:underline;text-underline-offset:4px}.ways-link:focus-visible{outline:2px solid #ad2029;outline-offset:4px;border-radius:4px}.ways-link .ways-link-label{font:inherit}.ways-link-arrow{font-size:24px;font-weight:400;text-decoration:none}

/* The two card links share a bottom baseline; arrows never inherit underlines. */
.ways-card{display:flex;flex-direction:column}.ways-card>.ways-art{flex-shrink:0}.ways-copy{display:flex;flex-direction:column;flex:1}.ways-copy>p{margin-bottom:16px}.ways-link{align-self:flex-start;margin-top:auto}

/* Mobile: no hairline around the product cards. */
@media(max-width:760px){.ways-card{border:0}}

/* SDK code window: vertical scroll only; long lines wrap instead of scrolling sideways. */
.ways-dynamic .sdw-c{overflow-x:hidden;overflow-y:auto}
.ways-dynamic .sdw-l{width:auto;min-width:0}
.ways-dynamic .sdw-l code{flex:1;min-width:0;padding-right:16px;white-space:pre-wrap;overflow-wrap:anywhere}

/* No hairline around the product cards at any width. */
.ways-card{border:0}
.ways-card{box-shadow:0 1px 2px rgba(0,0,0,.04),0 14px 36px -18px rgba(0,0,0,.16)}
@media(max-width:760px){.ways-grid{gap:32px}}
.ways-links{display:flex;flex-wrap:wrap;align-items:center;gap:0 28px;margin-top:auto}.ways-links .ways-link{margin-top:16px}

/* The homepage hero's own browser and phone stand in the eSSESSMENT picture (ways-hero-devices.js): the
   drawn boxes keep only their place; the phone covers the browser by 60% and ends 5% below it. */
.ways-session .wh-host{position:absolute;left:0;top:0;transform-origin:0 0;pointer-events:none}
.ways-session .wh-browser{z-index:2}.ways-session .wh-phone{z-index:4}
.ways-session .ways-window{left:16.5%;width:80%;background:transparent;overflow:visible;border-radius:12px;box-shadow:0 1cqw 5cqw #342f4430}
.ways-session .ways-window>*{visibility:hidden}
.ways-session .ways-phone{left:calc(16.5% - 20% * .4);width:20%;background:transparent;border:0;border-radius:30px;aspect-ratio:auto;overflow:visible;box-shadow:0 1cqw 4cqw #27213230}
.ways-session .ways-phone>*{visibility:hidden}
/* Phones: the mobile hero's devices (ways-mobile-devices.js) replace the rebuilt browser and phone. */
.wm-frame{display:none}
@media(max-width:639px){
 .ways-session.wm-on{aspect-ratio:auto;overflow:hidden;margin-top:24px}
 .ways-session.wm-on>:not(.wm-frame){display:none!important}
 .ways-session.wm-on .wm-frame{display:block;position:absolute;left:0;height:1200px;border:0;background:transparent;pointer-events:none}
}

/* Oct 29: white band, light gray cards, bigger and further apart, spanning the hero's width on desktop. */
.ways{background:#fff}
.ways .ways-pill{background:#f3f3f5}
.ways-card{background:#f1f1f3;box-shadow:none}
@media(min-width:761px){
 .ways-in{max-width:none;padding-inline:calc(max(88px,50vw - 712px) - 24px);box-sizing:border-box}
 .ways-grid{gap:48px}
 .ways-card{padding:40px;border-radius:32px}
 .ways-card h3{font-size:26px;margin-bottom:28px}
}
@media(min-width:761px) and (max-width:1100px){.ways-grid{gap:24px}.ways-card{padding:28px}}
/* Oct 29: a softer take on the hero fade: light gray at the top (so the card edge stays), deepening to the
   hero's bottom gray. */
.ways-card{background:linear-gradient(#f6f6f8 0%,#f3f3f5 45%,#ececef 80%,#e8e9ed 100%)}
/* "For teams that run programs" / "For developers" match the titles under the science cards' pictures. */
.ways-copy>h4{margin:0 0 12px;font-size:28px;line-height:1.15;font-weight:500;letter-spacing:-.02em;text-wrap:balance}
@media(min-width:761px) and (max-width:1100px){.ways-copy>h4{font-size:24px}}
@media(max-width:760px){.ways-copy>h4{font-size:22px;line-height:1.25}}
/* Product names outrank the 28px subheads and stay under the 40px section headline. */
@media(min-width:761px){.ways-card h3{font-size:36px;line-height:1.1;letter-spacing:-.025em}}
@media(min-width:761px) and (max-width:1100px){.ways-card h3{font-size:30px}}
@media(max-width:760px){.ways-card h3{font-size:28px}}
