/* RAI site. One continuous sunset ocean. The manta is a separate layer. */

@font-face{font-family:Inter;font-style:normal;font-weight:400;font-display:swap;src:url("../assets/fonts/inter-regular.woff2") format("woff2")}
@font-face{font-family:Inter;font-style:normal;font-weight:600;font-display:swap;src:url("../assets/fonts/inter-semibold.woff2") format("woff2")}
@font-face{font-family:Inter;font-style:normal;font-weight:700;font-display:swap;src:url("../assets/fonts/inter-bold.woff2") format("woff2")}

:root{
  --pearl:#F3EFE6;
  --pearl-hi:#F6F1E7;
  --pearl-lo:#E8ECEC;
  --cream:233,228,218;
  --amber:#E8A65A;
  --sea:#3E5F63;
  --mid:#2F6A70;
  --reef:#0F3B40;
  --deep:#04252A;
  --navy:#070B16;
}

html,body{overflow-x:hidden}
body{position:relative;background:var(--sea);color:var(--pearl)}
section,main,.rai-section,.rai-strip,.rai-contact,.rai-footer{background:transparent;color:var(--pearl)}
main,header,footer{position:relative;z-index:5}
h1,h2,h3{color:var(--pearl)}
h1,h2{
  color:var(--pearl);
  background-image:linear-gradient(180deg,var(--pearl-hi) 0%,var(--pearl-lo) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}
p,li,figcaption,.rai-body,.lead,.fine,.footer-note,.note,.price-note,.rai-strip__sub,.rai-strip__then,.channel span{
  color:rgba(var(--cream),0.9);
}
.rai-dim{color:rgba(var(--cream),0.9)}
a{color:var(--pearl)}
.rai-link{color:var(--pearl)}
.rai-link:hover{color:#fff}
.center{text-align:center}
.center .rai-body,.center .lead,.center .price-note{margin-left:auto;margin-right:auto}
.lead{margin-top:var(--rai-stack-head);font-size:var(--lead);line-height:1.45;font-weight:400;max-width:40rem}
h1{font-size:clamp(48px,5.6vw,88px);letter-spacing:-.04em;line-height:1.02}
h2{font-size:clamp(34px,4vw,64px);letter-spacing:-.035em;line-height:1.08}
h3{font-size:clamp(22px,1.1vw + 18px,28px);letter-spacing:-.02em;line-height:1.2;color:var(--pearl);background:none;-webkit-text-fill-color:var(--pearl)}

/* Small labels. Sea green only where the water is dark enough for AA. */
.rai-eyebrow,.rai-label,.rai-tag,.rai-footer__label{
  color:var(--pearl);
  background:none;
  -webkit-text-fill-color:currentColor;
  text-transform:uppercase;
}
.rai-card .rai-tag,.rai-contact .rai-eyebrow,.rai-contact .rai-label,.rai-footer__label{color:#7EE0CB}
.rai-num{color:var(--rai-gold);-webkit-text-fill-color:var(--rai-gold)}

.rai-nav{background:#070B16;border-bottom:1px solid rgba(243,239,230,.12)}
.rai-brand{letter-spacing:0;gap:0}
.rai-nav .nav-logo{height:44px;width:auto;max-width:min(52vw,240px);display:block}
.rai-nav__links a{color:rgba(var(--cream),0.9)}
.rai-nav__links a:hover{color:var(--pearl)}
.rai-nav__links a.rai-nav__cta{
  background:#D4AF37;color:#070B16;border:0;
  box-shadow:0 0 0 1.5px rgba(243,239,230,.9),0 8px 20px rgba(0,0,0,.35);
  font-weight:600;
}
.rai-nav__links a.rai-nav__cta:hover{background:#E2C25A;color:#070B16;text-decoration:none}

.rai-btn--primary{
  background:#D4AF37;color:#070B16;
  box-shadow:0 0 0 1.5px rgba(243,239,230,.92),0 10px 28px rgba(7,11,22,.4);
}
.rai-btn--primary:hover{background:#E2C25A;color:#070B16}

/* Ocean. The wash is as tall as the page, so depth is just scroll. */
.ocean{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.ocean__wash{
  position:absolute;inset:0;
  background:linear-gradient(180deg,
    #3E5F63 0%,
    #3E5F63 7%,
    #2F6A70 12%,
    #1a4e54 20%,
    #0F3B40 34%,
    #0a3036 52%,
    #04252A 70%,
    #070B16 86%,
    #070B16 100%);
}
.ocean__surface{position:absolute;left:0;right:0;top:0;height:100svh;z-index:1}
.ocean__surface img{
  width:100%;height:100%;object-fit:cover;object-position:center 28%;display:block;
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 34%,transparent 100%);
  mask-image:linear-gradient(180deg,#000 0%,#000 34%,transparent 100%);
}
.ocean__rays{
  position:absolute;left:0;right:0;top:0;height:78vh;z-index:2;
  background:
    radial-gradient(70% 46% at 50% -8%, rgba(232,166,90,.28), transparent 62%),
    linear-gradient(180deg, rgba(232,166,90,.22), rgba(232,166,90,.08) 42%, transparent 78%);
  mix-blend-mode:soft-light;
}
.ocean__caustic{
  position:absolute;left:0;right:0;top:0;height:70vh;z-index:2;opacity:.55;
  background:
    radial-gradient(18% 10% at 22% 18%, rgba(232,166,90,.20), transparent 70%),
    radial-gradient(14% 8% at 68% 12%, rgba(246,241,231,.16), transparent 70%),
    radial-gradient(22% 12% at 48% 30%, rgba(232,166,90,.12), transparent 72%);
  -webkit-mask-image:linear-gradient(180deg,#000 0%,transparent 80%);
  mask-image:linear-gradient(180deg,#000 0%,transparent 80%);
}
.ocean__kelp{
  position:absolute;z-index:2;width:220px;height:auto;opacity:.22;
  filter:blur(10px);
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 22%,#000 68%,transparent),linear-gradient(90deg,transparent,#000 18%,#000 82%,transparent);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(180deg,transparent,#000 22%,#000 68%,transparent),linear-gradient(90deg,transparent,#000 18%,#000 82%,transparent);
  mask-composite:intersect;
}
.ocean__kelp--a{left:-70px;top:108vh}
.ocean__kelp--b{right:-80px;top:168vh;width:180px}

/* Clean photo manta. Fixed, so scroll can carry it the length of the page. */
.manta{
  position:fixed;left:0;top:0;z-index:2;pointer-events:none;opacity:0;
  width:min(32vw,420px);
}
.manta__pose{width:100%;transform-origin:50% 55%}
.manta__wing{position:relative;width:100%}
.manta__wing img{
  width:100%;height:auto;display:block;
  filter:drop-shadow(0 10px 18px rgba(4,18,24,.35));
}
html.rai-motion .manta__wing{animation:rai-wing 7.5s ease-in-out infinite}
@keyframes rai-wing{
  0%,100%{transform:scaleY(1) rotate(0deg)}
  50%{transform:scaleY(.965) rotate(-1.4deg)}
}
.spark{
  position:absolute;width:5px;height:5px;border-radius:50%;
  background:#F6E7B2;box-shadow:0 0 8px 2px rgba(232,166,90,.85);
  right:8%;top:46%;opacity:0;
}
html.rai-motion .spark{animation:rai-spark 2.8s ease-out infinite}
.spark--b{right:14%;top:52%;animation-delay:.6s}
.spark--c{right:4%;top:40%;animation-delay:1.2s}
@keyframes rai-spark{
  0%{opacity:0;transform:translate3d(0,0,0) scale(.4)}
  20%{opacity:.9}
  100%{opacity:0;transform:translate3d(28px,10px,0) scale(1)}
}
html.rai-static .manta{position:absolute;left:auto;right:3%;top:18%;width:min(36vw,460px)}
html.rai-static.manta-ready .manta{opacity:1}
html.is-hidden .manta__wing,html.is-hidden .spark{animation-play-state:paused}

.hero{position:relative;min-height:100svh;color:var(--pearl);z-index:2}
.hero__scrim{
  position:absolute;inset:0;pointer-events:none;z-index:1;
  background:
    linear-gradient(90deg,rgba(7,11,22,.88) 0%,rgba(7,11,22,.72) 26%,rgba(7,11,22,.28) 46%,rgba(7,11,22,0) 64%),
    linear-gradient(180deg,rgba(7,11,22,.55) 0%,rgba(7,11,22,.12) 28%,transparent 52%);
}
.hero__band{
  position:relative;z-index:2;min-height:100svh;
  display:flex;align-items:center;
  padding:108px 0 72px clamp(22px,4vw,64px);
}
.hero__copy{max-width:min(38vw,560px)}
.hero h1{margin:0}
.hero__time{
  margin:20px 0 0;color:#F3EFE6;font-size:clamp(18px,1.3vw,22px);
  font-weight:500;letter-spacing:.01em;line-height:1.4;
  background:none;-webkit-text-fill-color:#F3EFE6;
}
.hero__cta{display:flex;flex-wrap:wrap;gap:16px 22px;align-items:center;margin-top:32px}

.mission{position:relative;z-index:2;padding:clamp(72px,10vh,140px) 0 clamp(40px,6vh,80px)}
.mission__line{max-width:16em;margin:0;text-wrap:balance}

.rai-section{background:transparent;color:var(--pearl);padding:clamp(88px,11vh,150px) 0}
.rai-strip{background:transparent;padding:clamp(36px,6vh,72px) var(--rai-gutter);text-align:center}
.rai-strip__line{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px 14px;font-weight:600;letter-spacing:-.02em;font-size:clamp(1.35rem,1rem + 1.2vw,2rem)}
.rai-strip__line a{color:var(--pearl);text-decoration:underline;text-decoration-color:rgba(243,239,230,.45);text-underline-offset:.28em}
.rai-strip__sep{width:28px;height:1px;background:rgba(243,239,230,.35);display:inline-block}
.rai-strip__sub{margin-top:14px}

.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.g2{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}
@media(min-width:821px){.g3,.g2{gap:32px}}
.mt7{margin-top:clamp(40px,5vw,72px)}
#promise .lead{
  max-width:40rem;font-size:clamp(22px,2vw,30px);line-height:1.35;
  color:#F3EFE6;-webkit-text-fill-color:#F3EFE6;
  background:rgba(7,11,22,.78);
  box-decoration-break:clone;-webkit-box-decoration-break:clone;
  padding:.15em .4em;border-radius:8px;
}

.fields{list-style:none;padding:0;margin:36px auto 0;display:flex;flex-wrap:wrap;justify-content:center;gap:12px;max-width:860px}
#method ol{list-style:none;padding:0;margin:0}
.how-foot,.section-cta{margin-top:40px;text-align:center}

.rai-card,.rai-glass,.launch{
  position:relative;
  background:#0B121C;
  border:1px solid rgba(243,239,230,.16);
  border-radius:22px;
  box-shadow:inset 0 1px 0 rgba(243,239,230,.28),0 28px 60px -32px rgba(0,0,0,.65);
  color:#F3EFE6;
}
.rai-card{padding:28px 28px 32px}
.rai-card p,.rai-card li,.rai-glass p,.launch p,.rai-card .ask{
  color:#F3EFE6;-webkit-text-fill-color:#F3EFE6;
}
.rai-card h3{margin-top:8px;color:#F3EFE6;-webkit-text-fill-color:#F3EFE6}
html.rai-motion .rai-card{animation:rai-drift 9s ease-in-out infinite}
html.rai-motion .g3 .lift:nth-child(2) .rai-card,html.rai-motion .g2 .lift:nth-child(2) .rai-card{animation-delay:-3s}
html.rai-motion .g3 .lift:nth-child(3) .rai-card{animation-delay:-5s}
@keyframes rai-drift{
  0%,100%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(0,7px,0)}
}
html.rai-motion .rai-card::after,html.rai-motion .rai-glass::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;padding:1px;
  background:linear-gradient(115deg,transparent 32%,rgba(243,239,230,.55) 50%,transparent 68%);
  background-size:220% 100%;
  animation:rai-edge 10s ease-in-out infinite;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  mask-composite:exclude;
}
@keyframes rai-edge{
  0%,100%{background-position:140% 0}
  50%{background-position:-40% 0}
}

.products{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.product{display:flex;flex-direction:column;gap:12px}
.product p{margin-top:0}
.product .ask{margin-top:auto;padding-top:16px;border-top:1px solid rgba(243,239,230,.16);font-size:.95rem;font-weight:600;color:var(--pearl)}
.price-note{margin:28px auto 0;max-width:46rem;text-align:center}
.launch{margin:28px auto 0;max-width:46rem;padding:28px;text-align:center}
.launch p{margin-top:12px}
.product--free{grid-column:1/-1}
.product--free .row{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.product--side{grid-column:1/-1}
.work .rai-card{display:flex;flex-direction:column;gap:10px}
.work-note{margin-top:12px}

.rai-pill{color:var(--pearl);background:rgba(7,11,22,.4);border-color:rgba(243,239,230,.22)}

.portrait{margin:48px auto 0;max-width:720px}
.portrait img,.advisor img{width:100%;height:auto;display:block;border-radius:16px}
figcaption{font-size:.95rem;margin-top:12px;text-align:center}
.role{font-size:.8rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;margin:8px 0 12px;color:var(--pearl)}
.bios{max-width:920px;margin-left:auto;margin-right:auto}
.heritage{display:grid;grid-template-columns:300px 1fr;gap:36px;align-items:center;max-width:920px;margin:64px auto 0}
.advisor{margin:0}
.fine{font-size:.95rem;margin:40px auto 0;text-align:center;max-width:46rem}
.ph-frame{aspect-ratio:3/2;border-radius:16px;background:rgba(7,11,22,.72);display:flex;align-items:center;justify-content:center;border:1px solid rgba(243,239,230,.2)}
.ph-initials{color:var(--pearl);font-weight:600;letter-spacing:.2em;font-size:1rem}
.portrait.ph{max-width:640px}

.rai-contact{position:relative;z-index:2;color:var(--pearl);padding:clamp(96px,12vh,160px) 0 clamp(40px,6vh,72px);background:transparent}
.rai-contact h2,.rai-contact .lead{color:var(--pearl)}
.rai-glass{padding:clamp(24px,3vw,40px);margin-top:36px}
.contact-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:36px;align-items:start}
.channel{display:block;padding:16px 0;border-top:1px solid rgba(243,239,230,.14);text-decoration:none}
.channel:last-of-type,.channel--soon{border-bottom:1px solid rgba(243,239,230,.14)}
.channel b{display:block;color:var(--pearl)}
.channel span{color:#F3EFE6}
.channel:hover span{text-decoration:underline;text-underline-offset:.25em}
.channel--soon{margin:0}
.form{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.form .full{grid-column:1/-1}
.form textarea{resize:vertical}
.note{text-align:center}
.rai-input{background:rgba(7,11,22,.55);color:var(--pearl);border-color:rgba(243,239,230,.2)}
.rai-input::placeholder{color:rgba(var(--cream),0.72)}

.rai-footer{
  background:transparent;border-top:0;color:rgba(var(--cream),0.9);
  padding:clamp(48px,8vh,96px) 0 48px;z-index:5;
}
.badge-logo{width:132px;height:132px;border-radius:50%;display:block}
.footer-note{margin-top:14px;max-width:28ch}
.rai-footer a{color:rgba(var(--cream),0.9)}
.rai-footer a:hover{color:var(--pearl)}

@media(max-width:820px){
  .rai-nav .nav-logo{height:36px}
  .g3,.g2,.products,.form,.contact-grid,.heritage{grid-template-columns:1fr}
  .heritage{gap:20px}
  .heritage .advisor{max-width:320px}
  .product--free{grid-column:auto}
  .hero__copy{max-width:min(92vw,560px)}
  .ocean__kelp{opacity:.16;width:120px;filter:blur(12px)}
}

@media(max-width:480px){
  .hero__scrim{
    background:linear-gradient(180deg,rgba(7,11,22,.86) 0%,rgba(7,11,22,.7) 22%,rgba(7,11,22,.28) 40%,rgba(7,11,22,.05) 58%,transparent 74%);
  }
  .hero__band{align-items:flex-start;padding:108px 22px 48px}
  .hero h1{font-size:clamp(40px,11vw,52px)}
  .manta{width:46vw}
  html.rai-static .manta{top:74px;right:4px;width:46vw}
  .ocean__kelp{display:none}
  .rai-card,.rai-glass,.launch{background:#0B121C;backdrop-filter:none}
  html.rai-motion .rai-card,html.rai-motion .manta__wing,html.rai-motion .spark,html.rai-motion .rai-card::after,html.rai-motion .rai-glass::after{animation:none}
}

/* Visible with no JavaScript. Motion hides a block only until it has entered. */
.rai-reveal{opacity:1;transform:none}
html.js.rai-motion .rai-reveal{opacity:0;transform:translate3d(0,16px,0);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
html.js.rai-motion .rai-reveal.is-in{opacity:1;transform:none}

@media(prefers-reduced-motion:reduce){
  html.rai-motion .rai-card,html.rai-motion .manta__wing,html.rai-motion .spark,html.rai-motion .rai-card::after,html.rai-motion .rai-glass::after{animation:none}
  .rai-reveal,html.js.rai-motion .rai-reveal{opacity:1!important;transform:none!important;transition:none!important}
}