/* Site-wide chrome from the atelier repositioning (2026-09-24): the footer as
   a closing page, the phone bar, and the one phone-only menu item. Written by
   _tx-build/site_chrome.py into every page; loaded last, so it only adds to
   styles.css and never needs the page styles to change. */

/* ── menu ─────────────────────────────────────────────────────────────── */
@media (min-width: 801px) { .nav .nav-only-m { display: none; } }

/* the header's booking button reads "Book a private consultation": one line */
.nav .nav-right .btn { white-space: nowrap; }
@media (min-width: 801px) and (max-width: 1180px) { .nav .nav-right .btn { letter-spacing: .08em; padding-left: 16px; padding-right: 16px; } }

/* One booking button on screen at a time: the sticky header's (desktop) or the
   phone bar's (phones). The chapter bar under the header had a second one,
   styled differently, a few pixels below it; it is hidden everywhere. */
.tx .txnav .txbtn--sm { display: none; }

/* ── footer ───────────────────────────────────────────────────────────── */
.footer-atelier { padding: clamp(72px, 9vw, 128px) 1.5rem 2rem; }
.footer-atelier .fa-top {
  max-width: 1200px; margin: 0 auto clamp(56px, 7vw, 96px);
  padding-bottom: clamp(48px, 6vw, 80px); border-bottom: 1px solid var(--border-soft);
}
.footer-atelier .fa-mark {
  margin: 0; font: 400 clamp(56px, 11vw, 150px)/.9 'Cormorant Garamond', Georgia, serif;
  letter-spacing: .14em; color: var(--char); margin-left: -.04em;
}
.footer-atelier .fa-tag {
  margin: 22px 0 0; font: 400 11px/1.6 'IBM Plex Mono', ui-monospace, monospace;
  letter-spacing: .16em; text-transform: uppercase; color: var(--taupe);
}
.footer-atelier .fa-lede {
  margin: 28px 0 0; max-width: 34ch; font: italic 400 clamp(22px, 2.2vw, 28px)/1.35 'Cormorant Garamond', Georgia, serif;
  color: var(--char);
}
.footer-atelier .fa-actions { display: flex; flex-wrap: wrap; gap: 14px 32px; align-items: baseline; margin: 34px 0 0; }
.footer-atelier .fa-cta {
  font: 500 11px/1 Inter, Arial, sans-serif; letter-spacing: .16em; text-transform: uppercase;
  color: var(--char); text-decoration: none; padding-bottom: 8px; border-bottom: 1px solid var(--char);
}
.footer-atelier .fa-wa { font-size: 14px; color: var(--text-muted); text-decoration: underline; text-underline-offset: 4px; }
.footer-atelier .fa-cta:hover, .footer-atelier .fa-wa:hover { opacity: .6; }
/* A smile beside the closing words (2026-09-25): the whole photograph, never
   cropped; under the words below 1100px, beside them from there up. The
   wordmark steps down a little in two columns so it clears the photo. */
.footer-atelier .fa-smile { margin: 44px 0 0; max-width: 320px; }
.footer-atelier .fa-smile img { display: block; width: 100%; height: auto; }
@media (min-width: 1100px) {
  .footer-atelier .fa-top {
    display: grid; grid-template-columns: minmax(0, 1fr) clamp(260px, 30%, 360px);
    column-gap: clamp(40px, 5vw, 72px); align-items: center;
  }
  .footer-atelier .fa-top > p { grid-column: 1; }
  .footer-atelier .fa-mark { font-size: clamp(56px, 9vw, 140px); }
  .footer-atelier .fa-smile { grid-column: 2; grid-row: 1 / span 4; margin: 0; max-width: none; }
}
.footer-atelier .footer-grid { grid-template-columns: 1fr 1fr; gap: 2.5rem 2rem; }
@media (min-width: 900px) { .footer-atelier .footer-grid { grid-template-columns: 1.3fr 1fr 1fr 1fr; } }
.footer-atelier .footer-follow a {
  display: block; color: var(--text-muted); text-decoration: none; margin-bottom: .5rem; transition: color .2s;
}
.footer-atelier .footer-follow a:hover { color: var(--char); }
.footer-atelier .footer-contact .directions { margin: .25rem 0 1.25rem; }
@media (max-width: 520px) { .footer-atelier .footer-grid { grid-template-columns: 1fr; } }

/* ── phone bar ────────────────────────────────────────────────────────── */
.mbar { display: none; }
@media (max-width: 800px) {
  .mbar {
    display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px;
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
    padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
    background: rgba(25, 24, 23, .92);
    -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
    transition: transform .35s ease, opacity .35s ease;
  }
  .mbar a {
    display: flex; align-items: center; justify-content: center; min-height: 44px;
    font: 500 11px/1.25 Inter, Arial, sans-serif; letter-spacing: .1em; text-transform: uppercase;
    text-decoration: none; text-align: center; padding: 0 16px;
  }
  .mbar__wa { color: #efe9df; border: 1px solid rgba(239, 233, 223, .35); }
  .mbar__book { color: var(--char); background: #efe9df; }
  .mbar.is-away { transform: translateY(110%); opacity: 0; pointer-events: none; }
  body.menu-open .mbar { transform: translateY(110%); opacity: 0; pointer-events: none; }
  body:has(.mbar) .footer-atelier { padding-bottom: calc(2rem + 64px + env(safe-area-inset-bottom)); }
}
@media (prefers-reduced-motion: reduce) { .mbar { transition: none; } }