/* ============================================================================
   RAPPTR LABS · BRAND LIGHT
   Shared visual system for the new website. Light canvas, Rapptr purple
   accent, Onest display + DM Sans body. Each page links this file and
   layers minimal page-specific inline styles on top.
============================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Onest:wght@400;500;600;700;800&family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,600;9..40,700&display=swap');

:root{
  /* Brand purple scale */
  --b900:#1E014F; --b800:#2D1169; --b700:#4405CA; --b600:#5B35F3; --b500:#8364FF;
  --b400:#AC97FF; --b300:#CFC4FF; --b200:#E5DEFF; --b100:#F3F0FF; --b050:#FAF8FF;
  /* Ink + neutral */
  --ink:#1B1630; --ink-2:#3A3454; --muted:#6A6580; --muted-2:#8D88A6;
  --line:#ECE9F5; --line-2:#DED9EE;
  --gold:#C28A1A; --rescue:#D9612C;
  /* Type */
  --disp:'Onest',system-ui,sans-serif;
  --body:'DM Sans',system-ui,-apple-system,sans-serif;
}

/* ============ Reset + base ============ */
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:#fff;color:var(--ink);font-family:var(--body);-webkit-font-smoothing:antialiased;line-height:1.55;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font-family:inherit}

.wrap{max-width:1240px;margin:0 auto;padding:0 32px;width:100%}
@media(min-width:1024px){.wrap{padding:0 56px}}
.disp{font-family:var(--disp)}
.pp{color:var(--b600)}
.muted{color:var(--muted)}
.grad{background:linear-gradient(110deg,var(--b600) 0%,var(--b400) 55%,var(--b500) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.center{text-align:center}

/* ============ Pill eyebrow ============ */
.pill{display:inline-flex;align-items:center;gap:11px;padding:7px 16px;border-radius:999px;border:1px solid var(--line-2);background:var(--b050);font-size:11.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--b700);white-space:nowrap;max-width:100%}
.pill .pulse{width:7px;height:7px;border-radius:50%;background:var(--b500);box-shadow:0 0 0 0 rgba(131,100,255,.6);animation:pulse 2.4s infinite;flex:none}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(131,100,255,.5)}70%{box-shadow:0 0 0 12px rgba(131,100,255,0)}100%{box-shadow:0 0 0 0 rgba(131,100,255,0)}}

/* small eyebrow (no pill) */
.ey{font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--b700)}
.ey.gold{color:var(--gold)}
.ey.gold::before{content:"★ ";color:var(--gold)}

/* ============ Buttons ============ */
.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--disp);font-weight:600;font-size:15px;padding:14px 26px;border-radius:999px;border:1.5px solid transparent;transition:.2s;white-space:nowrap;cursor:pointer;text-decoration:none}
.btn-sm{padding:10px 18px;font-size:13.5px}
.btn-lg{padding:18px 32px;font-size:16.5px}
.btn-fill{background:var(--b600);color:#fff;box-shadow:0 14px 30px -12px rgba(91,53,243,.55)}
.btn-fill:hover{background:var(--b700);transform:translateY(-1px)}
.btn-out{border-color:var(--line-2);color:var(--ink);background:#fff}
.btn-out:hover{border-color:var(--b400);background:var(--b050)}
.btn-ond{border-color:rgba(255,255,255,.22);color:#fff;background:transparent}
.btn-ond:hover{border-color:var(--b300);background:rgba(207,196,255,.06)}
.btn-light{background:#fff;color:var(--b900);box-shadow:0 16px 36px -12px rgba(0,0,0,.5)}
.btn-light:hover{background:var(--b100);transform:translateY(-1px)}
.btn svg{width:15px;height:15px;flex:none}
.btn.full{justify-content:center;width:100%}

/* Text link with arrow */
.tlink{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:14.5px;color:var(--b700);border-bottom:1px solid var(--line-2);padding-bottom:2px;transition:gap .18s,border-color .18s,color .18s}
.tlink:hover{color:var(--b600);gap:10px;border-bottom-color:var(--b400)}
.tlink svg{width:14px;height:14px}

/* ============ Nav ============ */
nav.nav-rl{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.78);backdrop-filter:blur(14px);border-bottom:1px solid transparent;transition:border-color .2s,background .2s}
nav.nav-rl.scrolled{border-bottom-color:var(--line);background:rgba(255,255,255,.92)}
.nav-in{display:flex;align-items:center;gap:40px;height:72px}
.rl-logo{display:flex;align-items:center;gap:10px}
.rl-logo img{height:24px;width:auto}
.rl-word{font-family:var(--disp);font-weight:700;font-size:20px;letter-spacing:-.02em;color:var(--ink)}
.nav-links{display:none;gap:32px;margin-left:auto;font-size:14.5px;font-weight:500;color:var(--muted)}
.nav-links a:hover{color:var(--ink)}
@media(min-width:1024px){.nav-links{display:flex}}
.nav-cta{margin-left:auto}
@media(min-width:1024px){.nav-cta{margin-left:0}}

/* ============ Section header ============ */
.sec-hd{text-align:center;max-width:780px;margin:0 auto;padding:96px 0 56px}
.sec-hd .pill{margin-bottom:24px}
.sec-hd.left{text-align:left;margin:0}
.sec-hd h2{font-family:var(--disp);font-weight:800;font-size:clamp(36px,4.6vw,60px);line-height:1.02;letter-spacing:-.03em;color:var(--ink)}
.sec-hd p{font-size:17px;line-height:1.55;color:var(--muted);margin-top:18px}

/* ============ Page hero (inner-page hero pattern) ============ */
.phd-light{position:relative;overflow:hidden;padding:80px 0 76px;background:
  radial-gradient(ellipse 1200px 760px at 80% 12%, var(--b100) 0%, transparent 62%),
  radial-gradient(ellipse 900px 600px at 6% 92%, #EFE9FF 0%, transparent 60%)}
.phd-light::before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(91,53,243,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(91,53,243,.05) 1px,transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse at center,#000 22%,transparent 70%);
  -webkit-mask-image:radial-gradient(ellipse at center,#000 22%,transparent 70%)}
.phd-light .wrap{position:relative;z-index:1}
.phd-light .inner{max-width:780px}
.phd-light h1{font-family:var(--disp);font-weight:800;font-size:clamp(40px,5.4vw,72px);line-height:1.0;letter-spacing:-.035em;color:var(--ink);margin-top:22px}
.phd-light p.lead{font-size:19px;line-height:1.6;color:var(--muted);max-width:580px;margin:24px 0 32px}
.phd-light .cta-row{display:flex;gap:13px;flex-wrap:wrap;align-items:center}

/* ============ Trust band ============ */
.trust{padding:36px 0 42px;border-bottom:1px solid var(--line);background:#fff}
.trust .lbl{text-align:center;font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--muted-2);margin-bottom:22px}
.trust .logos{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:24px 56px}
.trust .nm{font-family:var(--disp);font-weight:700;font-size:20px;letter-spacing:-.01em;color:#B0AAC4;text-transform:uppercase;transition:color .2s}
.trust .nm:hover{color:var(--ink)}

/* ============ Band wrapper ============ */
section.band{padding:96px 0;background:#fff;position:relative}
section.band.tight{padding:48px 0}
section.band.hair{border-top:1px solid var(--line)}
section.band.soft{background:linear-gradient(180deg,#fff,var(--b050))}

/* ============ Card primitives ============ */
.card{background:#fff;border:1px solid var(--line-2);border-radius:18px;padding:28px;transition:border-color .2s,transform .2s,box-shadow .2s}
.card.soft{background:linear-gradient(160deg,var(--b050),#fff)}
.card.hover-lift:hover{border-color:var(--b400);transform:translateY(-3px);box-shadow:0 24px 50px -28px rgba(91,53,243,.25)}
.card-ic{width:46px;height:46px;border-radius:13px;background:var(--b100);border:1px solid var(--b200);display:flex;align-items:center;justify-content:center;color:var(--b600);margin-bottom:18px}
.card-ic svg{width:22px;height:22px}

/* ============ Form fields ============ */
.field{display:flex;flex-direction:column;gap:7px;margin-bottom:16px}
.field.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px}
.field label{font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--muted);text-transform:uppercase}
.field input,.field select,.field textarea{width:100%;background:#fff;border:1.5px solid var(--line-2);border-radius:10px;padding:12px 14px;color:var(--ink);font-family:var(--body);font-size:14.5px;transition:border-color .18s,box-shadow .18s}
.field input::placeholder,.field textarea::placeholder{color:var(--muted-2)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--b400);box-shadow:0 0 0 3px rgba(131,100,255,.18)}
.field textarea{resize:vertical;min-height:96px}

/* Chip checkboxes */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:999px;border:1.5px solid var(--line-2);background:#fff;font-size:13px;font-weight:500;color:var(--ink);cursor:pointer;transition:.18s;user-select:none}
.chip:hover{border-color:var(--b400);background:var(--b050)}
.chip.on{background:var(--b600);color:#fff;border-color:var(--b600)}
.chip input{display:none}

/* ============ Dark closing CTA band ============ */
.closing{background:var(--b900);color:#fff;padding:130px 0;position:relative;overflow:hidden;text-align:center}
.closing::before{content:"";position:absolute;bottom:-340px;left:50%;transform:translateX(-50%);width:1100px;height:580px;pointer-events:none;background:radial-gradient(ellipse at center,rgba(91,53,243,.34),transparent 65%)}
.closing-pill{display:inline-flex;align-items:center;gap:11px;padding:8px 18px;border-radius:999px;border:1px solid rgba(207,196,255,.22);background:rgba(91,53,243,.12);font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--b300);margin-bottom:32px;position:relative;z-index:1}
.closing h2{font-family:var(--disp);position:relative;z-index:1;font-size:clamp(40px,5.4vw,72px);font-weight:800;line-height:1.04;letter-spacing:-.035em;color:#fff;max-width:920px;margin:0 auto}
.closing-sub{position:relative;z-index:1;font-size:18px;line-height:1.55;color:var(--b200);margin:24px auto 0;max-width:640px}
.closing .cta-row{position:relative;z-index:1;display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:38px}

/* ============ Footer ============ */
footer.footer-rl{background:var(--b900);color:#fff;padding:64px 0 28px}
footer.footer-rl .top{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:40px}
@media(max-width:880px){footer.footer-rl .top{grid-template-columns:1fr 1fr}}
footer.footer-rl .rl-word{color:#fff}
footer.footer-rl .rl-logo img{filter:brightness(0) invert(1)}
footer.footer-rl .fd{font-size:14.5px;line-height:1.6;color:#b3a8d6;max-width:34ch;margin-top:14px}
footer.footer-rl .madeby{display:inline-flex;align-items:center;gap:9px;margin-top:18px;font-size:13.5px;color:var(--b300);background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);padding:8px 14px;border-radius:999px;transition:.2s}
footer.footer-rl .madeby:hover{background:rgba(255,255,255,.1);color:#fff}
footer.footer-rl .madeby img{width:16px;height:16px;filter:brightness(0) invert(1)}
footer.footer-rl h5{font-family:var(--disp);font-weight:700;font-size:13px;letter-spacing:.02em;color:#fff;margin-bottom:14px}
footer.footer-rl .col a{display:block;font-size:14px;color:#b3a8d6;margin-bottom:10px;transition:color .15s}
footer.footer-rl .col a:hover{color:#fff}
footer.footer-rl .bot{border-top:1px solid rgba(255,255,255,.08);margin-top:48px;padding-top:22px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;font-size:13px;color:#8e82b8}

/* ============ Reveal-on-scroll ============ */
.reveal{opacity:0;transform:translateY(14px);transition:opacity .55s ease-out,transform .55s ease-out}
.reveal.in{opacity:1;transform:none}

/* ============ Responsive helpers ============ */
@media(max-width:880px){
  .sec-hd{padding:64px 0 40px}
  section.band{padding:64px 0}
  .phd-light{padding:60px 0 56px}
  .phd-light h1{font-size:clamp(34px,7vw,50px)}
}