/* Shared site chrome: header, phone menu and footer.
   Own class names (rh-) and own colour names (--rh-), so it also sits cleanly on the VERA page,
   which keeps Reference 1's styles. */
:root{
  --rh-navy:#0B1F52;--rh-navy-2:#0F2766;--rh-navy-3:#17317A;--rh-navy-deep:#081840;
  --rh-pale:#F6F5F1;--rh-pale-3:#E1DED4;--rh-ink-2:#3E4A6E;--rh-ink-3:#5A6585;
  --rh-on-2:#C9CDDA;--rh-on-3:#A3AAC0;--rh-line:rgba(11,31,82,.12);--rh-line-d:rgba(246,245,241,.16);
  --rh-font:"Inter Tight",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --rh-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --rh-h:76px;--rh-gutter:20px;--rh-max:1320px;
  --rh-ease:cubic-bezier(.2,.8,.2,1);
}
@media (min-width:640px){:root{--rh-gutter:32px}}
@media (min-width:1024px){:root{--rh-gutter:40px}}
.rh-wrap{width:min(var(--rh-max),100% - 2 * var(--rh-gutter));margin-inline:auto}
.rh-skip{position:fixed;left:16px;top:-80px;z-index:300;background:var(--rh-navy);color:var(--rh-pale);padding:12px 18px;border-radius:10px;font:500 .9375rem var(--rh-font);text-decoration:none}
.rh-skip:focus{top:12px}

/* ---------- Header ---------- */
.rh-hdr{position:fixed;inset:0 0 auto 0;z-index:200;height:var(--rh-h);color:var(--rh-navy);
  background:rgba(246,245,241,.86);-webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px);
  box-shadow:0 1px 0 transparent;transition:box-shadow .2s var(--rh-ease);font-family:var(--rh-font)}
.rh-hdr.is-scrolled{box-shadow:0 1px 0 var(--rh-line)}
.rh-hdr :focus-visible{outline:2px solid currentColor;outline-offset:2px;border-radius:8px}
.rh-in{height:100%;display:flex;align-items:center;gap:20px}
.rh-brand{display:inline-flex;align-items:center;gap:10px;min-height:44px;color:inherit;text-decoration:none;flex:none}
.rh-brand svg{width:34px;height:34px;display:block}
.rh-brand span{font-size:1.25rem;font-weight:600;letter-spacing:.12em}
.rh-nav{display:none;margin-inline:auto}
.rh-nav ul{display:flex;align-items:center;gap:2px;margin:0;padding:0;list-style:none}
.rh-nav a{display:inline-flex;align-items:center;min-height:40px;padding:0 10px;border-radius:10px;color:inherit;text-decoration:none;
  font-size:.875rem;font-weight:500;letter-spacing:-.005em;white-space:nowrap;opacity:.78;transition:opacity .16s var(--rh-ease),background-color .16s var(--rh-ease)}
.rh-nav a:hover{opacity:1;background:rgba(11,31,82,.06)}
.rh-nav a[aria-current="page"]{opacity:1;background:rgba(11,31,82,.08)}
.rh-nav a.rh-vera::before{content:"";width:6px;height:6px;border-radius:50%;background:#FF3131;margin-right:7px} /* small product marker */
.rh-end{display:flex;align-items:center;gap:8px;margin-left:auto;flex:none}
.rh-cta{display:none;align-items:center;min-height:44px;padding:0 18px;border-radius:12px;background:var(--rh-navy);color:var(--rh-pale);
  font:500 .9375rem/1 var(--rh-font);text-decoration:none;white-space:nowrap;transition:background-color .16s var(--rh-ease)}
.rh-cta:hover{background:var(--rh-navy-3)}
.rh-menu-btn{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:12px;border:1px solid var(--rh-line);
  background:transparent;color:inherit;font:500 .9375rem/1 var(--rh-font);cursor:pointer}
.rh-menu-btn:hover{background:rgba(11,31,82,.06)}
@media (min-width:640px){.rh-cta{display:inline-flex}}
@media (min-width:1200px){.rh-nav{display:block}.rh-menu-btn{display:none}.rh-in{gap:12px}}
/* Dark header, for pages that open on a dark scene (VERA 2.0) */
.rh-hdr.is-dark{color:var(--rh-pale);background:rgba(11,31,82,.82)}
.rh-hdr.is-dark.is-scrolled{box-shadow:0 1px 0 var(--rh-line-d)}
.rh-hdr.is-dark .rh-nav a:hover{background:rgba(246,245,241,.08)}
.rh-hdr.is-dark .rh-nav a[aria-current="page"]{background:rgba(246,245,241,.12)}
.rh-hdr.is-dark .rh-cta{background:var(--rh-pale);color:var(--rh-navy)}
.rh-hdr.is-dark .rh-cta:hover{background:#fff}
.rh-hdr.is-dark .rh-menu-btn{border-color:var(--rh-line-d)}

/* ---------- Phone menu ---------- */
.rh-menu{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;overflow-y:auto;overscroll-behavior:contain;
  background:var(--rh-navy);color:var(--rh-pale);font-family:var(--rh-font)}
.rh-menu::backdrop{background:var(--rh-navy)}
.rh-menu[open]{display:flex;flex-direction:column;animation:rh-fade .3s var(--rh-ease)}
@keyframes rh-fade{from{opacity:0}}
.rh-menu :focus-visible{outline:2px solid var(--rh-pale);outline-offset:3px}
.rh-menu-top{height:var(--rh-h);display:flex;align-items:center;justify-content:space-between}
.rh-menu-top .rh-menu-btn{border-color:var(--rh-line-d)}
.rh-menu ol{margin:12px 0 0;padding:0;list-style:none;display:grid}
.rh-menu ol a{display:flex;align-items:baseline;gap:14px;padding:12px 0;border-top:1px solid var(--rh-line-d);color:inherit;text-decoration:none;
  font-size:clamp(1.5rem,1.2rem + 1.6vw,2.25rem);font-weight:500;letter-spacing:-.03em}
.rh-menu ol a small{font:500 .75rem var(--rh-mono);color:var(--rh-on-3);min-width:1.6rem}
.rh-menu ol a[aria-current="page"]{color:#fff;text-decoration:underline;text-underline-offset:8px;text-decoration-thickness:1px}
.rh-menu-foot{margin-top:auto;padding-block:24px 32px}
.rh-menu-foot .rh-cta{display:inline-flex;background:var(--rh-pale);color:var(--rh-navy)}

/* ---------- Footer ---------- */
.rh-foot{background:var(--rh-navy-deep);color:var(--rh-pale);font-family:var(--rh-font);padding:clamp(64px,8vw,104px) 0 28px;position:relative;z-index:5} /* above the VERA scene layers */
.rh-foot a{color:inherit;text-decoration:none}
.rh-foot a:hover{text-decoration:underline;text-underline-offset:4px}
.rh-foot :focus-visible{outline:2px solid var(--rh-pale);outline-offset:3px;border-radius:4px}
.rh-foot-grid{display:grid;gap:48px}
@media (min-width:1024px){.rh-foot-grid{grid-template-columns:1.1fr 2fr}}
.rh-foot .rh-brand svg{width:40px;height:40px}
.rh-foot-tag{margin:24px 0 0;font-size:clamp(1.75rem,1.3rem + 1.6vw,2.75rem);font-weight:500;letter-spacing:-.03em;line-height:1.08;max-width:9em}
.rh-foot-desc{margin:16px 0 0;color:var(--rh-on-3);max-width:24em;font-size:.9375rem;line-height:1.55}
.rh-foot-cols{display:grid;gap:32px;grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:640px){.rh-foot-cols{grid-template-columns:repeat(3,minmax(0,1fr))}}
.rh-foot h2{margin:0 0 14px;font:500 .75rem/1.3 var(--rh-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--rh-on-3)}
.rh-foot ul{margin:0;padding:0;list-style:none;display:grid;gap:2px}
.rh-foot ul a,.rh-foot ul span{display:inline-flex;align-items:center;min-height:36px;color:var(--rh-on-2);font-size:.9375rem}
.rh-foot ul a:hover{color:var(--rh-pale)}
.rh-foot-base{margin-top:64px;padding-top:20px;border-top:1px solid var(--rh-line-d);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;color:var(--rh-on-3);font-size:.875rem}
.rh-foot-base a{display:inline-flex;align-items:center;min-height:44px}
@media (prefers-reduced-motion:reduce){.rh-menu[open]{animation:none}}

/* ---------- On the VERA 2.0 page (Reference 1 styles plain h2 and footer tags) ---------- */
.rh-foot{border-top:0;overflow:visible}
.rh-foot h2{background:none;-webkit-background-clip:border-box;background-clip:border-box;-webkit-text-fill-color:currentColor;line-height:1.3}

/* Header logo intro ("simple dot"): a red dot drops and bounces, the gold tile grows out behind it,
   the dot slides into the corner and becomes the red quarter, the white shape sweeps in, then "RIAR" slides out.
   Plays when chrome.js adds .is-intro (first page of a visit, and on hover). Without it the logo is static. */
.rh-mark .m-dot{transform-box:fill-box;transform-origin:center}
.rh-mark .m-tile,.rh-mark .m-white{transform-box:view-box}
.rh-mark .m-tile{transform-origin:88px 88px}
.rh-mark .m-white{transform-origin:28px 28px}
.rh-brand.is-intro .m-dot{animation:rh-dot 1.8s both}
.rh-brand.is-intro .m-tile{animation:rh-tile .6s cubic-bezier(.34,1.56,.64,1) .72s both}
.rh-brand.is-intro .m-white{animation:rh-white .5s cubic-bezier(.34,1.4,.64,1) 1.45s both}
.rh-brand.is-intro > span{animation:rh-word .6s cubic-bezier(.16,1,.3,1) 1.7s both}
@keyframes rh-dot{
  0%{transform:translate(-60px,-130px) scale(.4);opacity:0;animation-timing-function:cubic-bezier(.55,0,1,.45)}
  8%{opacity:1}
  33%{transform:translate(-60px,-60px) scale(.4);animation-timing-function:ease-out}
  39%{transform:translate(-60px,-55px) scale(.5,.3);animation-timing-function:ease-out}
  49%{transform:translate(-60px,-74px) scale(.36,.44);animation-timing-function:ease-in}
  58%{transform:translate(-60px,-60px) scale(.4)}
  70%{transform:translate(-60px,-60px) scale(.4);animation-timing-function:cubic-bezier(.7,0,.25,1)}
  100%{transform:none;opacity:1}
}
@keyframes rh-tile{from{transform:scale(.12);opacity:0}to{transform:none;opacity:1}}
@keyframes rh-white{from{transform:scale(0)}to{transform:none}}
@keyframes rh-word{from{clip-path:inset(0 100% 0 0);transform:translateX(-12px);opacity:0}to{clip-path:inset(0 0 0 0);transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.rh-brand.is-intro .m-dot,.rh-brand.is-intro .m-tile,.rh-brand.is-intro .m-white,.rh-brand.is-intro > span{animation:none}}

/* ===== inspo additions: Services dropdown, footer word, socials, back to top ===== */
.rh-dd{position:relative;display:flex;align-items:center}
.rh-dd>a{padding-right:4px!important}
.rh-dd-btn{display:inline-grid;place-items:center;width:26px;height:32px;margin-left:-2px;border:0;border-radius:8px;background:none;color:inherit;opacity:.7;cursor:pointer;transition:transform .25s var(--rh-ease),opacity .2s}
.rh-dd-btn:hover{opacity:1}
.rh-dd:hover .rh-dd-btn,.rh-dd.is-open .rh-dd-btn{transform:rotate(180deg);opacity:1}
.rh-dd-menu{position:absolute;left:-8px;top:calc(100% + 6px);min-width:260px;padding:8px;border-radius:16px;background:#FBFAF7;color:var(--rh-navy);
  box-shadow:0 0 0 1px var(--rh-line),0 24px 48px -20px rgba(11,31,82,.35);display:grid;gap:2px;
  opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .2s var(--rh-ease),transform .25s var(--rh-ease),visibility 0s .25s}
.rh-dd-menu::before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px} /* hover bridge */
.rh-dd:hover .rh-dd-menu,.rh-dd:focus-within .rh-dd-menu,.rh-dd.is-open .rh-dd-menu{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.rh-nav .rh-dd-menu a{display:grid;gap:2px;min-height:0;padding:10px 12px;border-radius:10px;opacity:1}
.rh-dd-menu a b{font-weight:500;font-size:.9375rem}
.rh-dd-menu a span{font:500 .6875rem var(--rh-mono);letter-spacing:.05em;text-transform:uppercase;color:#5A6585}
.rh-nav .rh-dd-menu a:hover,.rh-nav .rh-dd-menu a[aria-current="page"]{background:rgba(11,31,82,.06)}
.rh-menu .rh-sub a{padding-left:28px;font-size:1.25rem;border-top-style:dashed}
.rh-menu .rh-sub em{font:500 .6875rem var(--rh-mono);font-style:normal;letter-spacing:.05em;text-transform:uppercase;color:var(--rh-on-3);margin-left:auto}

/* Footer: the big RIAR rises as the footer scrolls in (as in Reference 1), letters lift on hover */
.rh-foot{overflow:hidden}
.rh-wm{display:flex;justify-content:center;margin-top:clamp(40px,6vw,72px);font-family:var(--rh-font);font-weight:600;font-size:clamp(6rem,27vw,26rem);line-height:.78;letter-spacing:-.07em;
  user-select:none;transform:translateY(var(--wm-y,0%));will-change:transform}
.rh-wm span{display:inline-block;color:transparent;background:linear-gradient(180deg,rgba(246,245,241,.55) 0%,rgba(201,205,218,.22) 45%,rgba(23,49,122,.05) 92%);
  -webkit-background-clip:text;background-clip:text;transition:transform .6s var(--rh-ease)}
.rh-wm:hover span{transform:translateY(-2%)}
.rh-wm span:hover{transform:translateY(-8%)!important}
.rh-foot-base{position:relative;z-index:1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;border-top:1px solid var(--rh-line-d);padding-top:22px}
.rh-soc{display:inline-flex;align-items:center;gap:8px}
.rh-soc>a{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--rh-line-d);transition:background .25s,color .25s,transform .3s var(--rh-ease)}
.rh-soc>a svg{width:16px;height:16px}
.rh-soc>a:hover{background:var(--rh-pale);color:var(--rh-navy);transform:translateY(-2px);text-decoration:none}
.rh-sep{margin-left:10px;color:var(--rh-on-3)}
.rh-totop{position:fixed;right:18px;bottom:18px;z-index:150;width:46px;height:46px;border:0;border-radius:50%;background:var(--rh-navy);color:var(--rh-pale);cursor:pointer;
  display:grid;place-items:center;box-shadow:0 12px 24px -10px rgba(11,31,82,.5);opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .3s,transform .3s var(--rh-ease)}
.rh-totop.is-on{opacity:1;transform:none;pointer-events:auto}
.rh-totop:hover{background:var(--rh-navy-3)}
.rh-ring{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.rh-ring circle{fill:none;stroke-width:2}
.rh-ring .t{stroke:rgba(246,245,241,.18)}
.rh-ring .p{stroke:#FF4D4D;stroke-dasharray:100.5;stroke-dashoffset:calc(100.5 * (1 - var(--tp,0)));stroke-linecap:round}
.rh-ar{width:18px;height:18px;position:relative}
@media (prefers-reduced-motion:reduce){.rh-wm{transform:none}}
.rh-wm{margin-bottom:calc(-1 * clamp(24px,5vw,80px))}
.rh-foot-base{padding-right:64px}

/* ===== Round 6: footer word clearer, no rule under it, live dot field behind ===== */
.rh-foot{position:relative;isolation:isolate}
.rh-foot>.rh-wrap,.rh-foot>.rh-wm{position:relative;z-index:1}
.rh-foot-field{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;
  -webkit-mask-image:radial-gradient(ellipse 90% 85% at 50% 70%,#000 35%,transparent 92%);mask-image:radial-gradient(ellipse 90% 85% at 50% 70%,#000 35%,transparent 92%)}
.rh-wm{gap:0;font-weight:700;letter-spacing:0;margin-top:clamp(32px,5vw,64px);margin-bottom:clamp(8px,2vw,24px);line-height:.8}
.rh-wm span{margin:0 -.035em;background:linear-gradient(180deg,rgba(246,245,241,.92) 0%,rgba(246,245,241,.5) 48%,rgba(201,205,218,.14) 100%);
  -webkit-background-clip:text;background-clip:text}
.rh-foot-base{border-top:0;padding-top:8px}
.rh-wm span{margin:0 -.012em}

/* ===== Header: VERA logo intro — first page view of a visit only. The VERA logo pops in where the red dot sits,
   turns once, then shrinks and turns into the red dot. ===== */
.rh-vera-mark{display:none}
.rh-nav a.rh-vera.is-vintro::before{display:none}
.rh-vera.is-vintro .rh-vera-mark{display:inline-grid;place-items:center;flex:none;width:22px;height:22px;margin-right:7px;border-radius:50%;
  background:#0B1F52;box-shadow:0 0 0 0 rgba(255,49,49,.45);overflow:hidden;animation:rh-vmark 2.4s cubic-bezier(.65,0,.35,1) both}
.rh-vera-mark img{width:16px;height:16px;object-fit:contain;animation:rh-vlogo 2.4s cubic-bezier(.65,0,.35,1) both}
@keyframes rh-vmark{
  0%{transform:scale(0);width:22px;height:22px;background:#0B1F52}
  14%{transform:scale(1.18)}
  22%{transform:scale(1);box-shadow:0 0 0 0 rgba(255,49,49,.45)}
  48%{box-shadow:0 0 0 8px rgba(255,49,49,0)}
  70%{width:22px;height:22px;background:#0B1F52;margin-right:7px}
  100%{transform:scale(1);width:6px;height:6px;background:#FF3131;margin-right:7px}}
@keyframes rh-vlogo{0%{transform:rotate(-120deg) scale(.6);opacity:0}20%{opacity:1}55%{transform:rotate(0) scale(1);opacity:1}72%{opacity:1}88%,100%{transform:scale(.3);opacity:0}}
.rh-hdr.is-dark .rh-vera.is-vintro .rh-vera-mark{background:#F6F5F1}
/* VERA header intro, round 2: bigger and held longer so it reads clearly */
.rh-vera.is-vintro .rh-vera-mark{width:30px;height:30px;margin-right:8px;animation:rh-vmark2 3.4s cubic-bezier(.65,0,.35,1) both}
.rh-vera-mark img{width:20px;height:20px;animation:rh-vlogo2 3.4s cubic-bezier(.65,0,.35,1) both}
.rh-vera.is-vintro{color:#0B1F52;opacity:1!important;font-weight:600}
@keyframes rh-vmark2{
  0%{transform:scale(0);width:30px;height:30px;background:#0B1F52;box-shadow:0 0 0 0 rgba(255,49,49,.5)}
  10%{transform:scale(1.2)}
  16%{transform:scale(1)}
  30%{box-shadow:0 0 0 10px rgba(255,49,49,0)}
  31%{box-shadow:0 0 0 0 rgba(255,49,49,.5)}
  48%{box-shadow:0 0 0 10px rgba(255,49,49,0)}
  72%{width:30px;height:30px;background:#0B1F52;margin-right:8px}
  100%{transform:scale(1);width:6px;height:6px;background:#FF3131;margin-right:7px;box-shadow:none}}
@keyframes rh-vlogo2{0%{transform:rotate(-140deg) scale(.5);opacity:0}14%{opacity:1}36%{transform:rotate(0) scale(1)}74%{transform:scale(1);opacity:1}90%,100%{transform:scale(.2);opacity:0}}
/* VERA marker: the dot is a real element now, so it can grow into the logo on hover */
.rh-nav a.rh-vera.has-mark{display:inline-flex;align-items:center}
.rh-nav a.rh-vera.has-mark::before{display:none}
.rh-vera.has-mark .rh-vera-mark{display:inline-grid;place-items:center;flex:none;width:6px;height:6px;margin-right:7px;border-radius:50%;background:#FF3131;overflow:hidden;
  transition:width .35s cubic-bezier(.65,0,.35,1),height .35s cubic-bezier(.65,0,.35,1),margin .35s cubic-bezier(.65,0,.35,1),background-color .3s}
.rh-vera.has-mark .rh-vera-mark img{width:18px;height:18px;object-fit:contain;opacity:0;transform:scale(.3) rotate(-90deg);transition:opacity .25s,transform .45s cubic-bezier(.65,0,.35,1)}
.rh-vera.has-mark:hover .rh-vera-mark,.rh-vera.has-mark:focus-visible .rh-vera-mark{width:26px;height:26px;margin-right:8px;background:#0B1F52}
.rh-vera.has-mark:hover .rh-vera-mark img,.rh-vera.has-mark:focus-visible .rh-vera-mark img{opacity:1;transform:none;transition-delay:.08s}
.rh-hdr.is-dark .rh-vera.has-mark:hover .rh-vera-mark{background:#F6F5F1}
@media (prefers-reduced-motion:reduce){.rh-vera.has-mark .rh-vera-mark,.rh-vera.has-mark .rh-vera-mark img{transition:none}}
.rh-vera-mark img{animation:none}
.rh-vera.is-vintro .rh-vera-mark img{animation:rh-vlogo2 3.4s cubic-bezier(.65,0,.35,1) both}

/* ===== Round 9: light line grid replaces every dot pattern ===== */
.has-rl-grid{position:relative}
.has-rl-grid>.rl-grid{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;border-radius:inherit}
.rh-foot>.rl-grid{z-index:0}
.rh-foot-field{display:none!important}
@media (min-width:1680px){:root{--rh-max:1480px}}
@media (min-width:2200px){:root{--rh-max:1720px}}
@media (min-width:3000px){:root{--rh-max:2200px}}
/* Footer word: solid, auxia-style grotesk; letters rise one after another (set by chrome.js) */
.rh-wm{overflow:hidden;padding-bottom:.04em;transform:none!important;font-weight:500;letter-spacing:-.065em}
.rh-wm span{color:#F6F5F1!important;background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important;margin:0 -.01em;will-change:transform}
.rh-wm:hover span,.rh-wm span:hover{transform:none}
.rh-wm span{transform:translateY(var(--rise,0%))!important;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.rh-wm span:hover{transform:translateY(calc(var(--rise,0%) - 5%))!important}
@media (prefers-reduced-motion:reduce){.rh-wm span{transform:none!important}}
.rh-wm{letter-spacing:-.025em}.rh-wm span{margin:0 .01em!important}
/* Footer word: light that blends with the background — a soft fade at the foot of the letters,
   a slow light sweep, and a warm glow that follows the cursor (positions set by chrome.js) */
.rh-wm span{color:transparent!important;
  background:
    linear-gradient(105deg,transparent 40%,rgba(255,255,255,.55) 50%,transparent 60%) var(--sweep,-150%) 0/250% 100% no-repeat,
    radial-gradient(260px circle at var(--lx,-999px) var(--ly,-999px),rgba(255,106,77,.75),rgba(255,106,77,0) 70%),
    linear-gradient(180deg,#F6F5F1 0%,#F6F5F1 42%,rgba(246,245,241,.62) 78%,rgba(246,245,241,.28) 100%)!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  filter:drop-shadow(0 0 36px rgba(246,245,241,.07))}
@keyframes rh-sweep{0%,55%{--sweep:-150%}100%{--sweep:150%}}
@property --sweep{syntax:'<percentage>';inherits:true;initial-value:-150%}
.rh-wm span{animation:rh-sweep 7s ease-in-out infinite}
.rh-wm span:nth-child(2){animation-delay:.12s}.rh-wm span:nth-child(3){animation-delay:.24s}.rh-wm span:nth-child(4){animation-delay:.36s}
@media (prefers-reduced-motion:reduce){.rh-wm span{animation:none}}

/* ===== Round 12: light line grid, cheap version ===== */
.has-rl-grid{position:relative}
.rl-grid{display:none!important}
.rl-base{position:absolute;inset:0;z-index:0;pointer-events:none;border-radius:inherit;--g:64px;
  background-image:
    linear-gradient(to right,rgba(255,106,77,.045) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(255,106,77,.045) 1px,transparent 1px),
    linear-gradient(to right,rgba(246,245,241,.032) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(246,245,241,.032) 1px,transparent 1px);
  background-size:calc(var(--g) * 4) calc(var(--g) * 4),calc(var(--g) * 4) calc(var(--g) * 4),var(--g) var(--g),var(--g) var(--g);
  background-position:calc(var(--g) * 1) 0,0 calc(var(--g) * 2),0 0,0 0}
.rl-glow{position:absolute;left:0;top:0;width:440px;height:440px;z-index:0;pointer-events:none;opacity:0;transition:opacity .5s;will-change:transform}
.rl-glow.is-on{opacity:1}
.rl-run{position:absolute;left:0;height:1px;width:160px;z-index:0;pointer-events:none;opacity:0;
  background:linear-gradient(90deg,rgba(255,106,77,0),rgba(255,106,77,.32))}
.rl-run.go{animation:rl-run 3.6s linear forwards}
@keyframes rl-run{0%{opacity:0;transform:translateX(-160px)}8%{opacity:1}92%{opacity:1}100%{opacity:0;transform:translateX(var(--w,1200px))}}
.has-rl-grid{overflow:clip}
@media (prefers-reduced-motion:reduce){.rl-run{display:none}}
/* Footer word: a taller box so the feet of R and A are never clipped */
.rh-wm{line-height:1!important;padding-bottom:.06em!important;margin-top:clamp(16px,3vw,40px)!important;margin-bottom:calc(-1 * clamp(8px,2vw,28px))!important}
/* Footer word: each letter's box is padded (and the padding cancelled by margins) so the painted area
   covers the whole glyph — the feet of A and R reach past the letter's advance width */
.rh-wm span{padding:0 .09em .08em!important;margin:0 -.08em -.08em!important}
/* Header and footer type, auxia-style (all pages) */
.rh-nav a{opacity:.7;font-weight:500;letter-spacing:-.01em;padding:0 .9rem!important;border-radius:.5rem!important}
.rh-nav a:hover,.rh-nav a[aria-current="page"]{opacity:1}
.rh-cta{border-radius:.5rem!important;font-weight:500;padding:0 1.25rem}
.rh-foot h2{letter-spacing:.14em!important}
.rh-foot-tag{font-weight:500;letter-spacing:-.03em;line-height:.95}
.rh-menu ol a{letter-spacing:-.03em;font-weight:500}
.rh-nav .rh-dd>a{padding-right:.2rem!important}
.rh-nav .rh-dd-btn{margin-left:0}

/* ===== Round 16 ===== */
/* Footer word: thick and extra-wide (Archivo Extra Bold, extended, as in Reference 1), starting at the
   left edge of the footer text and stretching to the right edge (size fitted by chrome.js) */
.rh-wm{font-family:"Archivo","Inter Tight",system-ui,sans-serif!important;font-stretch:125%;font-weight:800!important;letter-spacing:-.01em!important;
  line-height:.86!important;justify-content:flex-start!important;width:min(var(--rh-max),calc(100% - 2 * var(--rh-gutter)));margin-left:auto!important;margin-right:auto!important;
  font-size:var(--wm-fs,24vw)!important;white-space:nowrap}
.rh-wm span{padding:0 .05em .06em!important;margin:0 -.05em -.06em!important}
/* Header scales up on big monitors */
@media (min-width:1680px){
  :root{--rh-h:84px;--header-h:84px}
  .rh-brand svg{width:38px;height:38px}
  .rh-brand span{font-size:1.375rem}
  .rh-nav a{font-size:1.0625rem;min-height:44px}
  .rh-cta{min-height:48px;font-size:1.0625rem;padding:0 1.4rem!important}
}
@media (min-width:2200px){
  :root{--rh-h:96px;--header-h:96px}
  .rh-brand svg{width:44px;height:44px}
  .rh-brand span{font-size:1.5rem}
  .rh-nav a{font-size:1.1875rem;min-height:50px;padding:0 1.1rem!important}
  .rh-cta{min-height:54px;font-size:1.1875rem;padding:0 1.6rem!important}
  .rh-dd-menu{min-width:300px}
}
@media (min-width:3000px){
  :root{--rh-h:112px;--header-h:112px}
  .rh-brand svg{width:52px;height:52px}.rh-brand span{font-size:1.75rem}
  .rh-nav a{font-size:1.375rem;min-height:58px}.rh-cta{min-height:62px;font-size:1.375rem}
}

/* ===== Round 17: the background effect uses dots instead of lines (same colours and behaviour) ===== */
.rl-base.rl-dots{--g:32px;
  background-image:
    radial-gradient(circle,rgba(255,106,77,.32) 1.1px,transparent 1.7px),
    radial-gradient(circle,rgba(255,106,77,.32) 1.1px,transparent 1.7px),
    radial-gradient(circle,rgba(246,245,241,.16) 1px,transparent 1.6px)!important;
  background-size:calc(var(--g) * 4) var(--g),var(--g) calc(var(--g) * 4),var(--g) var(--g)!important}
.rl-glow{width:auto;height:auto}
.rl-run.rl-run-dot{height:4px;width:140px;background:
  radial-gradient(circle at calc(100% - 2px) 50%,rgba(255,106,77,.95) 1.6px,rgba(255,106,77,.35) 3px,transparent 4px),
  linear-gradient(90deg,rgba(255,106,77,0),rgba(255,106,77,.28)) 0 50%/100% 1px no-repeat;
  filter:drop-shadow(0 0 4px rgba(255,106,77,.6))}
.rl-run.rl-run-dot{background:
  radial-gradient(circle at calc(100% - 2px) 50%,rgba(255,106,77,.95) 1.6px,rgba(255,106,77,.35) 3px,transparent 4px),
  radial-gradient(circle,rgba(255,106,77,.55) 1.1px,transparent 1.6px) 0 50%/8px 4px repeat-x!important;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 85%);mask-image:linear-gradient(90deg,transparent,#000 85%)}

/* ===== Round 18: dots very mild at rest; they light up only around the cursor ===== */
.rl-base.rl-dots{background-image:
    radial-gradient(circle,rgba(255,106,77,.11) 1px,transparent 1.5px),
    radial-gradient(circle,rgba(255,106,77,.11) 1px,transparent 1.5px),
    radial-gradient(circle,rgba(246,245,241,.07) .9px,transparent 1.4px)!important}
.rl-run,.rl-run.rl-run-dot{display:none!important} /* no idle animation: the dots glow only on hover */