@font-face {
    font-family: 'Canela';
    src: url('../assets/fonts/Canela-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Canela';
    src: url('../assets/fonts/Canela-Light.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

:root {
    --c-primary: #44675F;
    --c-secondary: #97AB95;
    --c-accent: #C8AA6E;
    --c-accent2: #7B6557;
    --c-bg: #F2F5F0;
    --c-bg2: #E7ECE6;
    --c-text: #28302D;
    --c-text-muted: rgba(40,48,45,.55);
    --c-text-light: rgba(40,48,45,.32);
    --c-white: #ffffff;
    --c-overlay: rgba(68,103,95,.30);
    --g-hero: linear-gradient(145deg,#44675F 0%,#97AB95 65%,#DCE4DD 100%);
    --g-btn: linear-gradient(135deg,#C8AA6E 0%,#DCC392 100%);
    --g-bg: linear-gradient(180deg,#F2F5F0 0%,#E7ECE6 100%);
    --g-depth: linear-gradient(145deg,#44675F 0%,#6E887F 100%);
    --f-display: 'Canela','Cormorant Garamond',Georgia,serif;
    --f-body: 'Neue Montreal','DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    --f-ui: 'Satoshi',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    --f-location: 'Cormorant Garamond',Georgia,serif;
    --r-sm: 3px;
    --r-md: 8px;
    --r-lg: 16px;
    --r-xl: 24px;
    --r-full: 9999px;
    --sh-sm: 0 1px 6px rgba(40,48,45,.05);
    --sh-md: 0 6px 28px rgba(40,48,45,.09);
    --sh-lg: 0 20px 56px rgba(40,48,45,.12);
    --sh-card: 0 3px 18px rgba(68,103,95,.08);
    --sh-hover: 0 14px 44px rgba(68,103,95,.18);
    --ease-out: cubic-bezier(.25,.46,.45,.94);
    --ease-spring: cubic-bezier(.34,1.56,.64,1);
    --dur-fast: .18s;
    --dur-base: .32s;
    --dur-slow: .58s;
    --container: 1280px;
    --container-narrow: 840px;
    --section-py: clamp(72px,9vw,128px);
    --gap-sm: clamp(16px,2vw,24px);
    --gap-md: clamp(24px,3.5vw,48px);
    --gap-lg: clamp(40px,5.5vw,80px);
    --header-h: 80px;
}

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

html {
    scroll-behavior: smooth;
    overflow-x: hidden;
    max-width: 100vw;
}

body {
    font-family: var(--f-body);
    font-size: clamp(15px,1.1vw,17px);
    line-height: 1.72;
    color: var(--c-text);
    background: var(--c-bg);
    position: relative;
    overflow-x: hidden;
    max-width: 100vw;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
ul,ol { list-style: none; }
button { border: none; background: none; cursor: pointer; font-family: inherit; }
input,textarea,select { font-family: inherit; }
address { font-style: normal; }

h1,h2,h3,h4,h5,h6 {
    font-family: var(--f-display);
    font-weight: 400;
    line-height: 1.1;
    letter-spacing: -.025em;
    color: var(--c-text);
}
h1 { font-size: clamp(2.8rem,7vw,6.5rem); }
h2 { font-size: clamp(1.9rem,4.5vw,4rem); }
h3 { font-size: clamp(1.2rem,2.5vw,1.9rem); }
h4 { font-size: clamp(1rem,1.8vw,1.35rem); }
p { line-height: 1.72; }

.container {
    width: 100%;
    max-width: var(--container);
    margin-inline: auto;
    padding-inline: clamp(20px,5vw,80px);
}

.section-pad { padding-block: var(--section-py); }

.eyebrow {
    font-family: var(--f-ui);
    font-size: .7rem;
    font-weight: 600;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--c-accent);
    display: block;
    margin-bottom: 14px;
}
.eyebrow--light { color: rgba(200,170,110,.85); }
.eyebrow--dark { color: rgba(40,48,45,.5); }

.section-title {
    font-family: var(--f-display);
    font-size: clamp(1.9rem,4.5vw,4rem);
    font-weight: 300;
    line-height: 1.08;
    letter-spacing: -.03em;
}

.location-label {
    font-family: var(--f-location);
    font-style: italic;
    font-size: .9rem;
    color: var(--c-text-muted);
    display: block;
    margin-bottom: 6px;
}

.link-arrow {
    font-family: var(--f-ui);
    font-size: .875rem;
    font-weight: 500;
    color: var(--c-primary);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: gap var(--dur-base) var(--ease-out);
}
.link-arrow::after {
    content: '→';
    display: inline-block;
    transition: transform var(--dur-base) var(--ease-out);
}
.link-arrow:hover::after { transform: translateX(4px); }
.link-arrow--light { color: rgba(255,255,255,.85); }
.link-arrow--light:hover { color: #fff; }

.btn {
    font-family: var(--f-ui);
    font-size: .875rem;
    font-weight: 600;
    letter-spacing: .04em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 14px 32px;
    border-radius: var(--r-full);
    transition: all var(--dur-base) var(--ease-out);
    cursor: pointer;
    text-decoration: none;
    white-space: nowrap;
    border: 2px solid transparent;
    line-height: 1;
}
.btn--primary {
    background: var(--c-primary);
    color: var(--c-white);
    border-color: var(--c-primary);
}
.btn--primary:hover {
    background: #2f5248;
    border-color: #2f5248;
    transform: translateY(-2px);
    box-shadow: var(--sh-hover);
}
.btn--accent {
    background: var(--g-btn);
    color: var(--c-white);
    border: none;
}
.btn--accent:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 32px rgba(200,170,110,.35);
    filter: brightness(1.06);
}
.btn--ghost {
    background: transparent;
    color: var(--c-text);
    border-color: rgba(40,48,45,.28);
}
.btn--ghost:hover {
    border-color: var(--c-primary);
    color: var(--c-primary);
    transform: translateY(-2px);
}
.btn--ghost-light {
    background: transparent;
    color: var(--c-white);
    border-color: rgba(255,255,255,.45);
}
.btn--ghost-light:hover {
    background: rgba(255,255,255,.1);
    border-color: rgba(255,255,255,.85);
    transform: translateY(-2px);
}
.btn--lg {
    padding: 18px 44px;
    font-size: .95rem;
}
.btn--full { width: 100%; }
.btn--underline {
    background: none;
    color: var(--c-primary);
    padding: 0 0 3px;
    border: none;
    border-radius: 0;
    border-bottom: 1.5px solid var(--c-accent);
    font-weight: 500;
    font-size: .9rem;
}
.btn--underline:hover {
    border-bottom-color: var(--c-primary);
    transform: none;
}

.js-reveal {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .65s var(--ease-out), transform .65s var(--ease-out);
}
.js-reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;
}