:root {
    --green-700: #2f4f3e;
    --green-600: #4f6f52;
    --brown-600: #8a6e58;
    --gold-500: #c8a04d;
    --beige-100: #f7f4ef;
    --text-900: #222222;
    --text-700: #4a4a4a;
    --white: #ffffff;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji"; color: var(--text-900); background: var(--white); }

.container { max-width: 1100px; margin: 0 auto; padding: 0 24px; }

.header { position: sticky; top: 0; background: rgba(255, 255, 255, 0.9); backdrop-filter: saturate(180%) blur(10px); border-bottom: 1px solid #e8e4dc; z-index: 20; }
.header__inner { display: flex; align-items: center; justify-content: space-between; height: 64px; }
.logo { display: inline-flex; align-items: center; gap: 8px; font-family: "Playfair Display", serif; font-size: 22px; color: var(--green-700); text-decoration: none; }
.logo-img { height: 40px; }
.logo span { vertical-align: middle; }
.logo span { color: var(--gold-500); }
.nav { display: flex; gap: 18px; }
.nav a { color: var(--text-700); text-decoration: none; font-weight: 500; }
.nav a:hover { color: var(--green-600); }
.nav-toggle { display: none; border: none; background: transparent; font-size: 22px; }

.hero { position: relative; min-height: 72vh; display: grid; place-items: center; }
.hero__bg { position: absolute; inset: 0; }
.hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(1.02); }
.hero__overlay { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(rgba(47, 79, 62, 0.08), rgba(47, 79, 62, 0.06)); }
.hero__content { position: relative; text-align: center; color: var(--white); padding: 40px 0; }
.hero h1 { font-family: "Playfair Display", serif; font-size: clamp(28px, 4vw, 48px); margin: 0 0 12px; }
.hero p { font-size: clamp(16px, 2.2vw, 20px); opacity: 0.95; }
.hero__cta { margin-top: 20px; display: flex; gap: 12px; justify-content: center; }

.btn { display: inline-block; padding: 12px 18px; border-radius: 8px; text-decoration: none; font-weight: 600; }
.btn--primary { background: var(--gold-500); color: var(--white); }
.btn--primary:hover { background: #b48f41; }
.btn--outline { border: 2px solid var(--beige-100); color: var(--white); }
.btn--outline:hover { background: rgba(255, 255, 255, 0.12); }

.section { padding: 64px 0; }
.section--alt { background: var(--beige-100); }
.section__header h2 { font-family: "Playfair Display", serif; font-size: 30px; margin: 0 0 8px; color: var(--green-700); }
.section__header p { color: var(--text-700); margin: 0 0 24px; }

.grid { display: grid; gap: 24px; }
.grid--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 900px) { .grid--three { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .grid--two, .grid--three { grid-template-columns: 1fr; } }

.card { background: var(--white); border: 1px solid #eee8de; border-radius: 12px; overflow: hidden; }
.card--image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.card--service { padding: 18px; }
.card--service h3 { margin: 0 0 8px; color: var(--brown-600); }
.card--service p { margin: 0; color: var(--text-700); }
.card--form { padding: 18px; }

.quote { border-left: 4px solid var(--gold-500); padding-left: 12px; margin: 12px 0; color: var(--brown-600); font-style: italic; }

.list { padding-left: 18px; color: var(--text-700); }

.filters { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; margin-bottom: 16px; }
.filters label { display: grid; gap: 6px; color: var(--text-700); font-size: 14px; }
.filters select, .filters input[type="range"] { padding: 8px; border-radius: 8px; border: 1px solid #ddd0c2; }

.horse-card { display: flex; flex-direction: column; }
.horse-card img { width: 100%; height: 180px; object-fit: cover; }
.horse-card__body { padding: 12px; }
.horse-card__title { margin: 0 0 6px; font-weight: 700; color: var(--green-700); }
.horse-card__meta { font-size: 14px; color: var(--text-700); margin-bottom: 8px; }
.horse-card__price { font-weight: 600; color: var(--gold-500); }

.gallery-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.gallery-item img { width: 100%; height: 160px; object-fit: cover; border-radius: 10px; }
@media (max-width: 900px) { .gallery-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 700px) { .gallery-grid { grid-template-columns: repeat(2, 1fr); } }

.lightbox { position: fixed; inset: 0; background: rgba(0, 0, 0, 0.7); display: grid; place-items: center; z-index: 999; }
.lightbox[hidden] { display: none !important; }
.lightbox__img { max-width: 90vw; max-height: 80vh; border-radius: 8px; }
.lightbox__close { position: absolute; top: 20px; right: 20px; font-size: 28px; border: none; background: transparent; color: var(--white); }

.form-control { display: grid; gap: 8px; margin-bottom: 12px; }
.form-control input, .form-control textarea { padding: 10px 12px; border: 1px solid #ddd0c2; border-radius: 8px; font-size: 14px; }
.form-control input:focus, .form-control textarea:focus { outline: 2px solid #c8a04d33; }

.footer { background: var(--green-700); color: var(--white); padding: 20px 0; }
.footer__inner { display: flex; justify-content: space-between; align-items: center; }
.footer__links { display: flex; gap: 12px; }
.footer__links a { color: #f3ead9; text-decoration: none; }

@media (max-width: 860px) {
    .nav-toggle { display: block; }
    .nav { position: absolute; top: 64px; left: 0; right: 0; background: var(--white); border-bottom: 1px solid #eee8de; display: none; flex-direction: column; padding: 12px 24px; }
    .nav a { padding: 8px 0; }
    .nav.open { display: flex; }
}
