/* MIKA — мастерская красоты Алены Смирновой. Цвета из логотипа: малиновый + сливово-коричневый. */
:root{
  --ink:#3A2228; --plum:#5B2F38; --muted:#76606A; --acc:#AE2A4B; --acc-d:#8E1F3C;
  --soft:#F7EDF0; --line:#ECDDE1; --bg:#FFFFFF; --dark:#3A2228;
  --f-d:"Prata", Georgia, "Times New Roman", serif;
  --f-b:"Manrope", "Segoe UI", Arial, sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--f-b);font-size:16px;line-height:1.65}
img{max-width:100%;height:auto;display:block}
a{color:var(--acc)}
a:hover{color:var(--acc-d)}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
h1,h2,h3{font-family:var(--f-d);font-weight:400;color:var(--plum);line-height:1.2;text-wrap:balance;margin:0}
h1{font-size:clamp(1.9rem,4.4vw,2.9rem)}
h2{font-size:clamp(1.4rem,2.8vw,1.85rem)}
h3{font-size:1.15rem}
.m-wrap{max-width:1160px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.m-ico{width:18px;height:18px;flex:none}

/* кнопки */
.m-btn{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:11px 20px;font-weight:700;font-size:.95rem;text-decoration:none;border:1.5px solid var(--acc);background:var(--acc);color:#fff;line-height:1.2;white-space:nowrap}
.m-btn:hover{background:var(--acc-d);border-color:var(--acc-d);color:#fff}
.m-btn-line{background:transparent;color:var(--acc)}
.m-btn-line:hover{background:var(--soft);color:var(--acc-d)}
.m-btn-light{background:#fff;color:var(--dark);border-color:#fff}
.m-btn-light:hover{background:var(--soft);color:var(--dark);border-color:var(--soft)}
.m-more{font-weight:700;text-decoration:none}

/* шапка */
.m-top{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.96);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.m-nav{display:flex;align-items:center;gap:18px;min-height:68px}
.m-logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--plum);font-family:var(--f-d);font-size:1.25rem;line-height:1.1;flex:none}
.m-logo img{width:44px;height:44px;border-radius:50%}
.m-logo small{display:block;font-family:var(--f-b);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.m-menu{margin-left:auto}
.m-menu ul{list-style:none;margin:0;padding:0}
.m-menu > ul{display:flex;gap:4px}
.m-menu li{position:relative}
.m-menu a{display:block;white-space:nowrap;padding:8px 9px;text-decoration:none;color:var(--ink);font-size:.93rem;font-weight:600;border-radius:8px}
.m-menu a:hover,.m-menu .m-here > a{color:var(--acc)}
.m-menu .m-sub{display:none;position:absolute;left:0;top:100%;min-width:250px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:6px;box-shadow:0 14px 34px -18px rgba(58,34,40,.45)}
.m-menu .m-sub a{font-weight:500}
.m-menu li:hover > .m-sub,.m-menu li:focus-within > .m-sub{display:block}
.m-burger-cb{position:absolute;opacity:0;pointer-events:none}
.m-burger{display:none;width:42px;height:42px;border-radius:10px;border:1px solid var(--line);cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:5px;margin-left:auto}
.m-burger i{display:block;width:20px;height:2px;background:var(--ink);border-radius:2px}

/* главная */
.m-hero{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(20px,4vw,52px);align-items:center;padding-block:clamp(28px,5vw,60px)}
.m-hero p{color:var(--muted);margin:14px 0 0;max-width:46ch;font-size:1.05rem}
.m-hero-img{width:100%;aspect-ratio:4/3.1;object-fit:cover;border-radius:220px 220px 16px 16px}
.m-eyebrow{font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:700;margin-bottom:10px}
.m-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.m-facts{display:flex;flex-wrap:wrap;gap:6px 20px;margin:20px 0 0;padding:0;list-style:none;font-size:.86rem;color:var(--muted)}
.m-facts li::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--acc);margin-right:8px;vertical-align:middle}
.m-dirs{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding-bottom:40px}
.m-dir{border:1px solid var(--line);border-radius:16px;overflow:hidden;display:grid;grid-template-rows:auto 1fr;background:#fff}
.m-dir > img{width:100%;aspect-ratio:16/8;object-fit:cover}
.m-dir-b{padding:20px 22px 22px;display:grid;gap:12px;align-content:start}
.m-dir h2 a{color:inherit;text-decoration:none}
.m-dir .m-more{justify-self:start;margin-top:4px}
.m-band{background:var(--soft);padding-block:36px}
.m-steps4{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:18px;counter-reset:s}
.m-steps4 li{counter-increment:s;display:grid;gap:4px}
.m-steps4 li::before{content:counter(s);font-family:var(--f-d);font-size:1.9rem;color:var(--acc);line-height:1}
.m-steps4 span{color:var(--muted);font-size:.92rem}
.m-about{display:grid;grid-template-columns:240px 1fr;gap:32px;align-items:center;padding-block:40px}
.m-about img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:top;border-radius:14px}
.m-about p{color:var(--muted);max-width:62ch;margin:10px 0 0}
.m-gal-teaser{padding-top:40px}
.m-gal{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px;margin-top:16px}
.m-gal figure{margin:0;border-radius:12px;overflow:hidden;background:var(--soft)}
.m-gal img{width:100%;aspect-ratio:4/3;object-fit:cover}
.m-gal figcaption{padding:8px 12px;font-size:.86rem;color:var(--muted)}
.m-gal-teaser .m-gal figure:nth-child(n+5){display:none}

/* прайс */
.m-price{list-style:none;margin:0;padding:0}
.m-price li{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:9px 0;border-bottom:1px dashed var(--line);font-size:.95rem}
.m-price li:last-child{border-bottom:0}
.m-price small{display:block;color:var(--muted);font-size:.8rem}
.m-price b{white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--plum)}
.m-note{font-size:.84rem;color:var(--muted);margin:6px 0 0}

/* внутренние страницы */
.m-page{padding-block:22px 40px}
.m-crumbs{font-size:.84rem;color:var(--muted);margin-bottom:14px}
.m-crumbs a{color:var(--muted)}
.m-crumbs span{margin-inline:2px}
.m-page > h1{margin-bottom:18px}
.m-content{max-width:820px}
.m-content > * + *{margin-top:14px}
.m-content h2{margin-top:36px}
.m-content h3{margin-top:4px}
.m-content ul,.m-content ol{padding-left:22px}
.m-content li + li{margin-top:5px}
.m-lead{font-size:1.12rem;color:var(--ink)}
.m-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;margin-top:16px}
.m-card{display:grid;gap:6px;align-content:start;padding:16px 18px;border:1px solid var(--line);border-radius:12px;background:#fff;text-decoration:none;color:var(--ink)}
.m-card b{font-family:var(--f-d);font-weight:400;font-size:1.12rem;color:var(--plum)}
.m-card span{color:var(--muted);font-size:.92rem}
a.m-card:hover{border-color:var(--acc)}
a.m-card b::after{content:" →";color:var(--acc)}
.m-steps{counter-reset:s;list-style:none;padding-left:0 !important}
.m-steps li{counter-increment:s;position:relative;padding-left:42px}
.m-steps li::before{content:counter(s);position:absolute;left:0;top:0;width:28px;height:28px;border-radius:50%;background:var(--acc);color:#fff;font-weight:700;font-size:.85rem;display:grid;place-items:center}
.m-heal{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.m-heal > div{background:var(--soft);border-radius:12px;padding:14px 16px}
.m-heal ul{padding-left:18px;margin:8px 0 0;font-size:.93rem}
.m-faq{margin:12px 0 0}
.m-faq dt{font-weight:700;margin-top:16px}
.m-faq dd{margin:4px 0 0;color:var(--ink)}

.m-content .m-about{grid-template-columns:220px 1fr;padding:0}
.m-contacts{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.m-contacts > div{border:1px solid var(--line);border-radius:12px;padding:16px 18px}
.m-contacts p{margin:8px 0 0}

/* блок бота */
.m-bot{display:grid;grid-template-columns:1fr auto;gap:22px;align-items:center;background:var(--dark);color:#F6E9EC;border-radius:18px;padding:26px 28px;margin-block:36px 10px}
.m-bot h2{color:#fff}
.m-bot p{color:#DCC6CC;margin:8px 0 0}
.m-bot ul{margin:10px 0 0;padding-left:18px;color:#DCC6CC;font-size:.93rem}

/* подвал */
.m-foot{border-top:1px solid var(--line);margin-top:30px;padding-block:22px 90px;font-size:.9rem;color:var(--muted)}
.m-foot-in{display:flex;flex-wrap:wrap;gap:10px 28px;align-items:center}
.m-foot a{color:var(--ink);text-decoration:none}
.m-soc{display:flex;gap:10px}
.m-soc a{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;color:var(--acc)}
.m-copy{margin-left:auto}
.m-fab{position:fixed;right:max(18px,env(safe-area-inset-right,0px));bottom:max(18px,env(safe-area-inset-bottom,0px));width:56px;height:56px;border-radius:50%;background:#2AABEE;color:#fff;display:grid;place-items:center;box-shadow:0 10px 24px -8px rgba(0,0,0,.4);z-index:30}
.m-fab:hover{color:#fff;background:#1E96D4}
.m-fab .m-ico{width:28px;height:28px}

@media (max-width:1100px){
  .m-burger{display:flex}
  .m-btn-top{display:none}
  .m-menu{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--line);padding:8px max(16px,env(safe-area-inset-left,0px)) 16px;margin:0;max-height:calc(100vh - 68px);overflow:auto}
  .m-burger-cb:checked ~ .m-menu{display:block}
  .m-menu > ul{flex-direction:column;gap:0}
  .m-menu .m-sub{display:block;position:static;border:0;box-shadow:none;padding:0 0 0 14px;min-width:0}
  .m-menu a{padding:9px 4px}
}
@media (max-width:760px){
  .m-hero,.m-dirs,.m-about,.m-bot,.m-content .m-about{grid-template-columns:1fr}
  .m-hero-img{border-radius:160px 160px 14px 14px}
  .m-steps4{grid-template-columns:1fr 1fr}
  .m-about img,.m-content .m-about img{max-width:260px}
  .m-copy{margin-left:0}
  .m-bot{padding:22px 20px}
}
@media (prefers-reduced-motion:no-preference){.m-btn,.m-card{transition:background-color .15s,border-color .15s}}
