/* Migration parity. Deliberately excludes the slate loader and case-study artwork. */
body{font-family:Arial,Helvetica,sans-serif;font-weight:400}
main :is(p,li,dd,dt,button,input,textarea,select,summary,label,h1,h2,h3,h4,span){font-family:Arial,Helvetica,sans-serif!important}
main p{font-weight:400}main :is(h1,h2,h3,h4){font-weight:700}
.portable-header{box-sizing:border-box;min-height:106px;height:106px;padding:8px 6.5%;gap:24px}
.portable-logo{flex:0 0 160px}.portable-logo img{width:160px;height:90px}
/* Scale desktop navigation closer to the original Squarespace header without crowding laptop widths. */
.portable-header nav{gap:14px}.portable-header nav a{font-family:Arial,Helvetica,sans-serif;font-size:clamp(13px,1vw,16px);font-weight:500;position:relative;border:0}
.portable-header nav a[aria-current]::after{content:"";position:absolute;height:1px;background:#b86231;bottom:0;left:0;right:0}
.portable-socials{gap:7px}.portable-socials a{box-sizing:border-box;width:35px;height:35px;border:2px solid #f3efe6;border-radius:6px}.portable-socials svg{width:15px;height:15px;fill:currentColor}
.portable-migrated-hero h1{font-size:clamp(35.1px,5.4vw,78px);font-weight:700;letter-spacing:-.025em;text-shadow:none}
.portable-migrated-hero p{font-size:clamp(15px,1.2vw,18px);font-weight:400;line-height:1.65}
.emg-work .emg-topline{padding-top:106px}.emg-work h2{font-weight:700}.emg-work :is(.emg-kicker,.emg-category){font-weight:400}
.emgh .emgh-subtitle,.emgh .emgh-subtitle.emgh-orange{font-weight:400}
[data-page="/resources"] .emgh{min-height:462px;display:grid;place-items:center;background:linear-gradient(#090d1288,#090d12c2),url('/assets/migrated/resources-hero.png') center/cover;border-bottom:2px solid #f3efe6}
[data-page="/about"] .emgh{min-height:383px;background-blend-mode:multiply;background-color:#090d1255;border-bottom:2px solid #f3efe6}
.services-page .emgh{min-height:268px;padding-block:54px;background-position:center 44%;clip-path:polygon(0 0,100% 0,100% calc(100% - var(--services-hero-rise,3.96vw)),0 100%);border-bottom:0}
.services-introduction{padding-top:54px}.services-introduction h2{max-width:900px;font-size:clamp(30px,4vw,52px)}
.services-introduction__copy{max-width:785px;font-weight:400}
.services-planner-section{padding-inline:32px}.services-planner-section .ebe-shell{padding:48px;max-width:none}
[data-page="/contact"] .emgh{min-height:334px;background-position:center 40%;border-bottom:2px solid #f3efe6}
/* The 334px crop truncates the lower camera-safe guide on desktop.
   Keep the composition centered and give the full safety frame room. */
@media(min-width:801px){
  [data-page="/contact"] .emgh{
    min-height:380px;
    background-position:center 43%;
  }
}

[data-page="/contact"] .emg-budget{width:calc(100% - 102px)!important;max-width:none}
.contact-carried-brief{padding:30px;max-width:none!important;background:transparent;border:1px solid #b86231;border-radius:12px}
.contact-carried-brief h2{font-size:25px}.contact-carried-brief details{margin-block:18px}.contact-carried-brief textarea{min-height:160px}
.emg-portfolio-html{width:calc(100% - 102px)!important}.eh-grade{max-width:1178px;padding-inline:32px!important}
.portable-blog-post{padding:80px 24px 60px;background:linear-gradient(#26314088,transparent 480px)}
.blog-post-heading{max-width:728px;text-align:left;margin-bottom:138px}.blog-post-heading>a,.blog-post-heading>p{display:none}
.blog-post-heading h1{font-size:clamp(36px,5.2vw,68px);font-weight:700;line-height:1.1;letter-spacing:-.025em;margin:10px 0 0}
.portable-blog-post .emg-journal{max-width:728px}.portable-blog-post .emg-journal p{font-size:19px;font-weight:400;line-height:1.9}
.blog-post-nav{max-width:728px}.blog-post-nav a{display:flex;flex:1;flex-direction:column;gap:8px;text-decoration:none}.blog-post-nav a[rel=next]{text-align:right;margin-left:auto}.blog-post-nav small{font-size:13px}.blog-post-nav span{font-size:22px}
.blog-card-copy>p:not(.blog-card-meta){display:block;-webkit-line-clamp:unset;overflow:visible}.blog-card-meta{display:none}
@media(max-width:1180px) and (min-width:901px){.portable-header{padding-inline:24px;gap:15px}.portable-logo{flex-basis:132px}.portable-logo img{width:132px}.portable-socials{display:none}.portable-header nav{gap:12px}.portable-header nav a{font-size:12px}}
@media(max-width:900px){
 .portable-header{height:calc(77px + env(safe-area-inset-top, 0px));min-height:calc(77px + env(safe-area-inset-top, 0px));padding:calc(10px + env(safe-area-inset-top, 0px)) max(24px, env(safe-area-inset-right, 0px)) 10px max(24px, env(safe-area-inset-left, 0px));flex-wrap:nowrap}.portable-logo{flex:0 0 60px}.portable-logo img{width:60px;height:52px}
 .portable-menu-toggle{display:grid;place-items:center;width:38px;height:38px;padding:5px;border:0;background:transparent;z-index:52}
 .portable-menu-toggle span,.portable-menu-toggle span::before,.portable-menu-toggle span::after{display:block;width:26px;height:2px;background:#f3efe6;position:relative;content:""}.portable-menu-toggle span::before{position:absolute;top:-8px}.portable-menu-toggle span::after{position:absolute;top:8px}
 .portable-menu-toggle[aria-expanded=true] span{background:transparent}.portable-menu-toggle[aria-expanded=true] span::before{top:0;transform:rotate(45deg)}.portable-menu-toggle[aria-expanded=true] span::after{top:0;transform:rotate(-45deg)}
 .menu-open{overflow:hidden}.menu-open .portable-header{position:fixed;inset:0 0 auto;z-index:50}
 /* Reserve the social row separately; short/landscape menus scroll without
    hiding their first link or overlapping the icons. Bias the stack upward. */
 .portable-header nav.is-open{box-sizing:border-box;position:fixed;inset:calc(77px + env(safe-area-inset-top, 0px)) 0 calc(100% - 100dvh + 94px + env(safe-area-inset-bottom, 0px));background:#121a25;z-index:50;display:flex;flex-direction:column;justify-content:safe center;align-items:center;padding:8px 24px 98px;gap:0;overflow-y:auto;overscroll-behavior:contain}
 .menu-open .portable-header::before{content:"";position:fixed;inset:0;background:#121a25;z-index:-1}
 .portable-header nav a{font-size:25px;line-height:1.2;padding:9px 0;flex-shrink:0;font-weight:500}.portable-header nav a[aria-current]::after{display:none}
 .menu-open .portable-socials{display:flex;position:fixed;bottom:calc(100% - 100dvh + 24px + env(safe-area-inset-bottom, 0px));left:0;right:0;justify-content:center;z-index:51;gap:14px}.menu-open .portable-socials a{width:46px;height:46px}.menu-open .portable-socials svg{width:22px;height:22px}
 .portable-header>.portable-socials{display:none}.menu-open .portable-header>.portable-socials{display:flex}
}
@media(max-width:650px){
 main>.emgh,main>article>.emgh{padding-inline:41.39px}.emgh .emgh-title{font-size:31.2px}
 .portable-migrated-hero__copy{width:100%;padding-inline:26px}.portable-migrated-hero h1{font-size:35.1px}.portable-migrated-hero--portfolio h1{font-size:51.448px;max-width:6.5ch;margin-inline:auto}
 .emg-work .emg-topline{padding:48px 43.39px 26px}.emg-work .emg-hero{padding-inline:43.39px}.emg-work h2{font-size:44px}
 [data-page="/our-process"] main{padding-inline:23.39px}[data-page="/our-process"] h1{font-size:30.72px!important}
 .services-page .emgh{min-height:235px;padding-inline:26px}.services-introduction{padding-inline:41.39px}.services-introduction h2{font-size:30px}
 .services-planner-section{padding-inline:12px}.services-planner-section .ebe-shell{padding:24px 18px}
 [data-page="/contact"] .emgh{padding-inline:41.39px}.contact-layout{padding-inline:41.39px!important}[data-page="/contact"] .emg-budget{width:calc(100% - 46.78px)!important}
 [data-page="/about"] .emgh,[data-page="/resources"] .emgh{min-height:265px}.emg-portfolio-html{width:calc(100% - 46.78px)!important}.eh-grade{padding-inline:23.39px!important}
 .portable-blog-post{padding-inline:41.39px}.blog-post-heading{margin-bottom:80px}.blog-post-heading h1{font-size:36px}.portable-blog-post .emg-journal p{font-size:16px}.blog-post-nav span{font-size:18px}
}

/* Tokyo: live editorial chapters and full-width stacked development boards. */
[data-page="/tokyo"] .tokyo-chapter{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);align-items:start;gap:clamp(36px,6vw,96px)}
[data-page="/tokyo"] .tokyo-chapter-heading{position:sticky;top:104px;align-self:start}
[data-page="/tokyo"] .tokyo-chapter-heading h2{font-size:clamp(30px,3.6vw,50px);line-height:1.12;margin:22px 0 0;max-width:100%}
[data-page="/tokyo"] .tokyo-chapter-copy{min-width:0}
[data-page="/tokyo"] .tokyo-chapter-copy>.cs-gallery{padding:38px 0 0;background:transparent}
[data-page="/tokyo"] .tokyo-chapter-copy>.cs-gallery>.ei-wrap{width:100%;max-width:none;padding:0;margin:0}
[data-page="/tokyo"] .tokyo-chapter-copy .cs-gallery h2{font-size:28px;margin-bottom:24px}
[data-page="/tokyo"] .tokyo-chapter-copy .cs-gallery-grid{grid-template-columns:1fr;gap:28px}
[data-page="/tokyo"] .tokyo-chapter-copy .cs-gallery-grid figure{padding-top:0!important;margin:0!important}
@media(max-width:991px){[data-page="/tokyo"] .tokyo-chapter{grid-template-columns:1fr;gap:24px}[data-page="/tokyo"] .tokyo-chapter-heading{position:static}[data-page="/tokyo"] .tokyo-chapter-copy .cs-gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){[data-page="/tokyo"] .tokyo-chapter-copy .cs-gallery-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce),print{[data-page="/tokyo"] .tokyo-chapter-heading{position:static}}

/* Let the Tokyo chapters stick to the viewport instead of a non-scrolling wrapper. */
[data-page="/tokyo"] .ei-page{overflow:clip}
/* Shared branding also applies to imported pages, which do not load site.css. */
html{scrollbar-width:thin;scrollbar-color:#C55C20 #121A25}
::-webkit-scrollbar{width:11px;height:11px}
::-webkit-scrollbar-track{background:#121A25}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#EA9D00,#C55C20);border:3px solid #121A25;border-radius:999px}
::-webkit-scrollbar-thumb:hover{background:#EA9D00}
::selection{background:#C55C20;color:#F3EFE6;text-shadow:none}
::-moz-selection{background:#C55C20;color:#F3EFE6;text-shadow:none}


/* Case Studies — restore original Squarespace typography.
   The generic parity rules above replace Gotham with Arial and reduce the
   module's 900-weight display headline to 700. Keep the imported page's
   original type scale and weights without affecting other pages. */
body[data-page="/case-studies"] .emg-work,
body[data-page="/case-studies"] .emg-work :is(h2,h3,p,span,a) {
  font-family:EMGGotham,Gotham,Arial,sans-serif!important;
}
body[data-page="/case-studies"] .emg-work h2 {
  font-size:clamp(60px,11vw,170px);
  font-weight:900!important;
  line-height:.98;
  letter-spacing:-.025em;
}
body[data-page="/case-studies"] .emg-work .emg-kicker {
  font-size:11px;
  font-weight:700!important;
  letter-spacing:.18em;
}
body[data-page="/case-studies"] .emg-work .emg-topline,
body[data-page="/case-studies"] .emg-work .emg-image-top {
  font-weight:700!important;
}
body[data-page="/case-studies"] .emg-work h3 {
  font-weight:700!important;
}
@media(max-width:760px) {
  body[data-page="/case-studies"] .emg-work h2 {
    font-size:clamp(44px,10.8vw,82px);
  }
}


/* Case Studies: use the exact Gotham webfaces already configured on Squarespace.
   Naming the family separately avoids a local-only @font-face silently falling
   back to Arial on machines without Gotham installed. */
@font-face {
  font-family:"EMG Gotham Web";
  src:local("Gotham Book"),url("https://static1.squarespace.com/static/6814f57d08421f2e339e12c7/t/6aaacd919008280d613096d5/1789578641768/gotham-book-webfont.woff2") format("woff2");
  font-style:normal;font-weight:400;font-display:swap;
}
@font-face {
  font-family:"EMG Gotham Web";
  src:local("Gotham Medium"),url("https://static1.squarespace.com/static/6814f57d08421f2e339e12c7/t/6aaace27afb97b46270501ee/1789578791597/gotham-medium-webfont.woff2") format("woff2");
  font-style:normal;font-weight:500;font-display:swap;
}
@font-face {
  font-family:"EMG Gotham Web";
  src:local("Gotham Bold"),url("https://static1.squarespace.com/static/6814f57d08421f2e339e12c7/t/6aaacd899008280d61309601/1789578633267/gotham-bold-webfont.woff2") format("woff2");
  font-style:normal;font-weight:700;font-display:swap;
}
@font-face {
  font-family:"EMG Gotham Web";
  src:local("Gotham Black"),url("https://static1.squarespace.com/static/6814f57d08421f2e339e12c7/t/6aaacd7b907bab752d0ba0cc/1789578619438/gotham-black-webfont.woff2") format("woff2");
  font-style:normal;font-weight:900;font-display:swap;
}

/* The masthead and navigation were missed by the previous module-only fix. */
body[data-page="/case-studies"] .portable-header nav a {
  font-family:"EMG Gotham Web",Gotham,Arial,sans-serif;
  font-weight:500;
}
body[data-page="/case-studies"] .portable-migrated-hero h1 {
  font-family:"EMG Gotham Web",Gotham,Arial,sans-serif;
  font-weight:700;
  font-size:clamp(35.1px,5.4vw,78px);
  letter-spacing:-.025em;
}
body[data-page="/case-studies"] .portable-migrated-hero__copy p {
  font-family:"EMG Gotham Web",Gotham,Arial,sans-serif;
  font-size:clamp(15px,1.2vw,18px);
  font-weight:400;
  line-height:1.65;
}
body[data-page="/case-studies"] .emg-work,
body[data-page="/case-studies"] .emg-work :is(h2,h3,p,span,a) {
  font-family:"EMG Gotham Web",Gotham,Arial,sans-serif!important;
}
@media(max-width:650px) {
  body[data-page="/case-studies"] .portable-migrated-hero h1 {
    font-size:35.1px;
  }
}

/* ABOUT / Gotham typography parity with existing Squarespace site. */
/* Reuse the actual Gotham webfaces already declared above. The generic
   migration parity stylesheet was imposing Arial on all main-page text,
   while the original Squarespace global rules force Gotham on headings,
   paragraphs and controls. Restrict this fix to About. */
body[data-page="/about"],
body[data-page="/about"] .portable-header nav a,
body[data-page="/about"] #emg-about,
body[data-page="/about"] #emg-about :is(h1,h2,h3,h4,h5,h6,p,span,a,li,small,strong,em,label,button,input,textarea,select,summary,figcaption) {
  font-family:"EMG Gotham Web",Gotham,Arial,sans-serif!important;
}
body[data-page="/about"] #emg-about :is(h1,h2,h3,h4,h5,h6) {
  font-weight:700!important;
}
body[data-page="/about"] #emg-about :is(p,li) {
  font-weight:400;
}
body[data-page="/about"] .portable-header nav a {
  font-weight:500;
}
body[data-page="/about"] .emgh .emgh-title,
body[data-page="/about"] .emgh .emgh-subtitle {
  font-family:"EMG Gotham Web",Gotham,Arial,sans-serif!important;
}

/* Services: restore the original Gotham typography using the shared webfaces. */
body:is(.services-page,[data-page="/services"]),
body:is(.services-page,[data-page="/services"]) .portable-header nav a,
body:is(.services-page,[data-page="/services"]) main,
body:is(.services-page,[data-page="/services"]) main :is(h1,h2,h3,h4,h5,h6,p,span,a,li,dd,dt,small,strong,em,label,button,input,textarea,select,summary,figcaption) {
  font-family:"EMG Gotham Web",Gotham,Arial,sans-serif!important;
}
body:is(.services-page,[data-page="/services"]) #emg-services h3 {
  font-weight:700;
}
body:is(.services-page,[data-page="/services"]) #emg-services :is(.svc-number,.svc-examples li,.svc-link) {
  font-weight:500;
}

/* The artwork's copper baseline rises 86 px across its 2172 px width.
   Keep the hero cut parallel to that line, rather than using a height percent. */
.services-page .emgh::after{content:"";position:absolute;left:0;bottom:1px;width:100%;height:2px;background:#B86231;transform-origin:left bottom;transform:skewY(-2.267deg);pointer-events:none}

/* Process standards retain their quiet default; hovering adds Contact's glow. */
body[data-page="/our-process"] #eh-process .eh-standard-card:is(:hover,:focus-within){
  background:radial-gradient(ellipse at 100% 0%,rgba(197,92,32,.16),transparent 72%),#121A25;
  border-color:rgba(197,92,32,.55);
}

/* A compact About masthead brings the team introduction into view sooner. */
@media(max-width:650px){
 body[data-page="/about"] .emgh{min-height:180px;padding:34px 26px}
 body[data-page="/about"] .emgh .emgh-inner{gap:14px}
 body[data-page="/about"] .emgh .emgh-subtitle{font-size:15px;line-height:1.5}
}