@import url('./new-articles.layers.css');

/* меню лендинга: сброс браузерных маркеров/отступов списка —
   в остальных статьях это даёт core.css, в статьях нового макета он не подключён */
.hal-navbar ul,.hal-navbar li { margin:0; padding:0; list-style:none; }
html:has(.mh-korochki) { scrollbar-width:none; }
.mh-page { margin:0; background:#f3f8fb; color:#272727; font:20px/1.5 'Avenir Next Cyr',sans-serif; }
.mh-korochki { box-sizing:border-box; position:relative; width:min(100%,1280px); padding:60px 40px 100px; margin:auto; overflow:clip; letter-spacing:-.2px; }
.mh-korochki *,.mh-korochki *::before,.mh-korochki *::after { box-sizing:border-box; }
.mh-korochki p,.mh-korochki h1,.mh-korochki figure,.mh-korochki ul,.mh-korochki ol { margin:0; }
.mh-korochki a { color:inherit; }
.mh-korochki section { position:relative; z-index:1; margin-bottom:100px; }
.mh-korochki .mh-text-column { display:flex; flex-direction:column; gap:30px; min-width:0; }
.mh-korochki .mh-content { min-width:0; position:relative; }
.mh-korochki .mh-text-node { position:static; translate:none; transform:none; width:auto; height:auto; min-width:0; max-width:100%; white-space:normal; }
.mh-korochki .mh-text-node.mh-contents { display:block; }
.mh-korochki .mh-text-column > .mh-paragraph { line-height:1.5; }
.mh-korochki .mh-text-column > .mh-heading { line-height:1.2; }
.mh-korochki .mh-rich p + p { margin-top:30px; }
.mh-korochki .mh-title { font-size:50px; line-height:1; letter-spacing:-1.5px; }
.mh-korochki .mh-box { position:relative; border-radius:50px; padding:60px 80px; overflow:hidden; }
.mh-korochki .mh-content-grid { position:relative; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:30px; align-items:center; }
.mh-korochki .mh-single { grid-template-columns:minmax(0,1fr); }
.mh-korochki .mh-art { position:relative; min-width:0; width:100%; max-width:calc(var(--art-width) * 1px); overflow:hidden; }
.mh-korochki .mh-art-canvas { position:relative; transform-origin:top left; max-width:none; }
.mh-korochki .mh-art-canvas * { max-width:none; }
.mh-korochki .mh-art-canvas .mh-copy { font-size:inherit; }
.mh-korochki .mh-art-image { display:block; width:100%; height:auto; }
.mh-korochki .mh-container-size { container-type:size; }
.mh-korochki .mh-decoration { position:absolute; inset:0; pointer-events:none; overflow:hidden; }
.mh-korochki .mh-decoration .mh-art { width:100%; max-width:none; }
.mh-korochki .mh-page-wave { position:absolute; left:50%; width:1920px; max-width:none; transform:translateX(-50%); pointer-events:none; }
.mh-korochki .mh-carousel { position:relative; min-width:0; --mh-accent:#00339f; }
.mh-korochki .swiper { border-radius:50px; }
.mh-korochki .swiper-slide { height:auto; }
.mh-korochki .mh-arrow { position:absolute; z-index:2; top:calc(50% - 18px); width:36px; height:36px; border:0; border-radius:50%; background:var(--mh-accent); color:white; padding:0; font:24px/36px sans-serif; cursor:pointer; }
.mh-korochki .mh-prev { left:20px; }
.mh-korochki .mh-next { right:20px; }
.mh-korochki .mh-pagination { position:absolute; display:flex; justify-content:center; gap:10px; left:0; bottom:-76px; width:100%; }
.mh-korochki .swiper-pagination-bullet { width:16px; height:16px; margin:0; background:var(--mh-accent); }
.mh-korochki .mh-step,.mh-korochki .mh-check { display:flex; align-items:flex-start; gap:18px; background:white; padding:20px; border-radius:30px; }
.mh-korochki .mh-step-number { flex:none; width:24px; font-weight:600; background:#ffe4f6; color:#ee6fbb; line-height:1.2; border-radius:5px; text-align:center; }
.mh-korochki .mh-step .mh-paragraph,.mh-korochki .mh-check .mh-paragraph { flex:1; font-size:20px; line-height:1.2; }
.mh-korochki .mh-check > img { flex:none; width:24px; height:24px; }
.mh-korochki .mh-section-icon { position:absolute; width:86px; right:56px; top:-40px; }
.mh-korochki .mh-product-card { position:relative; height:450px; background:white; border-radius:50px 50px 50px 0; overflow:hidden; }
.mh-korochki .mh-quality-bar { position:absolute; left:0; right:0; bottom:0; min-height:100px; border-radius:90px 0 50px 0; color:white; background:var(--product-color); padding:26px 30px 20px 60px; display:flex; gap:14px; align-items:flex-start; }
.mh-korochki .mh-quality-bar > img { flex:none; width:26px; height:28px; }
.mh-korochki .mh-quality-bar > .mh-paragraph { font-size:16px; line-height:1.5; }
.mh-korochki .mh-product-note { font:12px/1.5 'Ubuntu Sans',sans-serif; color:rgba(39,39,39,.5); }
.mh-korochki .mh-product-link { display:flex; align-items:center; justify-content:center; width:360px; min-height:60px; border-radius:122px; text-decoration:none; background:var(--product-color); color:white; line-height:1.5; }
.mh-korochki .mh-product-feature { display:flex; align-items:flex-start; gap:13px; }
.mh-korochki .mh-product-feature > img { flex:none; width:45px; height:45px; }
.mh-korochki .mh-product-feature .mh-paragraph { flex:1; }
.mh-korochki .mh-nav { display:flex; align-items:center; justify-content:center; gap:33px; }
.mh-korochki .mh-nav a { display:flex; align-items:center; justify-content:center; width:260px; height:60px; border-radius:72px; color:var(--nav-color); background:white; text-decoration:none; }
.mh-korochki .mh-nav a + a { width:360px; color:white; background:var(--nav-color); }
.mh-korochki .mh-sources { display:flex; flex-direction:column; gap:30px; padding-inline:80px; font:12px/1.5 'Ubuntu Sans',sans-serif; color:rgba(39,39,39,.5); }
.mh-korochki .mh-sources ol { padding-left:18px; overflow-wrap:anywhere; }
.mh-korochki .mh-sources .mh-text-node { font-size:inherit; line-height:inherit; }
.mh-korochki .mh-sources > .mh-heading { color:rgba(39,39,39,.2); text-transform:uppercase; font:32px/1.2 'Avenir Next Cyr',sans-serif; letter-spacing:-1px; text-align:center; }
.mh-korochki .mh-sources > .mh-paragraph:last-child { text-align:center; }
.mh-korochki section:last-child { margin-bottom:0; }

.mh-korochki { --product-color:#ee6fbb; --nav-color:#00339f; }
.mh-korochki > .mh-page-wave:nth-of-type(1) { top:790px; }
.mh-korochki > .mh-page-wave:nth-of-type(2) { top:2387px; }
.mh-korochki > .mh-page-wave:nth-of-type(3) { top:4059px; }
.mh-k-hero { margin-bottom:80px !important; }
.mh-k-hero .mh-box { padding:30px 30px 30px 80px; min-height:480px; color:white; }
.mh-k-hero .mh-content-grid { grid-template-columns:600px 420px; gap:70px; }
.mh-k-hero .mh-text-column { gap:40px; }
.mh-k-intro { min-height:376px; display:grid; grid-template-columns:570px 292px; justify-content:space-between; padding:0 85px 0 80px; }
.mh-k-intro .mh-content { padding-top:20px; }
.mh-k-causes-title { width:600px; margin-left:80px; }
.mh-k-causes { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:30px; align-items:center; min-height:380px; }
.mh-k-causes .mh-box { padding:110px 20px 30px; min-height:380px; border-radius:50px; }
.mh-k-causes .mh-content-grid { display:block; }
.mh-k-causes .mh-text-column { gap:20px; }
.mh-k-causes .mh-art { position:absolute; right:-20px; top:-110px; width:220px; opacity:.65; }
.mh-k-causes [data-design-node="2968:6458"] { transform:rotate(-6.12deg); min-height:430px; margin-block:-25px; }
.mh-k-consult { margin-bottom:80px !important; }
.mh-k-consult .mh-box { min-height:310px; padding:60px 80px; background:transparent !important; }
.mh-k-consult .mh-content-grid { grid-template-columns:820px 271px; gap:0; }
.mh-k-consult .mh-content-grid > .mh-art { position:absolute; width:271px; right:-35px; top:-33px; }
.mh-k-consult .mh-decoration { opacity:1; }
.mh-k-consult .mh-decoration > .mh-art { margin-left:0; }
.mh-k-consult .mh-decoration > .mh-art + .mh-art { position:absolute; top:0; }
.mh-k-remove { display:grid; grid-template-columns:342px 580px; justify-content:space-between; padding:0 70px 0 75px; min-height:503px; margin-bottom:120px !important; }
.mh-k-remove .mh-content { padding-top:60px; }
.mh-k-gentle { margin-left:80px; width:600px; margin-bottom:20px !important; min-height:249px; }
.mh-k-hydrate { min-height:316px; padding:0 94px 0 80px; display:grid; grid-template-columns:600px 257px; justify-content:space-between; margin-bottom:80px !important; }
.mh-k-hydrate .mh-content { padding-top:80px; }
.mh-k-care { margin-bottom:60px !important; }
.mh-k-care .mh-box { padding:50px 40px 50px 75px; min-height:480px; }
.mh-k-care .mh-content-grid { grid-template-columns:488px 570px; gap:27px; }
.mh-k-care .mh-art { grid-column:1; grid-row:1; }
.mh-k-care .mh-text-column { grid-column:2; grid-row:1; background:white; padding:30px; border-radius:30px; gap:30px; }
.mh-k-care .mh-pagination { display:none; }
.mh-k-daily { min-height:490px; padding:0 31px 0 80px; display:grid; grid-template-columns:620px 435px; gap:34px; }
.mh-k-daily .mh-content { padding-top:60px; }
.mh-k-product { margin-bottom:40px !important; }
.mh-k-product .mh-box { min-height:709px; padding:60px 30px 60px 80px; }
.mh-k-product .mh-content-grid { grid-template-columns:608px 460px; gap:22px; align-items:start; }
.mh-k-product .mh-text-column { gap:0; }
.mh-k-product .mh-heading { width:500px; margin-bottom:30px; }
.mh-k-product .mh-product-feature { font-size:16px; line-height:1.4; align-items:center; }
.mh-k-product .mh-product-feature + .mh-product-feature { margin-top:5px; }
.mh-k-product .mh-product-link { margin:40px 0 0 58px; }
.mh-k-product .mh-product-card > .mh-art { position:absolute; top:20px; left:65px; width:320px; mix-blend-mode:darken; }
.mh-k-product .mh-product-age { position:absolute; right:90px; top:30px; display:flex; justify-content:center; align-items:center; width:90px; height:90px; border-radius:50%; background:#ee6fbb; color:white; font-size:36px; }
.mh-k-product .mh-product-age-note { position:absolute; top:27.5px; left:68.8889%; font-size:10px; line-height:1.2; letter-spacing:-.2px; }
.mh-k-product .mh-product-note { width:430px; margin:30px 0 0 30px; }
.mh-k-clean { min-height:414px; display:grid; grid-template-columns:540px 435px; justify-content:space-between; padding:0 31px 0 80px; margin-bottom:50px !important; }
.mh-k-clean .mh-content { padding-top:100px; }
.mh-k-steps { margin-bottom:50px !important; }
.mh-k-steps .mh-box { min-height:628px; padding:60px 40px 50px 80px; }
.mh-k-steps .mh-content-grid { grid-template-columns:400px 570px; gap:110px; align-items:start; }

.mh-k-steps .mh-decoration > .mh-art + .mh-art { position:absolute; top:0; left:0; }
.mh-k-steps .mh-content-grid > .mh-text-column { gap:20px; }
.mh-k-steps .mh-step-intro > .mh-art { width:434px; margin-left:-20px; margin-top:87px; }
.mh-k-steps .mh-section-icon { right:56px; }
.mh-k-finish { min-height:220px; display:grid; grid-template-columns:540px 290px; justify-content:space-between; padding:0 125px 0 80px; margin-bottom:60px !important; }
.mh-k-finish .mh-content { padding-top:70px; }

@media (min-width:768px) and (max-width:1279px) {
 .mh-korochki { padding-inline:24px; }
 .mh-korochki section { max-width:100%; }
 .mh-korochki .mh-content-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
 .mh-korochki section:not(.mh-k-hero):not(.mh-k-causes):not(.mh-k-planned) { padding-inline:30px; }
 .mh-korochki .mh-box { padding-inline:30px; }
 .mh-korochki .mh-title { font-size:40px; }
 .mh-korochki .mh-product-card { width:100%; }
 .mh-korochki .mh-product-note,.mh-korochki .mh-heading { max-width:100%; }
 .mh-korochki .mh-product-link { max-width:100%; margin-left:0; }
 .mh-korochki .mh-quality-bar { padding-inline:30px; }
 .mh-korochki .mh-sources { padding-inline:30px; }
}
@media (max-width:767px) {
 .mh-page { font-size:18px; }
 .mh-korochki { padding:24px 16px 40px; }
 .mh-korochki section { display:flex; flex-direction:column; align-items:stretch; min-height:0; width:auto; margin:0 0 48px !important; padding:0; gap:24px; }
 .mh-korochki .mh-content { padding:0; width:auto; }
 .mh-korochki .mh-text-column { gap:24px; padding:0; }
 .mh-korochki .mh-text-node { max-width:100%; }
 .mh-korochki .mh-title { font-size:32px; line-height:1.1; letter-spacing:-.7px; }
 .mh-korochki .mh-heading { font-size:28px; line-height:1.2; width:auto; }
 .mh-korochki .mh-heading .mh-copy { font-size:inherit; }
 .mh-korochki .mh-heading.mh-rich { font-size:0; }
 .mh-korochki .mh-heading.mh-rich .mh-copy:not(.mh-small) { font-size:28px; }
 .mh-korochki .mh-type-15,.mh-korochki .mh-type-16,.mh-korochki .mh-type-24,.mh-korochki .mh-type-25 { font-size:18px; }
 .mh-korochki .mh-box { padding:24px; border-radius:30px; min-height:0; }
 .mh-korochki .mh-content-grid { display:flex; flex-direction:column; align-items:stretch; gap:24px; }
 .mh-korochki .mh-art { margin:0 auto; max-width:100%; }
 .mh-korochki .mh-section-icon { width:50px; top:-24px; right:20px; margin:0; }
 .mh-korochki .mh-product-card { width:100%; height:350px; border-radius:30px 30px 30px 0; }
 .mh-korochki .mh-quality-bar { padding:20px; min-height:90px; border-radius:60px 0 30px 0; gap:10px; }
 .mh-korochki .mh-quality-bar .mh-paragraph { font-size:14px; }
 .mh-korochki .mh-quality-bar > img { width:22px; height:24px; }
 .mh-korochki .mh-product-note { width:auto; margin:24px 0 0; }
 .mh-korochki .mh-product-link { width:100%; font-size:18px; min-height:54px; margin-left:0; }
 .mh-korochki .mh-arrow { width:28px; height:28px; font-size:20px; line-height:28px; }
 .mh-korochki .mh-prev { left:3px; }
 .mh-korochki .mh-next { right:3px; }
 .mh-korochki .mh-pagination { bottom:-30px; }
 .mh-korochki .swiper-pagination-bullet { width:10px; height:10px; }
 .mh-korochki .mh-carousel .mh-box { padding:24px 34px; }
 .mh-korochki .mh-carousel .mh-content-grid > .mh-art { order:0; }
 .mh-korochki .mh-carousel .mh-text-column { order:1; }
 .mh-korochki .mh-carousel .mh-text-column .mh-heading { font-size:24px; }
 .mh-korochki .mh-carousel .mh-text-column .mh-heading .mh-copy { font-size:inherit; }
 .mh-korochki .swiper { border-radius:30px; }
 .mh-korochki .mh-step,.mh-korochki .mh-check { gap:12px; padding:16px; }
 .mh-korochki .mh-step .mh-paragraph,.mh-korochki .mh-check .mh-paragraph { font-size:18px; }
 .mh-korochki .mh-nav { flex-direction:column; gap:12px; }
 .mh-korochki .mh-nav a,.mh-korochki .mh-nav a + a { width:100%; font-size:16px; }
 .mh-korochki .mh-sources { padding:0; }
 .mh-korochki .mh-sources > .mh-heading { font-size:22px; }
 .mh-korochki section:last-child { margin-bottom:0 !important; }
}

@media (max-width:767px) {
 .mh-k-hero .mh-box { padding:24px; }
 .mh-k-hero .mh-text-column { gap:24px; }
 .mh-k-causes .mh-box { min-height:0; padding:70px 24px 24px; }
 .mh-k-causes .mh-art { top:-70px; right:-20px; width:180px; margin:0; }
 .mh-k-causes [data-design-node="2968:6458"] { transform:none; min-height:0; margin:0; }
 .mh-k-causes .mh-type-9 { font-size:18px; }
 .mh-k-consult .mh-box { background:white !important; padding:24px; }
 .mh-k-consult .mh-decoration { display:none; }
 .mh-k-consult .mh-content-grid { gap:20px; }
 .mh-k-consult .mh-art { margin:0 auto; }
 .mh-k-consult .mh-decoration > .mh-art { width:1200px; height:100%; }
 .mh-k-consult .mh-decoration > .mh-art + .mh-art { display:none; }
 .mh-k-care .mh-text-column { padding:20px; gap:20px; }
 .mh-k-care .mh-pagination { display:flex; }
 .mh-k-product .mh-text-column { gap:0; }
 .mh-k-product .mh-heading { font-size:24px; margin-bottom:24px; }
 .mh-k-product .mh-product-feature { font-size:16px; }
 .mh-k-product .mh-product-feature + .mh-product-feature { margin-top:12px; }
 .mh-k-product .mh-product-feature > img { width:28px; height:28px; }
 .mh-k-product .mh-product-link { margin:24px 0 0; }
 .mh-k-product .mh-product-card > .mh-art { top:10px; left:20px; width:230px; }
 .mh-k-product .mh-product-age { right:30px; top:20px; width:70px; height:70px; font-size:28px; }
 .mh-k-product .mh-product-age-note { top:20px; }
 .mh-k-product .mh-product-note { width:auto; margin:24px 0 0; }
 .mh-k-steps .mh-text-column:nth-child(2) { order:2; gap:16px; }
 .mh-k-steps .mh-step-intro > .mh-art { width:100%; margin:24px auto 0; }
 .mh-k-consult .mh-content-grid > .mh-art { position:relative; right:auto; top:auto; margin:0 auto; }
 .mh-k-remove > .mh-art { order:1; }
}

.mh-korochki .mh-reference,.mh-korochki .mh-reference .mh-text-node { white-space:nowrap; }
.mh-korochki .mh-footnote { font-size:12.9px; line-height:0; vertical-align:super; }
.mh-korochki .mh-heading .mh-footnote { font-size:20.64px; }
.mh-korochki .mh-k-product .mh-footnote { position:relative; top:-.25em; font-size:10.32px; }
.mh-korochki .mh-product-link .mh-footnote { font-size:12.9px; }
.mh-korochki .mh-quality-bar .mh-footnote { font-size:10.32px; }
.mh-korochki .mh-arrow > img { display:block; width:100%; height:100%; }
.mh-korochki .mh-prev > img { transform:scaleX(-1); }
@media(max-width:767px) {
 .mh-korochki .mh-footnote { font-size:11.6px; }
 .mh-korochki .mh-heading .mh-footnote { font-size:18px; }
}

/* фикс: фоновые/декоративные слои не должны перекрывать текст и меню */
.hal-navbar { position:relative; z-index:10; }
/* поднимаем только блок «Причины»: широкие z-index на .mh-content-grid/.mh-text-column создавали
   новый контекст наложения и ломали mix-blend-mode у упаковки в продуктовом блоке */
.mh-korochki .mh-k-causes .mh-content-grid,
.mh-korochki .mh-k-causes .mh-text-column { position:relative; z-index:1; }

@media (max-width:767px) {
/* иллюстрации в этих блоках раздувались на всю ширину (358 px при макетных 257–342)
   и частично растягивались сверх макета — держим в диапазоне, как в остальных статьях раздела */
 .mh-korochki .mh-k-intro > .mh-art,
 .mh-korochki .mh-k-remove > .mh-art,
 .mh-korochki .mh-k-hydrate > .mh-art,
 .mh-korochki .mh-k-daily > .mh-art,
 .mh-korochki .mh-k-clean > .mh-art,
 .mh-korochki .mh-k-finish > .mh-art { width:250px; }
}

/* сердечки в продуктовом блоке — пульсируют, как в «Уходе за лицом» (uhod-za-litsom):
   те же маркеры li-marker-*.svg анимируются marker-pulse 2s linear infinite */
.mh-k-product .mh-product-feature > img { animation: marker-pulse 2s linear infinite; }