/**
 * Namoo / ECOVILLE — shared design tokens & breakpoints
 * Responsive-first: mobile base → tablet → laptop → desktop
 */

:root {
    /* Breakpoints (use in media queries; values for reference) */
    --bp-mobile-max: 767px;
    --bp-tablet-min: 768px;
    --bp-tablet-max: 1199px;
    --bp-laptop-min: 1200px;
    --bp-desktop-min: 1440px;

    /* Spacing */
    --container-pad: 40px;
    --section-gap: clamp(5rem, 10vw, 8.75rem);
    --grid-gap: clamp(1.5rem, 2.5vw, 2.5rem);

    /* Typography */
    --font-body: clamp(0.9375rem, 1.6vw, 1rem);
    --font-lead: clamp(1rem, 2vw, 1.0625rem);
    --font-h1: clamp(1.75rem, 5vw, 3.25rem);
    --font-h2: clamp(1.625rem, 4vw, 2.5rem);

    /* Layout — unified site container */
    --container-max: 1280px;
    --header-h: clamp(4.5rem, 10vw, 5.25rem);
}

/* Shared layout container (all pages) */
.site-container,
.container {
    max-width: var(--container-max);
    width: 100%;
    margin: 0 auto;
    padding-left: var(--container-pad);
    padding-right: var(--container-pad);
}

/* CTA button notes — site-wide */
.cta-note-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.cta-note {
    font-size: 13px;
    font-weight: 400;
    color: #777;
    line-height: 1.6;
    text-align: center;
    margin-top: 12px;
    margin-bottom: 40px;
}