:root{--bg:#282a2c;--yellow:#f7ee81;--snow:#f4f4f4}*{box-sizing:border-box}html{background:var(--bg);color:var(--snow);font-family:Manrope,sans-serif}body{margin:0}button{font:inherit}.filters{position:absolute;width:0;height:0;overflow:hidden}.journey{height:145svh}.hero{height:100svh;min-height:620px;position:sticky;top:0;overflow:hidden;background:var(--bg)}header{position:absolute;top:42px;left:5.2%;right:5.2%;display:flex;justify-content:space-between;align-items:center;z-index:3}.logo{width:145px;height:auto;display:block}.studio{font-size:13px;line-height:1.6;color:#c1c1bd;letter-spacing:.025em}.intro{position:absolute;left:8%;top:36%;z-index:2;pointer-events:none}.eyebrow{font-size:11px;letter-spacing:.19em;color:#c6c5b8;margin:0 0 28px}h1{font-size:clamp(58px,6.5vw,104px);font-weight:300;line-height:1.1;letter-spacing:-.06em;margin:0}h1 span{color:var(--yellow)}.description{font-size:15px;font-weight:300;color:#c1c1bd;margin-top:30px;letter-spacing:.015em}.sculpture{position:absolute;width:min(69vw,1050px);height:min(69vw,1050px);right:-8%;top:50%;transform:translateY(-50%);pointer-events:none}#forms{height:100%;width:100%;overflow:visible}#particles{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}footer{position:absolute;bottom:35px;left:5.2%;right:5.2%;display:flex;align-items:center;justify-content:space-between;gap:20px;z-index:3;font-size:12px;color:#b5b6b0}.signature{letter-spacing:.035em}.scroll-note{display:flex;gap:26px;align-items:center}.scroll-note>span{color:var(--yellow);font-size:22px}#motion{border:1px solid #55564e;background:transparent;color:#c7c8bf;border-radius:50px;padding:10px 16px;display:flex;gap:9px;align-items:center;cursor:pointer;font-size:12px}#motion:hover{border-color:var(--yellow);color:var(--yellow)}#motion:focus-visible{outline:2px solid var(--yellow);outline-offset:5px}.pause-icon{font-size:14px;line-height:1}.hero::after{content:"";position:absolute;left:5.2%;right:5.2%;bottom:89px;height:1px;background:#ffffff17;pointer-events:none}
@media(min-width:1600px){.intro{left:10%}.sculpture{right:0}}@media(max-width:900px){.hero{min-height:650px}header{top:25px;left:7%;right:7%}.logo{width:112px}.studio{font-size:12px}.intro{left:8%;top:24%}.eyebrow{font-size:10px;margin-bottom:20px}h1{font-size:clamp(49px,10vw,70px)}.description{font-size:13px;margin-top:22px}.sculpture{width:110vw;height:110vw;right:-24%;top:69%}footer{left:7%;right:7%;bottom:24px}.signature{display:none}.scroll-note{font-size:11px;gap:15px}.hero::after{left:7%;right:7%;bottom:79px}#motion{font-size:11px;padding:10px 13px}.journey{height:135svh}}@media(prefers-reduced-motion:reduce){.journey{height:100svh}.scroll-note{visibility:hidden}}
/* The scene opens organically, preserving the same charcoal surface. */
.journey{height:265svh}.hero{--gather:0;--intro-opacity:1;--reveal:0;--line-1:0;--line-2:0;--line-3:0;min-height:620px}header{z-index:6}.intro{opacity:var(--intro-opacity);transform:translateY(calc(var(--gather)*-22px));will-change:transform,opacity}footer{justify-content:flex-end;opacity:var(--intro-opacity)}.see{border:0;background:none;color:#b5b6b0;display:flex;align-items:center;gap:26px;font-size:12px;cursor:pointer;padding:10px 0 10px 20px}.see span{color:#f7ee81;font-size:22px}.see:focus-visible{outline:2px solid #f7ee81;outline-offset:6px}.see:disabled{visibility:hidden}.hero::after{opacity:var(--intro-opacity)}.solutions{position:absolute;z-index:4;inset:0;display:flex;align-items:center;justify-content:center;padding:120px 7% 100px;color:#f4f4f4;visibility:hidden;pointer-events:none}.solutions.is-visible{visibility:visible}.solutions h2{font-size:clamp(38px,5.1vw,80px);font-weight:300;letter-spacing:-.05em;line-height:1.17;text-align:center;margin:0;max-width:1200px}.solutions h2 span{display:block;--line:var(--line-1);opacity:var(--line);transform:translateY(calc((1 - var(--line))*20px));will-change:transform,opacity}.solutions h2 span:first-child{font-size:.51em;letter-spacing:-.025em;color:#c6c6be;margin-bottom:23px}.solutions h2 span:nth-child(2){--line:var(--line-2)}.solutions h2 span:last-child{--line:var(--line-3);font-weight:inherit;color:inherit}
@media(max-width:900px){.journey{height:255svh}.hero{min-height:600px}.intro{top:24%;left:8%;right:6%}.sculpture{width:100vw;height:100vw;right:-12%;top:66%}.solutions{padding:110px 8% 85px}.solutions h2{font-size:clamp(34px,8.7vw,55px);line-height:1.18;letter-spacing:-.045em}.solutions h2 span:first-child{font-size:inherit;line-height:inherit;max-width:none;margin:0}.solutions h2 span:last-child{margin-top:8px}.see{font-size:12px;gap:20px}}
@media(prefers-reduced-motion:reduce){.journey{height:auto}.hero{position:relative;height:auto;min-height:0;overflow:hidden}.hero header{top:28px}.hero .intro{position:relative;top:auto;left:auto;padding:190px 8% 80px;min-height:100svh;opacity:1;transform:none}.hero .sculpture{top:65svh;opacity:.4}.hero #particles,.hero footer,.hero::after{display:none}.hero .solutions{position:relative;inset:auto;min-height:100svh;padding:110px 8%;background:#282a2c;visibility:visible}.solutions h2 span{transform:none;opacity:1}}
/* A soft reflection, followed by the same circles becoming a service map. */
.journey{height:455svh}.hero{--light:0;--services-reveal:0;--solutions-out:1;background:color-mix(in srgb,#282a2c calc((1 - var(--light))*100%),#f4f4f4)}.brand{position:relative}.logo-dark{position:absolute;inset:0;opacity:var(--light)}.logo-yellow{opacity:calc(1 - var(--light))}.studio{color:color-mix(in srgb,#c1c1bd calc((1 - var(--light))*100%),#282a2c)}.solutions{opacity:var(--solutions-out)}.solutions .reflect{background-image:linear-gradient(108deg,#f4f4f4 0%,#f4f4f4 42%,#f7ee81 49%,#fffbe0 51%,#f4f4f4 58%,#f4f4f4 100%);background-size:300% 100%;background-position:var(--shine,100%) 0;background-clip:text;-webkit-background-clip:text;color:transparent!important}.services{position:absolute;inset:0;z-index:4;visibility:hidden;color:#282a2c;pointer-events:none}.services.is-visible{visibility:visible}.services-intro{position:absolute;left:8%;top:25%;opacity:var(--services-reveal);transform:translateY(calc((1 - var(--services-reveal))*20px))}.services-intro p{font-size:12px;letter-spacing:.12em;color:#737577;margin:0 0 70px}.services-intro h2{font-size:clamp(48px,5.2vw,86px);font-weight:300;line-height:1.13;letter-spacing:-.055em;margin:0}.service-map{list-style:none;margin:0;padding:0;position:absolute;inset:0}.service-map li{position:absolute;left:var(--x);top:var(--y);width:clamp(112px,10.7vw,174px);aspect-ratio:1;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;text-align:center;padding:19px;opacity:var(--services-reveal);font-size:clamp(12px,1.04vw,16px);line-height:1.3;letter-spacing:-.025em}.service-map li span{max-width:100%}
@media(max-width:900px){.journey{height:455svh}.services-intro{left:8%;top:16%}.services-intro p{margin-bottom:15px;font-size:11px}.services-intro h2{font-size:36px}.services-intro h2 br{display:none}.service-map{top:32%;height:58%;left:5%;right:5%;display:grid;grid-template-columns:repeat(3,1fr);align-content:center;gap:10px}.service-map li{position:relative;left:auto;top:auto;transform:none;width:100%;padding:10px;font-size:11px}.service-map li:last-child{grid-column:2}}
@media(prefers-reduced-motion:reduce){.journey{height:auto}.services{position:relative;min-height:100svh;visibility:visible;background:#f4f4f4}.services-intro,.service-map li{opacity:1;transform:translate(-50%,-50%)}.services-intro{transform:none}.service-map li{border:1px solid #a2a1a1;border-radius:50%}.solutions{opacity:1}.solutions .reflect{background:none;color:#f4f4f4!important}}

/* Shared geometry: touching service circles and tangent larger circles. */
@media(min-width:901px){.services{--service-d:min(15.5vw,22vh,214px)}.service-map li{width:var(--service-d);left:calc(50% + var(--col)*var(--service-d));top:calc(54% + var(--row)*var(--service-d));padding:22px;font-size:clamp(13px,1.08vw,17px)}}
/* Service circles open into an editorial space for each discipline. */
.service-map li{padding:0}.service-button{width:100%;height:100%;border:0;border-radius:50%;padding:22px;background:transparent;color:inherit;font:inherit;letter-spacing:inherit;line-height:inherit;cursor:pointer;transition:background-color .3s ease,box-shadow .3s ease;pointer-events:none}.is-ready .service-button{pointer-events:auto}.service-button:hover,.service-button:focus-visible{background:#f7ee81;box-shadow:0 0 0 1px #d4ce78}.service-button:focus-visible{outline:2px solid #282a2c;outline-offset:5px}.service-button:disabled{cursor:default}.service-hint{position:absolute;left:50%;bottom:4.5%;transform:translateX(-50%);margin:0;font-size:13px;color:#656769;opacity:var(--services-reveal);display:flex;gap:18px;align-items:center}.service-hint span{font-size:19px}@media(min-width:901px){.service-map li{padding:0}}.service-hint{left:5.2%;transform:none}.service-button{border:1px solid #282a2c75}.service-map li{transition:transform .8s cubic-bezier(.22,1,.36,1),left .8s cubic-bezier(.22,1,.36,1),top .8s cubic-bezier(.22,1,.36,1),width .8s cubic-bezier(.22,1,.36,1),height .8s cubic-bezier(.22,1,.36,1),border-radius .8s,opacity .6s;height:var(--service-d);border-radius:50%}.service-map.has-expanded li:not(.is-expanded){transform:translate(calc(-50% + var(--push-x,0px)),calc(-50% + var(--push-y,0px)));opacity:.38}.service-map li.is-expanded{left:50%;top:52%;width:min(720px,72vw);height:min(520px,65vh);aspect-ratio:auto;border-radius:100px;background:#f7ee81;border:1px solid #d0c970;z-index:8;pointer-events:auto;overflow:hidden}.is-expanded>.service-button{opacity:0;pointer-events:none;position:absolute;inset:0}.inline-detail[hidden]{display:none!important}.inline-detail{position:absolute;inset:0;text-align:left;overflow:auto;color:#282a2c;pointer-events:auto}.detail-shell{position:relative;padding:64px 11% 55px;min-height:100%;animation:detail-arrive .65s .14s both}.detail-close{position:absolute;top:22px;right:44px;display:flex;align-items:center;gap:12px;border:0;background:none;color:inherit;font-size:12px;cursor:pointer;padding:8px}.detail-close span{font-size:24px}.detail-close:focus-visible{outline:2px solid #282a2c;outline-offset:3px}.detail-index{display:block;font-size:11px;letter-spacing:.12em;color:#686644;margin-bottom:26px}#detail-title{font-size:clamp(30px,3vw,48px);font-weight:300;letter-spacing:-.05em;line-height:1.13;margin:0 0 23px}#detail-summary{font-size:17px;line-height:1.6;margin:0;max-width:550px}.detail-body:not(:empty){border-top:1px solid #282a2c30;margin-top:28px;padding-top:18px;font-size:16px;line-height:1.65}.detail-image{margin:28px 0 0}.detail-image img{width:100%;height:auto;border-radius:12px}.detail-image figcaption{font-size:12px;margin-top:8px}@keyframes detail-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media(max-width:900px){.service-hint{left:7%}.service-map li{height:auto}.service-map li.is-expanded{position:fixed;left:50%;top:52%;width:88vw;height:65svh;transform:translate(-50%,-50%);border-radius:50px}.detail-shell{padding:65px 9% 40px}.detail-close{right:25px}#detail-summary{font-size:15px}}@media(prefers-reduced-motion:reduce){.service-map li,.service-button{transition:none}.detail-shell{animation:none}}
/* One visible left edge across logo, title and service instruction. */
.hero{--page-gutter:8%}header{left:var(--page-gutter)}.intro{left:var(--page-gutter)}.service-hint{left:var(--page-gutter)}.brand{width:145px;height:44px;overflow:hidden;position:relative}.brand .logo{position:absolute;width:186.883px;height:70.512px;max-width:none;left:-20.941px;top:-13.254px}.brand .logo-dark{inset:auto;left:-20.941px;top:-13.254px}footer{opacity:1}.see{opacity:var(--intro-opacity)}.see-how{position:absolute;right:0;border:0;background:none;color:#b5b6b0;font:inherit;font-size:12px;display:flex;gap:26px;align-items:center;padding:10px 0 10px 20px;cursor:pointer;opacity:var(--how-opacity,0)}.see-how span{font-size:22px;color:#f7ee81}.see-how:disabled{visibility:hidden}.see-how:focus-visible{outline:2px solid #f7ee81;outline-offset:6px}
.service-map.has-expanded li,.service-map.has-expanded li.is-expanded{left:var(--layout-x);top:var(--layout-y);width:var(--layout-w);height:var(--layout-h);transform:translate(-50%,-50%);aspect-ratio:auto}.service-map.has-expanded li:not(.is-expanded){opacity:1;font-size:clamp(12px,.95vw,14px)}.service-map.has-expanded li:not(.is-expanded) .service-button{padding:12px}.service-map li.is-expanded{border-radius:50%;background:#f7ee81;border-color:#d0c970}.service-map.is-repacking:not(.has-expanded) li{width:var(--compact-d);height:var(--compact-d)}.service-map.has-expanded .detail-shell{padding:19% 14% 13%;animation:detail-arrive .4s both;display:flex;flex-direction:column;justify-content:center;min-height:100%}.service-map.has-expanded .detail-close{top:8%;left:50%;right:auto;transform:translateX(-50%);white-space:nowrap}.service-map.has-expanded .detail-index{margin-bottom:16px}.service-map.has-expanded #detail-title{font-size:clamp(26px,2.5vw,40px);margin-bottom:19px}.service-map.has-expanded #detail-summary{font-size:clamp(14px,1.13vw,17px);line-height:1.55}.service-map.has-expanded .inline-detail{border-radius:50%}.service-map.has-expanded .is-expanded>.service-button{visibility:hidden}@media(min-width:1600px){.hero{--page-gutter:10%}}@media(max-width:900px){.hero{--page-gutter:8%}.brand{width:112px;height:34px}.brand .logo{width:144.351px;height:54.464px;left:-16.175px;top:-10.238px}.brand .logo-dark{left:-16.175px;top:-10.238px}}

/* Compact details above a two-row service composition. */
.service-button{border-color:#bfc0c1}.service-button:hover,.service-button:focus-visible{box-shadow:none;border-color:#cfca98}
.service-map li.is-expanded{border-radius:18px;background:#f7ee81;border-color:#d5d2ab}
.service-map.has-expanded .inline-detail{border-radius:18px}
.service-map.has-expanded .detail-shell{padding:30px 42px;justify-content:center}
.service-map.has-expanded .detail-close{top:12px;right:16px;left:auto;transform:none}
.service-map.has-expanded .detail-index{display:none}
.service-map.has-expanded #detail-title{font-size:clamp(24px,2.3vw,34px);margin:0 65px 14px 0}
.service-map.has-expanded #detail-summary{font-size:clamp(14px,1.15vw,17px);max-width:560px;line-height:1.5}
.service-map.has-expanded li:not(.is-expanded){font-size:clamp(11px,.95vw,14px);background:#f4f4f4}

/* Contact continues the pale surface with generous space and a quiet orbit. */
.contact{position:relative;isolation:isolate;overflow:hidden;min-height:100svh;background:#f4f4f4;color:#282a2c;padding:150px 8% 110px;display:grid;grid-template-columns:1fr 1fr;align-content:center;gap:9%;border-top:1px solid #dddddc}
.contact-heading{position:relative;z-index:1}.contact h2{font-size:clamp(64px,7.5vw,116px);letter-spacing:-.065em;font-weight:300;line-height:1.1;margin:0}.contact h2 span{color:#b6b05b}
.contact-form{position:relative;z-index:1;display:grid;gap:28px;max-width:520px;width:100%}.contact-form label{display:grid;gap:10px;font-size:13px;color:#67686a}.contact-form input,.contact-form textarea{border:0;border-bottom:1px solid #bfc0c1;border-radius:0;background:transparent;width:100%;color:#282a2c;font:inherit;font-size:18px;padding:8px 0 12px;outline:none;resize:vertical;transition:border-color .3s,box-shadow .3s}.contact-form input:focus,.contact-form textarea:focus{border-color:#b4ac50;box-shadow:0 2px 0 #f7ee81}.contact-action{display:flex;align-items:center;gap:20px}.contact-action button{border:1px solid #cbcbbf;border-radius:999px;background:#f7ee81;color:#282a2c;padding:13px 23px;display:flex;gap:50px;align-items:center;cursor:pointer;transition:background .3s}.contact-action button:hover{background:#f3e965}.contact-action button:focus-visible,.back-top:focus-visible{outline:2px solid #99944f;outline-offset:5px}.contact-action button span{font-size:22px}.contact-status{font-size:12px;line-height:1.5;max-width:220px;color:#67686a}
.contact-art{position:absolute;width:650px;height:650px;left:-200px;top:45%;pointer-events:none;z-index:0}.contact-art i{position:absolute;inset:0;border:1px solid #dededb;border-radius:50%}.contact-art i:nth-child(2){inset:65px}.contact-art span{position:absolute;inset:0;animation:contact-orbit 45s linear infinite}.contact-art span:after{content:"";position:absolute;left:50%;top:-6px;width:12px;height:12px;border-radius:50%;background:#f7ee81}.contact-bottom{position:absolute;left:8%;right:8%;bottom:32px;display:flex;justify-content:space-between;font-size:12px;color:#858683}.back-top{color:inherit;text-decoration:none}@keyframes contact-orbit{to{transform:rotate(360deg)}}
@media(min-width:1600px){.contact{padding-left:10%;padding-right:10%}.contact-bottom{left:10%;right:10%}}
@media(max-width:900px){.contact{grid-template-columns:1fr;padding:85px 8% 110px;gap:50px}.contact h2{font-size:64px}.contact-art{opacity:.5;left:-440px}.contact-form{max-width:none}}
@media(prefers-reduced-motion:reduce){.contact-art span{animation:none}}


/* Service reading state: type above, nine tangent circles below. */
.services.is-ready .service-button{background:#f4f4f4}
.services.is-ready .service-button:hover,.services.is-ready .service-button:focus-visible{background:#f7ee81}
.service-map.service-reading li{left:var(--read-x);top:var(--read-y);width:var(--read-d);height:var(--read-d);transform:translate(-50%,-50%);opacity:1;font-size:clamp(12px,1.02vw,15px)}
.service-map.service-reading li.service-selected{opacity:0;pointer-events:none;transform:translate(-50%,-50%) scale(.6)}
.service-map.service-reading .service-button{padding:15px}
.service-editorial[hidden]{display:none!important}
.service-editorial{position:absolute;left:18%;right:18%;top:21%;z-index:6;text-align:center;color:#282a2c;pointer-events:auto}
.service-editorial .detail-shell{padding:0;min-height:0;animation:none}
.service-editorial .detail-index,.service-editorial .detail-body,.service-editorial .detail-image{display:none}
.service-editorial #detail-title{font-size:clamp(28px,3.5vw,52px);font-weight:300;line-height:1.12;letter-spacing:-.045em;margin:0 auto 18px;max-width:800px}
.service-editorial #detail-summary{font-size:clamp(14px,1.25vw,18px);line-height:1.6;max-width:610px;margin:0 auto}
.service-editorial .detail-close{position:static;display:flex;justify-content:center;margin:16px auto 0;padding:5px 12px;font-size:11px;color:#737575}
.service-editorial .detail-close span{font-size:18px}
.service-editorial .detail-shell{display:flex;flex-direction:column}
.service-editorial .detail-close{order:3}
@media(max-width:900px){.service-editorial{left:8%;right:8%;top:18%}.service-editorial #detail-title{font-size:26px}.service-map.service-reading{inset:0;height:100%;display:block}.service-map.service-reading li{position:absolute;font-size:10px}.service-map.service-reading .service-button{padding:7px}}

.hero:has(.service-reading) .sculpture{visibility:hidden}
.service-editorial{background:transparent}
.service-editorial #detail-title{font-style:italic;line-height:1.25}
.service-editorial #detail-title span{background:linear-gradient(transparent 25%,#f7ee81 25%,#f7ee81 93%,transparent 93%);padding:0 .14em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.service-whatsapp{order:2;align-self:center;margin-top:18px;color:#282a2c;font-size:14px;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px;transition:color .2s}
.service-whatsapp:hover{color:#77712f}.service-whatsapp:focus-visible{outline:2px solid #aaa14c;outline-offset:6px}
.service-editorial .detail-close{margin-top:9px}


.service-detail-actions{display:flex;justify-content:center;align-items:center;gap:22px;margin-top:18px;order:3}
.service-detail-actions .service-whatsapp,.service-editorial .service-detail-actions .detail-close{font-size:11px;margin:0;order:0;line-height:1.5}
.service-editorial .service-detail-actions .detail-close{padding:5px 0}

.header-links{display:flex;align-items:center;gap:34px}.cases-link{font-size:13px;color:color-mix(in srgb,#c1c1bd calc((1 - var(--light))*100%),#282a2c);text-decoration:none}.cases-link:hover{text-decoration:underline;text-underline-offset:4px}@media(max-width:900px){.header-links{gap:15px}.cases-link{font-size:12px}}
