/* ============ TOKENS ============ */
:root{
  --paper:        #F1ECE2;
  --paper-2:      #E8E1D2;
  --paper-3:      #DCD3BF;
  --ink:          #14110C;
  --ink-2:        #3A332A;
  --ink-3:        #6B6354;
  --ink-4:        #9A9180;
  --rule:         #1A1611;
  --rule-soft:    #B8AE99;
  --rule-hair:    #D8CFB8;
  --accent:       #7A3B16;       /* burnt sienna - sparingly */
  --accent-deep:  #4A2310;
  --midnight:     #0E1626;       /* deep night - vienna */
  --gold:         #B8954F;

  --display:      "Bodoni Moda", "Didot", "Bodoni 72", serif;
  --serif:        "Crimson Pro", "Garamond", "Times New Roman", serif;
  --sans:         "Space Grotesk", -apple-system, "Helvetica Neue", sans-serif;
  --mono:         "JetBrains Mono", ui-monospace, "SF Mono", monospace;
}

*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--paper);scroll-behavior:smooth}
body{
  font-family:var(--serif);
  color:var(--ink);
  background:var(--paper);
  font-size:18px;
  line-height:1.55;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul,ol{list-style:none}

::selection{background:var(--ink);color:var(--paper)}

/* film grain on paper */
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:1;
  background-image:
    radial-gradient(circle at 20% 30%, rgba(20,17,12,.018) 0, transparent 40%),
    radial-gradient(circle at 80% 70%, rgba(20,17,12,.015) 0, transparent 50%);
  mix-blend-mode:multiply;
}

/* ============ TYPE PRIMITIVES ============ */
.meta{
  font-family:var(--mono);
  font-size:10.5px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--ink-3);
  font-weight:400;
}
.meta--ink{color:var(--ink)}
.meta--accent{color:var(--accent)}
.meta--paper{color:var(--paper)}

.dot{
  display:inline-block;width:5px;height:5px;border-radius:50%;
  background:var(--accent);vertical-align:middle;margin:0 10px 3px;
}
.rule{height:1px;background:var(--rule);width:100%}
.rule--hair{background:var(--rule-soft)}

.italic{font-style:italic}
em{font-style:italic;font-family:var(--display);font-weight:500}

/* ============ LAYOUT GRID ============ */
.wrap{
  max-width:1440px;margin:0 auto;padding:0 64px;
}
.wrap--wide{max-width:1600px}
.grid12{display:grid;grid-template-columns:repeat(12,1fr);gap:32px}

/* ============ TOP CHROME ============ */
.topbar{
  position:fixed;top:0;left:0;right:0;z-index:50;
  background:rgba(241,236,226,.92);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--rule-hair);
  transition:background .3s, border-color .3s;
}
.topbar__inner{
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;
  padding:18px 64px;gap:48px;
}
.brand{
  display:flex;align-items:baseline;gap:14px;
}
.brand__mark{
  font-family:var(--display);
  font-weight:600;
  font-size:30px;
  letter-spacing:-.01em;
  font-variation-settings:"opsz" 96;
  line-height:1;
}
.brand__sep{
  width:1px;height:18px;background:var(--ink);opacity:.4;
  align-self:center;
}
.brand__sub{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--ink-3);line-height:1.4;
  max-width:180px;
}
.nav{
  display:flex;justify-content:center;gap:44px;
}
.nav a{
  font-family:var(--mono);font-size:11px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--ink-2);
  position:relative;padding:6px 0;
  transition:color .2s;
}
.nav a:hover{color:var(--accent)}
.nav a.is-active::after{
  content:"";position:absolute;bottom:-2px;left:50%;width:4px;height:4px;
  background:var(--accent);border-radius:50%;transform:translateX(-50%);
}
.nav a span{
  font-family:var(--mono);font-size:9px;color:var(--ink-4);
  margin-right:6px;letter-spacing:.1em;
}
.toolbar{
  display:flex;align-items:center;gap:16px;
}
.lang{
  position:relative;
}
.lang__btn{
  display:flex;align-items:center;gap:8px;padding:10px 14px;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--ink-2);
  border:1px solid var(--rule-soft);background:transparent;
  transition:border-color .2s,color .2s;
}
.lang__btn:hover{border-color:var(--ink);color:var(--ink)}
.lang__btn svg{width:9px;height:9px;transition:transform .25s}
.lang.is-open .lang__btn svg{transform:rotate(180deg)}
.lang__menu{
  position:absolute;top:calc(100% + 6px);right:0;
  min-width:200px;background:var(--paper);
  border:1px solid var(--rule-soft);
  padding:8px 0;
  opacity:0;pointer-events:none;
  transform:translateY(-4px);
  transition:opacity .2s,transform .2s;
  box-shadow:0 24px 40px -20px rgba(20,17,12,.25);
}
.lang.is-open .lang__menu{opacity:1;pointer-events:auto;transform:none}
.lang__item{
  display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:16px;
  width:100%;padding:11px 18px;text-align:left;
  font-family:var(--serif);font-size:16px;color:var(--ink);
  transition:background .15s;
}
.lang__item:hover{background:var(--paper-2)}
.lang__item.is-current{background:var(--paper-2)}
.lang__item.is-current .lang__code{color:var(--accent)}
.lang__code{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ink-3);
}

.cta-link{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--mono);font-size:11px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--ink);
  padding:10px 18px;
  border:1px solid var(--ink);
  background:var(--ink);color:var(--paper);
  transition:background .2s,color .2s;
}
.cta-link:hover{background:var(--accent);border-color:var(--accent)}
.cta-link svg{width:11px;height:11px}

/* ============ ROUTING ============ */
.page{display:none}
.page.is-active{display:block}
main{padding-top:73px}

/* ============ HERO ============ */
.hero{
  position:relative;
  padding:60px 0 120px;
  overflow:hidden;
}
.hero__topline{
  display:grid;grid-template-columns:1fr auto 1fr;
  align-items:center;gap:24px;
  padding:0 64px;
  margin-bottom:48px;
}
.hero__topline-rule{height:1px;background:var(--rule)}
.hero__topline-text{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--ink-3);text-align:center;
  white-space:nowrap;
}

.hero__lockup{
  font-family:var(--display);
  font-weight:600;
  font-variation-settings:"opsz" 144;
  font-size:clamp(180px,21vw,320px);
  line-height:.82;
  letter-spacing:-.045em;
  color:var(--ink);
  text-align:center;
  padding:0 32px;
  position:relative;
}
.hero__lockup::before,.hero__lockup::after{
  content:"";position:absolute;top:50%;width:80px;height:1px;
  background:var(--ink);
}
.hero__lockup::before{left:64px}
.hero__lockup::after{right:64px}

.hero__below{
  display:grid;grid-template-columns:1fr 1fr 1fr;gap:48px;
  padding:64px 64px 0;
  border-top:1px solid var(--rule-hair);
  margin-top:64px;
}
.hero__below > div{padding-top:32px}
.hero__caption{
  font-family:var(--display);
  font-weight:400;
  font-style:italic;
  font-size:34px;line-height:1.15;letter-spacing:-.015em;
  color:var(--ink);
  font-variation-settings:"opsz" 72;
}
.hero__caption em{
  font-style:normal;color:var(--accent);
}
.hero__lead{
  font-family:var(--serif);font-size:17px;line-height:1.6;color:var(--ink-2);
  font-weight:400;
}
.hero__lead p+p{margin-top:14px}
.hero__stats{
  display:flex;flex-direction:column;gap:18px;
  border-left:1px solid var(--rule-soft);padding-left:32px;
}
.hero__stat{
  display:grid;grid-template-rows:auto auto;gap:4px;
}
.hero__stat-num{
  font-family:var(--display);font-weight:500;font-size:42px;line-height:1;
  letter-spacing:-.02em;color:var(--ink);
  font-variation-settings:"opsz" 96;
}
.hero__stat-num em{color:var(--accent);font-style:italic}
.hero__stat-lbl{
  font-family:var(--mono);font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ink-3);
}

.hero__scroll{
  position:absolute;bottom:32px;left:50%;transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:14px;
}
.hero__scroll-line{
  width:1px;height:48px;background:var(--ink);
  animation:scrollPulse 2.4s ease-in-out infinite;
  transform-origin:top;
}
@keyframes scrollPulse{
  0%,100%{transform:scaleY(0);opacity:0}
  50%{transform:scaleY(1);opacity:1}
}
.hero__scroll-text{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--ink-3);
}

/* ============ KREDO (manifesto) ============ */
.kredo{
  background:var(--ink);color:var(--paper);
  padding:160px 0;
  position:relative;
  overflow:hidden;
}
.kredo__inner{
  max-width:1240px;margin:0 auto;padding:0 64px;
  display:grid;grid-template-columns:auto 1fr;gap:80px;align-items:start;
}
.kredo__sidebar{
  border-right:1px solid rgba(241,236,226,.18);padding-right:48px;
  display:flex;flex-direction:column;gap:24px;
}
.kredo__num{
  font-family:var(--display);font-weight:300;font-size:120px;line-height:.85;
  letter-spacing:-.03em;color:var(--paper);opacity:.9;
  font-variation-settings:"opsz" 144;
}
.kredo__num em{color:var(--gold);font-style:italic}
.kredo__sidebar-label{
  font-family:var(--mono);font-size:10px;letter-spacing:.22em;
  text-transform:uppercase;color:rgba(241,236,226,.55);
}
.kredo__body{
  font-family:var(--display);
  font-weight:400;
  font-size:60px;
  line-height:1.08;
  letter-spacing:-.018em;
  color:var(--paper);
  font-variation-settings:"opsz" 96;
}
.kredo__body em{color:var(--gold)}
.kredo__quote{
  font-style:italic;color:rgba(241,236,226,.72);
  font-family:var(--display);
}
.kredo__sign{
  margin-top:48px;
  display:flex;align-items:center;gap:18px;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;
  text-transform:uppercase;color:rgba(241,236,226,.55);
}
.kredo__sign-line{flex:0 0 60px;height:1px;background:rgba(241,236,226,.4)}

/* ============ LEDGER (practices) ============ */
.ledger{
  padding:140px 0 40px;background:var(--paper);
}
.ledger__head{
  display:grid;grid-template-columns:1fr 2fr;gap:64px;
  padding:0 64px;margin-bottom:80px;align-items:end;
}
.ledger__eyebrow{
  display:flex;align-items:baseline;gap:18px;margin-bottom:32px;
}
.ledger__h{
  font-family:var(--display);font-weight:500;font-size:96px;
  line-height:.92;letter-spacing:-.025em;color:var(--ink);
  font-variation-settings:"opsz" 144;
  max-width:14ch;
}
.ledger__h em{color:var(--accent);font-style:italic;font-weight:400}
.ledger__intro{
  font-family:var(--serif);font-size:20px;line-height:1.55;color:var(--ink-2);
  max-width:52ch;
}
.ledger__intro::before{
  content:"";display:block;width:48px;height:1px;background:var(--ink);
  margin-bottom:24px;
}

.ledger__list{
  border-top:1px solid var(--rule);
}
.ledger__row{
  display:grid;grid-template-columns:120px minmax(0,1fr) 280px 60px;
  gap:48px;align-items:start;
  padding:36px 64px;
  border-bottom:1px solid var(--rule-hair);
  cursor:pointer;
  transition:background .35s, color .35s;
  position:relative;
}
.ledger__row:hover{background:var(--paper-2)}
.ledger__row::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:0;
  background:var(--ink);transition:width .35s ease;
}
.ledger__row:hover::before{width:3px}

.ledger__roman{
  font-family:var(--display);font-weight:400;font-size:80px;
  line-height:.92;letter-spacing:-.02em;color:var(--ink);
  font-variation-settings:"opsz" 144;
  font-style:italic;
  transition:color .35s;
}
.ledger__row:hover .ledger__roman{color:var(--accent)}

.ledger__title-wrap{padding-top:18px}
.ledger__title{
  font-family:var(--display);font-weight:500;font-size:40px;
  line-height:1.1;letter-spacing:-.018em;color:var(--ink);
  font-variation-settings:"opsz" 96;
  margin-bottom:14px;
}
.ledger__sum{
  font-family:var(--serif);font-size:16px;line-height:1.55;
  color:var(--ink-3);max-width:60ch;
}

.ledger__count-wrap{
  padding-top:24px;
  display:flex;flex-direction:column;gap:6px;align-items:flex-start;
  border-left:1px solid var(--rule-hair);padding-left:32px;
}
.ledger__count-num{
  font-family:var(--display);font-weight:500;font-size:36px;line-height:1;
  color:var(--ink);font-variation-settings:"opsz" 96;
}
.ledger__count-lbl{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--ink-3);
}

.ledger__chev{
  padding-top:30px;display:flex;justify-content:flex-end;
}
.ledger__chev svg{
  width:36px;height:36px;
  transition:transform .35s ease;
}
.ledger__row:hover .ledger__chev svg{transform:translateX(8px)}

/* ============ BRIDGE (Wien × Київ) ============ */
.bridge{
  background:var(--midnight);
  color:var(--paper);
  padding:120px 0;
  position:relative;
  overflow:hidden;
}
.bridge::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(ellipse at 20% 30%, rgba(184,149,79,.08), transparent 50%),
    radial-gradient(ellipse at 80% 70%, rgba(122,59,22,.08), transparent 50%);
}
.bridge__inner{
  max-width:1440px;margin:0 auto;padding:0 64px;position:relative;
}
.bridge__head{
  display:flex;align-items:baseline;gap:24px;margin-bottom:80px;
}
.bridge__head .meta{color:rgba(241,236,226,.55)}
.bridge__head-rule{flex:1;height:1px;background:rgba(241,236,226,.2)}

.bridge__cities{
  display:grid;grid-template-columns:1fr auto 1fr;gap:64px;align-items:center;
}
.bridge__city{
  display:flex;flex-direction:column;gap:32px;
}
.bridge__city--right{align-items:flex-end;text-align:right}
.bridge__city-meta{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;
  text-transform:uppercase;color:rgba(241,236,226,.55);
}
.bridge__city-name{
  font-family:var(--display);font-weight:400;font-size:140px;line-height:.85;
  letter-spacing:-.04em;color:var(--paper);
  font-variation-settings:"opsz" 144;
  font-style:italic;
}
.bridge__city-name em{color:var(--gold);font-style:normal}
.bridge__city-detail{
  font-family:var(--serif);font-size:18px;line-height:1.55;
  color:rgba(241,236,226,.78);max-width:36ch;
}
.bridge__city-time{
  display:flex;align-items:baseline;gap:12px;
}
.bridge__city-time-h{
  font-family:var(--display);font-weight:300;font-size:54px;line-height:1;
  color:var(--paper);font-variation-settings:"opsz" 96;
  letter-spacing:-.02em;
  font-feature-settings:"tnum";
}
.bridge__city-time-l{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;
  text-transform:uppercase;color:rgba(241,236,226,.5);
}

.bridge__center{
  display:flex;flex-direction:column;align-items:center;gap:24px;
  padding:0 24px;
}
.bridge__delta{
  font-family:var(--display);font-weight:400;font-style:italic;
  font-size:34px;color:var(--gold);
  font-variation-settings:"opsz" 72;
}
.bridge__delta-line{width:1px;height:140px;background:rgba(241,236,226,.3)}
.bridge__delta-lbl{
  font-family:var(--mono);font-size:10px;letter-spacing:.22em;
  text-transform:uppercase;color:rgba(241,236,226,.55);
  text-align:center;line-height:1.6;
}

.bridge__foot{
  margin-top:96px;padding-top:48px;
  border-top:1px solid rgba(241,236,226,.2);
  display:grid;grid-template-columns:1fr 1fr;gap:64px;
}
.bridge__foot-line{
  font-family:var(--display);font-weight:400;font-style:italic;
  font-size:32px;line-height:1.2;color:var(--paper);
  font-variation-settings:"opsz" 72;
}
.bridge__foot-line em{color:var(--gold);font-style:normal}
.bridge__foot-meta{
  font-family:var(--serif);font-size:16px;line-height:1.6;
  color:rgba(241,236,226,.7);max-width:42ch;
  align-self:end;
}

/* ============ APPROACH ============ */
.approach{
  background:var(--paper);
  padding:160px 0;
}
.approach__head{
  padding:0 64px;display:grid;grid-template-columns:1fr 1fr;gap:64px;
  align-items:end;margin-bottom:96px;
}
.approach__h{
  font-family:var(--display);font-weight:500;font-size:96px;
  line-height:.92;letter-spacing:-.025em;color:var(--ink);
  font-variation-settings:"opsz" 144;
  max-width:11ch;
}
.approach__h em{color:var(--accent);font-style:italic;font-weight:400}
.approach__lead{
  font-family:var(--serif);font-size:20px;line-height:1.55;color:var(--ink-2);
  max-width:52ch;justify-self:end;
}

.approach__steps{
  padding:0 64px;
  display:grid;grid-template-columns:repeat(4,1fr);gap:0;
  border-top:1px solid var(--rule);
}
.approach__step{
  padding:48px 32px 56px;
  border-right:1px solid var(--rule-hair);
  position:relative;
  transition:background .3s;
}
.approach__step:last-child{border-right:0}
.approach__step:hover{background:var(--paper-2)}
.approach__step-n{
  font-family:var(--mono);font-size:11px;letter-spacing:.22em;
  color:var(--accent);text-transform:uppercase;
  margin-bottom:48px;
}
.approach__step-h{
  font-family:var(--display);font-weight:500;font-size:32px;line-height:1.05;
  letter-spacing:-.015em;color:var(--ink);margin-bottom:18px;
  font-variation-settings:"opsz" 72;
}
.approach__step-p{
  font-family:var(--serif);font-size:15.5px;line-height:1.6;color:var(--ink-2);
}
.approach__step-icon{
  width:40px;height:40px;margin-bottom:32px;
  display:flex;align-items:center;justify-content:center;
}

/* ============ PARTNERS ============ */
.partners{
  background:var(--paper-2);
  padding:120px 0;
  border-top:1px solid var(--rule-hair);
  border-bottom:1px solid var(--rule-hair);
}
.partners__head{
  padding:0 64px;display:flex;justify-content:space-between;align-items:baseline;
  margin-bottom:64px;
}
.partners__h{
  font-family:var(--display);font-weight:500;font-size:54px;line-height:1;
  letter-spacing:-.02em;color:var(--ink);
  font-variation-settings:"opsz" 96;
}
.partners__h em{font-style:italic;color:var(--accent);font-weight:400}
.partners__grid{
  padding:0 64px;
  display:grid;grid-template-columns:repeat(4,1fr);gap:0;
  border:1px solid var(--rule-soft);
  background:var(--paper);
}
.partner{
  aspect-ratio:5/3;
  display:flex;align-items:center;justify-content:center;
  border-right:1px solid var(--rule-hair);
  border-bottom:1px solid var(--rule-hair);
  padding:32px;background:var(--paper);
  transition:background .25s;
}
.partner:nth-child(4n){border-right:0}
.partner:nth-last-child(-n+4){border-bottom:0}
.partner:hover{background:var(--paper-2)}
.partner img{
  max-height:80px;max-width:160px;
  filter:grayscale(1) contrast(1.05);opacity:.78;
  transition:opacity .25s,filter .25s;
}
.partner:hover img{opacity:1;filter:none}

/* ============ CONTACT BLOCK ============ */
.cblock{
  padding:160px 0;background:var(--paper);
  position:relative;
}
.cblock__inner{
  padding:0 64px;
  display:grid;grid-template-columns:1.3fr 1fr;gap:96px;align-items:center;
}
.cblock__left .meta{margin-bottom:24px;color:var(--accent)}
.cblock__h{
  font-family:var(--display);font-weight:500;font-size:88px;line-height:.95;
  letter-spacing:-.03em;color:var(--ink);
  font-variation-settings:"opsz" 144;
  margin-bottom:48px;
}
.cblock__h em{font-style:italic;color:var(--accent);font-weight:400}
.cblock__cta{
  display:inline-flex;align-items:center;gap:18px;
  padding:24px 36px 24px 32px;
  background:var(--ink);color:var(--paper);
  font-family:var(--mono);font-size:12px;letter-spacing:.2em;
  text-transform:uppercase;
  transition:background .25s, padding-right .25s;
}
.cblock__cta:hover{background:var(--accent);padding-right:48px}
.cblock__cta svg{width:14px;height:14px;transition:transform .25s}
.cblock__cta:hover svg{transform:translateX(6px)}

.cblock__right{
  display:flex;flex-direction:column;gap:32px;
}
.cblock__row{
  display:grid;grid-template-columns:90px 1fr;gap:24px;align-items:baseline;
  padding:24px 0;border-top:1px solid var(--rule-hair);
}
.cblock__row:last-child{border-bottom:1px solid var(--rule-hair)}
.cblock__row-key{
  font-family:var(--mono);font-size:10px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--ink-3);
}
.cblock__row-val{
  font-family:var(--display);font-weight:400;font-size:24px;
  letter-spacing:-.01em;color:var(--ink);line-height:1.2;
  font-variation-settings:"opsz" 72;
}

/* ============ INNER HERO (Services / About / Contacts / Practice) ============ */
.ihero{
  padding:80px 0 64px;border-bottom:1px solid var(--rule);
  position:relative;
}
.ihero__inner{
  padding:0 64px;
  display:grid;grid-template-columns:auto 1fr;gap:64px;align-items:end;
}
.ihero__crumb{
  font-family:var(--mono);font-size:11px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--accent);margin-bottom:36px;
}
.ihero__h{
  font-family:var(--display);font-weight:500;font-size:140px;
  line-height:.85;letter-spacing:-.035em;color:var(--ink);
  font-variation-settings:"opsz" 144;
}
.ihero__h em{font-style:italic;color:var(--accent);font-weight:400}
.ihero__lead{
  font-family:var(--serif);font-size:22px;line-height:1.5;color:var(--ink-2);
  max-width:48ch;padding-bottom:18px;
}

/* ============ SERVICES PAGE ============ */
.svc{padding:80px 0 120px}
.svc__list{padding:0 64px}
.svc__row{
  display:grid;grid-template-columns:80px 1fr 80px 56px;gap:32px;
  padding:48px 0;border-bottom:1px solid var(--rule-hair);
  align-items:center;
  transition:padding-left .3s;
}
.svc__row:hover{padding-left:24px}
.svc__row-roman{
  font-family:var(--display);font-weight:400;font-style:italic;font-size:64px;
  line-height:1;color:var(--ink);font-variation-settings:"opsz" 96;
  transition:color .25s;
}
.svc__row:hover .svc__row-roman{color:var(--accent)}
.svc__row-body{display:flex;flex-direction:column;gap:8px}
.svc__row-title{
  font-family:var(--display);font-weight:500;font-size:34px;line-height:1.1;
  letter-spacing:-.015em;color:var(--ink);font-variation-settings:"opsz" 72;
}
.svc__row-sum{
  font-family:var(--serif);font-size:16px;line-height:1.55;color:var(--ink-3);
  max-width:80ch;
}
.svc__row-count{
  text-align:right;
  font-family:var(--mono);font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--ink-3);
}
.svc__row-count strong{
  display:block;font-family:var(--display);font-weight:500;font-size:30px;
  color:var(--ink);font-variation-settings:"opsz" 72;margin-bottom:4px;
  letter-spacing:-.01em;
}
.svc__row-chev svg{width:32px;height:32px;transition:transform .25s}
.svc__row:hover .svc__row-chev svg{transform:translateX(6px)}

/* ============ PRACTICE DETAIL ============ */
.prac{padding:80px 0 120px}
.prac__inner{padding:0 64px;display:grid;grid-template-columns:280px 1fr;gap:96px}
.prac__side{
  position:sticky;top:120px;align-self:start;
  display:flex;flex-direction:column;gap:24px;
}
.prac__side-back{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--ink-3);
  display:inline-flex;align-items:center;gap:10px;
  margin-bottom:32px;
}
.prac__side-back:hover{color:var(--accent)}
.prac__side-h{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--ink-3);
  padding-bottom:18px;border-bottom:1px solid var(--rule-hair);
}
.prac__side-list{display:flex;flex-direction:column}
.prac__side-item{
  display:grid;grid-template-columns:32px 1fr;gap:14px;
  padding:14px 0;border-bottom:1px solid var(--rule-hair);
  font-family:var(--serif);font-size:14.5px;line-height:1.4;color:var(--ink-2);
  align-items:baseline;transition:color .2s;
}
.prac__side-item:hover{color:var(--accent)}
.prac__side-item.is-current{color:var(--ink);font-weight:500}
.prac__side-item.is-current .prac__side-item-r{color:var(--accent)}
.prac__side-item-r{
  font-family:var(--display);font-style:italic;font-size:18px;
  color:var(--ink-3);font-variation-settings:"opsz" 72;
}
.prac__main{min-width:0}
.prac__head{
  margin-bottom:64px;
}
.prac__roman{
  font-family:var(--display);font-weight:400;font-style:italic;font-size:96px;
  line-height:.9;color:var(--accent);font-variation-settings:"opsz" 144;
  margin-bottom:24px;
}
.prac__title{
  font-family:var(--display);font-weight:500;font-size:80px;line-height:.95;
  letter-spacing:-.025em;color:var(--ink);font-variation-settings:"opsz" 144;
  margin-bottom:32px;
}
.prac__lead{
  font-family:var(--serif);font-size:22px;line-height:1.5;color:var(--ink-2);
  max-width:64ch;padding-top:24px;border-top:1px solid var(--rule);
}
.prac__b-head{
  display:flex;align-items:baseline;gap:18px;margin-bottom:36px;
}
.prac__b-head-rule{flex:1;height:1px;background:var(--rule-soft)}
.prac__bullets{
  display:flex;flex-direction:column;
}
.prac__bullet{
  display:grid;grid-template-columns:48px 1fr;gap:18px;
  padding:24px 0;border-bottom:1px solid var(--rule-hair);
  align-items:baseline;
}
.prac__bullet-n{
  font-family:var(--mono);font-size:11px;letter-spacing:.18em;
  color:var(--accent);
}
.prac__bullet-t{
  font-family:var(--serif);font-size:17px;line-height:1.55;color:var(--ink);
}

.prac__cta-row{
  margin-top:80px;padding:48px;background:var(--paper-2);
  display:grid;grid-template-columns:1fr auto;gap:48px;align-items:center;
}
.prac__cta-h{
  font-family:var(--display);font-weight:500;font-size:36px;line-height:1.1;
  letter-spacing:-.015em;color:var(--ink);font-variation-settings:"opsz" 96;
}
.prac__cta-h em{font-style:italic;color:var(--accent);font-weight:400}



/* ============ CLIENTS (about) ============ */
.clients{padding:120px 0 0;background:var(--paper)}
.clients__head{
  max-width:1280px;margin:0 auto;padding:0 64px 48px;
  display:flex;flex-direction:column;gap:14px;
}
.clients__h{
  font-family:var(--display);font-weight:500;font-size:54px;line-height:1;
  letter-spacing:-.02em;color:var(--ink);font-variation-settings:"opsz" 96;
}
.clients__grid{
  max-width:1280px;margin:0 auto;padding:0 64px;
  display:grid;grid-template-columns:repeat(5,1fr);
  border:1px solid var(--rule-soft);background:var(--paper);
}
.client{
  aspect-ratio:1.5/1;display:flex;align-items:center;justify-content:center;
  padding:24px;border-right:1px solid var(--rule-hair);border-bottom:1px solid var(--rule-hair);
  background:var(--paper);transition:background .25s;
}
.client:nth-child(5n){border-right:0}
.client:nth-last-child(-n+5){border-bottom:0}
.client:hover{background:var(--paper-2)}
.client img{
  max-height:54px;max-width:120px;
  filter:grayscale(1) contrast(1.05);opacity:.78;mix-blend-mode:multiply;
  transition:opacity .25s,filter .25s;
}
.client:hover img{opacity:1;filter:none}

/* ============ LEADER (about) ============ */
.leader{
  padding:120px 0;background:var(--paper-2);
  border-top:1px solid var(--rule-hair);border-bottom:1px solid var(--rule-hair);
}
.leader__inner{
  max-width:1280px;margin:0 auto;padding:0 64px;
  display:grid;grid-template-columns:5fr 7fr;gap:80px;align-items:center;
}
.leader__photo{
  width:100%;aspect-ratio:5/6;object-fit:cover;
  border:1px solid var(--rule);
  filter:grayscale(.15) contrast(1.02);
}
.leader__name{
  font-family:var(--display);font-weight:500;font-size:54px;
  line-height:1.05;letter-spacing:-.02em;color:var(--ink);
  font-variation-settings:"opsz" 96;
  margin:14px 0 12px;
}
.leader__role{
  font-family:var(--mono);font-size:11px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--accent);margin-bottom:32px;
}
.leader__quote{
  font-family:var(--display);font-size:22px;
  line-height:1.5;color:var(--ink-2);
  font-variation-settings:"opsz" 72;font-weight:500;
  padding-top:32px;border-top:1px solid var(--rule-hair);
  max-width:60ch;
}

/* ============ ABOUT ============ */
.about{padding:80px 0 120px}
.about__intro{
  padding:0 64px;display:grid;grid-template-columns:1fr 1fr;gap:96px;
  margin-bottom:120px;align-items:start;
}
.about__intro-h{
  font-family:var(--display);font-weight:500;font-style:italic;font-size:48px;
  line-height:1.1;letter-spacing:-.015em;color:var(--ink);
  font-variation-settings:"opsz" 96;
}
.about__intro-h em{font-style:normal;color:var(--accent)}
.about__intro-body{
  font-family:var(--serif);font-size:18px;line-height:1.65;color:var(--ink-2);
}
.about__intro-body p+p{margin-top:18px}

.about__pillars{
  padding:0 64px;
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
}
.about__pillar{
  padding:64px 32px 64px 0;
  border-right:1px solid var(--rule-hair);
}
.about__pillar:last-child{border-right:0;padding-right:0}
.about__pillar:nth-child(n+2){padding-left:32px}
.about__pillar-n{
  font-family:var(--display);font-weight:500;font-style:italic;font-size:64px;
  line-height:1;color:var(--accent);font-variation-settings:"opsz" 96;
  margin-bottom:32px;
}
.about__pillar-h{
  font-family:var(--display);font-weight:500;font-size:30px;line-height:1.1;
  color:var(--ink);font-variation-settings:"opsz" 72;
  margin-bottom:14px;letter-spacing:-.01em;
}
.about__pillar-p{
  font-family:var(--serif);font-size:16px;line-height:1.6;color:var(--ink-2);
}

.about__quote{
  margin:120px 0;padding:0 64px;
}
.about__quote-inner{
  max-width:960px;margin:0 auto;text-align:center;
}
.about__quote-mark{
  font-family:var(--display);font-style:italic;font-weight:300;font-size:140px;
  line-height:.5;color:var(--accent);
  font-variation-settings:"opsz" 144;display:block;margin-bottom:0;
}
.about__quote-t{
  font-family:var(--display);font-weight:400;font-style:italic;font-size:42px;
  line-height:1.25;color:var(--ink);font-variation-settings:"opsz" 96;
  letter-spacing:-.01em;
}
.about__quote-t em{font-style:normal;color:var(--accent)}
.about__quote-cite{
  margin-top:36px;
  font-family:var(--mono);font-size:11px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--ink-3);
}

/* ============ CONTACTS ============ */
.contacts{padding:80px 0 120px}
.contacts__inner{padding:0 64px;display:grid;grid-template-columns:1fr 1fr;gap:64px}
.office{
  padding:48px;border:1px solid var(--rule);background:var(--paper);
  display:flex;flex-direction:column;gap:24px;
}
.office__city{
  font-family:var(--display);font-weight:500;font-size:64px;line-height:.95;
  letter-spacing:-.02em;color:var(--ink);font-variation-settings:"opsz" 96;
}
.office__role{
  font-family:var(--mono);font-size:11px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--accent);margin-top:-12px;
}
.office__addr{
  font-family:var(--serif);font-size:18px;line-height:1.55;color:var(--ink);
  padding-top:24px;border-top:1px solid var(--rule-hair);
}
.office__row{
  display:grid;grid-template-columns:90px 1fr;gap:18px;align-items:baseline;
  padding:14px 0;border-top:1px solid var(--rule-hair);
}
.office__row .meta{color:var(--ink-3)}
.office__row a, .office__row span:not(.meta){
  font-family:var(--display);font-size:20px;color:var(--ink);
  font-variation-settings:"opsz" 72;font-weight:400;letter-spacing:-.005em;
}
.office__row a:hover{color:var(--accent)}

.map{
  margin-top:48px;
  height:380px;border:1px solid var(--rule);
  background:var(--paper-2);overflow:hidden;
}
.map iframe{width:100%;height:100%;border:0;filter:grayscale(.7) contrast(1.05)}

.form{
  padding:48px;background:var(--paper-2);border:1px solid var(--rule);
}
.form__h{
  font-family:var(--display);font-weight:400;font-style:italic;font-size:42px;
  line-height:1.05;letter-spacing:-.02em;color:var(--ink);
  font-variation-settings:"opsz" 96;margin-bottom:36px;
}
.form__group{margin-bottom:24px}
.form__label{
  display:block;
  font-family:var(--mono);font-size:10px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--ink-3);margin-bottom:10px;
}
.form__input,.form__textarea{
  width:100%;background:transparent;border:0;
  border-bottom:1px solid var(--ink);padding:14px 0;
  font-family:var(--display);font-size:22px;color:var(--ink);
  font-variation-settings:"opsz" 72;font-weight:400;
  outline:none;transition:border-color .2s;
}
.form__input:focus,.form__textarea:focus{border-color:var(--accent)}
.form__input::placeholder,.form__textarea::placeholder{
  color:var(--ink-4);font-style:italic;
}
.form__textarea{min-height:120px;resize:vertical;line-height:1.4}
.form__note{
  font-family:var(--serif);font-size:13px;line-height:1.5;color:var(--ink-3);
  font-style:italic;margin:24px 0;
}
.form__submit{
  display:inline-flex;align-items:center;gap:14px;
  padding:18px 28px;background:var(--ink);color:var(--paper);
  font-family:var(--mono);font-size:11px;letter-spacing:.2em;
  text-transform:uppercase;cursor:pointer;
  transition:background .25s;
}
.form__submit:hover{background:var(--accent)}
.form__success{
  display:none;padding:18px 22px;background:var(--ink);color:var(--paper);
  font-family:var(--serif);font-size:16px;margin-bottom:24px;
}
.form.is-sent .form__success{display:block}

/* ============ 404 ============ */
.nf{
  padding:120px 64px 160px;text-align:center;
}
.nf__num{
  font-family:var(--display);font-weight:500;font-size:280px;line-height:1;
  letter-spacing:-.04em;color:var(--ink);font-variation-settings:"opsz" 144;
  margin:24px 0;
}
.nf__num em{color:var(--accent);font-style:italic}
.nf__lead{
  font-family:var(--display);font-style:italic;font-size:32px;color:var(--ink-2);
  font-variation-settings:"opsz" 96;margin-bottom:48px;
}
.nf__back{
  display:inline-flex;align-items:center;gap:12px;
  font-family:var(--mono);font-size:11px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--ink);
  padding:18px 24px;border:1px solid var(--ink);
  transition:background .25s,color .25s;
}
.nf__back:hover{background:var(--ink);color:var(--paper)}

/* ============ FOOTER ============ */
.footer{
  background:var(--ink);color:var(--paper);
  padding:96px 0 32px;
}
.footer__inner{padding:0 64px}
.footer__top{
  display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr;gap:48px;
  padding-bottom:64px;border-bottom:1px solid rgba(241,236,226,.18);
}
.footer__brand-mark{
  font-family:var(--display);font-weight:500;font-size:80px;line-height:.9;
  letter-spacing:-.02em;color:var(--paper);font-variation-settings:"opsz" 144;
  margin-bottom:24px;
}
.footer__brand-tag{
  font-family:var(--serif);font-size:15px;line-height:1.55;
  color:rgba(241,236,226,.65);max-width:36ch;
}
.footer__col h4{
  font-family:var(--mono);font-size:10px;letter-spacing:.22em;
  text-transform:uppercase;color:rgba(241,236,226,.45);
  margin-bottom:24px;font-weight:400;
}
.footer__col ul{display:flex;flex-direction:column;gap:14px}
.footer__col a{
  font-family:var(--display);font-size:18px;color:var(--paper);
  font-variation-settings:"opsz" 72;font-weight:400;
  transition:color .2s;
}
.footer__col a:hover{color:var(--gold)}
.footer__col a.is-current{color:var(--gold);font-style:italic}

.footer__bottom{
  display:flex;justify-content:space-between;align-items:center;
  padding-top:32px;
}
.footer__bottom .meta{color:rgba(241,236,226,.45)}
.footer__legal{display:flex;gap:24px}
.footer__legal a{
  font-family:var(--mono);font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:rgba(241,236,226,.45);
}
.footer__legal a:hover{color:var(--gold)}


/* ============ BODONI MODA — NO ITALIC, BUMPED WEIGHT ============ */
/* The italic Bodoni cut has hairline strokes that fade out at small
   sizes and adds visual noise on top of an already complex display
   face. Site-wide we drop italics entirely and rely on weight + size
   for emphasis. */
*{font-style:normal !important}
em,i,.italic{font-style:normal !important;font-weight:600 !important}
.bridge__delta,.about__quote-mark{font-weight:500 !important}
/* Form submit — primary CTA reads better as a full-width bar with
   label and arrow on a single line, on both desktop and mobile.
   Constrain the inline svg arrow so flex doesn't stretch it. */
.form__submit{
  display:flex !important;width:100%;
  justify-content:center;align-items:center;gap:14px;
  white-space:nowrap;
}
.form__submit svg{width:14px;height:14px;flex:0 0 14px}

/* Roman numerals (II / V / VII etc.) render with hairline diagonals
   in Bodoni Moda Variable at opsz:144 + weight 400 — the right stroke
   of V/IV/VII becomes visually invisible. Push weight to the heavy
   end (900) and drop opsz to a smaller cut so all four strokes carry
   solid mass. Applies to every selector where a Roman lives, on
   desktop and mobile. */
.hero__stat-num,.hero__stat-num em,
.kredo__num,.kredo__num em,
.ledger__roman,.svc__row-roman,.prac__roman,
.about__pillar-n,.about__pillar-n em,
.nf__num,.nf__num em{
  font-weight:800 !important;
  font-variation-settings:"opsz" 18 !important;
}

/* Large display elements (OUAV lockup, Wien / Київ city names) use
   the same high-contrast Bodoni — same hairline-diagonal problem.
   Push their weight to 800 and bring opsz toward the text end so
   the strokes don't disappear at any size. */
.hero__lockup,
.bridge__city-name,.bridge__city-name em{
  font-weight:800 !important;
  font-variation-settings:"opsz" 24 !important;
}

/* Em-dashes in Bodoni at opsz:96 + weight 400 render as a hairline
   stroke that visually disappears at small/medium sizes — readers see
   a gap but no dash. Drop opsz to the 'text' end of the axis (6-12)
   for any text that must show a dash, and bump weights for em
   emphasis. The axis change alone fixes the dash; the weight bump
   keeps emphasis legible. */
.kredo__body,.form__h,.cblock__h,.ledger__h,.approach__h,
.about__intro-h,.bridge__foot-line,.prac__cta-h{
  font-weight:500;
  font-variation-settings:"opsz" 14 !important;
}
.cblock__h em,.form__h em,.ihero__h em,.kredo__body em,
.ledger__h em,.about__intro-h em,.approach__h em,
.bridge__foot-line em,.prac__cta-h em{font-weight:700 !important}
/* Bump display headings a notch heavier so they
   don't read thin against paper. */
.hero__lockup{font-weight:700}
.ledger__h,.approach__h,.cblock__h,.ihero__h,.partners__h,.clients__h,
.about__intro-h,.about__pillar-h,.about__quote-t,
.prac__title,.prac__roman,.svc__row-roman,.svc__row-title,
.leader__name,.office__city,.form__h,
.nf__num{font-weight:600}

/* ============ FOOTER TYPOGRAPHY (UNIFIED) ============ */
/* Tiered system inside the dark footer:
     • image logo (same wordmark as the topbar)
     • brand-tag         — Crimson Pro body
     • column headers h4 — JetBrains Mono uppercase 10.5px
     • column links a    — Crimson Pro 15px (was Bodoni — too heavy)
     • bottom meta/legal — JetBrains Mono uppercase 10px
*/
/* Footer logo image is removed — it didn't read well on the dark bg
   and added visual weight without identity payoff. Hide whichever
   container the builder may have inserted. */
.footer__brand-mark--img,.footer__brand-mark{display:none !important}
.footer__col a{
  font-family:var(--serif) !important;font-size:15px !important;
  font-weight:400 !important;font-variation-settings:normal !important;
  letter-spacing:0 !important;
  color:rgba(241,236,226,.85);
  line-height:1.5;
}
.footer__col a:hover{color:var(--gold)}
.footer__col a.is-current{color:var(--gold);font-weight:600}
.footer__col li > span{
  font-family:var(--serif) !important;font-size:15px !important;
  font-weight:400 !important;font-variation-settings:normal !important;
  color:rgba(241,236,226,.85) !important;line-height:1.5 !important;
  display:inline-block;
}
.footer__col h4{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;
  text-transform:uppercase;color:rgba(241,236,226,.5);
  margin-bottom:18px;font-weight:400;
}
.footer__brand-tag{
  font-family:var(--serif);font-size:15px;line-height:1.6;
  color:rgba(241,236,226,.7);max-width:36ch;
  font-weight:400;
}
/* Brand geo strip — Wien · Київ pinned under the tag, the way the
   topbar shows itself in the firm's voice. Editorial detail, not
   navigation. */
.footer__brand-geo{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  margin-top:24px;
  font-family:var(--mono);font-size:10px;letter-spacing:.22em;
  text-transform:uppercase;color:rgba(241,236,226,.55);
}
.footer__brand-geo-pin{
  font-family:var(--display);font-weight:500;font-size:22px;
  letter-spacing:-.01em;text-transform:none;
  color:var(--gold);font-variation-settings:"opsz" 14;
}
.footer__brand-geo-rule{flex:0 0 28px;height:1px;background:rgba(241,236,226,.25)}
.footer__brand-geo-meta{font-feature-settings:"tnum" 1}

/* Tier-2 row in Contacts/Office cols — mono key + serif value pair. */
.footer__row{
  display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:baseline;
  padding:10px 0;border-top:1px solid rgba(241,236,226,.10);
}
.footer__row:first-child{border-top:0;padding-top:0}
.footer__row-key{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.22em;
  text-transform:uppercase;color:rgba(241,236,226,.45);
  white-space:nowrap;
}
.footer__row-val,
.footer__col a.footer__row-val,
.footer__col span.footer__row-val{
  font-family:var(--serif) !important;font-size:15px !important;
  font-weight:400 !important;letter-spacing:0 !important;
  color:rgba(241,236,226,.92) !important;line-height:1.45 !important;
  font-variation-settings:normal !important;text-transform:none;
}
.footer__col a.footer__row-val:hover{color:var(--gold) !important}

.footer__bottom{justify-content:center !important;text-align:center;}
.footer__bottom .meta{
  font-family:var(--mono);font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;font-weight:400;
  color:rgba(241,236,226,.5);
}

/* ============ TOPBAR EXTRAS / LOGO IMAGE ============ */
/* The original .brand uses align-items:baseline — that was correct for
   a <span>OUAV</span> sitting on the text baseline. Once we swap it
   for an <img>, the image's baseline is its bottom edge so the visual
   top sits noticeably above the brand-sub text and looks misaligned.
   Force centred cross-axis alignment instead. */
.brand{align-items:center !important}
.brand__mark--img{
  height:40px;width:auto;display:block;
}
/* Desktop topbar — bumped sizing across the board for stronger
   first-impression weight without redesigning. */
@media (min-width:1024px){
  .topbar__inner{padding:22px 64px;gap:56px}
  .brand__sub{font-size:10.5px;max-width:220px}
  .nav{gap:52px}
  .nav a{font-size:12px;letter-spacing:.22em}
  .nav a span{font-size:10px;margin-right:8px}
  .lang__btn{font-size:11px;padding:10px 14px}
  .topbar .cta-link{font-size:12px;padding:14px 22px}
}
.lang__btn-code{
  font-family:var(--mono);font-weight:500;color:var(--ink);
}
.lang__btn-name{
  font-family:var(--mono);color:var(--ink-3);
}
.lang{z-index:70}
.lang__menu{z-index:80}
.burger{
  display:none;width:40px;height:40px;
  align-items:center;justify-content:center;
  border:1px solid var(--rule-soft);background:transparent;
  transition:background .2s,border-color .2s,color .2s;
  margin-left:4px;
}
.burger svg{width:18px;height:14px;color:var(--ink)}
.topbar.is-menu-open .burger{
  background:var(--ink);border-color:var(--ink);color:var(--paper);
}
.topbar.is-menu-open .burger svg{color:var(--paper)}

/* Mobile menu — hidden everywhere by default; revealed only at <1024px when open */
.mobile-menu{display:none}

/* ============ INNER HERO LAYOUT FIX ============ */
/* Stable 7/5 split so the lead always sits on the right and breathes,
   regardless of how wide the H1 ('Бюро стандарт.', 'Сім практик.', etc.) ends up.
   GUARD: scope to desktop only — bleeding it into mobile keeps a 2-col
   layout that crushes both H1 and lead into half-width slivers. */
@media (min-width: 1024px){
  .ihero__inner{ grid-template-columns:7fr 5fr !important; }
}
.ihero__h{
  max-width:none;
}

/* ============ BRIDGE (3 cities — Wien · Київ · New York) ============ */
/* Originally 2 cities + central × glyph; rebuilt for three. The
   centre column sits centre-aligned, right column flush-right. */
.bridge__cities{
  grid-template-columns:1fr 1fr 1fr !important;
  gap:48px !important;align-items:start !important;
}
.bridge__city--center{align-items:center;text-align:center}
.bridge__city--right{align-items:flex-end;text-align:right}
.bridge__city--center .bridge__city-time{justify-content:center}
.bridge__deltabar{
  display:flex;align-items:center;gap:18px;
  margin:48px 0 0;padding-top:36px;
  border-top:1px solid rgba(241,236,226,.18);
}
.bridge__deltabar-rule{
  flex:1;height:1px;background:rgba(241,236,226,.18);
}
.bridge__deltabar-lbl{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.24em;
  text-transform:uppercase;color:rgba(241,236,226,.55);
  white-space:nowrap;text-align:center;
}

@media (min-width:1024px){
  .bridge__city{min-width:0}
  .bridge__city-name{
    font-size:clamp(64px,6.4vw,96px);
    line-height:.9;
    white-space:nowrap;
  }
  .svc__row{
    grid-template-columns:112px minmax(0,1fr) 80px 56px !important;
  }
}

/* ============ THEMIS (editorial portrait) ============ */
.themis{
  background:var(--ink);
  margin:0;padding:0;
  border-top:1px solid rgba(241,236,226,.06);
  border-bottom:1px solid rgba(241,236,226,.06);
}
.themis__figure{
  margin:0;position:relative;display:block;
  width:100%;
}
.themis__img{
  display:block;width:100%;height:auto;
  max-height:none;
  object-fit:cover;object-position:center 20%;
  filter:contrast(1.04) saturate(.9);
}
@media (min-width: 1024px){
  /* Desktop — full-bleed to the viewport edges, no max-width clamp.
     Cap height so 16:9-ish heroes don't push the rest of the page
     too far down. */
  .themis__img{ max-height:78vh; }
}
.themis__cap{
  position:absolute;left:0;right:0;bottom:32px;
  display:flex;align-items:center;justify-content:center;gap:18px;
  padding:0 32px;pointer-events:none;
}
.themis__eyebrow{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.28em;
  text-transform:uppercase;color:rgba(241,236,226,.78);
  text-shadow:0 1px 18px rgba(0,0,0,.6);
  white-space:nowrap;
}
.themis__rule{
  flex:0 0 56px;height:1px;background:rgba(241,236,226,.45);
}

/* ============ MOBILE BREAKPOINT (≤1023px) ============ */
@media (max-width: 1023px){
  /* Belt and suspenders against horizontal overflow caused by long
     headings or images that ignore the viewport. */
  html,body{overflow-x:hidden;max-width:100vw}
  body{font-size:16px}
  /* Bodoni stays thin on mobile because phone DPI rounds 600 down —
     bump display headlines to 700 globally on mobile. */
  .ledger__h,.approach__h,.cblock__h,.ihero__h,.clients__h,
  .about__intro-h,.about__pillar-h,.about__quote-t,
  .prac__title,.prac__roman,.svc__row-roman,.svc__row-title,
  .leader__name,.office__city,.form__h,
  .kredo__body,.hero__caption,.nf__num,
  em{font-weight:700 !important}
  .wrap{padding:0 24px}
  /* Long Cyrillic / German words must wrap rather than blow out the
     viewport — applies to every display headline on mobile.
     Pretty/balance directs the browser to optimise line lengths so
     no single word dangles on its own line. */
  .ledger__h,.approach__h,.cblock__h,.ihero__h,.clients__h,
  .about__intro-h,.about__pillar-h,.about__quote-t,
  .prac__title,.kredo__body,.hero__caption,.office__city,.form__h,
  .leader__name,.bridge__city-name,.bridge__foot-line,.prac__cta-h{
    overflow-wrap:break-word;word-break:normal;hyphens:auto;
    text-wrap:balance;
  }
  /* Body-ish runs prefer 'pretty' which keeps last line full. */
  .kredo__body,.hero__lead,.about__intro-body,.prac__lead,
  .leader__quote,.ledger__intro,.about__pillar-p{
    text-wrap:pretty;
  }

  /* Topbar — opaque, brand left, lang+burger right (no center column) */
  .topbar{background:var(--paper);backdrop-filter:none}
  .topbar__inner{
    grid-template-columns:auto auto;justify-content:space-between;
    padding:12px 20px;gap:14px;
  }
  .brand__sep,.brand__sub,.nav{display:none}
  .brand__mark--img{height:28px}
  main{padding-top:60px}
  .mobile-menu{
    inset:60px 0 0;background:#F1ECE2;
    box-shadow:0 -1px 0 var(--rule-hair) inset;
  }
  .nav{display:none}
  .topbar.is-menu-open .mobile-menu{display:flex}
  .toolbar{gap:10px}
  .lang__btn{padding:8px 10px;font-size:9.5px;gap:6px}
  .lang__btn .lang__btn-name{display:none}
  .topbar .cta-link{display:none}
  .burger{display:flex !important}

  /* Mobile menu overlay — bigger nav typography + contacts block
     pinned at the bottom so the menu earns its full-screen real
     estate instead of leaving 70% white space below. */
  .mobile-menu{
    display:none;position:fixed;inset:64px 0 0;background:var(--paper);
    flex-direction:column;padding:32px 24px 24px;z-index:40;
    border-top:1px solid var(--rule-hair);overflow-y:auto;
  }
  .mobile-menu a{
    display:flex;align-items:baseline;justify-content:space-between;
    padding:16px 0;border-bottom:1px solid var(--rule-hair);
    font-family:var(--display);font-weight:600;font-size:19px;
    color:var(--ink);font-variation-settings:"opsz" 14;letter-spacing:-.01em;
  }
  .mobile-menu > a > span:first-child{
    font-family:var(--display);font-size:19px;letter-spacing:-.01em;
    color:var(--ink);text-transform:none;font-weight:600;
    font-variation-settings:"opsz" 14;
  }
  .mobile-menu > a > span:last-child{
    font-family:var(--mono);font-size:10px;letter-spacing:.22em;
    color:var(--ink-3);text-transform:uppercase;font-weight:400;
  }
  .mobile-menu .cta-link{
    display:flex !important;margin-top:28px;width:100%;
    justify-content:space-between;align-items:center;
    padding:18px 24px;font-size:11px;
    background:var(--ink);color:var(--paper);
    border-bottom:0;
  }
  .mobile-menu .cta-link svg{width:14px;height:14px;flex:0 0 14px}
  .mobile-menu .cta-link > span:first-child{
    font-family:var(--mono);font-size:11px;letter-spacing:.22em;
    text-transform:uppercase;color:var(--paper);font-weight:500;
  }
  /* Contacts block at the bottom of the menu — matches the in-page
     contact card pattern (mono key + serif value pair). */
  .mobile-menu__contacts{
    margin-top:28px;padding-top:20px;
    border-top:1px solid var(--rule-hair);
    display:flex;flex-direction:column;gap:0;
  }
  .mobile-menu__row{
    display:grid;grid-template-columns:64px 1fr;gap:14px;
    padding:12px 0;border-bottom:1px solid rgba(20,17,12,.06);
    align-items:baseline;
  }
  .mobile-menu__row:last-child{border-bottom:0}
  .mobile-menu__row-key{
    font-family:var(--mono);font-size:9.5px;letter-spacing:.22em;
    text-transform:uppercase;color:var(--ink-3);font-weight:400;
  }
  .mobile-menu .mobile-menu__row-val,
  .mobile-menu a.mobile-menu__row-val{
    font-family:var(--serif) !important;font-size:16px !important;
    color:var(--ink) !important;font-feature-settings:"tnum" 1;
    line-height:1.4 !important;letter-spacing:0 !important;
    text-transform:none !important;font-weight:400 !important;
    font-variation-settings:normal !important;
    border-bottom:0 !important;padding:0 !important;
    display:inline-block !important;
    justify-content:flex-start !important;
    /* Override the .mobile-menu a flex/space-between rule. */
  }
  .mobile-menu a.mobile-menu__row-val:hover{color:var(--accent) !important}

  /* Themis — tighter on mobile, caption shrinks rules + text */
  .themis__img{max-height:60vh;object-position:center 15%}
  .themis__cap{bottom:18px;gap:10px;padding:0 16px}
  .themis__eyebrow{font-size:9.5px;letter-spacing:.22em;white-space:normal;text-align:center}
  .themis__rule{flex:0 0 28px}

  /* Hero — full viewport height on mobile so the Themis section
     never bleeds into the first screen. Content gets a min-height
     equal to the visible viewport (svh handles iOS dynamic toolbar
     with vh fallback for older browsers). */
  .hero{
    padding:32px 0 60px;
    min-height:100vh;
    min-height:100svh;
    display:flex;flex-direction:column;justify-content:center;
  }
  .hero__topline{padding:0 24px;margin-bottom:24px;gap:14px}
  .hero__topline-text{font-size:9.5px;letter-spacing:.18em;white-space:normal;line-height:1.4}
  .hero__lockup{
    font-size:clamp(96px,32vw,180px);
    padding:0 16px;letter-spacing:-.04em;
  }
  .hero__lockup::before,.hero__lockup::after{display:none}
  .hero__below{
    grid-template-columns:1fr;gap:28px;
    padding:36px 24px 0;margin-top:36px;
  }
  .hero__below > div{padding-top:18px;border-top:1px solid var(--rule-hair)}
  .hero__below > div:first-child{border-top:0;padding-top:0}
  .hero__caption{font-size:26px}
  .hero__lead{font-size:15.5px}
  .hero__stats{
    border-left:0;padding-left:0;border-top:1px solid var(--rule-hair);
    padding-top:24px;flex-direction:row;flex-wrap:wrap;gap:24px;
  }
  .hero__stat{flex:1;min-width:30%}
  .hero__stat-num{font-size:32px}
  .hero__scroll{display:none}

  /* Kredo (manifesto) — body text is the single most important
     paragraph on the page. On mobile we rely on:
       • text-wrap:pretty/balance to optimise line breaks instead of
         leaving them to greedy default flow;
       • tighter letter-spacing so Bodoni doesn't fight 390px viewport;
       • smaller size so each sentence fits in 2 lines, not 4. */
  .kredo{padding:64px 0}
  .kredo__inner{
    grid-template-columns:1fr;gap:28px;padding:0 24px;
  }
  .kredo__sidebar{
    border-right:0;border-bottom:1px solid rgba(241,236,226,.18);
    padding-right:0;padding-bottom:18px;flex-direction:row;align-items:baseline;
  }
  .kredo__num{font-size:44px}
  .kredo__body{
    font-size:21px;line-height:1.28;letter-spacing:-.012em;
    word-spacing:-.02em;
    text-wrap:pretty;
    hyphens:none;
  }
  .kredo__sign{margin-top:20px;flex-wrap:wrap;font-size:9.5px}

  /* Ledger (practices home) — heading "Сім практик. Один стандарт."
     uses balanced wrapping so the two sentences split cleanly across
     two lines rather than leaving "стандарт." dangling. */
  .ledger{padding:80px 0 0}
  .ledger__head{
    grid-template-columns:1fr;gap:24px;padding:0 24px;margin-bottom:36px;
  }
  .ledger__h{
    font-size:42px;max-width:none !important;
    line-height:1.0;letter-spacing:-.02em;
    text-wrap:balance;
  }
  .ledger__intro{font-size:16px}
  .ledger__row{
    grid-template-columns:auto 1fr;gap:18px;padding:24px;
    align-items:start;
  }
  .ledger__row > .ledger__count-wrap,
  .ledger__row > .ledger__chev{display:none}
  .ledger__roman{font-size:36px}
  .ledger__title-wrap{padding-top:6px}
  .ledger__title{font-size:18px;line-height:1.2}
  .ledger__sum{font-size:14px}

  /* Bridge (3 cities — Wien · Київ · New York) — stack on mobile.
     Each city left-aligned with hairline rule above the next. */
  .bridge{padding:64px 0}
  .bridge__inner{padding:0 24px}
  .bridge__head{margin-bottom:36px;flex-wrap:wrap;gap:14px}
  .bridge__head-rule{display:none}
  .bridge__cities{
    grid-template-columns:1fr !important;gap:32px;
  }
  .bridge__city,.bridge__city--center,.bridge__city--right{
    align-items:flex-start !important;text-align:left !important;
    padding-top:24px;border-top:1px solid rgba(241,236,226,.18);
  }
  .bridge__cities > .bridge__city:first-child{border-top:0;padding-top:0}
  .bridge__city-name{font-size:64px}
  .bridge__city-detail{font-size:15.5px;max-width:none}
  .bridge__city-time{align-self:flex-start;flex-direction:row !important}
  .bridge__city-time-h{font-size:36px}
  .bridge__deltabar{margin-top:32px;padding-top:24px;gap:14px}
  .bridge__deltabar-lbl{font-size:9px;letter-spacing:.22em;white-space:normal;text-align:center}
  .bridge__deltabar-rule{flex:0 0 24px}
  .bridge__foot{
    grid-template-columns:1fr;gap:24px;margin-top:48px;
  }
  .bridge__foot-line{font-size:24px}
  .bridge__foot-meta{font-size:14.5px}

  /* Approach */
  .approach{padding:80px 0}
  .approach__head{
    grid-template-columns:1fr;gap:24px;padding:0 24px;margin-bottom:40px;
  }
  .approach__h{font-size:36px;max-width:none;line-height:1.05}
  .approach__lead{font-size:16px;justify-self:start}
  .approach__steps{
    grid-template-columns:1fr;padding:0 24px;
    border-top:1px solid var(--rule);
  }
  .approach__step{
    border-right:0;border-bottom:1px solid var(--rule-hair);
    padding:36px 0 36px;
  }
  .approach__step:last-child{border-bottom:0}
  .approach__step-h{font-size:24px}

  /* Partners */
  .partners{padding:64px 0}
  .partners__head{padding:0 24px;flex-direction:column;align-items:flex-start;gap:14px;margin-bottom:32px}
  .partners__h{font-size:32px}
  .partners__grid{grid-template-columns:repeat(2,1fr);padding:0;margin:0 24px}
  .partner:nth-child(2n){border-right:0}
  .partner:nth-child(4n){border-right:1px solid var(--rule-hair)}
  .partner:nth-last-child(-n+4){border-bottom:1px solid var(--rule-hair)}
  .partner:nth-last-child(-n+2){border-bottom:0}
  .partner img{max-height:48px}

  /* Clients (about) — 5 cols at 390px gives sub-78px cells which is
     too cramped to read the marks. Drop to 3 cols on mobile and let
     each cell breathe; logos cap at a legible 36px high.
     The desktop ':nth-child(5n)' and ':nth-last-child(-n+5)' rules
     still apply at this breakpoint and cut the wrong cells in a
     3-col grid — explicitly reset every cell's border, then drop
     the right border on every 3rd and the bottom border on the
     last row of three. !important wins over the desktop rules. */
  .clients{padding:48px 0 0}
  .clients__head{padding:0 24px 24px;margin:0;max-width:none}
  .clients__h{font-size:26px;line-height:1.1}
  .clients__grid{
    grid-template-columns:repeat(3,1fr) !important;
    margin:0 24px;padding:0;max-width:none;
  }
  .client{
    aspect-ratio:1/1;padding:14px;
    border-right:1px solid var(--rule-hair) !important;
    border-bottom:1px solid var(--rule-hair) !important;
  }
  /* Drop right border on every 3rd cell (right edge of grid) and on
     the very last cell so a partial last row doesn't dangle a stray
     border. Drop bottom border only on cells in the last visible row
     — when the count isn't divisible by 3, that's just :last-child. */
  .client:nth-child(3n),.client:last-child{border-right:0 !important}
  .client:last-child{border-bottom:0 !important}
  .client:last-child:nth-child(3n+1){
    grid-column:1 / -1;
    aspect-ratio:3/1;
  }
  /* If the count IS divisible by 3, the last row is the last 3 cells
     and they all need their bottom border dropped — covered by the
     :last-child rule for the last cell, plus this for the other two
     when they happen to be the trailing row's siblings. The 25-logo
     case (8 full + 1) won't trigger anything extra since
     positions 23 & 24 do have a row below them (cell 25). */
  .client img{max-width:80% !important;max-height:36px !important}

  /* Contact block — heading dialled down so long phrases like
     "Без оплати. У нерозголошенні." stay inside the viewport. */
  .cblock{padding:64px 0}
  .cblock__inner{
    grid-template-columns:1fr;gap:32px;padding:0 24px;
  }
  .cblock__h{font-size:34px;line-height:1.05;margin-bottom:24px;letter-spacing:-.02em}
  .cblock__row{grid-template-columns:72px 1fr;gap:14px;padding:16px 0}
  .cblock__row-val{font-size:16px}
  .cblock__cta{padding:18px 24px 18px 22px;font-size:11px}

  /* Inner hero (services / practice / about / contacts) */
  .ihero{padding:40px 0 32px}
  .ihero__inner{
    grid-template-columns:1fr;gap:20px;padding:0 24px;align-items:start;
  }
  .ihero__h{font-size:46px;line-height:.95}
  .ihero__lead{font-size:16px;padding-bottom:0}

  /* Services index — Roman | body two-cols, count + chev hidden so the
     title gets the room it needs at a 390px viewport. */
  .svc{padding:32px 0 56px}
  .svc__list{padding:0 24px}
  .svc__row{
    grid-template-columns:64px 1fr !important;gap:16px;padding:22px 0 !important;
    align-items:start;
  }
  .svc__row:hover{padding-left:0 !important}
  .svc__row > .svc__row-count,
  .svc__row > .svc__row-chev{display:none !important}
  .svc__row-roman{font-size:36px;line-height:1}
  .svc__row-title{font-size:18px;line-height:1.2;margin-bottom:6px}
  .svc__row-sum{font-size:14px;line-height:1.45}

  /* Practice detail — single column, sidebar collapsed to a back-link
     pinned above the heading so the practice-list nav doesn't hijack
     vertical space. */
  .prac{padding:20px 0 56px}
  .prac__inner{
    grid-template-columns:1fr !important;gap:20px;padding:0 24px;
  }
  .prac__side{
    position:static !important;display:block;
    border:0 !important;padding:0 !important;margin:0 0 4px !important;
    gap:0 !important;
  }
  .prac__side > *{display:none !important}
  .prac__side > .prac__side-back{display:inline-flex !important;margin-bottom:0 !important}
  .prac__side-back{padding:0;font-size:10px}
  .prac__head{margin-bottom:32px}
  .prac__roman{font-size:42px;margin-bottom:8px}
  .prac__title{font-size:30px;line-height:1.08;margin-bottom:18px}
  .prac__lead{font-size:16px;padding-top:14px;line-height:1.55}
  .prac__b-head{margin-bottom:18px;flex-wrap:wrap;gap:8px}
  .prac__b-head-h{font-size:11px}
  .prac__b-head-rule{display:none}
  .prac__bullet{
    grid-template-columns:32px 1fr;gap:12px;padding:16px 0;
  }
  .prac__bullet-n{font-size:11px}
  .prac__bullet-t{font-size:15.5px;line-height:1.45}
  .prac__cta-row{
    grid-template-columns:1fr !important;gap:18px;padding:28px 20px;margin-top:40px;
  }
  .prac__cta-h{font-size:22px;line-height:1.2}

  /* About */
  .about{padding:40px 0 64px}
  .about__intro{
    grid-template-columns:1fr;gap:28px;padding:0 24px;margin-bottom:48px;
  }
  .about__intro-h{font-size:26px;line-height:1.15}
  .about__intro-body{font-size:15.5px}

  /* Leader (about) — photo full-width on top, name+role+quote stacked
     beneath. 3:4 aspect on mobile keeps the portrait prominent without
     dominating two screen heights. */
  .leader{padding:48px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
  .leader__inner{
    display:block !important;padding:0 24px;max-width:none;margin:0;
    grid-template-columns:none !important;gap:0 !important;
  }
  .leader__photo-wrap{margin:0 0 24px}
  .leader__photo{
    width:100% !important;max-width:none !important;
    aspect-ratio:3/4;object-fit:cover;display:block;
  }
  .leader__text{padding:0}
  .leader__name{font-size:28px;line-height:1.1;letter-spacing:-.015em;margin:8px 0 6px}
  .leader__role{font-size:10.5px;margin-bottom:20px}
  .leader__quote{font-size:15.5px;padding-top:20px;line-height:1.55}

  /* About pillars */
  .about__pillars{
    grid-template-columns:1fr !important;padding:0 24px;
  }
  .about__pillar{
    padding:28px 0 !important;border-right:0 !important;
    border-bottom:1px solid var(--rule-hair) !important;
  }
  .about__pillar:nth-child(n+2){padding-left:0 !important}
  .about__pillar:last-child{border-bottom:0 !important}
  .about__pillar-n{font-size:32px;margin-bottom:12px;line-height:1}
  .about__pillar-h{font-size:20px;margin-bottom:10px;line-height:1.15}
  .about__pillar-p{font-size:15px;line-height:1.5}

  /* About quote */
  .about__quote{margin:48px 0;padding:0 24px}
  .about__quote-mark{font-size:72px}
  .about__quote-t{font-size:22px;line-height:1.3}

  /* Contacts — kill italic placeholders + form note (the global
     *{font-style:normal} rule doesn't reach ::placeholder pseudos).
     Tighter row layout so phone, e-mail, hours all sit on one line. */
  .contacts{padding:32px 0 56px}
  .contacts__inner{
    grid-template-columns:1fr !important;gap:24px;padding:0 24px;
  }
  .office{padding:24px;gap:18px}
  .office__city{font-size:38px}
  .office__role{margin-top:-8px}
  .office__addr{font-size:15px;line-height:1.55;padding-top:18px}
  .office__row{
    grid-template-columns:64px 1fr !important;gap:12px;padding:12px 0 !important;
    align-items:baseline;
  }
  .office__row .meta{font-size:9.5px;letter-spacing:.18em}
  /* Bodoni's idiosyncratic '4' and '+' read poorly at 15px on phones.
     Switch contact rows to Crimson Pro on mobile — digits stay clean
     and the @-sign in e-mail looks like an @-sign. */
  .office__row a,.office__row span:not(.meta){
    font-family:var(--serif) !important;
    font-size:15.5px !important;letter-spacing:0 !important;
    font-feature-settings:"tnum" 1;
    font-variation-settings:normal !important;
  }
  .map{height:200px;margin-top:24px}
  .form{padding:28px 24px}
  .form__h{font-size:26px;margin-bottom:20px;line-height:1.15}
  .form__group{margin-bottom:18px}
  .form__label{font-size:9.5px;margin-bottom:8px}
  .form__input,.form__textarea{font-size:16px;padding:12px 0}
  .form__note{font-size:12px;margin:18px 0;font-style:normal !important}
  .form__submit{font-size:11px;padding:18px 24px !important}
/* Placeholder italic isn't reached by *{font-style:normal} rule —
   the ::placeholder pseudo-element needs its own rule. Apply a clean
   sans-italic placeholder treatment here. */
.form__input::placeholder,.form__textarea::placeholder{
  font-style:normal !important;font-family:var(--serif) !important;
  color:var(--ink-4) !important;
}

  /* 404 */
  .nf{padding:80px 24px 96px}
  .nf__num{font-size:140px}
  .nf__lead{font-size:22px}

  /* Footer — single column, layered editorial sections separated by
     hairline rules. Each col gets full breathing room. */
  .footer{padding:48px 0 28px}
  .footer__inner{padding:0 24px}
  .footer__top{
    grid-template-columns:1fr;gap:0;padding-bottom:24px;
  }
  .footer__top > div:first-child{grid-column:1;padding-bottom:32px;border-bottom:1px solid rgba(241,236,226,.16)}
  .footer__top > div:first-child + .footer__col{border-top:0;padding-top:32px}
  .footer__col{
    padding:28px 0;
    border-top:1px solid rgba(241,236,226,.10);
  }
  .footer__brand-mark{font-size:48px}
  .footer__brand-tag{font-size:14px;max-width:none}
  .footer__brand-geo{margin-top:18px;gap:12px}
  .footer__brand-geo-pin{font-size:22px}
  .footer__brand-geo-meta{flex-basis:100%;margin-top:4px}
  .footer__col h4{
    font-size:9.5px;margin-bottom:14px;letter-spacing:.22em;
    color:rgba(241,236,226,.55);
  }
  .footer__col a{font-size:15px}
  .footer__row{padding:8px 0;gap:14px}
  .footer__row-key{font-size:9px;min-width:54px}
  .footer__row-val{font-size:14.5px !important;line-height:1.45 !important}
  /* Languages — render as 4 chips on mobile rather than stacked links;
     reads like a real switcher, not a sub-menu. */
  .footer__col[data-langs] ul,
  .footer__col:has(a[data-lang]) ul{
    flex-direction:row !important;flex-wrap:wrap;gap:10px;
  }
  .footer__col:has(a[data-lang]) li{display:inline-block}
  .footer__col:has(a[data-lang]) a{
    display:inline-flex;padding:8px 14px;
    border:1px solid rgba(241,236,226,.18);
    font-family:var(--mono) !important;font-size:10px !important;
    letter-spacing:.22em;text-transform:uppercase;
    color:rgba(241,236,226,.85) !important;
    font-variation-settings:normal !important;
  }
  .footer__col:has(a[data-lang]) a.is-current{
    background:var(--gold);color:var(--ink) !important;
    border-color:var(--gold);
  }
  .footer__bottom{
    flex-direction:column;align-items:center;gap:14px;padding-top:24px;
    justify-content:center;text-align:center;
    border-top:1px solid rgba(241,236,226,.16);
  }
}
@media (max-width: 540px){
  .hero__below > div:nth-child(2){display:none}
  .footer__top{grid-template-columns:1fr}
}


/* Static links retain the established visual design and native navigation. */
a.lang__item{text-decoration:none}
.lang__menu{visibility:hidden}
.lang.is-open .lang__menu{visibility:visible}
a.ledger__row{color:inherit;text-decoration:none}
.ledger__list>li{list-style:none}
img{max-width:100%;height:auto}
.footer__row{grid-template-columns:minmax(0,1fr);gap:4px}
.footer__row-key{white-space:normal;min-width:0}
.footer__row-val{min-width:0;overflow-wrap:anywhere}
:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
html{scrollbar-gutter:stable;scrollbar-color:#8b7b62 #f1ece2}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
@media(forced-colors:active){html{scrollbar-color:auto}}