/* ═══════════════════════════════════════════════════════════════════
   THE FOUNDER PORTALS (Anric Blatt, Lauralouise Blatt)
   Version 2.3.0 · 2026-10-13

   Loaded after the shared stylesheets, on the two founder portals. Adds the
   few pieces the shared components do not have: the hero portrait, the
   proof strip, the goal router tiles, the communications columns and the
   press kit layout. Gold on black, radii 6 to 10px, no pills, no italics.
   ═══════════════════════════════════════════════════════════════════ */

/* Reveal: visible by default. Hidden only once the inline script has set
   html.p-reveal (JS present, IntersectionObserver present, motion allowed);
   a 1.2s timeout in that script shows everything regardless. */
html .b-reveal { opacity: 1; transform: none; }
html.p-reveal .b-reveal:not([data-shown="true"]) { opacity: 0; transform: translateY(14px); }

/* Nav spy is silent at the top of the page. */
html.p-top .b-nav-links a[aria-current] { color: var(--mv-text-muted); border-bottom-color: transparent; }

/* Hero: portrait top aligns with the headline block, tight rhythm. */
.b-hero.p-hero { min-height: auto; align-items: start; padding-block: 56px clamp(36px, 5vh, 56px); }
@media (max-width: 900px) { .b-hero.p-hero { padding-block: 32px 36px; } }
.p-hero .b-hero-grid { align-items: start; gap: clamp(28px, 4vw, 56px); }
.p-hero .b-hero .b-lead, .p-hero .b-lead { margin-top: 18px; }
.p-hero .b-btn-row { margin-top: 26px; }
.p-hero h1 { margin-top: 14px; }

.p-visual { position: relative; display: grid; justify-items: center; align-self: start; }
/* The vault dial stays as a quiet backdrop behind the portrait. It is
   decorative and aria-hidden, and the geometry test holds it intact. */
.p-orb {
  position: absolute;
  inset: -8% -10%;
  z-index: 0;
  opacity: 0.4;
  pointer-events: none;
  display: grid;
  place-items: center;
}
.p-orb .b-dial { width: 100%; }
.p-portrait {
  position: relative;
  z-index: 1;
  width: min(100%, 400px);
  margin-inline: auto;
  overflow: hidden;
  border-radius: 10px;
  border: 1px solid var(--b-hairline-firm);
  background: var(--mv-bg-card, #111);
}
.p-portrait figure { margin: 0; height: 100%; }
.p-portrait img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  background: var(--mv-bg-card, #111);
}

.p-proof {
  list-style: none;
  margin: clamp(28px, 4vw, 44px) 0 0;
  padding: 20px 0 0;
  border-top: 1px solid var(--b-hairline);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 18px 32px;
}
.p-proof li { display: grid; gap: 6px; }
.p-n {
  font-family: var(--mv-font-display);
  font-weight: 400;
  font-size: clamp(26px, 3.2vw, 38px);
  line-height: 1.05;
  color: var(--mv-gold);
}
.p-proof span { font-size: 13px; line-height: 1.45; color: var(--mv-text-secondary); max-width: 34ch; text-wrap: balance; }
@media (min-width: 700px) { .p-proof span { min-height: 2.9em; } }

/* Start here: 3x2, 2x3 on tablet, 1 column on mobile. */
.p-tiles {
  list-style: none;
  margin: 8px 0 0;
  padding: 0;
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
@media (max-width: 980px) { .p-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) {
  .p-tiles { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .p-tiles .p-tile {
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 12px;
    row-gap: 6px;
    min-height: 0;
    padding: 14px 16px;
  }
  .p-tiles .p-tile-n { grid-column: 1; grid-row: 1; }
  .p-tiles .p-tile-k { grid-column: 2; grid-row: 1; font-size: 18px; }
  .p-tiles .p-tile-go { position: static; grid-column: 3; grid-row: 1; }
  .p-tiles .p-tile-l { grid-column: 1 / -1; grid-row: 2; font-size: 14px; line-height: 1.45; }
}
.p-tile {
  position: relative;
  display: grid;
  align-content: start;
  gap: 8px;
  height: 100%;
  padding: 22px 22px 52px;
  border: 1px solid var(--b-hairline-firm);
  border-radius: 10px;
  background: var(--mv-bg-card);
  color: var(--mv-text-primary);
  text-decoration: none;
  transition: border-color 0.25s, transform 0.25s, background 0.25s;
}
.p-tile[data-primary="true"] {
  border-color: var(--mv-gold);
  background: linear-gradient(160deg, var(--mv-gold-subtle), var(--mv-bg-card) 70%);
}
.p-tile:hover, .p-tile:focus-visible { border-color: var(--mv-gold); transform: translateY(-3px); background: var(--mv-gold-subtle); }
.p-tile:focus-visible { outline: 2px solid var(--mv-gold); outline-offset: 3px; }
.p-tile-n { font-family: var(--mv-font-display); font-size: 13px; letter-spacing: 0.18em; color: var(--mv-text-secondary); }
.p-tile[data-primary="true"] .p-tile-n { color: var(--mv-gold); }
.p-tile-k { font-family: var(--mv-font-display); font-size: 19px; color: var(--mv-gold); }
.p-tile-l { font-size: 15px; line-height: 1.55; color: var(--mv-text-secondary); }
.p-tile-go { position: absolute; left: 22px; bottom: 18px; color: var(--mv-gold); transition: transform 0.25s; }
.p-tile:hover .p-tile-go, .p-tile:focus-visible .p-tile-go { transform: translateX(6px); }
.p-tile-go svg { width: 30px; height: 11px; }

.p-group {
  font-size: 13px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--mv-gold);
  margin: 36px 0 14px;
}
.p-group:first-child { margin-top: 0; }
.p-tag {
  display: inline-block;
  align-self: flex-start;
  margin: 0;
  padding: 3px 9px;
  border: 1px solid var(--b-hairline-firm);
  border-radius: 6px;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mv-text-secondary);
}

/* Businesses: three featured cards, then compact tiles by category. */
.p-feat {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
@media (max-width: 980px) { .p-feat { grid-template-columns: minmax(0, 1fr); } }
.p-feat-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  padding: 26px;
  border: 1px solid var(--mv-gold);
  border-radius: 10px;
  background: linear-gradient(160deg, var(--mv-gold-subtle), var(--mv-bg-card) 65%);
}
.p-mono {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border: 1px solid var(--mv-gold);
  border-radius: 8px;
  font-family: var(--mv-font-display);
  font-size: 18px;
  letter-spacing: 0.04em;
  color: var(--mv-gold);
}
.p-feat-name { font-family: var(--mv-font-display); font-size: clamp(20px, 2vw, 24px); margin: 0; }
.p-feat-name a { color: var(--mv-text-primary); text-decoration: none; }
.p-feat-name a:hover { color: var(--mv-gold); }
.p-feat-body { margin: 0; font-size: 15px; line-height: 1.6; color: var(--mv-text-secondary); }
.p-feat-card .b-index-go { margin-top: auto; padding-top: 6px; }

.p-mini {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (max-width: 700px) { .p-mini { grid-template-columns: minmax(0, 1fr); } }
/* Three cards sit three across; four sit two by two; two sit two across.
   Never a lone card under a pair. Between 701 and 860px three stack. */
@media (min-width: 861px) { .p-mini[data-n="3"] { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 701px) and (max-width: 860px) { .p-mini[data-n="3"] { grid-template-columns: minmax(0, 1fr); } }
.p-mini[data-n="1"] { grid-template-columns: minmax(0, 1fr); }
.p-mini-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  height: 100%;
  min-height: 132px;
  padding: 18px 20px;
  border: 1px solid var(--b-hairline-firm);
  border-radius: 10px;
  background: var(--mv-bg-card);
  text-decoration: none;
  color: var(--mv-text-secondary);
  transition: border-color 0.25s;
}
.p-mini-card:hover, .p-mini-card:focus-visible { border-color: var(--mv-gold); }
.p-mini-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; }
.p-mini-top strong { font-family: var(--mv-font-display); font-weight: 400; font-size: 17px; color: var(--mv-text-primary); }
.p-mini-body { font-size: 14px; line-height: 1.55; }
.p-mini-go { margin-top: auto; padding-top: 4px; font-size: 13px; color: var(--mv-gold); display: inline-flex; align-items: center; gap: 8px; }
/* An odd card at the end of a group spans both columns, so no cell is left hollow. */
@media (min-width: 701px) { .p-mini:not([data-n="3"]) > li:last-child:nth-child(odd) { grid-column: 1 / -1; } }
.p-mini-go svg { width: 22px; height: 8px; }

/* Books: four across and three centred beneath at the same card width
   (an eight-track grid, each card two tracks); a snap row on tablet; a
   two-up grid on a phone. Every cover sits in the same 2:3 box on a
   surface, whatever the file's own proportions, so text tops align. */
.b-shelf.p-shelf {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 32px 24px;
  border-top: 0;
  padding-top: 0;
  align-items: start;
}
.p-shelf .b-book {
  display: flex;
  flex-direction: column;
  gap: 16px;
  grid-column: span 2;
  min-width: 0;
}
.p-shelf .b-book:nth-child(5) { grid-column: 2 / span 2; }
.p-shelf .b-book-cover {
  width: 100%;
  aspect-ratio: 2 / 3;
  background: var(--mv-bg-card, #111);
  border-radius: 6px;
  border: 1px solid rgba(255, 255, 255, 0.32);
  box-shadow: 0 16px 30px -18px rgba(0, 0, 0, 0.95), 0 0 0 1px rgba(255, 255, 255, 0.06);
}
.p-shelf .b-book-cover img { width: 100%; height: 100%; object-fit: contain; display: block; }
.p-shelf .b-book-blurb {
  display: block;
  -webkit-line-clamp: unset;
  overflow: visible;
  font-size: 14px;
  color: var(--mv-text-secondary);
}
.p-shelf .b-book-kind { font-size: 12px; }
/* Five books: three across and two centred beneath, same card width.
   Desktop only; tablet and phone use the snap row and the two-up grid. */
@media (min-width: 1000px) {
  .b-shelf.p-shelf[data-books="5"] { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .p-shelf[data-books="5"] .b-book:nth-child(5) { grid-column: span 2; }
  .p-shelf[data-books="5"] .b-book:nth-child(4) { grid-column: 2 / span 2; }
}
@media (max-width: 999px) {
  .b-shelf.p-shelf {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding-bottom: 16px;
  }
  .p-shelf .b-book { flex: 0 0 min(220px, 68vw); scroll-snap-align: start; }
}
/* Phone: two up, covers 150px or wider, full descriptions that let the
   card grow, one column under 380px. An odd last book spans the row with
   its cover beside its text, so no card is left alone beside a gap. */
@media (max-width: 600px) {
  .b-shelf.p-shelf {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 28px 16px;
    overflow: visible;
    padding-bottom: 0;
  }
  .p-shelf .b-book, .p-shelf .b-book:nth-child(5) { flex: none; grid-column: auto; gap: 12px; }
  .p-shelf .b-book:last-child:nth-child(odd) { grid-column: 1 / -1; display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 16px; align-items: start; }
  .p-shelf .b-book-title { font-size: 15px; }
  .p-shelf .b-book-blurb { font-size: 13px; line-height: 1.5; }
}
@media (max-width: 379px) {
  .b-shelf.p-shelf { grid-template-columns: minmax(0, 1fr); }
  .p-shelf .b-book:last-child:nth-child(odd) { grid-column: auto; display: flex; }
  .p-shelf .b-book-cover { width: min(100%, 220px); }
}
.p-shelf:focus-visible { outline: 2px solid var(--mv-gold); outline-offset: 4px; }

/* Events, writing, contact */
.p-event {
  display: grid;
  gap: 14px;
  justify-items: start;
  padding: clamp(24px, 3vw, 40px);
  border: 1px solid var(--mv-gold);
  border-radius: 10px;
  background: linear-gradient(160deg, var(--mv-gold-subtle), var(--mv-bg-card) 70%);
}
.p-event-name { font-family: var(--mv-font-display); font-size: clamp(24px, 3vw, 36px); margin: 0; color: var(--mv-text-primary); }
.p-event-body { margin: 0; max-width: 60ch; font-size: 17px; line-height: 1.6; color: var(--mv-text-secondary); }
.p-sec {
  list-style: none;
  margin: 16px 0 0;
  padding: 0;
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
}
.p-sec-card {
  display: grid;
  align-content: start;
  gap: 6px;
  height: 100%;
  padding: 18px 20px;
  border: 1px solid var(--b-hairline-firm);
  border-radius: 10px;
  background: var(--mv-bg-card);
  text-decoration: none;
  color: var(--mv-text-secondary);
  transition: border-color 0.25s;
}
.p-sec-card:hover, .p-sec-card:focus-visible { border-color: var(--mv-gold); }
.p-sec-card strong { color: var(--mv-text-primary); font-weight: 600; }
.p-sec-card span { font-size: 14px; line-height: 1.5; }
.p-work {
  margin-top: 16px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 20px 32px;
  padding: clamp(22px, 3vw, 34px);
  border: 1px solid var(--b-hairline-firm);
  border-radius: 10px;
  background: var(--mv-bg-card);
}
.p-work h3 { font-size: 20px; margin: 0 0 6px; color: var(--mv-gold); }
.p-work p { margin: 0; max-width: 52ch; color: var(--mv-text-secondary); }
.p-work-acts { display: flex; flex-wrap: wrap; gap: 12px; }

/* About */
.p-about {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  gap: clamp(28px, 5vw, 72px);
  align-items: start;
}
@media (max-width: 800px) { .p-about { grid-template-columns: minmax(0, 1fr); } }
.p-quote {
  margin: 0;
  padding: clamp(24px, 3vw, 40px);
  border: 1px solid var(--mv-gold);
  border-radius: 10px;
  background: linear-gradient(160deg, var(--mv-gold-subtle), var(--mv-bg-card) 70%);
}
.p-quote p { margin: 0; font-family: var(--mv-font-display); font-size: clamp(22px, 2.6vw, 32px); line-height: 1.25; color: var(--mv-text-primary); }
.p-quote footer { margin-top: 18px; font-size: 13px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--mv-gold); }
.p-about-side { display: grid; gap: 22px; align-content: start; }
.p-about-side h3 { font-size: 13px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--mv-gold); margin: 0 0 10px; }
.p-sources { font-size: 14px; color: var(--mv-text-secondary); }

/* Press kit: copy button sits in its own top band, never over the text. */
.p-kit { display: grid; gap: 28px; }
.p-kit h3 { font-size: 18px; margin: 0 0 10px; min-height: 30px; display: flex; align-items: center; }
.p-kit > div { position: relative; }
.p-kit-row { display: grid; gap: 28px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 700px) { .p-kit-row { grid-template-columns: minmax(0, 1fr); } }
.p-kit-row > div {
  padding: 22px;
  border: 1px solid var(--b-hairline-firm);
  border-radius: 10px;
  background: var(--mv-bg-card);
}
.p-kit-row .p-plain:last-child { margin-bottom: 0; }
.p-plain { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 8px; font-size: 15px; }
.p-photo { display: flex; align-items: center; gap: 12px; }
.p-photo-t { flex: none; width: 48px; height: 60px; object-fit: cover; border-radius: 6px; border: 1px solid var(--b-hairline-firm); background: var(--mv-bg-card, #111); }
.p-kit .b-kit-copy[data-copy] { position: static; }
.p-kit .b-kit-copy {
  margin: 0;
  padding: 20px 22px;
  border: 1px solid var(--b-hairline-firm);
  border-left: 1px solid var(--b-hairline-firm);
  border-radius: 10px;
  background: var(--mv-bg-card);
  font-size: 15px;
  line-height: 1.7;
  max-width: none;
  color: var(--mv-text-secondary);
}
.p-kit > div > h3 + .b-kit-copy .b-copy, .p-kit .b-kit-copy .b-copy { top: 0; right: 0; }
.p-kit .b-kit-copy span { display: block; margin-bottom: 0.9em; }
.p-kit .b-kit-copy span:last-child { margin-bottom: 0; }

/* FAQ: full-width answers, readable measure. */
.b-faq p { max-width: 70ch; }

/* Footer: 14px, AA contrast, and room so the consent banner never covers it.
   Ground is #050505. Links #e6e6e6 (about 16:1), tagline and base line
   #cccccc (about 13:1), brand label #ffffff (about 20:1). */
/* portal.css links before blatt.css, so the element-qualified selector is
   what makes this padding win over the shared footer rule. */
footer.b-footer { padding-bottom: 160px; }
@media (max-width: 720px) { footer.b-footer { padding-bottom: 300px; } }
footer.b-footer { background: #050505; }
.b-footer a { font-size: 14px; color: #e6e6e6; }
footer.b-footer a { color: #e6e6e6; }
footer.b-footer a:hover, footer.b-footer a:focus-visible { color: var(--mv-gold); }
footer.b-footer .b-mark, footer.b-footer .b-mark span { color: #ffffff; }
footer.b-footer .b-footer-tag { max-width: 36ch; font-size: 14px; line-height: 1.55; color: #cccccc; margin-top: 16px; }
footer.b-footer .b-footer-base, footer.b-footer .p-version, footer.b-footer .b-linkbtn { color: #cccccc; }
footer.b-footer .b-footer-base { font-size: 13px; }

/* The estate directory ("Everything in the Vault"). All of it is visible
   without scripting; the find box is revealed by the inline script. */
.p-dir { display: grid; gap: 18px; grid-template-columns: minmax(0, 1fr); }
.p-dir-count { margin: 0; font-size: 15px; color: var(--mv-text-secondary); }
.p-dir-find[hidden], .p-dir-item[hidden], .p-dir-cat[hidden] { display: none; }
.p-dir-q {
  width: 100%;
  max-width: 560px;
  box-sizing: border-box;
  padding: 14px 16px;
  font: inherit;
  font-size: 16px;
  color: var(--mv-text-primary);
  background: var(--mv-bg-card);
  border: 1px solid var(--b-hairline-firm);
  border-radius: 8px;
}
.p-dir-q:focus-visible { outline: 2px solid var(--mv-gold); outline-offset: 2px; border-color: var(--mv-gold); }
.p-dir-jump ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.p-dir-jump a {
  display: inline-block;
  padding: 7px 12px;
  border: 1px solid var(--b-hairline-firm);
  border-radius: 6px;
  font-size: 13px;
  color: var(--mv-text-secondary);
  text-decoration: none;
  transition: border-color 0.25s, color 0.25s;
}
.p-dir-jump a:hover, .p-dir-jump a:focus-visible { border-color: var(--mv-gold); color: var(--mv-gold); }
.p-dir-cat { scroll-margin-top: 92px; margin-top: 34px; }
.p-dir-jump-l { display: none; }
/* Phone: one scrolling row of chips that stays under the header while the
   visitor is inside the directory (it unsticks when the section ends). */
@media (max-width: 700px) {
  .p-dir-jump {
    position: sticky;
    top: 56px;
    z-index: 5;
    display: flex;
    align-items: center;
    gap: 10px;
    margin-inline: calc(var(--b-gutter, 16px) * -1);
    padding: 8px var(--b-gutter, 16px);
    background: rgba(5, 5, 5, 0.94);
    border-bottom: 1px solid var(--b-hairline);
  }
  .p-dir-jump-l { display: inline; flex: none; font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--mv-gold); }
  .p-dir-jump ul { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; gap: 6px; }
  .p-dir-jump ul::-webkit-scrollbar { display: none; }
  .p-dir-jump li { flex: none; }
  .p-dir-jump a { padding: 6px 10px; white-space: nowrap; }
  .p-dir-cat { scroll-margin-top: 120px; }
}
.p-dir-h { display: flex; align-items: baseline; gap: 10px; margin: 0 0 14px; }
.p-dir-n { font-size: 12px; letter-spacing: 0.08em; color: var(--mv-text-secondary); }
.p-dir-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
/* Desktop: a twelve-track grid so every row is full. Spans by count:
   1 full; 2 and 4 two-up; 3, 6 and 9 three-up; 5 is 3 + 2; 7 is 3 + 4;
   8 is four-up. While a filter is active the grid falls back to a plain
   auto-fill, because hidden items would break the count. */
@media (min-width: 981px) {
  .p-dir-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .p-dir-grid > li { grid-column: span 4; }
  .p-dir-grid[data-n="1"] > li { grid-column: span 12; }
  .p-dir-grid[data-n="2"] > li, .p-dir-grid[data-n="4"] > li { grid-column: span 6; }
  .p-dir-grid[data-n="5"] > li:nth-child(n+4) { grid-column: span 6; }
  .p-dir-grid[data-n="7"] > li:nth-child(n+4) { grid-column: span 3; }
  .p-dir-grid[data-n="8"] > li { grid-column: span 3; }
  .p-dir.is-filtered .p-dir-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .p-dir.is-filtered .p-dir-grid > li { grid-column: auto; }
}
/* Tablet: two across, an odd last card spans the row. */
@media (max-width: 980px) {
  .p-dir-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .p-dir-grid > li:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
@media (max-width: 600px) {
  .p-dir-grid { grid-template-columns: minmax(0, 1fr); }
  .p-dir-grid > li:last-child:nth-child(odd) { grid-column: auto; }
}
.p-dir-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  height: 100%;
  box-sizing: border-box;
  padding: 16px 18px;
  border: 1px solid var(--b-hairline-firm);
  border-radius: 10px;
  background: var(--mv-bg-card);
  text-decoration: none;
  color: var(--mv-text-secondary);
  transition: border-color 0.25s;
}
.p-dir-card:hover, .p-dir-card:focus-visible { border-color: var(--mv-gold); }
.p-dir-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 10px; }
.p-dir-top strong { font-family: var(--mv-font-display); font-weight: 400; font-size: 16px; line-height: 1.3; color: var(--mv-text-primary); }
.p-dir-purpose { font-size: 14px; line-height: 1.5; }
.p-dir-host { margin-top: auto; padding-top: 4px; font-size: 13px; color: var(--mv-gold); display: inline-flex; align-items: center; gap: 8px; overflow-wrap: anywhere; }
.p-dir-host svg { width: 22px; height: 8px; flex: none; }

/* A long name in the header (Lauralouise Blatt) must not be cut on a
   phone: tighten the brand label under 480px, again under 360px. */
@media (max-width: 480px) { .b-nav .b-mark { font-size: 12px; letter-spacing: 0.1em; gap: 8px; } }
@media (max-width: 360px) { .b-nav .b-mark { font-size: 11px; letter-spacing: 0.06em; } }

@media (prefers-reduced-motion: reduce) {
  .p-tile, .p-tile-go, .p-mini-card, .p-sec-card, .p-dir-card, .p-dir-jump a { transition: none; }
  .p-tile:hover, .p-tile:focus-visible, .p-tile:hover .p-tile-go { transform: none; }
}
footer.b-footer .b-footer-base span { color: #cccccc; }