:root {
    --bg: #fbfbfd;
    --surface: #ffffff;
    --ink: #1d1d1f;
    --ink-soft: #6e6e73;
    --hero: #1E335C;
    --accent: #5A8C87;
    --border: #e5e5e7;
}

* , *::before, *::after {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", Helvetica, Arial, sans-serif;
    background: var(--bg);
    color: var(--ink);
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
}

a {
    color: var(--ink);
}

#contact-title ~ p a {
    text-decoration: none;
    background-image: linear-gradient(var(--accent), var(--accent));
    background-repeat: no-repeat;
    background-position: 0 100%;
    background-size: 0% 1px;
    transition: background-size 0.25s ease;
}
#contact-title ~ p a:hover {
    background-size: 100% 1px;
}

h1, h2, h3 {
    margin: 0;
    letter-spacing: -0.02em;
}

/* Reveal on scroll */
.fade-in {
    opacity: 0;
    animation: fade 1.1s ease-out forwards;
}
@keyframes fade {
    to { opacity: 1; }
}
.reveal {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}
.reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}