/* Science's homepage visual language, shared by section hubs and existing chapters. */
.science-brand {
  --bg:#fff; --panel:#f4f8f9; --line:#dfE8ed; --ink:#102530;
  --muted:#536b77; --dim:#607987; --teal:#13b8d0; --blue:#248aa8;
  --sc-night:#09131b; --sc-cyan:#26d5ec; --sc-max:1400px;
  color:var(--ink); background:#fff; font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.science-brand *, .science-brand *::before, .science-brand *::after { box-sizing:border-box; }
.science-brand a { text-underline-offset:4px; }
.science-brand .peel-header { padding:0; background:rgba(7,17,24,.97); border-bottom:1px solid #1e3542; }
.science-nav-inner { max-width:1500px; margin:auto; padding:18px clamp(20px,3.4vw,56px); display:flex; align-items:center; gap:30px; }
.science-logo { display:inline-flex; align-items:center; gap:12px; color:#32d9ed; font-size:23px; font-weight:650; text-decoration:none; white-space:nowrap; }
.science-logo span { height:21px; width:1px; background:#39515d; }
.science-logo b { color:#f3f8fb; font-weight:600; }
.science-nav { display:flex; align-items:center; gap:clamp(12px,1.6vw,25px); }
.science-nav a { position:relative; padding:9px 0; font-size:13px; font-weight:550; color:#cfdee5; text-decoration:none; white-space:nowrap; }
.science-nav a:hover, .science-nav a[aria-current] { color:#49e1f3; }
.science-nav a[aria-current]::after { content:""; position:absolute; height:2px; background:#27cee6; bottom:0; left:0; right:0; }
.science-nav-actions { display:flex; margin-left:auto; align-items:center; gap:12px; white-space:nowrap; font-size:12px; }
.science-nav-actions a { text-decoration:none; }
.science-nav-actions .lang-toggle { color:#a4bdc9; }
.science-demo { border:1px solid #52707e; border-radius:5px; padding:9px 12px; color:#e7f4f9; }
.science-pilot { background:#1bcde4; color:#07232c; padding:10px 13px; border-radius:5px; font-weight:650; }
/* Match homepage navigation on narrow screens without losing any destination. */
.pr-top .pr-in { flex-wrap:wrap; }
.pr-topnav { flex-wrap:wrap; }
.sc-wrap { max-width:var(--sc-max); padding-left:clamp(22px,4vw,64px); padding-right:clamp(22px,4vw,64px); margin:auto; }
.science-brand h1,.science-brand h2,.science-brand h3 { letter-spacing:-.035em; color:inherit; }
.sc-hero { background:radial-gradient(ellipse at 78% 45%,#143944 0,transparent 43%),linear-gradient(125deg,#091016,#0b1b26); color:#eef8fb; overflow:hidden; }
.sc-hero-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:50px; min-height:540px; align-items:center; padding-top:70px; padding-bottom:65px; }
.sc-eyebrow { display:block; font-size:10px; font-weight:700; letter-spacing:.18em; color:#577c8b; margin-bottom:18px; text-transform:uppercase; }
.sc-hero .sc-eyebrow { color:#8db3c3; }
.science-brand .sc-hero h1 { font-size:clamp(35px,3.5vw,58px); line-height:1.08; text-wrap:balance; margin:0 0 24px; max-width:700px; }
.sc-hero-copy>p { font-size:16px; line-height:1.8; color:#b0c9d5; max-width:600px; }
.sc-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.sc-primary,.sc-secondary { display:inline-flex; justify-content:center; align-items:center; gap:14px; padding:13px 19px; border-radius:5px; font-size:13px; font-weight:650; text-decoration:none; transition:transform .2s,box-shadow .2s; }
.sc-primary { background:#20cde4; color:#06232b; border:1px solid #20cde4; }
.sc-secondary { border:1px solid #42606e; color:#e4f4f9; }
.sc-primary:hover,.sc-secondary:hover { transform:translateY(-3px); box-shadow:0 9px 26px #1ad2e52b; text-decoration:none; }
.sc-signals { display:flex; gap:24px; flex-wrap:wrap; color:#87a9b9; font-size:11px; margin-top:28px; }
/* The hero sculpture uses real CSS depth, layered translucent records and orbital geometry. */
.sc-scene { position:relative; height:360px; perspective:950px; isolation:isolate; }
.sc-halo { position:absolute; inset:12%; border-radius:50%; background:radial-gradient(ellipse,#36dbee26,transparent 67%); filter:blur(12px); }
.sc-object { position:absolute; inset:0; transform-style:preserve-3d; transform:rotateX(var(--rx,-8deg)) rotateY(var(--ry,-13deg)); transition:transform .4s ease-out; }
.sc-sheet { position:absolute; left:17%; top:20%; width:67%; height:205px; border:1px solid #62d9ed70; border-radius:15px; background:linear-gradient(135deg,#1e485aee,#081923f5); box-shadow:12px 25px 38px #0005,inset 0 1px 0 #b8f5ff55; padding:24px; transform:rotateX(18deg) rotateY(-25deg) rotateZ(-9deg) translateZ(20px); }
.sc-sheet.s0 { transform:translate(-37px,-45px) rotateX(18deg) rotateY(-25deg) rotateZ(-9deg) translateZ(-40px); opacity:.52; }
.sc-sheet.s1 { transform:translate(-17px,-18px) rotateX(18deg) rotateY(-25deg) rotateZ(-9deg); opacity:.8; }
.sc-sheet.s2 { transform:translate(20px,25px) rotateX(18deg) rotateY(-25deg) rotateZ(-9deg) translateZ(60px); }
.sc-sheet span { display:block; color:#bdeff7; font-size:11px; letter-spacing:.12em; text-transform:uppercase; }
.sc-sheet b { position:absolute; right:30px; bottom:17px; font-size:65px; font-weight:400; color:#42e3f4; text-shadow:0 0 25px #26dfed99; }
.sc-lines { margin-top:27px; height:68px; width:65%; background:repeating-linear-gradient(0deg,transparent 0 13px,#70bfce55 14px 16px); mask-image:linear-gradient(90deg,#000,transparent); }
.sc-orbit { position:absolute; left:5%; top:20%; width:90%; height:65%; border-radius:50%; border:1px solid #40a7bd40; transform:rotate(-28deg); }
.sc-orbit.o1 { transform:rotate(40deg); }.sc-orbit.o2 { transform:rotate(75deg); opacity:.5; }
.sc-node { --a:calc(var(--i)*30deg); position:absolute; top:50%; left:50%; width:7px; height:7px; border-radius:50%; background:radial-gradient(circle at 30% 30%,#d7fcff,#27bcd9 48%,#106080); box-shadow:0 0 14px #31dafa80; transform:rotate(var(--a)) translateX(clamp(130px,16vw,220px)); }
.sc-scene-caption { position:absolute; bottom:0; width:100%; text-align:center; color:#5e8a9e; font-size:9px; letter-spacing:.2em; }
.sc-scene-integrations .sc-sheet { border-color:#53e3bf80; }.sc-scene-trust .sc-object { filter:hue-rotate(12deg); }.sc-scene-use-cases .sc-object { filter:hue-rotate(-15deg); }
.sc-jump { background:#f5f9fa; border-bottom:1px solid #dfe9ee; }
.sc-jump .sc-wrap { display:flex; gap:25px; flex-wrap:wrap; padding-top:20px; padding-bottom:20px; }
.sc-jump a { font-size:12px; color:#506e7b; text-decoration:none; }.sc-jump a:hover { color:#057d96; }
.sc-explore { padding-top:76px; padding-bottom:82px; }
.sc-section-heading { margin-bottom:35px; }
.science-brand .sc-section-heading h2 { font-size:clamp(25px,2.6vw,38px); margin:0; }
.sc-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; perspective:1200px; }
.sc-card { display:flex; flex-direction:column; min-height:295px; border:1px solid #dce6eb; border-radius:10px; padding:28px; background:linear-gradient(140deg,#fff 60%,#f1f8fa); box-shadow:0 3px 0 #eaf0f4; scroll-margin-top:120px; transform:perspective(800px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)); transition:transform .25s,box-shadow .25s,border-color .25s; }
.sc-card:hover { border-color:#78c5d4; box-shadow:0 18px 36px #11354c13,0 4px 0 #c9e7ee; }
.sc-card-top { display:flex; justify-content:space-between; color:#22aec4; font-size:12px; margin-bottom:25px; }
.science-brand .sc-card h2 { font-size:22px; line-height:1.25; margin:0 0 15px; letter-spacing:-.025em; }
.sc-card p { font-size:14px; color:#56707d; line-height:1.75; margin:0 0 22px; }
.sc-card-link { margin-top:auto; color:#0588a3; font-size:12px; font-weight:650; text-decoration:none; }
.sc-card-link span { margin-left:10px; }
.sc-method { background:#09141d; color:#e8f7fc; padding:65px 0; }
.sc-method h2 { font-size:clamp(25px,2.5vw,37px); max-width:600px; margin:0; }
.sc-method .sc-eyebrow { color:#80abba; }
.sc-flow { display:grid; grid-template-columns:repeat(5,1fr); gap:22px; margin:40px 0 25px; }
.sc-flow>div { border-top:1px solid #284652; padding-top:20px; display:flex; align-items:center; gap:12px; }
.sc-flow span { display:grid; place-items:center; width:30px; height:30px; background:#0e4050; color:#53d9e9; border-radius:50%; font-size:11px; }
.sc-flow b { font-size:14px; font-weight:550; }
.sc-method a { color:#38cfe4; font-size:12px; }
.sc-close { background:linear-gradient(125deg,#ecf4f7,#dbeaf0); padding:65px 0; }
.sc-close>.sc-wrap { display:flex; gap:40px; align-items:center; justify-content:space-between; }
.sc-close h2 { font-size:clamp(26px,3vw,40px); margin:0 0 15px; }
.sc-close p { max-width:720px; color:#5a7481; font-size:14px; line-height:1.7; }
.sc-close .sc-primary { flex-shrink:0; }
.science-brand .site-footer { background:#080f15; color:#9eb3bf; margin:0; }
.sc-footer { display:grid; grid-template-columns:1fr 1fr; padding-top:45px; padding-bottom:30px; gap:40px; }
.sc-footer p { max-width:290px; font-size:12px; line-height:1.8; }
.sc-footer nav { display:grid; grid-template-columns:repeat(2,1fr); gap:15px; }
.sc-footer nav a { font-size:12px; color:#a4bbc7; text-decoration:none; }
.sc-copyright { font-size:10px; color:#698593; padding-bottom:25px; }
/* Existing inner chapters keep their detailed content and interactive tools. */
.science-brand:not(.science-section) main>.band { max-width:none; padding:72px max(24px,calc((100vw - 1272px)/2)); text-align:left; border:0; }
.science-brand:not(.science-section) main>.band:nth-child(2n+3) { background:#f4f8fa; }
.science-brand:not(.science-section) main>.peel-hero { position:relative; background:radial-gradient(ellipse at 85% 40%,#17404d,transparent 48%),#09141d; color:#f1f7fa; min-height:440px; padding-top:62px; padding-bottom:62px; overflow:hidden; display:flow-root; }
.science-brand:not(.science-section) .peel-hero h1 { margin-left:0; margin-right:0; max-width:820px; font-size:clamp(34px,3.7vw,56px); line-height:1.1; }
.science-brand:not(.science-section) .peel-hero .lede { color:#b1c8d4; font-size:16px; line-height:1.8; }
.science-brand:not(.science-section) .peel-hero .peel-caption { color:#8ba9b8; }
.science-brand:not(.science-section) .peel-hero-mascot { float:right; position:relative; z-index:1; width:clamp(200px,28vw,340px); height:auto; margin:0 0 22px 55px; border-radius:18px; transform:perspective(850px) rotateY(-10deg) rotateX(4deg); box-shadow:20px 24px 60px #0005,0 0 55px #33dded18; }
.science-brand:not(.science-section) .peel-hero-fx { opacity:.2; pointer-events:none; }
.science-brand .grad { background:none; -webkit-text-fill-color:#29d2e7; color:#29d2e7; }
.science-brand:not(.science-section) .band h2 { font-size:clamp(27px,3vw,42px); }
.science-brand:not(.science-section) .band>.lede { max-width:850px; margin-left:0; font-size:16px; }
.science-brand:not(.science-section) .peel-actions { justify-content:flex-start; }
.science-brand .peel-button { border-radius:5px; border-color:#53727e; color:inherit; }
.science-brand .peel-button.primary { background:#20cce3; border-color:#20cce3; color:#06232b; }
.science-brand .peel-card,.science-brand .peel-lab-tile,.science-brand .peel-note,.science-brand .peel-flow>div { color:#17313e; background:#fff; border:1px solid #dce7ec; border-radius:9px; box-shadow:0 4px 0 #eaf1f4; }
.science-brand .peel-card p,.science-brand .peel-lab-tile p,.science-brand .peel-flow p { color:#536e7c; }
.science-brand .peel-card:hover,.science-brand .peel-lab-tile:hover { transform:translateY(-6px); box-shadow:0 18px 35px #24485615; border-color:#74c5d5; }
.science-brand .peel-card,.science-brand .peel-lab-tile { transition:transform .25s,box-shadow .25s; }
.science-brand .peel-note { border-left:3px solid #1fc9df; padding:25px; background:#edf6f8; }
.science-brand .peel-more { color:#0486a0; }
.science-brand .peel-lab-bench>h3 { color:#557582; }
.science-brand .peel-lab-tools { color:#69818c; }
.science-brand .peel-stats strong { color:#0b849c; }
.science-brand .peel-video { background:#09141d; color:#ddebf2; }
.science-brand .peel-video .peel-caption { color:#a9c1cc; }
.science-brand .peel-footer-inner,.science-brand .peel-footer-bottom { color:#8da7b5; }
.science-brand .peel-footer-inner .peel-brand { color:#e3f6fc; }
.science-brand .skip:focus { color:#fff; }
.science-brand :focus-visible { outline:3px solid #1bbdd7; outline-offset:5px; }
@media(max-width:1200px) {
 .science-nav-inner { flex-wrap:wrap; gap:10px 22px; }.science-nav { order:3; flex-basis:100%; justify-content:space-between; }.science-nav-actions { margin-left:auto; }
 .sc-hero-grid { gap:20px; }.sc-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .pr-topnav { order:3; flex-basis:100%; margin-left:0; justify-content:space-between; }
}
@media(max-width:720px) {
 .science-nav-inner { padding:14px 20px; }.science-logo { font-size:19px; }.science-nav { gap:8px 18px; flex-wrap:wrap; justify-content:flex-start; }.science-nav a { font-size:12px; }
 .science-nav-actions { gap:9px; font-size:11px; }.science-pilot { display:none; }
 .sc-hero-grid { grid-template-columns:1fr; padding-top:40px; padding-bottom:25px; gap:15px; }.sc-hero h1 { font-size:36px; }.sc-scene { height:310px; max-width:460px; width:100%; margin:auto; }
 .sc-grid { grid-template-columns:1fr; }.sc-card { min-height:250px; }.sc-explore { padding-top:45px; padding-bottom:45px; }.sc-jump .sc-wrap { gap:12px 20px; }
 .sc-flow { grid-template-columns:repeat(2,1fr); }.sc-close>.sc-wrap { align-items:flex-start; flex-direction:column; gap:20px; }.sc-footer { grid-template-columns:1fr; }
 .science-brand:not(.science-section) .peel-hero-mascot { float:none; display:block; width:190px; margin:0 auto 35px; }
 .science-brand:not(.science-section) main>.band { padding:45px 22px; }
 .pr-topacts .pr-btn { padding:9px 11px; }.pr-top .pr-in { gap:16px; }.pr-topnav { gap:12px 20px; justify-content:flex-start; }.pr-logo { font-size:20px; }
}
@media(prefers-reduced-motion:reduce) {
 .sc-object,.sc-card,.science-brand .peel-card,.science-brand .peel-lab-tile,.sc-primary,.sc-secondary { transition:none; }
 .sc-card:hover,.science-brand .peel-card:hover,.science-brand .peel-lab-tile:hover,.sc-primary:hover,.sc-secondary:hover { transform:none; }
}
/* Immersive Science layer: sculptural heroes, film stages and restrained motion. */
.science-brand { --sc-max:1500px; }
.sc-wrap { padding-left:clamp(20px,3.4vw,56px); padding-right:clamp(20px,3.4vw,56px); }
.sc-hero-grid { min-height:550px; padding-top:60px; padding-bottom:55px; }
.science-brand .sc-hero h1 { font-size:clamp(34px,3.15vw,54px); letter-spacing:-.022em; }
.sc-hero h1>span { color:#3fe3f6; }
.sc-art-column { position:relative; min-width:0; }
.sc-scene { height:390px; }
.sc-scene { --rx:0deg; --ry:0deg; }
.sc-halo { inset:0; background:radial-gradient(ellipse,#25c4e22b,transparent 65%); filter:blur(20px); }
.sc-motion-toggle { display:block; margin:18px auto 0; padding:6px 12px; border:1px solid #3d5d69; border-radius:20px; background:#0b1c27; color:#97b6c5; font:inherit; font-size:10px; cursor:pointer; }
.sc-motion-toggle:hover { color:#e4faff; border-color:#44bccc; }
.sc-motion-toggle[hidden] { display:none; }
.sv-float { position:absolute; left:50%; top:50%; transform-style:preserve-3d; animation:sv-hover 7s ease-in-out infinite; animation-play-state:paused; }
.sc-scene.is-visible .sv-float { animation-play-state:running; }
@keyframes sv-hover { 0%,100% { transform:translateY(-9px) rotateZ(-2deg); } 50% { transform:translateY(9px) rotateZ(2deg); } }
/* Six translucent faces form a solid, genuinely three-dimensional object. */
.sv-cube-wrap { width:180px; height:180px; margin:-90px; }
.sv-cube { width:180px; height:180px; position:relative; transform-style:preserve-3d; transform:rotateX(-24deg) rotateY(35deg) rotateZ(-6deg); }
.sv-face { position:absolute; width:180px; height:180px; border:1px solid #75efff9c; background:linear-gradient(145deg,#71dff733,#0b60795c); box-shadow:inset 0 0 30px #42dafa26; backface-visibility:visible; }
.sv-face::after { content:""; position:absolute; inset:14px; border:1px solid #64dce34d; background:repeating-linear-gradient(0deg,transparent 0 28px,#65eaff24 29px 30px),repeating-linear-gradient(90deg,transparent 0 28px,#65eaff24 29px 30px); }
.sv-face span { display:grid; place-items:center; height:100%; font-size:66px; color:#9ff5ff; text-shadow:0 0 35px #3ce9fc; }
.sv-front { transform:translateZ(90px); }.sv-back { transform:rotateY(180deg) translateZ(90px); }.sv-left { transform:rotateY(-90deg) translateZ(90px); }.sv-right { transform:rotateY(90deg) translateZ(90px); }.sv-top { transform:rotateX(90deg) translateZ(90px); }.sv-bottom { transform:rotateX(-90deg) translateZ(90px); }
.sv-cube-shadow { position:absolute; bottom:-87px; width:220px; height:35px; left:-20px; border-radius:50%; background:#0007; filter:blur(15px); transform:rotateX(45deg); }
.sv-hub { width:1px; height:1px; }
.sv-core { display:grid; place-items:center; position:absolute; inset:-49px; border-radius:50%; color:#d3faff; font-size:49px; border:1px solid #51e4f1; background:radial-gradient(circle at 35% 25%,#318dab,#092e42 70%); box-shadow:0 0 60px #1dd9ed33,inset 3px 3px 15px #a7faff42; }
.sv-pod { position:absolute; width:93px; height:45px; margin:-22px -46px; display:grid; place-items:center; color:#b7eaf5; font-size:12px; border:1px solid #5098ab; border-radius:9px; background:linear-gradient(145deg,#1c475a,#0a1c2b); box-shadow:7px 9px 0 #05121b,7px 9px 0 1px #296373; transform:translate3d(var(--x),var(--y),40px); }
.sv-hub-ring { position:absolute; width:320px; height:230px; margin:-115px -160px; border:1px solid #3daabd66; border-radius:50%; transform:rotateZ(-12deg); }
.sv-molecule { width:1px; height:1px; }
.sv-atom { position:absolute; width:var(--size); height:var(--size); margin:calc(var(--size)/-2); border-radius:50%; transform:translate3d(var(--x),var(--y),var(--z)); background:radial-gradient(circle at 30% 24%,#e2fbff,#75b3ce 27%,#235474 65%,#061a29); box-shadow:5px 9px 11px #0006,inset -3px -4px 7px #00132266; }
.sv-atom:nth-child(3n) { background:radial-gradient(circle at 30% 24%,#bafcff,#29cde2 26%,#047c9f 65%,#00223d); }
.sv-orb { width:1px; height:1px; }
.sv-orb-core { position:absolute; width:105px; height:105px; margin:-52px; display:grid; place-items:center; border-radius:50%; color:#bffaff; font-size:58px; background:radial-gradient(circle at 30% 23%,#5defff,#078da9 35%,#061d36 80%); box-shadow:0 0 65px #1bc5de55; }
.sv-ring { position:absolute; width:270px; height:270px; margin:-135px; border:2px solid #6edbe785; border-radius:50%; transform:rotateX(65deg) rotateY(-25deg); transform-style:preserve-3d; box-shadow:0 0 17px #27b6c51c,inset 0 0 17px #27b6c51c; }
.sv-ring.ring-1 { transform:rotateX(-25deg) rotateY(68deg); }.sv-ring.ring-2 { transform:rotateX(38deg) rotateY(38deg); }
.sv-ring i { position:absolute; width:17px; height:17px; top:28px; left:30px; border-radius:50%; background:#bbfcff; box-shadow:0 0 20px #44e8ff; }
.sv-shield { width:200px; height:230px; margin:-115px -100px; }
.sv-shield-front,.sv-shield-back { position:absolute; inset:0; transform:rotateY(-22deg) rotateX(8deg); }
.sv-shield-back { transform:translate(-17px,10px) rotateY(-22deg) rotateX(8deg) translateZ(-28px); }
.sv-shield svg { width:100%; height:100%; overflow:visible; filter:drop-shadow(12px 20px 16px #0005); }
.sv-shield svg path:first-child { fill:#14627bd9; stroke:#6ee8f5; stroke-width:1.4; }
.sv-shield-back svg path:first-child { fill:#081e2e; stroke:#34758c; }
.sv-shield .sv-check { fill:none; stroke:#c0ffff; stroke-width:9; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 0 8px #47d3ec); }
.sv-stack { width:255px; height:190px; margin:-95px -127px; transform-style:preserve-3d; }
.sv-stack>div { position:absolute; width:255px; height:155px; top:calc(var(--layer)*-33px + 35px); left:calc(var(--layer)*16px - 16px); padding:22px; background:linear-gradient(145deg,#286079,#0a2638); border:1px solid #76dce98f; border-radius:10px; transform:rotateX(42deg) rotateY(-18deg) rotateZ(-18deg) translateZ(calc(var(--layer)*20px)); box-shadow:-7px 10px 0 #071823, -7px 10px 0 1px #35829888; }
.sv-stack span { display:block; color:#cdf9ff; font-size:12px; letter-spacing:.07em; margin-bottom:17px; }
.sv-stack i { display:block; height:4px; width:65%; background:#78b6c680; margin:9px 0; border-radius:3px; }.sv-stack i:nth-child(3) { width:42%; }.sv-stack i:nth-child(4) { width:52%; }
.sc-film { padding:30px 0 90px; background:#fff; }
.sc-film-grid { display:grid; grid-template-columns:.75fr 1.3fr; gap:75px; align-items:center; }
.sc-film-copy h2 { font-size:clamp(27px,2.7vw,40px); line-height:1.13; margin-bottom:20px; }
.sc-film-copy p { font-size:15px; line-height:1.8; color:#566974; }
.sc-film-copy .sc-film-note { font-size:12px; color:#6b818d; }
.sc-film-copy>a { display:inline-block; margin-top:20px; color:#02879f; font-size:13px; font-weight:600; }
.sc-film-frame { position:relative; margin:0; background:#08131c; border:1px solid #466171; border-radius:11px; box-shadow:0 25px 55px #143b4e26,0 7px 0 #d5e2e9; transform:perspective(1000px) rotateX(var(--rx,2deg)) rotateY(var(--ry,-3deg)); transition:transform .4s; overflow:hidden; }
.sc-film-chrome { display:flex; justify-content:space-between; padding:14px 18px; border-bottom:1px solid #23404d; color:#739aa9; font-size:9px; letter-spacing:.1em; }
.sc-window-dots { color:#3c7384; letter-spacing:4px; }
.sc-film-frame video { width:100%; aspect-ratio:16/9; display:block; object-fit:contain; background:#050a10; }
.sc-film-frame figcaption { padding:16px 20px; font-size:11px; color:#91b1c0; border-top:1px solid #203945; }
.sc-film-frame[data-playing] { transform:none; }
.sc-card { position:relative; overflow:hidden; }
.sc-card::after { content:""; pointer-events:none; position:absolute; inset:0; background:radial-gradient(350px circle at var(--mx,50%) var(--my,0%),#2bd2e710,transparent 65%); opacity:0; transition:opacity .3s; }
.sc-card:hover::after { opacity:1; }
.sc-card-top>span:first-child { display:grid; place-items:center; width:32px; height:32px; border:1px solid #a8dce5; border-radius:7px; background:linear-gradient(135deg,#fff,#def3f7); box-shadow:3px 4px 0 #dcecf1; transform:rotate(-7deg); }
.sc-card-top>span:last-child { padding-top:8px; }
.sc-reveal { opacity:.45; transform:translateY(18px); transition:opacity .65s ease,transform .65s ease; }
.sc-reveal.is-visible { opacity:1; transform:translateY(0); }
.science-brand .sc-close { position:relative; overflow:hidden; }
.science-brand .sc-close::after { content:""; position:absolute; width:340px; height:340px; right:-90px; bottom:-250px; border:1px solid #9cbcc9; box-shadow:0 0 0 35px #b7d0db30,0 0 0 70px #b7d0db20; transform:rotate(40deg); pointer-events:none; }
.sc-motion-paused .sv-float,.sc-page-hidden .sv-float { animation-play-state:paused !important; }
.sc-motion-paused .sc-object { transform:none; }
@media(max-width:900px) {
 .sc-film-grid { grid-template-columns:1fr; gap:30px; }.sc-film-copy { max-width:650px; }.sc-film { padding-bottom:55px; }
}
@media(max-width:720px) {
 .sc-hero-grid { min-height:0; padding-top:40px; padding-bottom:30px; }.sc-scene { height:350px; }.sc-scene .sc-object { transform:scale(.82); }.sc-film-frame { transform:none; }.sc-film-chrome { font-size:8px; gap:10px; }.sc-film-chrome>span:last-child { display:none; }
 .sc-motion-toggle { margin-top:0; }
}
@media(prefers-reduced-motion:reduce) {
 .sv-float { animation:none !important; }.sc-object,.sc-film-frame { transform:none; }.sc-reveal { opacity:1; transform:none; transition:none; }
 .sc-card::after { transition:none; }
}

.sc-motion-paused .sc-reveal { opacity:1; transform:none; transition:none; }

/* 2026 product stories: each chapter earns a distinct visual and narrative job. */
.sx-dark { color:#eaf8fb; background:#07131b; }
.sx-head { max-width:820px; margin-bottom:42px; }
.sx-head h2 { margin:0 0 16px; font-size:clamp(31px,4vw,58px); line-height:1.02; text-wrap:balance; }
.sx-head p { max-width:720px; color:#607581; font-size:16px; line-height:1.75; }
.sx-dark .sx-head p { color:#9bb4c0; }
.sx-product,.sx-model,.sx-integrations,.sx-cases,.sx-how,.sx-trust,.sx-dev { padding:clamp(72px,9vw,132px) 0; overflow:hidden; }
.sx-feature-grid { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid #294550; border-radius:20px; overflow:hidden; background:#0b1b24; box-shadow:0 35px 90px #0005; }
.sx-feature-grid article { min-height:220px; padding:30px; border-right:1px solid #294550; border-bottom:1px solid #294550; }
.sx-feature-grid article:nth-child(3n) { border-right:0; }
.sx-feature-grid article:nth-child(n+4) { border-bottom:0; }
.sx-icon { display:grid; place-items:center; width:42px; height:42px; margin-bottom:26px; border:1px solid #36cee0; border-radius:12px; color:#66ebf7; background:#102d38; box-shadow:0 0 28px #1bcee52e; }
.sx-feature-grid h3 { margin:0 0 12px; font-size:22px; color:#f0fbfd; }
.sx-feature-grid p { margin:0; color:#8fabb7; line-height:1.65; font-size:14px; }
.sx-demo-cta { display:flex; justify-content:space-between; align-items:center; gap:25px; padding:24px 28px; color:#b7d0da; border:1px solid #294550; border-top:0; border-radius:0 0 20px 20px; }
.sx-demo-cta a { color:#55e6f5; font-weight:700; text-decoration:none; }
.sx-model { background:radial-gradient(circle at 50% 30%,#dbf8fb 0,#fff 44%); }
.sx-versus { display:grid; grid-template-columns:1fr 78px 1fr; align-items:stretch; }
.sx-versus article { padding:42px; border:1px solid #d9e5e9; border-radius:18px; background:#f3f6f7; box-shadow:0 18px 60px #274b5c12; }
.sx-versus article.on { color:#e7f9fc; border-color:#26798b; background:linear-gradient(145deg,#123847,#071821); box-shadow:0 24px 70px #09263135; }
.sx-versus article>span { color:#238ea4; font-size:11px; font-weight:800; letter-spacing:.16em; }
.sx-versus h3 { font-size:clamp(25px,3vw,38px); margin:18px 0 28px; }
.sx-versus ul { margin:0; padding:0; list-style:none; }
.sx-versus li { padding:14px 0; border-top:1px solid #d5e0e4; color:#5f727b; }
.sx-versus .on li { color:#a9c8d3; border-color:#274b59; }
.sx-vs { display:grid; place-items:center; color:#3ab4c8; font-weight:900; font-size:13px; }
.sx-benchmark { display:grid; grid-template-columns:auto 1fr auto 1fr; align-items:center; gap:8px 20px; margin-top:34px; padding:25px 30px; border-radius:14px; color:#b1c7d1; background:#0a1b24; }
.sx-benchmark b { color:#46d8e9; font-size:28px; }
.sx-benchmark small { grid-column:1/-1; color:#65818d; }
.sv-model-word { position:absolute; width:180px; left:-90px; top:87px; color:#68dce8; font-size:10px; font-weight:800; letter-spacing:.18em; text-align:center; }
.sx-integrations { background:#eff6f7; }
.sx-pipeline { display:grid; grid-template-columns:1.25fr .55fr 1fr; align-items:center; gap:24px; }
.sx-source-cloud { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }
.sx-source-cloud span { padding:13px 8px; color:#315664; border:1px solid #d3e3e8; border-radius:8px; background:#fff; text-align:center; font-size:12px; box-shadow:0 8px 20px #264a5910; }
.sx-pipe { position:relative; display:flex; flex-direction:column; align-items:center; gap:12px; color:#1aa9bd; }
.sx-pipe::before,.sx-pipe::after { content:""; position:absolute; top:27px; width:45%; border-top:1px dashed #47b9c8; }
.sx-pipe::before { right:72%; }.sx-pipe::after { left:72%; }
.sx-pipe b { display:grid; place-items:center; width:58px; height:58px; border-radius:50%; color:#dfffff; background:#0d8fa5; box-shadow:0 0 0 12px #6dd7e326,0 0 45px #1bbbd047; font-size:27px; }
.sx-pipe span { font-size:9px; font-weight:800; letter-spacing:.13em; }
.sx-output { display:flex; flex-direction:column; gap:11px; padding:42px; color:#e9f8fb; border-radius:18px; background:#0b202b; box-shadow:0 24px 55px #102f3d30; }
.sx-output strong { font-size:25px; }.sx-output span { color:#8fafbc; font-size:13px; }
.sx-value { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:34px; }
.sx-value article { padding:26px 30px; border-left:3px solid #20bad0; background:#fff; }
.sx-value b { color:#087f93; }.sx-value p { margin-bottom:0; color:#526a75; line-height:1.65; }
.sx-cases { background:#fff; }
.sx-case-rows { border-top:1px solid #cbdde4; }
.sx-case-rows article { display:grid; grid-template-columns:80px .7fr 1.3fr; gap:30px; align-items:center; padding:30px 0; border-bottom:1px solid #cbdde4; transition:padding .25s,background .25s; }
.sx-case-rows article:hover { padding-left:18px; background:linear-gradient(90deg,#eefdff,transparent); }
.sx-case-rows span { color:#14a9bf; font:700 12px ui-monospace,monospace; }.sx-case-rows h3 { margin:0; font-size:25px; }.sx-case-rows p { margin:0; color:#55707c; font:500 14px ui-monospace,monospace; }
.sx-flowline { display:grid; grid-template-columns:repeat(5,1fr); position:relative; }
.sx-flowline::before { content:""; position:absolute; top:26px; left:8%; right:8%; border-top:1px solid #267787; }
.sx-flowline div { position:relative; display:flex; flex-direction:column; align-items:center; gap:14px; color:#dffaff; }
.sx-flowline span { display:grid; place-items:center; width:52px; height:52px; z-index:1; border:1px solid #38cadc; border-radius:50%; color:#63edfa; background:#09212b; box-shadow:0 0 0 8px #07131b; }
.sx-flowline b { font-size:12px; letter-spacing:.12em; }
.sx-receipt { display:grid; grid-template-columns:repeat(3,1fr) auto; align-items:center; gap:30px; margin-top:60px; padding:28px; border:1px solid #34535f; border-radius:12px; background:#0d212b; box-shadow:0 24px 60px #0004; }
.sx-receipt div { display:flex; flex-direction:column; gap:8px; }.sx-receipt span { color:#5f8998; font-size:9px; letter-spacing:.15em; }.sx-receipt strong { color:#dffaff; }.sx-receipt a { color:#4fe4f3; text-decoration:none; font-weight:700; }
.sx-trust { background:linear-gradient(160deg,#f8fbfc,#eaf4f6); }
.sx-trust-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:#cbdde3; border:1px solid #cbdde3; border-radius:18px; overflow:hidden; }
.sx-trust-grid article { padding:38px; background:#fff; }.sx-trust-grid .sx-icon { color:#138ca0; background:#eaf9fb; }.sx-trust-grid h3 { font-size:24px; margin:0 0 12px; }.sx-trust-grid p { color:#607680; line-height:1.7; }
.sx-dev { background:radial-gradient(circle at 78% 20%,#0c4050,#07131b 48%); }
.sx-code { max-width:920px; border:1px solid #345764; border-radius:16px; overflow:hidden; background:#071117; box-shadow:0 35px 90px #0008; }
.sx-code-tabs,.sx-code-foot { display:flex; gap:26px; padding:15px 22px; color:#6e95a4; border-bottom:1px solid #233f4a; font:600 10px ui-monospace,monospace; letter-spacing:.1em; }
.sx-code pre { margin:0; padding:32px; overflow:auto; color:#9feaf2; font:14px/1.75 ui-monospace,SFMono-Regular,Menlo,monospace; }
.sx-code-foot { border-top:1px solid #233f4a; border-bottom:0; color:#45c8da; }
.sx-dev-steps { display:flex; align-items:center; gap:18px; max-width:920px; margin-top:32px; color:#b6d0d9; }.sx-dev-steps i { flex:1; border-top:1px dashed #38717f; }
.science-product .sc-hero { background:radial-gradient(circle at 78% 48%,#17576a,#07131b 46%); }
.science-model .sc-hero { background:radial-gradient(circle at 75% 50%,#173963,#080d19 48%); }
.science-integrations .sc-hero { background:radial-gradient(circle at 77% 50%,#164f4e,#071718 48%); }
.science-use-cases .sc-hero { background:radial-gradient(circle at 75% 45%,#3e294b,#100f1b 50%); }
.science-how-it-works .sc-hero { background:radial-gradient(circle at 75% 45%,#313e66,#090f1b 50%); }
.science-trust .sc-hero { background:radial-gradient(circle at 75% 45%,#20465c,#08131b 50%); }
.science-developers .sc-hero { background:radial-gradient(circle at 75% 45%,#174e45,#071714 50%); }
@media(max-width:1100px) { .science-nav { overflow-x:auto; padding-bottom:3px; }.science-nav a { font-size:11px; }.sx-feature-grid { grid-template-columns:repeat(2,1fr); }.sx-feature-grid article { border:1px solid #294550; }.sx-pipeline { grid-template-columns:1fr; }.sx-pipe { flex-direction:row; justify-content:center; }.sx-pipe::before,.sx-pipe::after { display:none; }.sx-source-cloud { grid-template-columns:repeat(4,1fr); } }
@media(max-width:720px) { .sx-feature-grid,.sx-trust-grid,.sx-value { grid-template-columns:1fr; }.sx-demo-cta { align-items:flex-start; flex-direction:column; }.sx-versus { grid-template-columns:1fr; gap:15px; }.sx-vs { min-height:36px; }.sx-benchmark { grid-template-columns:1fr 1.5fr; }.sx-source-cloud { grid-template-columns:repeat(2,1fr); }.sx-case-rows article { grid-template-columns:50px 1fr; gap:12px; }.sx-case-rows p { grid-column:2; }.sx-flowline { grid-template-columns:1fr; gap:18px; }.sx-flowline::before { top:0; bottom:0; left:25px; right:auto; border-top:0; border-left:1px solid #267787; }.sx-flowline div { flex-direction:row; }.sx-receipt { grid-template-columns:1fr; }.sx-dev-steps { flex-wrap:wrap; }.sx-dev-steps i { min-width:20px; } }