/* Theme that aligns inner pages with the new landing page design */
@import url("https://fonts.googleapis.com/css2?family=Tajawal:wght@300;400;500;700;800&display=swap");

:root{
  --bg-0:#030b14;
  --bg-1:#06121d;
  --bg-2:#0a1a28;
  --panel:rgba(8,22,34,.82);
  --panel-2:rgba(10,26,40,.9);
  --teal:#5affff;
  --cyan:#5affff;
  --btn-text:#04202b;
  --text-0:#ffffff;
  --text-1:rgba(255,255,255,.78);
  --text-2:rgba(255,255,255,.55);
  --border:rgba(255,255,255,.1);
  --radius:22px;
  --radius-lg:40px;
  --font:'Tajawal','Almarai',-apple-system,sans-serif;
}

body{
  font-weight:400;
  background:
    linear-gradient(180deg, rgba(3,11,20,.35) 0, var(--bg-0) 720px),
    url("../assets/hero.jpg") center top / 100% 720px no-repeat,
    var(--bg-0);
}

/* nav, as on the landing page */
.site-header,
.site-header.scrolled{
  background:rgba(3,11,17,.9);
  backdrop-filter:blur(12px);
  box-shadow:0 8px 30px rgba(0,0,0,.4);
  border-bottom:0;
}
.logo-img{height:34px;}

/* buttons */
.btn{font-weight:500;}
.btn-primary{
  background:var(--cyan); color:var(--btn-text);
  box-shadow:0 10px 34px rgba(90,255,255,.22);
}
.btn-primary:hover{background:var(--cyan); filter:brightness(1.06); box-shadow:0 14px 40px rgba(90,255,255,.35);}
.btn-glow:hover{box-shadow:0 14px 40px rgba(90,255,255,.4);}

/* cards: glass panels */
.form-card, .cert-card, .lookup-card, .thanks-card{
  backdrop-filter:blur(10px);
  border-color:rgba(255,255,255,.08);
}

/* badge / pills like the landing page chips */
.badge{
  border:1px solid rgba(90,255,255,.85); color:var(--cyan);
  background:transparent; font-weight:400;
}

h1,h2,h3{font-weight:700;}

/* footer */
.v2-footer .footer-bg::after{
  background:linear-gradient(to top, var(--bg-0) 0%, #000000b3 25%, #000000ab 70%, var(--bg-0) 100%);
}