@font-face{font-family:Oxanium;src:url('assets/fonts/Oxanium.ttf') format('truetype');font-weight:200 800;font-style:normal;font-display:swap}
:root{--display:Oxanium,Space,Arial,sans-serif;--pulse:#76a3b7;--edge-hover:#9b7db0}
h1,h2,h3,dialog h2,.service-detail h3,.process-panel h3{font-family:var(--display);font-style:normal;font-weight:400;letter-spacing:-.035em}h1 em,h2 em{font-style:normal}
.hero-copy{top:25%}.hero h1{font:400 clamp(45px,4.8vw,76px)/1.08 var(--display);letter-spacing:-.045em}.hero .intro{max-width:350px}
.reference-art{mask-image:linear-gradient(90deg,transparent,#000 11%,#000 94%,transparent),linear-gradient(0deg,transparent,#000 14%,#000 88%,transparent);mask-composite:intersect}
.services{padding-top:65px;padding-bottom:85px}.services h2{font-family:var(--display);font-weight:400;margin:0 0 48px;font-size:clamp(37px,4.2vw,60px)}
.connected-services{position:relative;isolation:isolate;--card-run:paused}.connected-services[data-motion="running"]{--card-run:running}.connected-services:is(:hover,:focus-within){--card-run:paused}
.service-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:25px;margin:0;perspective:1300px;position:relative;z-index:1}
.service-card{position:relative;isolation:isolate;padding:24px 18px 26px;min-height:303px;border:1px solid #aeb7b6;border-radius:17px;text-align:left;background:linear-gradient(145deg,#f9f9f1bf,#e0e3dfde 60%,#d1dad9e8);box-shadow:inset 0 1px 0 #ffffffdd,inset 0 -1px 0 #9eafaf66,0 8px 0 -3px #a7b3b278,0 22px 25px -20px #263f4c66;transform:rotateX(4deg);transform-style:preserve-3d;display:flex;flex-direction:column;gap:0;transition:border-color .25s,box-shadow .25s}
.service-card:after{content:'';position:absolute;inset:5px;border:1px solid #ffffff52;border-radius:12px;pointer-events:none}
.service-card .card-edge{position:absolute;inset:-1px;border:2px solid #77a5b9;border-radius:17px;box-shadow:0 0 15px #72a7bf50,inset 0 0 12px #99c0ce30;opacity:0;pointer-events:none;animation:card-signal 30s linear infinite;animation-play-state:var(--card-run);will-change:opacity}
.service-card:nth-child(2) .card-edge{animation-delay:-24s}.service-card:nth-child(3) .card-edge{animation-delay:-18s}.service-card:nth-child(4) .card-edge{animation-delay:-12s}.service-card:nth-child(5) .card-edge{animation-delay:-6s}
@keyframes card-signal{0%,18%,100%{opacity:0}2%,12%{opacity:1}}
.service-art{height:154px;display:grid;place-items:center;transform:translateZ(18px);margin-bottom:22px;width:100%}
.service-card img{width:100%;height:148px;object-fit:contain;margin:0;transform:none!important;filter:drop-shadow(0 12px 10px #43575c16);transition:none}
.service-name{font:500 14px/1.3 Space,Arial,sans-serif;display:block;margin-bottom:12px;color:#1c3039}.service-summary{font-size:11px;line-height:1.65;color:#41545b;max-width:190px}
.service-card:is(:hover,:focus-visible){border-color:var(--edge-hover);box-shadow:inset 0 1px 0 #ffffffdd,0 8px 0 -3px #b5a4bd77,0 0 0 1px #9b7db077,0 18px 26px -18px #73518370}
.service-card:is(:hover,:focus-visible) .card-edge{border-color:var(--edge-hover);box-shadow:0 0 16px #a38cb570,inset 0 0 12px #9b7db033}
.service-card[aria-expanded="true"]{border-color:#6a94a8}
.service-card[aria-expanded="true"]:is(:hover,:focus-visible){border-color:var(--edge-hover)}
.service-connections{position:absolute;inset:0;z-index:0;width:100%;height:100%;overflow:visible;pointer-events:none}.connection-base{stroke:#95a9b0;stroke-width:1}.connection-pulse{stroke:#8db9ca;stroke-width:3;stroke-linecap:round;stroke-dasharray:32 5000;animation:link-signal 30s linear infinite;animation-play-state:var(--card-run)}
@keyframes link-signal{0%{stroke-dashoffset:0}80%,100%{stroke-dashoffset:calc(-1 * var(--path-length))}}
.example{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.7fr);gap:clamp(30px,5vw,72px);align-items:center;padding-top:75px;padding-bottom:110px;max-width:1440px;overflow:visible}
.example-copy{text-align:left;max-width:380px;margin:0;position:relative;z-index:1}.example h2{font-family:var(--display);font-size:clamp(34px,3.4vw,49px);font-weight:400;line-height:1.12;letter-spacing:-.04em}.example h2 em{display:block}.example-copy>p:not(.eyebrow){font-size:14px;line-height:1.75;max-width:310px;margin:24px 0 0;color:#42545c}.example-copy br{display:none}
.showcase-monitor{min-width:0;position:relative;perspective:1500px;padding:12px 14px 15px 0;isolation:isolate}.monitor-assembly{position:relative;transform:rotateY(-9deg) rotateX(2deg) rotateZ(-1deg);transform-origin:50% 75%;transform-style:preserve-3d}
.monitor-housing{position:relative;z-index:2;padding:9px 9px 0;border:1px solid #a4afa9;border-radius:17px;background:linear-gradient(135deg,#617078,#2a363d 23%,#17242b 78%,#53646b);box-shadow:inset 0 1px 0 #f2f5eb77,5px 6px 0 -2px #58686f,0 27px 40px -29px #20374099}
.monitor-chin{height:25px;display:grid;place-items:center}.monitor-chin:before{content:'';width:3px;height:3px;border-radius:50%;background:#bdcbbf;box-shadow:0 0 3px #b2dbd766}
.monitor-neck{position:relative;z-index:1;width:65px;height:56px;margin:-2px auto 0;clip-path:polygon(18% 0,83% 0,94% 100%,0 100%);background:linear-gradient(90deg,#667b82,#d2d9d2 44%,#a5b3b3 70%,#61777d)}
.monitor-base{position:relative;z-index:2;width:210px;height:12px;margin:-2px auto 0;border-radius:65% 65% 25% 25%;transform:skewX(-10deg);background:linear-gradient(#d4dad2,#a1b0b0 60%,#60757b);box-shadow:0 3px 1px -1px #6f8184,0 10px 13px -4px #354c5b55}
.showcase-monitor:after{content:'';position:absolute;bottom:3px;left:12%;right:4%;height:34px;border-radius:50%;background:radial-gradient(ellipse,#5e707833,transparent 68%);z-index:-1}
.showcase-frame{width:100%;margin:0;overflow:hidden;border:1px solid #10202a;border-radius:8px;background:#d9ddda;box-shadow:0 0 0 1px #4b5a61}
.showcase-chrome{height:37px;background:linear-gradient(180deg,#f4f4ecd4,#dfe5dfdc);display:flex;align-items:center;justify-content:space-between;padding:0 12px;border-bottom:1px solid #afbbb7;font-size:10px;color:#40545b}.chrome-dots{display:flex;gap:5px;width:65px}.chrome-dots i{height:5px;width:5px;border-radius:50%;background:#b0b9b3}.chrome-dots i:nth-child(2){background:#c6b5a6}.chrome-dots i:nth-child(3){background:#a0b3bd}.showcase-controls{display:flex;gap:6px}.showcase-controls button{width:28px;height:28px;border:1px solid #b1beb8;border-radius:6px;background:#fafbf157;font-size:13px;display:grid;place-items:center}.showcase-controls button:hover{background:#fdfef8}
.showcase-viewport{position:relative;aspect-ratio:3/2;background:#dbe0db;overflow:hidden}.showcase-viewport img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s cubic-bezier(.4,0,.2,1);display:block}.showcase-viewport img[data-current="true"],.showcase-viewport img:first-child:not([data-current]){opacity:1}
.process{background:transparent;overflow:visible;max-width:1440px;padding:65px 6% 75px}.process:before{display:none}.process-intro{text-align:center}.process-intro h2{font-family:var(--display);font-size:clamp(37px,4.2vw,60px);font-weight:400}.process-intro>p:last-child{font-size:15px;color:#42545b;line-height:1.6}
.process-cinema{width:100%;max-width:1190px;margin:35px auto 0;aspect-ratio:16/9;border:1px solid #afbab7;border-radius:23px;overflow:hidden;background:linear-gradient(145deg,#eef0e8,#cbd7d9 60%,#e5ddcf);box-shadow:inset 0 1px 0 white,0 25px 50px -40px #324c5788}.process-cinema iframe{width:100%;height:100%;display:block;border:0}
.process-control-row{max-width:1190px;margin:22px auto 0;display:flex;justify-content:center;align-items:center;gap:20px}.process-beats{display:flex;gap:9px}.process-beats button{font-size:12px;border:1px solid #b3c0bc;border-radius:8px;padding:8px 16px;transition:background .2s}.process-beats button[aria-pressed="true"]{background:#263d47;color:#f7faf4;border-color:#263d47}
.process-reading{max-width:620px;margin:33px auto 0;text-align:center;min-height:122px}.process-reading h3{font-family:var(--display);font-size:26px;line-height:1.25;font-weight:400;margin-bottom:12px}.process-reading p{font-size:14px;color:#40545d;line-height:1.65;margin:0}
.faq h2,.journal h2,.invitation h2{font-family:var(--display);font-weight:400}.faq{padding-top:75px}.footer-bottom>.tiny-label{display:none}
.faq-list details{overflow:hidden}.faq-list summary:focus-visible{outline-offset:-3px;border-radius:3px}
.faq-list summary:before,.faq-list summary:after{content:'';position:absolute;right:6px;top:50%;width:11px;height:1px;background:#62747b;transform:translateY(-50%);transition:transform .28s cubic-bezier(.22,1,.36,1),opacity .2s ease}
.faq-list summary:after{right:11px;width:1px;height:11px}.faq-list details[open] summary:after{content:''}.faq-list summary[aria-expanded="true"]:after,.faq-list details[open] summary:not([aria-expanded]):after{transform:translateY(-50%) rotate(90deg);opacity:0}
@media(max-width:1100px) and (min-width:701px){.service-grid{gap:16px}.service-card{padding:18px 12px;min-height:285px}.service-name{font-size:12px}.service-summary{font-size:10px}.service-art{height:130px}.service-card img{height:125px}.hero h1{font-size:5vw}}
@media(max-width:700px){
 .hero-copy{top:auto}.hero h1{font-size:clamp(34px,9.4vw,47px);line-height:1.1;letter-spacing:-.04em}.hero .intro{font-size:15px}
 .reference-art{mask-image:linear-gradient(90deg,transparent,#000 10%,#000 95%,transparent),linear-gradient(to bottom,transparent 70px,#000 155px,#000 510px,transparent 578px);mask-composite:intersect}
 .services{padding-top:45px;padding-bottom:55px}.services h2{font-size:36px;margin-bottom:30px}
 .service-grid{grid-template-columns:1fr;gap:27px;perspective:1200px}.service-card{min-height:155px;display:grid;grid-template-columns:105px 1fr;grid-template-rows:1fr 1fr;gap:6px 18px;padding:18px 22px;transform:rotateX(3deg)}.service-art{grid-row:1/3;height:115px;margin:0}.service-card img{height:110px;width:100%}.service-name{font-size:15px;align-self:end;margin:0}.service-summary{font-size:12px;align-self:start;max-width:220px}.service-card:last-child{grid-column:auto;max-width:none;width:auto}.service-card:last-child img{height:110px}
 .example{grid-template-columns:1fr;gap:24px;padding-top:35px;padding-bottom:65px}.example-copy{text-align:left;margin:0;max-width:100%}.example h2{font-size:36px;line-height:1.15}.example-copy>p:not(.eyebrow){font-size:14px;margin-top:20px;max-width:340px}
 .showcase-monitor{padding:4px 5px 12px;width:100%;margin:0}.monitor-assembly{transform:rotateY(-3deg) rotateX(1deg)}.monitor-housing{padding:5px 5px 0;border-radius:11px;box-shadow:inset 0 1px 0 #f2f5eb77,3px 4px 0 -1px #58686f,0 19px 28px -24px #20374099}.monitor-chin{height:16px}.monitor-neck{width:42px;height:37px}.monitor-base{width:140px;height:8px}.showcase-frame{border-radius:5px}.showcase-chrome{height:32px;padding:0 8px;font-size:9px}.chrome-dots{width:57px;gap:4px}.chrome-dots i{width:4px;height:4px}.showcase-controls{gap:4px}.showcase-controls button{width:24px;height:24px;font-size:12px}
 .process{padding:45px 7% 55px}.process-intro{text-align:left}.process-intro h2{font-size:36px}.process-intro>p:last-child{font-size:14px}.process-intro br{display:none}.process-cinema{aspect-ratio:720/1024;border-radius:17px;margin-top:26px}.process-control-row{flex-direction:column;gap:12px;margin-top:18px;align-items:stretch}.process-beats{gap:6px;justify-content:space-between}.process-beats button{padding:8px 9px;font-size:10px;flex:1;white-space:nowrap}.process-reading{text-align:left;min-height:145px;margin-top:24px}.process-reading h3{font-size:24px}.process-reading p{font-size:13px}
 .faq h2{font-size:38px}.journal h2{font-size:36px}.invitation h2{font-size:43px}
}
@media(prefers-reduced-motion:reduce){.card-edge,.connection-pulse{animation:none!important}.showcase-viewport img,.faq-list summary:before,.faq-list summary:after{transition:none}.service-card{transform:none}.service-card:hover{transform:none}}
