:root{
  --bg:#171614;
  --bg-2:#1f1d1a;
  --bg-3:#26231f;
  --panel:#22201d;
  --panel-2:#2a2723;
  --line:rgba(224,214,196,.10);
  --line-strong:rgba(224,214,196,.18);
  --text:#f3eee6;
  --muted:#b7afa2;
  --accent:#b79a72;
  --accent-2:#d1b187;
  --accent-soft:rgba(183,154,114,.14);
  --success:#9ac4a1;
  --danger:#d79c96;
  --shadow:0 30px 90px rgba(0,0,0,.34);
  --shadow-soft:0 18px 46px rgba(0,0,0,.24);
  --radius:22px;
  --container:1220px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--text);
  font-family:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  background:
    radial-gradient(circle at top left, rgba(183,154,114,.12), transparent 24%),
    radial-gradient(circle at top right, rgba(255,255,255,.04), transparent 22%),
    linear-gradient(180deg,#141311 0%,#191714 36%,#1d1b18 100%);
  letter-spacing:.01em;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(rgba(255,255,255,.016),rgba(255,255,255,0)),
    repeating-linear-gradient(
      90deg,
      rgba(255,255,255,.012) 0,
      rgba(255,255,255,.012) 1px,
      transparent 1px,
      transparent 120px
    );
  opacity:.35;
}
a{color:inherit;text-decoration:none}
button,input,textarea{font:inherit}
.container{max-width:var(--container);margin:0 auto;padding:0 24px}
.topbar{
  position:sticky;
  top:0;
  z-index:30;
  border-bottom:1px solid var(--line);
  background:rgba(20,19,17,.80);
  backdrop-filter:blur(18px);
}
.topbar-inner{
  min-height:84px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}
.brand{
  display:flex;
  align-items:center;
  gap:14px;
  font-weight:800;
}
.brand-mark{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  border-radius:14px;
  color:#161412;
  font-weight:800;
  background:linear-gradient(135deg,#c8ab80,#8e7350);
  box-shadow:0 10px 26px rgba(183,154,114,.26);
}
.brand-text{
  font-size:20px;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.topnav{
  display:flex;
  align-items:center;
  gap:28px;
  color:var(--muted);
  font-size:14px;
}
.topnav a:hover{color:var(--text)}
.topbar-actions{
  display:flex;
  align-items:center;
  gap:12px;
}
.solid-btn,.ghost-btn,.wide-btn{
  border:none;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:14px 22px;
  border-radius:16px;
  font-weight:700;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
}
.solid-btn{
  color:#171411;
  background:linear-gradient(135deg,#d3b48c 0%,#9c7f58 100%);
  box-shadow:0 16px 40px rgba(183,154,114,.24);
}
.solid-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 22px 44px rgba(183,154,114,.30);
}
.ghost-btn{
  color:var(--text);
  background:rgba(255,255,255,.02);
  border:1px solid var(--line-strong);
}
.ghost-btn:hover{
  background:rgba(255,255,255,.05);
}
.hero{
  padding:92px 0 58px;
}
.hero-grid{
  display:grid;
  grid-template-columns:1.12fr .88fr;
  gap:34px;
  align-items:stretch;
}
.eyebrow{
  display:inline-flex;
  align-items:center;
  min-height:36px;
  padding:0 14px;
  border-radius:999px;
  border:1px solid rgba(183,154,114,.22);
  background:var(--accent-soft);
  color:#dcc19a;
  font-size:12px;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
  margin-bottom:18px;
}
.hero-copy h1{
  margin:0 0 20px;
  max-width:760px;
  font-size:66px;
  line-height:.98;
  font-weight:800;
  letter-spacing:-.05em;
}
.hero-text{
  margin:0 0 30px;
  max-width:700px;
  color:var(--muted);
  font-size:19px;
  line-height:1.78;
}
.hero-actions{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  margin-bottom:32px;
}
.hero-points{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.point-card,
.preview-card,
.metric-card,
.step-card,
.case-card,
.benefit-card,
.tariff-card,
.note-card,
.faq-card,
.lead-form{
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.015)),
    linear-gradient(180deg,#26231f,#201d1a);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow-soft);
}
.point-card::before,
.preview-card::before,
.metric-card::before,
.step-card::before,
.case-card::before,
.benefit-card::before,
.tariff-card::before,
.note-card::before,
.faq-card::before,
.lead-form::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(209,177,135,.42),transparent);
}
.point-card{padding:20px}
.point-card strong,
.metric-card strong,
.note-card strong{
  display:block;
  margin-bottom:8px;
  font-size:15px;
  letter-spacing:.02em;
}
.point-card span,
.metric-card span,
.note-card span{
  color:var(--muted);
  font-size:14px;
  line-height:1.65;
}
.hero-preview{display:grid;gap:16px}
.preview-main{
  min-height:260px;
  padding:30px;
}
.preview-badge{
  display:inline-flex;
  min-height:34px;
  align-items:center;
  padding:0 12px;
  border-radius:999px;
  background:rgba(255,255,255,.04);
  border:1px solid var(--line);
  color:#dcc19a;
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-weight:700;
}
.preview-main h3{
  margin:18px 0 12px;
  font-size:30px;
  line-height:1.15;
}
.preview-main p{
  margin:0;
  color:var(--muted);
  line-height:1.8;
}
.preview-stack{
  display:grid;
  gap:14px;
}
.preview-stack .preview-card{padding:22px}
.preview-stack span{
  display:block;
  margin-bottom:10px;
  font-size:12px;
  color:#cbb89a;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.preview-stack strong{
  font-size:17px;
  line-height:1.55;
  font-weight:600;
}
.metrics{padding:0 0 34px}
.metrics-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
}
.metric-card{padding:22px}
.section{
  padding:74px 0;
}
.section.alt{
  background:linear-gradient(180deg,rgba(255,255,255,.016),rgba(255,255,255,.008));
  border-top:1px solid rgba(255,255,255,.025);
  border-bottom:1px solid rgba(255,255,255,.025);
}
.section-head{
  margin-bottom:30px;
}
.section-head h2{
  margin:0 0 12px;
  font-size:42px;
  line-height:1.06;
  letter-spacing:-.04em;
}
.section-head p{
  margin:0;
  color:var(--muted);
  line-height:1.7;
}
.steps-grid,
.benefits-grid,
.faq-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.step-card,
.benefit-card,
.faq-card{
  padding:26px;
}
.step-num{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  margin-bottom:18px;
  border-radius:14px;
  color:#171411;
  background:linear-gradient(135deg,#d3b48c 0%,#8f7453 100%);
  font-weight:800;
  box-shadow:0 16px 30px rgba(183,154,114,.18);
}
.step-card h3,
.benefit-card h3,
.faq-card h3,
.case-card h3{
  margin:0 0 12px;
  font-size:22px;
  line-height:1.28;
}
.step-card p,
.benefit-card p,
.faq-card p{
  margin:0;
  color:var(--muted);
  line-height:1.75;
}
.cases-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px;
}
.case-card{padding:30px}
.case-tag{
  display:inline-flex;
  min-height:34px;
  align-items:center;
  padding:0 12px;
  border-radius:999px;
  border:1px solid var(--line-strong);
  background:rgba(255,255,255,.03);
  color:#dcc19a;
  font-size:12px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  margin-bottom:16px;
}
.case-card ul{
  margin:0;
  padding-left:18px;
  color:var(--muted);
  line-height:1.9;
}
.tariffs-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.tariff-card{
  padding:28px;
}
.tariff-card h3{
  margin:0 0 10px;
  font-size:24px;
}
.tariff-card .price{
  font-size:38px;
  font-weight:800;
  margin-bottom:12px;
  color:#ecd8bb;
}
.tariff-card .meta{
  color:var(--muted);
  line-height:1.8;
}
.loading-card{
  min-height:170px;
  display:grid;
  place-items:center;
  color:var(--muted);
}
.lead-grid{
  display:grid;
  grid-template-columns:.98fr 1.02fr;
  gap:22px;
  align-items:start;
}
.lead-copy p{
  margin:0 0 22px;
  color:var(--muted);
  line-height:1.82;
}
.lead-notes{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.note-card{padding:18px}
.lead-form{
  padding:26px;
  display:grid;
  gap:16px;
}
.lead-form label{
  display:grid;
  gap:8px;
}
.lead-form span{
  color:#dcc19a;
  font-size:13px;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.lead-form input,
.lead-form textarea{
  width:100%;
  border:none;
  outline:none;
  padding:16px 16px;
  border-radius:16px;
  color:var(--text);
  background:#151412;
  border:1px solid rgba(224,214,196,.10);
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.lead-form input:focus,
.lead-form textarea:focus{
  border-color:rgba(183,154,114,.52);
  box-shadow:0 0 0 4px rgba(183,154,114,.10);
  background:#181613;
}
.wide-btn{width:100%}
.form-status{
  padding:14px 16px;
  border-radius:16px;
  background:rgba(255,255,255,.03);
  color:var(--muted);
  border:1px solid var(--line);
}
.form-status.success{
  color:#e6f4e9;
  background:rgba(154,196,161,.10);
  border-color:rgba(154,196,161,.24);
}
.form-status.error{
  color:#f4e1df;
  background:rgba(215,156,150,.10);
  border-color:rgba(215,156,150,.24);
}
.footer{
  padding:28px 0 42px;
  border-top:1px solid var(--line);
  background:rgba(255,255,255,.015);
}
.footer-inner{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
}
.footer-inner p{
  margin:10px 0 0;
  color:var(--muted);
}
.footer-links{
  display:flex;
  gap:18px;
  color:var(--muted);
}
.footer-links a:hover{color:var(--text)}

@media (max-width:1100px){
  .hero-grid,.lead-grid,.cases-grid{grid-template-columns:1fr}
  .hero-points,.metrics-grid,.steps-grid,.benefits-grid,.tariffs-grid,.faq-grid,.lead-notes{grid-template-columns:repeat(2,1fr)}
  .hero-copy h1{font-size:52px}
}
@media (max-width:760px){
  .topbar-inner{flex-wrap:wrap;padding:14px 0}
  .topnav{order:3;width:100%;overflow:auto}
  .topbar-actions{width:100%}
  .topbar-actions a{flex:1}
  .hero{padding-top:48px}
  .hero-copy h1{font-size:38px}
  .section-head h2{font-size:31px}
  .hero-points,.metrics-grid,.steps-grid,.benefits-grid,.tariffs-grid,.faq-grid,.lead-notes{grid-template-columns:1fr}
  .footer-inner{flex-direction:column}
}
