@import url("https://fonts.googleapis.com/css2?family=Archivo+Black&family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,700&display=swap");

:root { color-scheme: dark; --ink:#090909; --paper:#eeeae2; --accent:#f0442f; --muted:#aaa69f; --line:rgba(238,234,226,.22); --max:1440px; --gutter:clamp(1rem,3vw,3rem); --display:"Archivo Black",Impact,sans-serif; --body:"DM Sans",Arial,sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--ink); color:var(--paper); font-family:var(--body); line-height:1.5; overflow-x:hidden; }
body.menu-open { overflow:hidden; }
a { color:inherit; text-decoration:none; }
button { color:inherit; font:inherit; }
.sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
a:focus-visible,button:focus-visible,summary:focus-visible { outline:3px solid var(--accent); outline-offset:4px; box-shadow:0 0 0 2px var(--ink); }
[id] { scroll-margin-top:5.5rem; }
.scroll-progress { position:fixed; inset:0 auto auto 0; z-index:100; width:100%; height:3px; background:var(--accent); transform:scaleX(0); transform-origin:left; }
.site-header { position:fixed; inset:0 0 auto; z-index:50; display:flex; align-items:center; justify-content:space-between; height:5.5rem; padding:0 var(--gutter); border-bottom:1px solid transparent; transition:background .3s,border-color .3s; }
.site-header.is-scrolled { background:rgba(9,9,9,.88); border-color:var(--line); backdrop-filter:blur(14px); }
.brand { display:block; width:6.5rem; line-height:0; }
.brand img { display:block; width:100%; height:auto; }
.nav-links { display:flex; align-items:center; gap:clamp(1rem,2.4vw,2.8rem); font-size:.76rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
.nav-links a:not(.nav-cta) { position:relative; }
.nav-links a:not(.nav-cta)::after { content:""; position:absolute; right:0; bottom:-.4rem; left:0; height:1px; background:var(--accent); transform:scaleX(0); transition:transform .25s; }
.nav-links a:hover::after,.nav-links a.is-active::after { transform:scaleX(1); }
.nav-cta { padding:.8rem 1rem; border:1px solid var(--paper); transition:background .25s,color .25s; }
.nav-cta:hover { background:var(--paper); color:var(--ink); }
.menu-toggle { display:none; border:0; background:none; }

.hero { position:relative; display:flex; min-height:100svh; padding:8rem var(--gutter) 2.5rem; overflow:hidden; isolation:isolate; }
.hero-media,.hero-overlay { position:absolute; inset:0; z-index:-2; }
.hero-media { background:url("./assets/pierwsze-zdjecie.webp") center 52%/cover; transform:scale(1.05); animation:hero-media 1.8s cubic-bezier(.16,1,.3,1) forwards; }
.hero-overlay { z-index:-1; background:linear-gradient(180deg,rgba(0,0,0,.36),rgba(0,0,0,.02) 38%,rgba(0,0,0,.63)); }
.hero-topline { position:absolute; top:7.5rem; right:var(--gutter); left:var(--gutter); display:flex; justify-content:flex-end; font-size:.72rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.hero-content { align-self:flex-end; width:100%; }
h1,h2,h3,p { margin-top:0; }
h1,h2 { font-family:var(--display); font-weight:400; letter-spacing:-.07em; text-transform:uppercase; }
h1 { margin:0; font-size:clamp(5rem,15.4vw,15.5rem); line-height:.72; }
h1 span { display:block; }
h1 span:last-child { margin-left:14vw; color:transparent; -webkit-text-stroke:2px var(--paper); }
.hero-logo { position:absolute; top:50%; left:50%; display:block; width:min(33vw,32rem); height:auto; margin:0; opacity:0; filter:blur(10px) drop-shadow(0 4px 24px rgba(0,0,0,.28)); transform:translate(-50%,-50%) scale(.86); animation:hero-logo-in 1.25s .38s cubic-bezier(.16,1,.3,1) forwards; }
.hero-bottom { display:flex; justify-content:flex-end; align-items:end; gap:2rem; margin-top:2.2rem; }
.hero-bottom p { max-width:27rem; margin:0 0 .5rem 14vw; font-size:clamp(1rem,1.4vw,1.3rem); }
.circle-link { display:flex; align-items:center; justify-content:space-between; width:9rem; height:9rem; padding:1.1rem; border-radius:50%; background:var(--accent); font-size:.72rem; font-weight:700; line-height:1.2; text-transform:uppercase; transition:transform .3s; }
.circle-link b { font-size:1.5rem; }.circle-link:hover { transform:rotate(-8deg) scale(1.05); }
.hero-reveal { opacity:0; transform:translateY(3rem); animation:reveal 1s cubic-bezier(.16,1,.3,1) forwards; }
.hero-topline { animation-delay:.15s; }.hero-content .hero-reveal { animation-delay:.35s; }

.marquee { overflow:hidden; padding:1rem 0; background:var(--accent); color:var(--ink); }
.marquee-track { display:flex; width:max-content; will-change:transform; animation:marquee 32s linear infinite; }
.marquee-group { display:flex; flex:none; align-items:center; }
.marquee span { padding:0 2rem; font-family:var(--display); font-size:clamp(1.1rem,2vw,1.7rem); text-transform:uppercase; }.marquee i { position:relative; flex:0 0 1rem; width:1rem; height:1rem; }
.marquee i::before,.marquee i::after { content:""; position:absolute; top:50%; left:50%; width:1rem; height:2px; background:currentColor; transform:translate(-50%,-50%) rotate(45deg); }
.marquee i::after { transform:translate(-50%,-50%) rotate(-45deg); }
.section-dark,.section-light,.section-red { padding:clamp(5rem,10vw,10rem) var(--gutter); }
.section-dark { background:var(--ink); }.section-light { background:var(--paper); color:var(--ink); }.section-red { background:var(--accent); color:var(--ink); }
.kicker { display:flex; gap:1rem; margin-bottom:clamp(3rem,6vw,6rem); font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }.kicker span { opacity:.52; }
.section-header { position:relative; max-width:var(--max); margin:auto; }
.section-header h2,.offer-heading h2,.about h2,.faq h2,.contact h2 { margin:0; font-size:clamp(3.3rem,8.4vw,8.5rem); line-height:.83; }
h2 em { color:var(--accent); font-style:normal; }.section-red h2 em { color:var(--paper); }.contact h2 em { -webkit-text-stroke:2px var(--ink); color:transparent; }
.side-copy { position:absolute; right:0; bottom:.7rem; max-width:24rem; margin:0; color:var(--muted); font-size:1.05rem; }
.work .section-header h2 { max-width:76rem; font-size:clamp(3.2rem,6.2vw,6.5rem); line-height:.96; }
.work .section-header h2 em { display:inline-block; color:var(--paper); transform:translate3d(0,.18em,0) scale(.96); transform-origin:left center; will-change:color,transform,filter; }
.work.is-visible .section-header h2 em { animation:red-emphasis-pop .78s .34s cubic-bezier(.16,1,.3,1) forwards; }
.work-intro { position:static; max-width:40rem; margin:clamp(1.5rem,3vw,3rem) 0 0 auto; font-size:clamp(.95rem,1.4vw,1.15rem); font-style:italic; line-height:1.6; }
.work { overflow:hidden; }
.portfolio-carousel { max-width:var(--max); margin:clamp(4rem,8vw,8rem) auto 0; outline-offset:.5rem; perspective:1200px; touch-action:pan-y; overscroll-behavior-x:contain; user-select:none; }
.portfolio-track { display:flex; gap:1rem; overflow-x:auto; padding:1rem; scroll-snap-type:x mandatory; scrollbar-width:none; }
.portfolio-track::-webkit-scrollbar { display:none; }
.portfolio-item { flex:0 0 min(76vw,24rem); min-width:0; scroll-snap-align:center; }
.js .portfolio-track { position:relative; display:block; height:clamp(31rem,48vw,45rem); overflow:visible; padding:0; transform-style:preserve-3d; }
.js .portfolio-item { position:absolute; top:50%; left:50%; width:clamp(18rem,26vw,25rem); opacity:0; visibility:hidden; pointer-events:none; transform:translate3d(-50%,-50%,-320px) scale(.65); transition:transform .7s cubic-bezier(.16,1,.3,1),opacity .45s,visibility .7s; will-change:transform,opacity; }
.js .portfolio-item[data-position="active"] { z-index:3; opacity:1; visibility:visible; pointer-events:auto; transform:translate3d(-50%,-50%,0) rotateY(0) scale(1); }
.js .portfolio-item[data-position="previous"] { z-index:2; opacity:.58; visibility:visible; pointer-events:auto; cursor:pointer; transform:translate3d(-115%,-50%,-180px) rotateY(18deg) scale(.86); }
.js .portfolio-item[data-position="next"] { z-index:2; opacity:.58; visibility:visible; pointer-events:auto; cursor:pointer; transform:translate3d(15%,-50%,-180px) rotateY(-18deg) scale(.86); }
.portfolio-media { position:relative; display:grid; place-items:center; aspect-ratio:9 / 16; overflow:hidden; border:1px solid rgba(238,234,226,.18); background:linear-gradient(145deg,rgba(240,68,47,.16),transparent 42%),repeating-linear-gradient(135deg,transparent 0 18px,rgba(255,255,255,.025) 18px 19px),#111; box-shadow:0 2rem 5rem rgba(0,0,0,.42); isolation:isolate; transition:border-color .35s; }
.portfolio-media::before { content:""; position:absolute; inset:1rem; z-index:-1; border:1px solid rgba(238,234,226,.08); }
.portfolio-media::after { content:""; position:absolute; top:0; left:0; width:3.2rem; height:3px; background:var(--accent); }
.portfolio-poster { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.portfolio-media > span { position:absolute; top:1.5rem; left:1.5rem; z-index:1; color:transparent; font-family:var(--display); font-size:clamp(2.5rem,5vw,5rem); line-height:1; -webkit-text-stroke:1px rgba(238,234,226,.46); }
.portfolio-media i,.portfolio-play { position:relative; z-index:2; display:grid; place-items:center; width:3.4rem; height:3.4rem; padding:0; border:1px solid rgba(238,234,226,.55); border-radius:50%; background:rgba(9,9,9,.42); color:var(--paper); font-size:.8rem; font-style:normal; cursor:pointer; backdrop-filter:blur(8px); transition:background .25s,transform .25s; }
.portfolio-play span { width:0; height:0; border-top:.42rem solid transparent; border-bottom:.42rem solid transparent; border-left:.7rem solid var(--paper); font-size:0; filter:drop-shadow(0 2px 4px rgba(0,0,0,.45)); transform:translateX(.08rem); }
.portfolio-play::after { content:""; position:absolute; inset:-.45rem; border:1px solid rgba(238,234,226,.24); border-radius:50%; transition:border-color .25s,transform .25s; }
.js .portfolio-item:not([data-position="active"]) .portfolio-play { opacity:0; visibility:hidden; pointer-events:none; }
.portfolio-play:hover { background:var(--accent); transform:scale(1.08); }.portfolio-play:hover::after { border-color:rgba(240,68,47,.7); transform:scale(1.08); }
.portfolio-player { position:absolute; inset:0; z-index:4; width:100%; height:100%; border:0; background:#000; }
.portfolio-media.is-playing > span,.portfolio-media.is-playing > small,.portfolio-media.is-playing > .portfolio-play { visibility:hidden; }
.portfolio-media small { position:absolute; right:1.5rem; bottom:1.5rem; color:var(--muted); font-size:.62rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.portfolio-item[data-position="active"]:hover .portfolio-media { border-color:rgba(240,68,47,.7); }
.portfolio-controls { position:relative; z-index:10; display:none; grid-template-columns:3.5rem minmax(6rem,auto) 3.5rem; align-items:center; justify-content:center; gap:1rem; margin-top:2rem; pointer-events:auto; }
.js .portfolio-controls { display:grid; }
.portfolio-controls button { display:grid; place-items:center; width:3.5rem; height:3.5rem; padding:0; border:1px solid var(--line); border-radius:50%; background:transparent; cursor:pointer; transition:background .25s,color .25s,border-color .25s; }
.portfolio-controls button:hover { border-color:var(--paper); background:var(--paper); color:var(--ink); }
.portfolio-controls button span { font-size:1.25rem; line-height:1; }
.portfolio-counter { margin:0; color:var(--muted); font-size:.72rem; font-weight:700; letter-spacing:.12em; text-align:center; }
.portfolio-counter span { color:var(--paper); font-family:var(--display); font-size:1.25rem; }
.client-rail { --client-gap:clamp(2rem,3vw,3.5rem); position:relative; overflow:hidden; padding:.9rem 0 .75rem; border-top:1px solid rgba(238,234,226,.12); border-bottom:1px solid #c4bfb6; background:var(--paper); color:var(--ink); }
.client-rail-inner { width:100%; margin:auto; }
.client-rail-label { margin:0 0 .35rem; color:#625f59; font-size:.64rem; font-weight:700; letter-spacing:.14em; text-align:center; text-transform:uppercase; }
.client-marquee { width:100%; overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent); mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent); }
.client-marquee-track { display:flex; width:max-content; will-change:transform; animation:client-marquee 42s linear infinite; }
.client-marquee-group { display:flex; flex:none; align-items:center; gap:var(--client-gap); margin:0; padding:0; padding-right:var(--client-gap); list-style:none; }
.client-item { --logo-scale:1; --logo-y:0%; --logo-filter:none; --logo-hover-filter:var(--logo-filter); position:relative; flex:0 0 clamp(8rem,10vw,10rem); width:clamp(8rem,10vw,10rem); height:5.6rem; }
.client-logo { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:contain; opacity:.9; filter:var(--logo-filter); transform:translate3d(0,var(--logo-y),0) scale(var(--logo-scale)); transition:opacity .28s ease,filter .28s ease,transform .35s cubic-bezier(.16,1,.3,1); }
.client-item:hover .client-logo { opacity:1; filter:var(--logo-hover-filter); transform:translate3d(0,var(--logo-y),0) scale(calc(var(--logo-scale) * 1.08)); }
.client-item[data-client="pres"] { --logo-scale:1.14; --logo-y:1%; }
.client-item[data-client="beepower"] { --logo-scale:.94; --logo-y:1%; }
.client-item[data-client="billybarber"] { --logo-scale:1.6; --logo-y:0%; }
.client-item[data-client="blacklab"] { --logo-scale:2.05; --logo-filter:brightness(.2) contrast(2); --logo-hover-filter:brightness(.12) contrast(2.4); }
.client-item[data-client="bmw"] { --logo-scale:1.12; }
.client-item[data-client="cupra"] { --logo-scale:2.12; --logo-y:10%; }
.client-item[data-client="frelik"] { --logo-scale:2.2; }
.client-item[data-client="krystek"] { --logo-scale:.88; }
.client-item[data-client="ks-5gw"] { --logo-scale:1.06; --logo-y:1%; }
.client-item[data-client="motopark"] { --logo-scale:2.05; --logo-y:-2%; }
.client-item[data-client="perfect-car"] { --logo-scale:1.9; --logo-y:8%; }
.client-item[data-client="vipersky"] { --logo-scale:.96; }
.about { max-width:none; }.about-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:8vw; max-width:var(--max); margin:auto; }.about-copy { max-width:36rem; padding-top:1rem; }.about-copy .lead { font-size:clamp(1.45rem,2.4vw,2.2rem); line-height:1.2; }.about-copy p:not(.lead) { color:#514f4a; font-size:1.03rem; }
.process { display:grid; grid-template-columns:repeat(4,1fr); max-width:var(--max); margin:clamp(5rem,9vw,9rem) auto 0; border-top:1px solid #aaa69f; }.process div { min-height:13rem; padding:1.3rem 1rem 1rem 0; border-right:1px solid #aaa69f; }.process div:last-child { border-right:0; }.process span { font-size:.68rem; }.process strong { display:block; margin-top:3rem; font-family:var(--display); font-size:1.15rem; text-transform:uppercase; }.process p { max-width:12rem; color:#66625c; font-size:.83rem; }
.offer { overflow:hidden; }.offer-heading { display:flex; align-items:end; justify-content:space-between; gap:3rem; max-width:var(--max); margin:auto; }.offer-heading p { max-width:22rem; font-weight:700; }
.packages { display:grid; grid-template-columns:repeat(3,1fr); max-width:var(--max); margin:clamp(4rem,8vw,8rem) auto 0; border-top:2px solid var(--ink); border-bottom:2px solid var(--ink); }.packages article { position:relative; min-height:32rem; padding:1.5rem; border-right:1px solid rgba(9,9,9,.5); }.packages article:last-child { border:0; }.package-number { position:absolute; right:1.5rem; top:1.5rem; font-size:.68rem; }.package-label { margin-bottom:4rem; font-size:.72rem; font-weight:700; text-transform:uppercase; }.packages h3 { margin-bottom:.4rem; font-family:var(--display); font-size:clamp(2rem,4vw,4rem); text-transform:uppercase; }.price { min-height:3rem; font-weight:700; }.packages ul { display:grid; gap:.55rem; margin:2.5rem 0 4rem; padding:0; list-style:none; font-size:.9rem; }.packages li::before { content:"— "; }.packages a { position:absolute; right:1.5rem; bottom:1.5rem; left:1.5rem; display:flex; justify-content:space-between; padding-top:1rem; border-top:1px solid var(--ink); font-size:.75rem; font-weight:700; text-transform:uppercase; }
.faq-layout { display:grid; grid-template-columns:.75fr 1.25fr; gap:8vw; max-width:var(--max); margin:auto; }.faq h2 { font-size:clamp(3rem,6vw,6rem); }.faq-list { border-top:1px solid var(--line); }.faq details { border-bottom:1px solid var(--line); }.faq summary { display:grid; grid-template-columns:3rem 1fr 2rem; align-items:center; min-height:6rem; cursor:pointer; list-style:none; font-size:clamp(1rem,1.6vw,1.35rem); }.faq summary::-webkit-details-marker { display:none; }.faq summary span { color:var(--muted); font-size:.65rem; }.faq summary i { position:relative; width:1rem; height:1rem; }.faq summary i::before,.faq summary i::after { content:""; position:absolute; top:50%; width:100%; height:1px; background:var(--paper); transition:transform .25s; }.faq summary i::after { transform:rotate(90deg); }.faq details[open] summary i::after { transform:rotate(0); }.faq details p { max-width:39rem; margin:-.5rem 2rem 2rem 3rem; color:var(--muted); }
.contact h2 { max-width:var(--max); margin:0 auto clamp(4rem,8vw,8rem); }.contact-row { display:grid; grid-template-columns:1fr auto; align-items:end; gap:2rem; max-width:var(--max); margin:auto; }.contact-row p { max-width:24rem; margin:0; color:#615f59; }.contact-link { display:flex; gap:3rem; padding-bottom:.5rem; border-bottom:2px solid var(--ink); font-size:clamp(1rem,2vw,1.5rem); font-weight:700; }
.contact-form { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; max-width:var(--max); margin:clamp(3rem,6vw,6rem) auto 0; }
.form-field { display:grid; gap:.55rem; }.form-field-wide { grid-column:1 / -1; }.form-field label { font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }.form-field input,.form-field textarea { width:100%; border:1px solid rgba(9,9,9,.32); border-radius:0; background:transparent; color:var(--ink); font:inherit; font-size:1rem; }.form-field input { min-height:3.5rem; padding:0 1rem; }.form-field textarea { min-height:10rem; padding:1rem; resize:vertical; }.form-field input:focus,.form-field textarea:focus { outline:3px solid var(--accent); outline-offset:2px; }.trap { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.contact-submit { justify-self:start; display:flex; gap:3rem; align-items:center; padding:1rem 1.25rem; border:2px solid var(--ink); background:var(--ink); color:var(--paper); font-weight:700; text-transform:uppercase; cursor:pointer; transition:background .25s,color .25s; }.contact-submit:hover { background:transparent; color:var(--ink); }.contact-submit[disabled] { opacity:.6; cursor:wait; }.contact-status { align-self:center; margin:0; color:#615f59; font-weight:700; }
.site-footer { display:grid; grid-template-columns:1fr 1fr auto; align-items:end; gap:2rem; padding:4rem var(--gutter) 2rem; background:var(--paper); color:var(--ink); border-top:1px solid #aaa69f; }.footer-brand { width:clamp(8rem,14vw,13rem); filter:brightness(0); }.site-footer div { display:flex; gap:2rem; font-size:.7rem; font-weight:700; text-transform:uppercase; }.site-footer p { margin:0; font-size:.7rem; }
#background-music { display:none; }
.motion-ready .motion-section > * { opacity:0; transform:translateY(3rem); transition:opacity .8s,transform 1s cubic-bezier(.16,1,.3,1); }.motion-ready .motion-section.is-visible > * { opacity:1; transform:none; }
@keyframes reveal { to { opacity:1; transform:none; } } @keyframes hero-media { to { transform:scale(1); } } @keyframes hero-logo-in { to { opacity:1; filter:blur(0) drop-shadow(0 4px 24px rgba(0,0,0,.28)); transform:translate(-50%,-50%) scale(1); } } @keyframes marquee { to { transform:translate3d(-50%,0,0); } } @keyframes client-marquee { to { transform:translate3d(-50%,0,0); } } @keyframes red-emphasis-pop { 0% { color:var(--paper); transform:translate3d(0,.18em,0) scale(.96); filter:none; } 55% { color:var(--accent); transform:translate3d(.08em,-.08em,0) scale(1.06); filter:drop-shadow(.08em .08em 0 rgba(9,9,9,.18)); } 100% { color:var(--accent); transform:translate3d(0,0,0) scale(1); filter:none; } }

@media (max-width:820px) {
  body.menu-open .site-header { color:var(--ink); } body.menu-open .brand img { filter:brightness(0); }
  .site-header { height:4.5rem; padding-inline:max(1rem,env(safe-area-inset-left)) max(1rem,env(safe-area-inset-right)); }.site-header>.brand { width:5.25rem; }.menu-toggle { position:relative; z-index:2; display:flex; align-items:center; justify-content:flex-end; gap:.6rem; min-width:4rem; min-height:44px; padding:.65rem 0; text-transform:uppercase; font-size:.7rem; font-weight:700; }.menu-toggle i,.menu-toggle i::after { display:block; width:1.4rem; height:1px; background:currentColor; transition:transform .25s; }.menu-toggle i::after { content:""; transform:translateY(.4rem); }.menu-toggle[aria-expanded="true"] i { transform:rotate(45deg); }.menu-toggle[aria-expanded="true"] i::after { transform:rotate(-90deg); }
  .nav-links { position:fixed; inset:0; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:1.2rem; padding:6rem var(--gutter); background:var(--accent); color:var(--ink); visibility:hidden; opacity:0; transform:translateY(-1rem); transition:.25s; }.nav-links.is-open { visibility:visible; opacity:1; transform:none; }.nav-links a { font-family:var(--display); font-size:clamp(2rem,11vw,4rem); line-height:1; }.nav-links a::after { display:none; }.nav-links .nav-cta { margin-top:1rem; border-color:var(--ink); font-family:var(--body); font-size:.8rem; }
  .hero { min-height:100svh; padding:5.5rem 1rem max(1rem,env(safe-area-inset-bottom)); }.hero-media { background-image:url("./assets/mobilne-pierwsze-zdjecie.webp"); background-position:center; transform:none; animation:none; }.hero-topline { top:5.8rem; }.hero-topline span:last-child { display:none; }.hero-logo { width:min(44vw,20rem); filter:none; will-change:opacity,transform; animation:hero-logo-mobile-in .7s .15s cubic-bezier(.16,1,.3,1) forwards; }h1 { font-size:clamp(4.5rem,21vw,10rem); line-height:.77; }h1 span:last-child { margin-left:0; -webkit-text-stroke:1px var(--paper); }.hero-bottom p { margin-left:0; }.circle-link { width:6.5rem;height:6.5rem; }.side-copy { position:static; margin-top:2rem; }.project-list { grid-template-columns:minmax(0,1fr); }.project-wide { grid-column:auto; }.project-square { width:100%; margin:0; }.project-wide .project-media { aspect-ratio:4/3; }.project-info { grid-template-columns:minmax(0,1fr) auto; }.project-info strong { grid-row:1; }.project-info span { grid-row:2; }.project-info small { grid-row:2; }
  .js .portfolio-track { height:min(128vw,34rem); }.js .portfolio-item { width:min(72vw,19rem); }.js .portfolio-item[data-position="previous"] { transform:translate3d(-105%,-50%,-130px) rotateY(14deg) scale(.82); }.js .portfolio-item[data-position="next"] { transform:translate3d(5%,-50%,-130px) rotateY(-14deg) scale(.82); }.portfolio-media span { top:1rem; left:1rem; }.portfolio-media small { right:1rem; bottom:1rem; }.portfolio-controls { margin-top:1.25rem; }.portfolio-play { display:none; }.portfolio-media.is-autoplay-blocked .portfolio-play { display:grid; }.portfolio-player.is-mobile-preview { pointer-events:none; }
  .client-rail { --client-gap:1.4rem; padding:.75rem 0 .55rem; }.client-rail-label { margin-bottom:.2rem; font-size:.59rem; }.client-marquee { -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent); mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent); }.client-item { flex-basis:7rem; width:7rem; height:4.7rem; }
  .marquee i { flex-basis:1.25rem; width:1.25rem; height:1.25rem; background:linear-gradient(90deg,transparent calc(50% - 1px),var(--ink) calc(50% - 1px) calc(50% + 1px),transparent calc(50% + 1px)); }
  .about-grid,.faq-layout { grid-template-columns:minmax(0,1fr); }.about-grid { gap:2.5rem; }.process { grid-template-columns:1fr 1fr; }.process div:nth-child(2) { border-right:0; }.process div { min-height:11rem; border-bottom:1px solid #aaa69f; }.offer-heading { display:block; }.offer-heading p { margin-top:2rem; }.packages { grid-template-columns:1fr; }.packages article { min-height:27rem; border-right:0;border-bottom:1px solid var(--ink); }.packages article:last-child { border:0; }.faq-layout { gap:3rem; }.contact-row,.contact-form { grid-template-columns:minmax(0,1fr); }.contact-link { width:100%; justify-content:space-between; overflow-wrap:anywhere; }.site-footer { grid-template-columns:1fr auto; }.site-footer div { display:none; }
}
@media (max-width:520px) { .section-dark,.section-light,.section-red { padding-block:4.5rem; }.section-header h2,.offer-heading h2,.about h2,.faq h2,.contact h2 { font-size:clamp(2.65rem,13vw,4rem); overflow-wrap:anywhere; }.work .section-header h2 { font-size:clamp(2.35rem,10.5vw,3.4rem); overflow-wrap:normal; }.project-media { min-height:0; }.project-info { gap:.5rem; }.process { grid-template-columns:1fr; }.process div,.process div:nth-child(2) { min-height:9rem;border-right:0; }.process strong { margin-top:1.5rem; }.faq summary { grid-template-columns:2rem minmax(0,1fr) 1rem; gap:.35rem; }.faq details p { margin-left:2rem; }.contact-link { gap:.5rem; font-size:.9rem; }.site-footer { grid-template-columns:1fr; padding-bottom:max(2rem,env(safe-area-inset-bottom)); }.site-footer p { margin-top:1rem; } }
@media (hover:none) { .circle-link:hover,.project:hover .project-media { transform:none; } }
@keyframes hero-logo-mobile-in { to { opacity:1; transform:translate(-50%,-50%) scale(1); } }