/* Small platform marks and a concrete explanation of the business benefits. */
/* Longer example screens scroll inside the phone instead of being cut off. */
.device-screen .demo-content{height:calc(100% - 45px);max-height:calc(100% - 45px);overflow-y:auto;overscroll-behavior-y:contain;scrollbar-width:thin;scrollbar-color:#9aabc7 transparent;padding-bottom:28px}
.device-screen .demo-content:focus-visible{outline:2px solid #657da8;outline-offset:-4px}
.phone-home{pointer-events:none}
.hero-copy .platform-note{display:flex;align-items:center;flex-wrap:wrap;gap:10px 12px;margin-top:29px;max-width:450px}
.platform-note .platform-badge{display:inline-flex;align-items:center;gap:8px;padding:9px 13px;border:1px solid #bfd0f233;border-radius:30px;background:linear-gradient(140deg,#ccdcff0c,#ccdcff03);font-size:12px;line-height:1.4;color:#e5edff;letter-spacing:0;min-height:39px}
.platform-badge svg{height:18px;width:18px;color:#dce7ff;filter:drop-shadow(0 0 8px #b5ccff23)}
.platform-note small{font-size:12px;line-height:1.6;color:#b6c4dc}
.hero-description{max-width:540px}.demo-head>span{font-size:9px;letter-spacing:.5px}.concept-label{font-size:12px;letter-spacing:0;color:#c2cee3}
.studio-value-section{display:block;position:relative;border-top:1px solid #b0c8ff26;background:radial-gradient(ellipse at 0 40%,#6583c516,transparent 50%),#0b0e15}
.studio-value-section .section-top{align-items:center;gap:25px;margin-bottom:48px}
.value-signature{font-size:22px;letter-spacing:-1px;font-weight:650;display:flex;align-items:baseline;gap:7px;color:#ecf1ff;white-space:nowrap}
.value-signature>span{font-size:12px;letter-spacing:0;font-weight:450;color:#bcc9e1}
.value-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:9%;align-items:start}
.value-intro h2{font-size:clamp(37px,3.35vw,52px);line-height:1.2;letter-spacing:-2px;max-width:510px}
.value-intro h2 em{color:#c8d5ff;font-weight:550}
.value-intro>p{font-size:16px;line-height:1.9;color:#bdc9de;margin-top:25px;max-width:490px}
.value-example{padding:24px 25px;margin-top:35px;border:1px solid #acc5fa38;border-radius:16px;background:linear-gradient(140deg,#9fbaff0c,#15213c29);position:relative;overflow:hidden}
.value-example:before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 100% 0,#a9c4ff0e,transparent 60%)}
.value-example-label{display:flex;gap:9px;align-items:center;font-size:10px;letter-spacing:.6px;font-weight:600;color:#c3d3ef;line-height:1.7}
.value-example-label .status-dot{width:5px;height:5px}
.value-example>p{font-size:14px;line-height:1.9;color:#b9c7df;margin-top:17px;position:relative}
.value-example>strong{font-size:14px;line-height:1.8;font-weight:550;color:#e1eaff;display:block;border-top:1px solid #bfd2fb26;margin-top:18px;padding-top:16px}
.value-benefits{border-top:1px solid #b8cdf938}
.value-benefit{display:grid;grid-template-columns:25px minmax(0,1fr) 21px;gap:17px;border-bottom:1px solid #b8cdf92b;padding:26px 0}
.value-number{color:#a8b9db;font-size:11px;letter-spacing:1px;padding-top:5px;line-height:1.5}
.value-benefit h3{font-size:20px;font-weight:550;letter-spacing:-.5px;line-height:1.4;color:#eaf0ff}
.value-benefit p{font-size:15px;line-height:1.9;color:#b8c6dd;margin-top:12px}
.value-benefit>svg{width:21px;height:21px;color:#afc5f3;margin-top:4px;opacity:.9}
.value-journey{border-top:1px solid #c5d5f533;border-bottom:1px solid #c5d5f533;margin-top:65px;padding:30px 0;display:grid;grid-template-columns:1fr 1.2fr;gap:9%;align-items:center}
.value-journey .eyebrow{font-size:10px;letter-spacing:.8px;color:#b4c4e1}
.value-journey h3{font-size:23px;font-weight:550;letter-spacing:-.6px;line-height:1.4;margin-top:12px}
.value-journey ol{display:flex;align-items:start;gap:14px;list-style:none;padding:0;margin:0}
.value-journey li{font-size:12px;line-height:1.8;flex:1;color:#cedaf0;position:relative;padding-top:40px}
.value-journey li>span{position:absolute;top:0;left:0;display:grid;place-items:center;height:26px;width:26px;border:1px solid #bed0f96b;border-radius:50%;font-size:10px;color:#d7e5ff;background:#182238}
.value-journey li:not(:last-child):after{content:'';position:absolute;top:13px;left:38px;right:0;height:1px;background:linear-gradient(90deg,#91aae063,transparent)}
.value-footer{display:flex;align-items:center;justify-content:space-between;gap:40px;margin-top:30px}
.value-footer>p{max-width:660px;font-size:14px;line-height:1.9;color:#aebed8}
.value-footer .text-link{font-size:14px;line-height:1.6;flex-shrink:0;color:#d1dfff}
@media(max-width:1100px){.value-layout{gap:6%;grid-template-columns:1fr 1.1fr}.value-journey{gap:6%;grid-template-columns:1fr 1.1fr}.value-intro h2{font-size:37px}.value-benefit{gap:12px;grid-template-columns:20px minmax(0,1fr) 19px}.value-benefit h3{font-size:18px}.value-benefit p{font-size:14px}.value-intro>p{font-size:15px}.value-example{padding:22px}.value-example>p{font-size:14px}.value-journey h3{font-size:20px}.value-footer>p{max-width:540px}.value-footer{gap:25px}.value-footer .text-link{font-size:13px}.hero-copy .platform-note{max-width:380px}.platform-note small{flex-basis:100%;padding-top:2px}}
@media(max-width:700px){.studio-value-section .section-top{align-items:start;margin-bottom:32px;gap:18px}.studio-value-section .section-top>.eyebrow{font-size:10px;line-height:1.8;max-width:190px;letter-spacing:.5px}.value-signature{font-size:20px;gap:5px}.value-signature>span{font-size:10px}.value-layout{display:flex;flex-direction:column;gap:38px}.value-intro h2{font-size:39px;line-height:1.2;letter-spacing:-1.9px}.value-intro>p{font-size:16px;line-height:1.9;max-width:none}.value-example{margin-top:28px;padding:22px}.value-example-label{font-size:9px;letter-spacing:.4px}.value-example>p,.value-example>strong{font-size:14px}.value-benefit{padding:25px 0;grid-template-columns:20px minmax(0,1fr) 18px;gap:12px}.value-benefit h3{font-size:19px;line-height:1.5}.value-benefit p{font-size:15px;line-height:1.85}.value-benefit>svg{width:18px;height:18px;margin-top:5px}.value-journey{display:block;margin-top:38px;padding:28px 0}.value-journey h3{font-size:23px}.value-journey ol{margin-top:25px;gap:12px}.value-journey li{font-size:12px;line-height:1.7}.value-journey .eyebrow{font-size:10px;letter-spacing:.6px}.value-footer{display:block;margin-top:24px}.value-footer>p{font-size:14px;line-height:1.9}.value-footer .text-link{font-size:14px;margin-top:22px;display:inline-flex}.hero-copy .platform-note{gap:9px;margin-top:24px}.platform-note .platform-badge{padding:9px 12px;font-size:12px}.platform-note small{font-size:12px}.concept-label{font-size:12px}.hero-description{max-width:none}.demo-head>span{font-size:7px;letter-spacing:.35px}}
@media(max-width:370px){.value-intro h2{font-size:34px}.studio-value-section .section-top>.eyebrow{font-size:9px;max-width:165px}.value-signature{font-size:18px}.value-signature>span{font-size:9px}.value-example{padding:19px}.value-benefit{grid-template-columns:18px minmax(0,1fr);gap:10px}.value-benefit>svg{display:none}.value-benefit h3{font-size:18px}.value-journey h3{font-size:21px}.value-journey li{font-size:11px}.value-journey ol{gap:9px}.value-example-label{font-size:8px}.demo-head>span{font-size:7px}.desktop-nav{margin-left:0}}
