/* Страница «Уход за изделиями из стекла и зеркал» (/uhod-za-steklom/, шаблон page-uhod.php). 19.10.2026.
   Все правила с префиксом .care — остальной сайт не задевают. */
/* ======================================================================
   СТРАНИЦА «УХОД» — всё с префиксом .care-, не задевает остальной сайт
   ====================================================================== */
.care{max-width:1400px;margin:0 auto 75px;padding:0 30px;box-sizing:border-box}
.care .productiob-1{padding-left:0;padding-right:0}
.care *{box-sizing:border-box}
.care-label{display:block;margin-bottom:14px;font-size:16px;color:#7a7a7a}
.care h1{margin:0;padding:0;font-size:56px;font-weight:400;line-height:110%;text-transform:uppercase}
.care h2{margin:0;font-size:45px;font-weight:400;line-height:110%;text-transform:uppercase}
.care h3{margin:0 0 10px;font-size:20px;font-weight:500}
.care p{margin:0;line-height:1.5}
.care-muted{color:#5b666d}

/* Первый экран */
.care-hero{display:grid;grid-template-columns:1.6fr 1fr;gap:40px;align-items:end;padding:0 0 50px;border-bottom:1px solid rgba(22,35,43,.15)}
.care .care-hero__lead{margin-top:30px;max-width:640px;font-size:17px}
.care-hero__btns{display:flex;gap:15px;flex-wrap:wrap;margin-top:30px}
.care-qr{background:#fff;border-radius:20px;padding:30px}
.care-qr__icon{width:48px;height:48px;margin-bottom:16px}
.care-qr h3{font-size:18px}
.care-qr p{font-size:15px;color:#5b666d}

/* Навигация по материалам */
.care-nav{padding:60px 0 0}
.care-nav__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:40px}
.care-nav a{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;border-radius:15px;padding:22px 20px;color:#16232b;text-decoration:none;font-size:16px;text-transform:uppercase;transition:box-shadow .3s ease}
.care-nav a:hover{box-shadow:0 6px 24px rgba(22,35,43,.10)}
.care-nav a span{display:block}
.care-nav a small{display:block;text-transform:none;font-size:13px;color:#7a7a7a;margin-top:4px}
.care-arrow{flex-shrink:0;width:34px;height:34px}

/* Общие правила */
.care-rules{padding:80px 0 0}
.care-rules__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:60px;margin-top:50px}
.care-rule{display:grid;grid-template-columns:48px 1fr;gap:20px}
.care-rule p{color:#5b666d}

/* Материал */
.care-materials{padding:80px 0 0}
.care-mat{background:#fff;border-radius:20px;padding:50px;margin-top:20px;display:grid;grid-template-columns:1fr 1.7fr;gap:50px;scroll-margin-top:100px}
.care-mat:first-of-type{margin-top:50px}
.care-mat__head h2{font-size:34px}
.care .care-mat__head p{margin-top:18px;color:#5b666d}
.care-mat__link{display:inline-flex;align-items:center;gap:8px;margin-top:24px;color:#16232b;font-weight:600;text-decoration:none;border-bottom:1px solid #16232b;padding-bottom:2px}
.care-mat__link:hover{color:#ff8912;border-color:#ff8912}
.care-cols{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.care-box{border-radius:15px;padding:24px;background:#f1f1f1}
.care-box--full{grid-column:1/-1}
.care-box h4{margin:0 0 14px;display:flex;align-items:center;gap:10px;font-size:15px;font-weight:600;text-transform:uppercase;letter-spacing:.02em}
.care-box ul{margin:0;padding:0;list-style:none}
.care-box li{position:relative;padding-left:18px;margin-top:10px;line-height:1.45;font-size:15px}
.care-box li:first-child{margin-top:0}
.care-box li::before{content:"";position:absolute;left:0;top:.6em;width:7px;height:7px;border-radius:50%;background:#628eaa}
.care-box--yes li::before{background:#2e9e5b}
.care-box--no li::before{background:#d6453d}
.care-box--tip li::before{background:#ff8912}
.care-dot{width:22px;height:22px;flex-shrink:0}

/* Хранение — как «Этапы работы» на главной */
.care-store{margin-top:80px;background:#fff;border-radius:20px;padding:60px 50px;display:grid;grid-template-columns:1fr 1.3fr;gap:60px;scroll-margin-top:100px}
.care .care-store__intro p{margin-top:24px;color:#5b666d}
.care-steps{margin:0;padding:0;list-style:none}
.care-steps li{display:grid;grid-template-columns:60px 1fr;gap:20px;padding:22px 0;border-bottom:1px solid rgba(22,35,43,.15)}
.care-steps li:first-child{padding-top:0}
.care-steps li:last-child{border-bottom:none;padding-bottom:0}
.care-steps b{font-size:16px;font-weight:700}
.care-steps h3{font-size:18px}
.care-steps p{color:#5b666d;font-size:15px}

/* FAQ */
.care-faq{padding:80px 0 0;display:grid;grid-template-columns:1fr 1.7fr;gap:50px}
.care-faq details{border-bottom:1px solid rgba(22,35,43,.15)}
.care-faq details:first-child{border-top:1px solid rgba(22,35,43,.15)}
.care-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;font-size:18px;font-weight:500}
.care-faq summary::-webkit-details-marker{display:none}
.care-faq summary::after{content:"+";font-size:28px;font-weight:300;line-height:1;transition:transform .3s ease}
.care-faq details[open] summary::after{transform:rotate(45deg)}
.care-faq details p{padding:0 40px 22px 0;color:#5b666d}

/* CTA */
.care-cta{margin-top:80px;background:#16232b;color:#fff;border-radius:20px;padding:50px;display:flex;align-items:center;justify-content:space-between;gap:40px}
.care-cta h2{color:#fff;font-size:38px}
.care .care-cta p{margin-top:16px;color:#c9d2d8;max-width:640px}
.care-cta p a{color:#fff;white-space:nowrap}
.care-cta__btns{display:flex;gap:15px;flex-shrink:0;flex-wrap:wrap}
.care-cta .btn-basic{background:#fff;color:#16232b;border-color:#fff}
.care-cta .btn-basic:hover{background:#ff8912;border-color:#ff8912;color:#fff}
.care-cta .btn-outline{color:#fff;border-color:#fff}

@media (max-width:1100px){
  .care-nav__grid{grid-template-columns:repeat(2,1fr)}
  .care-rules__grid{gap:30px}
}
@media (max-width:900px){
  .care{padding:0 15px;margin-bottom:50px}
  .care h1{font-size:34px}
  .care h2,.care-mat__head h2{font-size:28px}
  .care-hero,.care-mat,.care-store,.care-faq,.care-rules__grid{grid-template-columns:1fr}
  .care-hero{padding:0 0 40px;gap:30px}
  .care-mat,.care-store{padding:30px 20px;gap:24px}
  .care-cols{grid-template-columns:1fr}
  .care-rules,.care-materials,.care-faq{padding-top:60px}
  .care-store,.care-cta{margin-top:60px}
  .care-faq{gap:20px}
  .care-cta{flex-direction:column;align-items:flex-start;padding:30px 20px}
  .care-cta h2{font-size:28px}
}
@media (max-width:560px){
  .care-nav__grid{grid-template-columns:1fr 1fr;gap:10px}
  .care-nav a{flex-direction:column;align-items:flex-start;padding:16px 14px;font-size:14px}
  .care-nav .care-arrow{width:28px;height:28px;align-self:flex-end;margin-top:auto}
  .care-hero__btns .btn-basic,.care-hero__btns .btn-outline,.care-cta__btns a,.care-cta__btns button{width:100%}
}
/* На телефоне тема прячет хлебные крошки (.productiob-1, media.css) — отступ первого экрана от шапки */
@media (max-width:500px){
  .care-hero{padding-top:30px}
}