/* Manrope (SIL OFL 1.1, assets/fonts/OFL.txt), self-hosted variable font 400-800, Google Fonts subsets. */
@font-face{font-family:Manrope;font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/manrope-cyrillic-ext.woff2) format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F}
@font-face{font-family:Manrope;font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/manrope-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:Manrope;font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/manrope-greek.woff2) format('woff2');unicode-range:U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF}
@font-face{font-family:Manrope;font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/manrope-vietnamese.woff2) format('woff2');unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB}
@font-face{font-family:Manrope;font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/manrope-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:Manrope;font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/manrope-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
/* CrossVoice website (C6-WEB01, direction C "Arena", D83). Brand: docs/logos (S2 identity). */
:root{
  --ink:#0A0A08; --surface:#141416; --surface2:#1B1B1F; --line:rgba(244,241,235,.1);
  --text:#F4F1EB; --muted:#B6B4BD; --pink:#F94E94; --pink-d:#D42A70; --warn:#FFD27A;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--ink);color:var(--text);font-family:Manrope,"Segoe UI",system-ui,sans-serif;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.wrap{max-width:1240px;margin:0 auto;padding:0 28px}
:focus-visible{outline:2px solid var(--pink);outline-offset:3px;border-radius:4px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* header */
.site-header{position:fixed;top:0;left:0;right:0;z-index:30;background:linear-gradient(180deg,rgba(10,10,8,.92),rgba(10,10,8,.55) 70%,rgba(10,10,8,0))}
.page-sub .site-header{background:rgba(10,10,8,.9);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;gap:28px;height:74px}
.brand img{height:30px;width:auto;display:block}
.nav-links{display:flex;gap:24px;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.nav-links a:hover,.nav-links a[aria-current]{color:var(--text)}
.nav-links a{white-space:nowrap}
.nav .sp{flex:1}
.lang{position:relative;font-size:13px;font-weight:700;color:var(--muted)}
.lang summary{list-style:none;cursor:pointer;border:1px solid var(--line);border-radius:8px;padding:7px 10px;white-space:nowrap}
.lang summary::-webkit-details-marker{display:none}
.lang ul{position:absolute;inset-inline-end:0;top:calc(100% + 6px);list-style:none;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:6px;min-width:200px;max-height:60vh;overflow:auto;box-shadow:0 20px 40px -10px rgba(0,0,0,.8);z-index:40}
.lang li a{display:block;padding:7px 10px;border-radius:6px;color:var(--text);font-weight:600}
.lang li a:hover,.lang li a[aria-current]{background:rgba(249,78,148,.14)}
.menu{display:none}
.btn{display:inline-flex;align-items:center;gap:10px;font-weight:800;border-radius:10px;padding:14px 24px;font-size:15px;letter-spacing:.01em;transition:transform .15s,box-shadow .15s}
button.btn{border:0;cursor:pointer;font-family:inherit}
.prose a.btn{color:inherit;text-decoration:none}
.prose a.btn-pink{color:var(--ink)}
.btn-pink{background:linear-gradient(180deg,#FF6AA6,var(--pink));color:var(--ink);box-shadow:0 0 0 1px rgba(255,255,255,.15) inset,0 10px 36px -8px rgba(249,78,148,.8)}
.btn-pink:hover{transform:translateY(-1px);box-shadow:0 0 0 1px rgba(255,255,255,.2) inset,0 14px 40px -8px rgba(249,78,148,.95)}
.btn-glass{background:rgba(244,241,235,.06);border:1px solid rgba(244,241,235,.18);backdrop-filter:blur(8px)}
.btn-sm{padding:9px 16px;font-size:13px}

/* hero scene */
.scene{position:relative;min-height:min(100vh,940px);display:flex;align-items:center;overflow:hidden;background:
  radial-gradient(ellipse 80% 50% at 50% 100%,rgba(249,78,148,.45),transparent 70%),
  radial-gradient(ellipse 50% 40% at 85% 20%,rgba(120,60,200,.18),transparent 70%),
  linear-gradient(180deg,#0B0A10 0%,#15101A 45%,#2A1222 78%,#0A0A08 100%)}
.ridge{position:absolute;left:0;right:0;bottom:0;pointer-events:none}
.r1{height:46%;background:#120D14;clip-path:polygon(0 58%,8% 40%,17% 55%,29% 22%,40% 48%,52% 30%,63% 52%,75% 18%,86% 44%,100% 28%,100% 100%,0 100%)}
.r2{height:30%;background:#0A0A08;clip-path:polygon(0 50%,11% 62%,23% 34%,35% 58%,47% 42%,58% 66%,70% 38%,82% 60%,93% 40%,100% 52%,100% 100%,0 100%)}
.glow{position:absolute;left:0;right:0;bottom:22%;height:2px;background:linear-gradient(90deg,transparent,rgba(249,78,148,.8),transparent);filter:blur(1px)}
.scene-ov{position:absolute;left:3%;bottom:9%;width:230px;height:auto;z-index:4;filter:drop-shadow(0 24px 40px rgba(0,0,0,.7))}
.scene-wheel{position:absolute;right:3%;bottom:7%;width:270px;height:auto;z-index:4;filter:drop-shadow(0 24px 40px rgba(0,0,0,.7))}
.hud{position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap;bottom:18px;font:700 11px "Segoe UI",sans-serif;color:rgba(244,241,235,.45);letter-spacing:.1em;text-transform:uppercase}
.scene-in{position:relative;z-index:5;text-align:center;margin:0 auto;max-width:1180px;padding:120px 24px 80px}
.pill{display:inline-flex;gap:10px;align-items:center;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;background:rgba(10,10,8,.5);border:1px solid rgba(249,78,148,.45);border-radius:999px;padding:7px 14px}
.pill i{width:8px;height:8px;border-radius:50%;background:var(--pink);box-shadow:0 0 12px var(--pink)}
h1{font-size:clamp(40px,6.2vw,90px);line-height:.98;letter-spacing:-.045em;font-weight:800;margin:24px 0 22px;text-shadow:0 10px 40px rgba(0,0,0,.6)}
h1 span{display:inline-block;padding-bottom:.14em;margin-bottom:-.14em;background:linear-gradient(90deg,#FF7DB2,var(--pink) 40%,#C93A7E);-webkit-background-clip:text;background-clip:text;color:transparent}
.scene-in p{font-size:19px;color:#D4D1D9;max-width:640px;margin:0 auto}
.cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin:34px 0 16px}
.meta{font-size:13px;color:var(--muted)}
.steam{display:inline-flex;gap:8px;align-items:center;margin-top:18px;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;background:rgba(10,10,8,.55);border:1px solid var(--line);border-radius:8px;padding:9px 14px}
.steam svg{width:18px;height:18px}

/* compatibility band (text wordmarks until official logos are approved) */
.band{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#0C0B0D;padding:28px 0}
.band .wrap{display:flex;align-items:center;justify-content:center;gap:16px 34px;flex-wrap:wrap}
.band p{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.mark{font-weight:800;font-size:19px;color:rgba(244,241,235,.6)}
.brand-logo{display:block;height:26px;width:auto}.brand-logo.tall{height:54px}
.brand-logo.plate{height:20px;padding:6px 10px;background:#F4F1EB;border-radius:6px;box-sizing:content-box}
.brand-logo.plate.lc{height:26px;padding:3px 8px}.brand-logo.sot{height:46px}
.band .wrap{gap:16px 30px}

/* sections */
section{padding:110px 0;position:relative}
.label{display:flex;align-items:center;gap:12px;font-size:18px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--pink);margin-bottom:18px}
.label svg{width:22px;height:22px;fill:var(--pink);flex:none}
h2{font-size:clamp(34px,4.2vw,58px);line-height:1.02;letter-spacing:-.035em;font-weight:800;max-width:820px}
.sub{color:var(--muted);font-size:18px;max-width:660px;margin-top:16px}
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:56px}
.tile{position:relative;border-radius:16px;padding:26px;background:linear-gradient(180deg,rgba(249,78,148,.09),rgba(20,20,22,.9) 45%);border:1px solid rgba(249,78,148,.22);overflow:hidden}
.tile.wide{grid-column:span 2}
.tiles.three{grid-template-columns:repeat(3,1fr)}
.tile h3{font-size:20px;letter-spacing:-.01em;margin:16px 0 8px}
.tile p{color:var(--muted);font-size:15px}
.tile .ic{width:46px;height:46px;border-radius:12px;background:var(--pink);display:grid;place-items:center}
.tile .ic svg{width:24px;height:24px;stroke:var(--ink);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.big{position:absolute;right:-10px;bottom:-30px;font-size:150px;font-weight:800;color:rgba(249,78,148,.07);letter-spacing:-.06em;line-height:1;pointer-events:none}

/* overlay styles (real captures over an illustrative scene) */
.ovs-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:50px}
.ovs-card{display:flex;flex-direction:column;gap:14px}
.ovs-scene{position:relative;height:330px;border-radius:14px;overflow:hidden;border:1px solid rgba(249,78,148,.22);
  background:linear-gradient(180deg,#3A4856 0%,#26313B 55%,#161C22 100%);display:grid;place-items:center}
.ovs-scene:before{content:"";position:absolute;left:0;right:0;bottom:0;height:58%;background:#202A33;clip-path:polygon(0 42%,14% 20%,28% 46%,46% 8%,62% 40%,78% 18%,100% 38%,100% 100%,0 100%)}
.ovs-scene:after{content:"";position:absolute;left:0;right:0;bottom:0;height:24%;background:#141A1F}
.ovs-scene i{position:absolute;bottom:24%;width:16%;height:30%;background:#2E3B46;border-top:6px solid #3A4A57}
.ovs-scene i:nth-of-type(1){left:6%}.ovs-scene i:nth-of-type(2){left:42%;height:36%}.ovs-scene i:nth-of-type(3){right:6%;height:26%}
.ovs-scene b{position:absolute;right:16%;top:12%;width:70px;height:70px;border-radius:50%;background:radial-gradient(circle,#D9E6EE,rgba(217,230,238,0) 70%);opacity:.7}
.ovs-scene img{position:relative;z-index:2;height:auto;max-width:82%;max-height:84%;filter:drop-shadow(0 16px 30px rgba(0,0,0,.55))}
.ovs-scene img.tactical{max-width:90%;max-height:90%}
.ovs-name{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.ovs-name h3{font-size:19px;font-weight:800}
.ovs-name span{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--pink)}
.ovs-card p{font-size:14.5px;color:var(--muted)}
.editor-feature{display:grid;grid-template-columns:1fr 1.1fr;gap:48px;align-items:center;margin-top:64px}
.editor-copy h3{font-size:26px;font-weight:800;letter-spacing:-.02em;margin-bottom:10px}
.editor-copy p{color:var(--muted);margin-bottom:18px;font-size:16px}
.ticks{list-style:none;display:grid;gap:10px;color:var(--muted);font-size:15px}
.ticks li{display:flex;gap:10px}
.ticks li:before{content:"";flex:none;width:8px;height:8px;margin-top:8px;border-radius:50%;background:var(--pink)}
.editor-stage{position:relative;border-radius:16px;overflow:hidden;border:1px solid rgba(244,241,235,.12);padding:30px;display:grid;place-items:center;background:linear-gradient(180deg,#3A4856 0%,#26313B 55%,#161C22 100%)}
.editor-stage img{width:100%;max-width:520px;height:auto;filter:drop-shadow(0 20px 40px rgba(0,0,0,.6))}

/* perspective captures */
.tilt{position:relative;margin-top:70px;height:440px;perspective:1600px}
.screen{position:absolute;border-radius:14px;border:1px solid rgba(244,241,235,.14);background:#0E0E11;box-shadow:0 50px 90px -30px rgba(0,0,0,.95);overflow:hidden}
.screen img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:left top}
.s1{left:0;top:40px;width:46%;height:340px;transform:rotateY(18deg) rotateX(4deg);transform-origin:right center;opacity:.85}
.s2{left:27%;top:0;width:46%;height:400px;z-index:2;border-color:rgba(249,78,148,.5);box-shadow:0 0 0 1px rgba(249,78,148,.2),0 60px 110px -30px rgba(249,78,148,.35)}
.s3{right:0;top:40px;width:46%;height:340px;transform:rotateY(-18deg) rotateX(4deg);transform-origin:left center;opacity:.85}

/* shots, community, layouts */
.shot{display:block;width:100%;height:auto;border-radius:14px;border:1px solid rgba(244,241,235,.12);box-shadow:0 40px 80px -30px rgba(0,0,0,.9)}
.cv-community{display:grid;gap:22px;margin-top:44px}
.cv-row{display:grid;grid-template-columns:1.7fr 1fr;gap:22px;align-items:start}
figure{margin:0}
figure img{display:block;width:100%;height:auto;border-radius:12px;border:1px solid rgba(244,241,235,.12);box-shadow:0 24px 50px -24px rgba(0,0,0,.9)}
figcaption{margin-top:12px;font-size:15px;color:var(--muted)}
figcaption b{display:block;color:var(--text);font-size:17px;margin-bottom:4px}
.layouts{display:grid;grid-template-columns:1.25fr 1.25fr 1fr;gap:18px;align-items:end;margin-top:44px}
.layouts figcaption{font-size:13.5px}
.layouts figcaption b{display:inline;font-size:13.5px;margin-right:6px}

/* download call to action */
.dl{position:relative;border-radius:26px;overflow:hidden;padding:64px;text-align:center;background:radial-gradient(ellipse at 50% 0,rgba(249,78,148,.55),transparent 60%),linear-gradient(180deg,#24111C,#121014)}
.dl:before{content:"";position:absolute;inset:0;background:url("img/crossvoice-icon.svg") no-repeat 108% 50%/420px;opacity:.06;pointer-events:none}
.dl h2{margin:0 auto}
.chips{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin:26px 0 34px}
.chips span{font-size:13px;font-weight:700;background:rgba(10,10,8,.5);border:1px solid var(--line);border-radius:999px;padding:7px 14px}
.hash{display:block;margin-top:22px;font:12px Consolas,monospace;color:var(--muted);word-break:break-all}
.warn{margin-top:10px;font-size:13px;color:var(--warn)}

/* inner pages */
.page-head{padding:150px 0 56px;background:radial-gradient(ellipse 70% 80% at 50% 0,rgba(249,78,148,.22),transparent 70%),linear-gradient(180deg,#120D14,#0A0A08)}
.page-head h1{font-size:clamp(40px,5.4vw,72px);margin:14px 0 14px}
.page-head p{color:var(--muted);font-size:18px;max-width:720px}
.prose{max-width:820px}
.prose h2{font-size:clamp(26px,2.6vw,34px);margin:56px 0 14px}
.prose h3{font-size:20px;margin:30px 0 8px}
.prose p,.prose li{color:#D4D1D9;font-size:16.5px}
.prose p+p{margin-top:12px}
.prose ul,.prose ol{margin-block:12px 0;margin-inline:22px 0;display:grid;gap:8px}
.prose a{color:var(--pink);text-decoration:underline;text-underline-offset:3px}
.prose code{font-family:Consolas,monospace;font-size:14px;background:var(--surface2);padding:2px 6px;border-radius:5px;word-break:break-all}
.placeholder{display:inline-block;background:rgba(255,210,122,.12);color:var(--warn);border:1px dashed rgba(255,210,122,.5);border-radius:6px;padding:1px 8px;font-weight:700}
.card{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:30px}
.who{display:grid;grid-template-columns:200px 1fr;gap:36px;align-items:start}
.who-text h2{font-size:30px;margin-bottom:12px}.who-text p{color:#D4D1D9;font-size:16.5px}.who-text p+p{margin-top:12px}
.story{max-width:780px;margin:0 auto}
.story h2{font-size:clamp(30px,3.4vw,44px);margin-bottom:22px}
.story p{color:#D4D1D9;font-size:17.5px;line-height:1.7}.story p+p{margin-top:16px}
.story-figure{margin:34px 0}.story-figure .ovs-scene{height:340px}
.story-figure .ovs-scene img{width:auto;height:auto;max-height:300px;max-width:90%;border:0;border-radius:0;box-shadow:none}
.signature{font-weight:800;color:var(--pink)!important;font-size:18px!important;margin-top:24px!important}
.who-photo{width:200px;height:250px;object-fit:cover;border-radius:16px;border:1px solid rgba(249,78,148,.35);box-shadow:0 20px 40px -20px rgba(249,78,148,.45)}
.dl-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:28px;align-items:start}
.spec{display:grid;gap:0;font-size:15px}
.spec div{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line)}
.spec div:last-child{border:0}
.spec span{color:var(--muted)}
.spec code{font:12.5px Consolas,monospace;word-break:break-all;text-align:end;direction:ltr}
.steps{list-style:none;counter-reset:s;display:grid;gap:16px;margin-top:20px}
.steps li{counter-increment:s;position:relative;padding-block:18px;padding-inline:66px 20px;background:var(--surface);border:1px solid var(--line);border-radius:14px;color:#D4D1D9}
.steps li:before{content:counter(s);position:absolute;inset-inline-start:18px;top:16px;width:32px;height:32px;border-radius:9px;background:var(--pink);color:var(--ink);font-weight:800;display:grid;place-items:center}
.steps li b{color:var(--text)}
.note{border-inline-start:3px solid var(--warn);padding:10px 14px;background:rgba(255,210,122,.06);border-radius:10px;color:#E9E2CF;font-size:15px;margin-top:18px}
.guide-step{display:grid;grid-template-columns:1fr 1.25fr;gap:48px;align-items:center;padding:56px 0;border-top:1px solid var(--line)}
.guide-step:nth-child(even) .guide-text{order:2}
.guide-text .num{font-size:13px;font-weight:800;letter-spacing:.14em;color:var(--pink)}
.guide-text h2{font-size:clamp(26px,2.8vw,38px);margin:8px 0 12px}
.guide-text p{color:var(--muted);font-size:16.5px}
.faq{display:grid;gap:12px;max-width:900px}
.faq details{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:18px 22px}
.faq summary{font-weight:700;font-size:17px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";color:var(--pink);font-size:22px;line-height:1}
.faq details[open] summary:after{content:"–"}
.faq p{color:#D4D1D9;margin-top:10px}
.release{display:grid;grid-template-columns:200px 1fr;gap:30px;padding:40px 0;border-top:1px solid var(--line)}
.release .v{font-size:34px;font-weight:800;letter-spacing:-.03em}
.release .d{color:var(--muted);font-size:14px;margin-top:4px}
.release .tag{display:inline-block;margin-top:10px;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);background:var(--pink);border-radius:6px;padding:3px 8px}

/* beta request form (sending arrives in C6-WEB02) */
.form{display:grid;gap:18px}
.form label{display:grid;gap:7px;font-weight:700;font-size:14.5px}
.form input[type=email],.form input[type=text],.form textarea{width:100%;font:inherit;font-weight:500;color:var(--text);background:#0E0E10;border:1px solid rgba(244,241,235,.18);border-radius:10px;padding:12px 14px}
.form input:focus,.form textarea:focus{outline:2px solid var(--pink);outline-offset:1px;border-color:transparent}
.form small{font-weight:500;color:var(--muted);font-size:13px}
.form .check{display:flex;gap:10px;align-items:flex-start;font-weight:500;color:#D4D1D9}
.form .check input{margin-top:4px;accent-color:var(--pink);width:18px;height:18px;flex:none}
.form .check a{color:var(--pink);text-decoration:underline}
.form button[disabled]{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}
/* C6-OPENBETA01: honeypot (visually hidden, not display:none) and the request states shown in #beta-status. */
.form .hp{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;opacity:0;pointer-events:none}
#beta-status a{color:var(--pink);text-decoration:underline}
#beta-status[data-state=sent]{border-inline-start-color:#5BD08A;background:rgba(91,208,138,.08)}
#beta-status[data-state=invalid],#beta-status[data-state=consent],#beta-status[data-state=limited],#beta-status[data-state=failed]{border-inline-start-color:var(--pink);background:rgba(249,78,148,.08)}

/* footer */
.site-footer{padding:60px 0 30px;border-top:1px solid var(--line)}
.frow{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:24px}
.frow img{height:44px;width:auto}
.frow nav{display:flex;flex-wrap:wrap;gap:22px;font-size:14px;color:var(--muted)}
.frow nav a:hover{color:var(--text)}
.fcols{display:grid;grid-template-columns:1.5fr repeat(4,1fr);gap:30px}
.fbrand img{height:44px;width:auto}.fbrand p{color:var(--muted);font-size:14px;margin-top:12px;max-width:260px}
.fcols nav h5{font-size:13px;font-weight:800;margin-bottom:12px;color:var(--text)}
.fcols nav a{display:block;color:var(--muted);font-size:14px;margin-bottom:9px}.fcols nav a:hover{color:var(--text)}
.fine{margin-top:30px;font-size:12px;color:#7D7B84;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}

@media (max-width:1080px){.ovs-grid{grid-template-columns:1fr 1fr}}
@media (max-width:1239px){
  .nav-links{display:none}
  .menu{display:block;position:relative}
  .menu summary{list-style:none;cursor:pointer;border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-weight:800}
  .menu summary::-webkit-details-marker{display:none}
  .menu nav{position:absolute;inset-inline-end:0;top:calc(100% + 6px);display:grid;gap:2px;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:6px;min-width:200px;z-index:40}
  .menu nav a{padding:9px 12px;border-radius:6px;font-weight:700}
  .menu nav a:hover{background:rgba(249,78,148,.14)}
}
@media (max-width:980px){
  .scene{flex-direction:column;justify-content:center;padding-top:90px}
  .scene-ov{position:relative;left:auto;top:auto;bottom:auto;margin:0 auto 10px;width:200px}
  .scene-wheel{display:none}
  .hud{position:static;transform:none;text-align:center;margin:-10px 0 20px}
  .scene-in{padding-top:10px}
  .tiles{grid-template-columns:1fr 1fr}
  .tiles.three{grid-template-columns:1fr}
  .tilt{height:300px}.s1,.s3{display:none}.s2{left:0;width:100%;height:300px}
  .editor-feature,.cv-row,.dl-grid,.guide-step{grid-template-columns:1fr}
  .guide-step:nth-child(even) .guide-text{order:0}
  .layouts{grid-template-columns:1fr}
  .who{grid-template-columns:1fr}.who-photo{width:160px;height:200px}
  .fcols{grid-template-columns:1fr 1fr}.fbrand{grid-column:1/-1}
  .release{grid-template-columns:1fr;gap:12px}
}
@media (max-width:620px){
  .wrap{padding:0 16px}
  h1 span{white-space:normal}
  .nav{gap:12px}
  .tiles,.ovs-grid{grid-template-columns:1fr}.tile.wide{grid-column:auto}
  .dl{padding:34px 20px}
  .btn-sm{padding:8px 12px}
  .lang summary{padding:6px 8px}
  section{padding:72px 0}
  .spec div{flex-direction:column;gap:4px}.spec code{text-align:left}
}
.nav .btn-sm{white-space:nowrap}
@media (max-width:420px){.lang .ln{display:none}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn{transition:none}}

/* Languages: the English headline keeps its second line whole; translations may wrap. */
:lang(en) h1 span{white-space:nowrap}
@media (max-width:620px){:lang(en) h1 span{white-space:normal}}
/* Scripts Manrope does not cover: Windows UI fonts, normal letter spacing. */
:lang(ja){font-family:Manrope,"Yu Gothic UI","Meiryo UI",system-ui,sans-serif}
:lang(zh-Hans){font-family:Manrope,"Microsoft YaHei UI","Microsoft YaHei",system-ui,sans-serif}
:lang(zh-Hant){font-family:Manrope,"Microsoft JhengHei UI","Microsoft JhengHei",system-ui,sans-serif}
:lang(ko){font-family:Manrope,"Malgun Gothic",system-ui,sans-serif}
:lang(th){font-family:Manrope,"Leelawadee UI",system-ui,sans-serif}
:lang(hi){font-family:Manrope,"Nirmala UI",system-ui,sans-serif}
:lang(ar){font-family:Manrope,"Segoe UI",Tahoma,system-ui,sans-serif}
:lang(ar) *,:lang(hi) *,:lang(th) *,:lang(ja) *,:lang(ko) *,:lang(zh-Hans) *,:lang(zh-Hant) *{letter-spacing:normal!important}
:lang(ar) .label,:lang(ar) .pill,:lang(ar) .nav-links{text-transform:none}