/* ============================================================
   LAIBEL · refresh layer  (v2 — bright / sleek / rounded)
   Loaded LAST. Re-skins the existing design toward a lighter,
   tighter, softer-edged feeling without rewriting components.
   ============================================================ */

/* ---------- 1 · SLEEKER, SMALLER TYPE SCALE ---------- */
:root {
  --text-display: clamp(2.1rem, 4.4vw, 4rem);
  --text-h2:      clamp(1.5rem, 2.6vw, 2.5rem);
  --text-h3:      clamp(1.1rem, 1.5vw, 1.4rem);
  --text-body:    clamp(.95rem, 1vw, 1.0rem);
  --text-small:   .8125rem;
  --text-overline:.6875rem;
  --container: 76rem;
  --r: 14px;          /* default radius */
  --r-lg: 22px;       /* media / cards */
  --r-pill: 999px;
}

/* tighten the display serif so smaller sizes still feel composed */
.display-sans,
.hero__title,
h1, h2 {
  letter-spacing: -0.015em;
  line-height: 1.06;
}
.eyebrow,
.f-col__title,
.c-field__label,
.laibel-footer__col h4 {
  letter-spacing: .16em;
  font-size: var(--text-overline);
}
body { line-height: 1.6; }

/* ---------- 2 · BRIGHTEN — flip the homepage's dark mid-bands ----------
   Token remap: within these sections --charcoal resolves to a light
   surface and the cream/on-dark text tokens resolve to ink, so the
   existing component rules paint light with correct contrast.
   The hero, film band and closing CTA stay dark as intentional anchors. */
.isnt,
.showcase,
.showcase__item,
.results,
.fit {
  --charcoal:    var(--white);
  --cream:       var(--ink);
  --on-dark:     var(--ink);
  --on-dark-72:  var(--ink-60);
  --on-dark-50:  var(--ink-40);
  --on-dark-32:  var(--ink-40);
  --rule-light:  var(--rule);
}
/* keep the gold accents reading on the new light bands */
.showcase, .results, .fit, .isnt { border-color: var(--rule); }

/* a hairline to separate stacked light bands from the dark anchors */
.showcase { border-top: 1px solid var(--rule); }

/* ---------- 3 · SOFTER, "BENT" EDGES ---------- */
/* media */
.vp,
.vp__frame,
.hero__film,
.showcase__item,
.g_visual_wrap,
.gallery_cms_item img,
.menu_gallery_img,
.video_placeholder,
iframe.vp__frame {
  border-radius: var(--r-lg);
  overflow: hidden;
}
.hero__film { border-radius: var(--r-lg); }

/* cards / surfaces */
.work-card,
.c-form-section .c-form,
.c-aside__block { border-radius: var(--r); }

/* controls */
.btn,
.btn--gold,
.btn--light,
.menu__cta,
.nav__cta,
.laibel-footer__contact { border-radius: var(--r-pill); }

.c-field__input,
.c-field__textarea,
.laibel-footer__sub { border-radius: var(--r); }
.laibel-footer__sub { padding: .55rem .9rem; border: 1px solid var(--rule-light); }

/* nav becomes a calm, aligned bar */
.nav__inner { gap: clamp(1rem, 3vw, 2.5rem); }

/* ---------- 4 · LOCKED-TO-GRID SPACING ---------- */
.container { max-width: var(--container); }
.section { padding-block: clamp(4rem, 8vw, 7.5rem); }

/* ---------- 5 · LIGHTER PAGE-TRANSITION CURTAIN ----------
   A warm cream curtain (instead of charcoal) keeps the whole
   experience feeling bright, even mid-navigation. */
.lb-curtain { background: var(--cream); }
.lb-curtain__mark {
  color: var(--charcoal);
  font-size: clamp(1.1rem, 3vw, 1.9rem);
  letter-spacing: .5em;
  text-indent: .5em;
}
.lb-curtain::after { background: var(--gold); height: 1px; }

/* ---------- 6 · CURSOR tuned for a light ground ---------- */
.lb-cursor-dot,
.lb-cursor-ring { mix-blend-mode: normal; border-color: var(--ink); }
.lb-cursor-dot { background: var(--ink); }
.lb-cursor-ready.lb-cursor-hover .lb-cursor-ring {
  background: rgba(180,135,72,.16);
  border-color: var(--gold);
}