/* Revision 3: the site carries the same material and editorial quality as its products. */
:root{--bg:#17171a;--muted:#b9b4ba;--accent:#ff1688;--line:#ffffff29}
body{background:#17171a}.quiet-contact{padding:10px 16px;border:1px solid #ffffff25;border-radius:30px;background:#232126bf;backdrop-filter:blur(12px);font-size:12px}.quiet-contact span{font-size:17px}
.material-media{background:#404046;transform:scale(var(--material-depth,1.03));transform-origin:50% 50%;will-change:transform}
.material-plate,#stone-video{filter:brightness(1.58) contrast(1.08) saturate(.82)}
.material-shading{opacity:var(--material-shade,.03);background:#121217}
.material-light{inset:-8%;transform:translateX(var(--light-shift,-7%));background:linear-gradient(118deg,#f0edf026 0%,transparent 33%,transparent 68%,#0d0e1411),radial-gradient(ellipse at 51% 55%,#c3457020,transparent 58%);mix-blend-mode:screen;will-change:transform}
.material-vignette{background:radial-gradient(ellipse at 50% 45%,transparent 36%,#0b0d1817 78%,#07090d42 120%)}
.brand-intro img{width:min(var(--brand-width,232px),82vw);max-width:none;height:auto;animation:brand-clarity 1.3s ease both;transform:none;filter:none;mix-blend-mode:screen;opacity:.99}
.brand-intro h1{display:grid;place-items:center;min-height:200px}
.brand-horizon{position:absolute;left:19%;right:19%;top:calc(50% + 84px);height:1px;background:linear-gradient(90deg,transparent,#cf87a763,transparent);opacity:.7}
.brand-reflection{top:49%;left:8%;width:84%;height:40%;filter:none;background:radial-gradient(ellipse at 50% 18%,#d82d7624,transparent 68%);animation:light-arrival 2.6s ease both}
.scroll-cue{font-size:10px;letter-spacing:.2em;gap:20px;color:#e9e1e7}.scroll-cue i{height:48px;background:linear-gradient(#f1d1df99,transparent)}
.cinematic .experience-track{height:1100svh}
.opening-copy em,.story-outro em,.your-story em{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-.055em}
.opening-copy h2{font-size:clamp(40px,5.55vw,88px);font-weight:400;line-height:1.09;letter-spacing:-.06em;max-width:1180px;text-shadow:0 3px 25px #14111720}
.scene-index{font-size:10px;letter-spacing:.23em;color:#ede2e9;margin-bottom:42px;display:flex;align-items:center;gap:20px}.scene-index:before{content:'';width:44px;height:1px;background:#d18ca755}
.idea-copy{align-items:flex-start;text-align:left;padding-left:clamp(36px,12vw,220px)}.idea-copy h2 span{margin:.09em 0}.idea-copy h2 span:last-child{color:#e6d4de}.idea-copy h2 em{color:#f9eaf1}
.understanding-copy{align-items:flex-start;text-align:left;padding-left:clamp(36px,28vw,540px)}.understanding-copy h2{font-size:clamp(40px,5.7vw,91px)}.understanding-line{color:#e1d8df;font-size:clamp(18px,1.5vw,24px);line-height:1.6;max-width:600px;margin-top:36px}
.dive-copy h2{font-size:clamp(42px,5.8vw,94px)}.dive-copy em{display:inline-block;margin-bottom:.09em}.dive-rule{background:linear-gradient(#f287b3,transparent);height:90px;margin-top:45px}
.creation-world{background:radial-gradient(ellipse at 78% 44%,#51414b61,transparent 65%),linear-gradient(135deg,#222227,#19191d 75%);isolation:isolate}
.creation-world:before{content:'';position:absolute;inset:0;background:url('assets/codearis-slate.jpg') center/cover;opacity:.07;mix-blend-mode:screen;pointer-events:none;z-index:-1}
.cinematic .creation-world{transform:translateY(var(--creation-rise,0px));padding-top:clamp(30px,5svh,70px)}
.creation-top{align-items:start;margin-bottom:38px}.creation-top .eyebrow{font-size:10px;letter-spacing:.19em;color:#bc9bab}.creation-top h2{letter-spacing:-.055em;line-height:1.1}
.creation-grid{position:relative;isolation:isolate}.code-studio{border-radius:10px;border-color:#ffffff2a;background:linear-gradient(125deg,#28272df2,#1c1c22f2);box-shadow:0 30px 70px #08071036,inset 0 1px #ffffff08;position:relative}
.code-top{border-color:#ffffff16;color:#beb4c0}.code-top>span:first-child{color:#f3eaf2}.code-top i{width:5px;height:5px;box-shadow:0 0 13px #ff168850}
.code-studio pre{color:#e0d9e4;font-size:clamp(14px,1.05vw,18px);line-height:2.05}.code-line:before{color:#8b8291}.code-line.active{background:linear-gradient(90deg,#c75e903b,transparent);color:#fff}.code-line.active:after{content:'';position:absolute;right:12px;top:42%;width:4px;height:4px;border-radius:50%;background:#ed8cba;box-shadow:0 0 9px #ff16883d}
.syntax-value{color:#e4a8d0}.syntax-function{color:#c5dbe1}.syntax-string{color:#dfc2b1}.syntax-keyword{color:#c1c4e5}.syntax-data{color:#e0d4b0}
.code-bottom{color:#cab5c5;border-color:#ffffff16;background:#ffffff02}.code-cursor{color:#f186b6}
.code-connection{position:absolute;left:40%;right:52%;height:1px;top:52%;z-index:-1;background:linear-gradient(90deg,#bc7691,#e7b7cc);opacity:.5;pointer-events:none}.code-connection span{position:absolute;right:-5px;top:-12px;color:#e8c0d2;font-size:16px}.code-connection i{display:block;width:5px;height:5px;border-radius:50%;background:#ecb2cd;position:absolute;top:-2px;left:0;box-shadow:0 0 12px #ecb2cd66}
.creation-product{filter:drop-shadow(0 25px 42px #06060a28)}.product-label{color:#bdb0be;font-size:9px;letter-spacing:.14em}.product-label>span:last-child{color:#e0b4ce}.product-footnote{color:#b5a8b8;font-size:10px}.workspace-live{border-color:#eadbe84d}
.build-steps{position:relative;border-color:#ffffff26}.build-steps:before{content:'';height:1px;width:calc(var(--build-progress,.2)*100%);position:absolute;top:-1px;left:0;background:linear-gradient(90deg,#9e697f,#ef9ac2);transition:width .85s cubic-bezier(.22,1,.36,1)}.build-steps button{color:#ada2b2}.build-steps button span{color:#9b899c}.build-steps button[aria-pressed=true]{border-color:transparent}
.capability-track{border:0;background:#202024;isolation:isolate}.cinematic .capability-stage{isolation:isolate;background:#222226;padding-top:72px;padding-bottom:38px;overflow:hidden;min-height:100svh}
.capability-atmosphere{position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 76% 42%,#6350595c,transparent 60%),linear-gradient(125deg,#29292d,#202025);transition:background 1s}
.capability-atmosphere:before{content:'';position:absolute;inset:0;background:url('assets/codearis-slate.jpg') 50% 50%/cover;opacity:.065;mix-blend-mode:screen}
.capability-stage:after{content:attr(data-order);position:absolute;left:calc(var(--gutter) - .02em);bottom:12svh;font-size:clamp(180px,23vw,360px);line-height:.8;letter-spacing:-.08em;color:#ffffff03;z-index:-1;pointer-events:none}
.capability-stage[data-service=web] .capability-atmosphere{background:radial-gradient(ellipse at 75% 45%,#70625359,transparent 60%),linear-gradient(125deg,#302d2d,#232127)}
.capability-stage[data-service=webapp] .capability-atmosphere{background:radial-gradient(ellipse at 75% 45%,#615c7959,transparent 60%),linear-gradient(125deg,#2b2a33,#202026)}
.capability-stage[data-service=apps] .capability-atmosphere{background:radial-gradient(ellipse at 70% 50%,#83556e38,transparent 60%),linear-gradient(125deg,#2f2930,#211f25)}
.capability-stage[data-service=automation] .capability-atmosphere{background:radial-gradient(ellipse at 74% 45%,#62597959,transparent 60%),linear-gradient(125deg,#292932,#1f1f28)}
.capability-top{margin-bottom:18px}.capability-top .eyebrow{color:#c2b8c4;font-size:10px;letter-spacing:.22em}.capability-number{color:#b99aaa;font-size:10px}
.capability-layout{grid-template-columns:minmax(0,.65fr) minmax(0,1.35fr);gap:clamp(30px,5vw,96px);min-height:0}.capability-heading h2{font-size:clamp(46px,5.5vw,90px);letter-spacing:-.065em}.capability-heading h2[data-long=true]{font-size:clamp(28px,3.05vw,52px)}.capability-heading>p:not(.capability-instruction){color:#d0c6d1;max-width:24ch;font-size:clamp(18px,1.3vw,23px)}.capability-instruction{color:#b29ead;font-size:12px;max-width:29ch}.capability-rule{margin:32px 0 22px;background:#c88caa}
#capability-product{position:relative;height:clamp(450px,57svh,650px);isolation:isolate}.product-pane{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.product-pane>*{width:100%}.product-pane.is-entering{animation:none}
.capability-caption{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid #ffffff20;margin-top:20px;padding-top:15px}.capability-code{margin:0;padding:0;border:0;color:#b9a0b2;font-size:11px}.capability-caption>span{font-size:10px;color:#afa2b1;text-align:right}.capability-tabs{margin-top:32px;border-color:#ffffff24}.capability-tabs button{color:#b5a7b7;font-size:12px;padding:20px 0}.capability-tabs button span{color:#a4889b}.capability-tabs button[aria-pressed=true]{color:#fff;border-color:#da87b0}
.workspace-shell,.editorial-site,.board-app,.automation-app{box-shadow:0 30px 80px #08070c40}.editorial-site{border-radius:9px}.editorial-copy{padding-block:38px}.editorial-copy h3{font-size:clamp(42px,4vw,68px)}.editorial-header{padding-block:24px}.editorial-main{min-height:350px}.editorial-image img{transition:filter 1.15s,transform 1.5s cubic-bezier(.22,1,.36,1)}
.automation-app{background:linear-gradient(125deg,#36303d,#292631);border-color:#ffffff26}.automation-heading p,.automation-app>header{color:#b1a0b9}.automation-heading h3{color:#f0e3f4}.flow-node{border-color:#ffffff2b;background:#ffffff03}.flow-node h4{color:#decee4}.flow-node small{color:#b4a0bf}.flow-node>span{color:#9c83a8}.automation-log{color:#bfa7c5}.automation-action{border-color:#ffffff20}.automation-action button{border-color:#c990b373;color:#efd1e5}.automation-badge{color:#dec1d4;border-color:#bb84a754}
.story-outro{position:relative;isolation:isolate;min-height:95svh;background:#27252b;overflow:hidden;padding-top:100px;padding-bottom:120px}.story-outro:before{content:'';position:absolute;inset:-5%;z-index:-1;background:linear-gradient(#211e2640,#211e2680),url('assets/codearis-slate.jpg') center/cover;transform:scale(var(--outro-depth,1.04));opacity:.85}.story-outro h2{font-size:clamp(42px,6vw,98px);color:#e5dfe7;line-height:1.08}.story-outro h2 em{color:#f6e9f0;display:inline-block;margin-top:.08em}.outro-rule{height:70px;margin-bottom:48px;background:linear-gradient(transparent,#e6accb)}.story-pause{height:12svh;background:linear-gradient(#27252b,#232126)}
.contact-story{background:radial-gradient(ellipse at 100% 0,#d2c4cd,transparent 70%),#e9e5df;color:#28232b;max-width:none;margin:0;border-radius:36px 36px 0 0;padding-top:10px;padding-bottom:110px;isolation:isolate}.your-story,.contact-layout{max-width:1520px;margin-inline:auto}.your-story{padding-top:90px;padding-bottom:75px}.your-story .eyebrow{color:#876274;font-size:10px;letter-spacing:.22em}.your-story h2{font-size:clamp(65px,8.7vw,145px);color:#2c252d;letter-spacing:-.075em}.your-story em{color:#7a4b65;letter-spacing:-.075em}.contact-layout{border-color:#30233133;padding-top:52px;gap:clamp(50px,8vw,150px)}.contact-index{color:#987b8d;letter-spacing:.16em;font-size:10px}.contact-intro h3{color:#443643;font-size:clamp(30px,3vw,47px)}.contact-intro a,.contact-intro a:first-of-type{color:#685565}.contact-intro a:hover{color:#923b67}
#story-contact label{color:#615260;font-size:12px}#story-contact input,#story-contact textarea{color:#2f2430;border-color:#8a75867d;font-size:18px}#story-contact input:focus,#story-contact textarea:focus{border-color:#823359}#story-contact input[aria-invalid=true],#story-contact textarea[aria-invalid=true]{border-color:#a0305d}.field-error,#contact-status{color:#913157}.privacy-note,.contact-availability{color:#786a76}.privacy-note a,.contact-availability a{color:#63405a}.send-button{color:#3f2c3b;border-color:#87597199}.send-button span{color:#9c456e}.story-footer{background:#e9e5df;color:#756770;border-color:#3322331c}.story-footer>a{color:#80596f}.story-footer a:hover{color:#42283c}
.reveal-on-view{transition:opacity 900ms ease,transform 1100ms cubic-bezier(.22,1,.36,1)}.cinematic .reveal-on-view:not(.is-revealed){opacity:0;transform:translateY(28px)}
@keyframes brand-clarity{from{opacity:0}to{opacity:1}}
@media(min-width:851px) and (max-height:850px){#capability-product{height:440px}.capability-top{margin-bottom:15px}.capability-tabs{margin-top:22px}.cinematic .capability-stage{padding-top:60px;padding-bottom:24px}.capability-caption{margin-top:14px;padding-top:12px}.capability-product-wrap .mobile-surface{transform:scale(.78);transform-origin:center}.capability-product-wrap .app-composition{height:440px;min-height:0}.creation-top{margin-bottom:25px}.code-studio pre{padding-block:20px}.cinematic .creation-world{padding-bottom:18px}.build-steps{margin-top:24px}}
@media(max-width:1200px) and (min-width:851px){.capability-heading h2{font-size:clamp(44px,5vw,60px)}.capability-heading h2[data-long=true]{font-size:clamp(28px,3vw,37px)}.capability-caption>span{max-width:115px;line-height:1.5}.code-studio pre{font-size:13px}.editorial-copy h3{font-size:44px}}
@media(max-width:850px){.cinematic .capability-track{background:#25242a}.capability-chapter{background:radial-gradient(ellipse at 80% 50%,#5b46502e,transparent 60%);border-top:1px solid #ffffff0c}.capability-chapter[data-view=web]{background:#302c2e}.capability-chapter[data-view=webapp]{background:#292832}.capability-chapter[data-view=apps]{background:#302930}.capability-chapter[data-view=automation]{background:#282730}.chapter-text h2{font-size:clamp(40px,7vw,64px);letter-spacing:-.055em}.chapter-text .eyebrow{color:#b997aa;font-size:10px}.chapter-text>p:last-child{color:#d1c6d1}.chapter-product:after{content:'Interaktive Produktstudie · Beispieldaten';display:block;margin-top:20px;font-size:10px;color:#b2a0b2;letter-spacing:.02em}.code-studio pre{font-size:12px}.creation-top h2{font-size:30px}.code-connection{left:35%;right:55%}.understanding-copy{padding-left:12vw}.capability-caption{display:none}}
@media(max-width:600px){.material-media{transform:scale(var(--material-depth,1.04))}.material-light{background:linear-gradient(110deg,#f3e9f01a,transparent 54%),radial-gradient(ellipse at 52% 52%,#d1437621,transparent 70%)}.material-vignette{background:radial-gradient(ellipse at 50% 45%,transparent 20%,#12101938 95%)}.brand-intro img{width:min(var(--brand-width,232px),78vw);max-width:none}.brand-horizon{left:15%;right:15%;top:calc(50% + 64px)}.brand-reflection{top:47%;left:0;width:100%;height:30%}.opening-copy{padding:55px 26px}.idea-copy,.understanding-copy{align-items:flex-start;text-align:left}.opening-copy h2{font-size:clamp(30px,8vw,44px);line-height:1.14}.idea-copy h2 span{margin:.12em 0}.idea-copy h2 span:nth-child(2){max-width:9em}.scene-index{font-size:8px;letter-spacing:.16em;gap:12px;margin-bottom:30px}.scene-index:before{width:24px}.understanding-copy h2{font-size:clamp(34px,9vw,47px)}.understanding-line{font-size:17px;color:#e6dce6;margin-top:30px;max-width:290px}.dive-copy{align-items:center;text-align:center}.dive-copy h2{font-size:clamp(32px,8.4vw,47px)}.dive-rule{height:65px;margin-top:35px}.cinematic .creation-world{padding:25px 20px 15px}.creation-top{margin-bottom:15px}.creation-top h2{font-size:25px}.creation-top .eyebrow{font-size:8px}.creation-grid{gap:16px}.code-studio pre{font-size:14px;line-height:1.65;padding:12px 0}.code-top{padding:11px 14px}.code-top>span:last-child{font-size:7px}.code-bottom{padding:9px 14px}.code-connection{top:190px;bottom:0;left:50%;right:auto;width:1px;height:35px;background:linear-gradient(#bd7b9e,#e1b4ca)}.code-connection span{display:none}.build-steps{margin-top:18px}.build-steps button{font-size:9px}.build-steps button span{font-size:8px}.editorial-copy h3{font-size:33px}.editorial-copy{padding:25px 16px}.editorial-main{min-height:320px}.editorial-header{padding:17px}.capability-chapter{padding-top:80px;padding-bottom:80px}.chapter-text h2{font-size:clamp(34px,9vw,49px)}.chapter-product{margin-top:35px}.chapter-text>p:last-child{font-size:18px}.story-outro{min-height:85svh;padding:80px 26px}.story-outro h2{font-size:clamp(34px,9vw,48px)}.outro-rule{margin-bottom:40px}.story-pause{height:9svh}.contact-story{border-radius:24px 24px 0 0;padding-top:0;padding-bottom:70px}.your-story{padding-top:62px;padding-bottom:50px}.your-story h2{font-size:clamp(57px,14.5vw,80px)}.contact-layout{padding-top:35px;gap:42px}.contact-intro h3{font-size:31px}.contact-intro a{font-size:15px}#story-contact input,#story-contact textarea{font-size:17px}.privacy-note,.contact-availability{font-size:11px}.quiet-contact{top:15px;right:20px;padding:8px 13px;font-size:11px}}
@media(max-width:600px) and (max-height:750px){.cinematic .creation-world{padding-top:15px;padding-bottom:10px}.creation-top{margin-bottom:12px}.creation-top h2{font-size:23px;min-height:2.15em}.code-studio pre{font-size:13px;line-height:1.5;padding:8px 0}.code-line{min-height:1.5em}.code-top{padding:9px 13px}.code-bottom{padding:7px 13px}.creation-grid{gap:12px}.build-steps{margin-top:12px}.build-steps button{padding:9px 0;font-size:8px}}
.static-experience .material-media{transform:none}.static-experience .creation-world{transform:none}.static-experience .brand-intro img{animation:none}.static-experience .reveal-on-view{opacity:1;transform:none}.static-experience .capability-chapter{border-top:1px solid #ffffff10}.static-experience .capability-chapter .chapter-text h2{color:#f0e8ef}.static-experience .capability-chapter .chapter-text>p{color:#c4b6c6}
@media(prefers-reduced-motion:reduce){.material-media,.material-light,.story-outro:before{transform:none!important}.reveal-on-view{opacity:1!important;transform:none!important}.brand-intro img{animation:none!important}}


/* ================================================================
   CODEARIS V15 — CINEMATIC LUXURY
   One continuous story: material → understanding → system → desire.
   ================================================================ */
:root{
  --luxury-surface:#302f33;
  --luxury-surface-deep:#17171b;
  --luxury-ink:#f7f3f5;
  --luxury-muted:#c9c0c7;
  --luxury-accent:#f2287f;
  --luxury-warm:#eee8df;
}
body[data-experience="v15-cinematic-luxury"]{background:var(--luxury-surface-deep);color:var(--luxury-ink)}
body[data-experience="v15-cinematic-luxury"]::before{content:'';position:fixed;inset:0;pointer-events:none;z-index:9999;box-shadow:inset 0 0 110px #00000030}

/* The stone remains visible instead of disappearing into black. */
.material-media{background:#444348;transform:scale(var(--material-depth,1.03));filter:brightness(var(--material-lift,1))}
.material-plate,#stone-video{filter:brightness(1.72) contrast(1.06) saturate(.78);transform:translate3d(var(--material-x,0%),var(--material-y,0%),0) scale(1.015);will-change:transform,filter}
.material-grain{position:absolute;inset:-12%;z-index:2;pointer-events:none;opacity:.18;mix-blend-mode:soft-light;background-image:radial-gradient(circle at 20% 30%,#ffffff10 0 1px,transparent 1.4px),radial-gradient(circle at 70% 64%,#00000028 0 1px,transparent 1.6px),linear-gradient(118deg,#ffffff08,transparent 28%,#00000010 76%);background-size:7px 7px,11px 11px,100% 100%;transform:translate3d(var(--grain-x,0%),var(--grain-y,0%),0)}
.material-shading{z-index:3;opacity:var(--material-shade,.018)!important;background:linear-gradient(90deg,#16151a1c,#0000 40%,#17151a1e)}
.material-light{z-index:4;opacity:var(--material-light,1.1);background:linear-gradient(112deg,#f8f1f129 0%,#fff0 29%,#fff0 66%,#17151a19 100%),radial-gradient(ellipse at calc(47% + var(--light-shift,-8%)) 56%,#d74c7b2a,transparent 49%);mix-blend-mode:screen;filter:blur(.1px)}
.material-vignette{z-index:5;background:radial-gradient(ellipse at 50% 46%,transparent 40%,#08080b13 76%,#07070a46 118%)}
.material-world:after{content:'';position:absolute;inset:0;z-index:5;pointer-events:none;background:linear-gradient(to bottom,#ffffff08 0,transparent 16%,transparent 82%,#0000001c 100%)}

/* Brand staging: large, crisp and physically lit rather than neon. */
.brand-intro{perspective:1200px}
.brand-intro h1{min-height:260px;transform:translateY(-1.3svh)}
.brand-intro img{width:min(var(--brand-width,760px),80vw)!important;filter:brightness(1.04) contrast(1.04) drop-shadow(0 20px 50px #00000036);mix-blend-mode:screen;transform:translateZ(0);image-rendering:auto}
.brand-horizon{left:20%;right:20%;top:calc(50% + 112px);opacity:.38;background:linear-gradient(90deg,transparent,#f3c6da55 50%,transparent)}
.brand-reflection{top:50%;left:10%;width:80%;height:42%;opacity:.78;background:radial-gradient(ellipse at 50% 4%,#f42d8030 0%,#b4296314 30%,transparent 67%)}
.scroll-cue{opacity:var(--cue-opacity,.62);text-transform:uppercase;font-size:9px;letter-spacing:.28em}.scroll-cue i{height:58px;background:linear-gradient(#f4dce778,transparent)}

/* Editorial story framing. */
.opening-copy{max-width:1600px;margin-inline:auto}
.opening-copy h2{text-shadow:0 18px 70px #00000022}
.idea-copy{padding-left:clamp(34px,11vw,210px);padding-right:clamp(34px,8vw,150px)}
.idea-copy h2{max-width:1050px}.idea-copy h2 span:nth-child(1){font-size:.78em}.idea-copy h2 span:nth-child(2){margin-left:clamp(0px,6vw,105px)}.idea-copy h2 span:nth-child(3){margin-left:clamp(0px,14vw,240px)}
.idea-copy em,.understanding-copy em,.dive-copy em{color:#fff3f8;text-shadow:0 0 50px #f12a7a16}
.understanding-copy{padding-left:clamp(36px,31vw,610px);padding-right:clamp(30px,7vw,150px)}
.understanding-copy h2{max-width:900px}.understanding-line{max-width:650px;color:#efe7ed}
.dive-copy{align-items:center;text-align:center}.dive-copy h2{max-width:1120px}.dive-copy .scene-index{margin-left:auto;margin-right:auto}.dive-rule{height:110px;background:linear-gradient(#ff76ad,transparent)}
.scene-index{color:#f1e8ee}.scene-index:before{background:linear-gradient(90deg,#f17dae66,#fff0)}

/* System reveal: dark, precise and spatial. */
.creation-world{background:radial-gradient(ellipse at 71% 43%,#5b47535c 0%,transparent 50%),linear-gradient(126deg,#242329 0%,#141419 70%)}
.creation-world:before{opacity:.12;filter:brightness(1.35) contrast(1.07)}
.creation-world:after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#ffffff08 1px,transparent 1px),linear-gradient(#ffffff06 1px,transparent 1px);background-size:84px 84px;-webkit-mask-image:linear-gradient(to right,#0002,#000 45%,#0005);mask-image:linear-gradient(to right,#0002,#000 45%,#0005)}
.creation-top .eyebrow{color:#dfb7ca}.creation-top h2{font-size:clamp(36px,3.7vw,64px);max-width:1050px}
.code-studio{background:linear-gradient(138deg,#2e2c34e8,#16161ce8);border:1px solid #ffffff2e;box-shadow:0 40px 110px #00000040,inset 0 1px #ffffff0d;backdrop-filter:blur(18px)}
.code-studio pre{font-size:clamp(14px,1vw,18px);line-height:2.08}.code-line.active{background:linear-gradient(90deg,#ff1b7e28,#ffffff03 55%,transparent)}
.code-connection{opacity:.75;background:linear-gradient(90deg,#d7759f,#f9bfd766)}
.creation-product{transform:translateZ(0);filter:drop-shadow(0 42px 70px #00000045)}
.creation-product .workspace-shell{border-radius:14px;border-color:#ffffff30;box-shadow:0 45px 110px #0000005c}
.build-steps{margin-top:32px}.build-steps button{padding-top:21px;color:#c6bac7}.build-steps button[aria-pressed=true]{color:#fff}.build-steps:before{background:linear-gradient(90deg,#ad657f,#ff9cc5)}

/* Bridge from technical proof to self-projection. */
.story-bridge{position:relative;min-height:92svh;display:grid;place-items:center;overflow:hidden;background:linear-gradient(180deg,#15151a 0%,#242328 45%,#302e32 100%);isolation:isolate}
.story-bridge:before{content:'';position:absolute;inset:-6%;z-index:-2;background:linear-gradient(180deg,#16161ae6,#252429b0),url('assets/codearis-slate.jpg') center/cover;filter:brightness(1.35) contrast(1.03);transform:scale(1.06)}
.story-bridge:after{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 61% 46%,#a1466822,transparent 50%),linear-gradient(90deg,#0000002b,transparent 45%,#ffffff04)}
.story-bridge-inner{width:min(1500px,90vw);display:grid;grid-template-columns:.55fr 1.45fr;gap:clamp(40px,8vw,145px);align-items:start;padding:12svh 0}
.story-bridge .eyebrow{padding-top:18px;color:#d7b4c5}
.story-bridge-copy h2{font-size:clamp(58px,8vw,145px);line-height:.88;letter-spacing:-.078em;font-weight:400;display:flex;flex-direction:column}
.story-bridge-copy h2 span{color:#bcb5bb}.story-bridge-copy h2 strong{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-weight:400;color:#fff0f6;margin-left:clamp(0px,8vw,130px)}
.story-bridge-copy>p{margin-top:58px;margin-left:clamp(0px,8vw,130px);max-width:620px;font-size:clamp(18px,1.45vw,24px);line-height:1.65;color:#d5cbd2}
.story-bridge-line{position:absolute;left:50%;bottom:0;width:1px;height:95px;background:linear-gradient(transparent,#ef88b6)}

/* Product stage: the work itself is the sale. */
.capability-track{background:#302e32}
.cinematic .capability-stage{background:linear-gradient(120deg,#353238,#28272c);padding-top:clamp(64px,8svh,100px);padding-bottom:42px}
.capability-atmosphere{background:radial-gradient(ellipse at 73% 42%,#9c677950 0%,transparent 55%),radial-gradient(ellipse at 14% 75%,#ffffff0a 0%,transparent 42%),linear-gradient(125deg,#37343a,#27262b)}
.capability-atmosphere:before{opacity:.12;filter:brightness(1.55) contrast(1.05)}
.capability-stage[data-service=web] .capability-atmosphere{background:radial-gradient(ellipse at 75% 44%,#b19c7452,transparent 55%),linear-gradient(125deg,#393634,#2a292a)}
.capability-stage[data-service=webapp] .capability-atmosphere{background:radial-gradient(ellipse at 74% 44%,#7b749f50,transparent 55%),linear-gradient(125deg,#34333e,#26262d)}
.capability-stage[data-service=apps] .capability-atmosphere{background:radial-gradient(ellipse at 72% 47%,#a65f8050,transparent 56%),linear-gradient(125deg,#393039,#27252a)}
.capability-stage[data-service=automation] .capability-atmosphere{background:radial-gradient(ellipse at 75% 45%,#766d9d50,transparent 55%),linear-gradient(125deg,#343440,#25252d)}
.capability-layout{grid-template-columns:minmax(290px,.58fr) minmax(0,1.42fr);gap:clamp(45px,6vw,120px)}
.capability-heading h2{font-size:clamp(60px,6.2vw,108px);line-height:.92}.capability-heading>p#capability-description{font-size:clamp(19px,1.25vw,23px);line-height:1.58;color:#e0d8df;max-width:26ch}
.capability-desire{margin-top:30px;max-width:27ch!important;font-family:Georgia,'Times New Roman',serif;font-size:clamp(18px,1.18vw,22px)!important;line-height:1.48!important;font-style:italic;color:#f2dbe7!important}
.capability-instruction{margin-top:0;color:#c5b7c2}.capability-rule{width:68px;margin-top:35px;margin-bottom:20px}
.capability-product-wrap{position:relative;isolation:isolate}.product-halo{position:absolute;z-index:-1;left:8%;right:4%;top:7%;bottom:4%;border-radius:48%;background:radial-gradient(ellipse at 48% 45%,#df86aa24,transparent 65%);filter:blur(28px);pointer-events:none}
#capability-product{height:clamp(500px,61svh,710px)}
.product-pane>*{transform:translateZ(0)}
.workspace-shell,.editorial-site,.board-app,.automation-app{border:1px solid #ffffff22;box-shadow:0 45px 110px #00000050,0 1px 0 #ffffff15}
.editorial-site{border-radius:14px;overflow:hidden}.editorial-main{min-height:420px}.editorial-copy h3{font-size:clamp(52px,4.5vw,78px)}
.capability-caption{border-top-color:#ffffff2d}.capability-code{color:#e0c2d3}.capability-caption>span{color:#cfc3cc}
.capability-tabs{border-top:1px solid #ffffff2d}.capability-tabs button{padding:23px 0;color:#d2c7d1}.capability-tabs button[aria-pressed=true]{color:#fff;border-color:#f27faf}.capability-tabs button[aria-pressed=true] span{color:#ff9ac3}

/* Outro: decompression before the invitation. */
.story-outro{min-height:100svh;background:#28272c}.story-outro:before{opacity:.95;filter:brightness(1.35);background:linear-gradient(#1e1d2385,#252329a8),url('assets/codearis-slate.jpg') center/cover}.story-outro h2{max-width:1200px;font-size:clamp(55px,7vw,118px)}
.story-pause{height:18svh;background:linear-gradient(#28272c,#ded9d2)}
.contact-story{background:radial-gradient(ellipse at 94% 4%,#ffffffaa,transparent 45%),linear-gradient(135deg,#eeeae4,#e2dcd6);border-radius:46px 46px 0 0}
.your-story h2{font-size:clamp(78px,9.2vw,158px)}
#story-contact input,#story-contact textarea{background:transparent;border-bottom-width:1px;transition:border-color .3s,transform .3s}#story-contact input:focus,#story-contact textarea:focus{transform:translateY(-2px)}
.send-button{transition:color .3s,border-color .3s,padding-left .3s}.send-button:hover{padding-left:12px;color:#7b3157;border-color:#a24c77}

@media(max-width:850px){
  .brand-intro img{width:min(var(--brand-width,760px),88vw)!important}.brand-intro h1{min-height:180px}.brand-horizon{top:calc(50% + 84px)}
  .story-bridge-inner{grid-template-columns:1fr;gap:34px;padding:12svh 0}.story-bridge-copy h2{font-size:clamp(58px,14vw,105px)}.story-bridge-copy h2 strong,.story-bridge-copy>p{margin-left:0}.story-bridge-copy>p{margin-top:38px}
  .capability-desire{max-width:36ch!important}.capability-chapter{background:linear-gradient(145deg,#363239,#29272d)}
}
@media(max-width:600px){
  .material-plate,#stone-video{filter:brightness(1.55) contrast(1.04) saturate(.8)}.material-grain{opacity:.13}
  .brand-intro img{width:90vw!important}.brand-intro h1{min-height:150px}.brand-horizon{left:12%;right:12%;top:calc(50% + 68px)}
  .idea-copy h2 span:nth-child(2),.idea-copy h2 span:nth-child(3){margin-left:0}.understanding-copy{padding-left:26px}
  .story-bridge{min-height:82svh}.story-bridge-copy h2{font-size:clamp(54px,16vw,86px)}.story-bridge-copy>p{font-size:18px}.story-bridge-line{height:60px}
  .capability-desire{font-size:17px!important}.story-pause{height:8svh}.contact-story{border-radius:28px 28px 0 0}
}
@media(prefers-reduced-motion:reduce){.material-plate,#stone-video,.material-grain{transform:none!important}.story-bridge-copy,.product-halo{transform:none!important}}


/* --- Revision 4 refinements: static high-res stone, transparent logo, visible live code --- */
.material-media{background:#2c2d32 !important;transform:none !important;filter:brightness(1.04) !important}
.material-plate{content-visibility:auto}
.material-plate,#stone-video{transform:none !important;object-fit:cover;object-position:center center;filter:brightness(1.22) contrast(1.04) saturate(.9) !important}
#stone-video{display:none !important;opacity:0 !important}
.material-shading{opacity:.08 !important;background:linear-gradient(180deg,#1a1c22cc,#0e1016b8) !important}
.material-light{transform:none !important;inset:0 !important;opacity:1 !important;background:linear-gradient(115deg,#ffffff12 0%,transparent 34%,transparent 68%,#00000010 100%),radial-gradient(ellipse at 48% 44%,#de5d8a1f,transparent 56%) !important}
.material-vignette{background:radial-gradient(ellipse at 50% 46%,transparent 28%,#0a0d1442 78%,#07090f80 112%) !important}
.brand-intro img{mix-blend-mode:normal !important;filter:drop-shadow(0 18px 40px rgba(0,0,0,.32)) !important;background:transparent !important}

.code-studio pre{font-size:clamp(15px,1.08vw,19px) !important;line-height:2 !important}
.code-line{letter-spacing:.01em}

.capability-product-wrap{display:grid;grid-template-rows:minmax(0,1fr) auto;gap:18px}
#capability-product{height:auto !important;min-height:430px}
.product-pane{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.52fr);gap:18px;align-items:stretch}
.product-code-window{display:flex;flex-direction:column;border:1px solid rgba(255,255,255,.16);border-radius:16px;overflow:hidden;background:linear-gradient(160deg,rgba(20,22,28,.95),rgba(10,11,16,.94));box-shadow:0 30px 80px rgba(0,0,0,.32)}
.product-code-head{display:flex;justify-content:space-between;gap:12px;padding:14px 18px;border-bottom:1px solid rgba(255,255,255,.10);font-size:11px;letter-spacing:.14em;color:#d6bcc9;text-transform:uppercase}
.product-code-window pre{margin:0;padding:16px 18px 18px;white-space:pre-wrap;display:flex;flex-direction:column;gap:8px;font:500 13px/1.7 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#edf0f6}
.product-code-line{display:grid;grid-template-columns:28px 1fr;gap:10px;align-items:start;opacity:.82}
.product-code-line i{font-style:normal;color:#8f90a0}
.product-code-line.active{opacity:1;background:linear-gradient(90deg,rgba(255,31,126,.14),transparent);border-radius:8px;padding:4px 8px;margin:0 -8px}
.editorial-site--with-code{height:100%}
.editorial-image img{filter:brightness(1.03) contrast(1.02) !important}

@media (max-width: 1100px){
  .product-pane{grid-template-columns:1fr;}
  .product-code-window{min-height:220px}
}
@media (max-width: 600px){
  .product-code-head{padding:12px 14px;font-size:10px}
  .product-code-window pre{padding:14px;font-size:12px}
}


/* --- V17: higher-quality hero, restored stone-break animation, static surface --- */
.material-media{background:#2b2d34 !important;transform:none !important;filter:none !important}
.material-plate{display:block !important;opacity:1 !important;transform:none !important;object-fit:cover;object-position:center center;filter:brightness(1.08) contrast(1.12) saturate(.88) !important;image-rendering:auto}
#stone-video{display:block !important;opacity:var(--break-opacity,0) !important;transform:none !important;object-fit:cover;object-position:center center;filter:brightness(1.08) contrast(1.1) saturate(.9) !important;mix-blend-mode:screen;pointer-events:none}
#stone-video[data-ready='true']{opacity:var(--break-opacity,0) !important}
.material-grain{opacity:.045 !important;transform:none !important;background:radial-gradient(circle at 20% 20%,rgba(255,255,255,.05) 0,transparent 2px),radial-gradient(circle at 80% 40%,rgba(255,255,255,.04) 0,transparent 1.5px),radial-gradient(circle at 30% 75%,rgba(255,255,255,.03) 0,transparent 2px);background-size:180px 180px,220px 220px,200px 200px}
.material-shading{opacity:.12 !important;background:linear-gradient(180deg,rgba(13,15,22,.16) 0%,rgba(10,12,18,.06) 38%,rgba(5,7,11,.2) 100%) !important}
.material-light{opacity:1 !important;transform:none !important;inset:0 !important;background:linear-gradient(115deg,rgba(255,255,255,.12) 0%,transparent 36%,transparent 70%,rgba(0,0,0,.08) 100%),radial-gradient(ellipse at 50% 50%,rgba(219,77,132,.12),transparent 58%) !important}
.material-vignette{background:radial-gradient(ellipse at 50% 48%,transparent 18%,rgba(9,10,16,.18) 76%,rgba(7,8,13,.44) 118%) !important}
.brand-intro img{background:transparent !important;mix-blend-mode:normal !important;filter:drop-shadow(0 24px 65px rgba(0,0,0,.34)) !important}
.brand-reflection{opacity:.42 !important;filter:blur(32px) !important}

/* make the hero surface stay still while only the break video fades in */
.cinematic .material-world,.cinematic .material-media,.material-plate,#stone-video,.material-grain,.material-light{background-position:center center !important}

/* clearer code presence */
.code-studio{box-shadow:0 30px 80px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.04) !important}
.code-studio pre{font-size:clamp(15px,1.02vw,18px) !important;line-height:1.95 !important}
.product-code-window{box-shadow:0 30px 90px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.03) !important}


/* --- V18 final HD cleanup --- */
.material-media{background:#262830 !important;transform:none !important;filter:none !important}
.material-plate{opacity:1 !important;transform:none !important;filter:brightness(1.06) contrast(1.1) saturate(.92) !important;object-position:center center !important;image-rendering:auto !important}
#stone-video{opacity:var(--break-opacity,0) !important;filter:brightness(1.06) contrast(1.08) saturate(.92) !important;object-position:center center !important;image-rendering:auto !important}
.material-grain{display:none !important}
.material-light{background:linear-gradient(115deg,rgba(255,255,255,.11) 0%,transparent 34%,transparent 70%,rgba(0,0,0,.07) 100%),radial-gradient(ellipse at 50% 50%,rgba(219,77,132,.09),transparent 58%) !important;opacity:1 !important;transform:none !important}
.material-shading{background:linear-gradient(180deg,rgba(12,14,20,.12),rgba(12,14,20,.04) 40%,rgba(10,11,17,.16) 100%) !important;opacity:1 !important}
.material-vignette{background:radial-gradient(ellipse at 50% 48%,transparent 28%,rgba(7,8,12,.14) 78%,rgba(7,8,12,.34) 118%) !important}
.brand-intro img{width:min(var(--brand-width,760px),80vw)!important;background:transparent !important;mix-blend-mode:normal !important;filter:none !important;box-shadow:none !important}
.brand-reflection{opacity:.24 !important;filter:blur(26px) !important}
.editorial-image img{filter:brightness(1.04) contrast(1.08) saturate(.92) !important;image-rendering:auto !important}
.creation-product,.product-code-window,.code-studio{filter:none !important;box-shadow:0 24px 60px rgba(0,0,0,.22) !important}


/* --- V19 native-4K media layer + resolution-independent stone fracture --- */
.material-media{background:#24272e!important;transform:none!important;filter:none!important}
.material-plate{display:block!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;transform:none!important;filter:brightness(1.02) contrast(1.04) saturate(.92)!important;image-rendering:auto!important}
.material-grain{display:none!important}.material-shading{opacity:1!important;background:linear-gradient(180deg,rgba(8,10,15,.05),rgba(8,10,15,.02) 45%,rgba(5,7,11,.14))!important}.material-light{opacity:1!important;inset:0!important;transform:none!important;background:linear-gradient(115deg,rgba(255,255,255,.065),transparent 36%,transparent 70%,rgba(0,0,0,.055)),radial-gradient(ellipse at 50% 53%,rgba(231,48,127,.075),transparent 58%)!important}.material-vignette{background:radial-gradient(ellipse at 50% 48%,transparent 42%,rgba(4,6,10,.10) 82%,rgba(4,6,10,.24) 118%)!important}
.brand-intro img{background:transparent!important;filter:none!important;box-shadow:none!important;text-shadow:none!important;mix-blend-mode:normal!important;opacity:1!important}.brand-reflection,.brand-horizon{display:none!important}
.stone-break-vector{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none;overflow:visible}.crack-lines path{stroke:#f0a5c5;stroke-width:1.45;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--break-progress,0));opacity:var(--crack-opacity,.15)}.break-void{opacity:var(--break-open,0);transform-box:fill-box;transform-origin:center;transform:scaleX(var(--break-scale,.035));filter:drop-shadow(0 0 18px rgba(225,59,125,.12))}.break-shards{opacity:var(--break-open,0)}.shard{transform-box:fill-box;transform-origin:center;transition:none}.shard-a{transform:translate(var(--shard-a-x,0),var(--shard-a-y,0)) rotate(var(--shard-a-r,0deg))}.shard-b{transform:translate(var(--shard-b-x,0),var(--shard-b-y,0)) rotate(var(--shard-b-r,0deg))}.shard-c{transform:translate(var(--shard-c-x,0),var(--shard-c-y,0)) rotate(var(--shard-c-r,0deg))}.shard-d{transform:translate(var(--shard-d-x,0),var(--shard-d-y,0)) rotate(var(--shard-d-r,0deg))}
.editorial-image img{content:url('assets/codearis-stone-native-4k.webp');image-rendering:auto!important;filter:brightness(1.02) contrast(1.04)!important}


/* V20 — exact Higgsfield stone-break video */
.stone-break-vector{display:none!important}
#stone-video{
  display:block!important;
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center center!important;
  opacity:var(--break-opacity,0)!important;
  transform:none!important;
  filter:none!important;
  mix-blend-mode:normal!important;
  pointer-events:none!important;
  z-index:4!important;
  background:#111318!important;
}
#stone-video[data-ready="true"]{opacity:var(--break-opacity,0)!important}
.material-plate{z-index:1!important}
.material-shading,.material-light,.material-vignette{z-index:5!important}
.brand-intro,.opening-copy,.scroll-cue{z-index:7!important}


/* V23 — V20 story preserved; perspective treatment is limited to product/service scenes. */
.service-perspective{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:18px;align-items:stretch;min-height:clamp(470px,58svh,680px)}
.service-client-view,.service-builder-view{position:relative;border:1px solid #ffffff20;border-radius:16px;overflow:hidden;background:#18191f;box-shadow:0 30px 90px #00000032}
.service-client-view{padding:46px 18px 18px;display:flex;align-items:stretch}.service-client-view #capability-product{width:100%;height:100%;min-height:0}
.service-builder-view{padding:46px 0 0;display:flex;flex-direction:column;background:linear-gradient(145deg,#171820,#101116)}
.perspective-kicker{position:absolute;top:14px;left:18px;right:18px;display:flex;align-items:center;justify-content:space-between;gap:18px;font-size:9px;letter-spacing:.18em;color:#f2eaf0;z-index:3}.perspective-kicker small{font-size:9px;font-weight:400;letter-spacing:.02em;color:#968f99;text-transform:none}
.service-code-head{height:44px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid #ffffff0b;border-bottom:1px solid #ffffff12;font-size:10px;letter-spacing:.12em;color:#baa9b6}.service-code-head span:last-child{color:#ef9fc2}
.service-code-pre{margin:0;flex:1;padding:18px 0 12px;overflow:hidden;font:500 12px/1.78 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#dcd8e0;white-space:pre-wrap}
#capability-live-code,[data-service-live-code]{display:flex;flex-direction:column}
.service-code-line{display:grid;grid-template-columns:34px 1fr;gap:8px;padding:5px 18px;opacity:.56;transition:opacity .5s,background .5s,color .5s}.service-code-line i{font-style:normal;color:#6e6b75}.service-code-line.is-active{opacity:1;color:#fff;background:linear-gradient(90deg,#ff2f8220,transparent 88%)}.service-code-line.is-active i{color:#d890af}
.service-code-note{margin:0;padding:14px 18px 18px;border-top:1px solid #ffffff10;color:#aca4af;font-size:10px;line-height:1.5;min-height:48px}
.capability-product-wrap{position:relative}.capability-caption{margin-top:14px}
.chapter-service-perspective{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(260px,.85fr);gap:16px}.chapter-service-product,.chapter-service-code{position:relative;border:1px solid #ffffff18;border-radius:12px;overflow:hidden;background:#202026;padding-top:44px}.chapter-service-product .chapter-product-visual{min-height:390px}.chapter-service-code{background:#15161c}.chapter-service-code .service-code-pre{min-height:250px}
@media(max-width:1100px) and (min-width:851px){.service-perspective{grid-template-columns:minmax(0,1.2fr) minmax(260px,.8fr)}.service-code-pre{font-size:11px}.perspective-kicker small{display:none}}
@media(max-width:850px){.chapter-service-perspective{grid-template-columns:1fr}.chapter-service-code{margin-top:6px}.chapter-service-product .chapter-product-visual{min-height:0}.chapter-service-code .service-code-pre{min-height:220px}.perspective-kicker{position:absolute}}
@media(max-width:600px){.chapter-service-product,.chapter-service-code{border-radius:9px}.service-code-pre{font-size:11px}.service-code-line{grid-template-columns:28px 1fr;padding:4px 13px}.service-code-head,.service-code-note{padding-left:13px;padding-right:13px}}


/* V24 — capability display fix: one complete product view + one live-code view. */
.service-perspective{grid-template-columns:minmax(0,1.2fr) minmax(360px,.8fr);gap:20px;min-height:clamp(470px,58svh,650px)}
.service-client-view{padding:46px 18px 18px}
.service-client-view #capability-product{position:relative;width:100%;height:100%;min-height:420px;overflow:hidden}
.service-client-view #capability-product>.product-pane{display:flex!important;grid-template-columns:1fr!important;align-items:center!important;justify-content:center!important;gap:0!important;width:100%;height:100%}
.service-client-view #capability-product>.product-pane>*{width:100%!important;max-width:none!important;min-width:0}
.service-client-view .workspace-shell,.service-client-view .editorial-site,.service-client-view .board-app,.service-client-view .automation-app{width:100%;max-width:none}
.service-builder-view{min-width:0}
.service-code-pre{overflow:auto;scrollbar-width:thin}
@media(max-width:1200px) and (min-width:851px){.service-perspective{grid-template-columns:minmax(0,1.15fr) minmax(330px,.85fr)}}


/* V25 — interaction-driven code + code behind the Higgsfield fracture. */
.break-code-reveal{position:absolute;inset:-1%;z-index:6;pointer-events:none;opacity:var(--break-code-opacity,0);clip-path:polygon(28% 0,46% 0,42% 12%,48% 23%,44% 34%,55% 45%,50% 56%,61% 68%,57% 80%,67% 100%,38% 100%,42% 84%,34% 74%,38% 61%,30% 50%,35% 37%,27% 24%,32% 12%);overflow:hidden;background:#07080c}
.break-code-shell{position:absolute;inset:-6%;background:linear-gradient(145deg,#05060a,#0b0c12 72%);padding:10vh 7vw;color:#dadce6;transform:translateY(var(--break-code-y,0));font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.break-code-head{display:flex;justify-content:space-between;gap:20px;padding-bottom:16px;border-bottom:1px solid #ffffff18;font-size:10px;letter-spacing:.15em;color:#b99aaa}.break-code-head span:last-child{color:#f376ad}
.break-code-shell pre{margin:22px 0 0;white-space:pre-wrap;font:500 clamp(12px,1vw,17px)/1.9 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.break-code-line{display:grid;grid-template-columns:34px 1fr;gap:10px;padding:5px 8px;opacity:.34;transition:opacity .2s,background .2s}.break-code-line i{font-style:normal;color:#777782}.break-code-line b{font-weight:500;color:#d8dbe4}.break-code-line.is-active{opacity:1;background:linear-gradient(90deg,#f12c791d,transparent);border-left:1px solid #ef7fb0}.break-code-line.is-active b{color:#fff}

/* Only the selected capability pane may occupy "Ihre Sicht". */
.service-client-view #capability-product>.product-pane[hidden]{display:none!important}
.service-client-view #capability-product>.product-pane:not([hidden]){display:flex!important}

/* Cleaner premium staging. */
.cinematic .capability-stage{background:linear-gradient(120deg,#2b2a2f,#242329)!important}
.capability-atmosphere:before{opacity:.055!important;filter:brightness(1.12) contrast(1.02)!important}
.service-perspective{grid-template-columns:minmax(0,1.32fr) minmax(340px,.68fr);gap:18px;min-height:clamp(455px,56svh,620px)}
.service-client-view,.service-builder-view{border-color:#ffffff18;border-radius:14px;background:#111218;box-shadow:0 26px 70px #0000002d}
.service-client-view{padding:48px 18px 18px}.service-builder-view{background:linear-gradient(155deg,#111218,#0b0c11)}
.service-code-pre{font-size:12px;line-height:1.82}.service-code-line{transition:opacity .25s,background .25s,color .25s}

/* The app is deliberately smaller so the complete device remains visible. */
.service-client-view #capability-product>.product-pane[data-product="apps"]{overflow:visible}
.service-client-view #capability-product>.product-pane[data-product="apps"] .app-composition{min-height:100%;height:100%;justify-content:center;gap:18px;overflow:visible}
.service-client-view #capability-product>.product-pane[data-product="apps"] .app-side-note{max-width:170px;transform:scale(.9);transform-origin:right center}
.service-client-view #capability-product>.product-pane[data-product="apps"] .mobile-surface{width:258px;transform:scale(.80);transform-origin:center center;margin:-48px -12px;box-shadow:0 24px 60px #00000052}
.mobile-nav button{appearance:none;border:0;background:transparent;color:inherit;font:inherit;padding:0;cursor:pointer}.mobile-nav button[aria-pressed="true"]{color:#7f4d69;font-weight:600}

@media(max-width:1200px) and (min-width:851px){.service-perspective{grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr)}.service-client-view #capability-product>.product-pane[data-product="apps"] .mobile-surface{transform:scale(.75)}}
@media(max-width:850px){.break-code-reveal{clip-path:polygon(18% 0,58% 0,50% 16%,65% 32%,54% 48%,70% 67%,57% 100%,22% 100%,34% 76%,20% 57%,31% 35%)}.break-code-shell{padding:12vh 7vw}.service-client-view #capability-product>.product-pane[data-product="apps"] .mobile-surface{transform:scale(.86);margin:-30px auto}}


/* V26 — focused visual corrections from review screenshots. */
/* Fracture: keep the Higgsfield video untouched; show only transparent code glyphs in the opening. */
.break-code-reveal{background:transparent!important;z-index:6!important;overflow:hidden!important;mix-blend-mode:screen!important;clip-path:polygon(34% 0,45% 0,43% 13%,48% 24%,45% 35%,53% 46%,50% 57%,58% 69%,55% 81%,62% 100%,42% 100%,44% 84%,38% 73%,40% 60%,35% 49%,38% 36%,33% 23%,36% 11%)!important}
.break-code-shell{background:transparent!important;inset:-2%!important;padding:8vh 5vw!important;color:#f0dce7!important;filter:none!important}
.break-code-head{opacity:.35!important;border-bottom:0!important}.break-code-head span:last-child{display:none!important}
.break-code-line{opacity:.18!important;background:transparent!important;border:0!important;text-shadow:0 0 8px #000!important}.break-code-line.is-active{opacity:.82!important;background:transparent!important;border:0!important}.break-code-line.is-active b{color:#ffeaf4!important}
.dive-copy{z-index:8!important}.opening-copy{z-index:8!important}

/* Web: the title must fit inside the client view instead of disappearing under the image column. */
.service-client-view #capability-product>.product-pane[data-product="web"] .editorial-main{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr)!important;min-height:100%!important}
.service-client-view #capability-product>.product-pane[data-product="web"] .editorial-copy{padding:34px 30px 26px!important;overflow:hidden!important}
.service-client-view #capability-product>.product-pane[data-product="web"] .editorial-copy h3{font-size:clamp(38px,3.1vw,60px)!important;line-height:.94!important;letter-spacing:-.05em!important;max-width:100%!important;margin:24px 0 20px!important}
.service-client-view #capability-product>.product-pane[data-product="web"] .editorial-copy h3 em{display:block!important;font-size:.74em!important;line-height:1.02!important;letter-spacing:-.045em!important}
.service-client-view #capability-product>.product-pane[data-product="web"] .editorial-header nav{gap:8px!important}
.service-client-view #capability-product>.product-pane[data-product="web"] .editorial-header button{padding:6px 10px!important;border:1px solid #7b6b5a33!important;border-radius:999px!important;cursor:pointer!important}
.service-client-view #capability-product>.product-pane[data-product="web"] .editorial-header button[aria-pressed=true]{background:#29231d0d!important;border-color:#6d5d4e66!important}

/* Apps: wider device, less vertical bulk, and clearer supporting copy. */
.service-client-view #capability-product>.product-pane[data-product="apps"] .app-composition{display:grid!important;grid-template-columns:minmax(150px,.62fr) minmax(300px,1fr)!important;align-items:center!important;gap:28px!important;padding:12px 34px!important}
.service-client-view #capability-product>.product-pane[data-product="apps"] .app-side-note{max-width:220px!important;transform:none!important}
.service-client-view #capability-product>.product-pane[data-product="apps"] .app-side-note h3{font-size:28px!important;line-height:1.12!important;margin-top:18px!important}
.service-client-view #capability-product>.product-pane[data-product="apps"] .app-side-note p{font-size:11px!important;line-height:1.6!important}
.service-client-view #capability-product>.product-pane[data-product="apps"] .mobile-surface{width:320px!important;transform:none!important;margin:0 auto!important;padding:14px 20px 0!important;border-radius:24px!important;max-height:430px!important}
.service-client-view #capability-product>.product-pane[data-product="apps"] .mobile-status{margin-bottom:14px!important}
.service-client-view #capability-product>.product-pane[data-product="apps"] .mobile-surface>h3{font-size:24px!important;line-height:1.06!important;margin:10px 0 14px!important}
.service-client-view #capability-product>.product-pane[data-product="apps"] .mobile-week{margin-bottom:12px!important}
.service-client-view #capability-product>.product-pane[data-product="apps"] .mobile-week button{padding:5px 7px!important}
.service-client-view #capability-product>.product-pane[data-product="apps"] .mobile-focus{padding:14px!important}
.service-client-view #capability-product>.product-pane[data-product="apps"] .mobile-focus h4{font-size:20px!important;margin:10px 0 12px!important}
.service-client-view #capability-product>.product-pane[data-product="apps"] .mobile-agenda{margin:9px 0!important}.service-client-view #capability-product>.product-pane[data-product="apps"] .mobile-agenda>div{padding:6px 0!important}
.service-client-view #capability-product>.product-pane[data-product="apps"] .mobile-nav{padding:9px 0!important}

/* Automation: make the action unmistakable. */
.automation-heading{padding:26px 0 20px!important}.automation-hint{margin-top:16px!important;max-width:48ch!important;font-size:10px!important;line-height:1.55!important;color:#a991a5!important;letter-spacing:0!important}
.automation-action button{background:#8d456d24!important;border-color:#d289b357!important;color:#f0dce8!important;font-size:12px!important;padding:12px 16px!important;cursor:pointer!important}.automation-action button:hover{background:#a755812f!important;border-color:#e3a2c6!important}

/* Outro -> contact: remove the giant empty grey wall and rounded white block. */
.story-pause{height:0!important;background:none!important}
.contact-story{border-radius:0!important;margin-top:0!important;padding-top:90px!important;background:linear-gradient(180deg,#28272c 0,#9e9a96 90px,#eeeae4 220px,#eeeae4 100%)!important}
.contact-story .your-story{padding-top:120px!important}

@media(max-width:1200px) and (min-width:851px){
  .service-client-view #capability-product>.product-pane[data-product="apps"] .app-composition{grid-template-columns:minmax(135px,.55fr) minmax(280px,1fr)!important;padding-inline:18px!important}
  .service-client-view #capability-product>.product-pane[data-product="apps"] .mobile-surface{width:292px!important}
}
@media(max-width:850px){
  .service-client-view #capability-product>.product-pane[data-product="apps"] .app-composition{grid-template-columns:1fr!important;padding:10px 12px!important}
  .service-client-view #capability-product>.product-pane[data-product="apps"] .app-side-note{display:none!important}
  .service-client-view #capability-product>.product-pane[data-product="apps"] .mobile-surface{width:min(320px,92vw)!important;transform:none!important;margin:0 auto!important}
  .contact-story{padding-top:60px!important;background:linear-gradient(180deg,#28272c 0,#b8b3ad 70px,#eeeae4 160px,#eeeae4 100%)!important}
  .contact-story .your-story{padding-top:90px!important}
}

/* V27 — Codearis ambient brand light */
.brand-intro::before{content:"";position:absolute;left:50%;top:50%;width:min(86vw,1180px);height:min(48vw,650px);transform:translate(-50%,-46%);z-index:0;pointer-events:none;background:radial-gradient(ellipse at 50% 52%,rgba(242,40,127,.26) 0%,rgba(242,40,127,.12) 28%,rgba(190,30,93,.05) 48%,transparent 72%);filter:blur(54px);opacity:.86;mix-blend-mode:screen}.brand-intro h1{z-index:2}.brand-intro img{filter:none!important;box-shadow:none!important;mix-blend-mode:normal!important}.brand-horizon{background:linear-gradient(90deg,transparent,rgba(242,40,127,.34),transparent)!important;opacity:.72!important}.brand-reflection{background:radial-gradient(ellipse at 50% 12%,rgba(242,40,127,.34),rgba(242,40,127,.08) 38%,transparent 70%)!important;opacity:.68!important}.material-light{background:linear-gradient(115deg,rgba(255,255,255,.10) 0%,transparent 36%,transparent 70%,rgba(0,0,0,.08) 100%),radial-gradient(ellipse at 50% 54%,rgba(242,40,127,.16),transparent 58%)!important}


/* V28 — supporting services live on the homepage instead of a separate services page */
.extended-services{position:relative;overflow:hidden;background:#1e1e24;color:#f5eef3;padding:clamp(90px,10vw,170px) var(--gutter) clamp(100px,11vw,190px);border-top:1px solid #ffffff0e}.extended-services:before{content:"";position:absolute;inset:-20% 40% 20% -15%;background:radial-gradient(ellipse,rgba(242,40,127,.13),transparent 65%);filter:blur(45px);pointer-events:none}.extended-services__intro{position:relative;display:grid;grid-template-columns:minmax(240px,.6fr) minmax(0,1.4fr);gap:clamp(40px,8vw,140px);align-items:end;margin-bottom:clamp(60px,7vw,110px)}.extended-services__intro .eyebrow{align-self:start}.extended-services__intro h2{font-size:clamp(42px,5.2vw,86px);line-height:1.02;letter-spacing:-.055em;font-weight:400;margin:0}.extended-services__intro h2 em{font-family:Georgia,'Times New Roman',serif;color:#d996b7;font-weight:400}.extended-services__intro>p:last-child{font-size:18px;line-height:1.65;color:#bdb2bc;max-width:36ch;margin:28px 0 0}.extended-services__grid{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid #ffffff18;border-bottom:1px solid #ffffff18}.extended-service-card{position:relative;min-height:330px;padding:28px 25px 26px;border-right:1px solid #ffffff18;display:flex;flex-direction:column}.extended-service-card:last-child{border-right:0}.extended-service-card>span{font-size:10px;color:#e27ca9;letter-spacing:.12em}.extended-service-card h3{font-size:clamp(23px,1.8vw,34px);line-height:1.05;letter-spacing:-.045em;font-weight:400;margin:58px 0 20px}.extended-service-card p{font-size:13px;line-height:1.7;color:#afa5af;margin:0}.extended-service-card small{margin-top:auto;padding-top:36px;color:#d899b6;font-size:9px;letter-spacing:.16em}.extended-service-card:after{content:"";position:absolute;left:25px;right:25px;bottom:0;height:1px;background:linear-gradient(90deg,#f2287f,transparent);transform:scaleX(0);transform-origin:left;transition:transform .4s ease}.extended-service-card:hover:after{transform:scaleX(1)}
@media(max-width:1200px){.extended-services__grid{grid-template-columns:repeat(2,1fr)}.extended-service-card{border-bottom:1px solid #ffffff18}.extended-service-card:nth-child(2n){border-right:0}.extended-service-card:last-child{grid-column:1/-1}}
@media(max-width:700px){.extended-services__intro{grid-template-columns:1fr}.extended-services__grid{grid-template-columns:1fr}.extended-service-card,.extended-service-card:nth-child(2n){border-right:0}.extended-service-card:last-child{grid-column:auto}.extended-service-card{min-height:250px}.extended-service-card h3{margin-top:34px}}


/* V29 — RAL 9001 warm editorial surface */
.contact-story{background:
  radial-gradient(circle at 18% 22%,rgba(91,72,57,.055) 0 1px,transparent 1.7px) 0 0/19px 21px,
  radial-gradient(circle at 72% 64%,rgba(255,255,255,.22) 0 1.2px,transparent 1.9px) 0 0/25px 23px,
  linear-gradient(180deg,#28272c 0,#b0a89c 84px,#E9E0D2 190px,#E9E0D2 100%)!important}
.contact-story .your-story,.contact-story .contact-layout{position:relative;z-index:1}
.story-footer{background:#E9E0D2!important;color:#6e625d!important;border-color:rgba(82,66,59,.18)!important}

/* V30 production contact */
.contact-honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important;pointer-events:none!important}
.contact-consent{display:flex!important;align-items:flex-start;gap:12px;margin-top:24px;color:#615260!important;font-size:12px!important;line-height:1.6;cursor:pointer}
.contact-consent input{appearance:none;width:18px!important;height:18px!important;min-height:18px!important;flex:0 0 18px;margin:2px 0 0!important;padding:0!important;border:1px solid #8a7586!important;border-radius:3px;background:transparent!important;position:relative}
.contact-consent input:checked{background:#8b315f!important;border-color:#8b315f!important}
.contact-consent input:checked:after{content:'✓';position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:12px;line-height:1}
.contact-consent input[aria-invalid=true]{border-color:#a0305d!important}
.contact-consent a{color:#63405a;text-decoration:underline;text-underline-offset:3px}
.contact-consent-error{display:block;margin-top:6px}

/* V31 appointment request */
#story-contact input[type="date"],#story-contact input[type="time"]{color-scheme:light;font-variant-numeric:tabular-nums}
#story-contact input[type="date"]::-webkit-calendar-picker-indicator,#story-contact input[type="time"]::-webkit-calendar-picker-indicator{opacity:.58;cursor:pointer}
#contact-status .contact-calendar-link{display:inline-block;margin-left:8px;color:#7b2f57;font-weight:700;text-decoration:underline;text-underline-offset:4px}

/* V36 — discreet bilingual language switch. */
.language-switch{position:fixed;left:clamp(14px,2vw,28px);bottom:clamp(14px,2vw,26px);z-index:95;display:flex;align-items:center;gap:8px;padding:8px 11px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(16,15,19,.72);backdrop-filter:blur(14px);font:600 10px/1 Arial,Helvetica,sans-serif;letter-spacing:.12em;color:#ddd5dc;box-shadow:0 8px 30px rgba(0,0,0,.14)}
.language-switch a{color:inherit;text-decoration:none;opacity:.58;padding:3px 2px}.language-switch a[aria-current="page"]{opacity:1;color:#fff}.language-switch a:hover,.language-switch a:focus-visible{opacity:1;color:#fff;outline:none}.language-switch span{opacity:.25}.contact-story~.language-switch{color:#211f27}
@media(max-width:560px){.language-switch{left:12px;bottom:12px;padding:7px 9px}}