/* Konrad Okołotowicz / Cyan Studio 2026 */
:root{--bg:#07131d;--surface:#0b1b27;--card:#0d202d;--line:#213541;--text:#f5f8fa;--muted:#a0b2bf;--cyan:#12e5ed;--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:105px}body{margin:0;background:var(--bg);color:var(--text);font-family:Manrope,Arial,sans-serif;font-size:16px;line-height:1.75;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer;color:inherit}button,a{-webkit-tap-highlight-color:transparent}button{border:0}img{display:block;max-width:100%;height:auto}h1,h2,h3,p,figure{margin:0}h1,h2,h3{line-height:1.16}h1,h2{font-weight:750;letter-spacing:-.045em}h2{font-size:clamp(32px,3.05vw,46px)}p{color:var(--muted)}svg{display:block;width:100%;height:100%}[hidden]{display:none!important}::selection{background:var(--cyan);color:var(--bg)}:focus-visible{outline:2px solid var(--cyan);outline-offset:6px}.wrap{width:min(1200px,calc(100% - 112px));margin-inline:auto}.section{padding-block:100px}.accent{color:var(--cyan)}.muted{color:var(--muted)}.eyebrow{font-size:11px;letter-spacing:.18em;font-weight:700;color:var(--cyan);margin-bottom:23px;line-height:1.6}.eyebrow>span{display:inline-block;width:23px;height:1px;background:var(--cyan);vertical-align:middle;margin-right:9px}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:35px;margin-bottom:42px}.section-heading>p{font-size:14px;max-width:370px;padding-bottom:4px}.button{display:inline-flex;align-items:center;justify-content:center;gap:28px;background:var(--cyan);color:#04141c;padding:16px 22px;border:1px solid var(--cyan);border-radius:6px;font-size:13px;font-weight:800;line-height:1.5;transition:background .25s,transform .25s,box-shadow .25s}.button:hover{background:#71f8f8;transform:translateY(-3px);box-shadow:0 7px 28px #00d7ed24}.button>span{font-size:21px;font-weight:400;line-height:1}.button.outline{background:transparent;color:var(--text);border-color:#365160}.button.outline:hover{background:#123441;border-color:var(--cyan)}.button.small{padding:11px 18px;gap:26px;font-size:12px}.text-link{display:inline-flex;gap:25px;align-items:center;color:var(--cyan);font-weight:600;font-size:14px}.text-link:hover{color:#fff}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip{position:fixed;top:-100px;left:20px;background:var(--cyan);padding:10px 20px;color:var(--bg);z-index:100}.skip:focus{top:10px}
.header{height:91px;position:sticky;top:0;z-index:30;background:#07131dea;backdrop-filter:blur(18px);border-bottom:1px solid #1e34416b}.header-inner{display:flex;align-items:center;justify-content:space-between;height:100%;gap:32px}.brand{display:flex;align-items:center;gap:12px;line-height:1.12;flex-shrink:0}.brand img{width:43px;height:35px;object-fit:contain}.brand>span{font-size:13px;font-weight:500}.brand strong{display:block;font-size:19px;letter-spacing:-.04em;font-weight:800}.header nav{display:flex;gap:30px;align-items:center}.header nav a{font-size:12px;font-weight:600;color:#b7c7d3;padding-block:12px;position:relative}.header nav a:after{content:'';position:absolute;height:2px;width:0;bottom:4px;left:0;background:var(--cyan);transition:width .3s}.header nav a:hover,.header nav a.active{color:var(--text)}.header nav a.active:after,.header nav a:hover:after{width:100%}.menu-toggle{display:none}.reading-progress{height:2px;position:absolute;bottom:-1px;background:var(--cyan);width:100%;transform:scaleX(0);transform-origin:left;opacity:.7}
.hero{position:relative;display:grid;grid-template-columns:1fr 1.16fr;align-items:center;min-height:702px;padding-top:64px}.hero-copy{position:relative;z-index:2;padding-bottom:65px}.hero .eyebrow{font-size:10px;letter-spacing:.16em;margin-bottom:27px}.hero h1{font-size:clamp(48px,5.4vw,75px);line-height:1.07;letter-spacing:-.055em}.hero-description{font-size:15px;line-height:1.85;margin-top:25px}.hero-actions{display:flex;gap:12px;margin-top:29px}.hero-actions .button{font-size:12px;gap:20px;padding:15px 19px;white-space:nowrap}.hero-proof{display:flex;align-items:center;gap:12px;margin-top:32px}.hero-proof img{width:37px;height:37px;object-fit:cover;object-position:50% 18%;border-radius:50%;border:1px solid #436477}.hero-proof p{font-size:10px;line-height:1.7}.hero-proof strong{display:block;color:#cfdae2;font-weight:600;font-size:11px}.hero-visual{position:relative;align-self:stretch;display:flex;align-items:center;min-width:0;padding-bottom:65px}.device-art{width:132%;max-width:none;margin-left:-11%;position:relative;z-index:1;mix-blend-mode:lighten;mask-image:radial-gradient(ellipse at center,black 49%,#000c 64%,transparent 77%);animation:levitate 8s ease-in-out infinite;transform-origin:center}.hero-glow{position:absolute;inset:5% -4% 10% -10%;background:radial-gradient(ellipse,#03699330,transparent 65%);pointer-events:none}.floating-note{position:absolute;bottom:104px;right:0;z-index:3;display:flex;align-items:center;gap:12px;padding:12px 19px;border:1px solid #275364;background:#0b2230e8;border-radius:8px;box-shadow:0 10px 40px #0003;backdrop-filter:blur(16px);animation:levitate 8s ease-in-out infinite reverse}.floating-note>span:last-child{font-size:11px;line-height:1.7;color:var(--muted)}.floating-note strong{display:block;color:var(--text);font-size:12px}.note-icon{width:29px;height:29px;color:var(--cyan)}.visual-caption{position:absolute;bottom:56px;left:22%;font-size:9px;letter-spacing:.22em;color:#728d9f}.hero-bottom{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding:21px 0 25px;font-size:11px;color:var(--muted);letter-spacing:.015em}.hero-bottom>span{display:flex;align-items:center;gap:20px}.hero-bottom i{width:3px;height:3px;background:var(--cyan);border-radius:50%}.hero-bottom>a{display:flex;align-items:center;gap:14px}.scroll-circle{border:1px solid #334955;border-radius:50%;width:29px;height:29px;display:grid;place-items:center;font-size:15px;color:var(--cyan)}
.services{background:linear-gradient(120deg,#0a1b27,#081721);border-block:1px solid #19313e80;padding-block:70px}.services .section-heading{margin-bottom:32px}.services h2{font-size:34px}.services-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:13px}.service-card{position:relative;background:linear-gradient(130deg,#10273588,#0c1e2980);border:1px solid #24424f;border-radius:8px;padding:23px 19px 20px;display:flex;flex-direction:column;transition:transform .35s var(--ease),border-color .3s,background .3s}.service-card:hover{transform:translateY(-7px);border-color:var(--cyan);background:#10313f}.service-icon{display:block;width:29px;height:29px;margin-bottom:22px;color:var(--cyan)}.service-card h3{font-size:14px;line-height:1.45;min-height:41px;letter-spacing:-.025em}.service-card p{font-size:11px;line-height:1.7;margin:10px 0 22px}.service-card button{align-self:flex-start;background:transparent;width:26px;height:26px;display:grid;place-items:center;border:1px solid #365667;border-radius:50%;color:var(--cyan);font-size:15px;margin-top:auto;line-height:1}.service-card button:after{content:'';position:absolute;inset:0;border-radius:8px}.service-card:focus-within{border-color:var(--cyan)}
.work{padding-bottom:90px}.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:28px}.filters button{background:transparent;border:1px solid transparent;color:var(--muted);padding:9px 17px;border-radius:5px;font-size:12px;transition:.2s}.filters button:hover{color:#fff;border-color:var(--line)}.filters button[aria-pressed=true]{background:#12323d;color:var(--cyan);border-color:#235563}.filters span{font-size:10px;margin-left:6px;opacity:.7}.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:31px 24px}.project-card{min-width:0;animation:project-in .5s var(--ease) both}.project-image{position:relative;overflow:hidden;display:block;background:#102532;width:100%;aspect-ratio:1.46;border:1px solid #26414e;border-radius:8px;padding:0}.project-image img{width:100%;height:100%;object-fit:cover;transition:transform .75s var(--ease),filter .75s;filter:brightness(.86)}.project-card:hover img{transform:scale(1.055);filter:brightness(1)}.project-card.logo-card img{object-fit:contain;padding:60px;background:radial-gradient(ellipse,#174553,#0b1b27)}.project-arrow{display:grid;place-items:center;position:absolute;right:13px;bottom:13px;width:33px;height:33px;border:1px solid #527d88;background:#0a1c29bf;color:var(--cyan);border-radius:50%;transition:.3s}.project-card:hover .project-arrow{background:var(--cyan);color:var(--bg);transform:rotate(45deg)}.project-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:16px}.project-meta h3{font-size:17px;letter-spacing:-.03em}.project-meta p{font-size:10px;margin-top:5px;letter-spacing:.04em}.project-index{font-size:11px;color:#6f899a}.project-empty{grid-column:1/-1;background:var(--surface);border:1px solid var(--line);padding:50px;text-align:center;border-radius:8px}.project-empty p{margin:15px 0 25px}.more-row{margin-top:40px;display:flex;justify-content:space-between;align-items:center}.more-row>p{font-size:12px}.more-row .button{font-size:12px}
.about{display:grid;grid-template-columns:.94fr 1.15fr;gap:105px;align-items:center;border-top:1px solid var(--line);padding-top:90px}.about-visual{position:relative;height:500px;border-radius:10px;border:1px solid #35515e;margin-right:15px}.about-visual>img{width:100%;height:100%;object-fit:cover;object-position:center 30%;border-radius:9px;filter:saturate(.65)}.about-visual:after{content:'';position:absolute;inset:50% 0 0;background:linear-gradient(transparent,#061824d9);border-radius:0 0 9px 9px;pointer-events:none}.photo-label{position:absolute;z-index:1;bottom:25px;left:27px}.photo-label>span{font-size:9px;letter-spacing:.18em;color:#cfdae2}.photo-label strong{display:block;font-size:19px;margin-top:5px}.experience-card{position:absolute;z-index:2;right:-36px;bottom:62px;width:115px;padding:19px 17px;background:var(--cyan);color:var(--bg);border-radius:7px;transform:rotate(4deg);box-shadow:0 10px 30px #0003}.experience-card>strong{font-size:41px;letter-spacing:-.07em;line-height:1.15}.experience-card strong span{font-size:24px}.experience-card>span{font-size:11px;line-height:1.5;display:block;font-weight:600;margin-top:6px}.about-copy .eyebrow{margin-bottom:20px}.about-copy h2{font-size:36px;line-height:1.28}.about-copy>p{margin-top:19px;font-size:14px}.about-copy>p.lead{font-size:17px;color:#e0e7ed;line-height:1.7;margin-top:27px}.about-copy .button{margin-top:28px;font-size:12px}
.testimonials{background:var(--surface);border-block:1px solid #1a3341;padding-block:80px}.demo-label{color:#a5bbc7;font-size:10px;letter-spacing:.04em;border:1px solid #395261;border-radius:4px;padding:6px 9px;white-space:nowrap}.reviews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.review{padding:29px 27px;background:#0e2330;border:1px solid #243d4a;border-radius:8px;display:flex;flex-direction:column}.quote-mark{color:var(--cyan);font-family:Georgia,serif;font-size:60px;height:40px;line-height:1}.review blockquote{margin:15px 0 27px;font-size:14px;color:#d8e2e8;line-height:1.85}.review figcaption{display:flex;gap:12px;align-items:center;margin-top:auto;padding-top:20px;border-top:1px solid #27404c}.avatar{width:36px;height:36px;background:#1d3e4b;border-radius:50%;display:grid;place-items:center;color:#a7e6e8;font-size:11px}.review figcaption strong{font-size:12px;display:block}.review figcaption small{font-size:10px;color:var(--muted)}
.faq{display:grid;grid-template-columns:1fr 1.3fr;gap:80px}.faq h2{font-size:37px}.faq>div>p:not(.eyebrow){font-size:14px;margin-top:23px}.faq .text-link{margin-top:25px;font-size:12px}.faq-list{border-top:1px solid var(--line)}.faq details{border-bottom:1px solid var(--line)}.faq summary{font-size:13px;font-weight:600;padding:23px 32px 23px 0;list-style:none;position:relative;cursor:pointer;line-height:1.6}.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:'+';position:absolute;right:2px;top:17px;font-size:25px;font-weight:400;color:var(--cyan)}.faq details[open] summary:after{content:'−'}.faq details[open] summary{color:var(--cyan)}.faq details p{font-size:13px;line-height:1.8;padding:0 30px 24px 0;animation:project-in .3s ease}
.contact{padding-bottom:20px}.contact-panel{position:relative;overflow:hidden;border:1px solid #2394a0;border-radius:12px;padding:58px 65px;display:flex;justify-content:space-between;align-items:center;gap:40px;background:radial-gradient(ellipse at 80% -70%,#1fdae7 0%,transparent 70%),linear-gradient(110deg,#0d3b50,#086273 75%,#127689)}.contact-panel:after{content:'';position:absolute;width:650px;height:650px;right:-310px;top:-150px;border:1px solid #55f4f554;border-radius:50%;box-shadow:0 0 0 38px #53d7e50d,0 0 0 76px #53d7e50b,0 0 0 114px #53d7e509;pointer-events:none}.contact-panel>div,.contact-orb{position:relative;z-index:1}.contact .eyebrow{color:#8ef8f8;font-size:10px;margin-bottom:22px}.contact h2{font-size:39px;line-height:1.25}.contact h2>span{color:var(--cyan)}.contact-panel p:not(.eyebrow){color:#b8d8e0;font-size:13px;margin-top:20px}.contact-links{display:flex;gap:29px;flex-wrap:wrap;margin-top:26px;font-size:13px;font-weight:600}.contact-links a:hover{text-decoration:underline;text-underline-offset:5px}.contact-orb{border:1px solid #7deded;border-radius:50%;width:154px;height:154px;flex-shrink:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#39ebef10;transition:.4s}.contact-orb:hover{background:var(--cyan);color:var(--bg);transform:rotate(-5deg)}.contact-orb>span{font-size:46px;line-height:1}.contact-orb strong{font-size:9px;letter-spacing:.12em;text-align:center;line-height:1.7;margin-top:13px}
.benefits{padding-bottom:70px}.benefits-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:37px}.benefit-icon{display:block;width:30px;height:30px;color:var(--cyan);margin-bottom:23px}.benefits h3{font-size:15px;line-height:1.4;margin-bottom:12px;max-width:190px}.benefits article>p{font-size:12px;line-height:1.9}.trusted{border-top:1px solid var(--line);padding-top:46px;padding-bottom:51px;text-align:center}.trusted .eyebrow{font-size:9px;color:#829dab}.client-logos{display:flex;align-items:center;justify-content:space-between;gap:28px;margin-top:38px;color:#c3d0d9}.client-logos>span{line-height:1.05;opacity:.65;transition:opacity .3s}.client-logos>span:hover{opacity:1}.client-logos small{display:block;font-size:8px;letter-spacing:.27em;font-weight:500;margin-top:6px}.client-sajdak{font-size:27px;letter-spacing:.18em;font-weight:800}.client-domy{font-size:19px;letter-spacing:.18em;font-weight:600}.client-domy span{display:block;font-size:15px;margin-top:5px;font-weight:400;letter-spacing:.32em}.client-cfr{font-weight:800;font-size:34px;letter-spacing:-.05em}.client-cfr small{font-size:6px;letter-spacing:.04em}.client-dragon{font-weight:800;font-style:italic;font-size:30px;letter-spacing:-.07em}.client-dragon>span{display:block;font-style:normal;letter-spacing:.38em;font-size:10px;margin-top:5px}.client-hhs{font-weight:800;font-size:31px;letter-spacing:.05em}.numbers{padding-block:55px 80px;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}.number{text-align:center;padding-inline:20px;border-right:1px solid var(--line)}.number:first-child{text-align:left;padding-left:0}.number:last-child{border:0}.number>strong{font-size:39px;letter-spacing:-.06em;font-weight:700;line-height:1}.number i{font-style:normal;font-size:27px;color:var(--cyan);margin-left:4px}.number p{font-size:10px;margin-top:13px;letter-spacing:.01em}
.footer{background:#051019;border-top:1px solid #1c3442;padding:58px 0 0}.footer-grid{display:grid;grid-template-columns:1.3fr .7fr 1fr 1.2fr;gap:35px;padding-bottom:50px}.footer h3{font-size:12px;margin-bottom:22px}.footer-grid>div>a:not(.brand){display:block;font-size:11px;color:var(--muted);margin-bottom:9px}.footer-grid>div>a:hover{color:var(--cyan)}.footer p{font-size:11px;line-height:1.9;margin-top:15px}.footer-intro .brand img{width:34px}.footer-intro .brand strong{font-size:16px}.footer-intro .brand>span{font-size:11px}.socials{display:flex;gap:9px;margin-top:22px}.socials button{border:1px solid #28404e;color:#a9bfcc;background:transparent;font-size:12px;font-weight:700;width:30px;height:30px;border-radius:5px;padding:0}.socials button:hover{border-color:var(--cyan);color:var(--cyan)}.footer-grid .footer-email{color:#e3edf2!important}.footer-grid a.text-link{color:var(--cyan)!important;margin-top:22px}.footer-bottom{border-top:1px solid #1a2e3b;padding:22px 0 27px;display:flex;justify-content:space-between;align-items:center;color:#8ca4b4}.footer-bottom small,.footer-bottom a{font-size:10px}.footer-bottom a>span{display:inline-grid;place-items:center;width:29px;height:29px;margin-left:12px;border:1px solid #274351;border-radius:50%;color:var(--cyan);font-size:16px}
dialog{color:var(--text);background:#0b1d2a;border:1px solid #375666;border-radius:12px;width:min(760px,calc(100% - 32px));max-height:88dvh;padding:40px;box-shadow:0 30px 120px #0009}dialog::backdrop{background:#02090ed9;backdrop-filter:blur(10px)}dialog:open{animation:project-in .25s ease}.dialog-close{position:sticky;display:block;top:0;margin:-23px -23px 8px auto;z-index:2;border:1px solid #537382;width:34px;height:34px;border-radius:50%;background:#0b1d2a;color:#fff;font-size:25px;line-height:1}.dialog-close:hover{background:var(--cyan);color:var(--bg)}#dialog-content>img{width:100%;max-height:48vh;object-fit:contain;border-radius:6px;margin-bottom:28px;background:#102c3b}#dialog-content .eyebrow{font-size:10px;margin-bottom:16px}#dialog-content h2{font-size:33px;margin-bottom:20px}#dialog-content p:not(.eyebrow){font-size:15px}#dialog-content .button{margin-top:27px}.modal-open{overflow:hidden}
.reveal{opacity:1;transform:none}.motion-ready .reveal:not(.visible){opacity:0;transform:translateY(24px)}.motion-ready .reveal{transition:opacity .75s var(--ease),transform .75s var(--ease);transition-delay:var(--delay,0ms)}@keyframes levitate{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes project-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
/* About page */
.about-page-intro{padding-top:75px;padding-bottom:70px;display:grid;grid-template-columns:1.2fr 1fr;gap:80px;align-items:center}.breadcrumb{font-size:12px;color:var(--muted);margin-bottom:35px}.breadcrumb a{color:var(--cyan)}.about-page-intro h1{font-size:58px;margin-bottom:28px}.about-page-intro .lead{color:#dae5ec;font-size:19px}.about-page-intro p:not(.eyebrow):not(.breadcrumb){margin-bottom:22px}.about-page-intro .about-visual{height:590px;margin:0}.about-story{max-width:780px;margin:auto;padding:20px 0 80px}.about-story h2{font-size:32px;margin:35px 0 22px}.about-story p{margin-top:18px}.about-story .button{margin-top:32px}.about-page .footer-bottom{margin-top:30px}
@media(min-width:1500px){.hero{min-height:760px}.hero h1{font-size:80px}.hero-description{font-size:17px}.hero-visual{margin-right:-50px}.wrap{width:min(1260px,calc(100% - 160px))}.service-card h3{font-size:15px}.service-card p{font-size:12px}}
@media(max-width:1150px){.wrap{width:calc(100% - 72px)}.header nav{gap:23px}.hero{min-height:650px;grid-template-columns:1fr 1fr}.hero h1{font-size:60px}.hero-actions{gap:9px}.hero-actions .button{font-size:11px;padding:13px;gap:13px}.hero-visual{overflow:visible}.device-art{width:135%;margin-left:-19%}.floating-note{bottom:110px;right:-5px;padding:10px 14px}.services-grid{grid-template-columns:repeat(3,1fr)}.service-card{padding:24px;display:grid;grid-template-columns:1fr 28px;column-gap:15px}.service-icon{grid-column:1/-1;margin-bottom:18px}.service-card h3{font-size:16px;min-height:0;grid-column:1/-1}.service-card p{font-size:12px;grid-column:1;margin-bottom:0}.service-card button{grid-column:2;align-self:end}.about{gap:65px}.about-copy h2{font-size:32px}.contact-panel{padding:46px}.contact h2{font-size:36px}.reviews-grid{gap:16px}.review{padding:25px 22px}.footer-grid{gap:25px}.project-grid{gap:27px 18px}}
@media(max-width:850px){.wrap{width:calc(100% - 48px)}.header{height:78px}.header-inner{gap:20px}.header nav{gap:17px}.header nav a{font-size:11px}.header .button.small{font-size:10px;gap:12px;padding:10px 12px}.brand img{width:34px}.brand strong{font-size:16px}.hero{padding-top:47px;min-height:610px}.hero h1{font-size:50px}.hero-description{font-size:13px}.hero-actions{flex-wrap:wrap}.hero-actions .button{font-size:11px}.hero-proof p>span{display:none}.hero-copy{padding-bottom:40px}.floating-note{bottom:125px;right:-7px;padding:9px 11px}.floating-note strong{font-size:10px}.floating-note>span:last-child{font-size:9px}.note-icon{width:23px;height:23px}.visual-caption{display:none}.hero-bottom{font-size:10px}.section{padding-block:70px}.section-heading>p{font-size:12px}.section-heading{gap:20px}.services h2{font-size:30px}.about{gap:47px;grid-template-columns:.9fr 1.1fr}.about-visual{height:450px}.about-copy h2{font-size:27px}.about-copy>p{font-size:12px}.about-copy>p.lead{font-size:15px}.experience-card{right:-25px;width:100px;padding:15px}.experience-card>strong{font-size:35px}.photo-label{left:18px}.photo-label strong{font-size:15px}.project-meta h3{font-size:15px}.project-meta p{font-size:9px}.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.reviews-grid{gap:13px}.review{padding:23px 18px}.review blockquote{font-size:12px}.review figcaption{gap:9px}.review figcaption small{font-size:9px}.demo-label{font-size:9px;white-space:normal;max-width:170px}.faq{gap:35px;grid-template-columns:.85fr 1.15fr}.faq h2{font-size:30px}.faq summary{font-size:12px;padding-block:21px}.contact-panel{padding:40px 30px}.contact h2{font-size:30px}.contact-orb{width:124px;height:124px}.contact-links{gap:10px 20px}.benefits-grid{gap:23px}.benefits h3{font-size:13px}.benefits article>p{font-size:11px}.number>strong{font-size:30px}.number i{font-size:21px}.number p{font-size:9px}.footer-grid{grid-template-columns:1.2fr .8fr 1fr;gap:35px}.footer-grid>div:last-child{grid-column:1/-1;display:flex;gap:20px;align-items:center;flex-wrap:wrap}.footer-grid>div:last-child>*{margin:0!important}.footer-grid>div:last-child h3{width:100%}.about-page-intro{gap:40px}.about-page-intro h1{font-size:44px}.about-story{padding-inline:24px}}
@media(max-width:640px){html{scroll-padding-top:84px}.wrap{width:calc(100% - 40px)}.header{height:76px}.header-inner{gap:14px}.header .brand img{width:33px}.brand>span{font-size:11px}.brand strong{font-size:15px}.header .button.small{margin-left:auto;font-size:10px;gap:10px;padding:9px 10px}.menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:6px;background:transparent;padding:10px;width:40px;height:40px;order:3}.menu-toggle span{height:1px;width:20px;background:#d4e8ed;transition:.2s}.menu-toggle[aria-expanded=true] span:first-child{transform:translateY(3.5px) rotate(45deg)}.menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}.header nav{position:absolute;top:75px;left:0;right:0;display:none;background:#0a1e2bf5;backdrop-filter:blur(20px);padding:15px 24px 25px;flex-direction:column;align-items:stretch;gap:0;border-bottom:1px solid #35525f}.header nav.open{display:flex}.header nav a{font-size:15px;padding:13px 0}.header nav a:after{max-width:35px}.hero{display:flex;flex-direction:column;align-items:stretch;padding-top:45px;min-height:0}.hero-copy{padding-bottom:0}.hero .eyebrow{font-size:9px;letter-spacing:.14em;margin-bottom:25px}.hero h1{font-size:clamp(45px,12vw,66px);line-height:1.08}.hero-description{font-size:13px;line-height:1.85;margin-top:24px}.hero-actions{margin-top:25px;gap:10px;flex-wrap:wrap}.hero-actions .button{font-size:11px;padding:13px 14px;gap:17px;min-height:46px}.hero-proof{margin-top:25px}.hero-proof p>span{display:block;font-size:9px}.hero-proof strong{font-size:10px}.hero-proof img{width:33px;height:33px}.hero-visual{height:300px;min-height:300px;padding:0;align-self:auto;margin:1px -8px 0}.device-art{width:116%;margin-left:-8%;max-width:none}.hero-glow{inset:0}.floating-note{bottom:22px;right:0;padding:8px 12px}.hero-bottom{margin-top:9px;padding:17px 0;font-size:9px}.hero-bottom>span{display:block;max-width:160px;line-height:1.9}.hero-bottom i{display:none}.hero-bottom>a{gap:9px;font-size:9px}.section{padding-block:59px}.section-heading{display:block;margin-bottom:29px}.section-heading .eyebrow{margin-bottom:16px}.section-heading>p{margin-top:20px;font-size:12px}.section-heading h2,h2{font-size:32px}.services h2{font-size:30px}.services-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.service-card{padding:21px 15px;display:flex}.service-icon{width:28px;height:28px;margin-bottom:18px}.service-card h3{font-size:14px;line-height:1.4;min-height:39px}.service-card p{font-size:11px;line-height:1.7;margin:10px 0 16px}.service-card button{margin-top:auto;align-self:flex-start;min-height:30px;min-width:30px}.filters{gap:7px;margin-bottom:23px}.filters button{font-size:11px;padding:8px 11px}.project-grid{gap:26px 14px;grid-template-columns:1fr}.project-image{aspect-ratio:1.5}.project-meta h3{font-size:17px}.project-meta p{font-size:10px}.project-meta{padding-top:13px}.project-index{font-size:11px}.more-row{gap:20px;margin-top:31px}.more-row>p{font-size:10px;max-width:120px}.more-row .button{font-size:11px;padding:13px;gap:18px}.about{display:flex;flex-direction:column;gap:42px;align-items:stretch}.about-visual{height:430px;max-width:390px;width:calc(100% - 18px);margin:0}.about-visual>img{object-position:50% 30%}.experience-card{right:-18px;bottom:60px}.photo-label{left:22px}.photo-label strong{font-size:18px}.about-copy h2{font-size:29px}.about-copy>p{font-size:14px}.about-copy>p.lead{font-size:17px}.eyebrow{font-size:10px}.about-copy .eyebrow{margin-top:0;font-size:10px}.testimonials .demo-label{display:inline-block;max-width:none;margin-top:20px;font-size:9px}.reviews-grid{grid-template-columns:1fr;gap:15px}.review{padding:26px}.review blockquote{font-size:14px;margin-bottom:23px}.review figcaption small{font-size:11px}.review figcaption strong{font-size:13px}.avatar{width:38px;height:38px}.faq{display:block}.faq-list{margin-top:30px}.faq h2{font-size:32px}.faq summary{font-size:13px;padding-block:22px}.faq details p{font-size:13px}.contact{padding-bottom:0}.contact-panel{padding:31px 25px;flex-direction:column;align-items:flex-start;gap:30px;border-radius:9px}.contact .eyebrow{font-size:9px}.contact h2{font-size:30px}.contact-panel p:not(.eyebrow){font-size:12px}.contact-links{flex-direction:column;font-size:12px}.contact-orb{width:110px;height:110px;align-self:flex-end;margin-top:-20px}.contact-orb>span{font-size:36px}.contact-orb strong{font-size:8px;margin-top:7px}.benefits-grid{grid-template-columns:repeat(2,1fr);gap:34px 25px}.benefits h3{font-size:14px}.benefits article>p{font-size:12px}.benefit-icon{margin-bottom:18px}.trusted{padding-block:35px}.trusted .eyebrow{font-size:8px;letter-spacing:.14em}.client-logos{justify-content:center;flex-wrap:wrap;gap:32px 39px;margin-top:30px}.client-logos>span{font-size:24px}.client-domy{font-size:16px!important}.client-domy span{font-size:12px}.client-logos small{font-size:7px}.client-cfr small{font-size:5px}.numbers{grid-template-columns:repeat(2,1fr);gap:31px 0;padding:36px 0 48px}.number{padding-inline:9px}.number:first-child{text-align:center;padding-left:9px}.number:nth-child(2){border-right:0}.number>strong{font-size:31px}.number p{font-size:9px;margin-top:9px}.footer{padding-top:40px}.footer-grid{grid-template-columns:1fr 1fr;gap:34px 28px;padding-bottom:32px}.footer-intro{grid-column:1/-1}.footer .brand img{width:39px}.footer-intro p{font-size:12px}.footer-grid>div>a:not(.brand){font-size:12px}.footer h3{font-size:13px;margin-bottom:18px}.footer-grid>div:last-child{display:block}.footer-grid>div:last-child>*{margin-bottom:10px!important}.footer-grid>div:last-child h3{margin-bottom:18px!important}.footer-grid>div:last-child .text-link{margin-top:17px!important}.footer-bottom{gap:15px;padding-block:18px}.footer-bottom small{max-width:225px;font-size:9px}.footer-bottom a{white-space:nowrap;font-size:9px}.footer-bottom a>span{margin-left:6px;width:25px;height:25px}.socials button{width:36px;height:36px}dialog{padding:28px 23px}.dialog-close{margin:-13px -9px 10px auto}#dialog-content h2{font-size:27px}#dialog-content p:not(.eyebrow){font-size:14px}#dialog-content .button{font-size:12px;padding:14px}.about-page-intro{display:flex;flex-direction:column;padding-top:36px;gap:20px;align-items:stretch}.about-page-intro h1{font-size:44px}.about-page-intro .lead{font-size:17px}.about-page-intro .about-visual{width:100%;height:530px}.about-page-intro p:not(.eyebrow){font-size:14px}.about-story{padding:0 20px 55px}.about-story h2{font-size:29px}.about-story p{font-size:14px}}
@media(max-width:360px){.header .button.small{display:none}.menu-toggle{margin-left:auto}.hero-actions{flex-direction:column;align-items:flex-start}.hero-visual{height:255px;min-height:255px}.hero h1{font-size:44px}.hero-proof p>span{font-size:8px}.services-grid{gap:10px}.service-card{padding:18px 13px}.contact h2{font-size:27px}.footer-grid{gap:30px 18px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.motion-ready .reveal:not(.visible){opacity:1;transform:none}}
.project-wordmark{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;font-size:34px;font-weight:800;letter-spacing:-.04em;color:#e5f4fa;background:radial-gradient(ellipse at 60% 35%,#1c5266,#0c2334 80%)}.project-wordmark small{display:block;font-size:9px;color:var(--cyan);letter-spacing:.15em;font-weight:500;margin-top:14px}
/* Keep the entire device composition within the page at every breakpoint. */
.hero-visual{overflow:clip}.device-art{width:112%;margin-left:-6%}.hero-glow{inset:5% 0 10%}.hero-proof img{object-position:50% 24%}.brand img{height:32px}
@media(max-width:640px){.hero-visual{margin-inline:0}.device-art{width:112%;margin-left:-6%}}
.device-art{mask-image:none}
.service-page-link{align-self:flex-start;margin-top:auto;width:26px;height:26px;border:1px solid #365667;border-radius:50%;display:grid;place-items:center;color:var(--cyan);font-size:15px;line-height:1}
.service-page-link:after{content:'';position:absolute;inset:0;border-radius:8px}
.header nav .mega-service[aria-current=page]{background:#102d3b;border-color:#27515e}
@media(max-width:640px){.service-page-link{min-height:30px;min-width:30px}}

/* Supplied studio portrait: blend its edges into the page without changing the photo. */
.hero:has(.hero-portrait){padding-top:28px}
.hero-portrait-visual{min-height:615px;align-self:stretch;margin-left:-40px;margin-right:-24px;padding:0;isolation:isolate;overflow:hidden}
.hero-portrait{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:57% 43%;mask-image:linear-gradient(90deg,transparent 0%,#000 18%,#000 90%,transparent 100%),linear-gradient(0deg,transparent 0%,#000 17%,#000 92%,transparent 100%);mask-composite:intersect}
.hero-portrait-visual .hero-glow{inset:4% 0 9%;background:radial-gradient(ellipse at 65% 42%,#0e698939,transparent 68%);z-index:-1}
.hero-portrait-visual .floating-note{right:32px;bottom:58px;animation:none;background:#0b2230dc}
.hero-portrait-visual .visual-caption{left:auto;right:36px;bottom:20px;font-size:9px;letter-spacing:.15em}
@media(min-width:1500px){.hero-portrait-visual{min-height:655px;margin-right:-28px}}
@media(min-width:851px) and (max-width:1150px){.hero-portrait-visual{min-height:570px;margin-left:-26px;margin-right:-16px}.hero-portrait-visual .floating-note{right:20px;bottom:55px}.hero-portrait-visual .visual-caption{right:24px;font-size:8px}}
@media(min-width:641px) and (max-width:850px){.hero-portrait-visual{min-height:530px;margin-left:-12px;margin-right:-12px}.hero-portrait{object-position:59% 40%;mask-image:linear-gradient(90deg,transparent,#000 12%,#000 91%,transparent),linear-gradient(0deg,transparent,#000 17%,#000 92%,transparent)}.hero-portrait-visual .floating-note{right:10px;bottom:65px;max-width:90%}.hero-portrait-visual .floating-note strong{font-size:10px}}
@media(max-width:640px){.hero:has(.hero-portrait){padding-top:40px}.hero-portrait-visual{min-height:0;height:auto;aspect-ratio:1/1.06;align-self:stretch;margin:6px -10px -4px;padding:0}.hero-portrait{object-position:57% 38%;mask-image:linear-gradient(90deg,transparent,#000 9%,#000 93%,transparent),linear-gradient(0deg,transparent,#000 16%,#000 93%,transparent)}.hero-portrait-visual .floating-note{right:16px;bottom:25px;padding:10px 13px}.hero-portrait-visual .floating-note>span:last-child{font-size:10px}.hero-portrait-visual .floating-note strong{font-size:11px}.hero-portrait-visual .visual-caption{display:none}}

/* Full-width offer disclosure: shared by the homepage and About page. */
.mega-disclosure{position:static;display:flex;align-items:center}
.offer-toggle{position:relative;display:flex;align-items:center;gap:7px;padding:12px 0;background:none;color:#b7c7d3;font-size:12px;font-weight:600;line-height:1.75}
.offer-toggle>svg{width:13px;height:13px;transition:transform .25s}
.offer-toggle:after{content:'';position:absolute;bottom:4px;left:0;height:2px;width:0;background:var(--cyan);transition:width .25s}
.offer-toggle:hover,.offer-toggle.active,.offer-toggle[aria-expanded=true]{color:var(--text)}
.offer-toggle.active:after,.offer-toggle[aria-expanded=true]:after{width:100%}
.offer-toggle[aria-expanded=true]>svg{transform:rotate(180deg);color:var(--cyan)}
.mega-menu{scrollbar-width:thin;scrollbar-color:#31586a #0a1b27;position:absolute;top:100%;left:0;right:0;max-height:calc(100dvh - 91px);overflow-y:auto;overscroll-behavior:contain;background:#0a1b27;border-block:1px solid #284652;box-shadow:0 24px 50px #0005;animation:mega-enter .25s var(--ease) both}
.mega-inner{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:44px;padding-block:33px}
.mega-heading{padding:0 14px 20px}
.mega-heading>p{font-size:10px;letter-spacing:.15em;color:var(--cyan);margin-bottom:8px;font-weight:700}
.mega-heading>span{font-size:24px;font-weight:700;letter-spacing:-.04em;line-height:1.3}
.mega-services{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.header nav .mega-service{display:flex;align-items:flex-start;gap:13px;padding:17px 13px;border:1px solid transparent;border-radius:7px;transition:background .2s,border-color .2s;color:var(--text);font-weight:400}
.header nav .mega-menu a:after{display:none}
.header nav .mega-service:hover,.header nav .mega-service:focus-visible{background:#102d3b;border-color:#27515e}
.mega-icon{display:block;flex:0 0 26px;width:26px;height:26px;color:var(--cyan);margin-top:2px}
.mega-service-copy{display:block;min-width:0}
.mega-service-copy>strong{display:block;font-size:14px;line-height:1.4;font-weight:700;margin-bottom:6px;letter-spacing:-.015em}
.mega-service-copy>span{display:block;color:#9fb5c4;font-size:12px;line-height:1.65}
.mega-arrow{font-size:17px;margin-left:auto;line-height:1.4;color:#6899a7;transition:color .2s,transform .2s}
.mega-service:hover .mega-arrow{color:var(--cyan);transform:translate(2px,-2px)}
.header nav .mega-all{display:flex;align-items:center;gap:18px;width:fit-content;font-size:12px;font-weight:700;margin:17px 14px 0;padding:10px 0 0;color:var(--cyan)}
.mega-all>span{font-size:20px;line-height:1}
.mega-contact{position:relative;isolation:isolate;overflow:hidden;border:1px solid #226274;border-radius:9px;padding:28px;background:radial-gradient(ellipse at 100% 0%,#117785,transparent 70%),#103441;display:flex;flex-direction:column;align-items:flex-start}
.mega-contact:after{content:'';position:absolute;z-index:-1;right:-165px;top:-130px;width:340px;height:340px;border:1px solid #4edfdf25;border-radius:50%;box-shadow:0 0 0 32px #36dedc06,0 0 0 64px #36dedc04;pointer-events:none}
.mega-contact-kicker{font-size:9px;font-weight:700;letter-spacing:.12em;color:#8ef2ef;line-height:1.6}
.mega-contact h2{font-size:29px;line-height:1.2;margin:20px 0 15px;letter-spacing:-.035em}
.mega-contact h2>span{color:var(--cyan)}
.mega-contact p{font-size:12px;line-height:1.8;color:#b7d2dc;margin-bottom:25px}
.header nav .mega-contact-cta{display:flex;justify-content:space-between;align-items:center;gap:16px;width:100%;margin-top:auto;padding:12px 16px;background:var(--cyan);color:#04141c;border:1px solid var(--cyan);border-radius:5px;font-weight:800;font-size:12px;transition:background .2s}
.header nav .mega-contact-cta:hover{background:#74f6f7;color:#04141c}
.mega-contact-cta>span{font-size:20px;line-height:1}
.header nav .mega-email{font-size:11px;color:#b7d2dc;padding:0;margin-top:13px;align-self:center;overflow-wrap:anywhere}
.header nav .mega-email:hover{color:var(--cyan)}
.mega-backdrop{position:fixed;inset:0;z-index:25;background:#02091088;backdrop-filter:blur(3px);animation:mega-backdrop-in .2s ease both}
@keyframes mega-enter{from{opacity:0;transform:translateY(-9px)}to{opacity:1;transform:translateY(0)}}
@keyframes mega-backdrop-in{from{opacity:0}to{opacity:1}}
@media(max-width:1000px){.mega-inner{gap:22px;grid-template-columns:minmax(0,1fr) 260px}.mega-contact{padding:25px 21px}.mega-contact h2{font-size:27px}.mega-heading{padding-inline:10px}.header nav .mega-service{padding:15px 9px;gap:10px}.mega-icon{width:23px;height:23px;flex-basis:23px}.mega-service-copy>strong{font-size:13px}.mega-service-copy>span{font-size:11px}.mega-arrow{display:none}}
@media(min-width:641px) and (max-width:850px){.offer-toggle{font-size:11px}.mega-menu{max-height:calc(100dvh - 78px)}.mega-inner{grid-template-columns:minmax(0,1fr) 230px;gap:16px}.mega-contact{padding:23px 18px}.mega-contact h2{font-size:25px}.mega-contact-kicker{font-size:8px}.mega-service-copy>strong{font-size:12px}.mega-icon{flex-basis:21px;width:21px;height:21px}}
@media(max-width:640px){
 .header nav{scrollbar-width:thin;scrollbar-color:#31586a #0a1b27;max-height:calc(100dvh - 76px);overflow-y:auto;overscroll-behavior:contain}
 .mega-disclosure{display:block}
 .offer-toggle{width:100%;font-size:15px;padding:13px 0;justify-content:space-between}
 .offer-toggle>svg{width:17px;height:17px}
 .offer-toggle.active:after,.offer-toggle[aria-expanded=true]:after{width:35px}
 .mega-menu{position:static;max-height:none;overflow:visible;margin:5px -24px 12px;width:calc(100% + 48px);box-shadow:none;border-color:#234652}
 .mega-inner{width:calc(100% - 40px);display:grid;grid-template-columns:1fr;gap:20px;padding-block:22px}
 .mega-heading{padding:0 8px 16px}.mega-heading>p{font-size:8px}.mega-heading>span{font-size:21px}
 .mega-services{grid-template-columns:1fr;gap:3px}
 .header nav .mega-service{padding:13px 8px;gap:14px;border-bottom-color:#213b49;border-radius:5px}
 .mega-icon{flex-basis:25px;width:25px;height:25px}
 .mega-service-copy>strong{font-size:14px}.mega-service-copy>span{font-size:12px}.mega-arrow{display:block}
 .header nav .mega-all{margin:12px 8px 0;padding:8px 0;font-size:12px}
 .mega-contact{padding:24px}.mega-contact h2{font-size:27px;margin-top:14px}.mega-contact h2 br:nth-child(2){display:none}
 .mega-contact p{font-size:13px;margin-bottom:19px}.header nav .mega-contact-cta{font-size:13px;padding:14px 16px}
 .header nav .mega-email{font-size:12px}.mega-contact-kicker{font-size:9px}
}



/* Highlighted personal support link, shared by all static pages. */
.header nav a.support-nav{display:inline-flex;align-items:center;gap:7px;white-space:nowrap;padding:8px 11px;border:1px solid #d0a17e60;border-radius:6px;color:#ffe0c9;background:#38281b45;font-size:11px;transition:background .2s,border-color .2s}
.header nav a.support-nav>span{font-size:10px;font-weight:800;color:#07131d;background:#ffd3b8;border-radius:3px;padding:2px 5px;line-height:1.5}
.header nav a.support-nav:after{display:none}.header nav a.support-nav:hover,.header nav a.support-nav[aria-current=page]{background:#51382470;border-color:#ffd3b8;color:#fff}
@media(min-width:641px){.header:has(.support-nav) nav{gap:22px}.header:has(.support-nav) .header-inner{gap:23px}}
@media(min-width:641px) and (max-width:1100px){.header:has(.support-nav) .header-inner>.button{display:none}.header:has(.support-nav) nav{gap:17px}.header:has(.support-nav) .header-inner{gap:18px}.header nav a.support-nav{font-size:10px;padding:8px}.header:has(.support-nav) nav a{font-size:11px}}
@media(min-width:641px) and (max-width:750px){.header:has(.support-nav) .brand strong{font-size:15px}.header:has(.support-nav) .brand img{width:32px}.header:has(.support-nav) nav{gap:12px}.header:has(.support-nav) nav a{font-size:10px}.header nav a.support-nav{gap:5px;padding:7px}.header nav a.support-nav>span{font-size:9px}}
@media(max-width:640px){.header nav a.support-nav{font-size:14px;padding:13px 14px;align-self:flex-start;margin-top:12px;gap:11px}.header nav a.support-nav>span{font-size:12px}}
/* Matching laptop + phone composition for web portfolio thumbnails. */
.web-preview-card .project-image{background:#d9dbde;aspect-ratio:1.515;border-color:#50606b}
.web-preview-card .project-image img{object-fit:contain;filter:none}
.web-preview-card:hover .project-image img{transform:scale(1.025);filter:none}
.supplied-mockup-card .project-image{background:var(--bg);border:0}
.supplied-mockup-card .project-image img{display:block;object-fit:cover}

/* Animation portfolio */
.motion-project-card .project-image{aspect-ratio:16/9;background:#07131d}.motion-project-card .project-image img{width:100%;height:100%;object-fit:cover}.case-video{aspect-ratio:16/9;width:100%;background:#07131d}.case-video iframe{display:block;width:100%;height:100%;border:0}

/* Print portfolio */
.print-project-card .project-image{aspect-ratio:1}.print-project-card .project-image img{width:100%;height:100%;object-fit:contain}
