:root{
  --bg:#0d0d0d;
  --fg:#f0f0f0;
  --card:#1a1a1a;
  --muted:#2b2b2b;
  --danger:#ff4444;

  /* Золотой градиент */
  --gold-grad: linear-gradient(0.07turn, rgba(115, 84, 32, 1) 0%, rgba(222, 188, 104, 1) 100%);
  --gold-grad-soft: linear-gradient(0.07turn, rgba(115, 84, 32, .18) 0%, rgba(222, 188, 104, .18) 100%);
}

*{box-sizing:border-box}
html,body{margin:0; padding:0; background:var(--bg); color:var(--fg); font-family:Arial, sans-serif; line-height:1.6}

/* Шапка с логотипом */
.app-header{
  position:sticky; top:0; z-index:1100; background:var(--bg);
  display:flex; justify-content:center; align-items:center; padding:14px 20px;
}
.app-header::after{
  content:""; position:absolute; left:0; bottom:0; height:3px; width:100%;
  background-image: var(--gold-grad);
}
.logo img{
  max-width:200px; width:200px; min-width:200px; height:auto; display:block;
}

.page-wrap{padding:20px}
#page1,#page2{display:none; max-width:900px; margin:0 auto}
#page1.active,#page2.active{display:block}

/* Заголовки и некоторые иконки — «золотым» градиентом */
h1,h2,h3,.pricing-box h3,.modal-title,.stats i,.social-icons a i{
  background-image: var(--gold-grad);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

input[type="file"], select{
  width:100%; background:var(--card); color:var(--fg);
  border:1px solid transparent; border-image: var(--gold-grad) 1;
  padding:10px; margin-bottom:20px; border-radius:10px;
}

ul{list-style:none; padding:0; margin-bottom:20px}
li{background:var(--card); padding:10px; margin-bottom:10px; border-radius:10px; border:1px solid var(--muted)}

/* Кнопки */
button{
  background-image: var(--gold-grad);
  color:#111; border:none; padding:12px 24px; font-size:16px; cursor:pointer;
  border-radius:12px; transition:filter .25s ease, transform .06s ease;
  box-shadow:0 4px 10px rgba(0,0,0,.35)
}
button:hover{ filter:brightness(1.05) }
button:active{ transform:translateY(1px) }
button:disabled{ background:#555; cursor:not-allowed; box-shadow:none }

.order-btn{ animation:pulse 1.5s infinite ease-in-out }
@keyframes pulse{
  0%{ box-shadow:0 0 0 0 rgba(255,255,255,.35) }
  50%{ box-shadow:0 0 18px 8px rgba(255,255,255,0) }
  100%{ box-shadow:0 0 0 0 rgba(255,255,255,0) }
}

/* Контурная (прозрачная) */
.btn-ghost{
  background:transparent;
  color:transparent; -webkit-background-clip:text; background-clip:text;
  background-image: var(--gold-grad);
  border:1px solid transparent; border-image: var(--gold-grad) 1;
}
.btn-ghost:hover{ background-image: var(--gold-grad-soft) }

.model-info{
  background:var(--card); padding:15px; margin-bottom:20px; border-radius:12px;
  border:1px solid var(--muted); box-shadow:0 4px 10px rgba(0,0,0,.35)
}

img{max-width:100%; border-radius:10px; margin-top:10px}

/* Иконки контактов — без подчеркиваний/линий */
.social-icons{ text-align:center; margin:24px 0 }
.social-icons a{
  display:inline-flex; align-items:center; justify-content:center;
  width:46px; height:46px; border-radius:50%; background:#141414;
  margin:0 8px; transition:transform .2s ease, box-shadow .2s ease;
  text-decoration:none; border-bottom:0; outline:0; box-shadow:none;
}
.social-icons a:hover{ transform:translateY(-2px); box-shadow:0 8px 18px rgba(0,0,0,.35); text-decoration:none; border-bottom:0 }
.social-icons a:focus,.social-icons a:active,.social-icons a:visited{ text-decoration:none; border-bottom:0; outline:0; box-shadow:none }

.error{color:var(--danger); font-weight:700}
.stats{
  position:fixed; bottom:20px; right:20px; background:var(--card);
  padding:10px; border-radius:12px; border:1px solid transparent; border-image: var(--gold-grad) 1;
  box-shadow:0 4px 8px rgba(0,0,0,.3); font-size:14px; z-index:1000
}
.stats p{margin:5px 0; display:flex; align-items:center}

/* Стоимость + кнопка справа */
.result-line{
  display:flex; align-items:center; gap:16px; justify-content:space-between;
  background:var(--card); border:1px solid var(--muted); border-radius:12px;
  padding:12px 14px; margin:14px 0 8px 0; flex-wrap:wrap;
}
.price-line{ font-size:20px; font-weight:700; margin:0 }

/* Итоговый блок (якорь) */
#summary{ scroll-margin-top: 110px; } /* чтобы не пряталось под липкой шапкой */

.result-line{
  display:flex; align-items:center; gap:16px; justify-content:space-between;
  background:var(--card); border:1px solid var(--muted); border-radius:12px;
  padding:12px 14px; margin:14px 0 8px 0; flex-wrap:wrap;
}
.price-line{ font-size:20px; font-weight:700; margin:0 }

/* Верхняя панель результатов */
.toolbar{ display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:10px }
.btn-down{ padding:10px 14px }

/* Тарифы */
.pricing-box{
  background:var(--card);
  border:1px solid transparent; border-image: var(--gold-grad) 1;
  border-radius:12px; padding:15px; margin:16px 0;
  box-shadow:0 4px 10px rgba(0,0,0,.35)
}
.pricing-box ul{list-style:none; padding:0; margin:0}
.pricing-box li{
  padding:8px 10px; border-bottom:1px dashed rgba(255,255,255,.08);
  display:flex; justify-content:space-between
}
.pricing-box li:last-child{border-bottom:none}
.pricing-box .unit{opacity:.75; margin-left:4px}

/* Литейные мастерские */
.foundries-box{
  background:var(--card);
  border:1px solid transparent; border-image: var(--gold-grad) 1;
  border-radius:12px; padding:18px; margin:20px 0 8px;
  box-shadow:0 4px 10px rgba(0,0,0,.35)
}
.foundries-lead{ margin:6px 0 12px }
.foundries-list{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px }
.foundries-list li{
  background:#141414; border:1px solid var(--muted); border-radius:10px; padding:10px 12px;
  display:flex; align-items:center; gap:10px
}
.foundries-list i{ font-size:16px; background-image: var(--gold-grad); -webkit-background-clip:text; background-clip:text; color:transparent }
@media (max-width:600px){
  .foundries-list{ grid-template-columns:1fr }
}

/* ===== Модалка ===== */
.modal-backdrop{
  position:fixed; inset:0; background:rgba(0,0,0,.6);
  display:none; align-items:center; justify-content:center; z-index:2000;
  opacity:0; transition:opacity .2s ease-out;
}
.modal-backdrop.show{ display:flex; opacity:1; }
.modal{
  width:min(520px,92vw); background:var(--card);
  border:1px solid transparent; border-image: var(--gold-grad) 1;
  border-radius:16px; box-shadow: 0 20px 50px rgba(0,0,0,.55);
  overflow:hidden; transform:translateY(20px); transition:transform .2s ease-out;
}
.modal-backdrop.show .modal{ transform:translateY(0) }
.modal-header{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 16px; border-bottom:1px solid var(--muted);
  background-image: var(--gold-grad-soft);
}
.modal-title{ margin:0; font-size:18px }
.modal-close{ background:transparent; border:none; color:var(--fg); font-size:20px; cursor:pointer; }
.modal-body{ padding:16px }
.contact-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.contact-btn{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:8px; padding:14px 10px; border-radius:12px; border:1px solid var(--muted);
  background:#171717; color:var(--fg); text-decoration:none; transition:.2s;
  box-shadow:0 2px 12px rgba(0,0,0,.2);
}
.contact-btn:hover{ transform:translateY(-2px); box-shadow:0 6px 18px rgba(0,0,0,.35); border-image: var(--gold-grad) 1; border:1px solid transparent; }
.contact-btn i{ font-size:22px; background-image: var(--gold-grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
.contact-caption{ opacity:.85; font-size:13px; text-align:center }
.modal-footer{ padding:12px 16px; border-top:1px solid var(--muted); display:flex; justify-content:flex-end }
.modal-footer .btn-ghost{ padding:8px 12px; border-radius:8px }

/* Mobile */
@media (max-width:600px){
  .page-wrap{padding:10px}
  button{width:100%; padding:15px; font-size:18px}
  .model-info{padding:10px}
  .social-icons a{ width:48px; height:48px }
  .stats{ bottom:10px; right:10px; font-size:12px; padding:8px }
  .result-line{ flex-direction:column; align-items:flex-start }
  .contact-grid{ grid-template-columns:1fr }
}