/* ROYAL Ai endpoint standard - 2026-08-03.
   The approved Claude-built layers remain the visual source of truth. This
   sheet changes only the shared shell around the endpoint tools. */

.hh-header{width:min(760px,100%);padding-top:16px}
.hh-header-row{position:relative;justify-content:center}
.hh-back{justify-content:center;text-align:center;letter-spacing:.02em}
.hh-connection{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.hh-brand{width:min(430px,82vw);margin:17px auto 5px}
.royal-endpoint-slogan{margin:0 auto 29px;color:var(--muted);font-size:clamp(14.5px,2.2vw,17.5px);font-weight:600;line-height:1.5;text-align:center}
.royal-endpoint-slogan strong{color:var(--gold-deep);font-weight:700}
.hh-ask{box-shadow:0 12px 34px rgba(21,43,107,.12)}
.hh-ask button{background:radial-gradient(circle at 32% 24%,#fdf6e3 0%,#f5e2b4 16%,#e2c283 34%,#cba260 52%,#a5814a 70%,#7d6238 86%,#6a5330 100%);box-shadow:0 6px 14px rgba(21,27,60,.2),inset 0 2px 5px rgba(255,255,255,.62),inset 0 -4px 9px rgba(90,66,30,.38)}
.hh-ask svg{stroke:var(--navy)}
.hh-context{margin-top:28px}

/* The same gold sphere treatment as the approved preceding layers. */
.hh-door-nav{gap:10px}
.hh-door-link{gap:8px;padding:6px 2px;background:transparent!important;color:var(--navy)}
.hh-door-link[aria-current="page"]{background:transparent!important}
.hh-mini-coin{width:68px;height:68px;box-shadow:0 9px 22px rgba(21,27,60,.2),inset 0 2px 6px rgba(255,255,255,.65),inset 0 -6px 12px rgba(90,66,30,.43)}
.hh-mini-coin::after{inset:16%}
.hh-mini-coin svg{width:29px;height:29px}

/* Always One Tap stays functional, but it now looks like the same bubble
   family instead of a row of generic cards. */
.hh-utility{min-height:116px;gap:9px;border:0;border-radius:0;background:transparent;box-shadow:none;padding:4px 2px}
.hh-utility:hover{background:transparent}
.hh-utility>span:first-child{width:72px;height:72px;display:grid;place-items:center;position:relative;border-radius:50%;background:radial-gradient(circle at 32% 24%,#fdf6e3 0%,#f5e2b4 16%,#e2c283 34%,#cba260 52%,#a5814a 70%,#7d6238 86%,#6a5330 100%);box-shadow:0 9px 22px rgba(21,27,60,.2),inset 0 2px 6px rgba(255,255,255,.65),inset 0 -5px 10px rgba(90,66,30,.42);transition:transform .18s ease,box-shadow .18s ease}
.hh-utility>span:first-child::before{content:"";position:absolute;inset:16%;border-radius:50%;background:rgba(255,255,255,.94);box-shadow:inset 0 1px 3px rgba(90,66,30,.32)}
.hh-utility>span:first-child svg{position:relative;z-index:1;width:29px;height:29px}
.hh-utility:hover>span:first-child{transform:translateY(-4px) scale(1.04);box-shadow:0 13px 27px rgba(21,27,60,.24),inset 0 2px 6px rgba(255,255,255,.65),inset 0 -5px 10px rgba(90,66,30,.42)}

/* THE THREE-WAY ENDCAP. The geometry and middle-seat home treatment are
   copied from the approved Royal HELOC pages. */
.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}

@media(max-width:600px){
  .hh-header{padding-top:10px}
  .hh-header-row{align-items:center}
  .hh-brand{width:min(330px,84vw);margin-top:10px}
  .royal-endpoint-slogan{margin-bottom:24px;font-size:14px}
  .hh-mini-coin{width:58px;height:58px}
  .hh-mini-coin svg{width:25px;height:25px}
  .hh-utility>span:first-child{width:64px;height:64px}
  .hh-utility{min-height:104px}
}
@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){
  .hh-utility:hover>span:first-child{transform:none}
}

/* ============================================================================
   THE ENDCAP TRAVELS — 2026-08-03 (FE-6, Bryan's R-5: "a fixed footer row of
   three at the bottom of every page, same order, same coordinates, every page,
   every site").

   ADDITIVE ONLY. Nothing above this line was changed.

   WHY THIS BLOCK EXISTS. The rules above assume the page already loads
   css/royal.css, which is where .coin / .coin .inner / .wayhome live. Only six
   royalai.ai pages load that sheet. The front-door layer (start · stand ·
   ready · door · x · credit) loads _royal-system/royal-system.css, which spells
   the medallion .coin-inner and has no .inner rule at all; 404 · offline ·
   get · precision-pricing · royal-daylight · estimate-portal · portal load no
   coin sheet whatsoever. Without this block those pages render the endcap as
   three bare links with no gold sphere — a broken-looking rail, which is worse
   than no rail.

   Every value here is BYTE-COPIED out of royalai.ai/css/royal.css:164-188 —
   the same gradient (#c9a15f at 52%, pinned there deliberately and never
   var(--gold)), the same three-part box-shadow, the same 68% / 59% SEATING LAW.
   It is therefore a no-op on the pages that already have royal.css: identical
   declarations, identical computed values, so house-hunting · renovating ·
   investing · retiring-at-home do not move a pixel. Only the pages that were
   missing the base gain anything.

   Scoped under .wayhome.journey-actions so it can never reach a coin anywhere
   else on the page. Sizing is deliberately NOT restated — the 88px rule above
   already owns it and is more specific.
   Companion sheet: royalheloc.ai/css/royal-endpoint.css, which carries the
   same fallback for the HELOC tree. */
.wayhome.journey-actions{margin-left:auto;margin-right:auto;margin-bottom:32px;
  padding:0 20px;box-sizing:border-box}
.wayhome.journey-actions *{box-sizing:border-box}
.wayhome.journey-actions .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);
  transition:transform .16s ease, box-shadow .16s ease}
.wayhome.journey-actions .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%)}
.wayhome.journey-actions .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)}
.wayhome.journey-actions .coin .inner svg{position:relative;z-index:1;
  width:59%;height:59%;display:block;fill:var(--navy,#253069);stroke:none}
.wayhome.journey-actions .coin .inner svg .gold{fill:var(--gold,#CBA260)}
.wayhome.journey-actions .coin .inner img{position:relative;z-index:1;
  max-width:59%;max-height:59%;width:auto;height:auto;display:block}
.wayhome.journey-actions a:hover .coin{transform:translateY(-4px) scale(1.04)}
@media(prefers-reduced-motion:reduce){
  .wayhome.journey-actions a: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);
  transform-origin:center;transition:transform .26s ease-out,opacity .22s ease,background .22s 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)}
.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}
}

/* ENDPOINT ROVER · one chat above the triangle; one stateful Sonny below it.
   Blue uses the filed clean sphere. Listening and speaking are the same
   brighter-gold body at 2×, distinguished only by their motion/shape. */
.royal-endpoint-rover[data-rover-state="awake"] .royal-endpoint-sonny,
.royal-endpoint-rover[data-rover-state="thinking"] .royal-endpoint-sonny{
  background:#111936 url('../assets/sonny_blue_128.png') center/100% 100% no-repeat;
  box-shadow:0 6px 15px rgba(21,27,60,.31)}
@keyframes royal-endpoint-think{0%,100%{opacity:.62}50%{opacity:.88}}
.royal-endpoint-rover[data-rover-state="thinking"] .royal-endpoint-sonny{animation:royal-endpoint-think 1.6s ease-in-out infinite}
.royal-endpoint-rover[data-rover-state="listening"] .royal-endpoint-sonny,
.royal-endpoint-rover[data-rover-state="speaking"] .royal-endpoint-sonny{
  background:radial-gradient(circle at 32% 26%,#fdf6e3 0%,#f5e1ad 20%,#ddb96f 45%,#b88a42 70%,#82602d 100%);
  box-shadow:0 9px 24px rgba(21,27,60,.28),inset 0 3px 7px rgba(255,255,255,.72),inset 0 -7px 14px rgba(90,66,30,.42)}
@keyframes royal-endpoint-listen{0%,100%{transform:scale(1.92)}50%{transform:scale(2.06)}}
@keyframes royal-endpoint-speak{0%,100%{transform:scale(2)}35%{transform:scale(2.12,1.88)}70%{transform:scale(1.92,2.08)}}
.royal-endpoint-rover[data-rover-state="listening"] .royal-endpoint-sonny{animation:royal-endpoint-listen 1.15s ease-in-out infinite}
.royal-endpoint-rover[data-rover-state="speaking"] .royal-endpoint-sonny{animation:royal-endpoint-speak .48s ease-in-out infinite}

.royal-endpoint-chat[hidden]{display:none!important}
.royal-endpoint-chat{width:min(440px,calc(100% - 32px));margin:46px auto -30px;padding:18px;border:1px solid rgba(203,162,96,.48);border-radius:24px;background:#fff;box-shadow:0 18px 46px rgba(21,27,60,.15);box-sizing:border-box}
.royal-endpoint-chat *{box-sizing:border-box}
.royal-endpoint-chat-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px}
.royal-endpoint-chat-head>div{display:flex;flex-direction:column;gap:2px;color:#253069}
.royal-endpoint-chat-head b{font-size:17px;line-height:1.2}
.royal-endpoint-chat-head span{color:#68708A;font-size:10px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.royal-endpoint-chat-close,.royal-endpoint-chat-send{display:grid;place-items:center;flex:none;padding:0;border:0;border-radius:50%;color:#253069;cursor:pointer;background:radial-gradient(circle at 32% 24%,#fdf6e3 0%,#f5e2b4 16%,#e2c283 34%,#c9a15f 52%,#a5814a 70%,#7d6238 86%,#6a5330 100%);box-shadow:0 5px 12px rgba(21,27,60,.2),inset 0 2px 5px rgba(255,255,255,.65),inset 0 -4px 8px rgba(90,66,30,.4)}
.royal-endpoint-chat-close{width:36px;height:36px}
.royal-endpoint-chat-send{width:44px;height:44px}
.royal-endpoint-chat-close svg{width:17px;height:17px}
.royal-endpoint-chat-send svg{width:21px;height:21px}
.royal-endpoint-chat-close path,.royal-endpoint-chat-send path{fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.royal-endpoint-chat-close:focus-visible,.royal-endpoint-chat-send:focus-visible{outline:3px solid #253069;outline-offset:3px}
.royal-endpoint-chat-log{display:flex;flex-direction:column;gap:8px;max-height:190px;overflow:auto;scrollbar-gutter:stable;margin:0 0 12px}
.royal-endpoint-message{max-width:88%;margin:0;padding:10px 12px;border-radius:16px;color:#253069;font-size:13px;font-weight:600;line-height:1.5}
.royal-endpoint-message--you{align-self:flex-end;background:#253069;color:#fff;border-bottom-right-radius:5px}
.royal-endpoint-message--rover{align-self:flex-start;background:#F7F3EA;border:1px solid rgba(203,162,96,.34);border-bottom-left-radius:5px}
.royal-endpoint-chat-form{display:grid;grid-template-columns:minmax(0,1fr) 44px;align-items:center;gap:8px;padding:5px 5px 5px 16px;border:1px solid rgba(37,48,105,.18);border-radius:999px;background:#fff;box-shadow:0 8px 22px rgba(21,27,60,.08)}
.royal-endpoint-chat-form .sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.royal-endpoint-chat-form input{min-width:0;width:100%;border:0;outline:0;background:transparent;color:#253069;font:600 14px/1.4 Montserrat,Arial,sans-serif}
.royal-endpoint-chat-form input::placeholder{color:#7B8198}
@media(max-width:520px){
  .royal-endpoint-chat{margin-top:38px;padding:15px;border-radius:20px}
  .royal-endpoint-chat-log{max-height:160px}
}
@media(prefers-reduced-motion:reduce){
  .royal-endpoint-rover[data-rover-state="thinking"] .royal-endpoint-sonny{animation:none;opacity:.72}
  .royal-endpoint-rover[data-rover-state="listening"] .royal-endpoint-sonny{animation:none;transform:scale(2)}
  .royal-endpoint-rover[data-rover-state="speaking"] .royal-endpoint-sonny{animation:none;transform:scale(2,1.9)}
}