/* Tokens identical to css/street-bangkok/base.css, the site-wide foundation. */
:root{--bg:#f3f2ed;--ink:#0a0a0a;--muted:#77736c;--line:#bbb7ae;--pad:clamp(20px,3.2vw,52px);--sans:"Helvetica Neue",Helvetica,Arial,sans-serif;--serif:Georgia,"Times New Roman",serif}


body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.32;-webkit-font-smoothing:antialiased}

header{position:fixed;z-index:20;top:0;left:0;right:0;height:74px;padding:0 var(--pad);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;border-bottom:1px solid rgba(0,0,0,.12);background:rgba(245,244,240,.9);backdrop-filter:blur(12px)}
.brand{display:flex;align-items:center;gap:12px;font-family:var(--sans);font-weight:500;letter-spacing:-.02em;font-size:17px}
.logo{width:28px;height:28px;object-fit:contain}
nav{display:flex;gap:32px;font-family:var(--sans);text-transform:uppercase;font-size:11px;letter-spacing:.08em}
nav a{position:relative}
nav a.active:after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:1px;background:#111}
.lang{justify-self:end;font-family:var(--sans);font-size:11px;letter-spacing:.08em}
main{padding-top:74px}
.hero{min-height:calc(100vh - 74px);display:grid;grid-template-columns:minmax(0,1.12fr) minmax(440px,.88fr);border-bottom:1px solid var(--line)}
@media(min-width:901px){.hero{grid-template-columns:50vw minmax(0,1fr)}}
.hero-media{position:relative;overflow:hidden;background:#222;min-height:720px}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:55% 46%;display:block;transform:scale(1.015);transition:transform 1.2s cubic-bezier(.2,.65,.25,1)}
.hero.loaded .hero-media img{transform:scale(1)}
.hero-copy{padding:clamp(42px,6vw,94px) var(--pad) 48px;display:flex;flex-direction:column;justify-content:space-between}
.eyebrow{font-family:var(--sans);font-size:11px;text-transform:uppercase;letter-spacing:.12em}
h1,h2,h3{font-family:var(--sans);margin:0;font-weight:600;letter-spacing:-.045em;line-height:.92}
h1{font-size:clamp(64px,7vw,116px);max-width:7ch}
.intro{font-family:var(--sans);font-weight:400;font-size:clamp(22px,2.4vw,32px);line-height:1.3;letter-spacing:-.01em;max-width:20ch;margin-top:34px}
.intro-strong{font-weight:600}
.rule{width:38px;height:1px;background:#111;margin:32px 0}
.about-body{max-width:620px;font-size:17px;line-height:1.48}
.about-body p{margin:0 0 1.15em}
.meta{display:flex;justify-content:space-between;align-items:end;margin-top:40px;font-family:var(--sans);text-transform:uppercase;font-size:10px;letter-spacing:.12em;color:#4d4a46}
.section{padding:110px var(--pad);border-bottom:1px solid var(--line)}
.section-head{display:grid;grid-template-columns:260px 1fr;gap:40px;margin-bottom:84px}
.section-num{font-family:var(--sans);font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.section-title{font-size:clamp(58px,7vw,108px)}
.practice-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:10vw;align-items:start}
.practice-note{font-family:var(--sans);font-size:12px;text-transform:uppercase;letter-spacing:.14em;line-height:1.65;position:sticky;top:120px}
.practice-copy{font-size:clamp(24px,2.5vw,40px);line-height:1.18;max-width:29ch}
.practice-copy p{margin:0 0 1.25em}
.practice-copy .small{font-size:18px;line-height:1.5;max-width:42ch}
.services-intro{max-width:980px;margin:0 auto 66px;text-align:center}
.services-intro p{margin:0;font-size:clamp(20px,1.7vw,28px);line-height:1.35}
.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(30px,4vw,72px)}
.service{padding:0;min-height:0}
.service h3{font-family:var(--sans);font-size:20px;letter-spacing:-.02em;margin-bottom:22px;font-weight:500}
.service ul{list-style:none;margin:0;padding:0;font-family:var(--serif);font-size:15px;line-height:1.55}
.service li+li{margin-top:4px}
.clients{display:block}
.clients-head{display:flex;align-items:baseline;gap:18px;margin-bottom:42px}
.clients-head .section-num{flex:0 0 auto}
.clients h2{font-size:clamp(48px,5.4vw,82px);white-space:nowrap}
.client-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:42px;border-top:1px solid var(--line)}
.client-list div{padding:14px 0;border-bottom:1px solid var(--line);font-family:var(--sans);font-size:14px;letter-spacing:-.01em;min-width:0}

footer{padding:30px var(--pad) 36px;display:flex;justify-content:space-between;font-family:var(--sans);font-size:10px;text-transform:uppercase;letter-spacing:.12em}
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.reveal.on{opacity:1;transform:none}
@media(max-width:900px){header{grid-template-columns:1fr auto}nav{display:none}.lang{display:none}.hero{grid-template-columns:1fr}.hero-media{min-height:64vh}.hero-copy{min-height:690px}.section-head,.clients{grid-template-columns:1fr}.practice-grid{grid-template-columns:1fr;gap:50px}.practice-note{position:static}.service-grid{grid-template-columns:1fr 1fr;gap:42px 30px}.client-list{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.service-grid{grid-template-columns:1fr;gap:32px}.client-list{grid-template-columns:1fr}h1{font-size:64px}.section{padding-top:78px;padding-bottom:78px}}


/* V3 — grid and typographic alignment refinement */
:root{--grid-gap:clamp(18px,1.7vw,28px);--display-size:clamp(58px,7vw,108px)}

/* Keep all primary display titles on one optical scale */
.section-title,
.clients h2{font-size:var(--display-size);line-height:.92;letter-spacing:-.045em;font-weight:600}

/* Hero: force title, descriptor and body onto the exact same left axis */
.hero-copy{padding-left:var(--pad);padding-right:var(--pad)}
.hero-copy>div:first-child{display:block;width:100%}
.hero-copy .eyebrow,
.hero-copy h1,
.hero-copy .intro,
.hero-copy .rule{margin-left:0;padding-left:0}
.hero-copy h1{max-width:none;width:100%;text-indent:-.025em}
.hero-copy .intro{max-width:23ch;margin-top:46px}

/* One 12-column logic for every section heading */
.section-head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--grid-gap);row-gap:18px;align-items:start;margin-bottom:76px}
.section-head .section-num{grid-column:1 / span 2;padding-top:.45em}
.section-head .section-title{grid-column:4 / -1}

/* Practice follows the same 12-column skeleton */
.practice-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--grid-gap);align-items:start}
.practice-note{grid-column:1 / span 2}
.practice-copy{grid-column:4 / span 8;max-width:none}
.practice-copy .small{max-width:none}

/* Services: four equal, centered columns with identical vertical rhythm */
.services-intro{max-width:860px;margin:0 auto 58px;text-align:center}
.service-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.service{min-width:0;padding:28px clamp(18px,2.2vw,34px) 32px;text-align:center;display:flex;flex-direction:column;align-items:center}
.service+.service{border-left:1px solid var(--line)}
.service h3{font-size:18px;line-height:1.05;min-height:2.1em;margin:0 0 20px;display:flex;align-items:flex-start;justify-content:center;text-align:center;width:100%}
.service ul{font-size:15px;line-height:1.5;text-align:center;width:100%;max-width:220px}
.service li+li{margin-top:3px}

/* Clients: same title system and a clean list safely below it */
.clients{display:block}
.client-list{margin-top:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--grid-gap);border-top:1px solid var(--line)}
.client-list div{padding:14px 0;border-bottom:1px solid var(--line);font-family:var(--sans);font-size:14px;letter-spacing:-.01em;min-width:0}

@media(max-width:900px){
  .section-head{grid-template-columns:1fr;row-gap:18px;margin-bottom:52px}
  .section-head .section-num,.section-head .section-title{grid-column:auto}
  .practice-grid{grid-template-columns:1fr;row-gap:42px}
  .practice-note,.practice-copy{grid-column:auto}
  .service-grid{grid-template-columns:1fr 1fr}
  .service:nth-child(3){border-left:0;border-top:1px solid var(--line)}
  .service:nth-child(4){border-top:1px solid var(--line)}
}
@media(max-width:560px){
  .service-grid{grid-template-columns:1fr}
  .service+.service{border-left:0;border-top:1px solid var(--line)}
  .client-list{grid-template-columns:1fr}
}


/* V4 — interactive fields diagram + professional footer */
.services-intro{max-width:760px;margin-bottom:54px}
.service-explorer{display:grid;grid-template-columns:minmax(420px,0.95fr) minmax(360px,0.75fr);gap:clamp(48px,6vw,96px);align-items:center;max-width:1240px;margin:0 auto}
.service-wheel-wrap{position:relative;display:flex;align-items:center;justify-content:center;min-width:0}
.service-wheel{width:min(100%,620px);height:auto;display:block;overflow:visible}
.service-segment{cursor:pointer;outline:none}
.service-segment path{fill:#eceae4;stroke:var(--bg);stroke-width:7;transition:fill .28s ease,transform .28s ease;transform-origin:320px 320px}
.service-segment text{font-family:var(--sans);font-weight:600;letter-spacing:-.025em;font-size:23px;fill:var(--ink);pointer-events:none;text-anchor:middle;dominant-baseline:middle;transition:fill .28s ease}
.service-segment:hover path,.service-segment:focus-visible path{fill:#d7d4cc}
.service-segment.active path{fill:var(--ink)}
.service-segment.active text{fill:var(--bg)}
.service-detail{border-top:1px solid var(--line);padding-top:22px;min-height:430px}
.service-detail h3{font-family:var(--sans);font-size:clamp(34px,3.2vw,52px);line-height:.95;letter-spacing:-.045em;margin:0 0 28px;font-weight:600}
.service-detail-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.service-detail-list li{padding:14px 0;border-bottom:1px solid var(--line)}
.service-detail-list strong{display:block;font-family:var(--sans);font-size:14px;line-height:1.2;margin-bottom:5px;font-weight:500;letter-spacing:-.01em}
.service-detail-list strong:last-child{margin-bottom:0}
.service-detail-list span{display:block;font-family:var(--serif);font-size:15px;line-height:1.4;color:#393733;max-width:44ch}
.service-hint{margin-top:18px;font-family:var(--sans);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.site-footer{padding:28px var(--pad) 30px;border-top:1px solid var(--line);font-family:var(--sans);text-transform:uppercase;letter-spacing:.11em;font-size:9px;line-height:1.5}
.footer-main{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:24px;align-items:start}
.footer-main>div:nth-child(2){text-align:center}.footer-main>div:nth-child(3){text-align:right}
.footer-legal{margin-top:22px;padding-top:18px;border-top:1px solid rgba(0,0,0,.12);display:flex;justify-content:space-between;gap:20px;color:#6a6761;flex-wrap:wrap}
.footer-links{display:flex;gap:18px;justify-content:flex-end;flex-wrap:wrap}
.footer-links a{border-bottom:1px solid transparent}.footer-links a:hover{border-bottom-color:currentColor}
@media(max-width:900px){.service-explorer{grid-template-columns:1fr;gap:42px}.service-wheel{width:min(100%,560px)}.service-detail{min-height:0}.footer-main{grid-template-columns:1fr}.footer-main>div:nth-child(2),.footer-main>div:nth-child(3){text-align:left}.footer-links{justify-content:flex-start}}
@media(max-width:560px){.service-explorer{display:block}.service-wheel{width:100%;margin-bottom:34px}.service-segment text{font-size:18px}.service-detail h3{font-size:38px}.footer-legal{display:block}.footer-legal span{display:block;margin-bottom:7px}}



/* V5/V6 — practice gallery alignment + footer refinement */
.practice-media{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--grid-gap);row-gap:22px;margin-top:72px;align-items:start}
.practice-media figure{margin:0;min-width:0}
.practice-media .image-wrap{overflow:hidden;background:#e8e5de;aspect-ratio:4/5}
.practice-media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.65,.25,1)}
.practice-media .pm-1 img{object-position:50% 52%}
.practice-media .pm-2 img{object-position:55% 54%}
.practice-media .pm-3 img{object-position:50% 50%}
.practice-media .pm-4 img{object-position:50% 42%}
.practice-media figure:hover img{transform:scale(1.018)}
.practice-media figcaption{padding-top:10px;font-family:var(--sans);font-size:9px;line-height:1.35;text-transform:uppercase;letter-spacing:.11em;color:#56534e;text-align:center}
.practice-media figcaption span{display:block}
.practice-media figcaption span:last-child{margin-top:2px;color:#85817a}
.practice-media-row{grid-column:2 / span 10;display:flex;align-items:flex-start;justify-content:center;gap:var(--grid-gap);flex-wrap:nowrap;width:100%}
.practice-media-row figure{flex:0 0 calc((100% - (3 * var(--grid-gap))) / 4)}
.practice-media-caption{grid-column:3 / span 8;margin-top:2px;font-family:var(--serif);font-size:16px;line-height:1.45;color:#3c3935;text-align:center}

.site-footer{padding:0 var(--pad) 26px;border-top:1px solid var(--line);font-family:var(--sans);text-transform:uppercase;letter-spacing:.11em;font-size:9px;line-height:1.45}
.footer-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--grid-gap);padding:34px 0 28px;align-items:start}
.footer-cell{min-width:0;padding-right:12px}
.footer-cell .footer-label{display:block;color:#8a867f;margin-bottom:11px;font-size:8px;letter-spacing:.14em}
.footer-cell strong,.footer-cell a,.footer-cell span{display:block;font-size:10px;font-weight:500;letter-spacing:.1em;color:var(--ink);margin:0 0 5px;line-height:1.45;overflow-wrap:anywhere}
.footer-contact a{border-bottom:1px solid transparent;width:max-content;max-width:100%}
.footer-contact a:hover{border-bottom-color:currentColor}
.footer-bottom{border-top:1px solid rgba(0,0,0,.13);padding-top:16px;display:grid;grid-template-columns:1fr 1fr;gap:var(--grid-gap);align-items:start;color:#6f6b65}
.footer-copyright{min-width:0}
.footer-legal{margin:0;padding:0;border:0;display:flex;justify-content:flex-end;gap:20px;flex-wrap:wrap;color:#6f6b65;min-width:0}

@media(max-width:900px){
  .practice-media{margin-top:56px}
  .practice-media-row{grid-column:1 / -1;overflow-x:auto;justify-content:flex-start;padding-bottom:8px}
  .practice-media-row figure{flex:0 0 220px}
  .practice-media-caption{grid-column:2 / span 10}
  .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px var(--grid-gap)}
  .footer-bottom{grid-template-columns:1fr;gap:10px}
  .footer-legal{justify-content:flex-start}
}
@media(max-width:560px){
  .practice-media-row{grid-column:1 / -1;overflow-x:auto;justify-content:flex-start}
  .practice-media-row figure{flex:0 0 190px}
  .practice-media-caption{grid-column:1 / -1;text-align:left}
  .footer-grid{grid-template-columns:1fr;gap:24px}
  .footer-cell{padding-right:0}
  .footer-bottom{display:block}
  .footer-legal{display:flex;margin-top:10px;gap:8px 16px}
}



/* V10 — footer reproduced from supplied reference */
.site-footer{
  padding:0 var(--pad) 16px;
  border-top:0;
  background:var(--bg);
  font-family:var(--sans);
  text-transform:uppercase;
  letter-spacing:.105em;
  color:var(--ink);
}
.footer-reference-grid{
  width:min(100%,1500px);
  margin:0 auto;
  padding:30px 0 14px;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  column-gap:clamp(56px,8vw,150px);
  align-items:start;
  text-align:center;
}
.footer-reference-col{min-width:0;display:flex;flex-direction:column;align-items:center}
.footer-reference-label{
  margin:0 0 16px;
  font-size:9px;
  line-height:1;
  font-weight:500;
  letter-spacing:.17em;
  color:#908c85;
}
.footer-reference-col a,
.footer-reference-col span{
  display:block;
  margin:0 0 8px;
  padding:0;
  font-size:11px;
  line-height:1.35;
  font-weight:600;
  letter-spacing:.105em;
  color:var(--ink);
  text-decoration:none;
  overflow-wrap:anywhere;
}
.footer-reference-col a{border-bottom:1px solid transparent;transition:border-color .2s ease,opacity .2s ease}
.footer-reference-col a:hover{border-bottom-color:currentColor}
.footer-reference-col a:focus-visible{outline:1px solid currentColor;outline-offset:4px}
.footer-reference-bottom{
  width:100%;
  margin:22px auto 0;
  text-align:center;
  color:#85817a;
  font-size:10px;
  line-height:1.5;
  letter-spacing:.12em;
}
.footer-reference-bottom .copyright-line,
.footer-reference-bottom .rights-line{display:block}
.footer-reference-legal{
  margin-top:22px;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:28px;
  flex-wrap:wrap;
}
.footer-reference-legal a{
  color:#77736d;
  font-size:10px;
  line-height:1;
  letter-spacing:.12em;
  text-decoration:none;
  border-bottom:1px solid transparent;
}
.footer-reference-legal a:hover{border-bottom-color:currentColor}
.footer-reference-legal a:focus-visible{outline:1px solid currentColor;outline-offset:4px}
@media(max-width:760px){
  .footer-reference-grid{grid-template-columns:1fr;row-gap:32px;padding-top:34px}
  .footer-reference-bottom{margin-top:26px}
}



/* V12 — exact reference footer, isolated from prior footer rules */
#eb-footer.eb-footer{
  margin:0;
  padding:31px var(--pad) 12px;
  border:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  text-transform:uppercase;
  letter-spacing:.105em;
}
#eb-footer .eb-footer-top{
  width:min(100%,1500px);
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  column-gap:clamp(60px,8vw,150px);
  align-items:start;
  text-align:center;
}
#eb-footer .eb-footer-col{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:center;
}
#eb-footer .eb-footer-label{
  margin:0 0 17px;
  color:#908c85;
  font-size:9px;
  line-height:1;
  font-weight:500;
  letter-spacing:.17em;
}
#eb-footer .eb-footer-col a,
#eb-footer .eb-footer-col span{
  display:block;
  margin:0 0 7px;
  padding:0;
  color:var(--ink);
  font-size:11px;
  line-height:1.42;
  font-weight:600;
  letter-spacing:.105em;
  text-align:center;
  text-decoration:none;
  white-space:normal;
}
#eb-footer .eb-footer-col a{
  border-bottom:1px solid transparent;
  transition:opacity .18s ease,border-color .18s ease;
}
#eb-footer .eb-footer-col a:hover{opacity:.58;border-bottom-color:currentColor}
#eb-footer .eb-footer-col a:focus-visible{outline:1px solid currentColor;outline-offset:4px}
#eb-footer .eb-footer-bottom{
  width:100%;
  margin:34px auto 0;
  text-align:center;
  color:#85817a;
}
#eb-footer .eb-footer-copy,
#eb-footer .eb-footer-rights{
  display:block;
  margin:0;
  font-size:10px;
  line-height:1.55;
  font-weight:400;
  letter-spacing:.12em;
}
#eb-footer .eb-footer-legal{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:31px;
  margin-top:23px;
}
#eb-footer .eb-footer-legal a{
  color:#77736d;
  font-size:10px;
  line-height:1;
  font-weight:400;
  letter-spacing:.12em;
  text-decoration:none;
  border-bottom:1px solid transparent;
}
#eb-footer .eb-footer-legal a:hover{border-bottom-color:currentColor}
#eb-footer .eb-footer-legal a:focus-visible{outline:1px solid currentColor;outline-offset:4px}
@media(max-width:760px){
  #eb-footer.eb-footer{padding-top:28px}
  #eb-footer .eb-footer-top{grid-template-columns:1fr;row-gap:29px}
  #eb-footer .eb-footer-bottom{margin-top:32px}
  #eb-footer .eb-footer-legal{gap:20px;flex-wrap:wrap}
}


/* V13 — exact footer reset + reference layout */
#eb-footer.eb-footer{
  display:block !important;
  width:100% !important;
  margin:0 !important;
  padding:30px var(--pad) 14px !important;
  border:0 !important;
  background:var(--bg) !important;
  color:var(--ink) !important;
  font-family:var(--sans) !important;
  text-transform:uppercase !important;
  letter-spacing:.105em !important;
  justify-content:initial !important;
  align-items:initial !important;
}
#eb-footer *{box-sizing:border-box}
#eb-footer .eb-footer-top{
  width:min(100%,1380px) !important;
  margin:0 auto !important;
  padding:0 !important;
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  column-gap:clamp(70px,8vw,160px) !important;
  align-items:start !important;
  justify-items:stretch !important;
}
#eb-footer .eb-footer-col{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:flex-start !important;
  min-width:0 !important;
  text-align:center !important;
}
#eb-footer .eb-footer-label{
  display:block !important;
  margin:0 0 17px !important;
  padding:0 !important;
  color:#8f8a83 !important;
  font-size:9px !important;
  line-height:1 !important;
  font-weight:500 !important;
  letter-spacing:.16em !important;
}
#eb-footer .eb-footer-col a,
#eb-footer .eb-footer-col span{
  display:block !important;
  margin:0 0 7px !important;
  padding:0 !important;
  color:var(--ink) !important;
  font-size:11px !important;
  line-height:1.42 !important;
  font-weight:600 !important;
  letter-spacing:.105em !important;
  text-align:center !important;
  text-decoration:none !important;
  white-space:normal !important;
}
#eb-footer .eb-footer-col a{
  width:max-content !important;
  max-width:100% !important;
  border-bottom:1px solid transparent !important;
}
#eb-footer .eb-footer-col a:hover{border-bottom-color:currentColor !important;opacity:.58}
#eb-footer .eb-footer-bottom{
  display:block !important;
  width:100% !important;
  margin:29px auto 0 !important;
  padding:0 !important;
  text-align:center !important;
  color:#85817a !important;
}
#eb-footer .eb-footer-copy,
#eb-footer .eb-footer-rights{
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  color:#85817a !important;
  font-size:10px !important;
  line-height:1.55 !important;
  font-weight:400 !important;
  letter-spacing:.12em !important;
  text-align:center !important;
}
#eb-footer .eb-footer-legal{
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  gap:31px !important;
  margin:22px 0 0 !important;
  padding:0 !important;
  border:0 !important;
  text-align:center !important;
  color:#77736d !important;
}
#eb-footer .eb-footer-legal a{
  display:inline-block !important;
  margin:0 !important;
  padding:0 !important;
  color:#77736d !important;
  font-size:10px !important;
  line-height:1 !important;
  font-weight:400 !important;
  letter-spacing:.12em !important;
  text-decoration:none !important;
  border-bottom:1px solid transparent !important;
}
#eb-footer .eb-footer-legal a:hover{border-bottom-color:currentColor !important}
@media(max-width:760px){
  #eb-footer.eb-footer{padding:28px var(--pad) 20px !important}
  #eb-footer .eb-footer-top{
    grid-template-columns:1fr !important;
    row-gap:30px !important;
  }
  #eb-footer .eb-footer-bottom{margin-top:32px !important}
  #eb-footer .eb-footer-legal{gap:20px !important;flex-wrap:wrap !important}
}


/* Hero name uses the same title typography as the "Let's work together" footer heading. */
.hero-copy h1{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:600;line-height:.9;letter-spacing:-.055em;text-transform:uppercase}

/* Rotating point at the centre of the fields diagram (see js/studio.js). */
.service-point{cursor:default;pointer-events:all}
.service-point circle{pointer-events:all}
#servicePoint{will-change:transform}

/* Longer clients title on narrow screens: keep "COLLABORATIONS" inside the viewport. */
@media(max-width:700px){#clients .section-title{font-size:min(58px,9.4vw);overflow-wrap:anywhere}}


/* Typography harmonisation: reuse the site-wide type system (see css/street-bangkok/base.css, projects.css, contact.css, home.css). */
/* Editorial copy = Georgia, as in the project pages' .intro-copy / .flow-phrase */
.about-body,.practice-copy,.services-intro,.practice-media-caption{font-family:var(--serif)}
/* Statement-size phrases: .flow-phrase p (tracking -.025em, line-height 1.08) */
.practice-copy>p:first-child,.services-intro p{line-height:1.08;letter-spacing:-.025em}
/* Reading copy: .intro-copy (clamp(19px,1.45vw,27px), 1.12) with the .9em paragraph rhythm used on project pages */
.about-body,.practice-copy .small{font-size:clamp(19px,1.45vw,27px);line-height:1.2;color:var(--ink)}
.about-body p,.practice-copy .small{margin:0 0 .9em}
.about-body p:last-child{margin-bottom:0}
.practice-media-caption{font-size:clamp(19px,1.45vw,27px);line-height:1.2;color:var(--ink)}
/* Page/section titles: same weight and case as the Projects, Research and Contact titles (500, uppercase) */
.section-title,.clients h2{font-weight:500;text-transform:uppercase}
/* Small uppercase labels: 10px / .12em muted, as .contact-kicker, .field-label, .meta-label and .home-info p */
.eyebrow,.meta,.practice-note{font-size:10px;letter-spacing:.12em;line-height:1.8;color:var(--muted)}
.eyebrow{font-size:11px;line-height:1.2}
.practice-media figcaption{font-size:9px;letter-spacing:.09em;color:var(--muted)}
.practice-media figcaption span:last-child{color:var(--muted)}
/* Wheel: display titles at the site's medium weight, list rows as the Projects index captions */
.service-segment text{font-weight:500}
.service-detail h3{font-weight:500}
.service-detail-list strong,.client-list div{font-size:14px;font-weight:500;line-height:1.35;letter-spacing:normal}

/* Content cleanup: the hero eyebrow/meta labels, the Practice "Context/Material/Use/Identity" list and the
   practice-media captions were removed as decorative micro-labels. The remaining blocks no longer need
   space distributed or reserved around them. */

/* Precise vertical relationship to the photo (desktop only — mobile/tablet keep their natural stacked flow):
   the name's top sits on the photo's top edge, the intro's bottom sits on the photo's bottom edge. The photo
   column is exactly 50vw wide (its right edge lands on the viewport's centre) rather than an fr-ratio guess.
   The "rule" divider is lifted out of the flex flow (it has no measured role in this alignment) and kept as a
   small mark just past the intro's bottom. */
@media(min-width:901px){
  .hero-copy{padding-top:0;padding-bottom:0;justify-content:stretch}
  .hero-copy>div:first-child{height:100%;display:flex;flex-direction:column;justify-content:space-between;position:relative}
  .hero-copy .rule{position:absolute;left:0;bottom:-40px;margin:0}
}

/* Bio / Practice / Services: read from a plain ~1cm left margin instead of the inner 12-column grid's
   column-4 offset (Clients keeps that grid, unchanged, as it isn't part of this request). */
@media(min-width:901px){
  #bio,#practice,#services{padding-left:1cm}
  #bio .section-head .section-title,
  #practice .section-head .section-title,
  #services .section-head .section-title{grid-column:1 / -1}
  #bio .about-body,
  #practice .practice-copy{grid-column:1 / -1}
  #services .services-intro{margin-left:0;margin-right:0;text-align:left}
}