/* Corporate refinement: inherited navy, paper, blue and locally hosted type. */
.corporate-ui { --studio-accent:#345e79; --studio-surface:#e8eff3; --studio-ease:cubic-bezier(.16,1,.3,1); background:#fafbfc; }
.corporate-ui :is(h1,h2,h3,em) { letter-spacing:-.035em; text-wrap:balance; }
.corporate-ui :is(a,button,summary):focus-visible { outline:3px solid #427ba1; outline-offset:6px; }
.corporate-ui .header { position:sticky; top:0; width:100%; max-width:none; height:100px; padding-inline:max(5%,calc((100vw - 1320px)/2)); background:#fafbfcef; backdrop-filter:blur(16px); border-bottom:1px solid #d9e0e680; z-index:30; }
.corporate-ui .brand { width:154px; flex-shrink:0; }
.corporate-ui .brand img { width:144px; }
.corporate-ui .navigation { gap:25px; font-size:13px; }
.corporate-ui .navigation a { padding-block:12px; }
.corporate-ui .navigation a:after { bottom:7px; }
.corporate-ui .header-contact { color:white; background:var(--navy); border-color:var(--navy); padding:9px 20px; }
.corporate-ui .header-contact:hover { background:var(--studio-accent); border-color:var(--studio-accent); }
.corporate-ui .button { border-radius:30px; }
.corporate-ui .page-hero h1 { font-size:clamp(3rem,6vw,6rem); }
.corporate-ui .site-footer { border-radius:28px 28px 0 0; margin-top:36px; }
.corporate-ui .footer-top { gap:40px; }
.corporate-ui .footer-top a { text-underline-offset:5px; }
.corporate-ui .footer-top a:hover { text-decoration:underline; }
.corporate-ui .site-footer .footer-email { overflow-wrap:anywhere; }
.studio-wrap { width:min(1320px,90%); margin-inline:auto; }
.page-home svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
.studio-hero { display:grid; grid-template-columns:1.05fr 1fr; gap:5%; padding-block:46px 40px; align-items:center; }
.studio-hero h1 { font-size:clamp(64px,6.7vw,96px); line-height:1.02; margin:0 0 26px; font-weight:500; letter-spacing:-.04em; }
.studio-hero h1 em { color:var(--studio-accent); font-size:1.13em; line-height:.98; }
.studio-hero-copy > p { max-width:430px; color:var(--muted); font-size:16px; line-height:1.75; margin-bottom:26px; }
.studio-actions { display:flex; gap:22px; align-items:center; flex-wrap:wrap; }
.studio-button { display:inline-flex; align-items:center; justify-content:space-between; gap:28px; min-height:54px; padding:14px 23px; border-radius:30px; background:var(--navy); color:white; font-size:14px; font-weight:600; transition:background .25s; }
.studio-button:hover { background:var(--studio-accent); }
.studio-button svg,.studio-text-link svg { transition:transform .4s var(--studio-ease); }
.studio-button:hover svg,.studio-text-link:hover svg { transform:translate(3px,-3px); }
.studio-text-link { display:inline-flex; align-items:center; gap:14px; min-height:44px; font-size:13px; font-weight:600; text-underline-offset:6px; }
.studio-text-link:hover { text-decoration:underline; }
.studio-hero-copy .studio-hero-note { font-size:12px; margin:35px 0 0; line-height:1.7; }
.studio-art { align-self:stretch; position:relative; min-height:548px; border-radius:16px; isolation:isolate; overflow:hidden; background:#091c31; color:white; }
.studio-art > img { position:absolute; width:155%; max-width:none; height:100%; left:-45%; top:0; object-fit:cover; object-position:62% center; transform:translate(var(--art-x,0px),var(--art-y,0px)) scale(1.025); transition:transform .9s var(--studio-ease); z-index:-1; }
.studio-art-top { display:flex; justify-content:space-between; gap:16px; padding:26px 28px; font-size:11px; color:#c8d8e4; }
.studio-art-caption { position:absolute; inset:auto 28px 25px; display:flex; align-items:end; justify-content:space-between; padding-top:20px; border-top:1px solid #6d849580; }
.studio-art-caption > span:first-child { font-size:22px; line-height:1.15; }
.studio-art-caption em { font-size:30px; color:var(--blue); }
.studio-arrow-circle { width:46px; height:46px; border:1px solid #94acbd; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:background .3s,color .3s; }
a:hover > .studio-arrow-circle,.studio-arrow-circle:hover { color:var(--navy); background:var(--blue); }
.studio-paths { display:grid; grid-template-columns:1fr 1fr; border-block:1px solid var(--line); }
.studio-paths > a { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:26px 0; }
.studio-paths > a:first-child { padding-right:8%; border-right:1px solid var(--line); }
.studio-paths > a:last-child { padding-left:8%; }
.studio-paths strong { display:block; font-weight:500; font-size:20px; margin-bottom:3px; letter-spacing:-.025em; }
.studio-paths a > span > span { display:block; color:var(--muted); font-size:13px; }
.studio-paths a:hover strong { color:var(--studio-accent); }
.studio-paths a > svg { transition:transform .35s var(--studio-ease); }
.studio-paths a:hover > svg { transform:translateX(6px); }
.studio-services { display:grid; grid-template-columns:1fr 1.2fr; gap:10%; padding-block:110px; }
.page-home main h2 { font-size:clamp(36px,4.1vw,60px); line-height:1.08; font-weight:500; margin-bottom:28px; }
.page-home main h2 em { color:var(--studio-accent); font-size:1.08em; }
.studio-services-intro p { max-width:360px; color:var(--muted); }
.studio-services-intro > a { margin-top:16px; }
.studio-service { border-top:1px solid var(--line); }
.studio-service:last-child { border-bottom:1px solid var(--line); }
.studio-service summary { list-style:none; display:flex; align-items:center; gap:18px; padding:26px 0; cursor:pointer; }
.studio-service summary::-webkit-details-marker { display:none; }
.studio-service summary h3 { margin:0; font-size:clamp(20px,1.9vw,27px); font-weight:500; line-height:1.3; }
.studio-service summary > svg { color:var(--studio-accent); }
.studio-service summary .service-plus { margin-left:auto; width:18px; }
.studio-service[open] .service-plus path:last-child { display:none; }
.studio-service[open] summary { color:var(--studio-accent); }
.studio-service-body { padding:0 0 28px 40px; }
.studio-service-body p { color:var(--muted); font-size:15px; max-width:510px; margin-bottom:18px; }
.studio-service-tags { display:flex; gap:7px 18px; flex-wrap:wrap; margin-bottom:15px; color:var(--studio-accent); font-size:12px; }
.studio-local { display:grid; grid-template-columns:1fr 1.2fr; gap:7%; background:var(--studio-surface); border-radius:16px; padding:60px; align-items:center; margin-bottom:100px; }
.studio-local-brand { display:block; font-size:22px; margin-bottom:30px; font-weight:600; }
.studio-local-brand em { font-size:30px; font-weight:400; }
.studio-local-copy p { color:var(--muted); font-size:15px; max-width:390px; }
.studio-local-copy ul { list-style:none; padding:0; margin:22px 0 28px; font-size:13px; }
.studio-local-copy li { padding-block:7px; border-bottom:1px solid #c8d5df; }
.studio-local-copy li::before { content:''; display:inline-block; width:5px; height:5px; border-radius:50%; background:var(--studio-accent); margin-right:11px; vertical-align:middle; }
.studio-local-visual { min-width:0; }
.studio-browser { border-radius:10px; overflow:hidden; background:white; box-shadow:0 18px 45px -20px #253e5860; transform:perspective(1200px) rotateY(-5deg); }
.studio-browser-bar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 16px; font-size:10px; color:#526273; }
.studio-browser-bar > span:first-child { display:flex; gap:4px; }
.studio-browser-bar i { width:5px; height:5px; background:#afb9bf; border-radius:50%; }
.studio-browser img { width:100%; height:auto; }
.studio-local-visual > p { margin:22px 0 0; color:var(--muted); font-size:12px; }
.studio-local-visual > small { display:block; font-size:11px; color:var(--muted); }
.studio-work { background:var(--navy); color:white; padding-block:86px; }
.studio-section-top { display:flex; justify-content:space-between; align-items:end; gap:40px; margin-bottom:42px; }
.studio-section-top h2 { margin:0; }
.studio-work .studio-section-top h2 em { color:var(--blue); }
.studio-section-top p { font-size:14px; color:#b9ccdb; margin:0; max-width:350px; }
.studio-work-gallery { display:flex; gap:30px; }
.studio-work-panel { min-width:0; flex:1; transition:flex .7s var(--studio-ease); }
.studio-work-twx { flex:1.3; }
.studio-work-image { display:flex; flex-direction:column; height:385px; padding:36px; position:relative; overflow:hidden; border-radius:12px; }
.studio-work-twx .studio-work-image { background:#e4ebdd; color:#163c2d; }
.studio-twx-mark { width:58px; height:58px; margin-bottom:22px; }
.studio-work-twx .studio-work-image > span { font-family:var(--serif); font-size:34px; line-height:1.1; position:relative; z-index:1; }
.studio-twx-screen { position:absolute; width:88%; max-width:none; top:195px; right:-4%; transform:rotate(-7deg); border-radius:6px; box-shadow:0 16px 35px -16px #1b473b55; transition:transform .7s var(--studio-ease); }
.studio-work-twx a:hover .studio-twx-screen { transform:rotate(-3deg) translateY(-8px); }
.studio-work-ctx .studio-work-image { background:#1a354c; color:#d6e8f4; justify-content:center; }
.studio-ctx-word { font-size:clamp(54px,6.7vw,90px); line-height:1.1; letter-spacing:-.04em; font-weight:500; }
.studio-ctx-word > span { color:#86bde0; }
.studio-ctx-word > i { font-style:normal; color:#86bde0; }
.studio-ctx-line { font-size:17px; color:#b9ccdb; margin-top:15px; }
.studio-ctx-flow { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:48px; padding-top:20px; border-top:1px solid #4c687c; font-size:11px; }
.studio-ctx-flow svg { width:17px; }
.studio-work-caption { display:flex; justify-content:space-between; align-items:center; gap:16px; padding-block:23px 32px; }
.studio-work-caption h3 { font-size:24px; font-weight:500; margin:0 0 6px; }
.studio-work-caption p { color:#b9ccdb; font-size:12px; margin:0; }
.studio-work > .studio-wrap > .studio-text-link { color:var(--blue); }
.studio-founder { display:grid; grid-template-columns:.75fr 1.25fr; gap:12%; align-items:center; padding-block:110px; }
.studio-founder figure { margin:0; }
.studio-founder figure > img { width:100%; aspect-ratio:4/4.5; object-fit:cover; object-position:center 26%; border-radius:12px; }
.studio-founder figcaption { padding-block:17px; font-size:16px; font-weight:600; }
.studio-founder figcaption span { display:block; font-size:12px; font-weight:400; color:var(--muted); margin-top:3px; }
.studio-founder > div > p { color:var(--muted); max-width:570px; }
.studio-founder .studio-lead { font-size:19px; }
.studio-founder-method { border-top:1px solid var(--line); padding-top:24px; margin-top:35px; }
.studio-founder-method > span { display:block; font-size:13px; color:var(--muted); }
.studio-founder-method > a { display:inline-flex; align-items:center; gap:16px; min-height:44px; font-size:13px; font-weight:600; }
.studio-close { border-top:1px solid var(--line); padding-block:60px 80px; display:flex; justify-content:space-between; align-items:center; gap:50px; }
.studio-close h2 { font-size:clamp(42px,5.8vw,82px); margin-bottom:26px; }
.studio-close p { color:var(--muted); font-size:14px; margin:0; }
.studio-close-link { width:140px; height:140px; border-radius:50%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; background:var(--blue); flex-shrink:0; transition:background .35s,color .35s; }
.studio-close-link svg { width:43px; height:43px; }
.studio-close-link span { font-size:14px; }
.studio-close-link:hover { background:var(--navy); color:white; }
@media (hover:hover) and (min-width:1000px) {
  .studio-work-gallery:has(.studio-work-ctx:hover,.studio-work-ctx:focus-within) .studio-work-ctx { flex:1.3; }
  .studio-work-gallery:has(.studio-work-ctx:hover,.studio-work-ctx:focus-within) .studio-work-twx { flex:1; }
}
@media (prefers-reduced-motion:no-preference) {
  .studio-art > img { animation:studio-art-arrive 1.3s var(--studio-ease); }
  @keyframes studio-art-arrive { from { clip-path:inset(0 0 0 8%); scale:1.06; } to { clip-path:inset(0); scale:1; } }
}
@media (max-width:1100px) {
  .corporate-ui .header { gap:22px; } .corporate-ui .navigation { gap:18px; font-size:12px; }
  .studio-art { min-height:520px; } .studio-hero h1 { font-size:72px; } .studio-actions { gap:12px; }
  .studio-local { padding:42px; gap:5%; } .studio-work-image { padding:28px; } .studio-services { gap:6%; }
}
@media (max-width:850px) {
  .corporate-ui .header { height:86px; padding-inline:5%; gap:18px; } .corporate-ui .header-contact { margin-left:auto; }
  .corporate-ui .navigation { top:85px; border-radius:0 0 16px 16px; } .corporate-ui .navigation a { padding:12px 6px; font-size:16px; }
  .studio-hero { gap:4%; padding-top:32px; } .studio-hero h1 { font-size:60px; } .studio-hero-copy > p { font-size:14px; }
  .studio-art { min-height:510px; } .studio-art-top { padding:24px 18px; flex-direction:column; gap:4px; }
  .studio-art-caption { inset:auto 20px 22px; } .studio-art-caption > span:first-child { font-size:18px; } .studio-art-caption em { font-size:25px; }
  .studio-paths strong { font-size:18px; } .studio-services { grid-template-columns:1fr; gap:38px; padding-block:70px; }
  .studio-services-intro { display:grid; grid-template-columns:1fr 1fr; gap:10px 40px; align-items:start; }
  .studio-services-intro h2 { grid-row:span 2; margin:0; } .studio-services-intro h2 br:last-of-type { display:none; } .studio-services-intro > a { margin:0; }
  .studio-local { grid-template-columns:1fr 1fr; padding:35px; } .studio-local-brand { margin-bottom:22px; } .studio-local h2 { font-size:38px; }
  .studio-local-visual > small { font-size:12px; } .studio-section-top { display:block; } .studio-section-top p { margin-top:25px; }
  .studio-work-gallery { gap:20px; } .studio-work-image { height:330px; padding:22px; } .studio-ctx-word { font-size:55px; }
  .studio-ctx-flow { flex-wrap:wrap; font-size:10px; } .studio-work-caption h3 { font-size:20px; }
  .studio-founder { gap:7%; grid-template-columns:.85fr 1.15fr; padding-block:75px; } .studio-founder .studio-lead { font-size:16px; }
  .studio-founder p { font-size:14px; } .studio-close-link { width:115px; height:115px; }
}
@media (max-width:600px) {
  .studio-wrap { width:90%; } .corporate-ui .header { height:78px; gap:12px; }
  .corporate-ui .brand,.corporate-ui .brand img { width:118px; } .corporate-ui .brand span { font-size:8px; }
  .corporate-ui .header-contact { padding:8px 14px; font-size:12px; gap:12px; } .corporate-ui .navigation { top:77px; }
  .studio-hero { grid-template-columns:1fr; gap:30px; padding-block:35px 28px; }
  .studio-hero h1 { font-size:clamp(57px,13vw,78px); line-height:1; margin-bottom:25px; }
  .studio-hero h1 br:nth-of-type(2) { display:none; } .studio-hero h1 em::before { content:' '; }
  .studio-hero-copy > p { font-size:15px; max-width:410px; } .studio-actions { gap:12px 18px; }
  .studio-button { padding:13px 20px; min-height:50px; font-size:13px; gap:25px; } .studio-hero-copy .studio-hero-note { display:none; }
  .studio-art { min-height:330px; } .studio-art > img { left:-21%; width:122%; object-position:right center; }
  .studio-art-top { padding:22px; flex-direction:row; } .studio-art-caption { inset:auto 22px 22px; }
  .studio-art-caption > span:first-child { font-size:18px; } .studio-art-caption em { font-size:25px; } .studio-arrow-circle { width:40px; height:40px; }
  .studio-paths { grid-template-columns:1fr; } .studio-paths > a:first-child { border-right:0; border-bottom:1px solid var(--line); padding:22px 0; }
  .studio-paths > a:last-child { padding:22px 0; } .studio-paths strong { font-size:19px; } .studio-paths a > span > span { font-size:12px; }
  .studio-services { padding-block:65px; gap:30px; } .studio-services-intro { display:block; } .page-home main h2 { font-size:39px; }
  .studio-services-intro h2 { margin-bottom:25px; } .studio-services-intro h2 br:last-of-type { display:initial; }
  .studio-services-intro p { font-size:15px; } .studio-services-intro > a { margin-top:2px; }
  .studio-service summary { padding:23px 0; gap:13px; } .studio-service summary h3 { font-size:20px; }
  .studio-service-body { padding-left:35px; } .studio-service-body p { font-size:14px; }
  .studio-local { grid-template-columns:1fr; padding:30px 24px; gap:35px; margin-bottom:65px; } .studio-local h2 { font-size:42px; }
  .studio-local-brand { font-size:19px; margin-bottom:25px; } .studio-local-brand em { font-size:26px; } .studio-local-copy p { font-size:14px; }
  .studio-browser { transform:none; } .studio-local-visual > small { font-size:11px; }
  .studio-work { padding-block:60px; } .studio-work h2 { font-size:38px; } .studio-section-top p { font-size:14px; }
  .studio-work-gallery { display:block; } .studio-work-panel + .studio-work-panel { margin-top:25px; }
  .studio-work-image { height:330px; padding:28px; } .studio-work-caption { padding-bottom:20px; }
  .studio-work-caption h3 { font-size:23px; } .studio-work-caption p { font-size:11px; } .studio-ctx-word { font-size:76px; }
  .studio-ctx-flow { font-size:11px; flex-wrap:nowrap; } .studio-founder { display:flex; flex-direction:column-reverse; gap:36px; padding-block:65px; }
  .studio-founder > div { width:100%; } .studio-founder h2 { font-size:40px; } .studio-founder figure { width:100%; max-width:370px; align-self:flex-start; }
  .studio-founder figure > img { aspect-ratio:1; } .studio-founder figcaption { padding-bottom:0; } .studio-founder-method { margin-top:24px; }
  .studio-close { padding-block:45px; gap:25px; flex-wrap:wrap; } .studio-close h2 { font-size:43px; }
  .studio-close-link { width:auto; height:54px; border-radius:30px; flex-direction:row-reverse; padding:12px 24px; gap:25px; }
  .studio-close-link svg { width:24px; height:24px; } .corporate-ui .site-footer { margin-top:20px; }
}
@media (max-width:360px) {
  .corporate-ui .header { gap:8px; } .corporate-ui .brand,.corporate-ui .brand img { width:105px; }
  .corporate-ui .header-contact { padding-inline:10px; } .studio-hero h1 { font-size:54px; } .studio-art { min-height:290px; }
  .studio-local { padding-inline:20px; } .studio-service summary h3 { font-size:18px; } .studio-work-image { padding:22px; }
  .studio-ctx-word { font-size:68px; } .studio-ctx-flow { gap:5px; font-size:10px; }
}
@media (prefers-reduced-motion:reduce) {
  .corporate-ui *, .corporate-ui *::before, .corporate-ui *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
  .studio-art > img { transform:scale(1.025); }
}

/* Choose a service before the decorative artwork, in reading and keyboard order. */
.studio-hero-copy .studio-paths{width:100%;grid-template-columns:1fr;margin:24px 0 12px}
.studio-hero-copy .studio-paths>a{padding:16px 0;border-right:0}
.studio-hero-copy .studio-paths>a:first-child{border-bottom:1px solid var(--line)}
.studio-hero-copy .studio-paths strong{font-size:20px}
@media(max-width:600px){.studio-hero h1{font-size:clamp(40px,10.8vw,60px);margin-bottom:18px}.studio-hero-copy>p{margin-bottom:16px}.studio-hero-copy .studio-paths{margin:16px 0 8px}.studio-hero-copy .studio-paths>a{padding:13px 0}.studio-hero-copy .studio-paths strong{font-size:18px}.studio-hero{padding-top:24px}}


.corporate-ui :is(.button,.text-link) svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}

.studio-local-actions { display:flex; flex-direction:column; align-items:flex-start; gap:12px; }
