/* ============================================================
   V7 — Dark Minimal
   Ultra-minimální dark, velká typografie, khaki akcenty
   ============================================================ */
:root {
  --color-primary:       #C8B56E;
  --color-primary-dark:  #A89650;
  --color-primary-light: #DDD0A0;
  --color-accent:        #C8B56E;
  --color-text:          #E5DFD3;
  --color-text-muted:    #7A7468;
  --color-bg:            #111110;
  --color-bg-alt:        #1A1918;
  --color-bg-dark:       #0A0A09;
  --color-border:        rgba(200,181,110,0.15);

  --font-sans: 'Space Grotesk', system-ui, sans-serif;

  --text-xs: 0.75rem; --text-sm: 0.875rem; --text-base: 1rem;
  --text-lg: 1.125rem; --text-xl: 1.25rem; --text-2xl: 1.5rem;
  --text-3xl: 2rem; --text-4xl: 2.5rem; --text-5xl: 4rem;

  --space-xs: 0.5rem; --space-sm: 1rem; --space-md: 1.5rem;
  --space-lg: 2.5rem; --space-xl: 4rem; --space-2xl: 7rem;

  --container: 1280px;
  --radius-sm: 0; --radius-md: 0;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px; }
body { font-family: var(--font-sans); font-size: var(--text-base); color: var(--color-text); background: var(--color-bg); line-height: 1.6; min-width: 1440px; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
.container { width: 100%; max-width: var(--container); margin: 0 auto; padding: 0 2.5rem; }

.h1 { font-size: var(--text-5xl); font-weight: 700; line-height: 1.0; letter-spacing: -0.04em; color: #fff; }
.h2 { font-size: var(--text-3xl); font-weight: 700; line-height: 1.2; color: #fff; }
.h3 { font-size: var(--text-xl); font-weight: 600; line-height: 1.3; }
.accent { color: var(--color-primary); }
.perex { font-size: var(--text-lg); color: var(--color-text-muted); max-width: 520px; line-height: 1.8; }

.btn {
  display: inline-flex; align-items: center; gap: var(--space-xs);
  padding: 0.85rem 2rem; font-size: var(--text-base); font-weight: 600;
  transition: all 0.2s; cursor: pointer; border: 2px solid transparent;
}
.btn-primary { background: var(--color-primary); color: var(--color-bg); }
.btn-primary:hover { background: var(--color-primary-light); }
.btn-ghost { background: transparent; color: var(--color-primary); border-color: var(--color-border); }
.btn-ghost:hover { border-color: var(--color-primary); }
.btn-dark { background: var(--color-bg); color: var(--color-primary); border: 1px solid var(--color-border); }
.btn-dark:hover { background: var(--color-bg-alt); }

.placeholder-img { width: 100%; height: 100%; min-height: 360px; background: var(--color-bg-alt); border: 1px dashed var(--color-border); display: flex; align-items: center; justify-content: center; color: var(--color-text-muted); font-size: var(--text-sm); }

/* NAV — ultra minimal */
.nav { position: sticky; top: 0; z-index: 100; background: rgba(17,17,16,0.92); backdrop-filter: blur(14px); border-bottom: 1px solid var(--color-border); }
.nav-inner { display: flex; align-items: center; justify-content: space-between; height: 60px; }
.logo { font-size: var(--text-lg); font-weight: 700; color: var(--color-primary); letter-spacing: 0.02em; }
.nav-links { display: flex; align-items: center; gap: var(--space-lg); }
.nav-links a { color: var(--color-text-muted); font-weight: 500; font-size: var(--text-sm); transition: color 0.2s; }
.nav-links a:hover { color: var(--color-text); }
.nav-back { color: var(--color-text-muted) !important; border-right: 1px solid var(--color-border); padding-right: var(--space-lg); margin-right: calc(-1 * var(--space-xs)); }

/* HERO — oversized */
.hero { padding: var(--space-2xl) 0; }
.hero .container { display: flex; flex-direction: column; gap: var(--space-lg); }
.hero .h1 { max-width: 900px; }
.hero .perex { max-width: 560px; }

/* SERVICES — horizontal */
.services { padding: var(--space-2xl) 0; border-top: 1px solid var(--color-border); }
.service-list { display: flex; flex-direction: column; }
.service-item {
  display: grid; grid-template-columns: 200px 1fr; gap: var(--space-xl);
  padding: var(--space-lg) 0;
  border-bottom: 1px solid var(--color-border);
  align-items: start;
}
.service-item:last-child { border-bottom: none; }
.service-item h3 { color: var(--color-primary); font-size: var(--text-xl); }
.service-item p { color: var(--color-text-muted); line-height: 1.7; max-width: 640px; }

/* TESTIMONIAL — single */
.testimonial { padding: var(--space-2xl) 0; border-top: 1px solid var(--color-border); }
.testimonial-inner { max-width: 800px; display: flex; flex-direction: column; gap: var(--space-md); }
.testimonial-quote { font-size: var(--text-2xl); font-style: italic; color: var(--color-text-muted); line-height: 1.6; }
.testimonial-author { display: flex; align-items: center; gap: var(--space-sm); }
.avatar { width: 44px; height: 44px; border-radius: 50%; background: var(--color-border); flex-shrink: 0; }
.testimonial-author strong { display: block; font-size: var(--text-sm); color: var(--color-text); }
.testimonial-author span { font-size: var(--text-xs); color: var(--color-text-muted); }

/* CTA */
.cta-banner { padding: var(--space-2xl) 0; background: var(--color-primary); }
.cta-banner .container { display: flex; align-items: center; justify-content: space-between; gap: var(--space-lg); }
.cta-banner .h2 { color: var(--color-bg); }
.cta-banner p { font-size: var(--text-lg); color: var(--color-primary-dark); margin-top: var(--space-xs); }

/* FOOTER */
.footer { padding: var(--space-xl) 0 var(--space-lg); border-top: 1px solid var(--color-border); }
.footer-inner { display: flex; justify-content: space-between; align-items: center; padding-bottom: var(--space-lg); border-bottom: 1px solid var(--color-border); margin-bottom: var(--space-md); }
.footer-brand { display: flex; flex-direction: column; gap: 0.35rem; }
.footer-brand p { color: var(--color-text-muted); font-size: var(--text-sm); }
.footer-links-row { display: flex; gap: var(--space-lg); }
.footer-links-row a { color: var(--color-text-muted); font-size: var(--text-sm); transition: color 0.2s; }
.footer-links-row a:hover { color: var(--color-primary); }
.footer-bottom p { font-size: var(--text-sm); color: var(--color-text-muted); opacity: 0.4; }