/* ROYAL XPRESS endpoint standard - 2026-08-03.
   Canonical colors: Royal Navy #253069 / Royal Gold #CBA260.
   THE THREE-WAY ENDCAP, copied byte-for-byte from the approved royalai.ai and
   Royal HELOC pages. Geometry, seating and middle-seat home treatment are
   imported, never re-derived.

   🔑 WHY THIS SHEET IS LINKED AFTER grid-law.css AND WHY THAT IS SAFE.
   grid-law.css says it must win on source order. Every rule in grid-law.css
   carries !important, so it wins on cascade ORIGIN weight no matter where it
   sits — source order cannot take a win away from it. This sheet carries no
   !important at all. It is linked last only so that its endcap rules beat
   grid-law.css:229 (.wayhome .homebubble .coin .inner img), which has the same
   specificity and is not important. THE GRID LAW IS NOT WEAKENED BY THIS FILE.

   🚫 The string that names the endcap nav appears in this sheet's selectors and
   nowhere in the page comments, because the endpoint gate asserts it occurs
   exactly once per HTML file. Do not mention it in markup comments. */

.wayhome{display:flex;justify-content:center;align-items:center;width:100%;margin:44px auto 32px;padding:0 20px}
.homebubble{display:inline-flex;align-items:center;justify-content:center;width:var(--hb,56px);text-decoration:none;-webkit-tap-highlight-color:transparent}
.homebubble .coin{max-width:var(--hb,56px)}
.homebubble:hover .coin{transform:translateY(-4px) scale(1.05)}
.homebubble:focus-visible{outline:3px solid var(--gold,#CBA260);outline-offset:6px;border-radius:50%}

.wayhome.journey-actions{display:flex;justify-content:center;align-items:flex-end;flex-wrap:nowrap;gap:clamp(8px,4vw,32px);width:100%;margin-top:48px}
.wayhome.journey-actions .journey-link,
.wayhome.journey-actions .homebubble{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:9px;width:clamp(78px,24vw,98px);color:var(--navy,#253069);text-decoration:none;-webkit-tap-highlight-color:transparent}
.wayhome.journey-actions .journey-link .coin,
.wayhome.journey-actions .homebubble .coin{width:88px;height:88px;max-width:88px;flex:none}
.wayhome.journey-actions .journey-link .coin .inner img{display:block;width:61%;height:61%;object-fit:contain}
.wayhome.journey-actions .journey-link b,
.wayhome.journey-actions .homebubble b{font-size:10px;line-height:1.25;letter-spacing:.04em;text-align:center;color:var(--navy,#253069)}
.wayhome.journey-actions .homebubble{transform:translateY(12px)}
.wayhome.journey-actions a:focus-visible{outline:3px solid var(--gold,#CBA260);outline-offset:6px;border-radius:16px}

/* Self-contained coin so the endcap renders no matter which base sheet the
   page loads. THE CANON COIN GRADIENT IS LITERAL: the 52% stop is #c9a15f,
   the coin's own material, and it never rides --gold.
   THE SEATING LAW: medallion 68% of the coin, mark 59% of the medallion. */
.wayhome.journey-actions .coin{position:relative;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle at 32% 24%,#fdf6e3 0%,#f5e2b4 16%,#e2c283 34%,#c9a15f 52%,#a5814a 70%,#7d6238 86%,#6a5330 100%);box-shadow:0 10px 24px rgba(21,27,60,.22),inset 0 2px 6px rgba(255,255,255,.65),inset 0 -6px 12px rgba(90,66,30,.45);transition:transform .18s ease,box-shadow .18s ease}
.wayhome.journey-actions .coin::after{content:"";position:absolute;inset:0;border-radius:50%;background:linear-gradient(135deg,rgba(255,255,255,.55) 0%,rgba(255,255,255,0) 38%,rgba(255,255,255,0) 62%,rgba(255,255,255,.28) 100%);pointer-events:none}
.wayhome.journey-actions .coin .inner{width:68%;height:68%;display:grid;place-items:center;border-radius:50%;overflow:hidden;background:rgba(255,255,255,.92);box-shadow:inset 0 1px 4px rgba(90,66,30,.35)}
.wayhome.journey-actions .coin .inner img,
.wayhome.journey-actions .coin .inner svg{position:relative;z-index:1;max-width:59%;max-height:59%;width:auto;height:auto;display:block}
.wayhome.journey-actions .coin .inner svg{fill:var(--navy,#253069)}
.wayhome.journey-actions .coin .inner svg .gold{fill:var(--gold,#CBA260)}
.wayhome.journey-actions a:hover .coin{transform:translateY(-4px) scale(1.04)}

@media(max-width:390px){
  .wayhome.journey-actions .journey-link .coin{width:74px;height:74px;max-width:74px}
  .wayhome.journey-actions .homebubble .coin{width:84px;height:84px;max-width:84px}
  .wayhome.journey-actions .journey-link b,
  .wayhome.journey-actions .homebubble b{font-size:9px}
}
@media(prefers-reduced-motion:reduce){
  .wayhome.journey-actions a:hover .coin{transform:none}
  .homebubble:hover .coin{transform:none}
}


/* FINAL OWNER NAVIGATION LAW · 2026-08-03.
   Covers/funnel layers: Home only. True endpoints: one measured equilateral
   triangle whose centres are exactly 120px apart—bare 44px Sonny at (122,22),
   Home at (62,126), and Royal Mortgage at (182,126). */
.royal-home-only{display:flex;justify-content:center;width:100%;margin:48px auto 32px;padding:0 20px;box-sizing:border-box}
.royal-home-only .homebubble{display:block;text-decoration:none}
.royal-home-only .coin{width:88px!important;height:88px!important;max-width:88px!important}
.royal-endpoint-triangle{position:relative;width:244px;height:188px;margin:48px auto 32px;box-sizing:border-box}
.royal-endpoint-triangle *{box-sizing:border-box}
.royal-endpoint-triangle>a{position:absolute;display:block;text-decoration:none;-webkit-tap-highlight-color:transparent}
.royal-endpoint-rover{left:100px;top:0;width:44px;height:44px;border-radius:50%}
.royal-endpoint-sonny{display:block;width:44px;height:44px;border-radius:50%;
  background:radial-gradient(circle at 32% 26%,#fdf6e3 0%,#f0d9a6 22%,#d5b271 45%,#ab854a 70%,#7d6238 100%);
  box-shadow:0 5px 13px rgba(21,27,60,.23),inset 0 2px 5px rgba(255,255,255,.62),inset 0 -4px 9px rgba(90,66,30,.38);
  transition:transform .18s ease,background .18s ease}
.royal-endpoint-rover:hover .royal-endpoint-sonny,
.royal-endpoint-rover:focus-visible .royal-endpoint-sonny,
.royal-endpoint-rover:active .royal-endpoint-sonny{
  transform:scale(1.06);
  background:radial-gradient(circle at 32% 26%,#C6CAD8 0%,#6E78A6 10%,#394476 24%,#1C254F 48%,#171C3E 72%,#0E1024 100%)}
.royal-endpoint-home{left:18px;top:82px;width:88px;height:88px}
.royal-endpoint-royal{left:138px;top:82px;width:88px;height:88px}
.royal-endpoint-triangle .coin,
.royal-home-only .coin{position:relative;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle at 32% 24%,#fdf6e3 0%,#f5e2b4 16%,#e2c283 34%,#c9a15f 52%,#a5814a 70%,#7d6238 86%,#6a5330 100%);
  box-shadow:0 8px 18px rgba(21,27,60,.20),inset 0 2px 6px rgba(255,255,255,.65),inset 0 -6px 12px rgba(90,66,30,.45)}
.royal-endpoint-triangle .coin{width:88px!important;height:88px!important;max-width:88px!important}
.royal-endpoint-triangle .coin::after,.royal-home-only .coin::after{content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none;background:linear-gradient(135deg,rgba(255,255,255,.55) 0%,rgba(255,255,255,0) 38%,rgba(255,255,255,0) 62%,rgba(255,255,255,.28) 100%)}
.royal-endpoint-triangle .coin .inner,.royal-home-only .coin .inner{width:68%;height:68%;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.92);box-shadow:inset 0 1px 4px rgba(90,66,30,.35)}
.royal-endpoint-triangle .coin .inner img,.royal-home-only .coin .inner img{position:relative;z-index:1;max-width:59%;max-height:59%;width:auto;height:auto;display:block}
.royal-endpoint-triangle>a:focus-visible,.royal-home-only a:focus-visible{outline:3px solid #CBA260;outline-offset:6px;border-radius:50%}
.royal-endpoint-triangle>a:hover .coin,.royal-home-only a:hover .coin{transform:translateY(-3px) scale(1.03)}
@media(prefers-reduced-motion:reduce){
  .royal-endpoint-triangle>a:hover .coin,.royal-home-only a:hover .coin,.royal-endpoint-sonny{transition:none;transform:none}
}