@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Source+Serif+4:wght@600;700&display=swap');

:root {
  color-scheme: light;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: 'Manrope', sans-serif;
  background:
    radial-gradient(circle at top left, rgba(215, 168, 74, 0.18), transparent 28%),
    radial-gradient(circle at top right, rgba(29, 92, 94, 0.16), transparent 24%),
    #f8faf9;
}

h1,
h2,
h3,
.display-serif {
  font-family: 'Source Serif 4', serif;
}

.hero-grid {
  background-image:
    linear-gradient(rgba(217, 229, 226, 0.16) 1px, transparent 1px),
    linear-gradient(90deg, rgba(217, 229, 226, 0.16) 1px, transparent 1px);
  background-size: 34px 34px;
}

.glass-panel {
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.section-shell {
  border: 1px solid rgba(148, 163, 184, 0.18);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 24px 80px rgba(11, 23, 38, 0.08);
}

.soft-card {
  border: 1px solid rgba(148, 163, 184, 0.2);
  background: #ffffff;
  box-shadow: 0 18px 50px rgba(11, 23, 38, 0.06);
}