/* ==========================================================================
   BRONZA — minimal editorial look (white / soft grey / ink), shared with
   the BRONZA page of shulamitnadel.com,
   wide-tracked capitals, quiet motion. Works LTR (en) and RTL (he).
   ========================================================================== */

:root {
  --bg: #ffffff;
  --soft: #f1f0ee;
  --soft-2: #e7e5e1;
  --ink: #161616;
  --ink-2: #4a4a4a;
  --mute: #8d8b87;
  --line: #d8d6d2;
  --font: 'Jost', 'Heebo', system-ui, sans-serif;
  --gutter: clamp(16px, 4vw, 56px);
  --header-h: 84px;
  --ease: cubic-bezier(.22, .61, .36, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
}
html[lang="he"] { --font: 'Heebo', 'Jost', system-ui, sans-serif; }

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font);
  font-weight: 300;
  font-size: 16px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
::selection { background: var(--ink); color: var(--bg); }

/* language blocks: both languages live in the markup, one is hidden */
html[lang="en"] [data-lang="he"],
html[lang="he"] [data-lang="en"] { display: none !important; }

.caps {
  text-transform: uppercase;
  letter-spacing: .32em;
  font-size: 11px;
  font-weight: 400;
}
html[lang="he"] .caps { letter-spacing: .08em; font-size: 13px; }

.muted { color: var(--mute); }

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */
.site-header {
  position: fixed;
  inset: 0 0 auto 0;
  height: var(--header-h);
  z-index: 50;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 0 var(--gutter);
  transition: background .4s var(--ease), height .4s var(--ease), box-shadow .4s;
  top: env(safe-area-inset-top, 0px);
}
.site-header.is-scrolled {
  background: rgba(255, 255, 255, .92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  height: 64px;
  box-shadow: 0 1px 0 var(--line);
}
.logo {
  justify-self: start;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: .38em;
  text-transform: uppercase;
  white-space: nowrap;
}
.tagline { justify-self: center; color: var(--ink-2); }
.header-tools { justify-self: end; display: flex; align-items: center; gap: 28px; }

.lang-switch { display: flex; gap: 6px; align-items: center; font-size: 12px; letter-spacing: .14em; }
.lang-switch button { opacity: .4; transition: opacity .3s; padding: 4px 2px; }
.lang-switch button[aria-pressed="true"] { opacity: 1; }
.lang-switch button:hover { opacity: 1; }
.lang-switch span { opacity: .3; }

.menu-btn { display: flex; align-items: center; gap: 14px; height: 40px; }
.menu-btn .bars { width: 28px; height: 9px; position: relative; }
.menu-btn .bars::before, .menu-btn .bars::after {
  content: ""; position: absolute; inset-inline: 0; height: 1px; background: var(--ink);
  transition: transform .45s var(--ease-out), top .45s var(--ease-out), width .3s;
}
.menu-btn .bars::before { top: 0; }
.menu-btn .bars::after { top: 8px; width: 70%; }
.menu-btn:hover .bars::after { width: 100%; }
.menu-open .menu-btn .bars::before { top: 4px; transform: rotate(45deg); }
.menu-open .menu-btn .bars::after { top: 4px; width: 100%; transform: rotate(-45deg); }

@media (max-width: 860px) {
  .tagline { display: none; }
  .site-header { grid-template-columns: 1fr auto; }
  .menu-btn .label { display: none; }
  .header-tools { gap: 18px; }
  .logo { font-size: 12px; letter-spacing: .28em; }
}

/* --------------------------------------------------------------------------
   Full-screen menu
   -------------------------------------------------------------------------- */
.menu {
  position: fixed; inset: 0; z-index: 40;
  background: var(--bg);
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  padding: calc(var(--header-h) + 4vh) var(--gutter) var(--gutter);
  gap: var(--gutter);
  clip-path: inset(0 0 100% 0);
  transition: clip-path .8s var(--ease-out);
  visibility: hidden;
}
.menu-open .menu { clip-path: inset(0 0 0 0); visibility: visible; }
.menu nav { display: flex; flex-direction: column; justify-content: center; }
.menu-link {
  display: flex; align-items: baseline; gap: 22px;
  padding: 1.1vh 0;
  font-size: clamp(34px, 5.6vw, 76px);
  line-height: 1.12;
  font-weight: 300;
  letter-spacing: .02em;
  opacity: 0; transform: translateY(30px);
  transition: opacity .6s var(--ease), transform .8s var(--ease-out), color .3s;
}
.menu-link .num { font-size: 11px; letter-spacing: .3em; color: var(--mute); min-width: 2.4em; }
.menu-link .txt { position: relative; }
.menu-link .txt::after {
  content: ""; position: absolute; inset-inline-start: 0; bottom: .08em; height: 1px; width: 0;
  background: var(--ink); transition: width .5s var(--ease-out);
}
.menu-link:hover .txt::after, .menu-link[aria-current="page"] .txt::after { width: 100%; }
.menu nav:hover .menu-link { color: var(--mute); }
.menu nav:hover .menu-link:hover { color: var(--ink); }
.menu-open .menu-link { opacity: 1; transform: none; }
.menu-open .menu-link:nth-child(1) { transition-delay: .18s; }
.menu-open .menu-link:nth-child(2) { transition-delay: .24s; }
.menu-open .menu-link:nth-child(3) { transition-delay: .30s; }
.menu-open .menu-link:nth-child(4) { transition-delay: .36s; }
.menu-open .menu-link:nth-child(5) { transition-delay: .42s; }

.menu-preview { position: relative; overflow: hidden; background: var(--soft); align-self: stretch; }
.menu-preview img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  opacity: 0; transform: scale(1.08) rotate(-1deg);
  transition: opacity .7s var(--ease), transform 1.4s var(--ease-out);
}
.menu-preview img.is-active { opacity: 1; transform: scale(1) rotate(0); }
.menu-foot {
  position: absolute; inset-inline: var(--gutter); bottom: 22px;
  display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap;
  color: var(--mute);
}
.menu-foot a:hover { color: var(--ink); }
@media (max-width: 860px) {
  .menu { grid-template-columns: 1fr; }
  .menu-preview { display: none; }
  .menu nav { justify-content: flex-start; padding-top: 4vh; }
}

/* --------------------------------------------------------------------------
   Page curtain (transition between pages)
   -------------------------------------------------------------------------- */
.curtain {
  position: fixed; inset: 0; z-index: 100; background: var(--soft);
  pointer-events: none;
  transform-origin: top;
  animation: curtain-out .9s var(--ease-out) .05s both;
}
.curtain.is-in { animation: curtain-in .5s var(--ease) both; transform-origin: bottom; }
@keyframes curtain-out { from { transform: scaleY(1); } to { transform: scaleY(0); } }
@keyframes curtain-in { from { transform: scaleY(0); } to { transform: scaleY(1); } }

/* --------------------------------------------------------------------------
   Shared bits
   -------------------------------------------------------------------------- */
main { display: block; }
.wrap { padding-inline: var(--gutter); }

.side-label {
  display: inline-flex; align-items: center; gap: 18px; color: var(--ink-2);
}
.side-label::before, .side-label::after { content: ""; width: 34px; height: 1px; background: var(--line); }

.link-line {
  display: inline-flex; align-items: center; gap: 16px;
  padding: 8px 0;
}
.link-line .ln { width: 46px; height: 1px; background: var(--ink); transition: width .5s var(--ease-out); }
.link-line:hover .ln { width: 86px; }
.arrow { display: inline-block; transition: transform .4s var(--ease-out); }
html[dir="rtl"] .arrow { transform: scaleX(-1); }

/* image frame: holds an <img>, used for parallax + wiggle */
.frame { position: relative; overflow: hidden; background: var(--soft); }
.frame img { width: 100%; height: 100%; object-fit: cover; }
.frame[data-parallax] img { height: 118%; position: absolute; top: -9%; left: 0; will-change: transform; }

/* hover wiggle — the signature "photo is alive" touch */
.wiggle { transform-origin: 50% 60%; }
.wiggle:hover .frame, .wiggle.is-wiggling .frame { animation: wiggle .9s var(--ease) both; }
@keyframes wiggle {
  0%   { transform: rotate(0) scale(1); }
  20%  { transform: rotate(-1.4deg) scale(1.015); }
  45%  { transform: rotate(1.1deg) scale(1.02); }
  70%  { transform: rotate(-.5deg) scale(1.02); }
  100% { transform: rotate(0) scale(1.02); }
}
.wiggle .frame img { transition: transform 1.2s var(--ease-out), filter .6s; }
.wiggle:hover .frame img { transform: scale(1.05); }

/* scroll reveal */
.reveal { opacity: 0; transform: translateY(40px) rotate(var(--tilt, 0deg)); transition: opacity 1s var(--ease), transform 1.3s var(--ease-out); }
.reveal.is-in { opacity: 1; transform: none; }
.reveal-img .frame { clip-path: inset(12% 6% 12% 6%); transition: clip-path 1.4s var(--ease-out); }
.reveal-img.is-in .frame { clip-path: inset(0 0 0 0); }

/* --------------------------------------------------------------------------
   Home — split hero (template "opening" layout)
   -------------------------------------------------------------------------- */
.hero {
  min-height: 100svh;
  display: grid;
  grid-template-columns: 1fr 1fr;
  position: relative;
}
.hero-left {
  background:
    radial-gradient(120% 70% at 20% 30%, rgba(255,255,255,.9) 0%, rgba(255,255,255,0) 60%),
    linear-gradient(115deg, var(--soft) 0%, #f7f6f4 42%, var(--soft-2) 43.5%, var(--soft) 52%, #f8f7f5 100%);
  position: relative;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: calc(var(--header-h) + 6vh) var(--gutter) 10vh;
}
.hero-title {
  font-size: clamp(40px, 6.4vw, 104px);
  line-height: .98;
  font-weight: 300;
  letter-spacing: .04em;
  margin: 0 0 4vh;
  text-transform: uppercase;
}
html[lang="he"] .hero-title { letter-spacing: 0; line-height: 1.05; }
.hero-title .line { display: block; overflow: hidden; }
.hero-title .line > span { display: inline-block; animation: rise 1.3s var(--ease-out) both; }
.hero-title .line:nth-child(2) > span { animation-delay: .12s; }
@keyframes rise { from { transform: translateY(105%); } to { transform: none; } }
.hero-sub { color: var(--ink-2); max-width: 34ch; margin: 0 0 5vh; }
.hero-right { position: relative; padding: calc(var(--header-h) + 4vh) var(--gutter) 8vh; display: flex; align-items: center; }
.hero-label {
  position: absolute; top: 50%; inset-inline-start: 0; transform: translate(-50%, -50%);
  z-index: 3; background: var(--bg); padding: 10px 0;
}
html[dir="rtl"] .hero-label { transform: translate(50%, -50%); }
.hero-label .side-label { writing-mode: horizontal-tb; }
.slideshow { position: relative; width: 100%; height: min(78svh, 900px); overflow: hidden; background: var(--soft); }
.slideshow img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  opacity: 0; transform: scale(1.12);
  transition: opacity 1.6s var(--ease), transform 7s linear;
}
.slideshow img.is-active { opacity: 1; transform: scale(1); }
.slide-count { position: absolute; bottom: 3vh; inset-inline-end: var(--gutter); display: flex; gap: 12px; align-items: center; }
.slide-count .bar { width: 60px; height: 1px; background: var(--line); position: relative; overflow: hidden; }
.slide-count .bar i { position: absolute; inset: 0; background: var(--ink); transform-origin: left; transform: scaleX(0); }
html[dir="rtl"] .slide-count .bar i { transform-origin: right; }
.slide-count .bar i.run { animation: bar 5.5s linear both; }
@keyframes bar { to { transform: scaleX(1); } }
.scroll-cue { display: inline-flex; align-items: center; gap: 14px; color: var(--ink-2); }
.scroll-cue .dot { width: 1px; height: 46px; background: var(--line); position: relative; overflow: hidden; }
.scroll-cue .dot::after { content: ""; position: absolute; left: 0; width: 1px; height: 40%; background: var(--ink); animation: drip 2.2s var(--ease) infinite; }
@keyframes drip { from { top: -40%; } to { top: 100%; } }

@media (max-width: 860px) {
  .hero { grid-template-columns: 1fr; }
  .hero-left { order: 2; padding: 8vh var(--gutter); min-height: auto; }
  .hero-right { order: 1; padding: calc(var(--header-h)) var(--gutter) 0; }
  .slideshow { height: 62svh; }
  .hero-label { display: none; }
  .scroll-cue { display: none; }
}

/* chapters on home */
.chapters { padding: 14vh 0 6vh; }
.chapter {
  display: grid; grid-template-columns: repeat(12, 1fr); gap: var(--gutter);
  align-items: center; padding: 0 var(--gutter); margin-bottom: 18vh;
}
.chapter .frame { aspect-ratio: 4 / 5; }
.chapter-media { grid-column: 2 / span 5; }
.chapter-text { grid-column: 8 / span 4; }
.chapter:nth-child(even) .chapter-media { grid-column: 7 / span 5; order: 2; }
.chapter:nth-child(even) .chapter-text { grid-column: 2 / span 4; order: 1; }
.chapter-num { font-size: clamp(60px, 9vw, 140px); font-weight: 300; line-height: 1; color: var(--soft-2); margin-bottom: -.25em; letter-spacing: -.02em; }
.chapter-title { font-size: clamp(30px, 3.6vw, 54px); font-weight: 300; line-height: 1.1; margin: 0 0 14px; letter-spacing: .04em; text-transform: uppercase; position: relative; }
html[lang="he"] .chapter-title { letter-spacing: 0; }
.chapter-sub { color: var(--ink-2); margin: 0 0 36px; }
@media (max-width: 860px) {
  .chapter, .chapter:nth-child(even) { grid-template-columns: 1fr; margin-bottom: 12vh; }
  .chapter-media, .chapter-text, .chapter:nth-child(even) .chapter-media, .chapter:nth-child(even) .chapter-text { grid-column: 1; order: initial; }
}

/* --------------------------------------------------------------------------
   Page head (index + project pages)
   -------------------------------------------------------------------------- */
.page-head {
  padding: calc(var(--header-h) + 12vh) var(--gutter) 10vh;
  display: grid; grid-template-columns: repeat(12, 1fr); gap: var(--gutter); align-items: end;
  position: relative;
}
.page-head .crumbs { grid-column: 1 / -1; display: flex; gap: 14px; align-items: center; color: var(--mute); margin-bottom: 2vh; }
.page-head .crumbs a:hover { color: var(--ink); }
.page-title {
  grid-column: 1 / span 9; margin: 0;
  font-size: clamp(42px, 7.6vw, 128px); font-weight: 300; line-height: .98;
  letter-spacing: .03em; text-transform: uppercase;
}
html[lang="he"] .page-title { letter-spacing: 0; line-height: 1.05; }
.page-title.long { font-size: clamp(34px, 5vw, 80px); line-height: 1.04; }
.page-meta { grid-column: 10 / span 3; justify-self: end; text-align: end; color: var(--ink-2); }
.page-head::after { content: ""; position: absolute; inset-inline: var(--gutter); bottom: 0; height: 1px; background: var(--line); transform-origin: left; animation: draw 1.6s var(--ease-out) .3s both; }
html[dir="rtl"] .page-head::after { transform-origin: right; }
@keyframes draw { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@media (max-width: 860px) {
  .page-title, .page-meta { grid-column: 1 / -1; justify-self: start; text-align: start; }
}

/* --------------------------------------------------------------------------
   Project index grid (staggered, editorial)
   -------------------------------------------------------------------------- */
.index-grid {
  display: grid; grid-template-columns: repeat(2, 1fr);
  column-gap: clamp(24px, 8vw, 140px); row-gap: 12vh;
  padding: 12vh calc(var(--gutter) + 4vw) 16vh;
}
.index-grid .card:nth-child(even) { margin-top: 22vh; }
.card { display: block; perspective: 900px; }
.card .tilt { transition: transform .6s var(--ease-out); transform-style: preserve-3d; }
.card .frame { aspect-ratio: 4 / 5; }
.card-meta { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding-top: 18px; border-top: 1px solid transparent; }
.card-title { font-size: clamp(18px, 1.7vw, 26px); font-weight: 300; letter-spacing: .14em; text-transform: uppercase; margin: 0; transition: letter-spacing .6s var(--ease-out); }
html[lang="he"] .card-title { letter-spacing: 0; }
.card:hover .card-title { letter-spacing: .2em; }
html[lang="he"] .card:hover .card-title { letter-spacing: .02em; }
.card-num { color: var(--mute); }
@media (max-width: 700px) {
  .index-grid { grid-template-columns: 1fr; padding-inline: var(--gutter); row-gap: 9vh; }
  .index-grid .card:nth-child(even) { margin-top: 0; }
}

/* --------------------------------------------------------------------------
   Project gallery
   -------------------------------------------------------------------------- */
.gallery { columns: 3 320px; column-gap: clamp(14px, 2vw, 28px); padding: 10vh var(--gutter) 6vh; }
.gallery .item { break-inside: avoid; margin-bottom: clamp(14px, 2vw, 28px); cursor: pointer; }
.gallery .item .frame { background: var(--soft); }
.gallery .item img { height: auto; }
.films:empty { display: none; }
.films { padding: 10vh var(--gutter) 0; display: grid; justify-items: center; gap: 4vh; }
.films + .gallery { padding-top: 6vh; }
.video { width: 100%; max-width: 1100px; }
.video.portrait { max-width: 400px; }
.video .ratio { position: relative; width: 100%; background: var(--ink); }
.video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* link-out card used where embeds can't run (artifact preview copy) */
.watch {
  position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px;
  color: #fff; background: #111 var(--poster) center / cover no-repeat; isolation: isolate;
}
.watch::before { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, .45); z-index: -1; transition: background .4s var(--ease); }
.watch:hover::before { background: rgba(0, 0, 0, .3); }
/* reel covers on the BRONZA phones: lighter veil so the cover itself reads */
.phone .watch::before { background: rgba(0, 0, 0, .18); }
.phone .watch:hover::before { background: rgba(0, 0, 0, .08); }
.watch .play { width: 64px; height: 64px; border: 1px solid #fff; border-radius: 50%; position: relative; transition: transform .5s var(--ease-out); }
.watch .play::after { content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-35%, -50%); border-style: solid; border-width: 9px 0 9px 15px; border-color: transparent transparent transparent #fff; }
.watch:hover .play { transform: scale(1.1); }
.watch .caps { text-align: center; padding-inline: 12px; }

/* next project */
.next {
  display: grid; grid-template-columns: 1fr auto; align-items: center; gap: var(--gutter);
  padding: 12vh var(--gutter); border-top: 1px solid var(--line); margin-top: 6vh; position: relative; overflow: hidden;
}
.next-title { font-size: clamp(36px, 6vw, 96px); font-weight: 300; text-transform: uppercase; letter-spacing: .04em; line-height: 1; margin: 10px 0 0; transition: transform .7s var(--ease-out); }
html[lang="he"] .next-title { letter-spacing: 0; }
.next:hover .next-title { transform: translateX(14px); }
html[dir="rtl"] .next:hover .next-title { transform: translateX(-14px); }
.next .frame { width: clamp(120px, 16vw, 240px); aspect-ratio: 4 / 5; }

/* --------------------------------------------------------------------------
   Lightbox
   -------------------------------------------------------------------------- */
.lightbox {
  position: fixed; inset: 0; z-index: 80; background: var(--bg);
  display: grid; grid-template-rows: auto 1fr auto; opacity: 0; visibility: hidden;
  transition: opacity .45s var(--ease), visibility .45s;
}
.lightbox.is-open { opacity: 1; visibility: visible; }
.lb-top, .lb-bottom { display: flex; justify-content: space-between; align-items: center; padding: 22px var(--gutter); }
.lb-stage { position: relative; display: grid; place-items: center; padding: 0 calc(var(--gutter) + 50px); min-height: 0; }
.lb-stage img {
  max-width: 100%; max-height: calc(100svh - 160px); width: auto; height: auto; object-fit: contain;
  transition: opacity .35s var(--ease), transform .6s var(--ease-out);
}
.lb-stage img.is-loading { opacity: 0; transform: scale(.98) rotate(-.6deg); }
.lb-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 50px; height: 50px; display: grid; place-items: center; }
.lb-nav svg { width: 30px; height: 30px; stroke: var(--ink); fill: none; stroke-width: 1; transition: transform .35s var(--ease-out); }
.lb-prev { inset-inline-start: var(--gutter); }
.lb-next { inset-inline-end: var(--gutter); }
html[dir="rtl"] .lb-nav svg { transform: scaleX(-1); }
.lb-prev:hover svg { transform: translateX(-5px); }
.lb-next:hover svg { transform: translateX(5px); }
html[dir="rtl"] .lb-prev:hover svg { transform: scaleX(-1) translateX(-5px); }
html[dir="rtl"] .lb-next:hover svg { transform: scaleX(-1) translateX(5px); }
.lb-close { display: flex; align-items: center; gap: 12px; }
.lb-close i { width: 22px; height: 22px; position: relative; }
.lb-close i::before, .lb-close i::after { content: ""; position: absolute; top: 50%; left: 0; width: 100%; height: 1px; background: var(--ink); transform: rotate(45deg); transition: transform .4s var(--ease-out); }
.lb-close i::after { transform: rotate(-45deg); }
.lb-close:hover i::before { transform: rotate(135deg); }
.lb-close:hover i::after { transform: rotate(45deg); }
@media (max-width: 700px) {
  .lb-stage { padding: 0 8px; }
  .lb-nav { display: none; }
}

/* --------------------------------------------------------------------------
   BRONZA
   -------------------------------------------------------------------------- */
.bronza-hero {
  min-height: 100svh; display: grid; grid-template-columns: 1fr 1fr; align-items: center;
  padding: calc(var(--header-h) + 6vh) var(--gutter) 8vh; gap: var(--gutter);
  background: linear-gradient(180deg, var(--bg) 0%, var(--bg) 70%, var(--soft) 70%, var(--soft) 100%);
}
.bronza-word {
  font-size: clamp(64px, 12vw, 200px); font-weight: 300; letter-spacing: .12em; line-height: 1;
  margin: 0 0 4vh; font-family: 'Jost', sans-serif; display: flex; align-items: center; gap: .25em;
}
.bronza-word .ring { width: .22em; height: .22em; border: 1px solid var(--ink); border-radius: 50%; display: inline-grid; place-items: center; flex: none; animation: spin 14s linear infinite; }
.bronza-word .ring::after { content: ""; width: 26%; height: 26%; border-radius: 50%; border: 1px solid var(--ink); }
@keyframes spin { to { transform: rotate(360deg); } }
.bronza-lead { font-size: clamp(20px, 2vw, 28px); line-height: 1.45; font-weight: 400; max-width: 30ch; margin: 0 0 3vh; }
.bronza-text p { max-width: 54ch; color: var(--ink-2); margin: 0 0 1.4em; }
.bronza-text strong { font-weight: 500; color: var(--ink); }

/* phones */
.phones { position: relative; display: flex; justify-content: center; align-items: center; gap: clamp(16px, 3vw, 44px); min-height: 70svh; }
.phone {
  width: clamp(220px, 19vw, 300px); aspect-ratio: 9 / 19; border-radius: 38px; padding: 10px;
  background: #111; box-shadow: 0 30px 60px -20px rgba(0,0,0,.35), inset 0 0 0 1.5px #333;
  position: relative; animation: float 6s ease-in-out infinite;
}
.phone:nth-child(2) { animation-delay: -3s; margin-top: 14vh; }
.phone::before { content: ""; position: absolute; top: 18px; left: 50%; transform: translateX(-50%); width: 34%; height: 22px; border-radius: 14px; background: #111; z-index: 2; }
.phone-screen { width: 100%; height: 100%; border-radius: 29px; overflow: hidden; background: #fff; position: relative; }
.phone-screen iframe { position: absolute; top: -54px; left: 0; width: 100%; height: calc(100% + 140px); border: 0; max-width: none; }
.phone:hover { animation-play-state: paused; }
@keyframes float {
  0%, 100% { transform: translateY(0) rotate(-2deg); }
  50% { transform: translateY(-16px) rotate(1.5deg); }
}
.follow { display: flex; justify-content: center; margin-top: 4vh; }
.btn {
  display: inline-flex; align-items: center; gap: 14px; padding: 16px 30px; border: 1px solid var(--ink);
  position: relative; overflow: hidden; isolation: isolate; transition: color .45s var(--ease);
}
.btn::before { content: ""; position: absolute; inset: 0; background: var(--ink); transform: scaleY(0); transform-origin: bottom; transition: transform .45s var(--ease-out); z-index: -1; }
.btn:hover { color: var(--bg); }
.btn:hover::before { transform: scaleY(1); }

.tracks { padding: 16vh var(--gutter); display: grid; grid-template-columns: repeat(12, 1fr); gap: var(--gutter); }
.tracks-intro { grid-column: 1 / span 4; }
.tracks-intro h2 { font-size: clamp(26px, 2.6vw, 38px); font-weight: 300; line-height: 1.25; margin: 2vh 0 0; }
.tracks-media { display: block; margin-top: 5vh; max-width: 420px; }
.tracks-media .frame { aspect-ratio: 4 / 5; }
.track-list { grid-column: 6 / span 7; display: grid; gap: 0; }
.track { border-top: 1px solid var(--line); padding: 5vh 0; display: grid; grid-template-columns: 70px 1fr; gap: 20px; }
.track:last-child { border-bottom: 1px solid var(--line); }
.track h3 { font-size: clamp(22px, 2vw, 30px); font-weight: 400; margin: 0 0 10px; line-height: 1.25; }
.track p { margin: 0 0 18px; color: var(--ink-2); }
.track .num { color: var(--mute); padding-top: 8px; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px; padding: 0; list-style: none; }
.chips li { border: 1px solid var(--line); border-radius: 999px; padding: 5px 14px; font-size: 14px; transition: background .3s, border-color .3s, transform .4s var(--ease-out); }
.chips li:hover { background: var(--soft); border-color: var(--ink); transform: rotate(-2deg); }
.stage-label { font-weight: 500; margin: 0 0 8px; font-size: 15px; }
@media (max-width: 1100px) {
  .bronza-hero { grid-template-columns: 1fr; background: var(--bg); }
  .phones { min-height: auto; padding: 6vh 0 2vh; }
  .phone { width: min(38vw, 280px); }
}
@media (max-width: 860px) {
  .phone { width: min(44vw, 230px); border-radius: 28px; padding: 7px; }
  .phone-screen { border-radius: 22px; }
  .tracks-intro, .track-list { grid-column: 1 / -1; }
  .tracks { grid-template-columns: 1fr; }
  .track { grid-template-columns: 1fr; gap: 6px; }
}

.clients { padding: 6vh var(--gutter) 16vh; text-align: center; }
.clients h2 { margin: 0 0 7vh; font-weight: 400; }
.logo-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: clamp(14px, 2.4vw, 34px); max-width: 1180px; margin: 0 auto; }
.logo-grid .wiggle { display: block; width: clamp(96px, 13vw, 156px); }
.logo-grid .frame { aspect-ratio: 1; border-radius: 50%; background: #fff; box-shadow: 0 0 0 1px var(--line); }
.logo-grid .frame img { object-fit: contain; }
.logo-grid a.wiggle:hover .frame { box-shadow: 0 0 0 1px var(--ink); }

/* --------------------------------------------------------------------------
   Contact
   -------------------------------------------------------------------------- */
.contact { min-height: 100svh; display: grid; grid-template-columns: 5fr 7fr; }
.contact-media { position: relative; }
.contact-media .frame { position: sticky; top: 0; height: 100svh; }
.contact-body { padding: calc(var(--header-h) + 10vh) clamp(24px, 7vw, 120px) 10vh; }
.contact-body h1 { font-size: clamp(42px, 6vw, 96px); font-weight: 300; text-transform: uppercase; letter-spacing: .04em; line-height: 1; margin: 2vh 0 6vh; }
html[lang="he"] .contact-body h1 { letter-spacing: 0; }
.contact-info { display: grid; gap: 4px; margin-bottom: 8vh; font-size: 18px; }
.contact-info a { width: fit-content; background: linear-gradient(var(--ink), var(--ink)) no-repeat 0 100% / 0 1px; transition: background-size .5s var(--ease-out); }
html[dir="rtl"] .contact-info a { background-position: 100% 100%; }
.contact-info a:hover { background-size: 100% 1px; }
.contact-info .name { font-weight: 400; margin-bottom: 10px; }

.form { display: grid; gap: 34px; max-width: 620px; }
.field { position: relative; }
.field input, .field textarea {
  width: 100%; border: 0; border-bottom: 1px solid var(--line); background: transparent; color: var(--ink);
  font: inherit; font-size: 17px; padding: 22px 0 10px; outline: none; border-radius: 0; resize: vertical;
  transition: border-color .3s;
}
.field textarea { min-height: 130px; }
.field label { position: absolute; inset-inline-start: 0; top: 22px; color: var(--mute); pointer-events: none; transition: transform .35s var(--ease-out), font-size .35s, top .35s, color .3s; }
.field input:focus, .field textarea:focus { border-color: var(--ink); }
.field input:focus + label, .field input:not(:placeholder-shown) + label,
.field textarea:focus + label, .field textarea:not(:placeholder-shown) + label { top: 0; font-size: 12px; color: var(--ink-2); }
.field .bar { position: absolute; inset-inline-start: 0; bottom: 0; height: 1px; width: 0; background: var(--ink); transition: width .6s var(--ease-out); }
.field input:focus ~ .bar, .field textarea:focus ~ .bar { width: 100%; }
.hp { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; clip-path: inset(50%); pointer-events: none; }
.form-status { min-height: 1.6em; color: var(--ink-2); }
.form-status.ok { color: var(--ink); }
.form .btn[disabled] { opacity: .5; pointer-events: none; }
@media (max-width: 860px) {
  .contact { grid-template-columns: 1fr; }
  .contact-media .frame { position: relative; height: 50svh; }
  .contact-body { padding-top: 8vh; }
}

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */
.site-footer {
  padding: 8vh var(--gutter) 5vh; border-top: 1px solid var(--line);
  display: grid; grid-template-columns: 1fr auto 1fr; gap: 24px; align-items: end;
}
.footer-big { grid-column: 1 / -1; font-size: clamp(32px, 7vw, 120px); font-weight: 300; letter-spacing: .1em; line-height: 1; margin: 0 0 6vh; text-transform: uppercase; display: flex; justify-content: space-between; align-items: end; gap: 20px; flex-wrap: wrap; }
.footer-big a { font-size: 13px; letter-spacing: .3em; }
.site-footer .center { justify-self: center; }
.site-footer .end { justify-self: end; display: flex; gap: 24px; }
.site-footer a:hover { color: var(--mute); }
@media (max-width: 700px) {
  .site-footer { grid-template-columns: 1fr; }
  .site-footer .center, .site-footer .end { justify-self: start; }
}

/* --------------------------------------------------------------------------
   Motion preferences
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
  .reveal-img .frame { clip-path: none; }
}

/* ==========================================================================
   BRONZA site additions
   ========================================================================== */
.logo-bronza { display: inline-flex; align-items: center; gap: 10px; font-family: 'Jost', sans-serif; }
.logo-bronza .ring { width: 14px; height: 14px; border: 1px solid var(--ink); border-radius: 50%; display: inline-grid; place-items: center; animation: spin 14s linear infinite; }
.logo-bronza .ring::after { content: ""; width: 30%; height: 30%; border-radius: 50%; border: 1px solid var(--ink); }

.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 28px; margin-top: 5vh; }

/* manifesto */
.manifesto { padding: 18vh var(--gutter) 12vh; max-width: 1100px; margin: 0 auto; text-align: center; }
.manifesto h2 { font-size: clamp(28px, 3.8vw, 56px); font-weight: 300; line-height: 1.2; margin: 3vh 0; }
.manifesto p:last-child { color: var(--ink-2); max-width: 60ch; margin: 0 auto; font-size: 18px; }
.manifesto strong { font-weight: 500; color: var(--ink); }

/* studio feed: staggered strip of BRONZA's own posts */
.feed { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(10px, 1.6vw, 22px); padding: 4vh var(--gutter) 16vh; }
.feed-item { margin: 0; }
.feed-item .frame { aspect-ratio: 4 / 5; }
.feed-item:nth-child(4n+2), .feed-item:nth-child(4n+4) { transform: translateY(8vh); }
@media (max-width: 860px) {
  .feed { grid-template-columns: repeat(2, 1fr); }
  .feed-item:nth-child(4n+2), .feed-item:nth-child(4n+4) { transform: none; }
  .feed-item:nth-child(even) { transform: translateY(5vh); }
}

/* selected work on home */
.selected { border-top: 1px solid var(--line); }
.section-head { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 8vh var(--gutter) 0; flex-wrap: wrap; }
.selected .index-grid { padding-top: 8vh; }

.card-sub { margin: 4px 0 0; font-size: 14px; }
.frame.is-reel { background: #161616; }
.frame.is-reel .play, .phone .play { pointer-events: none; }
.frame.is-reel .play { position: absolute; inset: 0; margin: auto; width: 58px; height: 58px; border: 1px solid #fff; border-radius: 50%; }
.frame.is-reel .play::after { content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-35%, -50%); border-style: solid; border-width: 8px 0 8px 13px; border-color: transparent transparent transparent #fff; }

/* work filters */
.filters { display: flex; flex-wrap: wrap; gap: 10px; padding: 6vh var(--gutter) 0; }
.filters button { border: 1px solid var(--line); border-radius: 999px; padding: 9px 18px; letter-spacing: inherit; text-transform: inherit; font-size: inherit; transition: background .3s, color .3s, border-color .3s; }
.filters button:hover { border-color: var(--ink); }
.filters button[aria-pressed="true"] { background: var(--ink); color: var(--bg); border-color: var(--ink); }
.filters + .index-grid { padding-top: 8vh; }

/* client page */
.client-note { text-transform: none; letter-spacing: 0; font-size: 16px; margin: 0 0 10px; color: var(--ink-2); }
.page-meta .link-line { justify-content: flex-end; }
.phones-row { padding: 12vh var(--gutter) 4vh; min-height: auto; flex-wrap: wrap; }
.phones-row[hidden] { display: none; }
.phones-row .phone:nth-child(2) { margin-top: 10vh; }
.phones-row .phone:nth-child(3) { margin-top: 4vh; }
.watch { background-color: #161616; }
.gallery:empty { display: none; }
.gallery.few { columns: 2 280px; max-width: 980px; margin: 0 auto; }
@media (max-width: 860px) {
  .page-meta .link-line { justify-content: flex-start; }
  .phones-row .phone:nth-child(n) { margin-top: 0; }
}

/* services */
.fields { padding: 10vh var(--gutter) 0; max-width: 980px; }
.tracks-media { display: block; margin-top: 5vh; max-width: 420px; }
.tracks-media .frame { aspect-ratio: 4 / 5; }

/* about */
.split { display: grid; grid-template-columns: repeat(12, 1fr); gap: var(--gutter); align-items: center; padding: 14vh var(--gutter) 0; }
.split-media { grid-column: 2 / span 5; }
.split-media .frame { aspect-ratio: 4 / 5; }
.split-text { grid-column: 8 / span 4; }
.split.reverse .split-media { grid-column: 7 / span 5; order: 2; }
.split.reverse .split-text { grid-column: 2 / span 4; order: 1; }
.split-text h2, .founder h2 { font-size: clamp(30px, 3.6vw, 54px); font-weight: 300; line-height: 1.1; margin: 2vh 0 3vh; text-transform: uppercase; letter-spacing: .04em; }
html[lang="he"] .split-text h2, html[lang="he"] .founder h2 { letter-spacing: 0; }
.split-text p { color: var(--ink-2); }
.split-text strong { font-weight: 500; color: var(--ink); }
.founder { display: grid; grid-template-columns: repeat(12, 1fr); gap: var(--gutter); align-items: center; padding: 16vh var(--gutter) 0; }
.founder .split-media { grid-column: 3 / span 3; }
.founder .split-text { grid-column: 7 / span 5; }
@media (max-width: 860px) {
  .split, .founder { grid-template-columns: 1fr; padding-top: 10vh; }
  .split-media, .split-text, .split.reverse .split-media, .split.reverse .split-text,
  .founder .split-media, .founder .split-text { grid-column: 1; order: initial; }
  .founder .split-media { max-width: 60%; }
}

/* call to action */
.cta { padding: 18vh var(--gutter); text-align: center; display: grid; justify-items: center; gap: 3vh; }
.cta h2 { font-size: clamp(40px, 7vw, 112px); font-weight: 300; line-height: 1; margin: 0; letter-spacing: .02em; }
.clients + .cta { border-top: 1px solid var(--line); }

/* contact (no form) */
.contact-media .frame img { position: absolute; inset: 0; height: 118%; top: -9%; }

/* inline videos inside a client gallery */
.gallery .item-video { cursor: pointer; }
.gallery .item-video .frame { background: #161616; }
.gallery .item-video video { display: block; width: 100%; height: 100%; object-fit: cover; }

/* galleries that follow an Instagram carousel: row by row, left to right (right to left in Hebrew) */
.gallery.ordered { columns: auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(14px, 2vw, 28px); }
.gallery.ordered .item { margin: 0; }
.gallery.ordered .item .frame { aspect-ratio: 4 / 5 !important; }
.gallery.ordered .item img, .gallery.ordered .item video { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 860px) { .gallery.ordered { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .gallery.ordered { grid-template-columns: 1fr; } }
/* short carousels (1–2 slides): two centred columns instead of three */
.gallery.ordered.few { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 480px) { .gallery.ordered.few { grid-template-columns: 1fr; } }

/* a page with a single item (e.g. one reel): one centred column, phone-width */
.gallery.single { columns: 1; max-width: 420px; margin: 0 auto; }

/* ==========================================================================
   Home — one clean screen: wordmark, lead, the DNA and an index of the site
   ========================================================================== */
.home {
  min-height: 100svh; box-sizing: border-box; display: grid; grid-template-rows: auto 1fr auto;
  padding: calc(var(--header-h) + 2vh) var(--gutter) 4vh; gap: 2.5vh;
}
.home-top { display: flex; justify-content: space-between; gap: 20px; color: var(--mute); flex-wrap: wrap; }

.home-center { align-self: center; }
.home-word {
  font-family: 'Jost', sans-serif; font-weight: 300; margin: 0;
  font-size: clamp(54px, 17.6vw, 320px); letter-spacing: .14em; line-height: .9;
  margin-inline-end: -.14em; /* the last letter's tracking shouldn't push the word off-centre */
  display: flex; align-items: center; gap: .18em;
}
.home-word .ring {
  width: .2em; height: .2em; border: 1px solid var(--ink); border-radius: 50%; flex: none;
  display: inline-grid; place-items: center; animation: spin 16s linear infinite;
}
.home-word .ring::after { content: ""; width: 26%; height: 26%; border-radius: 50%; border: 1px solid var(--ink); }
.home-word .letters { display: inline-flex; overflow: hidden; padding-bottom: .04em; }
.home-word .letters span { display: inline-block; animation: rise 1.2s var(--ease-out) both; animation-delay: calc(var(--i) * 70ms + 150ms); }
.home-lead { font-size: clamp(18px, 1.7vw, 24px); color: var(--ink-2); max-width: 40ch; margin: 2.5vh 0 0; line-height: 1.5; }

.home-bottom {
  display: grid; grid-template-columns: 1.3fr 1fr; gap: clamp(28px, 6vw, 120px); align-items: end;
  padding-top: 3vh; position: relative;
}
.home-bottom::before {
  content: ""; position: absolute; top: 0; inset-inline: 0; height: 1px; background: var(--line);
  transform-origin: left; animation: draw 1.6s var(--ease-out) .5s both;
}
html[dir="rtl"] .home-bottom::before { transform-origin: right; }
.dna-quote { font-size: clamp(22px, 2.3vw, 34px); font-weight: 300; line-height: 1.3; margin: 1.4vh 0 1.2vh; max-width: 26ch; color: var(--ink); }
.dna-text { color: var(--ink-2); max-width: 52ch; margin: 0; }
.dna-text strong { font-weight: 500; color: var(--ink); }

.home-index { display: grid; }
.home-index a {
  display: grid; grid-template-columns: 3em 1fr auto; align-items: baseline;
  padding: 12px 0; border-bottom: 1px solid var(--line);
  font-size: clamp(22px, 2vw, 30px); font-weight: 300; transition: color .3s, padding .5s var(--ease-out);
}
.home-index a:first-child { border-top: 1px solid var(--line); }
.home-index .num { font-size: 11px; letter-spacing: .3em; color: var(--mute); }
.home-index .arrow { opacity: 0; transform: translateX(-10px); transition: opacity .4s, transform .5s var(--ease-out); }
html[dir="rtl"] .home-index .arrow { transform: scaleX(-1) translateX(-10px); }
.home-index a:hover { padding-inline-start: 12px; }
.home-index a:hover .arrow { opacity: 1; transform: none; }
html[dir="rtl"] .home-index a:hover .arrow { transform: scaleX(-1); }
.home-index:hover a { color: var(--mute); }
.home-index:hover a:hover { color: var(--ink); }

@media (max-width: 860px) {
  .home { grid-template-rows: auto auto auto; gap: 7vh; padding-bottom: 8vh; }
  .home-center { align-self: start; padding-top: 6vh; }
  .home-word { letter-spacing: .08em; font-size: clamp(48px, 17vw, 140px); }
  .home-bottom { grid-template-columns: 1fr; }
}

/* home, trimmed: hero text on its own (no phones), footer without the big wordmark */
.bronza-hero.hero-solo { grid-template-columns: minmax(0, 860px); min-height: 88svh; background: var(--bg); }
.hero-solo .bronza-text p { max-width: 60ch; }
.hero-solo + .manifesto { border-top: 1px solid var(--line); }
.site-footer.no-big .footer-big { display: none; }

/* menu: no side images, links centred on the page */
.menu { grid-template-columns: 1fr; justify-items: center; text-align: center; }
.menu nav { align-items: center; justify-content: center; padding-top: 0; }
.menu-link { justify-content: center; }
.menu-link .num { min-width: 0; }
.menu-link .txt::after { inset-inline: 0; margin: 0 auto; }
@media (max-width: 860px) { .menu nav { justify-content: center; padding-top: 0; } }

/* services: the tracks start at the left edge (no intro column) */
.tracks.tracks-left .track-list { grid-column: 1 / span 9; }
@media (max-width: 860px) { .tracks.tracks-left .track-list { grid-column: 1 / -1; } }
/* services: tracks sit close under the SERVICES title */
.tracks.tracks-left { padding-top: 4vh; }
/* services: no line above the first track (the title already has one) */
.tracks.tracks-left .track:first-child { border-top: 0; padding-top: 2vh; }

/* contact without the photo: the details start at the left edge */
.contact.contact-solo { grid-template-columns: 1fr; min-height: 100svh; }
.contact-solo .contact-body { padding: calc(var(--header-h) + 10vh) var(--gutter) 10vh; max-width: 900px; }

/* everything sits higher: less empty space between the header and each page's title */
.page-head { padding-top: calc(var(--header-h) + 4vh); padding-bottom: 7vh; }
.contact-solo .contact-body { padding-top: calc(var(--header-h) + 4vh); }
.bronza-hero.hero-solo { min-height: 0; align-items: start; padding-top: calc(var(--header-h) + 5vh); padding-bottom: 14vh; }
@media (max-width: 860px) {
  .page-head { padding-top: calc(var(--header-h) + 3vh); }
}

/* work page: cards in rows of three */
.index-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: clamp(20px, 3vw, 48px); row-gap: 9vh; padding-inline: var(--gutter); }
.index-grid .card:nth-child(even) { margin-top: 0; }
.index-grid .card-title { font-size: clamp(16px, 1.3vw, 22px); }
@media (max-width: 1000px) { .index-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .index-grid { grid-template-columns: 1fr; } }

/* services: client logos at the end of each track */
.track-clients-label { margin-top: 36px; }
.logo-grid.track-logos { justify-content: flex-start; max-width: none; margin: 14px 0 0; gap: clamp(12px, 1.6vw, 22px); }
.logo-grid.track-logos .wiggle { width: clamp(76px, 8vw, 112px); }

/* phones: tighter vertical rhythm between sections */
@media (max-width: 700px) {
  .manifesto { padding-top: 10vh; padding-bottom: 6vh; }
  .cta { padding-block: 10vh; }
  .bronza-hero.hero-solo { padding-bottom: 8vh; }
}

/* menu: the words sit exactly on the centre line (numbers hang outside) */
.menu-link { position: relative; }
.menu-link .num { position: absolute; inset-inline-end: 100%; margin-inline-end: 14px; top: 50%; transform: translateY(-50%); line-height: 1; }
.menu-foot { justify-content: center; column-gap: 40px; }
@media (max-width: 700px) { .menu-foot { flex-direction: column; align-items: center; gap: 10px; } }

/* Hebrew: the big BRONZA wordmark sits on the right like the text around it */
html[dir="rtl"] .bronza-word { justify-content: flex-end; }

/* ---- client edits (Oct 2026) ---- */
/* header: wordmark + language + star button that opens the menu */
.site-header { grid-template-columns: 1fr auto; }
.star-btn { width: 40px; height: 40px; display: grid; place-items: center; padding: 0; }
.star-btn .star { width: 34px; height: 34px; fill: none; stroke: var(--ink); stroke-width: 1.2; transition: transform .6s var(--ease-out); }
.star-btn:hover .star { transform: rotate(60deg); }
.menu-open .star-btn .star { transform: rotate(90deg); }
@media (max-width: 860px) { .star-btn .star { width: 30px; height: 30px; } }

/* home hero: centred wordmark, services line */
.bronza-hero.hero-solo { grid-template-columns: minmax(0, 1fr); }
.hero-solo .bronza-text { width: 100%; max-width: 1100px; margin: 0 auto; }
.hero-solo .bronza-word, html[dir="rtl"] .hero-solo .bronza-word { justify-content: center; text-align: center; }
.hero-services { font-size: 14px; letter-spacing: .02em; color: var(--ink-2); margin: 0 0 1em !important; max-width: none !important; }
.hero-solo .bronza-lead { max-width: none; font-weight: 500; }

/* services: two tracks side by side, clients below */
.services-cols { padding: 4vh var(--gutter) 16vh; }
.services-intro h2 { font-size: clamp(24px, 2.4vw, 34px); font-weight: 500; margin: 0 0 10px; }
.services-intro p { margin: 0 0 6vh; }
.service-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 6vw, 110px); }
.service h3 { font-size: clamp(21px, 2vw, 28px); font-weight: 500; margin: 0 0 18px; line-height: 1.3; }
.service p { color: var(--ink-2); margin: 0 0 14px; line-height: 1.75; }
.service-clients { margin-top: 12vh; padding-top: 6vh; border-top: 1px solid var(--line); }
.service-clients > p { margin: 0 0 4vh; }
.logo-grid.plain-logos { justify-content: flex-start; max-width: none; margin: 0; gap: clamp(18px, 3vw, 48px); }
.logo-grid.plain-logos .wiggle { width: clamp(84px, 9vw, 130px); }
.logo-grid.plain-logos .frame { border-radius: 0; box-shadow: none; background: transparent; }
.logo-grid.plain-logos a.wiggle:hover .frame { box-shadow: none; opacity: .7; }
.logo-grid.plain-logos .frame img { mix-blend-mode: multiply; }
@media (max-width: 860px) { .service-grid { grid-template-columns: 1fr; } }

/* contact: WhatsApp + email buttons */
.contact-buttons { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 4vh; }
.contact-buttons .btn { min-width: 180px; justify-content: center; letter-spacing: .08em; }
.btn.btn-solid { background: var(--ink); color: var(--bg); }
.btn.btn-solid::before { background: var(--bg); }
.btn.btn-solid:hover { color: var(--ink); }

/* footer without the email: copyright on one side, links on the other */
.site-footer { grid-template-columns: 1fr auto; }
.site-footer .end { justify-self: end; }
@media (max-width: 700px) { .site-footer { grid-template-columns: 1fr; } .site-footer .end { justify-self: start; } }
/* logos without circles: give the small ones a little more presence */
.logo-grid.plain-logos .frame img { transform: none; }
.contact-buttons .btn { flex: 1 1 140px; min-width: 0; max-width: 220px; }

/* ==========================================================================
   BRAND SHEET (client, Oct 2026)
   bg #FFFCE9 · ink #201411 · accent #8B1A1A (used sparingly)
   English: Lexend Giga · Hebrew: Heebo (headlines 800, body 300)
   no gradients, no shadows, no unneeded motion
   ========================================================================== */
:root {
  --bg: #FFFCE9;
  --soft: #F5EFD3;
  --soft-2: #ECE4C2;
  --ink: #201411;
  --ink-2: rgba(32, 20, 17, .8);
  --mute: rgba(32, 20, 17, .62);
  --line: rgba(32, 20, 17, .18);
  --accent: #8B1A1A;
  --lg: 'Lexend Giga', 'Helvetica Neue', Arial, sans-serif;
  --he: 'Heebo', system-ui, sans-serif;
  --font: var(--lg);
}
html[lang="he"] { --font: var(--he); }
::selection { background: var(--accent); color: var(--bg); }

/* Latin brand text always in Lexend Giga, also on Hebrew pages */
.logo, .bronza-word, .footer-big > span, .contact-info .name, .lang-switch button[data-set-lang="en"] { font-family: var(--lg); }

/* caps: brand name, short labels, buttons — wide tracking */
.caps { font-family: var(--lg); font-weight: 400; letter-spacing: .22em; font-size: 10.5px; }
html[lang="he"] .caps { font-family: var(--he); font-weight: 400; letter-spacing: .04em; font-size: 13px; }
.logo { font-weight: 300; letter-spacing: .3em; font-size: 12px; }
.bronza-word { font-weight: 200; letter-spacing: .08em; font-size: clamp(48px, 9.5vw, 156px); }

/* headlines: lowercase in English, Heebo 800 in Hebrew */
.page-title, .card-title, .contact-body h1, .cta h2, .manifesto h2, .split-text h2, .founder h2,
.services-intro h2, .service h3, .next-title, .chapter-title {
  text-transform: lowercase; font-family: var(--lg); font-weight: 300; letter-spacing: 0;
}
.page-title { font-weight: 200; font-size: clamp(38px, 6.4vw, 104px); }
.page-title.long { font-size: clamp(30px, 4.4vw, 70px); }
.contact-body h1 { font-weight: 200; font-size: clamp(34px, 5vw, 80px); }
.cta h2 { font-weight: 200; font-size: clamp(32px, 5.6vw, 90px); }
.card-title { font-size: clamp(14px, 1.15vw, 18px); letter-spacing: 0; }
.card:hover .card-title { letter-spacing: 0; }
.manifesto h2 { font-size: clamp(22px, 2.9vw, 44px); line-height: 1.3; }
.services-intro h2, .service h3 { font-weight: 300; }
.hero-solo .bronza-lead { font-family: var(--lg); font-weight: 300; font-size: clamp(17px, 1.7vw, 24px); line-height: 1.55; color: var(--accent); }
html[lang="he"] .page-title, html[lang="he"] .card-title, html[lang="he"] .contact-body h1,
html[lang="he"] .cta h2, html[lang="he"] .manifesto h2, html[lang="he"] .split-text h2, html[lang="he"] .founder h2,
html[lang="he"] .services-intro h2, html[lang="he"] .service h3, html[lang="he"] .next-title {
  font-family: var(--he); font-weight: 800; text-transform: none; letter-spacing: 0;
}
html[lang="he"] .page-title, html[lang="he"] .contact-body h1, html[lang="he"] .cta h2 { font-weight: 700; }
html[lang="he"] .hero-solo .bronza-lead { font-family: var(--he); font-weight: 700; font-size: clamp(20px, 2vw, 28px); }
html[lang="he"] .card-title { font-weight: 700; font-size: clamp(16px, 1.3vw, 20px); }

/* accent, used sparingly: labels, primary buttons, link hover */
.crumbs, .side-label, .service-clients > p { color: var(--accent); }
.crumbs a:hover { color: var(--ink); }
.site-footer a:hover, .menu-foot a:hover, .contact-info a:hover, .link-line:hover { color: var(--accent); }
.menu nav:hover .menu-link:hover { color: var(--accent); }
.menu-link .txt::after { background: var(--accent); }

/* buttons: caps, weight 600; the main one is filled red */
.btn { font-family: var(--lg); font-weight: 600; letter-spacing: .2em; font-size: 10.5px; border-color: var(--ink); }
html[lang="he"] .btn { font-family: var(--he); font-weight: 700; letter-spacing: .04em; font-size: 14px; }
.hero-actions .btn, .cta .btn, .btn.btn-solid { background: var(--accent); border-color: var(--accent); color: var(--bg); }
.hero-actions .btn::before, .cta .btn::before, .btn.btn-solid::before { background: var(--ink); }
.hero-actions .btn:hover, .cta .btn:hover, .btn.btn-solid:hover { color: var(--bg); border-color: var(--ink); }

/* the feathered arrow from the brand sheet replaces the plain arrow */
.arrow {
  font-size: 0; width: 34px; height: 13px; vertical-align: middle; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 44'%3E%3Cg fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 22h98'/%3E%3Cpath d='M96 13l10 9-10 9'/%3E%3Cpath d='M16 15l7 7-7 7M25 15l7 7-7 7M34 15l7 7-7 7'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 44'%3E%3Cg fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 22h98'/%3E%3Cpath d='M96 13l10 9-10 9'/%3E%3Cpath d='M16 15l7 7-7 7M25 15l7 7-7 7M34 15l7 7-7 7'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat;
}

/* no gradients, no shadows */
.site-header.is-scrolled { background: var(--bg); backdrop-filter: none; -webkit-backdrop-filter: none; box-shadow: none; border-bottom: 1px solid var(--line); }
.bronza-hero { background: var(--bg); }
.logo-grid .frame { box-shadow: none; }
.star-btn .star { stroke: var(--ink); stroke-width: 1.2; stroke-linecap: round; }
.star-btn:hover .star { transform: none; }
.star-btn:hover .star circle { stroke: var(--accent); }
.filters button { font-family: inherit; }
.filters button[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); }
.lb-stage img, .frame { background-color: var(--soft); }
.logo-grid.plain-logos .frame { background: transparent; }
.page-head .crumbs, .page-head .crumbs a { color: var(--accent); }
.contact-buttons .btn { text-transform: uppercase; }

/* ---- Hebrew tuned to sit with Lexend Giga: light, airy, slightly tracked ----
   Lexend Giga is wide and light, so Heebo follows it with lighter weights,
   a touch of letter-spacing and roomier line-height instead of heavy 800 bold. */
html[lang="he"] body { font-weight: 300; letter-spacing: .02em; line-height: 1.85; }
html[lang="he"] .page-title, html[lang="he"] .contact-body h1, html[lang="he"] .cta h2 { font-weight: 200; letter-spacing: .03em; }
html[lang="he"] .manifesto h2, html[lang="he"] .split-text h2, html[lang="he"] .founder h2,
html[lang="he"] .services-intro h2, html[lang="he"] .next-title { font-weight: 300; letter-spacing: .03em; line-height: 1.35; }
html[lang="he"] .service h3 { font-weight: 400; letter-spacing: .03em; }
html[lang="he"] .card-title { font-weight: 400; letter-spacing: .04em; }
html[lang="he"] .hero-solo .bronza-lead { font-weight: 400; letter-spacing: .03em; line-height: 1.6; }
html[lang="he"] .menu-link { font-weight: 200; letter-spacing: .04em; }
html[lang="he"] .caps { letter-spacing: .12em; font-weight: 400; font-size: 12.5px; }
html[lang="he"] .btn { font-weight: 500; letter-spacing: .1em; font-size: 13.5px; }
html[lang="he"] strong, html[lang="he"] b { font-weight: 500; }

/* ---- final QA fixes ---- */
.contact.contact-solo { grid-template-columns: minmax(0, 1fr); }
.contact-solo .contact-body { min-width: 0; }
.contact-info { overflow-wrap: anywhere; }
@media (max-width: 700px) { .contact-info { font-size: 15px; } }
/* logos now have transparent backgrounds — no blend trick needed, hover only dims the logo itself */
.logo-grid.plain-logos .frame img { mix-blend-mode: normal; transition: opacity .3s; }
.logo-grid.plain-logos a.wiggle:hover .frame { opacity: 1; }
.logo-grid.plain-logos a.wiggle:hover .frame img { opacity: .7; }

/* work filters: rectangles like the contact buttons, in the brand red */
.filters { gap: 12px; }
.filters button {
  border-radius: 0; border: 1px solid var(--accent); color: var(--accent); background: transparent;
  padding: 12px 22px; font-family: var(--lg); font-weight: 600; letter-spacing: .2em; font-size: 10.5px;
  transition: background .3s, color .3s;
}
html[lang="he"] .filters button { font-family: var(--he); font-weight: 500; letter-spacing: .08em; font-size: 13.5px; }
.filters button:hover { background: var(--accent); color: var(--bg); border-color: var(--accent); }
.filters button[aria-pressed="true"] { background: var(--accent); color: var(--bg); border-color: var(--accent); }

/* home hero: bigger wordmark, everything centred like the DNA section */
.hero-solo .bronza-word { font-size: clamp(64px, 14vw, 230px); }
.hero-solo .bronza-text { text-align: center; }
.hero-solo .bronza-text p { margin-inline: auto; }
.hero-solo .bronza-lead { max-width: 34ch; margin-inline: auto; }
.hero-solo .hero-services { max-width: 70ch !important; margin-inline: auto !important; }
.hero-solo .bronza-text p:not(.bronza-lead):not(.hero-services) { max-width: 58ch; }
.hero-solo .hero-actions { justify-content: center; }
.hero-solo .hero-services { max-width: 100% !important; text-wrap: balance; }
.hero-solo .bronza-text p:not(.bronza-lead):not(.hero-services) { text-wrap: balance; }

/* studio page ends with the contact block (replaces the old contact page) */
.studio-contact { scroll-margin-top: var(--header-h); }
.studio-contact > p { margin: 0; }
.contact-tabs { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin-top: 2vh; }
.contact-tabs .btn {
  width: 190px; justify-content: center; text-transform: uppercase;
  border-color: var(--accent); color: var(--accent);
}
.contact-tabs .btn::before { background: var(--accent); }
.contact-tabs .btn:hover { color: var(--bg); }
html[lang="he"] .contact-tabs .btn { font-family: var(--lg); font-weight: 600; letter-spacing: .2em; font-size: 10.5px; }
@media (max-width: 700px) { .contact-tabs { flex-direction: column; align-items: center; } .contact-tabs .btn { width: min(260px, 100%); } }
.studio-contact .contact-tabs .btn { background: var(--accent); border-color: var(--accent); color: var(--bg); }
.studio-contact .contact-tabs .btn::before { background: var(--ink); }
.studio-contact .contact-tabs .btn:hover { color: var(--bg); border-color: var(--ink); }
/* home: "get in touch" sits right under the DNA text */
.manifesto-cta { margin-top: 5vh; display: flex; justify-content: center; }
.manifesto-cta .btn { background: var(--accent); border-color: var(--accent); color: var(--bg); }
.manifesto-cta .btn::before { background: var(--ink); }
.manifesto-cta .btn:hover { color: var(--bg); border-color: var(--ink); }
.manifesto { padding-bottom: 16vh; }
.manifesto > p:not(.caps) { color: var(--ink-2); max-width: 60ch; margin: 0 auto; font-size: 18px; }

/* home wordmark: hover a letter and it drops into a red box (transform + colour only, so it stays smooth) */
.hero-solo .bronza-word { letter-spacing: 0; gap: .07em; }
.bw-l { position: relative; display: inline-block; padding: .06em .07em; line-height: 1; cursor: default; isolation: isolate; }
.bw-l::before {
  content: ""; position: absolute; inset: -.04em -.02em; z-index: -1;
  background: var(--accent);
  transform: scaleY(0); transform-origin: 50% 100%;
  transition: transform .42s cubic-bezier(.22, 1, .36, 1);
  will-change: transform;
}
.bw-c { display: inline-block; transition: color .3s ease, transform .42s cubic-bezier(.22, 1, .36, 1); }
@media (hover: hover) and (pointer: fine) {
  .bw-l:hover::before { transform: scaleY(1); transform-origin: 50% 0%; transition-duration: .32s; }
  .bw-l:hover .bw-c { color: var(--bg); transform: translateY(-.02em); }
}
@media (prefers-reduced-motion: reduce) { .bw-l::before, .bw-c { transition: none; } }
.hero-solo .bronza-word { gap: 0; }
.bw-l { padding: .05em .05em; }
.bw-l::before { inset: -.03em -.01em; }
/* home hero: all the text under BRONZA in the brand red (DNA section stays as is) */
.hero-solo .bronza-text p, html[lang="he"] .hero-solo .bronza-text p { color: var(--accent); }
.hero-solo .hero-services { opacity: .85; }

/* page titles sit right under their small label, a bit higher on every page */
.page-head { row-gap: 10px; padding-bottom: 6vh; }
.page-head .crumbs { margin-bottom: 0; }

/* studio page: the story, right before the contact section */
.studio-story { padding: 14vh var(--gutter) 2vh; border-top: 1px solid var(--line); margin-inline: var(--gutter); padding-inline: 0; }
.studio-story > div { max-width: 62ch; margin: 0 auto; text-align: center; }
.studio-story p { margin: 0 0 1.4em; font-size: clamp(16px, 1.25vw, 19px); line-height: 1.9; color: var(--ink-2); text-wrap: pretty; }
.studio-story p:first-child { color: var(--ink); font-size: clamp(18px, 1.6vw, 24px); line-height: 1.6; }
.studio-story p:last-child { margin-bottom: 0; }
html[lang="he"] .studio-story p:first-child { font-weight: 400; }
.studio-story + .studio-contact { padding-top: 12vh; }
/* full-screen photo view: no "01 / 07" counter */
.lightbox .lb-count { display: none; }
.lightbox .lb-bottom { visibility: hidden; }

/* keep each service name on one line */
.hero-services .nw, .service .nw, .nw { white-space: nowrap; }

/* a line more air between the BRONZA wordmark and the text below */
.hero-solo .bronza-word { margin-bottom: clamp(60px, 5vw, 74px); }

/* wordmark a touch bigger; the red box still drops in on hover, but on leaving it simply fades away */
.hero-solo .bronza-word { font-size: clamp(64px, 16vw, 270px); }
.bw-l::before {
  opacity: 0;
  transition: opacity .38s ease, transform 0s linear .38s;
}
.bw-c { transition: color .38s ease, transform .38s ease; }
@media (hover: hover) and (pointer: fine) {
  .bw-l:hover::before { opacity: 1; transform: scaleY(1); transform-origin: 50% 0%; transition: transform .32s cubic-bezier(.22, 1, .36, 1), opacity 0s; }
  .bw-l:hover .bw-c { transition: color .2s ease, transform .32s cubic-bezier(.22, 1, .36, 1); }
}
@media (prefers-reduced-motion: reduce) { .bw-l::before, .bw-l:hover::before, .bw-c { transition: none; } }

/* home hero fits in one screen: the wordmark and spacing scale with the window height too */
.hero-solo .bronza-word { font-size: clamp(64px, min(15vw, 23vh), 250px); margin-bottom: clamp(48px, 7vh, 72px); }
.bronza-hero.hero-solo { padding-top: calc(var(--header-h) + 2vh); }
.hero-solo .hero-actions { margin-top: clamp(20px, 3.5vh, 39px); }

/* the cursor is the feathered BRONZA arrow (dark), turning red over anything clickable */
@media (hover: hover) and (pointer: fine) {
  html, body, .bw-l { cursor: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2232%22 height=%2232%22 viewBox=%220 0 32 32%22%3E%3Cg transform=%22translate(3 3) rotate(-135) scale(.27) translate(-106 -22)%22 fill=%22none%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cg stroke=%22#FFFCE9%22 stroke-width=%2213%22%3E%3Cpath d=%22M6 22h98%22/%3E%3Cpath d=%22M94 11l12 11-12 11%22/%3E%3Cpath d=%22M16 13l9 9-9 9M28 13l9 9-9 9M40 13l9 9-9 9%22/%3E%3C/g%3E%3Cg stroke=%22#201411%22 stroke-width=%225.5%22%3E%3Cpath d=%22M6 22h98%22/%3E%3Cpath d=%22M94 11l12 11-12 11%22/%3E%3Cpath d=%22M16 13l9 9-9 9M28 13l9 9-9 9M40 13l9 9-9 9%22/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") 3 3, auto; }
  a, button, [role="button"], label, summary, .gallery .item, .filters button, .lang-switch button, .menu-btn { cursor: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2232%22 height=%2232%22 viewBox=%220 0 32 32%22%3E%3Cg transform=%22translate(3 3) rotate(-135) scale(.27) translate(-106 -22)%22 fill=%22none%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cg stroke=%22#FFFCE9%22 stroke-width=%2213%22%3E%3Cpath d=%22M6 22h98%22/%3E%3Cpath d=%22M94 11l12 11-12 11%22/%3E%3Cpath d=%22M16 13l9 9-9 9M28 13l9 9-9 9M40 13l9 9-9 9%22/%3E%3C/g%3E%3Cg stroke=%22#8B1A1A%22 stroke-width=%225.5%22%3E%3Cpath d=%22M6 22h98%22/%3E%3Cpath d=%22M94 11l12 11-12 11%22/%3E%3Cpath d=%22M16 13l9 9-9 9M28 13l9 9-9 9M40 13l9 9-9 9%22/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") 3 3, pointer; }
}

/* arrow cursor as PNG (works in every browser, incl. Safari); sharp on retina via image-set */
@media (hover: hover) and (pointer: fine) {
  html, body, .bw-l { cursor: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAADe0lEQVR4nOyWWUwTQRjH/9PdbtqVgpaWqiAiIN6g9Y6JKJHigcGgTx4x0fig8cEjXnifWCUq+mBM1KQKggG89YVoogaPRGPigUGjxqtSEQUrVKAwzvbAkhjaAhtf+D/sznwz+faX79gZHv9ZvPSg9EcMmht3gWA0KF4xy3dQxU8o6CcouEJCdJ8hk4gLwFl5/dQJy8zz+cWIT4hFiEYDTWgIoqP7YfHShVbCGyIhk9wATZXPZpvmDn/+rLzNojZci7JHN52qELEXIRG/IIMUbgzytm9UX4SGhbqmGZnpeGMtx+MX9+wqUdwm18cl8e4XrRNFNcJ1WkwzTcWFossu66Fj5jcKgTsNGeUBAAMQUV/nQE7ufqdk90CMZBC3KbUlE2KwQQa5ASi+6iLCoTfoWDbIu5zcbDuzGj0Qg+SEcBchtSU21v++/7PGzusMupXg1CW0qb40a/12Y2FekasmGEQFS0eXQxDvgNIqDQuIlpBe793zWi2cv0s3rdsqKwTfSkL0Utjtf+dh3xlEavbB3aVs6oKADOng21v0hRAEwXjmdL4PxI80b7RkA/CF2Ll3qysSPhAVtMn2hCWrgW36Bo7ksv/FXQQpEuhGb01s37zbaDmVB50+HPEDYyVCREVFIudo9kdwhv6siyiCkCLQjVIkwKtSd+7b0ij9MaurqlFTU4vxE8ciZkCMtCMKLbYsSr8NQRAKOAJesYPrQ/IEUz+VSoWKl68weGgCps80uTwJSgGLlsyHpmdYJCtqayD+/NbAP9QiPZJGJUIQlHj+tJyBvHYtKJVKTJo8EUnGxIWsrY97OqtdBZyCVlFijY2LxcCEOIwZNxpqdoZISjFNgaXwJBwOBx6UPTQ77L++slM2xZ+7DqSgKp0F4Qgbxu3YvAdXL93AjPQ05FsK2uxbtnwJsratP0yUhjXt+Qs6AoTXX2MXlHjWFmaxh4geISJS06Z66CiSUybjXIkFq9etbGDur/jzF3wKvOK54lVrV9Sdv3i21bR42SLcvnUHF4uvQKVW17IK++LPTYcBWIE9EsToiD6RfTZ4bZnzMrBlx0YUFZRg364DEWhuMfvz05Eu8IEg9ZRWFwwZNtg8e84sDIjr35SYNKKc47mkL9bKwHygC0SdtgXslcFGeeDEMjQ7CtgdQw+eZhLS+x3kBuiMOpWCboBugG6ArtAfAAAA//+T6D1HAAAABklEQVQDAG2vRvMvnRXIAAAAAElFTkSuQmCC") 3 3, auto; cursor: -webkit-image-set(url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAADe0lEQVR4nOyWWUwTQRjH/9PdbtqVgpaWqiAiIN6g9Y6JKJHigcGgTx4x0fig8cEjXnifWCUq+mBM1KQKggG89YVoogaPRGPigUGjxqtSEQUrVKAwzvbAkhjaAhtf+D/sznwz+faX79gZHv9ZvPSg9EcMmht3gWA0KF4xy3dQxU8o6CcouEJCdJ8hk4gLwFl5/dQJy8zz+cWIT4hFiEYDTWgIoqP7YfHShVbCGyIhk9wATZXPZpvmDn/+rLzNojZci7JHN52qELEXIRG/IIMUbgzytm9UX4SGhbqmGZnpeGMtx+MX9+wqUdwm18cl8e4XrRNFNcJ1WkwzTcWFossu66Fj5jcKgTsNGeUBAAMQUV/nQE7ufqdk90CMZBC3KbUlE2KwQQa5ASi+6iLCoTfoWDbIu5zcbDuzGj0Qg+SEcBchtSU21v++/7PGzusMupXg1CW0qb40a/12Y2FekasmGEQFS0eXQxDvgNIqDQuIlpBe793zWi2cv0s3rdsqKwTfSkL0Utjtf+dh3xlEavbB3aVs6oKADOng21v0hRAEwXjmdL4PxI80b7RkA/CF2Ll3qysSPhAVtMn2hCWrgW36Bo7ksv/FXQQpEuhGb01s37zbaDmVB50+HPEDYyVCREVFIudo9kdwhv6siyiCkCLQjVIkwKtSd+7b0ij9MaurqlFTU4vxE8ciZkCMtCMKLbYsSr8NQRAKOAJesYPrQ/IEUz+VSoWKl68weGgCps80uTwJSgGLlsyHpmdYJCtqayD+/NbAP9QiPZJGJUIQlHj+tJyBvHYtKJVKTJo8EUnGxIWsrY97OqtdBZyCVlFijY2LxcCEOIwZNxpqdoZISjFNgaXwJBwOBx6UPTQ77L++slM2xZ+7DqSgKp0F4Qgbxu3YvAdXL93AjPQ05FsK2uxbtnwJsratP0yUhjXt+Qs6AoTXX2MXlHjWFmaxh4geISJS06Z66CiSUybjXIkFq9etbGDur/jzF3wKvOK54lVrV9Sdv3i21bR42SLcvnUHF4uvQKVW17IK++LPTYcBWIE9EsToiD6RfTZ4bZnzMrBlx0YUFZRg364DEWhuMfvz05Eu8IEg9ZRWFwwZNtg8e84sDIjr35SYNKKc47mkL9bKwHygC0SdtgXslcFGeeDEMjQ7CtgdQw+eZhLS+x3kBuiMOpWCboBugG6ArtAfAAAA//+T6D1HAAAABklEQVQDAG2vRvMvnRXIAAAAAElFTkSuQmCC") 1x, url("data:image/png;base64,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") 2x) 3 3, auto; cursor: image-set(url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAADe0lEQVR4nOyWWUwTQRjH/9PdbtqVgpaWqiAiIN6g9Y6JKJHigcGgTx4x0fig8cEjXnifWCUq+mBM1KQKggG89YVoogaPRGPigUGjxqtSEQUrVKAwzvbAkhjaAhtf+D/sznwz+faX79gZHv9ZvPSg9EcMmht3gWA0KF4xy3dQxU8o6CcouEJCdJ8hk4gLwFl5/dQJy8zz+cWIT4hFiEYDTWgIoqP7YfHShVbCGyIhk9wATZXPZpvmDn/+rLzNojZci7JHN52qELEXIRG/IIMUbgzytm9UX4SGhbqmGZnpeGMtx+MX9+wqUdwm18cl8e4XrRNFNcJ1WkwzTcWFossu66Fj5jcKgTsNGeUBAAMQUV/nQE7ufqdk90CMZBC3KbUlE2KwQQa5ASi+6iLCoTfoWDbIu5zcbDuzGj0Qg+SEcBchtSU21v++/7PGzusMupXg1CW0qb40a/12Y2FekasmGEQFS0eXQxDvgNIqDQuIlpBe793zWi2cv0s3rdsqKwTfSkL0Utjtf+dh3xlEavbB3aVs6oKADOng21v0hRAEwXjmdL4PxI80b7RkA/CF2Ll3qysSPhAVtMn2hCWrgW36Bo7ksv/FXQQpEuhGb01s37zbaDmVB50+HPEDYyVCREVFIudo9kdwhv6siyiCkCLQjVIkwKtSd+7b0ij9MaurqlFTU4vxE8ciZkCMtCMKLbYsSr8NQRAKOAJesYPrQ/IEUz+VSoWKl68weGgCps80uTwJSgGLlsyHpmdYJCtqayD+/NbAP9QiPZJGJUIQlHj+tJyBvHYtKJVKTJo8EUnGxIWsrY97OqtdBZyCVlFijY2LxcCEOIwZNxpqdoZISjFNgaXwJBwOBx6UPTQ77L++slM2xZ+7DqSgKp0F4Qgbxu3YvAdXL93AjPQ05FsK2uxbtnwJsratP0yUhjXt+Qs6AoTXX2MXlHjWFmaxh4geISJS06Z66CiSUybjXIkFq9etbGDur/jzF3wKvOK54lVrV9Sdv3i21bR42SLcvnUHF4uvQKVW17IK++LPTYcBWIE9EsToiD6RfTZ4bZnzMrBlx0YUFZRg364DEWhuMfvz05Eu8IEg9ZRWFwwZNtg8e84sDIjr35SYNKKc47mkL9bKwHygC0SdtgXslcFGeeDEMjQ7CtgdQw+eZhLS+x3kBuiMOpWCboBugG6ArtAfAAAA//+T6D1HAAAABklEQVQDAG2vRvMvnRXIAAAAAElFTkSuQmCC") 1x, url("data:image/png;base64,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") 2x) 3 3, auto; }
  a, button, [role="button"], label, summary, .gallery .item, .filters button, .lang-switch button, .menu-btn, a *, button * { cursor: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAADcklEQVR4nOyWa0hTYRjH/+/O2ZyzZc42V7OlZpZklxlRdDMyu4yoKCKj6PIh6kMfukA3qNCK2oeyPkRQUUGCdqOICkqCIqoPSVKZaZaS5mVe03mbU9+ezc0MxG3qqS/+4Zzznud9eM7vPM/znvOK+M8SnSfO6yPQ2Z4Khpng+EqWOnBZI2T8J2RCJmOjyyCRmAugo/Jx9pV086fMBwidGAmFWo0AdRBGGcNh2pZczsQwAySSKwP01sYv95+gtrDIdXgUqAnB1OQ1Os6rRjCma4IE6gZgrGikYUzcr5Iy2BttiF2zAubzJ8FkMhvNnZbq4X8AwJvlqkCoRmswISkBefceuazmtBPfmUK4BgnlBoALwNHSCvPZ1A6n3Q0xgyBecm5NYCzMCgnk6YEqlTYUQXRQyovNZ1NsZI13Q0ySEqJ7FXDrtM6Wtrf2hiZRpQvdDSHwHqUj69nhk/EfM+5390TaiQIqx5BDMM+A82o1JUTDWMiP7vsGDTrasp4dSpUUgvU3+S8gxP4mGQuuI4ikpWeOZQkBAfE5NzKdZndP1C/zZEsygN4QiSkHs+i2N0QBd1hzKE92cqqBwC7Q9+IV/BTz1dFTjufHLfHvr2cgiL4ZmuhIJyGCw8dixbmUUghh4xljHH5I5qujMxMQlUmJqQfalcFqNNfUwd7QCOOcmQiJMDo9wtFlPcJ5TSz8kM8Z8Ih+XCVXFqwaJ1cqUZ1fCG3sRMQsT3RFEuRymLZugGLUSANj2nJf4nntgT7U5TzpZ8TRA0VYc/NRk//NNSEjgPHzZ0NvittMy/oSQdi8BfO5BD3irFwTFYFQqr9hlgnyQKXLHLVkIdbfvAhHaytK37yzOJqaq7ijcrG3cAMoQfVKSsJ5Gk54fsyC/IdPEWNegg/pd/7ym7VzCxKO7E1j8rB9/cXzOwNM1D6iDUo0LQuLIkgFxQgVopcmuOk4IhfNw4bMy5i7b5edwj/0Fs//EngkCnfn7tnRnHz7ao/JtH0jil+8xmfa3FCTNlCHVXgLM2AAarBsQWXUqQ36gx7blHUrsejofuTeeoAXp9J06OyyeIszkFXQC4K1cF6boYuNsUxetRyaKKNDP21KnkwUptsqfPtV+N2EfYl3WDfRZTWN0iGoXqOzNYP2GFqIfC1j+mJIDTAYDaoEwwDDAMMAQ6HfAAAA//+ADg8zAAAABklEQVQDALFxQNrQ4DQ5AAAAAElFTkSuQmCC") 3 3, pointer; cursor: -webkit-image-set(url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAADcklEQVR4nOyWa0hTYRjH/+/O2ZyzZc42V7OlZpZklxlRdDMyu4yoKCKj6PIh6kMfukA3qNCK2oeyPkRQUUGCdqOICkqCIqoPSVKZaZaS5mVe03mbU9+ezc0MxG3qqS/+4Zzznud9eM7vPM/znvOK+M8SnSfO6yPQ2Z4Khpng+EqWOnBZI2T8J2RCJmOjyyCRmAugo/Jx9pV086fMBwidGAmFWo0AdRBGGcNh2pZczsQwAySSKwP01sYv95+gtrDIdXgUqAnB1OQ1Os6rRjCma4IE6gZgrGikYUzcr5Iy2BttiF2zAubzJ8FkMhvNnZbq4X8AwJvlqkCoRmswISkBefceuazmtBPfmUK4BgnlBoALwNHSCvPZ1A6n3Q0xgyBecm5NYCzMCgnk6YEqlTYUQXRQyovNZ1NsZI13Q0ySEqJ7FXDrtM6Wtrf2hiZRpQvdDSHwHqUj69nhk/EfM+5390TaiQIqx5BDMM+A82o1JUTDWMiP7vsGDTrasp4dSpUUgvU3+S8gxP4mGQuuI4ikpWeOZQkBAfE5NzKdZndP1C/zZEsygN4QiSkHs+i2N0QBd1hzKE92cqqBwC7Q9+IV/BTz1dFTjufHLfHvr2cgiL4ZmuhIJyGCw8dixbmUUghh4xljHH5I5qujMxMQlUmJqQfalcFqNNfUwd7QCOOcmQiJMDo9wtFlPcJ5TSz8kM8Z8Ih+XCVXFqwaJ1cqUZ1fCG3sRMQsT3RFEuRymLZugGLUSANj2nJf4nntgT7U5TzpZ8TRA0VYc/NRk//NNSEjgPHzZ0NvittMy/oSQdi8BfO5BD3irFwTFYFQqr9hlgnyQKXLHLVkIdbfvAhHaytK37yzOJqaq7ijcrG3cAMoQfVKSsJ5Gk54fsyC/IdPEWNegg/pd/7ym7VzCxKO7E1j8rB9/cXzOwNM1D6iDUo0LQuLIkgFxQgVopcmuOk4IhfNw4bMy5i7b5edwj/0Fs//EngkCnfn7tnRnHz7ao/JtH0jil+8xmfa3FCTNlCHVXgLM2AAarBsQWXUqQ36gx7blHUrsejofuTeeoAXp9J06OyyeIszkFXQC4K1cF6boYuNsUxetRyaKKNDP21KnkwUptsqfPtV+N2EfYl3WDfRZTWN0iGoXqOzNYP2GFqIfC1j+mJIDTAYDaoEwwDDAMMAQ6HfAAAA//+ADg8zAAAABklEQVQDALFxQNrQ4DQ5AAAAAElFTkSuQmCC") 1x, url("data:image/png;base64,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") 2x) 3 3, pointer; cursor: image-set(url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAADcklEQVR4nOyWa0hTYRjH/+/O2ZyzZc42V7OlZpZklxlRdDMyu4yoKCKj6PIh6kMfukA3qNCK2oeyPkRQUUGCdqOICkqCIqoPSVKZaZaS5mVe03mbU9+ezc0MxG3qqS/+4Zzznud9eM7vPM/znvOK+M8SnSfO6yPQ2Z4Khpng+EqWOnBZI2T8J2RCJmOjyyCRmAugo/Jx9pV086fMBwidGAmFWo0AdRBGGcNh2pZczsQwAySSKwP01sYv95+gtrDIdXgUqAnB1OQ1Os6rRjCma4IE6gZgrGikYUzcr5Iy2BttiF2zAubzJ8FkMhvNnZbq4X8AwJvlqkCoRmswISkBefceuazmtBPfmUK4BgnlBoALwNHSCvPZ1A6n3Q0xgyBecm5NYCzMCgnk6YEqlTYUQXRQyovNZ1NsZI13Q0ySEqJ7FXDrtM6Wtrf2hiZRpQvdDSHwHqUj69nhk/EfM+5390TaiQIqx5BDMM+A82o1JUTDWMiP7vsGDTrasp4dSpUUgvU3+S8gxP4mGQuuI4ikpWeOZQkBAfE5NzKdZndP1C/zZEsygN4QiSkHs+i2N0QBd1hzKE92cqqBwC7Q9+IV/BTz1dFTjufHLfHvr2cgiL4ZmuhIJyGCw8dixbmUUghh4xljHH5I5qujMxMQlUmJqQfalcFqNNfUwd7QCOOcmQiJMDo9wtFlPcJ5TSz8kM8Z8Ih+XCVXFqwaJ1cqUZ1fCG3sRMQsT3RFEuRymLZugGLUSANj2nJf4nntgT7U5TzpZ8TRA0VYc/NRk//NNSEjgPHzZ0NvittMy/oSQdi8BfO5BD3irFwTFYFQqr9hlgnyQKXLHLVkIdbfvAhHaytK37yzOJqaq7ijcrG3cAMoQfVKSsJ5Gk54fsyC/IdPEWNegg/pd/7ym7VzCxKO7E1j8rB9/cXzOwNM1D6iDUo0LQuLIkgFxQgVopcmuOk4IhfNw4bMy5i7b5edwj/0Fs//EngkCnfn7tnRnHz7ao/JtH0jil+8xmfa3FCTNlCHVXgLM2AAarBsQWXUqQ36gx7blHUrsejofuTeeoAXp9J06OyyeIszkFXQC4K1cF6boYuNsUxetRyaKKNDP21KnkwUptsqfPtV+N2EfYl3WDfRZTWN0iGoXqOzNYP2GFqIfC1j+mJIDTAYDaoEwwDDAMMAQ6HfAAAA//+ADg8zAAAABklEQVQDALFxQNrQ4DQ5AAAAAElFTkSuQmCC") 1x, url("data:image/png;base64,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") 2x) 3 3, pointer; }
}

/* menu star: turns the moment it's clicked (even while hovered) and the red ring fades smoothly */
.star-btn .star { transition: transform .55s cubic-bezier(.22, 1, .36, 1); }
.star-btn .star circle { transition: stroke .3s ease; }
.menu-open .star-btn .star, .menu-open .star-btn:hover .star { transform: rotate(90deg); }
.menu-open .star-btn .star circle { stroke: var(--accent); }
html { scrollbar-gutter: stable; }

/* phones: client logos in rows of four (13 logos -> 4 rows), logos enlarged inside their tiles */
@media (max-width: 600px) {
  .logo-grid.plain-logos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px 10px; }
  .logo-grid.plain-logos .wiggle { width: auto; }
  .logo-grid.plain-logos .frame { aspect-ratio: 4 / 3; overflow: hidden; display: grid; place-items: center; }
  .logo-grid.plain-logos .frame img { width: 100%; height: auto; transform: scale(1.3); }
  .logo-grid.plain-logos .wiggle:last-child:nth-child(4n + 1) { grid-column: 2 / span 2; justify-self: center; width: calc(50% - 5px); }
}

/* studio page: small "our journey" label above the story */
.studio-story > p.story-label { text-align: center; margin: 0 auto clamp(20px, 2.6vw, 34px); color: var(--mute); font-size: 10.5px; line-height: 1.4; font-weight: 400; }
html[lang="he"] .studio-story > p.story-label { font-size: 12.5px; }

/* studio page: story sits closer to the line under the title */
.studio-story { padding-top: clamp(36px, 5vh, 56px); border-top: 0; }

/* services: the stage names and the ongoing-support line stand out in brand red */
.service .svc-key { color: var(--accent); font-weight: 400; }
html[lang="he"] .service .svc-key { font-weight: 500; }

/* videos open in the lightbox like photos */
.lb-stage video {
  max-width: 100%; max-height: calc(100svh - 160px); width: auto; height: auto; object-fit: contain; background: var(--soft);
  transition: opacity .35s var(--ease), transform .6s var(--ease-out);
}
.lb-stage video.is-loading { opacity: 0; transform: scale(.98) rotate(-.6deg); }
.lb-stage [hidden] { display: none !important; }

/* home: the "we guide…" paragraph runs in three wider lines, giving the wordmark room to grow */
.hero-solo .bronza-text p:not(.bronza-lead):not(.hero-services) { max-width: 80ch; }
.hero-solo .bronza-word { font-size: clamp(64px, min(16vw, 26vh), 270px); }

/* =========================================================================
   NEW PALETTE (Brand book v1) — cream #FFFCE7 · dark #1A0501 · blue #CFE2E8
   (main accent) · bronze #A47847 (second accent) · sage #B9C7A0 (third).
   On light: text is always dark; blue (and sage) only as fills/backgrounds;
   bronze only for large headings (24px+), lines and arrows. Two accents per
   page (blue + bronze). No gradients, no shadows, no pure black or white.
   Older version saved in _saved/before-new-colors.
   ========================================================================= */
:root {
  --bg: #FFFCE7; --ink: #1A0501;
  --ink-2: rgba(26, 5, 1, .8); --mute: rgba(26, 5, 1, .62);
  --line: rgba(164, 120, 71, .45);
  --soft: #F6F0D8; --soft-2: #EDE5C6;
  --blue: #CFE2E8; --bronze: #A47847; --sage: #B9C7A0;
  --accent: var(--bronze);
}
::selection { background: var(--blue); color: var(--ink); }

/* text on light stays dark */
.hero-solo .bronza-lead, .hero-solo .bronza-text p, html[lang="he"] .hero-solo .bronza-text p { color: var(--ink); }
.hero-solo .hero-services { color: var(--ink-2); }
.crumbs, .side-label, .service-clients > p, .page-head .crumbs, .page-head .crumbs a { color: var(--ink); }
.site-footer a:hover, .menu-foot a:hover, .contact-info a:hover, .link-line:hover { color: var(--ink); opacity: .6; }

/* bronze: large headings, lines, arrows */
.page-title, .studio-contact h2 { color: var(--bronze); }
.menu nav:hover .menu-link:hover { color: var(--bronze); }
.menu-link .txt::after { background: var(--bronze); }
.star-btn:hover .star circle, .menu-open .star-btn .star circle { stroke: var(--bronze); }

/* buttons: blue fill with dark text; on hover dark fill with blue text */
.hero-actions .btn, .cta .btn, .btn.btn-solid, .manifesto-cta .btn, .studio-contact .contact-tabs .btn {
  background: var(--blue); border-color: var(--blue); color: var(--ink);
}
.hero-actions .btn::before, .cta .btn::before, .btn.btn-solid::before, .contact-tabs .btn::before { background: var(--ink); }
.hero-actions .btn:hover, .cta .btn:hover, .btn.btn-solid:hover, .manifesto-cta .btn:hover, .studio-contact .contact-tabs .btn:hover {
  color: var(--blue); border-color: var(--ink);
}

/* work filters: dark text in a bronze frame; active / hover = blue fill */
.filters button { border-color: var(--bronze); color: var(--ink); }
.filters button:hover, .filters button[aria-pressed="true"] { background: var(--blue); border-color: var(--blue); color: var(--ink); }

/* home wordmark hover: blue box, letter stays dark */
.bw-l::before { background: var(--blue); }
.bw-l:hover .bw-c { color: var(--ink); }

/* services key words: dark text on a blue highlight */
.service .svc-key { color: var(--ink); background: var(--blue); padding: .08em .35em; -webkit-box-decoration-break: clone; box-decoration-break: clone; }

/* dark video frames use the brand dark, never pure black */
.gallery .item-video .frame, .frame.is-reel, .watch { background-color: var(--ink); }

/* cursor turns bronze over anything clickable */
@media (hover: hover) and (pointer: fine) {
  a, button, [role="button"], label, summary, .gallery .item, .filters button, .lang-switch button, .menu-btn, a *, button * {
    cursor: url("../img/cursor-bronze-1x.png") 3 3, pointer;
    cursor: -webkit-image-set(url("../img/cursor-bronze-1x.png") 1x, url("../img/cursor-bronze-2x.png") 2x) 3 3, pointer;
    cursor: image-set(url("../img/cursor-bronze-1x.png") 1x, url("../img/cursor-bronze-2x.png") 2x) 3 3, pointer;
  }
}

/* =========================================================================
   TYPOGRAPHY (Brand book v1, 02)
   English: Lexend Giga, light weights. 100 display, 200 headlines,
   300 labels (caps) and body, 400 buttons / emphasis / very small labels.
   Caps for brand, labels and buttons; lowercase for headings and sentences.
   Hebrew: Assistant. 800 headings, 700 labels, 300 body. English words
   inside Hebrew use Assistant; the BRONZA wordmark stays Lexend Giga.
   Sizes: HE heading 44/28, HE body 18/17, EN heading 32/22,
   EN labels 12/11, EN body 15 (desktop/phone).
   Older version saved in _saved/before-new-fonts.
   ========================================================================= */
:root { --he: 'Assistant', system-ui, sans-serif; }

/* ---------- English ---------- */
body { font-weight: 300; }
html:not([lang="he"]) body { font-size: 15px; }
.hero-solo .bronza-word { font-weight: 100; }

/* headlines: 200, lowercase, 32 → 22 */
html:not([lang="he"]) :is(.page-title, .page-title.long, .cta h2, .studio-contact h2, .manifesto h2, .services-intro h2, .service h3, .hero-solo .bronza-lead) {
  font-weight: 200; font-size: clamp(22px, 2.25vw, 32px); line-height: 1.3; letter-spacing: .02em;
}
html:not([lang="he"]) .menu-link { font-weight: 200; }

/* body: 300, 15 */
html:not([lang="he"]) :is(.hero-solo .bronza-text p:not(.bronza-lead), .hero-services, .manifesto > p:not(.caps), .studio-story p, .studio-story p:first-child, .service p, .services-intro p) {
  font-weight: 300; font-size: 15px;
}
html:not([lang="he"]) .studio-story [data-lang] p:first-child { color: var(--ink); }

/* labels in caps: 300, 12 (11 + weight 400 on phones) */
html:not([lang="he"]) :is(.caps, .crumbs, .studio-story > p.story-label, .card-cat, .site-footer .end a) { font-weight: 300; font-size: 12px; }

/* buttons and filters: 400 caps */
html:not([lang="he"]) :is(.btn, .filters button, .contact-tabs .btn) { font-weight: 400; font-size: 12px; letter-spacing: .2em; }
html:not([lang="he"]) .service .svc-key { font-weight: 400; }

/* ---------- Hebrew ---------- */
html[lang="he"] body { font-family: var(--he); font-weight: 300; font-size: 18px; letter-spacing: 0; }
html[lang="he"] :is(.page-title, .page-title.long, .cta h2, .studio-contact h2, .manifesto h2, .services-intro h2, .service h3, .hero-solo .bronza-lead, .menu-link, .card-title) {
  font-family: var(--he); font-weight: 800; letter-spacing: 0; line-height: 1.2;
}
html[lang="he"] :is(.page-title, .page-title.long, .cta h2, .studio-contact h2, .manifesto h2, .hero-solo .bronza-lead) { font-size: clamp(28px, 3.05vw, 44px); }
html[lang="he"] :is(.services-intro h2, .service h3) { font-size: clamp(22px, 2.2vw, 30px); }
html[lang="he"] :is(.hero-solo .bronza-text p:not(.bronza-lead), .hero-services, .manifesto > p:not(.caps), .studio-story p, .studio-story p:first-child, .service p, .services-intro p) {
  font-family: var(--he); font-weight: 300; font-size: 18px; letter-spacing: 0;
}
html[lang="he"] .studio-story [data-lang] p:first-child { font-weight: 300; color: var(--ink); }
html[lang="he"] :is(.caps, .crumbs, .studio-story > p.story-label, .btn, .filters button, .contact-tabs .btn, .lang-switch button[data-set-lang="he"], .site-footer .end a) {
  font-family: var(--he); font-weight: 700; letter-spacing: .04em; font-size: 14px;
}
html[lang="he"] :is(strong, b, .service .svc-key) { font-weight: 700; }

/* the wordmark and the header logo always stay Lexend Giga */
.logo, .bronza-word, .bw-c, .footer-big > span { font-family: var(--lg); }

@media (max-width: 700px) {
  html[lang="he"] body, html[lang="he"] :is(.hero-solo .bronza-text p:not(.bronza-lead), .hero-services, .manifesto > p:not(.caps), .studio-story p, .studio-story p:first-child, .service p, .services-intro p) { font-size: 17px; }
  html:not([lang="he"]) :is(.caps, .crumbs, .studio-story > p.story-label, .card-cat, .site-footer .end a, .btn, .filters button, .contact-tabs .btn) { font-size: 11px; font-weight: 400; }
}
html:not([lang="he"]) .bronza-text .hero-actions .btn, html:not([lang="he"]) .manifesto .manifesto-cta .btn, html:not([lang="he"]) .studio-contact .contact-tabs .btn { font-weight: 400; }
/* hero still fits one screen with the larger brand-book text sizes */
.hero-solo .bronza-word { font-size: clamp(64px, min(16vw, 23vh), 270px); margin-bottom: clamp(40px, 6vh, 72px); }

/* studio page story: wider column (fewer lines); opening paragraph heavier,
   the next two a touch heavier and darker than before (both languages) */
.studio-story > div { max-width: min(980px, 100%); }
html:not([lang="he"]) .studio-story [data-lang] p:first-child { font-weight: 400; font-size: clamp(17px, 1.45vw, 20px); line-height: 1.65; color: var(--ink); }
html:not([lang="he"]) .studio-story [data-lang] p:not(:first-child) { font-weight: 300; color: var(--ink); }
html[lang="he"] .studio-story [data-lang] p:first-child { font-weight: 700; font-size: clamp(19px, 1.6vw, 22px); line-height: 1.65; color: var(--ink); }
html[lang="he"] .studio-story [data-lang] p:not(:first-child) { font-weight: 400; color: var(--ink); }

/* smaller arrow cursor (24px instead of 32px) */
@media (hover: hover) and (pointer: fine) {
  html, body, .bw-l {
    cursor: url("../img/cursor-ink-s-1x.png") 2 2, auto;
    cursor: -webkit-image-set(url("../img/cursor-ink-s-1x.png") 1x, url("../img/cursor-ink-s-2x.png") 2x) 2 2, auto;
    cursor: image-set(url("../img/cursor-ink-s-1x.png") 1x, url("../img/cursor-ink-s-2x.png") 2x) 2 2, auto;
  }
  a, button, [role="button"], label, summary, .gallery .item, .filters button, .lang-switch button, .menu-btn, a *, button * {
    cursor: url("../img/cursor-bronze-s-1x.png") 2 2, pointer;
    cursor: -webkit-image-set(url("../img/cursor-bronze-s-1x.png") 1x, url("../img/cursor-bronze-s-2x.png") 2x) 2 2, pointer;
    cursor: image-set(url("../img/cursor-bronze-s-1x.png") 1x, url("../img/cursor-bronze-s-2x.png") 2x) 2 2, pointer;
  }
}

/* =========================================================================
   GRAPHIC ELEMENTS (Brand book): thin line only, one filled accent point.
   On light: dark line + bronze accent. One main element per page, at most
   one secondary. Home: target + arrow (central motif). Services: ruler
   (process) + stitch divider. Studio: the feathered arrow.
   ========================================================================= */
.bz-el svg { display: block; width: 100%; height: auto; overflow: visible; fill: none; stroke: var(--ink); stroke-width: 1; stroke-linecap: round; stroke-linejoin: round; }
.bz-el svg * { vector-effect: non-scaling-stroke; }

/* home: arrow flies into the target when the section comes into view */
.hero-solo + .manifesto { border-top: 0; }
.bz-target-arrow { width: clamp(88px, 8.4vw, 126px); margin: 0 auto 5vh; }
.bz-target-arrow .shaft { stroke: var(--bronze); transform: translateX(-46px); opacity: 0; transition: transform 1.1s cubic-bezier(.16, 1, .3, 1) .35s, opacity .4s ease .35s; }
.bz-target-arrow.is-in .shaft { transform: none; opacity: 1; }
.bz-target-arrow .rings circle { transition: stroke .3s; }

/* services: ruler with a bronze marker under "how we work" */
.bz-ruler { width: clamp(150px, 16vw, 220px); margin: 26px 0 2vh; }
.bz-ruler .tri { fill: var(--bronze); stroke: none; }
html[dir="rtl"] .bz-ruler { margin-inline-start: 0; }

/* services: stitched line instead of the plain rule above the clients */
.service-clients { border-top: 0; margin-top: 4vh; }
.bz-stitch { margin: 10vh auto 0; width: min(100%, 440px); }
.bz-stitch svg { stroke: none; fill: var(--ink); opacity: .55; }
.bz-stitch .dot { fill: var(--bronze); }
.bz-stitch svg { opacity: 1; }
.bz-stitch circle:not(.dot) { opacity: .5; }

/* studio: bronze arrow pointing on to "let's create together" */
.bz-arrow { width: clamp(70px, 6vw, 96px); margin: 9vh auto 0; }
.bz-arrow svg { stroke: var(--bronze); }
html[dir="rtl"] .bz-arrow svg { transform: scaleX(-1); }
.studio-story + .bz-arrow + .studio-contact { padding-top: 6vh; }

@media (prefers-reduced-motion: reduce) { .bz-target-arrow .shaft { transform: none; opacity: 1; transition: none; } }
html[dir="rtl"] .bz-target-arrow svg { transform: scaleX(-1); }

/* =========================================================================
   WAVEFORM (brand element) on videos with sound.
   Grid tile: a small light waveform in the corner (on dark: light line,
   blue accent) says "this one has sound". Viewer: the waveform sits under
   the video and moves while the sound plays; click it to mute / unmute.
   ========================================================================= */
.bz-wave, .lb-sound svg line { pointer-events: none; }
.bz-wave {
  position: absolute; inset-block-end: 12px; inset-inline-start: 12px; z-index: 2;
  width: 46px; padding: 7px 8px; background: rgba(26, 5, 1, .55); line-height: 0;
  transition: background .3s;
}
.item-video:hover .bz-wave { background: rgba(26, 5, 1, .8); }
.bz-wave svg, .lb-sound svg { display: block; width: 100%; height: auto; overflow: visible; }
.bz-wave line { stroke: var(--bg); stroke-width: 1; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.bz-wave line.acc { stroke: var(--blue); stroke-width: 1.4; }
.item-video .frame { position: relative; }

.lb-stage { position: relative; }
.lb-sound {
  position: absolute; inset-block-end: -46px; left: 50%; transform: translateX(-50%);
  width: 92px; padding: 8px 10px; background: transparent; border: 0;
}
.lb-sound line { stroke: var(--ink); stroke-width: 1; stroke-linecap: round; vector-effect: non-scaling-stroke; transform-box: fill-box; transform-origin: center; transform: scaleY(.18); transition: transform .4s ease; }
.lb-sound line.acc { stroke: var(--bronze); stroke-width: 1.5; }
.lb-sound.is-on line { animation: bz-wave 1.1s ease-in-out infinite alternate; animation-delay: calc(var(--i) * -.13s); }
.lb-sound:hover line { stroke: var(--bronze); }
@keyframes bz-wave { 0% { transform: scaleY(.35); } 100% { transform: scaleY(1); } }
@media (prefers-reduced-motion: reduce) { .lb-sound.is-on line { animation: none; transform: none; } }

/* home: the stitch line marks the passage from the hero to the DNA */
.bz-stitch.bz-stitch-home { margin: 0 auto; }

/* studio: the shooting star (scratch & dust) leads into "let's create together"
   — the trail draws itself in, then the bronze head lights up */
.bz-star { width: clamp(90px, 8vw, 120px); margin: 8vh auto 0; }
.bz-star .trail { stroke: var(--bronze); stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1.3s cubic-bezier(.16, 1, .3, 1) .3s; }
.bz-star .head { fill: var(--bronze); stroke: none; opacity: 0; transform-box: fill-box; transform-origin: center; transform: scale(.3); transition: opacity .4s ease 1.2s, transform .6s cubic-bezier(.16, 1, .3, 1) 1.2s; }
.bz-star .dust circle { fill: var(--ink); stroke: none; opacity: 0; transition: opacity .8s ease .6s; }
.bz-star.is-in .trail { stroke-dashoffset: 0; }
.bz-star.is-in .head { opacity: 1; transform: none; }
.bz-star.is-in .dust circle { opacity: .45; }
html[dir="rtl"] .bz-star svg { transform: scaleX(-1); }
.studio-story + .bz-star + .studio-contact { padding-top: 5vh; }
@media (prefers-reduced-motion: reduce) { .bz-star .trail, .bz-star .head, .bz-star .dust circle { transition: none; } }

/* QA: home stitch keeps a side gutter on phones */
.bz-stitch.bz-stitch-home { width: min(calc(100% - 48px), 440px); }

/* videos are plain moving pictures: no player UI anywhere (incl. iPhone Low Power Mode play badge) */
video::-webkit-media-controls, video::-webkit-media-controls-panel, video::-webkit-media-controls-start-playback-button, video::-webkit-media-controls-overlay-play-button { display: none !important; -webkit-appearance: none; opacity: 0 !important; }

/* contact line breaks after the comma on phones */
.m-br { display: none; }
@media (max-width: 600px) { .m-br { display: inline; } }
.nw { white-space: nowrap; }

/* home: clearer weight hierarchy — lead / tags (light, quieter) / body */
.hero-solo .hero-services { font-weight: 200; font-size: 13px; letter-spacing: .08em; color: rgba(26, 5, 1, .72); }
html[lang="he"] .hero-solo .hero-services { font-weight: 300; font-size: 16px; letter-spacing: 0; }
html[lang="he"] .hero-solo .bronza-text p:not(.bronza-lead):not(.hero-services) { font-weight: 400; }
@media (max-width: 600px) {
  .hero-solo .hero-services { font-size: 12px; }
  html[lang="he"] .hero-solo .hero-services { font-size: 15px; }
}

/* emphasis inside the DNA paragraph: stay within the loaded weights (Lexend 100–400 / Assistant 300–800) */
.manifesto strong { font-weight: 400; }
html[lang="he"] .manifesto strong { font-weight: 700; }

/* 404 page */
.page-head.nf { min-height: 62vh; align-content: center; }
.page-head.nf > * { grid-column: 1 / -1; }
.nf-text { margin: 18px 0 32px; max-width: 520px; }