:root {
  /* === Font Sizes === */
  --font-size-xxxs: 10px;
  --font-size-xxs: 12px;
  --font-size-xms: 13px;
  --font-size-xs: 14px;
  --font-size-sm: 16px;
  --font-size-md: 18px;
  --font-size-lg: 20px;
  --font-size-l: 22px;
  --font-size-ll: 23px;
  --font-size-xl: 24px;
  --font-size-xxl: 30px;
  --font-size-xxxl: 32px;
  --font-size-38: 38px;
  --line-size-39: 39px;
  --font-size-large: 50px;

  /* === Font Weights === */
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semi-bold: 600;
  --font-weight-bold: 700;
  --font-weight-extra-bold: 800;

  /* === Colors === */
  /* Summer / beach palette (minimal, airy) */
  --sum-ink: #0b2239;
  --sum-sky: #7cc6e6;
  --sum-sea: #1b84b6;
  --sum-sand: #fbf5ea;
  --sum-coral: #ff6b5a;
  --sum-coral-hover: #f25f4f;
  --sum-border: rgba(11, 34, 57, 0.12);
  --sum-shadow: 0 18px 55px rgba(27, 132, 182, 0.14);

  /* Semantic tokens */
  --c-bg: var(--sum-sand);
  --c-surface: rgba(255, 255, 255, 0.9);
  --c-surface-solid: #ffffff;
  --c-text: var(--sum-ink);
  --c-muted: rgba(11, 34, 57, 0.68);
  --c-border: var(--sum-border);
  --c-accent: var(--sum-coral);
  --c-accent-hover: var(--sum-coral-hover);
  --c-on-accent: rgba(255, 255, 255, 0.98);
  --c-shadow: var(--sum-shadow);

  /* Back-compat mappings used across the project */
  --color-white: var(--c-bg);
  --text-black: var(--c-text);
  --text-gray: var(--c-muted);
  --color-orange: var(--c-accent);
  --landing-box-shadow: var(--c-shadow);
  --landing-hero-subtext: var(--c-muted);
  --landing-hero-text: var(--c-text);
  --landing-blur-blue: rgba(124, 198, 230, 0.22);
  --landing-blur-purple: rgba(27, 132, 182, 0.14);

  --text-dark: #322858;
  --color-black: #1a1a1a;
  --color-red: #dc2828;
  --color-gray: #e1e1e2;
  --color-green: #149041;

  --landing-check-bg-color: #f1f4f9;

  --landing-hero-gradient-from: #5b6cf9;
  --landing-hero-gradient-to: #8b5cf6;

  --negative-text: #bc5454;
  --negative-bg: #fdefef;
  --negative-bg-hover: #bc5454;
  --negative-border-color: #fde2e2;

  --box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.03);
  --card-shadow: 0px 4px 12px rgba(213, 224, 252, 1);
}

html,
body,
div,
span,
h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
em,
img,
strong,
b,
i,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figure,
figcaption,
footer,
header,
menu,
nav,
section,
summary,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
}

* {
  box-sizing: border-box;
}

body {
  background: var(--color-white);
  padding: 0;
  overflow-y: scroll;
  scrollbar-width: none;
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  color: var(--c-text);
}

button,
input,
select,
textarea {
  font: inherit;
}

html {
  background: var(--color-white);
  padding: 0;
  overflow-y: scroll;
  scrollbar-width: none;
  scroll-behavior: smooth;
}

html::-webkit-scrollbar {
  display: none;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
menu,
nav,
section {
  display: block;
}

a {
  text-decoration: none;
}

ol,
ul {
  list-style: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

input {
  box-sizing: border-box;
}

/* === Page wrapper (from app/page.module.css) === */
.pg-page {
  --gradient: linear-gradient(
    90deg,
    var(--landing-hero-gradient-from),
    var(--landing-hero-gradient-to)
  );
  min-height: 100vh;
  background: var(--color-white);
  position: relative;
  overflow-x: hidden;
}

.pg-page::before,
.pg-page::after {
  content: '';
  position: fixed;
  width: 60vmax;
  height: 60vmax;
  border-radius: 50%;
  filter: blur(80px);
  opacity: 0.5;
  pointer-events: none;
  z-index: 0;
}

.pg-page::before {
  background: var(--landing-blur-blue);
  bottom: -20vmax;
  left: -15vmax;
}

.pg-page::after {
  background: var(--landing-blur-purple);
  top: -20vmax;
  right: -15vmax;
}