/* Homepage layout boundary — FULL-BLEED (2026-09-05, supersedes the centered
   v1 of the same day). Loaded LAST and scoped to body.orpho-home, so nothing
   here reaches the 47 other pages that share index.css, and nothing in
   index.css can undo it on specificity.

   Contract:
   * The FRAME goes to the rail. Section grounds, cards, the header row, the
     hero grid and the footer run from --orpho-rail to --orpho-rail at every
     width. Nothing on this page is centred inside an invisible column.
   * COPY keeps a measure. Body text inside those frames is capped in `ch`, so
     the page stays readable at 2560px instead of running 140-character lines.
   * This sheet declares NO grid-template-columns for .orpho-hero__inner,
     .orpho-sample__grid or .orpho-pair. Their columns — and the phone collapse
     in orpho-home.css's TERMINAL BLOCK — stay authoritative. Pinned by
     tests/test_home_layout_fullbleed.py.
   * No `transform` on any ancestor of #hero-envelope (it flattens the
     envelope/receipt z-stack). No `100vw` (includes the scrollbar). No
     overflow-x:hidden on html/body (it kills #sticky-status mid-anchor).
   * Colours, radii, durations come from orpho-tokens.css only.
   * Phase C ornament (corners, ledger ground, connector) is the last block. */

.orpho-home { --orpho-rail: clamp(1rem, 4vw, 4.5rem); }

/* ── Header: one row, brand at the left rail, navigation at the right.
 * Scrolls away with the page (legacy index.css makes it sticky). */
.orpho-home > header.orpho-header.nav {
  position: relative; top: auto; z-index: 2;
  display: flex; flex-direction: row; align-items: center;
  justify-content: space-between; gap: var(--orpho-s-6);
  width: 100%; max-width: none; margin: 0;
  padding: var(--orpho-s-5) var(--orpho-rail);
  backdrop-filter: none; -webkit-backdrop-filter: none;
}
.orpho-home header.nav .brand { margin: 0; flex: 0 0 auto; }
.orpho-home header.nav .orpho-nav {
  margin: 0 0 0 auto; min-width: 0;
  flex-wrap: wrap; justify-content: flex-end;
  gap: var(--orpho-s-3) var(--orpho-s-4);
}
/* Eleven items need 975px in one row; the rail leaves 985px at 1440 and
 * 838px at 1280 (measured), so the CTA fell to a second row. Below 1500px
 * the Agents and Guides links step aside — the three doors carry the same
 * routes, which is orpho-home.css's own rationale at 1200 — and link
 * padding tightens. Measured after: 791px needed at 1280. */
@media (max-width: 1600px) {
  .orpho-home header.nav .orpho-nav { gap: var(--orpho-s-2); }
}
@media (max-width: 1500px) {
  .orpho-home .orpho-nav .nav-agents,
  .orpho-home .orpho-nav .nav-guides { display: none; }
  .orpho-home header.nav .orpho-nav a:not(.cta) { padding-left: var(--orpho-s-2); padding-right: var(--orpho-s-2); }
}
.orpho-home header.nav .orpho-nav a { white-space: nowrap; }

/* ── Hero: the asymmetric two-column grid from orpho-home.css, released from
 * its 1180px cage. Columns are NOT declared here (see contract). */
.orpho-home .orpho-hero.hero {
  padding-left: var(--orpho-rail);
  padding-right: var(--orpho-rail);
  text-align: left;
}
.orpho-home .orpho-hero__inner {
  display: grid;
  width: 100%; max-width: none; margin: 0;
}
.orpho-home .orpho-hero .orpho-hero__lede,
.orpho-home .orpho-hero .orpho-hero__copy { text-align: left; }
.orpho-home .orpho-hero__lede { min-width: 0; }
/* Legacy `.hero h1 { margin: 0 auto; max-width: 18ch }` is what kept the
 * headline centred even after the grid moved. Two classes beat it here. */
.orpho-home .orpho-hero-title { max-width: none; margin-inline: 0; }
.orpho-home .orpho-hero__copy { max-width: 60ch; margin-inline: 0; }
.orpho-home .orpho-hero .orpho-hero__actions { justify-content: flex-start; }
.orpho-home .orpho-hero__lede > .orpho-rule { margin-inline: 0; }
.orpho-home #hero-envelope { min-width: 0; }
/* The drifting engraved crest stays static: less per-frame work for every
 * visitor, and the probe measures a settled page. It still bleeds off the
 * left edge exactly where orpho-home.css puts it. */
.orpho-home .orpho-ornament { animation: none; }

/* ── Bare wraps: content flush to the rail. */
.orpho-home .orpho-doors-wrap,
.orpho-home .orpho-situations-wrap,
.orpho-home .orpho-pair {
  width: 100%; max-width: none; margin-inline: 0;
  padding-left: var(--orpho-rail); padding-right: var(--orpho-rail);
}
.orpho-home .orpho-pair > section { min-width: 0; max-width: none; }
.orpho-home .orpho-hiw__inner { max-width: none; margin-inline: 0; }

/* ── Cards: the border sits on the rail; their own inner padding stays. */
.orpho-home .orpho-features-wrap,
.orpho-home .orpho-arch {
  max-width: none; margin-inline: var(--orpho-rail);
}
.orpho-home .orpho-arch { text-align: left; }
.orpho-home .orpho-arch__layers { margin-inline: 0; }

/* ── Legacy `.wrap` (instrument, trust, gateways, final CTA, footer):
 * 1200px cage → rail. (0,2,0) beats every `.wrap` rule in index.css. */
.orpho-home .wrap {
  max-width: none; margin-inline: 0;
  padding-left: var(--orpho-rail); padding-right: var(--orpho-rail);
}
/* The drop target is a bounded well anchored at the left rail — a rail-to-
 * rail dashed box reads as a page border, not a target. */
.orpho-home .action-card--solo {
  margin-inline: 0;
  max-width: clamp(40rem, 60%, 60rem);
}
.orpho-home .trust-cols { max-width: none; margin-inline: 0; }
.orpho-home .after-tiers {
  max-width: none; margin-inline: 0; text-align: left;
  padding-left: var(--orpho-rail); padding-right: var(--orpho-rail);
}
.orpho-home .foot-cta { text-align: left; padding-left: 0; padding-right: 0; }
.orpho-home footer.site .footer-top,
.orpho-home footer.site .footer-bottom { justify-content: space-between; flex-wrap: wrap; }

/* ── Measures: what the rail releases, the `ch` cap keeps readable. */
.orpho-home .orpho-door__body,
.orpho-home .orpho-step__body,
.orpho-home .trust-col p,
.orpho-home .gateway p,
.orpho-home .orpho-arch__note { max-width: 46ch; }
.orpho-home .after-tiers > p,
.orpho-home .orpho-situations__more { max-width: 72ch; }

/* ── Robustness carried over from v1 (unrelated to centring). */
.orpho-home .orpho-door { min-width: 0; }
.orpho-home .orpho-door__cta { max-width: 100%; white-space: normal; }
.orpho-home .orpho-door__body { width: 100%; overflow-wrap: anywhere; }
.orpho-home :is(.orpho-btn, .cta, .gateway) { max-width: 100%; }
.orpho-home .orpho-receipt__meta dd { min-width: 0; overflow-wrap: anywhere; }
.orpho-home .orpho-sample__grid { min-width: 0; }
.orpho-home .orpho-sample__grid > * { min-width: 0; }

@media (max-width: 680px) {
  .orpho-home > header.orpho-header.nav { gap: var(--orpho-s-4); }
  .orpho-home header.nav .orpho-nav { justify-content: flex-start; }
  .orpho-home .orpho-brand__name { font-size: clamp(1.15rem, 6vw, 1.85rem); }
  .orpho-home .orpho-brand__sub { font-size: .6rem; letter-spacing: .16em; }
  .orpho-home header.nav .brand { gap: var(--orpho-s-3); }
  .orpho-home .orpho-hero__copy br { display: none; }
  .orpho-home .action-card--solo { max-width: none; }
  .orpho-home #hero-envelope .orpho-receipt__title {
    font-size: clamp(.65rem, 3.5vw, .94rem); letter-spacing: .12em;
  }
  .orpho-home footer.site .cols { grid-template-columns: 1fr; }
}

/* ══ Phase C — ornament at the edges (2026-09-05, founder lifted the gate) ══
 * Everything below is decorative and lives in the hero's padding band or
 * beneath the hero grid: nothing here moves the lede, the plate or the
 * buttons, and nothing takes a pointer. Above 1040px only — the one-column
 * hero has no corners to speak of.
 *
 * C2/C3 · ledger rules + edge fade. ONE pseudo-element, two background
 *   layers. body.orpho::before already paints the paper grain, so a second
 *   noise texture would double it; faint horizontal ledger rules give the
 *   hero a ruled-page ground instead, and the paper deepens toward both
 *   edges the way a sheet does under a lamp. z 0, under .orpho-hero__inner
 *   (z 1). Colours: tokens only.
 * C1 · corners. Four <li> in the hero's four corners, in the padding band,
 *   so they cannot collide with the grid by construction (the probe still
 *   measures it). Each has a 1px gold hairline through the rail to the edge.
 * C4 · connector. A hairline from behind the envelope to the right edge, a
 *   block glyph half off the edge (clipped by the hero's overflow:hidden),
 *   one gold point travelling it on the --orpho-m-float clock. No transform
 *   anywhere on an ancestor of #hero-envelope; the dot animates `left`. */
/* Base state is HIDDEN (2026-09-07 review). The ornament used to be styled
 * only inside `@media (min-width: 1041px)` and hidden only inside
 * `@media (max-width: 1040px)`: an exclusive PAIR, so the breakpoint was
 * written twice and the band between the two literals was covered by
 * neither rule. Hiding by default and unlocking once leaves one literal in
 * this sheet and no uncovered width. */
.orpho-home .orpho-corners,
.orpho-home .orpho-connector { display: none; }

@media (min-width: 1041px) {
  .orpho-home .orpho-corners,
  .orpho-home .orpho-connector { display: block; }

  .orpho-home .orpho-hero.hero {
    padding-top: calc(var(--orpho-s-8) + var(--orpho-s-4));
    padding-bottom: calc(var(--orpho-s-8) + var(--orpho-s-4));
  }
  .orpho-home .orpho-hero::before {
    content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
    background:
      linear-gradient(to right, var(--orpho-paper-deep), transparent 14%, transparent 86%, var(--orpho-paper-deep)),
      repeating-linear-gradient(to bottom, transparent 0, transparent calc(2.25rem - 1px), var(--orpho-hairline) calc(2.25rem - 1px), var(--orpho-hairline) 2.25rem);
    mix-blend-mode: multiply;
    opacity: .55;
  }

  .orpho-home .orpho-corners {
    list-style: none; margin: 0; padding: 0;
    position: absolute; inset: 0; z-index: 1; pointer-events: none;
  }
  .orpho-home .orpho-corner {
    position: absolute; margin: 0; max-width: 15rem;
    font-size: .8rem; line-height: 1.5; color: var(--orpho-ink-faint);
  }
  .orpho-home .orpho-corner strong {
    display: block; margin-bottom: var(--orpho-s-1);
    font-size: .66rem; font-weight: 600; letter-spacing: var(--orpho-track-cap);
    text-transform: uppercase; color: var(--orpho-gold-deep);
  }
  .orpho-home .orpho-corner--tl, .orpho-home .orpho-corner--bl { left: var(--orpho-rail); text-align: left; }
  .orpho-home .orpho-corner--tr, .orpho-home .orpho-corner--br { right: var(--orpho-rail); text-align: right; }
  .orpho-home .orpho-corner--tl, .orpho-home .orpho-corner--tr { top: var(--orpho-s-4); }
  .orpho-home .orpho-corner--bl, .orpho-home .orpho-corner--br { bottom: var(--orpho-s-4); }
  /* The hairline: from the corner's far edge, through the rail, to the viewport edge. */
  .orpho-home .orpho-corner::after {
    content: ""; position: absolute; top: -.6rem; height: 1px;
    width: calc(100% + var(--orpho-rail));
  }
  .orpho-home .orpho-corner--tl::after, .orpho-home .orpho-corner--bl::after {
    left: calc(-1 * var(--orpho-rail));
    background: linear-gradient(to right, var(--orpho-gold), var(--orpho-gold) 40%, transparent);
  }
  .orpho-home .orpho-corner--tr::after, .orpho-home .orpho-corner--br::after {
    right: calc(-1 * var(--orpho-rail));
    background: linear-gradient(to left, var(--orpho-gold), var(--orpho-gold) 40%, transparent);
  }

  .orpho-home .orpho-connector {
    position: absolute; right: 0; top: 50%; z-index: 0; pointer-events: none;
    width: calc(var(--orpho-rail) + 18vw); height: 1px;
    background: linear-gradient(to right, transparent, var(--orpho-gold) 30%, var(--orpho-gold));
  }
  .orpho-home .orpho-connector__block {
    position: absolute; right: -.6rem; top: -.6rem;
    width: 1.2rem; height: 1.2rem; box-sizing: border-box;
    border: 1px solid var(--orpho-gold);
    background: var(--orpho-paper-lit);
    box-shadow: inset 0 0 0 3px var(--orpho-paper-lit), inset 0 0 0 4px var(--orpho-gold-deep);
  }
  .orpho-home .orpho-connector__dot {
    position: absolute; top: -.2rem; left: 0;
    width: .4rem; height: .4rem; border-radius: 50%;
    background: var(--orpho-gold);
    box-shadow: 0 0 0 2px var(--orpho-paper-lit);
    animation: orpho-connector-travel var(--orpho-m-float) var(--orpho-ease) infinite;
  }
}
@keyframes orpho-connector-travel {
  0%   { left: 0; opacity: 0; }
  12%  { opacity: 1; }
  88%  { opacity: 1; }
  100% { left: calc(100% - 1rem); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .orpho-home .orpho-connector__dot { animation: none; left: calc(100% - 1rem); opacity: 1; }
}
