@import url("/contact-agent.css");
/* DYD theme: cream paper, ink, one terracotta accent. Loaded last; the hero defines the system. */
:root{--paper:#f7f4ed;--paper-deep:#efe9dc;--ink:#30352d;--ink-soft:#5d6753;--rule:#cfc7b3;--clay:#b83d27;--clay-deep:#9a3120;--clay-soft:#e7b29d;--mustard:#e0b847;--sage:#a9bb9e;--night:#2c3329;
--grain:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%238a7c61' opacity='.09' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E");
--sc-canvas:var(--paper);--sc-ink:var(--ink);--sc-ink-soft:var(--ink-soft);--sc-accent:var(--clay)}
body{background:var(--paper);color:var(--ink)}
.site-header,.site-header nav{background:var(--paper)}.nav-cta{background:var(--ink);color:var(--paper)}.red-dot{background:var(--clay)}
.v-intro,.v-showcase,.v-services,.v-experience{background-color:var(--paper);background-image:var(--grain);color:var(--ink)}
.v-intro h2 span,.v-services h2 span,.v-experience h2 span,.v-showcase h2 span{color:var(--clay)}
.v-eyebrow{color:var(--ink-soft)}
.v-link{color:var(--ink);border-color:var(--ink)}
.v-button{background:var(--clay);color:var(--paper)}
.v-capability-index a,.v-service-list a,.v-service-list{border-color:var(--rule)}
.v-service-list a p,.v-intro p,.v-services p,.v-experience p{color:var(--ink-soft)}
.experience-marker{color:var(--clay)}
.ai-sculpture{background:var(--mustard);color:var(--ink)}
.v-intelligence,.v-intelligence-hero{background:var(--night);color:var(--paper)}
.v-intelligence h2 span,.v-intelligence-hero h1 span{color:var(--clay-soft)}.v-intelligence-heading>p{color:#d4d6c6}
.v-product-stage{background:#d9cdb4}.agent-window{box-shadow:0 20px 45px #1c20154d}
.v-intelligence .v-button,.v-intelligence-hero .v-button{background:var(--mustard);color:var(--ink)}
.v-close{background:var(--clay);color:var(--paper)}.v-close h2 span{color:#f6d3c2}.v-round-link{border-color:#e9a995}.v-round-link span{background:var(--paper);color:var(--clay)}
@media(hover:hover)and(pointer:fine){.v-button:hover{background:var(--clay-deep);color:var(--paper)}.v-intelligence .v-button:hover,.v-intelligence-hero .v-button:hover{background:#ecc765;color:var(--ink)}.v-link:hover,.v-capability-index a:hover,.v-service-list a:hover{color:var(--clay)}}
.v-intelligence .v-eyebrow,.v-intelligence-hero .v-eyebrow,.v-close .v-eyebrow{color:inherit;opacity:.85}
footer,.channels-section,.capability-section,.platform-steps{background:var(--night)}

/* Preserve the complete service sculpture, including its pedestal, at every size. */
.supporting-visual.service-sculpture{aspect-ratio:3/2;background:#eee7dc}
.supporting-visual.service-sculpture>img{width:100%;height:100%;object-fit:contain;transform:none;display:block}

/* Keep navigation available across the site. */
.site-header{position:sticky;top:0;z-index:100;box-shadow:0 1px 0 #30352d18}html{scroll-padding-top:110px}@media(max-width:849px){html{scroll-padding-top:95px}.site-header.menu-open nav{max-height:calc(100dvh - 85px);overflow-y:auto;overscroll-behavior:contain}}

/* The story fills the viewport below the persistent navigation. */
:root{--site-header-height:100px;--story-viewport:calc(100svh - var(--site-header-height))}.story-stage{height:var(--story-viewport)}.is-live .story-stage{top:var(--site-header-height)}.story-track.is-live{height:calc(var(--story-viewport)*4.6)}@media(max-width:849px){:root{--site-header-height:85px}.story-track.is-live{height:calc(var(--story-viewport)*4.2)}.story-art{height:calc(var(--story-viewport)*.55);bottom:88px}.story-copy,.story-final{top:5%}.story-copy h1{font-size:clamp(36px,9.5vw,60px)}.story-final h2{font-size:clamp(36px,9.5vw,60px)}.story-copy p,.story-final p{margin-top:12px}.story-kicker{margin-bottom:16px}.story-final .story-cta{margin-top:10px}}@media (max-width:849px) and (max-height:740px){.story-art{height:calc(var(--story-viewport)*.48)}.story-copy,.story-final{top:20px}.story-copy h1,.story-final h2{font-size:32px}.story-kicker{margin-bottom:12px}.story-copy p,.story-final p{font-size:11px}}@media(prefers-reduced-motion:reduce){.story-track.is-live{height:var(--story-viewport)}.story-track.is-live .story-stage{top:0}}

/* Official brand artwork retains its original proportions and transparent background. */
.site-header .wordmark.official-logo{display:flex;align-items:center;flex:0 0 auto;width:220px;margin-right:auto;line-height:1}
.official-logo img{display:block;width:100%;height:auto;object-fit:contain}
footer .wordmark.official-logo{display:block;width:min(260px,100%);margin-bottom:24px;line-height:1}
@media(max-width:1100px) and (min-width:850px){.site-header .wordmark.official-logo{width:180px}.site-header nav{gap:18px}}
@media(max-width:849px){.site-header .wordmark.official-logo{width:200px;max-width:calc(100% - 100px)}}
@media(max-width:360px){.site-header .wordmark.official-logo{width:180px}}
/* inner pages: same paper, same accent */
.page-title,.content-spread,.contact-layout,.detail-hero,.insights-empty,.related-section,.v-platform-story{background-color:var(--paper);background-image:var(--grain);color:var(--ink)}
.overview-list,.work-section,.content-spread:nth-of-type(even){background-color:var(--paper-deep);background-image:var(--grain)}
.process-section,.physical-section{background:#e9e0cd}
.about-statement,.cta-banner,.convergence{background:var(--clay);color:var(--paper)}
.v-cms{background:var(--mustard);color:var(--ink)}
.dark-button{background:var(--ink);color:var(--paper)}.dark-button:hover{background:var(--clay-deep);color:var(--paper)}
.cta-banner .dark-button:hover{background:var(--paper);color:var(--clay-deep)}
main h1,main h2,main h3{font-weight:500}.page-title h1,.detail-hero h1{letter-spacing:-.055em}
.page-title h1 em,.detail-hero h1 em,.page-title h1 span,.detail-hero h1 span{color:var(--clay);font-style:normal}
.breadcrumb,.breadcrumb a{color:var(--ink-soft)}
.filters button[aria-pressed=true],.filters button.is-active{color:var(--clay)}
.supporting-visual{background:var(--paper-deep)}.supporting-visual>span{background:#30352dcc;color:var(--paper)}
.v-cms{background-color:var(--paper-deep);background-image:var(--grain);color:var(--ink)}.v-cms .v-button,.v-cms .dark-button{background:var(--ink);color:var(--paper)}.v-cms .v-eyebrow{color:var(--ink-soft)}
.v-platform-story h2 span,.v-platform-story h1 span,.v-cms h2 span{color:var(--clay)}
.work-featured{display:grid;grid-template-columns:1.05fr 1fr;gap:6%;align-items:center;padding:20px var(--gutter) 90px;background-color:var(--paper);background-image:var(--grain)}
.work-featured-art{position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--paper-deep)}.work-featured-art img{width:100%;height:100%;object-fit:cover;display:block}
.work-featured-art span{position:absolute;bottom:22px;left:24px;color:var(--paper);font-size:8px;letter-spacing:.1em;background:#30352dcc;padding:8px 11px}
.work-featured-copy h2{font-size:clamp(52px,6vw,96px);letter-spacing:-.06em;line-height:1;margin:22px 0 22px;color:var(--ink)}
.work-featured-copy p{font-size:15px;line-height:1.75;color:var(--ink-soft);max-width:46ch}
.work-facts{list-style:none;padding:0;margin:30px 0 8px;display:grid;grid-template-columns:repeat(3,auto);gap:0 34px;justify-content:start}
.work-facts li{display:flex;flex-direction:column;gap:6px;border-top:1px solid var(--rule);padding-top:14px}.work-facts strong{font-size:clamp(28px,3vw,44px);font-weight:500;letter-spacing:-.04em;color:var(--clay)}.work-facts span{font-size:11px;color:var(--ink-soft);max-width:15ch}
.work-featured-links{display:flex;flex-wrap:wrap;gap:6px 36px;margin-top:20px}.work-source{font-size:10px!important;margin-top:18px;color:var(--ink-soft)}
@media(max-width:849px){.work-featured{grid-template-columns:1fr;gap:30px;padding-bottom:60px}.work-facts{grid-template-columns:1fr 1fr 1fr;gap:0 16px}}
.work-featured-art img{object-fit:contain;background:#eee7dc}

/* ===== Tidy pass: one type floor, one button size, one spacing scale ===== */
:root{--sec-y:clamp(48px,5.6vw,76px);--btn-h:48px;--btn-font:13px;--label:11px}
/* Labels and captions: never below 11px */
body .kicker,body .v-eyebrow,body .story-kicker,body .fw-overline,body .fw-scene-label,body .fw-small-note,body .fw-art-note,body .demo-label,body .breadcrumb,body .breadcrumb a,body .fw-experience-foot span,body .fw-intelligence-foot span,body .agent-status,body .story-note,body .story-label{font-size:var(--label);letter-spacing:.09em;line-height:1.4}
body .story-navigation button,body .story-navigation>a,body .agent-prompts button,body .agent-bottom,body .agent-profile,body .agent-active,body .agent-input{font-size:11px}
body .agent-bottom,body .demo-label{font-size:10.5px}
body .footer-bottom,body .footer-bottom span,body .footer-bottom a{font-size:12px}
body .site-footer-grid h3{font-size:12px;letter-spacing:.09em}.site-footer-grid a{font-size:13px;line-height:1.5}.site-footer-grid p{font-size:13px;line-height:1.65}
figcaption,.client-tags,.work-source,.portfolio-open,.portfolio-project-tags{font-size:12px}
body .client-name{font-size:clamp(17px,1.4vw,20px)}
/* Buttons: one height, one font size, one padding */
body .v-button,body .dark-button,body .story-cta.is-button{min-height:var(--btn-h);padding:0 20px;font-size:var(--btn-font);gap:24px;align-items:center}
body .nav-cta{min-height:44px;padding:0 18px;font-size:var(--btn-font);display:inline-flex;align-items:center;gap:14px}
body .v-button>span,body .dark-button>span{font-size:18px;line-height:1}
body .text-link,body .v-link,body .story-cta,body .fw-link,body .portfolio-open,body .video-facade{font-size:var(--btn-font)}
body .text-link,body .v-link,body .story-cta{padding-block:12px;min-height:44px;display:inline-flex;align-items:center;justify-content:space-between;gap:24px}
body .v-link>span,body .text-link>span,body .story-cta>span{font-size:18px;line-height:1}
body .v-round-link{padding-block:14px;font-size:var(--btn-font)}.v-round-link span{width:48px;height:48px;font-size:22px}
body .form button[type=submit],body .contact-layout button[type=submit]{min-height:var(--btn-h);font-size:var(--btn-font);padding:0 20px}
body .menu-toggle{font-size:12px}
/* Headings: tighter scale */
body .page-title h1,body .detail-hero h1,body .portfolio-title h1,body .portfolio-project-title h1{font-size:clamp(42px,5.2vw,76px);line-height:1.04;letter-spacing:-.05em}
body .v-close h2{font-size:clamp(44px,6vw,92px);line-height:1}
body .about-statement h2,body .cta-banner h2,body .convergence h2{font-size:clamp(34px,4vw,58px);line-height:1.06;letter-spacing:-.045em}
body .content-spread h2,body .capability-section h2,body .related-section h2,body .partner-section h2,body .work-section h2{font-size:clamp(30px,3.2vw,46px);line-height:1.1;letter-spacing:-.04em}
body .page-title>p,body .detail-hero p{font-size:clamp(15px,1.15vw,17px);line-height:1.65;max-width:52ch}
body .content-spread p,body .capability-section p,body .related-section p{font-size:15px;line-height:1.7}
/* Spacing: one vertical rhythm for every section */
body .page-title{padding-block:calc(var(--sec-y) + 12px) var(--sec-y)}.portfolio-title{padding-bottom:36px}.portfolio-project-title{padding-bottom:36px}
body .detail-hero{padding-block:48px var(--sec-y)}
body .content-spread,body .about-statement,body .cta-banner,body .capability-section,body .related-section,body .insights-empty,body .portfolio-connections,body .partner-section,body .work-section,body .experience-section{padding-block:var(--sec-y)}
body .process-section,body .physical-section{padding-block:calc(var(--sec-y) - 12px)}
body .contact-layout{padding-block:calc(var(--sec-y) + 8px) calc(var(--sec-y) + 16px)}
body .v-intro,body .v-showcase,body .v-services,body .v-experience,body .v-close,body .v-cms,body .v-platform-story,body .v-intelligence{padding-block:calc(var(--sec-y) + 8px)}
body .v-intelligence-hero{padding-top:48px}
body .portfolio-section{padding-bottom:var(--sec-y)}.client-projects,.portfolio-extra{padding-bottom:var(--sec-y)}
body .client-logo{margin-bottom:24px;height:56px}
body .cta-banner{gap:5%}
footer{padding-top:var(--sec-y)}.footer-bottom{padding-block:20px}
@media(max-width:849px){:root{--sec-y:44px}
 body .page-title h1,body .detail-hero h1,body .portfolio-title h1,body .portfolio-project-title h1{font-size:clamp(36px,10.5vw,52px)}
 body .v-close h2{font-size:clamp(38px,11vw,60px)}.about-statement h2,.cta-banner h2{font-size:clamp(30px,8.4vw,42px)}
 body .content-spread h2,body .capability-section h2,body .related-section h2{font-size:clamp(26px,7.4vw,34px)}
 body .page-title{padding-block:40px 36px}.detail-hero{padding-block:28px 40px}
 body .site-footer-grid a{font-size:14px;padding-block:3px}}
body .site-header .nav-cta{padding:0 18px;min-height:44px}
body .site-header nav>a,body .site-header nav summary{font-size:13px}
body .client-open{display:block;font-size:20px;line-height:1;text-align:right;padding-top:14px;color:var(--ink)}

/* Story bar: full-bleed, content stays on the page gutter */
body .story-navigation{left:0;right:0;width:100%;padding-left:var(--gutter,72px);padding-right:var(--gutter,72px);box-sizing:border-box}

/* Hero: keep the type in proportion on short desktop windows */
@media(min-width:850px){body .story-copy h1{font-size:clamp(40px,min(6.3vw,11vh),100px)}body .story-final h2{font-size:clamp(36px,min(5.6vw,9.5vh),87px)}}
@media(min-width:850px) and (max-height:760px){body .story-copy{top:9%}body .story-copy p{margin-top:14px}body .story-copy .story-cta{margin-top:14px}body .story-final{top:10%}}
body .story-navigation button{justify-content:space-between}
