@font-face { font-family: Fraunces; font-style: normal; font-weight: 300 700; font-display: swap; src: url('../assets/fonts/fraunces-latin.woff2') format('woff2'); }
@font-face { font-family: Fraunces; font-style: italic; font-weight: 400; font-display: swap; src: url('../assets/fonts/fraunces-italic-latin.woff2') format('woff2'); }
@font-face { font-family: 'Public Sans'; font-style: normal; font-weight: 300 700; font-display: swap; src: url('../assets/fonts/public-sans-latin.woff2') format('woff2'); }
:root { --ink:#0d231f; --paper:#f6f0e6; --teal:#00665d; --rust:#9e4f39; --soft-rust:#d18768; --sage:#71806e; --line:#c9c4b7; --display:Fraunces, Georgia, serif; --body:'Public Sans', Arial, sans-serif; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; scroll-padding-top:28px; } body { margin:0; background:var(--paper); color:var(--ink); font:400 16px/1.65 var(--body); -webkit-font-smoothing:antialiased; } h1,h2,h3,p { margin:0; } h1,h2,h3 { font-family:var(--display); font-weight:400; line-height:1.02; letter-spacing:-.05em; } a { color:inherit; text-decoration:none; } button { font:inherit; cursor:pointer; } img { display:block; max-width:100%; } [hidden] { display:none!important; } ::selection { color:var(--paper); background:var(--rust); } :focus-visible { outline:2px solid currentColor; outline-offset:5px; }
.studio-shell { width:min(100% - 112px, 1376px); margin-inline:auto; }.studio-kicker { display:block; font-size:10px; font-weight:500; letter-spacing:.15em; text-transform:uppercase; }.studio-skip { position:fixed; top:10px; left:15px; z-index:100; padding:12px 20px; color:var(--paper); background:var(--rust); transform:translateY(-150%); }.studio-skip:focus { transform:none; }
.studio-nav { position:relative; z-index:20; display:flex; align-items:center; gap:40px; padding:10px 56px; color:var(--paper); background:var(--ink); border-bottom:1px solid #ffffff20; }.studio-brand { display:flex; align-items:center; width:112px; height:61px; flex-shrink:0; }.studio-brand img { width:100%; height:auto; max-height:61px; object-fit:contain; filter:brightness(0) invert(1); transform:none; }.studio-links { display:flex; gap:35px; margin-left:auto; }.studio-links a,.studio-contact { position:relative; padding:10px 0; font-size:12px; }.studio-links a::after,.studio-contact::after { position:absolute; right:100%; bottom:3px; left:0; height:1px; content:''; background:var(--soft-rust); transition:right .25s; }.studio-links a:hover::after,.studio-contact::after { right:0; }.studio-contact:hover { color:var(--soft-rust); }.studio-menu-button,.studio-menu { display:none; }
.studio-hero { position:relative; overflow:hidden; color:var(--paper); background:var(--ink); }.studio-hero::before { position:absolute; inset:auto -12vw -30vw auto; width:min(70vw,860px); aspect-ratio:1; content:''; border:1px solid #d187683d; border-radius:50%; box-shadow:0 0 0 76px #d1876812,0 0 0 152px #d187680b; }.studio-hero-inner { position:relative; z-index:1; display:grid; grid-template-columns:1.4fr .6fr; gap:10%; align-items:end; padding-top:104px; padding-bottom:118px; }.studio-hero h1 { margin-top:28px; font-size:clamp(70px,9.1vw,138px); }.studio-hero h1 em,.studio-section-head h2 em,.studio-intent h2 em,.studio-founder h2 em,.studio-close h2 em { color:var(--soft-rust); }.studio-hero-note { padding-bottom:13px; }.studio-hero-note .studio-kicker { color:#b8c5b9; }.studio-hero-note p { max-width:365px; margin:18px 0 26px; font:400 clamp(18px,1.55vw,23px)/1.4 var(--display); letter-spacing:-.02em; color:var(--paper); }
.studio-line-link { display:inline-flex; padding:10px 0; font-size:15px; border-bottom:1px solid currentColor; background:transparent; }.studio-line-link:hover { color:var(--rust); }.studio-line-link-light:hover { color:var(--soft-rust); }
.studio-intent { padding-block:112px 120px; }.studio-section-head { display:flex; align-items:flex-start; justify-content:space-between; gap:50px; }.studio-section-head > p { max-width:330px; color:#536153; font-size:13px; }.studio-section-head > p a { border-bottom:1px solid currentColor; }.studio-section-head > p a:hover { color:var(--rust); }.studio-intent-grid { display:grid; grid-template-columns:1.3fr .7fr; gap:10%; margin-top:76px; }.studio-intent h2 { font-size:clamp(48px,6vw,92px); }.studio-intent h2 em { color:var(--teal); }.studio-intent-copy { max-width:400px; padding-top:13px; color:#465647; font-size:15px; }.studio-intent-copy p + p { margin-top:22px; }
.studio-notes { padding-block:104px 113px; color:var(--paper); background:#143a33; }.studio-section-head-light { display:grid; grid-template-columns:1fr 1fr; }.studio-section-head-light .studio-kicker { color:#d2c0ae; }.studio-section-head-light h2 { grid-row:2; margin-top:28px; font-size:clamp(48px,5.8vw,86px); }.studio-section-head-light > p { align-self:end; margin-bottom:8px; color:#c6d0c2; }.studio-note-board { display:grid; grid-template-columns:minmax(210px,.55fr) minmax(0,1.45fr); margin-top:67px; border:1px solid #ffffff25; }.studio-note-tabs { display:grid; align-content:start; border-right:1px solid #ffffff25; }.studio-note-tab { display:grid; grid-template-columns:34px 1fr; padding:19px 20px; color:#c6d0c2; text-align:left; background:transparent; border:0; border-bottom:1px solid #ffffff17; font-size:13px; }.studio-note-tab span { color:#d2c0ae; font-size:10px; }.studio-note-tab:hover,.studio-note-tab.is-active { color:var(--paper); background:#ffffff12; }.studio-note-tab.is-active { box-shadow:inset 3px 0 var(--soft-rust); }.studio-note-record { min-height:360px; padding:clamp(34px,6vw,80px); background:#0d2a25; }.studio-note-panel { animation:studio-in .3s ease both; }.studio-note-panel .studio-kicker { color:#d2c0ae; }.studio-note-panel h3 { max-width:680px; margin:19px 0 22px; font-size:clamp(38px,4.5vw,66px); }.studio-note-panel > p { max-width:590px; color:#d5ddd3; font-size:14px; }.studio-practice { margin-top:28px; padding-top:17px; border-top:1px solid #ffffff22; }.studio-practice b { margin-right:14px; color:var(--soft-rust); font-size:10px; letter-spacing:.13em; text-transform:uppercase; }
.studio-method { padding-block:112px; }.studio-method .studio-section-head { display:block; }.studio-method h2 { margin-top:27px; font-size:clamp(48px,6vw,90px); }.studio-method h2 em { color:var(--teal); }.studio-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:0; margin:74px 0 42px; padding:0; list-style:none; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.studio-steps li { min-height:295px; padding:27px 34px 30px 0; border-right:1px solid var(--line); }.studio-steps li + li { padding-left:34px; }.studio-steps li:last-child { border:0; }.studio-steps li > span { color:var(--rust); font-size:10px; letter-spacing:.13em; }.studio-steps h3 { margin:83px 0 14px; font-size:28px; }.studio-steps p { max-width:300px; color:#536153; font-size:13px; }
.studio-founder { padding-block:100px; background:#e6ddd0; }.studio-founder-grid { display:grid; grid-template-columns:1fr 1fr; gap:10%; align-items:center; }.studio-founder-note { position:relative; max-width:450px; padding:39px; color:var(--ink); background:#f6f0e6; transform:rotate(-2deg); box-shadow:9px 10px 0 #9e4f3926; }.studio-founder-note::before { position:absolute; top:-12px; left:50%; width:104px; height:27px; content:''; background:#9e4f3965; transform:translateX(-50%) rotate(5deg); }.studio-founder-note .studio-kicker { color:#647264; }.studio-founder-note p { margin:28px 0; font:italic clamp(27px,3vw,43px)/1.13 var(--display); letter-spacing:-.035em; color:var(--teal); }.studio-founder-note > span:last-child { color:#536153; font-size:10px; }.studio-founder h2 { margin:26px 0; font-size:clamp(48px,5.7vw,82px); }.studio-founder > div:last-child > p { max-width:420px; margin-bottom:23px; color:#465647; font-size:14px; }
.studio-close { padding-block:82px; color:var(--paper); background:var(--ink); }.studio-close-grid { display:grid; grid-template-columns:1.25fr .75fr; gap:10%; align-items:end; }.studio-close h2 { font-size:clamp(45px,6.2vw,92px); }.studio-close-grid > div > p { max-width:330px; margin-bottom:22px; color:#c6d0c2; font-size:14px; }.studio-footer { display:grid; grid-template-columns:1.15fr 1fr 1fr; gap:20px; padding-block:38px 20px; }.studio-footer-brand { display:flex; align-items:center; width:140px; height:76px; }.studio-footer-brand img { width:100%; height:auto; max-height:76px; object-fit:contain; transform:none; }.studio-footer > div:first-child > p { margin-top:14px; font:17px/1.25 var(--display); }.studio-footer nav { display:flex; flex-wrap:wrap; align-content:start; gap:10px 25px; font-size:10px; }.studio-footer nav a:hover { text-decoration:underline; text-underline-offset:5px; }.studio-footer-fine { display:flex; align-content:start; justify-content:flex-end; flex-wrap:wrap; gap:12px 20px; color:#536153; font-size:9px; }.studio-footer-fine span { flex-basis:100%; text-align:right; }
@keyframes studio-in { from { opacity:0; transform:translateY(7px); } to { opacity:1; transform:none; } }
@media (max-width:900px) { .studio-shell { width:calc(100% - 64px); }.studio-hero-inner,.studio-intent-grid,.studio-founder-grid,.studio-close-grid { gap:6%; }.studio-steps li { padding-right:20px; }.studio-steps li + li { padding-left:20px; }.studio-footer { grid-template-columns:1fr 1fr; }.studio-footer-fine { justify-content:start; }.studio-footer-fine span { text-align:left; } }
@media (max-width:700px) { .studio-shell { width:calc(100% - 40px); }.studio-nav { gap:15px; padding:8px 20px; }.studio-brand { width:95px; height:52px; }.studio-brand img { max-height:52px; }.studio-links,.studio-contact { display:none; }.studio-menu-button { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; width:40px; height:40px; margin-left:auto; color:var(--paper); background:transparent; border:0; }.studio-menu-button span { width:22px; height:1px; background:currentColor; transition:transform .2s; }.studio-menu-button[aria-expanded='true'] span:first-child { transform:translateY(3.5px) rotate(45deg); }.studio-menu-button[aria-expanded='true'] span:last-child { transform:translateY(-3.5px) rotate(-45deg); }.studio-menu { position:absolute; top:100%; right:0; left:0; display:block; padding:15px 20px 22px; background:var(--ink); border-bottom:1px solid #ffffff2c; }.studio-menu a { display:block; padding:10px 0; font-size:14px; }.studio-hero-inner,.studio-intent-grid,.studio-founder-grid,.studio-close-grid { grid-template-columns:1fr; }.studio-hero-inner { gap:48px; padding-top:68px; padding-bottom:88px; }.studio-hero h1 { font-size:clamp(61px,16.5vw,104px); }.studio-hero-note { padding:0; }.studio-hero-mark { right:20px; bottom:22px; font-size:9px; }.studio-section-head { display:block; }.studio-section-head > p { margin-top:18px; }.studio-intent { padding-block:73px; }.studio-intent-grid { margin-top:46px; }.studio-intent-copy { padding:0; }.studio-notes { padding-block:70px; }.studio-section-head-light { display:block; }.studio-section-head-light h2 { margin-top:24px; }.studio-section-head-light > p { margin-top:22px; }.studio-note-board { grid-template-columns:1fr; margin-top:42px; }.studio-note-tabs { display:flex; overflow-x:auto; border-right:0; border-bottom:1px solid #ffffff25; }.studio-note-tab { display:block; flex:0 0 110px; min-height:67px; border-bottom:0; }.studio-note-tab span { display:block; margin-bottom:5px; }.studio-note-record { min-height:405px; padding:38px 25px; }.studio-method { padding-block:72px; }.studio-steps { grid-template-columns:1fr; margin-top:43px; }.studio-steps li,.studio-steps li + li { display:grid; grid-template-columns:35px 1fr; gap:15px; min-height:0; padding:24px 0; border-right:0; border-bottom:1px solid var(--line); }.studio-steps li:last-child { border-bottom:0; }.studio-steps h3 { margin:0 0 11px; font-size:26px; }.studio-founder { padding-block:70px; }.studio-founder-note { margin:10px 5px 22px; padding:29px; }.studio-close { padding-block:66px; }.studio-close-grid { gap:28px; }.studio-footer { grid-template-columns:1fr; gap:25px; padding-block:34px 18px; }.studio-footer-brand { width:120px; height:65px; }.studio-footer-brand img { max-height:65px; }.studio-footer nav { max-width:290px; }.studio-footer-fine { justify-content:start; }.studio-footer-fine span { text-align:left; } }
@media (prefers-reduced-motion:reduce) { * { scroll-behavior:auto!important; animation-duration:.01ms!important; transition-duration:.01ms!important; } }

/* Studio revision: the methodology leads; field notes read like a working notebook. */
.studio-hero-inside .studio-hero-inner { padding-bottom:118px; }
.studio-method-first { padding-top:104px; }
.studio-method-lead { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr); gap:10%; align-items:end; margin-top:27px; }
.studio-method-lead h2 { margin:0; font-size:clamp(48px,6vw,90px); }
.studio-method-lead h2 em { color:var(--teal); }
.studio-method-lead p { max-width:335px; justify-self:end; padding-bottom:11px; color:#536153; font-size:13px; }
.studio-field-notes { padding-block:110px; background:#e7ddd0; }
.studio-field-layout { display:grid; grid-template-columns:minmax(280px,.7fr) minmax(0,1.3fr); gap:10%; align-items:start; }
.studio-field-heading { position:sticky; top:30px; }
.studio-field-heading h2 { margin:25px 0 23px; font-size:clamp(47px,5.4vw,80px); }
.studio-field-heading h2 em { color:var(--teal); }
.studio-field-heading > p { max-width:320px; color:#465647; font-size:14px; }
.studio-field-stack { display:grid; gap:18px; }
.studio-field-card { position:relative; min-height:235px; padding:30px 34px 32px; overflow:hidden; border:1px solid #0d231f1e; }
.studio-field-card::after { position:absolute; top:0; right:32px; width:1px; height:100%; content:''; background:currentColor; opacity:.1; }
.studio-field-card > span { display:block; margin-bottom:37px; font-size:10px; letter-spacing:.14em; text-transform:uppercase; opacity:.75; }
.studio-field-card h3 { max-width:590px; margin-bottom:15px; font-size:clamp(29px,3.2vw,46px); }
.studio-field-card p { position:relative; z-index:1; max-width:640px; font-size:13px; line-height:1.7; }
.studio-field-card-rust { color:#f6f0e6; background:var(--rust); }
.studio-field-card-paper { background:#f6f0e6; }
.studio-field-card-paper h3 { color:var(--teal); }
.studio-field-card-teal { color:#f6f0e6; background:var(--teal); }
.studio-field-card-sage { background:#bdc3b4; }
.studio-field-card-sage h3 { color:var(--ink); }
.studio-translation { display:grid; grid-template-columns:1.1fr .9fr; gap:12%; padding-block:112px; }
.studio-translation h2 { margin-top:27px; font-size:clamp(48px,5.8vw,84px); }
.studio-translation h2 em { color:var(--rust); }
.studio-translation > div:last-child { max-width:440px; padding-top:55px; color:#465647; font-size:15px; }
.studio-translation > div:last-child p + p { margin-top:20px; }
.studio-translation .studio-line-link { margin-top:25px; color:var(--ink); }
@media (max-width:700px) {
  .studio-hero-inside .studio-hero-inner { padding-bottom:88px; }
  .studio-method-first { padding-top:72px; }
  .studio-method-lead { grid-template-columns:1fr; gap:23px; }
  .studio-method-lead p { justify-self:start; padding:0; }
  .studio-field-notes { padding-block:72px; }
  .studio-field-layout,.studio-translation { grid-template-columns:1fr; gap:42px; }
  .studio-field-heading { position:static; }
  .studio-field-card { min-height:0; padding:26px 24px 29px; }
  .studio-field-card > span { margin-bottom:28px; }
  .studio-field-card h3 { font-size:31px; }
  .studio-translation { padding-block:72px; }
  .studio-translation > div:last-child { padding-top:0; }
}

/* Inside the Studio: one clear movement from listening to useful structure. */
.studio-hero-inside .studio-hero-inner { display:block; padding-top:105px; padding-bottom:112px; }
.studio-hero-inside h1 { max-width:none; margin:0; font-size:clamp(52px,5.8vw,82px); line-height:1.02; }
.studio-hero-inside .studio-hero-note { max-width:850px; padding:0; margin-top:34px; }
.studio-hero-inside .studio-hero-note p { max-width:820px; margin:0 0 19px; font:400 clamp(18px,1.7vw,24px)/1.45 var(--display); }
.studio-method-intro { padding-block:86px; background:#e7ddd0; }
.studio-method-intro-grid { display:block; }
.studio-method-intro h2 { font-size:clamp(41px,4.4vw,60px); line-height:1.08; }
.studio-method-intro p { max-width:980px; margin-top:18px; color:#465647; font-size:17px; line-height:1.65; }
.studio-movement { padding-block:105px; }
.studio-movement-head { display:grid; grid-template-columns:58px minmax(0,1fr); gap:0 24px; align-items:start; }
.studio-movement-number { grid-row:1 / span 2; padding-top:11px; color:var(--rust); font-size:12px; letter-spacing:.12em; }
.studio-movement-head h2 { font-size:clamp(40px,3.8vw,52px); line-height:1.08; }
.studio-movement-head > p { grid-column:2; max-width:1040px; margin-top:18px; color:#465647; font-size:17px; line-height:1.65; }
.studio-signal-grid { display:grid; grid-template-columns:repeat(4,1fr); margin-top:57px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.studio-signal-grid article { min-height:225px; padding:27px 27px 31px 0; border-right:1px solid var(--line); }
.studio-signal-grid article + article { padding-left:27px; }
.studio-signal-grid article:last-child { border-right:0; }
.studio-signal-grid h3 { color:var(--teal); font-size:clamp(24px,2.1vw,30px); line-height:1.12; }
.studio-signal-grid p { margin-top:28px; color:#536153; font-size:14px; line-height:1.7; }
.studio-movement-note { max-width:900px; margin:31px 0 0 82px; color:var(--rust); font:italic 400 clamp(21px,2vw,28px)/1.4 var(--display); }
.studio-align { color:var(--paper); background:#143a33; }
.studio-align .studio-movement-number { color:var(--soft-rust); }
.studio-align .studio-movement-head > p { color:#c6d0c2; }
.studio-align-steps { display:grid; grid-template-columns:repeat(3,1fr); margin:58px 0 0; padding:0; list-style:none; border-top:1px solid #ffffff30; border-bottom:1px solid #ffffff30; }
.studio-align-steps li { min-height:270px; padding:27px 32px 32px 0; border-right:1px solid #ffffff30; }
.studio-align-steps li + li { padding-left:32px; }
.studio-align-steps li:last-child { border-right:0; }
.studio-align-steps li > span { color:var(--soft-rust); font-size:11px; letter-spacing:.12em; }
.studio-align-steps h3 { margin-top:65px; font-size:clamp(27px,2.6vw,37px); line-height:1.1; }
.studio-align-steps p { margin-top:15px; color:#c6d0c2; font-size:14px; line-height:1.7; }
.studio-build { background:var(--paper); }
.studio-build-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:56px 0 0 82px; }
.studio-build-grid article { min-height:230px; padding:29px 30px; background:#eee7dc; border:1px solid var(--line); }
.studio-build-grid h3 { color:var(--teal); font-size:clamp(27px,2.5vw,35px); line-height:1.1; }
.studio-build-grid p { margin-top:26px; color:#536153; font-size:14px; line-height:1.7; }
.studio-build-outcome { display:flex; justify-content:space-between; align-items:flex-end; gap:50px; margin:43px 0 0 82px; }
.studio-build-outcome p { max-width:760px; color:#465647; font-size:16px; line-height:1.7; }
.studio-build-outcome .studio-line-link { flex:none; }
.studio-close-grid { display:block; }
.studio-close h2 { font-size:clamp(42px,4vw,56px); line-height:1.08; }
.studio-close-grid > div { display:flex; justify-content:space-between; align-items:flex-end; gap:40px; margin-top:26px; }
.studio-close-grid > div > p { max-width:780px; margin:0; font-size:16px; line-height:1.65; }
.studio-close-grid .studio-line-link { flex:none; }
@media (min-width:1300px) {
  .studio-hero-inside h1,.studio-method-intro h2,.studio-movement-head h2,.studio-close h2 { white-space:nowrap; }
  .studio-method-intro p { white-space:nowrap; }
}
@media (max-width:1000px) {
  .studio-signal-grid { grid-template-columns:repeat(2,1fr); }
  .studio-signal-grid article:nth-child(2) { border-right:0; }
  .studio-signal-grid article:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .studio-signal-grid article:nth-child(3) { padding-left:0; }
  .studio-build-grid { margin-left:0; }
  .studio-build-outcome { margin-left:0; }
}
@media (max-width:700px) {
  .studio-hero-inside .studio-hero-inner { padding-top:67px; padding-bottom:80px; }
  .studio-hero-inside h1 { font-size:clamp(48px,13vw,72px); }
  .studio-method-intro,.studio-movement { padding-block:68px; }
  .studio-method-intro h2,.studio-movement-head h2,.studio-close h2 { font-size:clamp(38px,10.5vw,54px); }
  .studio-method-intro p,.studio-movement-head > p,.studio-build-outcome p,.studio-close-grid > div > p { font-size:15px; }
  .studio-movement-head { grid-template-columns:1fr; }
  .studio-movement-number { grid-row:auto; padding:0 0 15px; }
  .studio-movement-head > p { grid-column:1; }
  .studio-signal-grid,.studio-align-steps,.studio-build-grid { grid-template-columns:1fr; margin-top:39px; }
  .studio-signal-grid article,.studio-signal-grid article + article,.studio-align-steps li,.studio-align-steps li + li { min-height:0; padding:25px 0; border-right:0; border-bottom:1px solid var(--line); }
  .studio-align-steps li,.studio-align-steps li + li { border-color:#ffffff30; }
  .studio-signal-grid article:last-child,.studio-align-steps li:last-child { border-bottom:0; }
  .studio-signal-grid h3,.studio-align-steps h3 { margin-top:0; }
  .studio-signal-grid p { margin-top:14px; }
  .studio-align-steps li > span { display:block; margin-bottom:17px; }
  .studio-movement-note,.studio-build-grid,.studio-build-outcome { margin-left:0; }
  .studio-build-outcome,.studio-close-grid > div { display:block; }
  .studio-build-outcome .studio-line-link,.studio-close-grid .studio-line-link { margin-top:22px; }
}