/* Shared styling for the small standalone pages (404, legal, support).
   Same tokens as index.html: Redigi palette and type, because Hey Rova runs
   on Redigi Tech. Nothing bolder than Medium; never white on dark. */
:root{
  --core:#263238; --charcoal:#45565B; --green:#2E7D6A; --green-light:#3E9E84;
  --rust:#C28E5C; --sand:#F6F3ED; --mist:#C7D0D0; --ash:#9FA9A9;
  --font-head:'Jost',sans-serif; --font-body:'Outfit',system-ui,sans-serif;
  --hairline:rgba(159,169,169,.18);
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--font-body);font-weight:300;background:var(--core);color:var(--mist);line-height:1.65;
  min-height:100vh;display:flex;flex-direction:column}
b,strong,h1,h2,h3{font-weight:500}
a{color:var(--green-light);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:3px}
.wrap{max-width:720px;margin:0 auto;padding:0 40px;width:100%}

header{padding:26px 0}
/* The real Hey Rova artwork as a mask filled with Mist, same as the home page.
   This replaces a hand-drawn bubble that was never the real mark. */
.lockup{display:block;width:129.5px;height:51.8px;background:url("/brand/HeyRova_Logo-OnDark-1000.png") no-repeat left center/contain}
.lockup:hover{text-decoration:none}

main{flex:1;padding:64px 0 88px}
.kicker{font-family:var(--font-head);font-weight:400;text-transform:uppercase;letter-spacing:.35em;
  font-size:12px;color:var(--green-light);margin-bottom:18px}
h1{font-family:var(--font-head);font-weight:300;font-size:clamp(30px,4.6vw,40px);letter-spacing:.01em;
  color:var(--mist);line-height:1.2;margin-bottom:22px}
p{font-size:16.5px;color:var(--mist);margin-bottom:18px}
p.muted{color:var(--ash);font-size:15.5px}
h2{font-family:var(--font-head);font-weight:400;font-size:21px;color:var(--mist);margin:36px 0 12px}
ul{margin:0 0 18px 20px}
li{font-size:16px;color:var(--mist);margin-bottom:9px}
.btn{font-family:var(--font-body);font-weight:500;font-size:15px;letter-spacing:.04em;border-radius:8px;
  padding:13px 28px;display:inline-block;background:var(--green);color:var(--sand);margin-top:12px}
.btn:hover{text-decoration:none;filter:brightness(1.08)}
.note{border-left:2px solid var(--rust);padding:4px 0 4px 22px;margin:28px 0}
.note p{color:var(--ash);font-size:15.5px;margin-bottom:0}

footer{border-top:1px solid var(--hairline);padding:34px 0 44px}
footer .wrap{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.legal{font-size:12.5px;color:var(--ash)}
.flinks{display:flex;gap:20px;flex-wrap:wrap;margin-top:12px}
.flinks a{font-size:12.5px;color:var(--ash);text-decoration:none}
.flinks a:hover{color:var(--green-light);text-decoration:underline;text-underline-offset:3px}
.powered{display:flex;align-items:center;gap:10px}
.powered img{height:22px;width:22px;display:block;flex:none}
/* Sentence case, as the Studio sets it. Never uppercased. */
.powered .attr{font-size:11px;letter-spacing:.06em;color:var(--ash);margin-bottom:0}
@media(max-width:700px){
  .wrap{padding:0 24px}
}