
/* Typography and shape shared across the site */
:root{
  --head:"Barlow Condensed","Arial Narrow",Impact,sans-serif;
  --body:"Instrument Sans",Arial,sans-serif;
  --mono:"IBM Plex Mono",monospace;
  --paper:#f7f7f3;--ink:#121726;--line:#cdd2de;--blue:#244cff;
}
html{scroll-padding-top:95px}
body{font-family:var(--body)}
h1,h2,h3{letter-spacing:-.015em}
h2{font-size:clamp(2.7rem,6vw,5.6rem);line-height:.9}
h3{font-size:clamp(1.65rem,2.4vw,2.25rem);line-height:.98}
.eyebrow{font-family:var(--mono);font-size:.72rem;font-weight:600;letter-spacing:.12em}
.brand{font-family:var(--body);letter-spacing:-.075em}
.header{background:#f7f7f3f5}
.nav-wrap{min-height:70px}
.button,.motion-toggle,.menu-toggle,.hero,.card,.service-icon,.project,.float-card,.cta,.filters button,.table-wrap,.form input:not([type=checkbox]),.form textarea,.form select,.form .options label,.form .consent{border-radius:2px}
.button{font-size:.9rem;min-height:43px;letter-spacing:.015em}
.button:hover{transform:translateY(-2px)}
.hero{border-radius:4px}
.hero h1{font-size:clamp(4.2rem,8.1vw,8.8rem);letter-spacing:-.028em;line-height:.82}
.hero .eyebrow{font-family:var(--mono)}
.hero .float-card span{border-radius:2px}
.cta{border-radius:2px}
.cta h2{line-height:.88}
.form input,.form textarea,.form select{max-width:100%}
.footer{background:#e8ebf0}
.section-heading h2{max-width:840px}

/* Full-width editorial openings, with art direction selected by route */
.page-mast{
  --mast-bg:#dde8fd;--mast-ink:#131c32;--mast-muted:#36445f;--mast-line:#233b672b;--mast-accent:#2345d9;
  position:relative;display:grid;grid-template-columns:minmax(0,1.18fr) minmax(0,1fr);align-items:center;
  isolation:isolate;overflow:hidden;min-height:clamp(440px,50vw,640px);margin:10px 12px 0;padding:clamp(36px,7vw,110px);
  background:var(--mast-bg);color:var(--mast-ink);border:1px solid var(--mast-line);border-radius:3px;
}
.tone-electric{--mast-bg:#2143ee;--mast-ink:#fff;--mast-muted:#e2eaff;--mast-line:#b0c4ff50;--mast-accent:#ddff75}
.tone-ink{--mast-bg:#101829;--mast-ink:#fff;--mast-muted:#d5def1;--mast-line:#afc3e847;--mast-accent:#a8caff}
.tone-acid{--mast-bg:#dfff75;--mast-ink:#1b2612;--mast-muted:#36412a;--mast-line:#4354203d;--mast-accent:#315124}
.tone-paper{--mast-bg:#eeede5;--mast-ink:#191d28;--mast-muted:#4d5260;--mast-line:#252b423b;--mast-accent:#3148bb}
.tone-ice{--mast-bg:#dbe7ff;--mast-ink:#18223b;--mast-muted:#354669;--mast-line:#32457537;--mast-accent:#2948cf}
.page-mast:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  linear-gradient(var(--mast-line) 1px,transparent 1px),
  linear-gradient(90deg,var(--mast-line) 1px,transparent 1px);
  background-size:clamp(32px,6vw,90px) clamp(32px,6vw,90px);mask-image:linear-gradient(105deg,transparent 24%,#000 85%);opacity:.44
}
.mast-copy{min-width:0;position:relative;z-index:2}
.mast-copy .eyebrow{color:var(--mast-accent)}
.mast-copy h1{font:700 clamp(4.1rem,8.7vw,9.3rem)/.85 var(--head);letter-spacing:-.02em;margin:20px 0;text-wrap:balance}
.mast-copy .lead{max-width:42ch;color:var(--mast-muted);line-height:1.5}
.mast-link{border-color:var(--mast-line);margin-top:24px;color:var(--mast-ink);background:transparent}
.mast-link:hover{background:var(--mast-ink);color:var(--mast-bg)}
.mast-visual{display:grid;place-items:center;position:relative;min-width:0;isolation:isolate}
.mast-visual:before{content:"";position:absolute;z-index:-1;width:79%;aspect-ratio:1;border:1px solid var(--mast-line);transform:rotate(-11deg);animation:frame-in 1.15s cubic-bezier(.22,1,.36,1) both}
.studio-art{display:block;width:100%;height:auto;object-fit:contain}
.mast-image{max-width:660px;aspect-ratio:1.14;translate:var(--mx,0px) var(--my,0px);animation:art-in 1.12s cubic-bezier(.2,.75,.24,1) both;transition:translate .3s ease-out}
.mast-copy>*{animation:mast-in .72s cubic-bezier(.2,.7,.23,1) both}
.mast-copy h1{animation-delay:.06s}.mast-copy .lead{animation-delay:.12s}.mast-copy .mast-link{animation-delay:.18s}
@keyframes mast-in{from{opacity:0;transform:translateY(27px);clip-path:inset(0 0 38% 0)}to{opacity:1;transform:none;clip-path:inset(0)}}
@keyframes art-in{from{opacity:0;transform:translate(8%,7%) scale(.9) rotate(5deg)}to{opacity:1;transform:none}}
@keyframes frame-in{from{opacity:0;transform:scale(.8) rotate(12deg)}to{opacity:1;transform:rotate(-11deg)}}

/* Service directory and detail pages */
.directory-list{border-top:1px solid #303c57}
.directory-row{min-height:145px;display:grid;grid-template-columns:minmax(110px,.7fr) minmax(225px,2.15fr) minmax(100px,.8fr) max-content 26px;gap:clamp(10px,2vw,28px);align-items:center;border-bottom:1px solid #aeb7c9;padding:14px 8px;transition:background .25s}
.directory-row:hover,.directory-row:focus-visible{background:#e9efff}
.directory-row h3{font-size:clamp(1.8rem,3vw,3rem)}
.directory-row p{margin-top:6px;max-width:48ch;color:var(--muted);font-size:.95rem}
.directory-deliverable,.directory-price{font:500 .75rem/1.4 var(--mono)}
.directory-price,.directory-arrow{color:#1839c4}
.directory-arrow{font-size:1.35rem}
.page-service-story .page-mast{grid-template-columns:minmax(0,1.18fr) minmax(0,1fr)}
.page-service-story .section.actions{padding-block:30px}
.page-service-story #deliverables{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px}
.page-service-story #deliverables .checklist{margin:0;counter-reset:line}
.page-service-story #deliverables li{padding:13px 0;border-bottom:1px solid #b5c0d8;font-size:1.12rem}
.page-service-story #deliverables li:before{position:static;margin-right:14px;content:counter(line,decimal-leading-zero);counter-increment:line;font:500 .71rem var(--mono);color:var(--blue)}
.page-service-story .section .card{background:transparent;border:0;border-top:2px solid #3859eb;padding:18px 15px 14px 0}

/* Pricing as a rate sheet */
.page-rate-sheet .page-mast{min-height:clamp(400px,42vw,560px)}
.page-rate-sheet .pricing-grid{gap:0;border:1px solid #959fb8;grid-template-columns:repeat(4,minmax(0,1fr))}
.page-rate-sheet .price{border:0;border-right:1px solid #959fb8;padding:clamp(14px,2.2vw,32px);background:transparent}
.page-rate-sheet .price:last-child{border-right:0}
.page-rate-sheet .price.featured{background:#dff879}
.page-rate-sheet .price .amount{font-family:var(--mono);font-size:clamp(.95rem,1.8vw,1.3rem)}
.page-rate-sheet .price h3{font-size:clamp(2rem,3.2vw,3.8rem)}
.page-rate-sheet thead{background:#18233d;color:#fff}
.page-rate-sheet td,.page-rate-sheet th{border-bottom-color:#adb9d1}
.page-rate-sheet .tinted{background:#dde6ff}

/* Portfolio and individual case studies */
.page-gallery .page-mast{min-height:clamp(400px,43vw,580px)}
.page-gallery .work-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(14px,2vw,26px)}
.page-gallery .project{grid-column:span 6;border:0;background:transparent}
.page-gallery .project:nth-child(3n+1){grid-column:span 7}
.page-gallery .project:nth-child(3n+2){grid-column:span 5}
.page-gallery .project:nth-child(2n){align-self:end}
.page-gallery .project-image,.page-case-study .project-image{border:0}
.page-gallery img.project-image{transition:filter .35s ease}
.page-gallery .project:hover img.project-image{filter:saturate(1.22) contrast(1.08)}
.page-gallery .project-meta,.page-case-study .project-meta{padding:15px 0;border-bottom:1px solid #aeb8cc}
.page-gallery .filters{padding-block:12px;border-top:1px solid #aeb8cc}
.page-gallery .filters button{background:transparent}
.page-gallery .filters [aria-pressed=true]{background:#111b32}
.page-case-study .page-mast{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
.page-case-study .mast-visual:before{display:none}
.page-case-study .mast-copy h1{font-size:clamp(4rem,7.4vw,8rem)}
.page-case-study .mast-visual{border:1px solid var(--mast-line);animation:art-in .9s both}
.page-case-study .section:not(.tinted) .grid{gap:0;border-block:1px solid #aeb8cc}
.page-case-study .section:not(.tinted) .card{border:0;border-right:1px solid #aeb8cc;background:transparent}
.page-case-study .section:not(.tinted) .card:last-child{border-right:0}

/* Editorial layouts, timeline, knowledge pages and forms */
.page-journey .page-mast{min-height:clamp(400px,43vw,580px)}
.page-journey #project-stages{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.5fr);gap:clamp(24px,6vw,80px)}
.page-journey #project-stages .section-heading{position:sticky;top:100px;align-self:start}
.page-journey .stages{display:block;margin:0;border-top:1px solid #8d9cb7}
.page-journey .stages li{display:grid;grid-template-columns:68px 1fr;gap:14px;padding:22px 6px;border-top:0;border-bottom:1px solid #a6b3c9}
.page-journey .stages li>span{font:500 1.38rem var(--mono);margin:0}
.page-journey .stages h3{font-size:clamp(1.8rem,3vw,2.8rem)}
.page-manifesto #studio-story .grid{grid-template-columns:1.4fr 1fr;gap:0;border:1px solid #a6b3c9}
.page-manifesto #studio-story .card{background:transparent;border:0;padding:clamp(20px,4vw,55px)}
.page-manifesto #studio-story .card:first-child{grid-row:span 2;background:#172443;color:white}
.page-manifesto #studio-story .card:first-child p{color:#e4ebff}
.page-manifesto #studio-story .card:last-child{border-top:1px solid #a6b3c9}
.page-sector-index .sector-grid{gap:0;border-top:1px solid #a6b3c9;border-left:1px solid #a6b3c9}
.sector-grid .card{border:0;border-right:1px solid #a6b3c9;border-bottom:1px solid #a6b3c9;background:#e8efff;min-height:165px;transition:background .25s}
.sector-grid .card:nth-child(2n){background:#f7f7f3}
.sector-grid .card:hover{background:#deff7b}
.page-publication .page-mast,.page-reading .page-mast{min-height:clamp(380px,41vw,540px)}
.page-publication .section .grid,.page-reading .tinted .grid{gap:0;border-block:1px solid #aeb8cc}
.page-publication .article,.page-reading .article{background:transparent;border:0;border-right:1px solid #aeb8cc;min-height:205px}
.page-publication .article:last-child,.page-reading .article:last-child{border-right:0}
.page-publication .article:hover,.page-reading .article:hover{background:#e1e9ff;box-shadow:none}
.page-reading .prose,.page-legal .prose{margin-inline:auto;max-width:750px}
.prose p{font-size:1.07rem;line-height:1.74}
.prose h2:not(:first-child){border-top:1px solid #aeb8cc;padding-top:23px}
.page-legal .page-mast{min-height:330px;grid-template-columns:minmax(0,1.5fr) minmax(0,.6fr);padding-block:36px}
.page-legal .mast-copy h1{font-size:clamp(3.6rem,7.5vw,7rem)}
.page-legal .mast-image{max-height:265px}
.page-answers #questions{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.5fr);gap:24px}
.faq-list details{border-color:#aeb8cc}
.faq-list summary{padding-left:2px}
.faq-list details[open]{background:#e6eeff;padding-inline:12px}
.page-evidence .page-mast{min-height:clamp(370px,41vw,550px)}
.page-evidence .section .card{background:transparent;border:0;border-top:1px solid #7d8ca7;padding-left:0}
.page-desk{width:min(1460px,100% - 28px);margin:12px auto 0;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);align-items:start}
.page-desk .page-mast{margin:0;min-height:unset;align-content:start;grid-template-columns:minmax(0,1fr);padding:clamp(24px,4vw,60px);position:sticky;top:83px}
.page-desk .mast-copy h1{font-size:clamp(3.5rem,6vw,7rem);text-wrap:initial}
.page-desk .mast-visual{max-width:85%;margin:15px auto 0}
.page-desk .mast-image{max-height:295px}
.page-desk .section{width:100%;padding:clamp(22px,4vw,60px);border:1px solid #b5c0d6;border-left:0}
.page-desk .section + .section{grid-column:2;border-top:0}
.page-desk .section-heading h2{font-size:clamp(2.5rem,4.6vw,4.8rem)}
.page-desk .form{border:0;padding:0;background:transparent}
.page-desk .split{grid-template-columns:1fr}
.page-desk .split aside{background:#e7edfa}
.page-desk .form .step-progress{font:600 .76rem var(--mono);color:#2144c7;padding:9px 0;border-block:1px solid #aeb8cc;margin-bottom:19px!important}
.page-desk .form .options label:has(input:checked){background:#e1f699}
.page-desk .form fieldset:not([hidden]){animation:step-in .33s ease-out both}
@keyframes step-in{from{opacity:0;transform:translateX(10px)}to{opacity:1;transform:none}}
.page-desk .form textarea{resize:vertical}

/* Adapt layouts while keeping art, content and actions in their reading order */
@media(max-width:1000px){
  .page-rate-sheet .pricing-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page-rate-sheet .price:nth-child(2){border-right:0}
  .page-rate-sheet .price:nth-child(-n+2){border-bottom:1px solid #959fb8}
  .directory-deliverable{display:none}
  .directory-row{grid-template-columns:minmax(90px,.6fr) minmax(180px,2fr) max-content 24px}
}
@media(max-width:740px){
  .hero h1{font-size:clamp(3.9rem,11vw,5.9rem)}
  .page-mast,.page-service-story .page-mast,.page-case-study .page-mast,.page-legal .page-mast{grid-template-columns:minmax(0,1fr);margin-inline:8px;gap:15px;min-height:0;padding:32px 20px 20px}
  .mast-copy h1,.page-case-study .mast-copy h1{font-size:clamp(3.75rem,12vw,6.6rem);text-wrap:initial}
  .mast-visual{min-height:0}
  .mast-visual:before{width:55%}
  .mast-image{max-height:235px;width:min(90%,420px)}
  .page-legal .mast-image{max-height:150px}
  .page-service-story #deliverables,.page-journey #project-stages,.page-answers #questions{grid-template-columns:1fr;gap:10px}
  .page-journey #project-stages .section-heading{position:static}
  .directory-row{grid-template-columns:68px minmax(0,1fr) max-content;gap:10px;min-height:95px}
  .directory-price{grid-column:2;grid-row:2;margin-top:-5px}
  .directory-arrow{grid-column:3;grid-row:1}
  .directory-row p{font-size:.82rem;line-height:1.35}
  .directory-row h3{font-size:1.55rem}
  .page-gallery .work-grid{grid-template-columns:1fr}
  .page-gallery .work-grid .project{grid-column:auto}
  .page-case-study .section:not(.tinted) .card,.page-publication .article,.page-reading .article{border-right:0;border-bottom:1px solid #aeb8cc}
  .page-case-study .section:not(.tinted) .card:last-child,.page-publication .article:last-child,.page-reading .article:last-child{border-bottom:0}
  .page-manifesto #studio-story .grid{grid-template-columns:1fr}
  .page-manifesto #studio-story .card:first-child{grid-row:auto}
  .page-desk{display:block;width:calc(100% - 16px)}
  .page-desk .page-mast{position:relative;top:auto;padding:30px 20px 15px}
  .page-desk .mast-copy h1{font-size:clamp(3.8rem,11vw,6rem)}
  .page-desk .section{border-left:1px solid #b5c0d6;border-top:0}
  .page-desk .mast-image{max-height:180px}
}
@media(max-width:430px){
  .hero h1{font-size:clamp(3.45rem,11.4vw,4.65rem)}
  .page-rate-sheet .pricing-grid{grid-template-columns:1fr}
  .page-rate-sheet .price{border-right:0;border-bottom:1px solid #959fb8}
  .page-rate-sheet .price:last-child{border-bottom:0}
}
@media(prefers-reduced-motion:reduce){
  .mast-image{translate:none}
}


/* The publications, work and pricing openings use their own composition. */
@media(min-width:741px){
  .page-publication .page-mast{
    grid-template-columns:1fr;min-height:540px;padding-block:65px 0;text-align:center;align-content:start;
    background:linear-gradient(180deg,#fbfaf5 0%,#eeede5 100%);
  }
  .page-publication .mast-copy .lead{margin-inline:auto}
  .page-publication .mast-visual{position:absolute;inset:auto 0 -95px;z-index:0;pointer-events:none;overflow:hidden}
  .page-publication .mast-image{width:min(420px,42vw);height:305px;aspect-ratio:auto;object-position:50% 0}
  .page-publication .mast-visual:before{display:none}
  .page-gallery .page-mast{align-items:end;grid-template-columns:minmax(0,1.45fr) minmax(0,.55fr);padding-block:95px 55px;min-height:490px}
  .page-gallery .mast-copy h1{font-size:clamp(5.4rem,12vw,12.5rem)}
  .page-gallery .mast-visual{align-self:center;margin-left:-35%}
  .page-gallery .mast-image{max-height:440px}
  .page-gallery .mast-visual:before{width:95%;border-radius:50%;transform:rotate(-11deg)}
  .page-rate-sheet .page-mast{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);padding-block:55px}
  .page-rate-sheet .mast-visual{height:100%;background:#182236;margin-left:12%;border:1px solid #16202c}
  .page-rate-sheet .mast-image{width:93%;max-height:330px}
  .page-rate-sheet .mast-visual:before{width:76%;border-color:#b7d1ff47}
  .page-reading .page-mast{min-height:410px;grid-template-columns:minmax(0,1.4fr) minmax(0,.6fr);padding-block:55px}
  .page-reading .mast-copy h1{font-size:clamp(4.1rem,6.6vw,7.7rem)}
  .page-reading .mast-visual:before{width:67%}
}


/* Typography, service artwork previews and scroll-linked accents */
:root{--head:"Rethink Sans",Arial,sans-serif;--body:"Source Sans 3",Arial,sans-serif}
h1,h2,h3{letter-spacing:-.055em}
h2{font-size:clamp(2.35rem,5.5vw,4.9rem);line-height:.98}
h3{font-size:clamp(1.3rem,2vw,1.9rem);line-height:1.08}
.hero h1{font-size:clamp(3.8rem,7.05vw,8.4rem);letter-spacing:-.082em;line-height:.91}
.mast-copy h1{font-size:clamp(3.2rem,6.9vw,7.5rem);letter-spacing:-.078em;line-height:.94}
.page-gallery .mast-copy h1{font-size:clamp(4rem,9.2vw,9.7rem)}
.page-case-study .mast-copy h1,.page-reading .mast-copy h1{font-size:clamp(3.2rem,6vw,6.5rem)}
.page-desk .mast-copy h1,.page-legal .mast-copy h1{font-size:clamp(3.1rem,5.7vw,6.1rem)}
.page-desk .section-heading h2{font-size:clamp(2.1rem,4.3vw,4.2rem)}
.page-rate-sheet .price h3,.page-journey .stages h3{font-size:clamp(1.5rem,2.75vw,2.9rem)}
.page-directory .page-mast,.page-service-story .page-mast{
  grid-template-columns:minmax(0,1fr);
  min-height:clamp(340px,37vw,510px);
}
.page-directory .mast-copy,.page-service-story .mast-copy{max-width:990px}
.page-directory .mast-copy h1,.page-service-story .mast-copy h1{text-wrap:initial;max-width:15ch}
.directory-row{grid-template-columns:minmax(225px,2fr) minmax(100px,.78fr) max-content 28px;min-height:115px;padding-inline:18px}
.directory-row h3{font-size:clamp(1.5rem,2.7vw,2.55rem);font-weight:700;letter-spacing:-.045em}
.directory-list,.services-grid{isolation:isolate}
[data-service-preview]{position:relative}
.service-preview{
  position:absolute;z-index:1;bottom:0;right:0;display:grid;place-items:center;width:106px;height:65px;
  padding:0 10px 5px 0;overflow:hidden;pointer-events:none;
  --preview-progress:0;--preview-offset:24%;--preview-scale:.92;
}
.service-preview .studio-art{
  width:100%;height:100%;min-height:0;max-height:60px;object-fit:contain;
  opacity:var(--preview-progress);transform:translate(var(--preview-offset),var(--preview-offset)) scale(var(--preview-scale));
  transform-origin:bottom right;transition:transform .27s cubic-bezier(.2,.7,.3,1),opacity .19s ease;
}
.directory-row :is(.directory-price,.directory-arrow){align-self:start;margin-top:13px}
.service .service-preview{bottom:36px}
.page-service-story .service-preview{bottom:12px;right:12px;width:118px;height:72px}
.page-service-story .service-preview .studio-art{max-height:62px}
[data-service-preview]:is(:focus-visible,:has(.mast-link:focus-visible)) .service-preview{
  --preview-progress:1;--preview-offset:0%;--preview-scale:1;
}
@media(hover:hover) and (pointer:fine){
  [data-service-preview]:hover .service-preview{--preview-progress:1;--preview-offset:0%;--preview-scale:1}
}
.hero-art{translate:0 var(--scroll-y,0px)}
.fc1{translate:0 calc(var(--scroll-y,0px) * -.55)}
.fc2{translate:0 calc(var(--scroll-y,0px) * .42)}
.fc3{translate:0 calc(var(--scroll-y,0px) * -.35)}
.mast-image{translate:var(--mx,0px) calc(var(--my,0px) + var(--scroll-y,0px))}
.page-journey .stages{position:relative;padding-left:14px}
.page-journey .stages:before{
  content:"";position:absolute;inset:0 auto 0 0;width:2px;background:var(--blue);transform-origin:top;
  transform:scaleY(var(--stage-progress,0));pointer-events:none
}
@media(max-width:1000px){
  .directory-row{grid-template-columns:minmax(0,1fr) max-content 28px}
}
@media(max-width:740px){
  .hero h1{font-size:clamp(3rem,9.8vw,5.7rem)}
  .mast-copy h1,.page-gallery .mast-copy h1,.page-case-study .mast-copy h1,.page-reading .mast-copy h1,.page-desk .mast-copy h1{
    font-size:clamp(2.9rem,9.6vw,5.25rem);
  }
  .page-directory .page-mast,.page-service-story .page-mast{min-height:unset;padding-bottom:38px}
  .directory-row{grid-template-columns:minmax(0,1fr) 25px;min-height:104px;padding-inline:8px}
  .directory-row .directory-price{grid-column:1;grid-row:2;margin-top:0}
  .directory-arrow{grid-column:2;grid-row:1}
  .directory-row h3{font-size:1.35rem}
}
@media(max-width:430px){
  .hero h1{font-size:clamp(2.6rem,9.8vw,3.55rem)}
  .page-rate-sheet .price h3{font-size:1.8rem}
}
@media(prefers-reduced-motion:reduce){
  .hero-art,.float-card,.mast-image{translate:none}
  .page-journey .stages:before{display:none}
}


.page-mast:before{background-position:0 var(--scroll-y,0px),calc(var(--scroll-y,0px) * .55) 0}

/* Inter typography and interactive service/CTA sections */
:root{--head:Inter,Arial,sans-serif;--body:Inter,Arial,sans-serif;--mono:Inter,Arial,sans-serif}
body{font-weight:400}
h1,h2,h3,.mast-copy h1,.brand{font-weight:700}
.button,.eyebrow,.directory-price,.directory-deliverable,.form label,.faq-list summary{font-weight:600}
.hero h1{letter-spacing:-.068em}
.orbit-section{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(24px,5vw,74px);align-items:center;border-top:1px solid var(--line)}
.orbit-copy h2{margin:14px 0 20px}
.orbit-copy>p:not(.eyebrow){max-width:43ch;color:var(--muted);margin-bottom:21px}
.orbit-scene{
  position:relative;isolation:isolate;min-width:0;aspect-ratio:1.43;
  background:radial-gradient(ellipse at var(--pointer-x,53%) var(--pointer-y,50%),#d3e2ff 0%,#f4f7ff 48%,transparent 76%);
}
.orbit-rings,.orbit-hub{position:absolute;left:50%;top:50%;pointer-events:none}
.orbit-rings{
  width:78%;height:75%;border:1px solid #5677d742;border-radius:50%;
  transform:translate(-50%,-50%) rotate(-9deg);
  translate:var(--mx,0px) var(--my,0px);transition:translate .3s ease-out;
}
.orbit-rings:after{content:"";position:absolute;inset:14%;border:1px dashed #5677d755;border-radius:50%}
.orbit-hub{
  display:grid;place-items:center;width:64px;aspect-ratio:1;background:#fff;border:1px solid #b4c8f2;
  transform:translate(-50%,-50%);translate:calc(var(--mx,0px) * -.65) calc(var(--my,0px) * -.65);
  transition:translate .3s ease-out;box-shadow:0 8px 24px #294fb122;
}
.orbit-hub .brand-symbol{width:40px;height:33px}
.orbit-node{
  --orbit-depth:.55;position:absolute;left:var(--orbit-x);top:var(--orbit-y);width:clamp(79px,10vw,122px);
  display:grid;justify-items:center;gap:4px;transform:translate(-50%,-50%);padding:7px 5px 6px;
  background:#fff;border:1px solid #c2cef1;color:#151c31;text-align:center;font-size:clamp(.65rem,1.1vw,.78rem);
  font-weight:600;line-height:1.2;transition:border-color .2s,box-shadow .2s;
}
.orbit-node:hover,.orbit-node:focus-visible{z-index:2;border-color:#365dff;box-shadow:0 8px 24px #244cff20}
.orbit-node .studio-art{
  height:clamp(35px,5.4vw,63px);width:90%;object-fit:contain;
  translate:calc(var(--mx,0px) * var(--orbit-depth)) calc(var(--my,0px) * var(--orbit-depth));transition:translate .26s ease-out,scale .23s ease-out;
}
.orbit-node:hover .studio-art,.orbit-node:focus-visible .studio-art{scale:1.08}
.orbit-node-1{--orbit-x:50%;--orbit-y:13%}
.orbit-node-2{--orbit-x:77%;--orbit-y:23%;--orbit-depth:-.75}
.orbit-node-3{--orbit-x:88%;--orbit-y:49%}
.orbit-node-4{--orbit-x:75%;--orbit-y:77%;--orbit-depth:-.75}
.orbit-node-5{--orbit-x:50%;--orbit-y:88%}
.orbit-node-6{--orbit-x:25%;--orbit-y:77%;--orbit-depth:-.75}
.orbit-node-7{--orbit-x:12%;--orbit-y:49%}
.orbit-node-8{--orbit-x:23%;--orbit-y:23%;--orbit-depth:-.75}
.cta[data-pointer-scene]{
  position:relative;isolation:isolate;overflow:hidden;display:grid;
  grid-template-columns:minmax(0,1fr) minmax(115px,.35fr) auto;align-items:end;gap:clamp(12px,3vw,40px);
  background:radial-gradient(ellipse at var(--pointer-x,91%) var(--pointer-y,8%),#294bb4,transparent 67%),#0b1229;
}
.cta-copy,.cta .button{z-index:2}
.cta .button{justify-self:start;white-space:nowrap}
.cta-art{position:relative;min-height:135px;align-self:center;pointer-events:none}
.cta-art i{
  position:absolute;inset:17% 11%;border:1px solid #a9d0ff91;background:#94b6ff0c;transform:rotate(-24deg) skewY(10deg);
  translate:var(--mx,0px) var(--my,0px);transition:translate .26s ease-out;box-shadow:inset 0 0 30px #a9d0ff12;
}
.cta-art i:nth-child(2){inset:21% 8% 12% 21%;transform:rotate(10deg);translate:calc(var(--mx,0px) * -.75) calc(var(--my,0px) * -.75)}
.cta-art i:nth-child(3){inset:31% 3% 0% 34%;transform:rotate(-12deg);border-color:#dbff7899;translate:calc(var(--mx,0px) * 1.45) calc(var(--my,0px) * 1.45)}
.directory-row{min-height:148px;grid-template-columns:minmax(0,2fr) minmax(100px,.72fr) 144px 28px}
.directory-row .service-preview{width:168px;height:98px;padding:0 10px 6px 0}
.directory-row .service-preview .studio-art{max-height:92px}
.service .card-bottom{padding-top:96px}
.service .service-preview{width:145px;height:91px}
.service .service-preview .studio-art{max-height:86px}
.page-service-story .service-preview{width:170px;height:105px}
.page-service-story .service-preview .studio-art{max-height:100px}
@media(max-width:1000px){
  .directory-row{grid-template-columns:minmax(0,1fr) 144px 28px}
  .orbit-scene{aspect-ratio:1.14}
}
@media(max-width:740px){
  .orbit-section{grid-template-columns:1fr}
  .orbit-scene{aspect-ratio:1.32}
  .orbit-node{width:clamp(75px,17vw,104px)}
  .orbit-node .studio-art{height:clamp(35px,8vw,48px)}
  .cta[data-pointer-scene]{grid-template-columns:1fr auto;align-items:center}
  .cta-copy{grid-column:1/-1}
  .cta-art{grid-column:2;grid-row:2;min-height:60px;width:83px}
  .cta .button{grid-column:1;grid-row:2}
  .directory-row{grid-template-columns:minmax(0,1fr) 94px;min-height:125px}
  .directory-row .service-preview{width:94px;height:69px}
  .directory-row .service-preview .studio-art{max-height:63px}
  .page-service-story .page-mast{padding-bottom:95px}
  .page-service-story .service-preview{width:133px;height:82px}
  .page-service-story .service-preview .studio-art{max-height:77px}
}
@media(max-width:430px){
  .orbit-scene{aspect-ratio:1.04}
  .orbit-node{width:68px}
  .orbit-hub{width:46px}
  .orbit-hub .brand-symbol{width:30px;height:26px}
}
@media(prefers-reduced-motion:reduce){
  .orbit-node .studio-art,.orbit-rings,.orbit-hub,.cta-art i{translate:none}
}


/* Open artwork and expandable service showcase */
.page-mast:has(.mast-image) .mast-visual{background:transparent;border:0;box-shadow:none}
.page-mast:has(.mast-image) .mast-visual:before{display:none}
.orbit-scene{background:transparent}
.orbit-node,.orbit-hub{background:transparent;border-color:transparent;box-shadow:none}
.orbit-node:is(:hover,:focus-visible){border-color:transparent;box-shadow:none;color:var(--blue)}
.orbit-node:is(:hover,:focus-visible) span{text-decoration:underline;text-underline-offset:4px}
.cta{
  background:transparent;color:var(--ink);border-radius:0;border-block:1px solid var(--line);
  padding:clamp(26px,5.2vw,70px) 0;align-items:end;
}
.cta .eyebrow{color:#2349be}
.cta .button{background:transparent;border-color:#9aa9cc;color:#1839ae}
.cta .button:hover{background:#e5ecff;border-color:#244cff}
.cta .button span{transition:transform .23s ease}
.cta .button:is(:hover,:focus-visible) span{transform:translate(3px,-3px)}
.launch-section{border-top:1px solid var(--line)}
.launch-panels{
  --panel-a:1fr;--panel-b:1fr;--panel-c:1fr;
  display:grid;grid-template-columns:minmax(0,var(--panel-a)) minmax(0,var(--panel-b)) minmax(0,var(--panel-c));
  border-block:1px solid #aeb9d0;transition:grid-template-columns .52s cubic-bezier(.2,.75,.2,1);
}
.launch-panels[data-active-panel="0"]{--panel-a:2.5fr}
.launch-panels[data-active-panel="1"]{--panel-b:2.5fr}
.launch-panels[data-active-panel="2"]{--panel-c:2.5fr}
.launch-panel{min-width:0;padding:clamp(12px,2.5vw,29px)}
.launch-panel+.launch-panel{border-left:1px solid #aeb9d0}
.launch-panel button{
  display:flex;justify-content:space-between;align-items:start;gap:10px;width:100%;padding:0;border:0;background:transparent;
  color:var(--ink);text-align:left;font:700 clamp(1.14rem,2.15vw,2.05rem)/1.05 Inter,Arial,sans-serif;letter-spacing:-.045em;
}
.launch-panel button:hover,.launch-panel button[aria-expanded="true"]{color:#1b41c7}
.launch-toggle{display:inline-block;font-weight:400;line-height:1;transition:rotate .25s}
.launch-panel button[aria-expanded="true"] .launch-toggle{rotate:45deg}
.launch-detail{display:grid;grid-template-rows:1fr;transition:grid-template-rows .35s,opacity .26s}
.launch-detail[inert]{grid-template-rows:0fr;opacity:0}
.launch-detail-inner{overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.95fr);align-items:center;gap:14px;min-height:0}
.launch-detail-inner>div{padding:21px 0 8px}
.launch-detail-inner p{color:var(--muted);margin-bottom:12px}
.launch-detail-inner .studio-art{
  max-height:180px;aspect-ratio:1.15;transform:translateX(0) scale(1);
  transition:transform .55s cubic-bezier(.2,.75,.2,1);
}
.launch-detail[inert] .studio-art{transform:translateX(20px) scale(.9)}
@media(min-width:741px){
  .launch-panels.launch-enhanced{min-height:258px}
}
@media(max-width:900px){
  .launch-detail-inner{grid-template-columns:minmax(0,1fr)}
  .launch-detail-inner .studio-art{max-height:135px}
}
@media(max-width:740px){
  .launch-panels{grid-template-columns:1fr}
  .launch-panel+.launch-panel{border-left:0;border-top:1px solid #aeb9d0}
  .launch-detail-inner{grid-template-columns:minmax(0,1fr) minmax(72px,.65fr)}
  .cta .button{align-self:start}
}


/* Services introduction, orbit identity and painted project CTA */
.page-directory .page-mast{
  grid-template-columns:minmax(0,1.25fr) minmax(0,.85fr);
  gap:clamp(22px,5vw,78px);
  min-height:clamp(420px,43vw,610px);
  padding-block:clamp(42px,6vw,96px);
}
.page-directory .mast-copy h1{
  max-width:14ch;font-size:clamp(3rem,5.75vw,6.3rem);
  line-height:1.07;letter-spacing:-.064em;text-wrap:balance;
}
.page-directory .mast-copy .lead{max-width:44ch}
.page-directory .mast-visual{height:100%;max-height:385px}
.page-directory .mast-image{width:100%;height:100%;max-height:385px;filter:drop-shadow(0 19px 22px #131f8578)}
.orbit-hub{width:clamp(105px,12vw,158px)}
.orbit-hub .brand-symbol{width:clamp(85px,9vw,117px);height:auto;aspect-ratio:30/26}
.cta-painted{
  position:relative;isolation:isolate;overflow:hidden;min-height:clamp(300px,30vw,480px);
  padding:clamp(24px,5vw,78px);background:#0a1536;color:#fff;border:0;gap:24px;
  align-items:end;
}
.cta-painting,.cta-painted::before{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.cta-painting{object-fit:cover;object-position:65% 50%;z-index:-2}
.cta-painted::before{content:"";z-index:-1;background:linear-gradient(90deg,#07102ce8 0%,#07102cb0 49%,#07102c24 100%),linear-gradient(0deg,#07102c83,transparent 52%)}
.cta-painted .eyebrow{color:#dbff77}
.cta-painted .button{background:#dcff72;border-color:transparent;color:#101b2d}
.cta-painted .button:hover{background:#edffad;border-color:transparent}
.cta-painted h2{line-height:1.06;letter-spacing:-.063em}
.cta-line{display:block}
.motion-ready .cta-copy .cta-line{
  opacity:0;transform:translateY(20px);transition:opacity .52s ease,transform .66s cubic-bezier(.19,1,.22,1);
}
.motion-ready .cta-copy.in-view .cta-line,.motion-ready .cta-copy:focus-within .cta-line{opacity:1;transform:none}
.motion-ready .cta-copy .cta-line:nth-child(2){transition-delay:.11s}
@supports(animation-timeline:view()){
  @media(prefers-reduced-motion:no-preference){
    .motion-ready .cta-copy .cta-line{
      opacity:1;transform:none;transition:none;
      animation:painted-title-reveal linear both;
      animation-timeline:view();animation-range:entry 5% cover 24%;
    }
    .motion-ready .cta-copy .cta-line:nth-child(2){animation-range:entry 9% cover 29%}
  }
}
@keyframes painted-title-reveal{from{opacity:.05;transform:translateY(22px)}to{opacity:1;transform:none}}
@media(max-width:740px){
  .page-directory .page-mast{grid-template-columns:minmax(0,1fr);min-height:0;padding-block:34px 22px;gap:12px}
  .page-directory .mast-copy h1{font-size:clamp(2.6rem,9vw,4.8rem)}
  .page-directory .mast-visual{max-height:190px}
  .page-directory .mast-image{max-height:190px}
  .orbit-hub{width:92px}
  .orbit-hub .brand-symbol{width:75px}
  .cta-painted{min-height:300px;align-items:start;justify-content:end}
  .cta-painting{object-position:61% 50%}
  .cta-painted::before{background:linear-gradient(90deg,#07102ce3,#07102c7a 77%),linear-gradient(0deg,#07102c8a,transparent 60%)}
}
@media(prefers-reduced-motion:reduce){
  .motion-ready .cta-copy .cta-line{opacity:1;transform:none;transition:none;animation:none}
}

