/* R27 April UI/UX static-first governance layer.
   Scope: public conversion/authority pages, login-safe shell, and lightweight mobile safeguards. */
:root {
  --r27-ink: #09111f;
  --r27-muted: #5b6472;
  --r27-line: rgba(15, 23, 42, .12);
  --r27-cream: #f8f4eb;
  --r27-paper: #fffaf1;
  --r27-signal: #d97706;
  --r27-forest: #173f35;
  --r27-blueprint: #10243e;
  --r27-radius: 28px;
}
html { scroll-padding-top: 96px; }
body { overflow-x: clip; }
img, svg, video, canvas { max-width: 100%; height: auto; }
.r27-page { background: radial-gradient(circle at 12% 8%, rgba(217,119,6,.16), transparent 30rem), linear-gradient(180deg, #fffaf1 0%, #f7f1e6 58%, #ffffff 100%); color: var(--r27-ink); }
.r27-wrap { width: min(1120px, calc(100% - 32px)); margin: 0 auto; }
.r27-hero { padding: clamp(56px, 8vw, 104px) 0 clamp(36px, 6vw, 76px); }
.r27-kicker { color: var(--r27-forest); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; font-size: .78rem; }
.r27-hero h1 { max-width: 980px; margin: 14px 0 18px; font-size: clamp(2.5rem, 6vw, 5.8rem); line-height: .92; letter-spacing: -.065em; }
.r27-hero p { max-width: 760px; color: var(--r27-muted); font-size: clamp(1.05rem, 2vw, 1.3rem); line-height: 1.62; }
.r27-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.r27-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 13px 18px; border-radius: 999px; font-weight: 800; text-decoration: none; border: 1px solid var(--r27-line); }
.r27-btn--primary { background: var(--r27-ink); color: white; box-shadow: 0 18px 44px rgba(9,17,31,.18); }
.r27-btn--secondary { background: rgba(255,255,255,.72); color: var(--r27-ink); }
.r27-truthbar { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--r27-line); border-radius: var(--r27-radius); background: var(--r27-line); box-shadow: 0 22px 70px rgba(9,17,31,.08); }
.r27-truthbar div { background: rgba(255,255,255,.78); padding: 18px; min-height: 112px; }
.r27-truthbar b { display: block; margin-bottom: 8px; color: var(--r27-forest); font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; }
.r27-grid { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(280px,.65fr); gap: clamp(20px, 4vw, 44px); align-items: start; padding: 34px 0 84px; }
.r27-card { border: 1px solid var(--r27-line); border-radius: var(--r27-radius); padding: clamp(22px, 4vw, 36px); background: rgba(255,255,255,.76); box-shadow: 0 18px 60px rgba(9,17,31,.08); }
.r27-card h2, .r27-card h3 { margin-top: 0; letter-spacing: -.035em; }
.r27-list { display: grid; gap: 14px; padding: 0; list-style: none; }
.r27-list li { padding-left: 18px; border-left: 3px solid rgba(217,119,6,.42); color: var(--r27-muted); line-height: 1.55; }
.r27-next-action { position: sticky; top: 92px; }
.r27-next-action strong { display: block; margin-bottom: 10px; font-size: 1.05rem; }
.r27-login-shell { min-height: 100svh; display: grid; place-items: center; padding: max(24px, env(safe-area-inset-top)) 16px max(24px, env(safe-area-inset-bottom)); background: radial-gradient(circle at top left, rgba(217,119,6,.2), transparent 28rem), #f8f4eb; }
.r27-login-card { width: min(920px, 100%); border: 1px solid var(--r27-line); border-radius: 32px; background: rgba(255,255,255,.82); box-shadow: 0 24px 90px rgba(9,17,31,.12); padding: clamp(24px, 5vw, 46px); }
.r27-login-card h1 { margin: 10px 0 12px; font-size: clamp(2rem, 5vw, 4.4rem); line-height: .95; letter-spacing: -.06em; }
.r27-login-lanes { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; margin-top: 24px; }
.r27-lane { border: 1px solid var(--r27-line); border-radius: 22px; padding: 18px; background: #fffaf1; }
.r27-lane p { color: var(--r27-muted); }
.r27-mobile-note { margin-top: 18px; color: var(--r27-muted); font-size: .95rem; }
.r27-diagram-safe, .diagram, .diagram-shell, .research-diagram { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
@media (max-width: 760px) {
  .r27-wrap { width: min(100% - 24px, 1120px); }
  .r27-hero { padding-top: 40px; }
  .r27-truthbar, .r27-grid, .r27-login-lanes { grid-template-columns: 1fr; }
  .r27-next-action { position: static; }
  .r27-actions .r27-btn { width: 100%; }
  .r27-card { border-radius: 22px; }
  .r27-login-card { border-radius: 24px; }
}
/* R27.2 premium login and readiness assessment polish. */
.r27-auth-premium,
.r27-diagnostic-page {
  font-family: "Space Grotesk", "Avenir Next", sans-serif;
  color: var(--r27-ink);
  text-rendering: geometricPrecision;
}
.r27-auth-premium {
  min-height: 100svh;
  place-items: center;
  padding: clamp(18px, 4vw, 42px);
  background:
    radial-gradient(circle at 18% 16%, rgba(23, 63, 53, .16), transparent 24rem),
    radial-gradient(circle at 82% 8%, rgba(217, 119, 6, .20), transparent 26rem),
    linear-gradient(135deg, #f7efe1 0%, #fffaf1 48%, #edf2ee 100%);
}
.r27-auth-premium::before,
.r27-diagnostic-page::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .42;
  background-image: linear-gradient(rgba(9,17,31,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(9,17,31,.035) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: radial-gradient(circle at 50% 20%, black, transparent 72%);
}
.r27-login-card--premium {
  width: min(980px, calc(100vw - 36px));
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(330px, .78fr);
  gap: clamp(22px, 4vw, 42px);
  align-items: stretch;
  padding: clamp(24px, 4vw, 44px);
  border-radius: 34px;
  background: rgba(255, 252, 245, .88);
  backdrop-filter: blur(18px);
  box-shadow: 0 36px 100px rgba(9, 17, 31, .16), inset 0 1px 0 rgba(255,255,255,.7);
}
.r27-mini-brand {
  display: inline-flex;
  align-items: center;
  color: var(--r27-ink);
  font-weight: 900;
  letter-spacing: -.04em;
  text-decoration: none;
}
.r27-login-intro {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 360px;
}
.r27-login-intro h1 {
  margin: 12px 0 14px;
  max-width: 560px;
  font-size: clamp(3rem, 6vw, 5.25rem);
  line-height: .84;
  letter-spacing: -.085em;
}
.r27-login-copy {
  max-width: 560px;
  color: var(--r27-muted);
  font-size: 1.02rem;
  line-height: 1.55;
}
.r27-login-proof {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: auto;
  padding-top: 24px;
}
.r27-login-proof span,
.r27-lane-eyebrow,
.r27-signal-card span {
  display: inline-flex;
  width: fit-content;
  border: 1px solid rgba(23,63,53,.18);
  border-radius: 999px;
  padding: 7px 10px;
  color: var(--r27-forest);
  background: rgba(255,255,255,.62);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.r27-login-panel {
  display: grid;
  gap: 12px;
  align-content: center;
}
.r27-login-panel .r27-mobile-note {
  margin: 6px 4px 0;
  line-height: 1.45;
}
.r27-auth-premium .r27-lane {
  display: grid;
  gap: 10px;
  padding: 20px;
  border-radius: 26px;
  color: var(--r27-ink);
  text-decoration: none;
  background: linear-gradient(145deg, rgba(255,255,255,.78), rgba(255,250,241,.92));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.r27-auth-premium .r27-lane:hover {
  transform: translateY(-2px);
  border-color: rgba(9,17,31,.24);
  box-shadow: 0 18px 42px rgba(9,17,31,.10);
}
.r27-auth-premium .r27-lane strong {
  font-size: clamp(1.65rem, 3vw, 2.35rem);
  line-height: .92;
  letter-spacing: -.06em;
}
.r27-auth-premium .r27-lane > span:not(.r27-lane-eyebrow) {
  color: var(--r27-muted);
  line-height: 1.42;
}
.r27-auth-premium .r27-lane em {
  display: inline-flex;
  justify-content: center;
  width: fit-content;
  margin-top: 4px;
  border-radius: 999px;
  padding: 11px 14px;
  background: var(--r27-ink);
  color: #fff;
  font-style: normal;
  font-weight: 900;
  font-size: .82rem;
}
.r27-lane--investor em { background: var(--r27-forest); }
.r27-diagnostic-page {
  min-height: 100svh;
  background:
    radial-gradient(circle at 8% 12%, rgba(217,119,6,.18), transparent 26rem),
    radial-gradient(circle at 76% 2%, rgba(23,63,53,.16), transparent 30rem),
    linear-gradient(180deg, #fbf7ef 0%, #f5eee3 48%, #ffffff 100%);
}
.r27-topbar {
  position: relative;
  z-index: 1;
  width: min(1180px, calc(100% - 32px));
  margin: 0 auto;
  padding: 20px 0 0;
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
}
.r27-topbar nav { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.r27-topbar nav a {
  border: 1px solid rgba(9,17,31,.10);
  border-radius: 999px;
  padding: 9px 12px;
  color: var(--r27-ink);
  background: rgba(255,255,255,.55);
  font-weight: 800;
  font-size: .82rem;
  text-decoration: none;
}
.r27-diagnostic-hero { padding: clamp(42px, 6vw, 76px) 0 clamp(28px, 4vw, 48px); }
.r27-diagnostic-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(280px, .44fr);
  gap: clamp(22px, 4vw, 54px);
  align-items: end;
}
.r27-diagnostic-hero h1 {
  max-width: 880px;
  margin: 12px 0 18px;
  font-size: clamp(3.15rem, 7.5vw, 7.2rem);
  line-height: .82;
  letter-spacing: -.09em;
}
.r27-diagnostic-hero p {
  max-width: 680px;
  color: var(--r27-muted);
  font-size: clamp(1.05rem, 1.5vw, 1.28rem);
  line-height: 1.58;
}
.r27-signal-card {
  border: 1px solid rgba(9,17,31,.12);
  border-radius: 30px;
  padding: 22px;
  background: rgba(255,255,255,.68);
  box-shadow: 0 24px 70px rgba(9,17,31,.10);
}
.r27-signal-card strong {
  display: block;
  margin: 16px 0 8px;
  font-family: "Instrument Serif", Georgia, serif;
  font-size: clamp(4rem, 8vw, 7.5rem);
  font-weight: 400;
  line-height: .8;
  letter-spacing: -.06em;
}
.r27-truthbar--diagnostic { position: relative; z-index: 1; }
.r27-diagnostic-grid { padding-top: 24px; }
.r27-card--feature h2 {
  font-size: clamp(2rem, 4vw, 3.5rem);
  line-height: .92;
}
.r27-next-action--premium strong {
  font-size: clamp(1.6rem, 3vw, 2.5rem);
  line-height: .94;
  letter-spacing: -.055em;
}
@media (max-width: 860px) {
  .r27-login-card--premium,
  .r27-diagnostic-hero__grid { grid-template-columns: 1fr; }
  .r27-login-intro { min-height: auto; }
  .r27-login-proof { margin-top: 0; }
  .r27-topbar { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 560px) {
  .r27-auth-premium { padding: 14px; place-items: start center; }
  .r27-login-card--premium { width: 100%; padding: 20px; border-radius: 26px; }
  .r27-login-intro h1,
  .r27-diagnostic-hero h1 { letter-spacing: -.075em; }
  .r27-topbar nav a { font-size: .76rem; padding: 8px 10px; }
}

/* Stable desktop header alignment. */
@media (min-width: 1181px) {
  body.v20d2c-public .site-header--v20d2c .container.bar,
  body.r15-utility-page .site-header--v20d2c .container.bar {
    display: grid !important;
    grid-template-columns: minmax(176px, 1fr) minmax(584px, auto) minmax(260px, 1fr) !important;
    align-items: center !important;
    gap: clamp(16px, 2vw, 32px) !important;
  }

  body.v20d2c-public .site-header--v20d2c .logo--brand,
  body.r15-utility-page .site-header--v20d2c .logo--brand {
    grid-column: 1 !important;
    justify-self: start !important;
    margin-right: 0 !important;
    flex: 0 0 auto !important;
  }

  body.v20d2c-public .site-header--v20d2c .site-header__desktop,
  body.r15-utility-page .site-header--v20d2c .site-header__desktop {
    display: contents !important;
  }

  body.v20d2c-public .site-header--v20d2c .desktop-nav,
  body.r15-utility-page .site-header--v20d2c .desktop-nav {
    grid-column: 2 !important;
    justify-self: center !important;
    display: grid !important;
    grid-template-columns: 82px 112px 110px 96px 78px 88px !important;
    align-items: center !important;
    justify-content: center !important;
    justify-items: center !important;
    gap: 10px !important;
    width: 626px !important;
    min-width: 626px !important;
    max-width: 626px !important;
    transform: none !important;
  }

  body.v20d2c-public .site-header--v20d2c .desktop-nav a,
  body.r15-utility-page .site-header--v20d2c .desktop-nav a,
  body.v20d2c-public .site-header--v20d2c .desktop-nav a.is-active,
  body.v20d2c-public .site-header--v20d2c .desktop-nav a[aria-current="page"],
  body.r15-utility-page .site-header--v20d2c .desktop-nav a.is-active,
  body.r15-utility-page .site-header--v20d2c .desktop-nav a[aria-current="page"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 42px !important;
    padding: 0 !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    white-space: nowrap !important;
    transform: none !important;
    transition: color .16s ease, background-color .16s ease !important;
  }

  body.v20d2c-public .site-header--v20d2c .site-header__utility,
  body.r15-utility-page .site-header--v20d2c .site-header__utility {
    grid-column: 3 !important;
    justify-self: end !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    min-width: 244px !important;
  }
}

@media (min-width: 1181px) and (max-width: 1320px) {
  body.v20d2c-public .site-header--v20d2c .container.bar,
  body.r15-utility-page .site-header--v20d2c .container.bar {
    grid-template-columns: minmax(150px, 1fr) minmax(532px, auto) minmax(220px, 1fr) !important;
    gap: 14px !important;
  }

  body.v20d2c-public .site-header--v20d2c .desktop-nav,
  body.r15-utility-page .site-header--v20d2c .desktop-nav {
    grid-template-columns: 74px 102px 100px 88px 70px 80px !important;
    gap: 8px !important;
    width: 554px !important;
    min-width: 554px !important;
    max-width: 554px !important;
  }

  body.v20d2c-public .site-header--v20d2c .desktop-nav a,
  body.r15-utility-page .site-header--v20d2c .desktop-nav a,
  body.v20d2c-public .site-header--v20d2c .desktop-nav a.is-active,
  body.v20d2c-public .site-header--v20d2c .desktop-nav a[aria-current="page"],
  body.r15-utility-page .site-header--v20d2c .desktop-nav a.is-active,
  body.r15-utility-page .site-header--v20d2c .desktop-nav a[aria-current="page"] {
    font-size: .88rem !important;
  }

  body.v20d2c-public .site-header--v20d2c .site-header__utility,
  body.r15-utility-page .site-header--v20d2c .site-header__utility {
    min-width: 210px !important;
  }
}

/* 2026-05-14 founder mobile/tablet container frame standard.
   Gives subpage containers the same clipped rounded border behavior as the
   approved Commercial Next Step and Use case containers. */
@media (max-width: 1180px) {
  body.v20d2c-public :is(
    .intro-shell,
    .r12-page-hero__summary,
    .r12-commercial-band,
    .r16-commercial-band,
    .r12-usecase-card,
    .r12-band-card,
    .r12-proof-card,
    .r12-exec-card,
    .r12-journey-card,
    .r12-metric-card,
    .r16-step-card,
    .feature-card,
    .page-panel,
    .research-portal-card,
    .research-cluster-card
  ),
  body.r15-utility-page :is(
    .intro-shell,
    .r12-page-hero__summary,
    .r12-commercial-band,
    .r16-commercial-band,
    .r12-usecase-card,
    .r12-band-card,
    .r12-proof-card,
    .r12-exec-card,
    .r12-journey-card,
    .r12-metric-card,
    .r16-step-card,
    .feature-card,
    .page-panel,
    .research-portal-card,
    .research-cluster-card
  ) {
    border-radius: clamp(28px, 5vw, 44px) !important;
    border: 1px solid rgba(141, 201, 213, .24) !important;
    box-shadow:
      inset 0 0 0 1px rgba(255, 255, 255, .045),
      0 18px 46px rgba(7, 18, 36, .18) !important;
    overflow: hidden !important;
  }
}

@media (max-width: 760px) {
  body.v20d2c-public :is(
    .intro-shell,
    .r12-page-hero__summary,
    .r12-commercial-band,
    .r16-commercial-band,
    .r12-usecase-card,
    .r12-band-card,
    .r12-proof-card,
    .r12-exec-card,
    .r12-journey-card,
    .r12-metric-card,
    .r16-step-card,
    .feature-card,
    .page-panel,
    .research-portal-card,
    .research-cluster-card
  ),
  body.r15-utility-page :is(
    .intro-shell,
    .r12-page-hero__summary,
    .r12-commercial-band,
    .r16-commercial-band,
    .r12-usecase-card,
    .r12-band-card,
    .r12-proof-card,
    .r12-exec-card,
    .r12-journey-card,
    .r12-metric-card,
    .r16-step-card,
    .feature-card,
    .page-panel,
    .research-portal-card,
    .research-cluster-card
  ) {
    border-radius: 32px !important;
  }
}