/* Storybook CVI composition and shared surfaces. */
:root{--bg:#eef0f2;--line:#d6dbe1}
header{background:white;max-width:none;padding-left:max(40px,calc((100vw - 1240px)/2));padding-right:max(40px,calc((100vw - 1240px)/2));border-bottom:0}
main{max-width:1400px;padding:0 40px}.hero{padding:80px 60px 70px;margin:0 -40px 0;background:#e3e6e9;min-height:560px;border-bottom:1px solid #d5d9de}.hero h1{max-width:740px;font-weight:600;font-size:68px}.hero p{max-width:650px;color:#515d6c}.brand-pattern{width:960px;height:620px;right:-330px;top:-20px;background:url('./assets/storybook-pattern-original.png') center/100% auto no-repeat;filter:grayscale(1);opacity:.24;mix-blend-mode:multiply;mask-image:linear-gradient(90deg,transparent,#000 23%);z-index:0}.hero>.eyebrow,.hero>h1,.hero>p,.hero>.button{z-index:1}.hero>p{position:relative}.productsection{padding:44px 20px 0}.sectionheading{margin-bottom:23px}.card{border-color:#d7dce2;box-shadow:0 3px 10px #24355004}.visual.web,.visual.mini,.visual.now{background:#e6eaef}.cardcontent{background:white}.choice{margin:65px 20px;padding:45px 0;border-color:#cbd2dc}.help{position:relative;isolation:isolate;overflow:hidden;background:#2455a6;color:#fff;border-radius:8px;margin:0 20px 65px;padding:48px 42px}.help p{color:#e2eafa}.help h2{font-size:28px}.help .secondary{background:#fff;border-color:#fff;color:#2455a6;flex-shrink:0}.help .secondary:hover{background:#edf2fb}.help .stores{position:relative}.help .store{color:#2455a6}footer{border-color:#d1d7df}.detailhero{background:#e3e6e9;margin:30px 0 0;padding:55px 40px;border-radius:8px}.detailhero .visual{background:#d6dce3}.benefits{margin:35px 20px 0}.start{margin:0 20px}.platformnote{margin-left:20px}.detailhero .fine{color:#586473}
@media(max-width:1100px){.hero{padding-left:40px;padding-right:40px}.hero h1{font-size:59px;max-width:650px}.brand-pattern{right:-400px;opacity:.2}.hero p{max-width:570px}.detailhero{padding:35px 25px}.detailhero h1{font-size:42px}.help h2{font-size:24px}}
@media(max-width:720px){header{padding:14px 24px}main{padding:0 24px}.hero{margin:0 -24px;padding:43px 24px 190px;min-height:0}.hero h1{font-size:43px;max-width:520px}.hero p{max-width:500px;font-size:15px}.brand-pattern{width:650px;height:420px;right:-100px;top:auto;bottom:-262px;opacity:.32;mask-image:linear-gradient(180deg,transparent,#000 17%)}.productsection{padding:15px 0 0}.choice{margin:42px 0;padding:30px 0}.help{margin:0 0 40px;padding:32px 25px}.help h2{font-size:23px}.detailhero{margin:25px 0 0;padding:30px 20px}.detailhero h1{font-size:37px}.detailhero .visual{height:310px}.benefits,.start{margin-left:0;margin-right:0}.platformnote{margin-left:0}.sectionheading{margin-top:20px}}
/* Lightweight, softly lit CVI rings: shared by both home-page languages. */
.hero .brand-pattern{width:700px;height:560px;right:-25px;top:0;background:url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22700%22%20height%3D%22560%22%20viewBox%3D%220%200%20700%20560%22%20fill%3D%22none%22%3E%0A%20%20%3Cdefs%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%22ring%22%20x1%3D%22145%22%20y1%3D%22110%22%20x2%3D%22500%22%20y2%3D%22470%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%20%20%20%20%20%20%3Cstop%20stop-color%3D%22%23fff%22%2F%3E%3Cstop%20offset%3D%22.32%22%20stop-color%3D%22%23eef2f5%22%2F%3E%3Cstop%20offset%3D%22.60%22%20stop-color%3D%22%23c0d6ed%22%2F%3E%3Cstop%20offset%3D%22.84%22%20stop-color%3D%22%236b9ddd%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%233477cc%22%2F%3E%0A%20%20%20%20%3C%2FlinearGradient%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%22edge%22%20x1%3D%22160%22%20y1%3D%22100%22%20x2%3D%22495%22%20y2%3D%22480%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%20%20%20%20%20%20%3Cstop%20stop-color%3D%22%23f9fcff%22%2F%3E%3Cstop%20offset%3D%22.5%22%20stop-color%3D%22%23adcae7%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23437fc4%22%2F%3E%0A%20%20%20%20%3C%2FlinearGradient%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%22arc%22%20x1%3D%22350%22%20y1%3D%2230%22%20x2%3D%22620%22%20y2%3D%22330%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%20%20%20%20%20%20%3Cstop%20stop-color%3D%22%23fff%22%2F%3E%3Cstop%20offset%3D%22.36%22%20stop-color%3D%22%23eaf0f6%22%2F%3E%3Cstop%20offset%3D%22.66%22%20stop-color%3D%22%239abce5%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%234b89d5%22%2F%3E%0A%20%20%20%20%3C%2FlinearGradient%3E%0A%20%20%20%20%3CradialGradient%20id%3D%22ball%22%20cx%3D%22.27%22%20cy%3D%22.22%22%20r%3D%22.85%22%3E%0A%20%20%20%20%20%20%3Cstop%20stop-color%3D%22%23fff%22%2F%3E%3Cstop%20offset%3D%22.28%22%20stop-color%3D%22%23edf4fb%22%2F%3E%3Cstop%20offset%3D%22.59%22%20stop-color%3D%22%23a9c9ef%22%2F%3E%3Cstop%20offset%3D%22.87%22%20stop-color%3D%22%235089d6%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%233670bd%22%2F%3E%0A%20%20%20%20%3C%2FradialGradient%3E%0A%20%20%20%20%3CclipPath%20id%3D%22upper-crossing%22%3E%3Crect%20x%3D%22275%22%20y%3D%2270%22%20width%3D%22145%22%20height%3D%22155%22%2F%3E%3C%2FclipPath%3E%0A%20%20%20%20%3Cmask%20id%3D%22arc-surface%22%3E%3Cpath%20d%3D%22M%20581%20296%20A%20139%20139%200%201%201%20581%2099%22%20stroke%3D%22%23fff%22%20stroke-width%3D%2256%22%2F%3E%3C%2Fmask%3E%0A%20%20%3C%2Fdefs%3E%0A%20%20%3C%21--%20Two%20broad%20CVI%20forms%2C%20with%20a%20small%20sphere%20as%20counterweight.%20--%3E%0A%20%20%3Ccircle%20cx%3D%22290%22%20cy%3D%22320%22%20r%3D%22178%22%20stroke%3D%22url%28%23edge%29%22%20stroke-width%3D%2253%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%22287%22%20cy%3D%22314%22%20r%3D%22178%22%20stroke%3D%22url%28%23ring%29%22%20stroke-width%3D%2247%22%2F%3E%0A%20%20%3Ccircle%20cx%3D%22287%22%20cy%3D%22314%22%20r%3D%22202%22%20stroke%3D%22%23fff%22%20stroke-opacity%3D%22.48%22%20stroke-width%3D%221.5%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M%20581%20296%20A%20139%20139%200%201%201%20581%2099%22%20stroke%3D%22url%28%23edge%29%22%20stroke-width%3D%2256%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M%20578%20290%20A%20139%20139%200%201%201%20578%2093%22%20stroke%3D%22url%28%23arc%29%22%20stroke-width%3D%2250%22%2F%3E%0A%20%20%3C%21--%20Alternate%20front%2Fback%20at%20the%20two%20crossings%20to%20interlock%20the%20rings.%20--%3E%0A%20%20%3Cg%20clip-path%3D%22url%28%23upper-crossing%29%22%3E%0A%20%20%20%20%3Ccircle%20cx%3D%22290%22%20cy%3D%22320%22%20r%3D%22178%22%20stroke%3D%22%23315985%22%20stroke-opacity%3D%22.18%22%20stroke-width%3D%2265%22%20mask%3D%22url%28%23arc-surface%29%22%2F%3E%0A%20%20%20%20%3Ccircle%20cx%3D%22290%22%20cy%3D%22320%22%20r%3D%22178%22%20stroke%3D%22url%28%23edge%29%22%20stroke-width%3D%2253%22%2F%3E%0A%20%20%20%20%3Ccircle%20cx%3D%22287%22%20cy%3D%22314%22%20r%3D%22178%22%20stroke%3D%22url%28%23ring%29%22%20stroke-width%3D%2247%22%2F%3E%0A%20%20%20%20%3Ccircle%20cx%3D%22287%22%20cy%3D%22314%22%20r%3D%22202%22%20stroke%3D%22%23fff%22%20stroke-opacity%3D%22.48%22%20stroke-width%3D%221.5%22%2F%3E%0A%20%20%3C%2Fg%3E%0A%20%20%3Ccircle%20cx%3D%22566%22%20cy%3D%22441%22%20r%3D%2223%22%20fill%3D%22url%28%23ball%29%22%2F%3E%0A%3C%2Fsvg%3E%0A') center/contain no-repeat;opacity:.9;filter:none;mix-blend-mode:normal;mask-image:linear-gradient(90deg,transparent,#000 24%)}
@media(max-width:1100px){.hero .brand-pattern{right:-170px;opacity:.65;mask-image:linear-gradient(90deg,transparent,#000 38%)}}
@media(max-width:720px){.hero .brand-pattern{width:350px;height:280px;right:-30px;top:auto;bottom:-84px;opacity:.85;mask-image:linear-gradient(180deg,transparent,#000 27%)}}