/* Pilot13: selected ink-navy enamel / light-oak material family.
   Real links and live Sora labels; no rasterized concept-board lettering. */
.homepage-pilot .material-cta,
.companion-page .material-cta {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: .875rem;
  min-height: 52px;
  max-width: 100%;
  padding: .875rem 1.125rem;
  border: 1px solid #b8a06a;
  border-radius: 4px;
  font-family: "Sora", sans-serif;
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1.4;
  text-decoration: none;
  text-shadow: none;
  overflow-wrap: anywhere;
}
.homepage-pilot :is(.hero,.feature,.participation-section,.closing-section) .material-cta,
.companion-page .material-cta {
  font-weight: 700;
  font-size: 1.0625rem;
  line-height: 1.4;
}
.homepage-pilot .material-cta--navy,
.companion-page .material-cta--navy {
  background: linear-gradient(180deg, #0b2038, #07182b);
  color: #f5e9cf;
  box-shadow: inset 0 1px 0 #12304f, inset 0 -2px 0 rgba(0,6,15,.5), inset 0 0 0 3px rgba(183,155,96,.06), 0 2px 3px rgba(3,12,24,.18);
}
/* Full-face visible Void interference remains below solid live labels.
   Normal compositing preserves the dark ink base; there is no empty center mask. */
.homepage-pilot .material-cta--navy::before,
.companion-page .material-cta--navy::before { content: ""; position: absolute; inset: 3px; border: 1px solid #12304f; border-radius: 2px; pointer-events: none; z-index: 0; }
.homepage-pilot .material-cta--navy::after,
.companion-page .material-cta--navy::after { content: ""; position: absolute; inset: 4px; border-radius: 2px; background: url("/assets/cta-void-ripples.svg") center / 100% 100% no-repeat; opacity: 1; pointer-events: none; z-index: 0; }
.homepage-pilot .material-cta :is(.cta-label,.action-icon),
.companion-page .material-cta :is(.cta-label,.action-icon) { position: relative; z-index: 1; color: inherit; text-shadow: none; filter: none; }
.homepage-pilot .material-cta--oak,
.companion-page .material-cta--oak {
  background: repeating-linear-gradient(3deg, rgba(104,67,26,.045) 0 .7px, transparent .7px 4px), linear-gradient(100deg, #e2c495, #d2ad72);
  color: #0b2347;
  box-shadow: inset 0 1px 0 rgba(255,234,190,.7), inset 0 -1px 0 rgba(105,70,28,.35), 0 2px 3px rgba(3,12,24,.13);
}
.homepage-pilot .material-cta .cta-label,
.companion-page .material-cta .cta-label { min-width: 0; white-space: normal; text-shadow: none; }
.homepage-pilot .material-cta .action-icon,
.companion-page .material-cta .action-icon { display: inline-grid; place-items: center; flex: 0 0 1.5rem; width: 1.5rem; height: 1.5rem; line-height: 0; }
.homepage-pilot .material-cta--navy:hover,
.companion-page .material-cta--navy:hover { color: #f5e9cf; background: linear-gradient(180deg, #0b2038, #07182b); border-color: #cbb67b; text-decoration: none; }
.homepage-pilot .material-cta--oak:hover,
.companion-page .material-cta--oak:hover { color: #0b2347; background: #dfbf8b; border-color: #96743c; text-decoration: none; }
.homepage-pilot .material-cta:focus-visible,
.companion-page .material-cta:focus-visible { outline: 3px solid #0b2347; outline-offset: 4px; box-shadow: 0 0 0 3px #f5e9cf; }
.homepage-pilot :is(.hero,.closing-section) .material-cta:focus-visible { outline-color: #f5e9cf; box-shadow: 0 0 0 3px #07182b; }
.homepage-pilot .material-cta:active,
.companion-page .material-cta:active { box-shadow: inset 0 2px 2px rgba(0,0,0,.3); }
@media (max-width: 500px) {
 .homepage-pilot .hero .material-cta { width: 100%; }
}
@media (forced-colors: active) {
 .homepage-pilot .material-cta,
 .companion-page .material-cta { color: LinkText; background: Canvas; border: 1px solid ButtonText; box-shadow: none; }
 .homepage-pilot .material-cta::before, .homepage-pilot .material-cta::after,
 .companion-page .material-cta::before, .companion-page .material-cta::after { display: none; }
 .homepage-pilot .material-cta:focus-visible,
 .companion-page .material-cta:focus-visible { outline: 3px solid Highlight; box-shadow: none; }
}

@media (forced-colors: active) {
 .homepage-pilot .material-cta:is(:hover,:active), .companion-page .material-cta:is(:hover,:active) { color: LinkText; background: Canvas; box-shadow: none; }
 .homepage-pilot :is(.hero,.closing-section) .material-cta:focus-visible { outline-color: Highlight; box-shadow: none; }
}

/* Paired labels share identical metrics and cross-axis centers. Stack before
   the longer label has to compete with its icon; equal rows can still grow. */
.homepage-pilot .hero-copy { container-type: inline-size; }
.homepage-pilot .hero .actions { display: grid; grid-template-columns: minmax(0, 1fr); grid-auto-rows: 1fr; align-items: stretch; gap: .75rem .875rem; }
.homepage-pilot .hero .material-cta { width: 100%; min-height: 56px; padding: .875rem 1.125rem; font-size: 1.0625rem; font-weight: 700; line-height: 1.4; align-items: center; }
@container (min-width: 40rem) {
 .homepage-pilot .hero .actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Honest review-only capture layout. There is no form or submit handler until
   a mailing-list provider and a real destination are supplied and verified. */
.newsletter-preview { container-type: inline-size; }
.newsletter-preview label { display: block; margin-bottom: .5rem; font-size: 1rem; font-weight: 600; }
.newsletter-controls { display: grid; grid-template-columns: minmax(0, 1fr); gap: .625rem; align-items: stretch; }
.newsletter-controls input { min-width: 0; width: 100%; min-height: 56px; padding: .875rem 1rem; border: 1px solid #b8a06a; border-radius: 4px; background: #f9f5ef; color: #4b5563; font: inherit; }
.homepage-pilot .newsletter-subscribe { min-height: 56px; cursor: default; }
.newsletter-preview .availability { margin: .5rem 0 1rem; font-size: .875rem; }
.newsletter-links { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.25rem; }
.newsletter-links .quiet { margin: 0; }
@container (min-width: 32rem) {
 .newsletter-controls { grid-template-columns: minmax(0, 1fr) auto; }
}
/* Labels must be able to shrink and wrap beside their fixed icon, including
   under the inherited span flex-shrink:0 rule and text-only enlargement. */
.homepage-pilot .material-cta .cta-label,
.companion-page .material-cta .cta-label { display: block; flex: 1 1 auto; min-width: 0; }
.homepage-pilot .material-cta,
.companion-page .material-cta { min-height: 56px; }
.homepage-pilot .hero .material-cta { gap: .875rem; }

/* Solid17px Sora700 carries the labels. The one-pixel unblurred dark edge
   quiets only immediate glyph contours; full-face Void ripples remain visible. */
.homepage-pilot .material-cta--navy .cta-label,
.companion-page .material-cta--navy .cta-label {
  color: #f5e9cf;
  text-shadow: -1px 0 0 #07182b, 1px 0 0 #07182b, 0 -1px 0 #07182b, 0 1px 0 #07182b;
}
@media (forced-colors: active) {
 .homepage-pilot .material-cta--navy .cta-label,
 .companion-page .material-cta--navy .cta-label { color: LinkText; text-shadow: none; }
}

/* Quiet only the label footprint; the user's full-face Void contours remain
   visible through this translucent ink veil and untouched around the edges. */
.homepage-pilot .material-cta--navy .cta-label::before,
.companion-page .material-cta--navy .cta-label::before { content: ""; position: absolute; z-index: -1; inset: -3px -4px; border-radius: 4px; background: rgba(7,24,43,.58); box-shadow: 0 0 5px 3px rgba(7,24,43,.35); pointer-events: none; }
@media (forced-colors: active) { .homepage-pilot .material-cta--navy .cta-label::before, .companion-page .material-cta--navy .cta-label::before { display: none; } }

/* Pilot16.2: stronger local ink protection only under the live label footprint.
   Full-face contours remain visible around that zone and under the icon. */
.homepage-pilot .material-cta--navy .cta-label::before,
.companion-page .material-cta--navy .cta-label::before { inset: -5px -7px; background: rgba(7,24,43,.88); box-shadow: 0 0 7px 4px rgba(7,24,43,.52); }
@media (forced-colors: active) { .homepage-pilot .material-cta--navy .cta-label::before, .companion-page .material-cta--navy .cta-label::before { display: none; } }