/* ============================================================
   ARGON — Страница: Сварка чугуна и литья в Челябинске.
   Загружается после ../../style.css
   ============================================================ */

:root{
  --sec-pad:clamp(72px,9vw,120px);
}

.eyebrow--light{ color:rgba(255,255,255,0.5); }
.eyebrow--light::before{ background:rgba(255,255,255,0.2); }

.btn{
  font-size:1rem;
  padding:15px 28px;
  border-radius:100px;
  cursor:pointer;
  text-decoration:none;
}
.btn--primary{ border-color:var(--accent); }
.btn--primary:hover{ border-color:#a81515; }
.btn--outline-light{ background:transparent; color:#fff; border-color:rgba(255,255,255,0.35); }
.btn--outline-light:hover{ border-color:#fff; }

.sec-head{ max-width:none; margin-bottom:clamp(40px,5vw,72px); }
.sec-head h2{ margin-top:16px; }
.sec-head .lead{ margin-top:18px; font-size:1.08rem; max-width:640px; }

/* ============================================================
   HERO (inner page)
   ============================================================ */
.page-hero{
  background:var(--dark);
  min-height:400px;
  display:flex;
  align-items:center;
  padding-block:72px 80px;
}
.page-hero__inner{
  display:grid;
  grid-template-columns:1fr 360px;
  gap:48px;
  align-items:center;
}
.breadcrumbs{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  margin-bottom:24px;
  font-size:.82rem; color:rgba(255,255,255,0.45);
}
.breadcrumbs a{ color:rgba(255,255,255,0.45); transition:color .15s; }
.breadcrumbs a:hover{ color:rgba(255,255,255,0.8); }
.breadcrumbs__sep{ color:rgba(255,255,255,0.2); }
.breadcrumbs__current{ color:rgba(255,255,255,0.7); }

.page-hero__label{
  font-size:.78rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--accent); margin-bottom:16px;
}
.page-hero__h1{
  font-size:clamp(1.8rem,3.4vw,2.7rem);
  font-weight:900;
  letter-spacing:-0.022em;
  color:#fff;
  line-height:1.12;
  margin-bottom:20px;
}
.page-hero__desc{
  font-size:1.05rem;
  line-height:1.65;
  color:rgba(255,255,255,0.65);
  max-width:520px;
  margin-bottom:36px;
}
.page-hero__cta-row{
  display:flex; align-items:center; gap:20px; flex-wrap:wrap;
}
.page-hero__note{
  font-size:.84rem;
  color:rgba(255,255,255,0.4);
  line-height:1.5;
}
.page-hero__note a{ color:rgba(255,255,255,0.55); border-bottom:1px solid rgba(255,255,255,0.2); }
.page-hero__note a:hover{ color:#fff; border-color:#fff; }

.hero-stat-card{
  background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.1);
  border-radius:16px;
  padding:8px 32px;
}
.hero-stat-card__item{
  display:flex; flex-direction:column;
  padding:18px 0;
  border-bottom:1px solid rgba(255,255,255,0.08);
}
.hero-stat-card__item:last-child{ border-bottom:none; }
.hero-stat-card__num{
  font-size:2.2rem;
  font-weight:800;
  color:var(--accent);
  line-height:1;
  letter-spacing:-0.02em;
}
.hero-stat-card__label{
  font-size:.9rem;
  color:rgba(255,255,255,0.6);
  margin-top:5px;
}

/* ============================================================
   FEATURES STRIP
   ============================================================ */
.features-strip{
  background:var(--panel);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding-block:40px;
}
.features-strip__grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
}
.feature-item{
  display:flex;
  align-items:center;
  gap:16px;
  padding:0 28px;
  border-right:1px solid var(--line);
}
.feature-item:first-child{ padding-left:0; }
.feature-item:last-child{ border-right:none; }
.feature-item__icon{
  width:44px; height:44px; flex-shrink:0;
  background:#fff;
  border-radius:10px;
  border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
  color:var(--accent);
}
.feature-item__icon svg{ width:22px; height:22px; stroke-width:1.8; }
.feature-item__title{ font-weight:700; font-size:.97rem; line-height:1.3; color:var(--ink); }
.feature-item__sub{ font-size:.82rem; color:var(--ink-3); margin-top:2px; }

/* ============================================================
   SECTION MODIFIERS
   ============================================================ */
.section--dark{ background:var(--dark); border-top:none; }
.section--panel{ background:var(--panel); }
.section--dark .sec-head h2{ color:#fff; }
.section--dark .sec-head .lead{ color:rgba(255,255,255,0.55); }
.section--dark .eyebrow{ color:rgba(255,255,255,0.4); }
.section--dark .eyebrow::before{ background:rgba(255,255,255,0.15); }

/* ============================================================
   SERVICE GRID
   ============================================================ */
.service-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  margin-bottom:32px;
}
.service-item{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:16px;
  padding:28px;
  transition:border-color .15s;
}
.service-item:hover{ border-color:var(--line-2); }
.service-item__num{
  font-size:.82rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
  color:var(--accent); margin-bottom:12px;
}
.service-item__title{
  font-size:1.02rem; font-weight:700; letter-spacing:-0.01em;
  color:var(--ink); margin-bottom:10px;
}
.service-item__text{
  font-size:.92rem; color:var(--ink-2); line-height:1.55; margin:0;
}

/* ============================================================
   BRAND BLOCK
   ============================================================ */
.brand-block{
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  padding:24px 28px;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:16px;
}
.brand-block__label{
  font-size:.78rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--ink-3); white-space:nowrap;
}
.brand-block__tags{
  display:flex; flex-wrap:wrap; gap:8px; flex:1;
}
.brand-block__note{
  width:100%; margin:4px 0 0;
  font-size:.88rem; color:var(--ink-3);
}

/* ============================================================
   PROCESS
   ============================================================ */
.process-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:24px;
}
.process-grid--5{
  grid-template-columns:repeat(5,1fr);
}
.process-card{
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:16px;
  padding:32px 28px;
}
.process-card__num{
  font-size:1rem; font-weight:800; letter-spacing:.02em;
  color:var(--accent); margin-bottom:20px;
}
.process-card h3{
  font-size:1.05rem; font-weight:700;
  color:#fff; letter-spacing:-0.01em;
  margin-bottom:12px;
}
.process-card p{
  font-size:.9rem; color:rgba(255,255,255,0.55);
  line-height:1.6;
}

/* ============================================================
   COMPARISON
   ============================================================ */
.compare-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
}
.compare-card{
  background:#fff;
  border:2px solid var(--line);
  border-radius:16px;
  overflow:hidden;
}
.compare-card--winner{
  border-color:var(--accent);
}
.compare-card__head{
  padding:22px 28px;
  border-bottom:1px solid var(--line);
  display:flex; align-items:center; gap:14px;
}
.compare-card--winner .compare-card__head{
  background:#fff5f5;
  border-bottom-color:rgba(204,28,28,0.15);
}
.compare-card__label{
  font-size:1.05rem; font-weight:800; letter-spacing:-0.01em;
}
.compare-card__badge{
  font-size:.72rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  padding:4px 10px; border-radius:100px;
  background:var(--accent); color:#fff;
}
.compare-row{
  display:flex; justify-content:space-between; align-items:flex-start; gap:20px;
  padding:16px 28px;
  border-bottom:1px solid var(--line);
}
.compare-row:last-child{ border-bottom:none; }
.compare-row__key{
  font-size:.9rem; color:var(--ink-3); font-weight:500; min-width:130px;
}
.compare-row__val{
  font-size:.95rem; font-weight:600; color:var(--ink); text-align:right;
}
.compare-card--winner .compare-row__val{ color:var(--accent); }

/* ============================================================
   CASE STUB
   ============================================================ */
.case-stub{
  border:2px dashed var(--line-2);
  border-radius:16px;
  background:var(--panel);
  padding:64px 40px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:16px;
  text-align:center;
}
.case-stub__icon{
  color:var(--line-2);
}
.case-stub__icon svg{
  width:40px; height:40px; stroke-width:1.2;
}
.case-stub em{
  font-size:1rem; color:var(--ink-3); font-style:italic;
}
.case-photos{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:12px;
}
.case-photos img{
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
  border-radius:16px;
}
@media (max-width:640px){
  .case-photos{ grid-template-columns:1fr; }
}

/* ============================================================
   CTA BLOCK (dark)
   ============================================================ */
.cta-block{
  padding-block:var(--sec-pad);
  background:var(--dark);
}
.cta-block__inner{
  display:grid;
  grid-template-columns:1.1fr 0.9fr;
  gap:clamp(40px,5vw,80px);
  align-items:start;
}
.cta-block__title{
  font-size:clamp(1.8rem,3vw,2.6rem);
  font-weight:800;
  color:#fff;
  letter-spacing:-0.02em;
  line-height:1.15;
  margin-top:16px;
  margin-bottom:16px;
}
.cta-block__sub{
  font-size:.97rem;
  color:rgba(255,255,255,0.5);
  line-height:1.6;
  margin-bottom:32px;
}
.cta-block__buttons{ display:flex; gap:14px; flex-wrap:wrap; }
.cta-contacts{ display:flex; flex-direction:column; gap:20px; padding-top:8px; }
.cta-contact-row{ display:flex; align-items:flex-start; gap:14px; }
.cta-contact-icon{
  width:40px; height:40px; flex-shrink:0;
  border:1px solid rgba(255,255,255,0.1);
  border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  color:rgba(255,255,255,0.5);
}
.cta-contact-icon svg{ width:18px; height:18px; stroke-width:1.8; }
.cta-contact-info{ display:flex; flex-direction:column; gap:2px; }
.cta-contact-info .primary{
  font-weight:800; font-size:1.15rem; color:#fff;
  letter-spacing:-0.01em; font-family:var(--font-head);
  text-decoration:none;
}
.cta-contact-info .primary:hover{ color:rgba(255,255,255,0.8); }
.cta-contact-info .secondary{ font-size:.85rem; color:rgba(255,255,255,0.4); }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1200px){
  .process-grid--5{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:1080px){
  .main-nav{ gap:18px; }
  .service-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:960px){
  .page-hero__inner{ grid-template-columns:1fr; gap:40px; }
  .hero-stat-card{
    display:grid; grid-template-columns:repeat(3,1fr);
    padding:0;
  }
  .hero-stat-card__item{
    padding:20px 24px;
    border-bottom:none;
    border-right:1px solid rgba(255,255,255,0.08);
  }
  .hero-stat-card__item:last-child{ border-right:none; }
  .features-strip__grid{ grid-template-columns:repeat(2,1fr); gap:16px; }
  .feature-item{ padding:0; border-right:none; }
  .process-grid--5{ grid-template-columns:repeat(2,1fr); }
  .compare-grid{ grid-template-columns:1fr; }
  .cta-block__inner{ grid-template-columns:1fr; }
}
@media (max-width:760px){
  body{ font-size:17px; }
  .page-hero{ min-height:auto; padding-block:56px 64px; }
  .page-hero__cta-row{ flex-direction:column; align-items:flex-start; gap:12px; }
  .hero-stat-card{ display:none; }
  .features-strip__grid{ grid-template-columns:1fr; }
  .service-grid{ grid-template-columns:1fr; }
  .process-grid{ grid-template-columns:repeat(2,1fr); gap:12px; }
  .process-card p{ display:none; }
  .process-card h3{ font-size:12px; }
  .section:has(.compare-grid){ display:none; }
  .brand-block{ gap:12px; }
  .case-stub{ padding:40px 24px; }
  .footer-ferraform{ padding:24px 20px; }
  .cta-block__buttons{ flex-direction:column; }
}
