:root {
  --sky: #ffffff;
  --wine: #0a0a0a;
  --red: #ec212c;
  --cream: #f4f4f2;
  --pad: clamp(18px, 3.3vw, 52px);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--sky); color: var(--wine); font-family: "DM Sans", Arial, sans-serif; overflow-x: hidden; }
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button { color: inherit; font: inherit; }

.header { position: absolute; z-index: 60; top: 0; left: 0; width: 100%; padding: 18px var(--pad); display: grid; grid-template-columns: 1fr auto 1fr; align-items: start; pointer-events: none; mix-blend-mode: normal; }
.logo, .menu-button { pointer-events: auto; }
.logo { width: 142px; height: 66px; display: grid; place-items: center; overflow: hidden; background: transparent; transition: transform .35s ease, opacity .25s ease; }
.logo:hover { transform: rotate(-2deg); }
.logo img { width: 142px; height: auto; object-fit: contain; }
.monday-note { margin: 6px 0 0; font-size: 11px; line-height: 1.45; text-align: center; text-transform: uppercase; letter-spacing: .09em; transition: color .4s ease; }
.note-dot { display: inline-block; width: 6px; height: 6px; margin: 0 6px 1px 0; border-radius: 50%; background: var(--red); animation: pulse 2s ease infinite; }

.menu-button { position: fixed; z-index: 61; top: 18px; right: var(--pad); justify-self: end; width: 122px; height: 54px; padding: 0 17px; border: 1px solid var(--wine); border-radius: 50%; background: var(--sky); display: flex; align-items: center; justify-content: space-between; cursor: pointer; text-transform: uppercase; font-size: 10px; letter-spacing: .12em; transition: color .45s ease, background .45s ease, border-color .45s ease, transform .25s ease; }
.menu-button:hover { color: var(--sky); background: var(--red); border-color: var(--red); transform: scale(.96); }
.menu-word { position: relative; width: 57px; height: 15px; overflow: hidden; }
.menu-word i { position: absolute; inset: 0; font-style: normal; transition: transform .55s cubic-bezier(.77,0,.18,1); }
.menu-word i:last-child { transform: translateY(150%); }
.hamburger { position: relative; width: 20px; height: 12px; }
.hamburger i { position: absolute; left: 0; width: 100%; height: 1px; background: currentColor; transition: top .5s cubic-bezier(.77,0,.18,1), transform .5s cubic-bezier(.77,0,.18,1); }
.hamburger i:first-child { top: 3px; }
.hamburger i:last-child { top: 9px; }
body.menu-open .menu-button { color: var(--wine); background: var(--sky); border-color: var(--sky); }
body.menu-open .logo { position: fixed; z-index: 62; top: 18px; left: var(--pad); opacity: 1; pointer-events: auto; }
body.menu-open .menu-word i:first-child { transform: translateY(-150%); }
body.menu-open .menu-word i:last-child { transform: translateY(0); }
body.menu-open .hamburger i:first-child { top: 6px; transform: rotate(45deg); }
body.menu-open .hamburger i:last-child { top: 6px; transform: rotate(-45deg); }
body.menu-open .monday-note { color: var(--sky); }

.hero { position: relative; min-height: 100svh; padding: 110px var(--pad) 26px; display: flex; flex-direction: column; overflow: hidden; }
.hero-art { width: min(66vw, 820px); height: 58vh; min-height: 390px; margin: 0 auto; display: flex; align-items: center; justify-content: center; }
.hero-lottie { width: 100%; height: 100%; }
.hero-lottie svg { width: 100% !important; height: 100% !important; overflow: visible; }

.hero-copy { position: relative; z-index: 2; min-height: clamp(80px, 8vw, 116px); margin-top: -36px; padding: 8px 0; isolation: isolate; }
.hero-copy > p { position: relative; z-index: 1; margin: 0 0 8px; font-size: clamp(9px, .72vw, 11px); line-height: 1.25; text-align: center; text-transform: uppercase; letter-spacing: .1em; }
.solution-title { position: relative; z-index: 1; margin: 0; color: var(--red); font-family: "DM Sans", -apple-system, BlinkMacSystemFont, Arial, sans-serif; font-size: clamp(24px, 2.7vw, 42px); font-weight: 500; line-height: 1; text-align: center; text-transform: uppercase; letter-spacing: .02em; cursor: zoom-in; user-select: none; -webkit-user-select: none; touch-action: none; }
.text-lens { position: absolute; z-index: 5; left: 0; top: 0; width: 90px; height: 90px; visibility: hidden; opacity: 0; pointer-events: none; border: 1px solid rgba(255,255,255,.85); border-radius: var(--drop-radius, 50%); background: rgba(255,255,255,.13); box-shadow: inset 2px 2px 4px rgba(255,255,255,.95), inset -3px -3px 7px rgba(10,10,10,.1), 0 8px 24px rgba(10,10,10,.18), 0 0 0 1px rgba(10,10,10,.06); -webkit-backdrop-filter: blur(6px) saturate(155%); backdrop-filter: blur(6px) saturate(155%); isolation: isolate; will-change: transform, border-radius; transition: opacity .12s ease, visibility 0s .12s; }
.text-lens.is-active { visibility: visible; opacity: 1; transition: opacity .1s ease; }
.text-lens::before { content: ""; position: absolute; z-index: 3; inset: 3px 9px auto; height: 34%; border-radius: 50%; background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(255,255,255,0)); filter: blur(1px); opacity: .8; }
.text-lens::after { content: ""; position: absolute; z-index: 3; inset: -1px; border-radius: inherit; border: 1px solid rgba(140,190,255,.35); box-shadow: inset -2px 0 3px rgba(255,75,75,.18), inset 2px 0 3px rgba(90,170,255,.22); }
.lens-clip { position: absolute; z-index: 2; inset: 0; overflow: hidden; border-radius: inherit; }
.lens-text { position: absolute; display: block; visibility: hidden; margin: 0; color: var(--red); font-family: "DM Sans", -apple-system, BlinkMacSystemFont, Arial, sans-serif; font-size: clamp(24px, 2.7vw, 42px); font-weight: 500; line-height: 1; text-align: center; text-transform: uppercase; letter-spacing: .02em; white-space: nowrap; transform-origin: 0 0; }
.liquidglass-ready .text-lens { border-color: transparent; background: transparent; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
.liquidglass-ready .text-lens::before, .liquidglass-ready .text-lens::after { opacity: .55; }
.liquidglass-fallback .text-lens { border: 1px solid rgba(255,255,255,.75); background: rgba(255,255,255,.18); box-shadow: inset 0 1px 2px rgba(255,255,255,.9), 0 8px 22px rgba(10,10,10,.22); -webkit-backdrop-filter: blur(3px) saturate(150%); backdrop-filter: blur(3px) saturate(150%); }
.liquidglass-fallback .lens-text { visibility: visible; }
.hero-index { display: flex; justify-content: space-between; padding-top: 18px; border-top: 1px solid rgba(109,34,57,.45); font-size: 9px; letter-spacing: .14em; }
.scroll-down { position: absolute; z-index: 3; right: var(--pad); bottom: 64px; display: flex; align-items: center; gap: 13px; font-size: 10px; text-transform: uppercase; letter-spacing: .12em; }
.scroll-down i { width: 37px; height: 37px; display: grid; place-items: center; border: 1px solid var(--wine); border-radius: 50%; font-style: normal; transition: background .25s, color .25s, transform .25s; }
.scroll-down:hover i { background: var(--red); color: var(--sky); border-color: var(--red); transform: translateY(4px); }

.work { background: var(--cream); padding: 54px var(--pad) 150px; }
.work-heading { display: flex; justify-content: space-between; padding: 0 0 24px; margin-bottom: 90px; border-bottom: 1px solid var(--wine); font-size: 9px; text-transform: uppercase; letter-spacing: .13em; }
.work-heading p { margin: 0; }.work-heading span { opacity: .55; }

.project-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 120px clamp(24px, 5vw, 80px); }
.project { opacity: 0; transform: translateY(70px); transition: opacity .75s ease, transform .9s cubic-bezier(.16,.75,.2,1); }
.project.is-visible { opacity: 1; transform: translateY(0); }
.project--wide { grid-column: 1 / -1; width: 79%; }
.project--start { justify-self: start; }
.project--end { justify-self: end; }
.project--lower { margin-top: 16vh; }
.project-visual { position: relative; aspect-ratio: 1.16; overflow: hidden; background: #e7e7e4; transition: background .35s ease, transform .7s cubic-bezier(.2,.7,.2,1); }
.project--wide .project-visual { aspect-ratio: 1.72; }
.project-visual img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform 1s cubic-bezier(.16,.75,.2,1), filter .5s ease; }
.visual-mobile,.visual-cloud,.visual-brand,.visual-motion,.visual-editorial{display:flex;align-items:center;justify-content:center;overflow:hidden}.visual-mobile{background:#e8ff47;color:#111;gap:5vw;font-size:clamp(20px,3vw,48px)}.visual-mobile i{position:absolute;width:18%;aspect-ratio:.5;border:2px solid;border-radius:24px;animation:homePhone 4s ease-in-out infinite}.visual-mobile b,.visual-cloud b,.visual-brand b,.visual-motion b,.visual-editorial b{position:absolute;right:18px;top:18px;font:12px "DM Sans"}.visual-cloud{background:#161d2c;color:#a9c4ff}.visual-cloud i{position:absolute;border:1px solid;border-radius:50%;width:30%;aspect-ratio:1;animation:homeCloud 6s linear infinite}.visual-cloud i:nth-child(2){width:48%;animation-direction:reverse}.visual-cloud i:nth-child(3){width:68%}.visual-cloud span{font-size:11px;letter-spacing:.15em}.visual-brand{background:#ff6b73;color:#321313;justify-content:space-around}.visual-brand span{font:italic clamp(90px,15vw,230px) Georgia}.visual-brand em{font-size:clamp(20px,5vw,78px);letter-spacing:.12em}.visual-motion{background:#6847ff;color:#fff}.visual-motion i{width:34%;aspect-ratio:1;background:#ffdb4d;clip-path:polygon(50% 0,100% 100%,0 100%);animation:homeMotion 3s ease-in-out infinite}.visual-motion span{position:absolute;font-size:clamp(35px,7vw,105px);mix-blend-mode:difference}.visual-editorial{background:#f2eadc;color:#151515;justify-content:flex-start;padding:7%}.visual-editorial span{font:clamp(42px,8vw,120px)/.75 Georgia;letter-spacing:-.07em}@keyframes homePhone{50%{transform:rotate(90deg) scale(.8)}}@keyframes homeCloud{to{transform:rotate(360deg)}}@keyframes homeMotion{50%{border-radius:50%;clip-path:polygon(50% 0,100% 100%,0 100%);transform:rotate(120deg)}}
.visual-mobile--media video,.visual-cloud--media img{width:100%;height:100%;display:block;object-fit:cover}.visual-mobile--media,.visual-cloud--media{padding:0}.visual-mobile--media b,.visual-cloud--media b{z-index:2;color:#fff;text-shadow:0 1px 8px #000}.visual-cloud--media span{position:absolute;z-index:2;left:20px;bottom:18px;color:#fff;background:#111b;padding:7px 9px}.visual-cloud--media:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#07101a66,transparent 55%);pointer-events:none}
.visual-brand--media{background:#ffdc4d}.visual-brand--media img{width:58%;height:78%;object-fit:contain;mix-blend-mode:multiply;transform:scale(1.2)}.visual-brand--media span{position:absolute;left:4%;bottom:5%;font:clamp(30px,7vw,100px)/.8 Georgia;color:#321313;mix-blend-mode:multiply}.visual-brand--media b{z-index:3}.visual-editorial--media{padding:0}.visual-editorial--media img{width:100%;height:100%;object-fit:cover}.visual-editorial--media:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#f2eadcdd,transparent 75%)}.visual-editorial--media span{position:absolute;z-index:2;left:6%;bottom:8%;font-size:clamp(30px,6vw,90px)}.visual-editorial--media b{z-index:3}.visual-motion--cinema{background:#0d0d13;isolation:isolate}.visual-motion--cinema>.card-scene{position:absolute;inset:0;opacity:0;animation:cardCinema 24s infinite}.visual-motion--cinema>.card-scene--1{animation-delay:0s;background:#ffdf3d;color:#111}.visual-motion--cinema>.card-scene--2{animation-delay:6s;background:#111;color:#fff}.visual-motion--cinema>.card-scene--3{animation-delay:12s;background:#ff6b74;color:#301010}.visual-motion--cinema>.card-scene--4{animation-delay:18s;background:#d9ff43;color:#111}.card-scene span{position:absolute;z-index:2;left:50%;top:50%;transform:translate(-50%,-50%);font-size:clamp(20px,4vw,58px);font-weight:700;letter-spacing:-.06em;mix-blend-mode:normal}.card-scene i{position:absolute!important;display:block;width:52%!important;aspect-ratio:1;left:24%;top:24%;background:transparent!important;border:2px solid;clip-path:none!important;animation:cardShape 6s ease-in-out infinite!important}.card-scene--2 i{inset:-30%!important;width:auto!important;aspect-ratio:auto;background:repeating-linear-gradient(90deg,transparent 0 22px,#6847ff 22px 45px)!important;border:0;transform:rotate(35deg)}.card-scene--3 i{width:8%!important;height:140%;left:46%!important;top:-20%!important;background:#fff!important;border:0}.card-scene--4 i{background:#6847ff!important;border:0;clip-path:polygon(50% 0,100% 100%,0 100%)!important}.visual-motion--cinema>em{position:absolute;z-index:5;right:18px;bottom:14px;font:9px monospace;color:#fff;mix-blend-mode:difference}.visual-motion--cinema>b{z-index:6;color:#fff;mix-blend-mode:difference}@keyframes cardCinema{0%{opacity:0;clip-path:inset(50%)}5%,20%{opacity:1;clip-path:inset(0)}25%,100%{opacity:0;clip-path:inset(0 100% 0 0)}}@keyframes cardShape{50%{border-radius:50%;transform:rotate(160deg) scale(.6)}}
.project-visual model-viewer { width: 100%; height: 100%; display: block; background: #d9d9d6; --progress-bar-color: var(--red); --progress-bar-height: 2px; }
.project:nth-child(2) .project-visual img { object-position: 35% 50%; }
.project:nth-child(4) .project-visual img { object-position: 50% 48%; }
.project:nth-child(5) .project-visual img { object-position: 50% 30%; }
.slot-number { position: absolute; z-index: 1; top: 18px; left: 20px; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; color: var(--sky); background: rgba(10,10,10,.78); backdrop-filter: blur(8px); font-size: 8px; letter-spacing: .08em; }
.project-meta { position: relative; display: grid; grid-template-columns: 1.15fr 1fr 34px; gap: 25px; align-items: start; padding-top: 15px; border-top: 1px solid var(--wine); }
.project-meta small { display: block; margin-bottom: 8px; font-size: 8px; text-transform: uppercase; letter-spacing: .12em; opacity: .55; }
.project-meta h3 { margin: 0; font: 500 clamp(25px, 2.5vw, 40px)/1 "Playfair Display", serif; letter-spacing: -.035em; }
.project-meta p { margin: 2px 0 0; max-width: 350px; font-size: 12px; line-height: 1.5; }
.project-meta i { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 50%; font-style: normal; opacity: 0; transform: translate(-10px, 10px); transition: .3s ease; }
.project:hover .project-visual { background: #deded9; transform: scale(.992); }
.project:hover .project-visual img { transform: scale(1.035); }
.project:hover .project-meta i { opacity: 1; transform: translate(0); }

.statement { min-height: 100svh; padding: 120px var(--pad) 60px; background: var(--sky); display: flex; flex-direction: column; justify-content: space-between; }
.statement > p { margin: 0; font-size: 10px; text-transform: uppercase; letter-spacing: .13em; }
.statement h2 { margin: 70px 0; font: 500 clamp(58px, 9.4vw, 150px)/.84 "Playfair Display", serif; letter-spacing: -.06em; }
.statement h2 em { display: inline-block; margin-left: 16vw; color: var(--red); }
.services-list { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--wine); }
.services-list span { padding: 18px 10px; border-right: 1px solid var(--wine); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }.services-list span:last-child { border-right: 0; }

.footer { min-height: 86vh; padding: 100px var(--pad) 28px; background: var(--wine); color: var(--sky); display: flex; flex-direction: column; }
.footer > p { margin: 0; font-size: 11px; text-transform: uppercase; letter-spacing: .13em; }
.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; }
.contact-stage { position: relative; height: clamp(520px, 67vh, 720px); margin: 30px 0; overflow: hidden; border-radius: 4px; background: #101010; isolation: isolate; }
.contact-toggle { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.contact-trigger { position: absolute; z-index: 4; inset: 0; width: 100%; padding: 0; overflow: hidden; border: 0; color: var(--sky); background: transparent; cursor: pointer; }
.contact-door { position: absolute; top: 0; width: 50.05%; height: 100%; overflow: hidden; background: var(--wine); transition: transform 1.05s cubic-bezier(.76,0,.18,1); will-change: transform; }
.contact-door--left { left: 0; }
.contact-door--right { right: 0; }
.contact-door-copy { position: absolute; top: 50%; width: 200%; font: 500 clamp(61px, 10vw, 155px)/.87 "Playfair Display", serif; letter-spacing: -.06em; text-align: left; transform: translateY(-50%); }
.contact-door--left .contact-door-copy { left: 0; padding-left: 0; }
.contact-door--right .contact-door-copy { right: 0; }
.contact-door-copy em { color: var(--red); font-weight: 500; }
.contact-stage.is-open .contact-door--left, .contact-toggle:checked ~ .contact-trigger .contact-door--left { transform: translateX(-102%); }
.contact-stage.is-open .contact-door--right, .contact-toggle:checked ~ .contact-trigger .contact-door--right { transform: translateX(102%); }
.contact-stage.is-open .contact-trigger, .contact-toggle:checked ~ .contact-trigger { pointer-events: none; }
.contact-form-panel { position: absolute; z-index: 1; inset: 0; padding: clamp(14px, 2.2vw, 32px); overflow: hidden; background: #050505; }
.contact-form-panel::after { content: ""; position: absolute; z-index: 5; left: 50%; top: 50%; width: min(48vw, 560px); aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(236,33,44,.32), rgba(236,33,44,.1) 34%, transparent 70%); filter: blur(18px); opacity: 0; transform: translate(-50%,-50%) scale(.15); pointer-events: none; will-change: transform, opacity; }
.contact-orb { position: absolute; z-index: 0; left: 0; top: 0; border-radius: 45% 55% 62% 38% / 54% 38% 62% 46%; filter: blur(1px); opacity: .72; pointer-events: none; will-change: transform, border-radius; transition: border-radius 2.4s ease; }
.contact-orb--two { width: 390px; height: 390px; background: linear-gradient(145deg, rgba(236,33,44,.75), rgba(255,255,255,.22)); box-shadow: 0 0 110px rgba(236,33,44,.25); animation: contactOrbBounce 16s linear infinite; }
.contact-glass { position: relative; z-index: 2; height: 100%; padding: clamp(22px, 3vw, 44px); overflow: auto; border: 1px solid rgba(255,255,255,.38); border-radius: 34px; background: linear-gradient(135deg, rgba(255,255,255,.11), rgba(255,255,255,.025) 45%, rgba(255,255,255,.065)); box-shadow: inset 1px 1px 1px rgba(255,255,255,.62), inset -1px -1px 1px rgba(255,255,255,.08), 0 30px 90px rgba(0,0,0,.28); font-family: "DM Sans", Arial, sans-serif; font-weight: 400; -webkit-backdrop-filter: blur(22px) saturate(175%); backdrop-filter: blur(22px) saturate(175%); isolation: isolate; }
.contact-glass::before { content: ""; position: absolute; z-index: 1; inset: 1px; border-radius: 33px; background: linear-gradient(115deg, rgba(255,255,255,.2), transparent 24%, transparent 72%, rgba(255,255,255,.07)); opacity: .58; pointer-events: none; }
.contact-form-heading, .contact-form { position: relative; z-index: 2; }
.contact-form-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; }
.contact-form-heading small { font-size: 9px; letter-spacing: .13em; opacity: .7; }
.contact-form-heading h2 { margin: 10px 0 24px; font: 400 clamp(36px, 4.5vw, 68px)/.92 "DM Sans", Arial, sans-serif; letter-spacing: -.04em; text-transform: uppercase; }
.contact-close { flex: 0 0 auto; width: 46px; height: 46px; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; color: #fff; background: rgba(255,255,255,.09); font-size: 27px; line-height: 1; cursor: pointer; transition: background .25s, transform .25s; }
.contact-close:hover { background: var(--red); transform: rotate(90deg); }
.contact-form { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 24px; }
.contact-form label { display: grid; gap: 7px; }
.contact-form label > span { padding-left: 2px; font-size: 9px; text-transform: uppercase; letter-spacing: .11em; opacity: .68; }
.contact-form input, .contact-form textarea { width: 100%; min-width: 0; padding: 13px 15px; border: 1px solid rgba(255,255,255,.28); border-radius: 15px; outline: 0; color: #fff; background: rgba(255,255,255,.055); box-shadow: inset 1px 1px 0 rgba(255,255,255,.12); font: 400 14px "DM Sans", Arial, sans-serif; -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); transition: border-color .25s, background .25s, box-shadow .25s; }
.contact-form input::placeholder, .contact-form textarea::placeholder { color: rgba(255,255,255,.48); }
.contact-form textarea { resize: vertical; }
.contact-form input:focus, .contact-form textarea:focus { border-color: rgba(255,255,255,.75); background: rgba(255,255,255,.095); box-shadow: 0 0 0 4px rgba(255,255,255,.08), inset 1px 1px 0 rgba(255,255,255,.22); }
.contact-phone, .contact-message { grid-column: 1 / -1; }
.contact-form-action { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.contact-form-action p { max-width: 280px; margin: 0; font-size: 9px; line-height: 1.4; opacity: .55; }
.contact-form-action button { min-height: 48px; padding: 0 22px; border: 0; border-radius: 999px; color: #fff; background: var(--red); font: 400 11px "DM Sans", Arial, sans-serif; letter-spacing: .09em; cursor: pointer; transition: transform .25s, box-shadow .25s; }
.contact-form-action button:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(236,33,44,.32); }
.contact-form-action i { margin-left: 14px; font-style: normal; }
.contact-form-heading, .contact-form { transition: none; }
.contact-transition-drop { position: absolute; z-index: 7; left: 50%; top: 50%; width: 92px; height: 92px; border: 1px solid rgba(255,255,255,.6); border-radius: 48% 52% 57% 43% / 56% 44% 52% 48%; background: radial-gradient(circle at 32% 25%, rgba(255,255,255,.92), rgba(236,33,44,.88) 34%, rgba(236,33,44,.38) 68%, rgba(236,33,44,.08)); box-shadow: inset 8px 8px 18px rgba(255,255,255,.28), inset -9px -10px 22px rgba(70,0,8,.28), 0 0 55px rgba(236,33,44,.55); opacity: 0; visibility: hidden; transform: translate(-50%,-50%) scale(0); pointer-events: none; }
.contact-transition-drop::before, .contact-transition-drop::after { content: ""; position: absolute; inset: -1px; border: 1px solid rgba(255,255,255,.34); border-radius: 50%; opacity: 0; }
.contact-thanks { position: absolute; z-index: 6; left: 50%; top: 50%; width: min(520px, calc(100% - 42px)); min-height: 245px; padding: 34px; display: flex; flex-direction: column; justify-content: center; overflow: hidden; border: 1px solid rgba(255,255,255,.42); border-radius: 30px; color: #fff; background: linear-gradient(135deg, rgba(255,255,255,.18), rgba(255,255,255,.045)); box-shadow: inset 1px 1px 1px rgba(255,255,255,.65), inset -1px -1px 1px rgba(255,255,255,.08), 0 30px 90px rgba(0,0,0,.45); -webkit-backdrop-filter: blur(28px) saturate(180%); backdrop-filter: blur(28px) saturate(180%); opacity: 0; visibility: hidden; transform: translate(-50%,-50%) scale(.04); transform-origin: center; pointer-events: none; }
.contact-thanks::before { content: ""; position: absolute; inset: 1px; border-radius: inherit; background: linear-gradient(110deg, transparent 18%, rgba(255,255,255,.06) 35%, rgba(255,255,255,.42) 48%, rgba(255,255,255,.08) 58%, transparent 76%); background-size: 260% 100%; background-position: 130% 0; opacity: .72; pointer-events: none; }
.contact-thanks::after { content: ""; position: absolute; z-index: 3; left: 34px; right: 34px; bottom: 18px; height: 2px; border-radius: 999px; background: linear-gradient(90deg, rgba(255,255,255,.92), var(--red)); box-shadow: 0 0 14px rgba(236,33,44,.5); transform: scaleX(0); transform-origin: left center; opacity: 0; pointer-events: none; }
.contact-thanks > * { position: relative; z-index: 1; opacity: 0; transform: translateY(12px); }
.contact-thanks small { font-size: 9px; letter-spacing: .13em; opacity: .68; }
.contact-thanks h2 { margin: 20px 0 10px; font: 400 clamp(39px, 5vw, 66px)/.9 "DM Sans", Arial, sans-serif; letter-spacing: -.045em; }
.contact-thanks p { max-width: 390px; margin: 0; font-size: 14px; line-height: 1.5; }
.contact-thanks span { margin-top: 27px; font-size: 8px; letter-spacing: .13em; opacity: .48; }
.contact-stage.is-submitting .contact-form { pointer-events: none; }
.contact-stage.is-submitting .contact-orb { animation-play-state: paused !important; }
.contact-stage.is-submitting .contact-form-panel::after { animation: contactPortalAura 2.75s .38s cubic-bezier(.2,.75,.2,1) forwards; }
.contact-stage.is-submitting .contact-form-heading, .contact-stage.is-submitting .contact-form { animation: contactContentVanish .48s ease forwards; }
.contact-stage.is-submitting .contact-glass { overflow: hidden; transform-origin: center; will-change: transform, opacity, border-radius; backface-visibility: hidden; -webkit-backface-visibility: hidden; animation: contactFormPortal 1.55s cubic-bezier(.62,0,.2,1) forwards; pointer-events: none; }
.contact-stage.is-submitting .contact-transition-drop { visibility: visible; animation: contactDropPulse 1.3s .92s cubic-bezier(.2,.75,.2,1) forwards; }
.contact-stage.is-submitting .contact-transition-drop::before { animation: contactDropWave 1s 1.12s ease-out forwards; }
.contact-stage.is-submitting .contact-transition-drop::after { animation: contactDropWave 1s 1.34s ease-out forwards; }
.contact-stage.is-submitting .contact-thanks { visibility: visible; will-change: transform, opacity, border-radius; backface-visibility: hidden; -webkit-backface-visibility: hidden; animation: contactThanksPortal 1.3s 1.72s cubic-bezier(.16,.82,.2,1) forwards, contactThanksBreathe 2.8s 3.02s ease-in-out infinite alternate; }
.contact-stage.is-submitting .contact-thanks > * { animation: contactThanksContent .48s 2.48s ease forwards; }
.contact-stage.is-submitting .contact-thanks::before { animation: contactThanksSheen 1.15s 2.18s cubic-bezier(.2,.7,.2,1) forwards; }
.contact-stage.is-submitting .contact-thanks::after { animation: contactThanksProgress 5s 3.02s linear forwards; }
.footer-bottom { display: grid; grid-template-columns: 1fr 1fr auto; padding-top: 19px; border-top: 1px solid rgba(183,217,254,.45); font-size: 9px; text-transform: uppercase; letter-spacing: .13em; }

@keyframes contactContentVanish {
  to { opacity: 0; transform: scale(.98); }
}
@keyframes contactFormPortal {
  0% { transform: translateZ(0) scale(1); border-radius: 34px; opacity: 1; }
  28% { transform: translateZ(0) scale(1.012,.992); border-radius: 42px 30px 39px 34px / 34px 43px 31px 40px; opacity: 1; }
  68% { transform: translateZ(0) scale(.72,.68); border-radius: 42% 58% 47% 53% / 55% 45% 58% 42%; opacity: .78; }
  100% { transform: translateZ(0) scale(.035); border-radius: 50%; opacity: 0; }
}
@keyframes contactDropPulse {
  0% { opacity: 0; transform: translate(-50%,-50%) scale(0); }
  28% { opacity: 1; transform: translate(-50%,-50%) scale(1.12,.9); }
  58% { opacity: 1; transform: translate(-50%,-50%) scale(.92,1.08); }
  82% { opacity: 1; transform: translate(-50%,-50%) scale(1); }
  100% { opacity: 0; transform: translate(-50%,-50%) scale(.18); }
}
@keyframes contactDropWave {
  0% { opacity: .7; transform: scale(.7); }
  100% { opacity: 0; transform: scale(4.4); }
}
@keyframes contactPortalAura {
  0% { opacity: 0; transform: translate(-50%,-50%) scale(.15); }
  34% { opacity: .9; transform: translate(-50%,-50%) scale(.72); }
  62% { opacity: .62; transform: translate(-50%,-50%) scale(1.08); }
  100% { opacity: 0; transform: translate(-50%,-50%) scale(1.45); }
}
@keyframes contactThanksPortal {
  0% { opacity: 0; border-radius: 50%; transform: translate(-50%,-50%) scale(.035); }
  64% { opacity: 1; border-radius: 42% 58% 48% 52% / 54% 46% 58% 42%; transform: translate(-50%,-50%) scale(.82,.68); }
  84% { opacity: 1; border-radius: 42px 31px 45px 34px / 33px 46px 31px 43px; transform: translate(-50%,-50%) scale(1.025,.96); }
  100% { opacity: 1; border-radius: 36px 29px 39px 32px / 31px 40px 29px 42px; transform: translate(-50%,-50%) scale(1); }
}
@keyframes contactThanksBreathe {
  from { border-radius: 36px 29px 39px 32px / 31px 40px 29px 42px; transform: translate(-50%,-50%) scale(1); }
  to { border-radius: 31px 42px 30px 40px / 43px 30px 41px 32px; transform: translate(-50%,-50%) scale(1.012,.992); }
}
@keyframes contactThanksContent {
  to { opacity: 1; transform: translateY(0); }
}
@keyframes contactThanksSheen {
  0% { background-position: 130% 0; opacity: 0; }
  24% { opacity: .85; }
  100% { background-position: -80% 0; opacity: .34; }
}
@keyframes contactThanksProgress {
  0% { opacity: .9; transform: scaleX(1); }
  92% { opacity: .9; transform: scaleX(.08); }
  100% { opacity: 0; transform: scaleX(0); }
}

@keyframes contactOrbBounce {
  0% { left: 72%; top: 72%; transform: translate(-50%,-50%) scale(1); }
  18% { left: 24%; top: 76%; transform: translate(-50%,-50%) scale(1); }
  20% { left: 16%; top: 78%; transform: translate(-50%,-50%) scale(.86,1.1); }
  22% { left: 23%; top: 73%; transform: translate(-50%,-50%) scale(1.04,.97); }
  45% { left: 74%; top: 27%; transform: translate(-50%,-50%) scale(1); }
  47% { left: 82%; top: 17%; transform: translate(-50%,-50%) scale(.9,1.09); }
  49% { left: 76%; top: 25%; transform: translate(-50%,-50%) scale(1.04,.97); }
  70% { left: 72%; top: 72%; transform: translate(-50%,-50%) scale(1); }
  72% { left: 82%; top: 82%; transform: translate(-50%,-50%) scale(.88,1.1); }
  74% { left: 74%; top: 74%; transform: translate(-50%,-50%) scale(1.04,.97); }
  100% { left: 72%; top: 72%; transform: translate(-50%,-50%) scale(1); }
}


.site-menu { position: fixed; z-index: 50; inset: 0; visibility: hidden; pointer-events: none; }
.liquid, .menu-surface { position: absolute; inset: 0; }
.liquid { z-index: 0; filter: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='g'%3E%3CfeGaussianBlur stdDeviation='12' result='b'/%3E%3CfeColorMatrix in='b' mode='matrix' values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 28 -11'/%3E%3C/filter%3E%3C/svg%3E%23g"); overflow: hidden; }
.liquid::before, .liquid i { position: absolute; border-radius: 50%; background: var(--red); transform: scale(0); }
.liquid::before { content: ""; width: 135vmax; height: 135vmax; right: -67vmax; top: -67vmax; transition: transform 1s .08s cubic-bezier(.76,0,.18,1); }
.liquid i { width: 22vmax; height: 22vmax; right: -10vmax; top: calc(var(--y, 10) * 1%); transition: transform .8s calc(var(--d, 0) * 1ms) cubic-bezier(.76,0,.18,1); }
.liquid i:nth-child(1) { --y:12; --d:30; }.liquid i:nth-child(2) { --y:29; --d:80; }.liquid i:nth-child(3) { --y:47; --d:130; }.liquid i:nth-child(4) { --y:65; --d:180; }.liquid i:nth-child(5) { --y:83; --d:230; }
.menu-surface { z-index: 1; padding: 120px var(--pad) 28px; color: var(--sky); background: var(--wine); clip-path: inset(0 0 0 100%); transition: clip-path .72s .33s cubic-bezier(.76,0,.18,1); display: grid; grid-template-columns: .65fr 1.8fr; grid-template-rows: auto 1fr auto; gap: 20px 6vw; }
.menu-erton-field{position:absolute;inset:0;overflow:hidden;pointer-events:none;opacity:.14}.menu-erton-field img{position:absolute;width:clamp(180px,23vw,430px);filter:brightness(0) invert(1)}.menu-erton-field img:nth-child(1){left:-4%;top:10%;transform:rotate(-13deg)}.menu-erton-field img:nth-child(2){left:10%;bottom:5%;transform:rotate(8deg) scale(.72)}.menu-erton-field img:nth-child(3){right:-6%;top:5%;transform:rotate(16deg) scale(.85)}.menu-erton-field img:nth-child(4){right:19%;bottom:-4%;transform:rotate(-8deg) scale(.62)}.menu-erton-field img:nth-child(5){left:37%;top:38%;transform:rotate(5deg) scale(.48)}.menu-erton-field img:nth-child(6){right:3%;top:48%;transform:rotate(-18deg) scale(.43)}.menu-surface>*:not(.menu-erton-field){position:relative;z-index:2}
.site-menu.is-open { visibility: visible; pointer-events: auto; }
.site-menu.is-opening .liquid::before, .site-menu.is-opening .liquid i { transform: scale(1.2); }
.site-menu.is-open .menu-surface { clip-path: inset(0 0 0 0); }
.site-menu.is-closing { visibility: visible; }
.site-menu.is-closing .menu-surface { clip-path: inset(0 100% 0 0); transition-delay: 0s; }
.site-menu.is-closing .liquid::before, .site-menu.is-closing .liquid i { transform: scale(0); transition-delay: .28s; }
.menu-caption { margin: 10px 0 0; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; opacity: 0; transition: opacity .4s .7s; }
.menu-nav { grid-column: 2; align-self: center; }
.menu-nav a { position: relative; min-height: clamp(43px, 6.7vh, 72px); display: grid; grid-template-columns: 40px 1fr auto; align-items: center; overflow: hidden; border-bottom: 1px solid rgba(255,255,255,.3); opacity: 0; transform: translateX(70px); transition: opacity .45s calc(.5s + var(--n) * .055s), transform .6s calc(.5s + var(--n) * .055s) cubic-bezier(.16,.75,.2,1), color .25s; }
.menu-nav a::before { content: ""; position: absolute; inset: 0; background: var(--sky); transform: translateY(102%); transition: transform .35s cubic-bezier(.76,0,.18,1); }
.menu-nav a > * { position: relative; z-index: 1; }
.menu-nav .menu-number { align-self: start; padding-top: 15px; font-family: "DM Sans", Arial, sans-serif; font-size: 8px; letter-spacing: .08em; }
.menu-nav span { font: 500 clamp(27px, 4vw, 58px)/.88 "DM Sans", Arial, sans-serif; letter-spacing: -.045em; text-transform: uppercase; }
.menu-nav i { font: 400 24px "DM Sans"; opacity: 0; transform: translate(-15px, 15px); transition: .35s; }
.menu-nav a:hover { color: var(--sky); }.menu-nav a:hover::before { background: var(--red); transform: translateY(0); }.menu-nav a:hover i { opacity: 1; transform: translate(0); }
.menu-bottom { grid-column: 1 / -1; display: grid; grid-template-columns: .65fr 1.8fr auto; gap: 6vw; padding-top: 16px; border-top: 1px solid rgba(183,217,254,.35); font-size: 9px; text-transform: uppercase; letter-spacing: .1em; opacity: 0; transition: opacity .4s .85s; }.menu-bottom div { display: flex; gap: 30px; }
.site-menu.is-open .menu-nav a { opacity: 1; transform: translateX(0); }.site-menu.is-open .menu-caption, .site-menu.is-open .menu-bottom { opacity: 1; }

@keyframes pulse { 50% { opacity: .3; transform: scale(.7); } }
@media (max-width: 760px) {
  :root { --pad: 15px; }
  .header { padding-top: 13px; grid-template-columns: 1fr 1fr; }
  .logo { width: 110px; height: 52px; padding: 0; }.logo img { width: 110px; height: auto; }
  body.menu-open .logo { top: 13px; left: 15px; }
  .monday-note { display: none; }
  .menu-button { top: 13px; right: 15px; width: 50px; height: 50px; padding: 0; border-radius: 50%; justify-content: center; }.menu-word { display: none; }.hamburger { width: 19px; }
  .hero { min-height: 100svh; padding: 95px 15px 20px; }
  .hero-art { width: 100%; height: 47vh; min-height: 280px; margin: 0 auto; }
  .hero-copy { min-height: 82px; margin-top: 0; padding: 6px 0; }
  .hero-copy > p { font-size: 8px; margin-bottom: 7px; }
  .solution-title { font-size: clamp(17px, 5.15vw, 23px); line-height: 1.08; }
  .text-lens { width: 72px; height: 72px; }
  .lens-text { font-size: clamp(17px, 5.15vw, 23px); line-height: 1.08; white-space: normal; }
  .hero-index { margin-top: auto; }.hero-index span:last-child { display: none; }
  .scroll-down { right: 15px; bottom: 18px; }.scroll-down span { display: none; }
  .work { padding: 48px 15px 90px; }
  .work-heading { margin-bottom: 55px; }.work-heading span { display: none; }
  .project-grid { grid-template-columns: 1fr; gap: 72px; }.project--wide { grid-column: auto; width: 100%; }.project--lower { margin-top: 0; }.project-visual, .project--wide .project-visual { aspect-ratio: 1.08; }.project-meta { display: block; }.project-meta p { width: 88%; margin-top: 14px; }.project-meta i { display: none; }
  .statement { padding: 85px 15px 30px; }.statement h2 { font-size: 15vw; }.statement h2 em { margin-left: 0; }.services-list { grid-template-columns: 1fr 1fr; }.services-list span:nth-child(2) { border-right: 0; }.services-list span { border-bottom: 1px solid var(--wine); }
  .footer { min-height: 75vh; padding: 75px 15px 20px; }.contact-stage { height: 650px; margin: 24px 0; }.contact-door-copy { font-size: 16vw; }.contact-form-panel { padding: 8px; }.contact-orb--two { width: 250px; height: 250px; }.contact-glass { padding: 22px 16px; border-radius: 24px; }.contact-form-heading h2 { font-size: clamp(30px, 10vw, 43px); margin-bottom: 22px; }.contact-close { width: 40px; height: 40px; }.contact-form { grid-template-columns: 1fr; gap: 13px; }.contact-message, .contact-form-action { grid-column: auto; }.contact-form-action { align-items: stretch; flex-direction: column; gap: 12px; }.contact-form-action button { width: 100%; }.footer-bottom { grid-template-columns: 1fr auto; }.footer-bottom span:nth-child(2) { display: none; }

  .menu-surface { padding: 89px 15px 18px; display: flex; flex-direction: column; gap: 12px; }.menu-caption { display: none; }.menu-nav { flex: 1; display: flex; flex-direction: column; justify-content: center; }.menu-nav a { min-height: clamp(51px, 9vh, 72px); grid-template-columns: 28px 1fr auto; }.menu-nav span { font-size: clamp(34px, 10.8vw, 52px); }.menu-nav .menu-number { padding-top: 9px; }.menu-bottom { display: flex; justify-content: space-between; }.menu-bottom > a, .menu-bottom > span { display: none; }.menu-bottom div { width: 100%; justify-content: space-between; }
  .liquid::before { width: 180vmax; height: 180vmax; right: -90vmax; top: -90vmax; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .contact-orb--two { animation: contactOrbBounce 16s linear infinite !important; }
  .contact-stage.is-submitting .contact-form-heading, .contact-stage.is-submitting .contact-form { animation: contactContentVanish .48s ease forwards !important; }
  .contact-stage.is-submitting .contact-form-panel::after { animation: contactPortalAura 2.75s .38s cubic-bezier(.2,.75,.2,1) forwards !important; }
  .contact-stage.is-submitting .contact-glass { animation: contactFormPortal 1.55s cubic-bezier(.62,0,.2,1) forwards !important; }
  .contact-stage.is-submitting .contact-transition-drop { animation: contactDropPulse 1.3s .92s cubic-bezier(.2,.75,.2,1) forwards !important; }
  .contact-stage.is-submitting .contact-transition-drop::before { animation: contactDropWave 1s 1.12s ease-out forwards !important; }
  .contact-stage.is-submitting .contact-transition-drop::after { animation: contactDropWave 1s 1.34s ease-out forwards !important; }
  .contact-stage.is-submitting .contact-thanks { animation: contactThanksPortal 1.3s 1.72s cubic-bezier(.16,.82,.2,1) forwards, contactThanksBreathe 2.8s 3.02s ease-in-out infinite alternate !important; }
  .contact-stage.is-submitting .contact-thanks > * { animation: contactThanksContent .48s 2.48s ease forwards !important; }
  .contact-stage.is-submitting .contact-thanks::before { animation: contactThanksSheen 1.15s 2.18s cubic-bezier(.2,.7,.2,1) forwards !important; }
  .contact-stage.is-submitting .contact-thanks::after { animation: contactThanksProgress 5s 3.02s linear forwards !important; }
}

.return-entry-transition { position: fixed; z-index: 500; inset: 0; display: grid; place-items: center; overflow: hidden; color: #fff; background: var(--red); clip-path: circle(160vmax at var(--entry-x) var(--entry-y)); pointer-events: all; will-change: clip-path; transition: clip-path 1s cubic-bezier(.76,0,.18,1); }
.return-word { position: relative; z-index: 2; display: flex; align-items: baseline; font-size: clamp(48px,11vw,180px); line-height: .8; letter-spacing: -.08em; }
.return-word span { display: inline-block; transform: translate(0,0) rotate(0) scale(1); opacity: 1; transition: transform .72s cubic-bezier(.65,0,.35,1), opacity .38s .28s ease; }
.return-word i { width: .14em; height: .14em; margin: 0 .08em .02em .12em; border-radius: 50%; background: #fff; transition: transform .4s ease, opacity .3s ease; }
.return-entry-transition.is-leaving { clip-path: circle(0 at var(--entry-x) var(--entry-y)); }
.return-entry-transition.is-leaving .return-word span { opacity: 0; transform: translate(var(--x),var(--y)) rotate(-22deg) scale(.35); }
.return-entry-transition.is-leaving .return-word i { opacity: 0; transform: scale(0); }
.club-return-entry { position: fixed; z-index: 520; left: 0; top: 0; width: 100%; height: 112%; overflow: visible; color: #fff; background: #4b2d20; pointer-events: all; transform: translateY(-7%); will-change: transform; transition: transform 1.08s cubic-bezier(.72,0,.18,1); }
.club-return-entry::before, .club-return-entry::after { content: ""; position: absolute; left: -5%; bottom: -46px; width: 110%; height: 95px; background: #4b2d20; border-radius: 45% 55% 50% 50% / 65% 70% 30% 35%; }
.club-return-entry::after { bottom: -68px; left: 14%; width: 72%; height: 120px; border-radius: 38% 62% 46% 54% / 72% 62% 38% 28%; }
.club-return-entry > div { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); font-size: clamp(44px,8vw,130px); line-height: .8; letter-spacing: -.07em; opacity: 1; transition: opacity .35s .15s ease; }
.club-return-entry.is-revealing { transform: translateY(-120%); }
.club-return-entry.is-revealing > div { opacity: 0; }
.visual-editorial--media::after { content: none !important; display: none !important; }
.security-card .project-meta h3 { font-size: clamp(20px,1.75vw,29px); line-height: 1.02; max-width: 280px; }