/* Общие стили внутренних страниц kupershlak35.ru. Главная держит свои стили в index.html. */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'DM Sans',sans-serif;background:#0E0C09;color:#F5F2EC;margin:0;-webkit-font-smoothing:antialiased}

/* Nav */
#nav4{position:fixed;top:0;left:0;right:0;z-index:50;transition:background .4s,backdrop-filter .4s}
#nav4.scrolled{background:rgba(14,12,9,.94);backdrop-filter:blur(12px)}
/* Над фотографией главной шапка прозрачная — подкладываем затемнение, чтобы меню и телефоны читались.
   Уходит при прокрутке, когда шапка и так становится тёмной. */
#nav4::before{content:'';position:absolute;left:0;right:0;top:0;height:140px;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(14,12,9,.88) 0%,rgba(14,12,9,.72) 45%,rgba(14,12,9,.3) 75%,rgba(14,12,9,0) 100%);
  transition:opacity .4s}
#nav4.scrolled::before{opacity:0}
.nav-link{font-size:.8rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.88);text-shadow:0 1px 8px rgba(0,0,0,.6);transition:color .2s;white-space:nowrap}
.nav-link:hover{color:#FF9A2E}
.nav-link.is-active{color:#fff}
.nav-link.is-active{box-shadow:inset 0 -2px 0 #E07B00;padding-bottom:4px}
.nav-link-m{font-size:.95rem;color:rgba(255,255,255,.75)}
.nav-link-m.is-active{color:#fff;font-weight:600}

/* Шапка страницы */
.page-hero{background:
  radial-gradient(1200px 400px at 85% 0%,rgba(224,123,0,.14),transparent 60%),
  linear-gradient(#0E0C09,#14110D)}
.crumbs{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.7rem;letter-spacing:.08em;color:#786B5C;text-transform:uppercase}
.crumbs a{color:#B0A898;transition:color .2s}
.crumbs a:hover{color:#fff}
.crumbs .sep{margin:0 .5rem;color:#3B3026}
.eyebrow{font-weight:600;font-size:.7rem;letter-spacing:.16em;color:#E07B00;text-transform:uppercase;margin-bottom:1rem}
.h1{font-family:'Barlow Condensed',sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:.02em;line-height:.95;font-size:clamp(2.4rem,6vw,4.75rem);overflow-wrap:break-word}
.h2{font-family:'Barlow Condensed',sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:.02em;line-height:.95;font-size:clamp(2rem,4.5vw,3.5rem);overflow-wrap:break-word}
.h3{font-family:'Barlow Condensed',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.03em;font-size:1.5rem;line-height:1.1}

/* Кнопки */
.btn-primary{display:inline-flex;align-items:center;gap:.5rem;padding:.875rem 2rem;background:#E07B00;color:#0E0C09;font-weight:700;font-size:.9rem;letter-spacing:.04em;text-transform:uppercase;text-decoration:none;transition:background .2s}
.btn-primary:hover{background:#FF9A2E}
.btn-primary:active{transform:scale(.98)}
.btn-ghost{display:inline-flex;align-items:center;gap:.5rem;padding:.875rem 2rem;border:1.5px solid rgba(255,255,255,.3);color:#F5F2EC;font-weight:600;font-size:.9rem;letter-spacing:.04em;text-transform:uppercase;text-decoration:none;transition:border-color .2s}
.btn-ghost:hover{border-color:rgba(255,255,255,.7)}
.btn-primary:focus-visible,.btn-ghost:focus-visible,a:focus-visible,button:focus-visible{outline:2px solid #FF9A2E;outline-offset:3px}

/* Карточки и плашки */
.card{background:#F5F2EC;border:2px solid #0E0C09;padding:2rem}
.card-dark{background:#1C1912;border:2px solid #3B3026;padding:1.75rem}
.fact{border-left:3px solid #E07B00;padding-left:1.25rem}
.tag{display:inline-block;padding:.35rem .75rem;background:#0E0C09;color:#F5F2EC;font-family:ui-monospace,monospace;font-size:.72rem;letter-spacing:.04em}
.step-num{font-family:'Barlow Condensed',sans-serif;font-weight:800;color:#E07B00;font-size:2rem;line-height:1;flex-shrink:0;width:2rem}

/* Форма */
.inp3{width:100%;background:#0E0C09;border:2px solid #2E2A22;padding:1rem 1.25rem;font-size:16px;font-family:'DM Sans',sans-serif;color:#F5F2EC;outline:none;transition:border-color .2s,background .2s;-webkit-appearance:none;appearance:none;border-radius:0}
.inp3::placeholder{color:#4A4540}
.inp3:focus{border-color:#E07B00;background:#111109}
.inp3:hover:not(:focus){border-color:#3B3026}
.field-label{font-size:.6875rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#786B5C;margin-bottom:.5rem;display:block}

/* FAQ */
.faq4-q{transition:color .2s}
.faq4-q:hover .faq4-qtext{color:#E07B00}
.faq4-item{transition:background .2s}

/* Подвал */
.foot-h{font-family:ui-monospace,monospace;font-size:.65rem;letter-spacing:.14em;text-transform:uppercase;color:#786B5C;margin-bottom:1rem}
.foot-list{display:flex;flex-direction:column;gap:.6rem}
.foot-list a{color:#B0A898;font-size:.9rem;transition:color .2s}
.foot-list a:hover{color:#fff}

/* Текст статей и документов */
.prose-k{color:#3B3026;font-size:1rem;line-height:1.75;max-width:72ch;overflow-wrap:break-word}
.prose-k h2{font-family:'Barlow Condensed',sans-serif;font-weight:800;text-transform:uppercase;color:#0E0C09;font-size:clamp(1.3rem,5vw,2.2rem);line-height:1.05;margin:2.5rem 0 1rem;hyphens:auto}
.prose-k h3{font-family:'Barlow Condensed',sans-serif;font-weight:700;text-transform:uppercase;color:#0E0C09;font-size:clamp(1.15rem,4.5vw,1.35rem);hyphens:auto;margin:2rem 0 .75rem}
.prose-k p{margin:0 0 1rem}
.prose-k ul,.prose-k ol{margin:0 0 1.25rem 1.25rem}
.prose-k ul{list-style:square}
.prose-k ol{list-style:decimal}
.prose-k li{margin:.35rem 0}
.prose-k li::marker{color:#E07B00}
.prose-k a{color:#B35F00;text-decoration:underline;text-underline-offset:3px}
.prose-k table{width:100%;border-collapse:collapse;margin:1.5rem 0;font-size:.92rem;display:block;overflow-x:auto}
.prose-k th,.prose-k td{border:1px solid #D8D0C4;padding:.6rem .8rem;text-align:left;vertical-align:top}
.prose-k th{background:#EDE8DF;color:#0E0C09}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* Калькулятор в статье справочника */
.calc{background:#1C1912;color:#F5F2EC;padding:1.5rem;margin:1.5rem 0 2rem;border-left:4px solid #E07B00;display:grid;grid-template-columns:minmax(0,1fr);gap:1rem}
@media (min-width:640px){.calc{grid-template-columns:repeat(2,minmax(0,1fr));padding:2rem}}
.calc p{color:#B0A898}
.calc .calc-out{grid-column:1/-1;background:#0E0C09;border:2px solid #3B3026;padding:1.25rem;font-size:.95rem;line-height:1.7;color:#F5F2EC}
.calc .calc-out strong{color:#FF9A2E}
.calc .calc-out a{color:#FF9A2E}
.calc select.inp3{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23786B5C' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;padding-right:2.5rem}
