:root {
    --ink: #151714;
    --paper: #f5f4ef;
    --panel: #e7e9e2;
    --green: #b8ed52;
    --nav-green: #497a22;
    --nav-green-hover: #3b681a;
    --nav-button: #b8ed52;
    --nav-button-hover: #a5d842;
    --nav-button-text: #15200f;
    --font-body: "Inter", sans-serif;
    --font-heading: "Manrope", sans-serif;
    --type-h1: clamp(2.25rem, 4.2vw, 3.75rem);
    --type-h2: clamp(1.875rem, 3vw, 2.5rem);
    --type-h3: clamp(1.25rem, 1.7vw, 1.5rem);
    --type-h4: clamp(1.0625rem, 1.2vw, 1.25rem);
    --type-lead: clamp(1.0625rem, 1.5vw, 1.25rem);
    --type-body: 1rem;
    --type-secondary: .9375rem;
    --type-label: .8125rem;
    --muted: #687066;
    --line: #cdd2c8;
    --shadow: 0 18px 50px rgba(21, 23, 20, .11);
    --contact-bg: #151714;
    --contact-text: #f5f4ef;
    --contact-muted: #c0c7bb;
    --contact-accent: #b8ed52;
    --contact-border: #495248;
    --footer-bg: #151714;
    --footer-text: #f5f4ef;
    --footer-muted: #aab5a8;
    --footer-border: #384038;
    --whatsapp-ink: #15200f;
    --map-surface: #d2d7cb;
    --map-ink: #151714;
    color-scheme: light;
}

:root[data-theme="dark"] {
    --ink: #aab5a8;
    --paper: #171a17;
    --panel: #252b25;
    --green: #c3f666;
    --nav-green: #c3f666;
    --nav-green-hover: #d6ff94;
    --nav-button: #c3f666;
    --nav-button-hover: #d6ff94;
    --nav-button-text: #15200f;
    --muted: #aab5a8;
    --line: #3a443a;
    --shadow: 0 18px 50px rgba(0, 0, 0, .28);
    --contact-bg: #101410;
    --contact-text: #f1f4ec;
    --contact-muted: #aab5a8;
    --contact-accent: #c3f666;
    --contact-border: #495248;
    --footer-bg: #1b211b;
    --footer-text: #f1f4ec;
    --footer-muted: #aab5a8;
    --footer-border: #495248;
    --map-surface: #252b25;
    --map-ink: #f1f4ec;
    color-scheme: dark;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    background: var(--paper);
    color: var(--ink);
    font-family: var(--font-body);
    font-size: var(--type-body);
    font-weight: 400;
    line-height: 1.6;
    transition: background .25s, color .25s;
}

h1,
h2,
h3,
h4 {
    margin-top: 0;
    font-family: var(--font-heading);
    font-style: normal;
}

h1 {
    font-size: var(--type-h1);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -.035em;
}

h2 {
    font-size: var(--type-h2);
    font-weight: 700;
    line-height: 1.25;
}

h3 {
    font-size: var(--type-h3);
    font-weight: 700;
    line-height: 1.3;
}

h4 {
    font-size: var(--type-h4);
    font-weight: 600;
    line-height: 1.35;
}

strong,
b {
    font-weight: 600;
}

p {
    font-size: var(--type-body);
    line-height: 1.6;
}

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

a {
    color: inherit;
    text-decoration: none;
}

img {
    display: block;
    width: 100%;
    object-fit: cover;
}

.container {
    width: min(1180px, calc(100% - 64px));
    margin: auto;
}

.skip-link {
    position: absolute;
    left: -9999px;
    top: 10px;
    padding: 12px 18px;
    background: var(--green);
    z-index: 20;
}

.skip-link:focus {
    left: 10px;
}