:root{
  --bg: #ffffff;
  --text: #0f172a;
  --muted: #6b7280;
  --border: #e5e7eb;

  --primary: #1A2B45;
  --primary-2: #A28D69;

  --card: #ffffff;
  --soft: #f8f7f4;

  --radius: 10px;
  --shadow: 0 10px 25px rgba(26, 43, 69, 0.08);

  --container: 1120px;
  --header-offset: 84px;
}

*{ box-sizing: border-box; }
html,body{ height: 100%; }
body{
  margin: 0;
  padding-top: var(--header-offset);
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
  line-height: 1.7;
  color: var(--text);
  background: var(--bg);
}

img{ max-width: 100%; display: block; }
a{ color: inherit; text-decoration: none; }

.container{
  width: min(var(--container), calc(100% - 40px));
  margin-inline: auto;
}

.muted{ color: var(--muted); }

.kicker{
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 12px;
  color: var(--muted);
  margin: 0 0 10px;
}

h1{ font-size: clamp(32px, 4vw, 44px); line-height: 1.08; margin: 0 0 10px; }
h2{ font-size: 26px; line-height: 1.2; margin: 0 0 6px; }
h3{ font-size: 16px; line-height: 1.35; margin: 0 0 6px; }
p{ margin: 0; font-size: 15px; line-height: 1.7; }

.section{ padding: 56px 0; }
.section-light{ background: var(--soft); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }

@media (max-width: 900px){
  .section{ padding: 48px 0; }
}

@media (max-width: 640px){
  .container{
    width: min(var(--container), calc(100% - 24px));
  }
  h1{ font-size: clamp(28px, 8vw, 36px); }
  h2{ font-size: 24px; }
  p{ font-size: 14px; }
}