:root {
  --bg: #12100e;
  --paper: #f4efe8;
  --ink: #171411;
  --muted: #6d645c;
  --wood: #6a4428;
  --wood-deep: #3a2416;
  --line: rgba(23, 20, 17, 0.12);
  --cta: #6a4428;
  --cta-hover: #52331d;
  --display: "Cormorant Garamond", Georgia, serif;
  --sans: "Outfit", "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body.site {
  margin: 0;
  font-family: var(--sans);
  color: var(--ink);
  background: var(--paper);
  line-height: 1.45;
}

img { max-width: 100%; display: block; height: auto; }

.lang-switch {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 20;
  background: rgba(244, 239, 232, 0.88);
  backdrop-filter: blur(8px);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: .35rem .7rem;
  font-size: .85rem;
  letter-spacing: .04em;
}
.lang-switch a { color: var(--muted); text-decoration: none; padding: 0 .2rem; }
.lang-switch a.is-active { color: var(--ink); font-weight: 600; }

.hero {
  position: relative;
  min-height: 100svh;
  display: grid;
  align-items: end;
  color: #f7f2eb;
  overflow: hidden;
}
.hero-media {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(0deg, rgba(18,16,14,.72) 0%, rgba(18,16,14,.25) 45%, rgba(18,16,14,.35) 100%),
    var(--hero-image) center/cover no-repeat,
    linear-gradient(135deg, #3a2416, #8b5e3c 55%, #1c1410);
}
.hero-overlay { position: absolute; inset: 0; pointer-events: none; }
.hero-content {
  position: relative;
  z-index: 1;
  padding: 4.5rem 1.25rem 3rem;
  max-width: 720px;
  animation: heroIn .9s ease both;
}
@keyframes heroIn {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}
.brand-mark {
  font-family: var(--display);
  font-size: clamp(2rem, 6vw, 3.2rem);
  margin: 0 0 .6rem;
  letter-spacing: .02em;
  font-weight: 600;
}
.hero h1 {
  font-family: var(--display);
  font-weight: 500;
  font-size: clamp(1.8rem, 5.5vw, 3rem);
  line-height: 1.12;
  margin: 0 0 .85rem;
  max-width: 14ch;
}
.hero-sub {
  margin: 0 0 1.4rem;
  max-width: 36ch;
  color: rgba(247, 242, 235, 0.88);
  font-size: 1.02rem;
}

.btn-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--cta);
  color: #fff;
  text-decoration: none;
  border: 0;
  border-radius: 999px;
  padding: .95rem 1.35rem;
  font: 500 1rem/1 var(--sans);
  cursor: pointer;
  transition: background .2s ease, transform .2s ease;
}
.btn-cta:hover { background: var(--cta-hover); transform: translateY(-1px); }
.btn-cta-secondary {
  background: transparent;
  color: var(--wood-deep);
  border: 1px solid rgba(58, 36, 22, 0.35);
}
.btn-cta-secondary:hover { background: rgba(106, 68, 40, 0.08); }

.section { padding: 4rem 1.25rem; }
.section-inner { max-width: 1100px; margin: 0 auto; }
.section h2 {
  font-family: var(--display);
  font-size: clamp(1.7rem, 4vw, 2.4rem);
  font-weight: 500;
  margin: 0 0 .6rem;
  line-height: 1.15;
}
.section-sub {
  margin: 0 0 2rem;
  color: var(--muted);
  max-width: 42ch;
}

.proof { background: #ebe4da; }
.proof-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
}
@media (min-width: 700px) {
  .proof-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1000px) {
  .proof-grid { grid-template-columns: repeat(4, 1fr); }
}
.proof-item {
  margin: 0;
  background: #fff;
  overflow: hidden;
  animation: rise .7s ease both;
}
.proof-item:nth-child(2) { animation-delay: .08s; }
.proof-item:nth-child(3) { animation-delay: .16s; }
.proof-item:nth-child(4) { animation-delay: .24s; }
@keyframes rise {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}
.proof-item img {
  aspect-ratio: 4/5;
  object-fit: cover;
  width: 100%;
  background: linear-gradient(145deg, #d7c4ae, #8b5e3c);
}
.proof-item figcaption {
  padding: .85rem .9rem 1rem;
  display: grid;
  gap: .15rem;
}
.proof-item strong { font-size: .95rem; }
.proof-item span { color: var(--muted); font-size: .85rem; }
.proof-item em { font-style: normal; font-size: .82rem; color: #85786c; }

.benefits { background: var(--paper); }
.benefit-list {
  list-style: none;
  padding: 0;
  margin: 0 0 1.75rem;
  display: grid;
  gap: .85rem;
  max-width: 520px;
}
.benefit-list li {
  font-size: 1.15rem;
  padding-left: 1.1rem;
  border-left: 2px solid var(--wood);
}

.other { background: #1d1814; color: #f3ebe2; }
.other .section-sub { color: rgba(243, 235, 226, 0.7); }
.other-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
}
.other-list li {
  border: 1px solid rgba(243, 235, 226, 0.22);
  padding: .55rem .85rem;
  font-size: .92rem;
}

.offer {
  background:
    linear-gradient(180deg, rgba(244,239,232,.92), rgba(244,239,232,.97)),
    radial-gradient(circle at 20% 20%, #dcc9b2, transparent 45%);
  text-align: left;
}
.offer-inner { max-width: 640px; }

.trial { background: #fff; }
.trial-form {
  display: grid;
  gap: .9rem;
  max-width: 480px;
}
.trial-form label { display: grid; gap: .35rem; font-size: .92rem; }
.trial-form input,
.trial-form textarea {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: .8rem .85rem;
  font: inherit;
  background: #faf7f3;
}
.trial-form .hp {
  position: absolute;
  left: -9999px;
  opacity: 0;
  height: 0;
  width: 0;
}
.form-success {
  background: #e7f4ec;
  color: #1f6b4a;
  padding: .85rem 1rem;
  border-radius: 10px;
  margin-bottom: 1rem;
}
.form-error {
  background: #fdecec;
  color: #9b2c2c;
  padding: .85rem 1rem;
  border-radius: 10px;
  margin-bottom: 1rem;
}

.site-footer {
  padding: 1.5rem 1.25rem 2.5rem;
  color: var(--muted);
  font-size: .9rem;
  border-top: 1px solid var(--line);
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .btn-cta { transition: none; }
  .hero-content, .proof-item { animation: none; }
}