/* 2026-10-13: adjustments requested in the second walkthrough. */
:root{--header:112px}
html{scroll-padding-top:130px}
body{font-size:18px}
.site-header .brand-word{font-size:76px}
.site-header{background:rgba(255,252,245,.94)}
.header-nav{font-size:16px;gap:26px}
.eyebrow{font-size:21px;letter-spacing:.04em;gap:0}
.eyebrow::before{display:none!important}
.button,.text-link{font-size:18px}
.opening-sequence{position:relative;isolation:isolate}
.hero{min-height:850px;max-height:none;height:100svh}
.hero-main{width:88%;max-width:1280px;padding:160px 0 130px;position:relative;z-index:5;pointer-events:none}
.hero-main a{pointer-events:auto}
.hero h1{max-width:67%}
.hero-small{font-size:clamp(32px,4vw,62px)}
.hero-wow{font-size:clamp(55px,5.8vw,90px);letter-spacing:-.065em;white-space:normal}
.hero-kicker{font-size:17px;letter-spacing:.06em;margin-bottom:30px}
.hero-under{display:block;max-width:570px;margin-top:30px}
.hero-under p{font-size:18px;line-height:2}
.hero-under .button{margin-top:24px}
.hero-bottom{justify-content:flex-end;z-index:6;font-size:14px}
.hero-ribbon{opacity:.85}
.hero-ribbon path{transform-box:fill-box;transform-origin:center;will-change:transform}
.ribbon-yellow{animation:ribbonYellow 12s ease-in-out infinite alternate}
.ribbon-orange{animation:ribbonOrange 10s ease-in-out infinite alternate}
@keyframes ribbonYellow{from{transform:translate(-12px,12px) rotate(-2deg)}to{transform:translate(25px,-18px) rotate(3deg)}}
@keyframes ribbonOrange{from{transform:translate(8px,-16px) rotate(3deg)}to{transform:translate(-24px,24px) rotate(-4deg)}}
.hero-scene-track{position:absolute;inset:0;z-index:4;pointer-events:none}
.hero-scene-track #hero-scene{position:sticky;inset:auto;top:var(--header);height:calc(100svh - var(--header));min-height:560px;width:100%;pointer-events:none}
.hero-scene-track .orbit-fallback{position:sticky;inset:auto;top:var(--header);height:calc(100svh - var(--header));margin-left:60%;width:35%;display:flex}
.hero-scene-track .orbit-fallback>img:first-child{width:100%;max-height:70vh}
.hero-scene-track .fallback-photo{display:none}
.hero-scene-track.has-webgl .orbit-fallback{display:none}
.hero-scene-track:has(.scene-unavailable) #hero-scene{display:none}
.experience{height:245svh}
.experience-sticky{height:calc(100svh - var(--header));min-height:650px;top:var(--header)}
.experience-heading{display:block;top:28px;left:4%;right:4%;max-width:none;text-align:center;z-index:5;opacity:calc(1 - var(--experience-progress,0)*4)}
.experience-heading h2{font-size:clamp(36px,4.3vw,65px);line-height:1.4}
.experience-heading h2 br{display:none}
.experience-copy{z-index:5;left:7%;width:43%;top:50%}
.experience-copy h2{font-size:clamp(36px,3.6vw,52px)}
.experience-copy .eyebrow{font-size:20px}
.experience-copy p:not(.eyebrow){font-size:18px;line-height:2}
.philosophy{height:220svh}
.philosophy-sticky{min-height:990px}
.philosophy-copy{width:60%;max-width:820px;transform:translateY(calc(120px - var(--philosophy-progress,0)*360px));padding-top:80px}
.philosophy-copy .eyebrow{font-size:25px}
.philosophy-copy h2{font-size:clamp(38px,3.5vw,52px)}
.philosophy-copy p:not(.eyebrow){font-size:18px;line-height:2}
.philosophy-photo{animation:photoFloat 8s ease-in-out infinite alternate}
.philosophy-photo.portrait{animation-duration:10s;animation-delay:-3s}
.philosophy-photo.shop{animation-delay:-5s}
@keyframes photoFloat{from{transform:translateY(-16px) rotate(-2deg)}to{transform:translateY(16px) rotate(2deg)}}
.teaser-copy p:not(.eyebrow){font-size:18px;line-height:2}
.teaser-copy .text-link{font-size:21px}
.teaser-sticker{text-align:center;display:flex;align-items:center;justify-content:center;line-height:1.55}
.services-overview{padding:90px 0 75px}
.services-heading{position:relative;text-align:center;max-width:none;margin-bottom:40px}
.services-heading .eyebrow{justify-content:center}
.services-heading .section-title br{display:none}
.services-heading p:last-child{font-size:18px}
.service-bubbles{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;max-width:840px;margin:auto;min-height:0;padding:15px 0 25px}
.service-bubble{position:relative;inset:auto!important;width:360px;height:330px;max-width:100%;justify-self:center;transition:scale .35s,box-shadow .35s;transform:translate3d(var(--bubble-x,0px),var(--bubble-y,0px),0)}
.service-bubble.bubble-workspace{grid-column:2/4}
.service-bubble.bubble-ai{grid-column:1/3;grid-row:2}
.service-bubble.bubble-web{grid-column:3/5;grid-row:2}
.service-bubble:hover,.service-bubble:focus-visible{scale:1.065;transform:translate3d(var(--bubble-x,0px),var(--bubble-y,0px),0);box-shadow:0 12px 0 #ddb100}
.js-ready .service-bubble.reveal.is-visible{transform:translate3d(var(--bubble-x,0px),var(--bubble-y,0px),0)}
.service-bubble h3{font-size:25px}.service-bubble p{font-size:15px}.service-bubble .bubble-number{font-size:16px;top:14px}.service-bubble img{width:74px;height:74px;margin:6px 0 8px}.bubble-arrow{margin-top:8px}
.service-detail{grid-template-columns:1fr 1fr;gap:4%;padding-block:90px;min-height:820px}
.service-detail .eyebrow{font-size:19px;line-height:1.6;gap:12px;margin-bottom:25px}
.service-no{font-size:40px;margin:0}
.service-copy .section-title{font-size:clamp(36px,3.6vw,52px)}
.service-copy .service-lead{font-size:25px}
.service-copy p:not(.eyebrow):not(.service-lead){font-size:18px;line-height:2;margin-top:24px}
.feature-list{font-size:17px;line-height:2.15;margin:26px 0 30px}
.service-copy .text-link{font-size:20px}
.service-visual{height:620px;padding-top:65px}
.device-scene{top:60px;height:calc(100% - 80px)}
.device-message{position:absolute;top:0;left:0;right:0;text-align:center;font-family:var(--heading);font-weight:900;font-size:clamp(23px,2.25vw,33px);line-height:1.5;z-index:2}
.screen-caption{font-size:12px;bottom:0}
.device-halo{width:440px;height:440px;max-width:94%;top:54%}
.column-section{background:#fff0dc;padding-block:95px 85px;overflow:hidden;margin:0}
.column-section .section-heading{max-width:1200px;margin-inline:auto}
.article-carousel{overflow:hidden;touch-action:pan-y;outline-offset:6px;--article-gap:30px;--article-width:calc((100% - 60px)/3)}
.article-track{display:flex;gap:var(--article-gap);will-change:transform}
.article-track .article-card{flex:0 0 var(--article-width);min-width:0;display:block}
.article-track .article-card h3{font-size:19px;line-height:1.8}
.article-meta{font-size:13px}.article-out{font-size:14px}
.article-intro{display:flex;align-items:center;gap:18px;background:var(--yellow);aspect-ratio:800/419;padding:20px;overflow:hidden}
.article-intro>img{width:40%;height:100%;aspect-ratio:auto;object-fit:cover;border-radius:80px 80px 8px 8px;object-position:50% 30%}
.article-intro>div{font-family:var(--heading);line-height:1.4}.article-intro small{font-size:12px;font-weight:700}.article-intro strong{font-size:32px;font-weight:900;display:block;margin-top:9px}
.carousel-controls{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:32px;font-size:13px;color:var(--muted)}
.carousel-controls>div{display:flex;gap:12px}
.carousel-controls button{width:52px;height:52px;border:1px solid var(--ink);border-radius:50%;background:transparent;font-size:24px;color:var(--ink)}
.carousel-controls button:hover{background:var(--ink);color:var(--paper)}
.faq-section{padding-top:105px}
.faq-list summary{font-size:18px}.faq-list details>p{font-size:17px;line-height:2}
.faq-heading .eyebrow{font-size:21px}
.faq-spark{transform-origin:50% 80%;animation:none}
.faq-spark.is-bouncing{animation:faqBoing 1s cubic-bezier(.2,.7,.3,1) both}
@keyframes faqBoing{0%{transform:translateY(0) rotate(-15deg) scale(1)}18%{transform:translateY(12px) rotate(-15deg) scale(1.12,.75)}45%{transform:translateY(-38px) rotate(10deg) scale(.9,1.15)}72%{transform:translateY(0) rotate(-20deg) scale(1.12,.88)}100%{transform:translateY(0) rotate(-15deg) scale(1)}}
.contact-note{font-size:14px}.footer-links,.footer-company,.footer-brand>p{font-size:15px}
.work-categories{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:55px 0}
.work-category{scroll-margin-top:140px;padding:35px 28px;border:1px solid var(--line);border-radius:24px;background:#fff}
.work-category:target{border:2px solid var(--orange)}.work-category h2{font-size:25px}.work-category p{font-size:16px;line-height:1.9;margin-top:20px}.work-category .text-link{font-size:16px;margin-top:22px;gap:12px}
@media(max-width:1100px){.header-nav{font-size:14px;gap:18px}.site-header .brand-word{font-size:64px}.hero-small{font-size:42px}.hero-wow{font-size:64px;max-width:500px}.wow-first,.wow-second{display:block}.hero-under{max-width:490px}.service-detail{gap:3%}.service-detail .eyebrow{font-size:17px}.service-visual{height:550px}.service-copy .section-title{font-size:37px}.feature-list{font-size:16px}.service-copy p:not(.eyebrow):not(.service-lead){font-size:17px}.device-message{font-size:26px}.article-track .article-card h3{font-size:17px}.article-intro strong{font-size:26px}.work-categories{grid-template-columns:1fr}}
@media(max-width:800px){:root{--header:96px}.site-header{height:var(--header)}.site-header .brand-word{font-size:60px}.eyebrow{font-size:19px}.hero{min-height:930px}.hero-main{padding-top:160px;align-self:flex-start;margin-top:0}.hero-small{font-size:36px}.hero-wow{font-size:61px}.hero-under p{font-size:17px}.hero-under .button{font-size:17px}.service-bubble{width:290px;height:290px}.service-bubble h3{font-size:22px}.service-bubble p{font-size:13px}.philosophy-copy{width:66%}.philosophy-copy h2{font-size:36px}.philosophy-copy p:not(.eyebrow){font-size:17px}.philosophy-photo.city{left:-24%}.philosophy-photo.portrait{right:-19%}.services-heading p:last-child{font-size:17px}.service-detail .eyebrow{font-size:16px}.service-copy .service-lead{font-size:22px}.article-carousel{--article-width:calc((100% - 26px)/2);--article-gap:26px}.footer-links{font-size:14px}}
@media(max-width:600px){
 html{scroll-padding-top:110px}body{font-size:17px}.site-header .brand-word{font-size:58px}.site-header{padding-inline:7%}.eyebrow{font-size:18px}.button,.text-link{font-size:17px}
 .hero{height:1080px;min-height:1080px;max-height:none;display:block}.hero-main{width:86%;margin:auto;padding:142px 0 0;z-index:5}.hero h1{max-width:100%}.hero-kicker{font-size:13px;letter-spacing:.01em;margin-bottom:18px}.hero-small{font-size:29px}.hero-wow{font-size:57px;max-width:350px;line-height:1.3;margin-top:9px}.wow-first,.wow-second{display:block}.wow-second{font-size:.9em;white-space:nowrap}.hero-under{margin:22px 0 0}.hero-under p{font-size:16px;line-height:1.9}.hero-under .button{margin-top:28px;min-width:0;font-size:16px;position:absolute;top:850px;left:0;right:0}.hero-bottom{bottom:30px;font-size:12px;left:7%;right:7%}.hero-ribbon{width:240%;left:-70%;opacity:.6}
 .hero-scene-track #hero-scene{height:calc(100svh - var(--header));min-height:620px}.hero-scene-track .orbit-fallback{margin-left:30%;width:40%;top:440px;height:350px}
 .experience{height:260svh}.experience-sticky{height:calc(100svh - var(--header));min-height:700px;top:var(--header)}
 .experience-heading{top:25px;left:7%;right:7%;max-width:none}.experience-heading h2{font-size:31px;line-height:1.5}.experience-heading h2 br{display:block}.experience-copy{top:auto;bottom:25px;left:7%;width:86%;transform:translateY(calc((1 - var(--copy-progress,0))*20px))}.experience-copy h2{font-size:30px;margin-bottom:16px}.experience-copy .eyebrow{font-size:16px}.experience-copy p:not(.eyebrow){font-size:16px;line-height:1.9}.experience-copy p+p{margin-top:14px}
 .philosophy{height:215svh}.philosophy-sticky{min-height:1020px}.philosophy-copy{width:86%;padding-top:60px;transform:translateY(calc(80px - var(--philosophy-progress,0)*190px))}.philosophy-copy .eyebrow{font-size:22px}.philosophy-copy h2{font-size:30px;line-height:1.7;margin-bottom:32px}.philosophy-copy p:not(.eyebrow){font-size:16px;line-height:2}.philosophy-photo.city{left:-31%;top:34%;width:39vw;height:39vw}.philosophy-photo.portrait{right:-25%;top:9%;width:42vw;height:42vw}.philosophy-photo.shop{display:none}
 .company-teaser{padding-block:85px;gap:45px}.teaser-copy p:not(.eyebrow){font-size:17px}.teaser-copy .text-link{font-size:19px}.teaser-sticker{font-size:22px;width:118px;height:118px}
 .services-overview{padding:65px 0}.services-heading .section-title{font-size:37px}.services-heading .section-title br{display:block}.services-heading p:last-child{font-size:16px}.service-bubbles{display:flex;gap:20px;padding:0}.service-bubble{width:100%;height:auto;min-height:210px;border-radius:25px;align-items:flex-start;padding:30px 22px 30px 96px;text-align:left}.service-bubble img{position:absolute;left:14px;top:50%;width:65px;height:65px;margin:0}.service-bubble .bubble-number{top:16px;left:24px;font-size:14px}.service-bubble h3{font-size:21px}.service-bubble p{font-size:13px;line-height:1.7}.service-bubble:hover{scale:1.025}
 .service-detail{padding:70px 0;min-height:0}.service-detail .eyebrow{font-size:17px;gap:12px;margin-bottom:20px}.service-no{font-size:34px}.service-copy .section-title{font-size:34px}.service-copy .service-lead{font-size:22px}.service-copy p:not(.eyebrow):not(.service-lead){font-size:17px;line-height:2}.service-copy .feature-list{font-size:16px;line-height:2}.service-copy .text-link{font-size:17px;gap:15px}.service-visual{height:420px;margin:30px 0 30px;padding-top:65px}.device-scene{top:42px;height:calc(100% - 60px)}.device-message{font-size:24px;line-height:1.6}.device-halo{width:300px;height:300px}.screen-caption{font-size:11px;bottom:0}
 .column-section{padding-block:70px}.column-section .section-heading{gap:18px;margin-bottom:30px}.column-section .section-heading .text-link{font-size:17px}.article-carousel{width:86%;--article-width:100%;--article-gap:22px}.article-track .article-card h3{font-size:19px}.article-meta{font-size:13px;flex-direction:row}.article-out{font-size:15px}.article-intro strong{font-size:32px}.carousel-controls{font-size:12px}.carousel-controls>span{max-width:160px}.carousel-controls button{width:48px;height:48px}
 .faq-section{padding:75px 0;gap:20px}.faq-heading{padding-bottom:95px}.faq-heading .eyebrow{font-size:18px}.faq-spark{display:grid;z-index:0;opacity:1;left:auto;right:12px;top:auto;bottom:15px;margin:0;width:80px;height:80px;font-size:58px}.faq-list summary{font-size:16px}.faq-list details>p{font-size:16px}.contact-banner .eyebrow{font-size:17px}.contact-note{font-size:12px;max-width:none}.footer-company,.footer-brand>p,.footer-links{font-size:14px}
 .work-category{padding:28px 23px}.work-category h2{font-size:24px}
}
@media(prefers-reduced-motion:reduce){.hero-ribbon path,.philosophy-photo,.faq-spark{animation:none!important}.opening-sequence .hero-scene-track{display:none}.hero h1{max-width:100%}.hero{height:auto;min-height:850px}.hero-under .button{position:static}.experience{height:auto}.experience-sticky{height:auto;min-height:600px;position:relative;top:0}.experience-heading{opacity:1;transform:none}.experience-copy{opacity:1;transform:none;top:200px;bottom:auto;left:7%;width:86%;max-width:none}.philosophy{height:auto}.philosophy-sticky{height:auto;min-height:1000px;position:relative}.philosophy-copy{transform:none;padding-block:100px}.article-track{will-change:auto}}

@media(min-width:601px) and (max-width:800px){.hero-under{max-width:55%}.hero-under .mobile-only{display:initial}}

/* Full company name: use the midpoint of the previous two type sizes. */
.site-header .brand,.footer-brand .brand{gap:0;white-space:nowrap;align-items:center}
.site-header .brand-word,.footer-brand .brand-word{font-size:49.5px;letter-spacing:-.045em}
.footer-address{display:block}
.footer-address>span{display:inline-block}
@media(max-width:1100px){.site-header .brand-word,.footer-brand .brand-word{font-size:41.5px}}
@media(max-width:950px){.header-nav{display:none}.menu-toggle{display:block}}
@media(max-width:800px){.site-header .brand-word,.footer-brand .brand-word{font-size:39.5px}}
@media(max-width:600px){.site-header .brand-word,.footer-brand .brand-word{font-size:29.5px}}

/* Matching static compositions remain visible if 3D cannot be loaded. */
.service-composition{position:absolute;inset:60px 0 20px;pointer-events:none}
.service-composition img{position:absolute;object-fit:contain;mix-blend-mode:multiply}
.workspace-composition .fallback-laptop{width:86%;height:85%;left:-5%;top:12%}
.workspace-composition .fallback-phone{width:45%;height:63%;right:-3%;top:28%}
.fallback-sync{position:absolute;left:31%;top:14%;width:43%;height:20%}
.website-composition .fallback-laptop{width:90%;height:90%;left:5%;top:1%}
.fallback-celebration{position:absolute;left:0;bottom:4%;width:100%;height:40%;overflow:visible}
@media(max-width:600px){.service-composition{top:42px;bottom:18px}}
@media(max-width:600px){#service-workspace .section-title{font-size:32px;letter-spacing:0}#service-workspace .eyebrow{font-size:16px;gap:8px}}
