/* Лунный календарь стрижек (SEO), Дизайнер 14.10. Поверх sign-seo.css (сцена sg-*) и moon-seo.css (mn-*, таблица m-table).
   Первый экран: медальон hc-scissors на астролябии, золотые дуги, по бокам Луна нужной фазы и знак Луны, облака у краёв.
   Оценки: золото — благоприятно, нейтрально — приглушённо, лиловый — неблагоприятно. Без карточек; декор на телефоне скрыт. */
.hc-page{--hc-lilac:#c9a6ff;--hc-gold:linear-gradient(90deg,#f3d79e,#ffe9c2 45%,#e3b465)}

/* ---------- первый экран ---------- */
.hc-hero{margin-top:6px}
.hc-hero .sg-stage{margin-top:4px}
.hc-hero .sg-zod{width:64%}
.hc-arc-r{font:italic 400 25px var(--display);letter-spacing:.03em;text-transform:none;fill:#f3d79e;font-variant-numeric:lining-nums}
.hc-today.hc-bad .hc-arc-r{fill:var(--hc-lilac)}
.hc-today.hc-neutral .hc-arc-r{fill:#e9e1f7}
.hc-side .mo.hc-mo{--s:104px;margin:12px 0}
.hc-side .hc-z{width:min(112px,100%);height:112px;padding:0;border-radius:50%;object-fit:contain}
.hc-side b{text-wrap:balance}
.hc-side small{margin-top:12px}
/* оценка дня: причина под сценой, лиловым — если день неблагоприятный */
main .hc-today-why{max-width:600px;margin:10px auto 0;text-align:center;color:var(--muted);font-size:15.5px;line-height:1.5;text-wrap:balance}
.hc-today.hc-bad .hc-today-why{color:#cbbde8}
.hc-hero .mn-lead{margin-top:22px}
.hc-hero .mn-lead:after{content:'';display:block;width:min(300px,70%);aspect-ratio:840/173;margin:12px auto 0;background:url(/assets/img/divider-840.webp) center/contain no-repeat;opacity:.9}
.hc-hero .sg-cta{margin-top:24px}

/* ---------- благоприятные дни: числа Playfair на звёздах ---------- */
.hc-best{list-style:none;padding:0;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:34px 18px;max-width:860px}
.hc-best li{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px}
.hc-best b{position:relative;isolation:isolate;display:grid;place-items:center;width:112px;height:112px;margin-bottom:6px;font:500 50px/1 var(--display);font-variant-numeric:lining-nums;color:#fff4dc;text-shadow:0 2px 14px #0d0b29,0 0 2px #0d0b29}
.hc-best b:before{content:'';position:absolute;z-index:-1;inset:0;background:url(/assets/img/star-gold.webp) center/100% no-repeat;opacity:.5;filter:drop-shadow(0 0 16px #ffe6a888)}
.hc-best b:after{content:'';position:absolute;z-index:-1;inset:26%;border-radius:50%;background:radial-gradient(closest-side,#1b1540f2 55%,#1b154000)}
.hc-best li>span{font:italic 400 19px/1.2 var(--display);color:#fff2d8}
.hc-best small{max-width:190px;color:var(--muted);font-size:13px;line-height:1.4}
/* место под форму подписки Продакта: пустой блок не занимает места, с формой — отступ от дней */
#haircut-sub:not(:empty){max-width:680px;margin:48px auto 0}

/* ---------- неблагоприятные дни: сдержанно, лиловым ---------- */
.hc-bad-block h2.mn-h{font-size:clamp(24px,3vw,34px);margin-bottom:24px}
.hc-bad-block h2.mn-h em{background-image:linear-gradient(90deg,#c9b4ff,#ece4ff 50%,#9d86f5)}
.hc-bad{list-style:none;padding:0;margin:0 auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 34px;max-width:760px}
.hc-bad li{display:grid;grid-template-columns:44px 1fr;align-items:baseline;gap:12px;padding:10px 2px;background:linear-gradient(90deg,#bba8ff33,#bba8ff05) bottom/100% 1px no-repeat}
.hc-bad b{font:500 26px/1 var(--display);font-variant-numeric:lining-nums;color:var(--hc-lilac);text-align:right}
.hc-bad li>span{color:var(--muted);font-size:14.5px;line-height:1.4}

/* ---------- таблица по дням ---------- */
main table.hc-table td{font-size:14.5px}
main table.hc-table td small{display:block;margin-top:3px;color:var(--faint);font-size:12.5px}
main table.hc-table tbody th{width:74px}
main table.hc-table td:nth-child(2){width:190px;white-space:nowrap}
.hc-r{display:inline-flex;align-items:center;gap:8px;font:500 17px/1.2 var(--display)}
.hc-r i{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;font:600 13px/1 var(--sans);font-style:normal}
main table.hc-table tr.hc-good{background:linear-gradient(90deg,#f3d79e1c,#f3d79e05 60%)}
main table.hc-table tr.hc-good .hc-r{color:var(--moon)}
main table.hc-table tr.hc-good .hc-r i{color:#231a0a;background:var(--moon);box-shadow:0 0 12px #f3d79e66}
main table.hc-table tr.hc-good th b{color:var(--moon)}
main table.hc-table tr.hc-neutral .hc-r{color:var(--muted)}
main table.hc-table tr.hc-neutral .hc-r i{color:var(--muted);box-shadow:inset 0 0 0 1px #ffffff26}
main table.hc-table tr.hc-bad{background:linear-gradient(90deg,#bba8ff14,#bba8ff03 60%)}
main table.hc-table tr.hc-bad .hc-r{color:var(--hc-lilac)}
main table.hc-table tr.hc-bad .hc-r i{color:var(--hc-lilac);box-shadow:inset 0 0 0 1px #c9a6ff66}
main table.hc-table tr.hc-bad th b{color:var(--hc-lilac)}
main table.hc-table tbody th small{display:block;margin:4px 0 0}
main table.m-table.hc-table tr.m-today{background:linear-gradient(90deg,#f3d79e33,#f3d79e0a);box-shadow:inset 3px 0 0 var(--moon)}
.hc-note{max-width:640px;margin:16px auto 0;text-align:center;color:var(--muted);font-size:13.5px;line-height:1.5}

/* ---------- хаб: месяцы со счётчиком удачных дней ---------- */
.hc-months li{width:132px}
.hc-months a{gap:2px}
.hc-months b{order:2}
.hc-months small{order:3}
.hc-months .hc-n{order:1;position:relative;isolation:isolate;display:grid;place-items:center;width:64px;height:64px;margin-bottom:6px;font:500 30px/1 var(--display);font-variant-numeric:lining-nums;color:#fff4dc;text-shadow:0 2px 10px #0d0b29}
.hc-months .hc-n:before{content:'';position:absolute;z-index:-1;inset:0;background:url(/assets/img/star-gold.webp) center/100% no-repeat;opacity:.45;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.hc-months a:hover .hc-n:before{transform:rotate(22deg) scale(1.08);opacity:.7}

/* ---------- телефон: декор скрыт, сцена компактнее, таблица в ширину экрана ---------- */
@media (max-width:640px){
 .hc-hero .sg-stage{grid-template-columns:minmax(0,1fr) minmax(0,196px) minmax(0,1fr)}
 .hc-arc-r{font-size:27px}
 .hc-side .mo.hc-mo{--s:52px;margin:6px 0}
 .hc-side .hc-z{width:56px;height:56px}
 .hc-side small{margin-top:6px}
 .hc-side b{font-size:15.5px;line-height:1.2}
 main .hc-today-why{font-size:14.5px;margin-top:6px}
 .hc-hero .mn-lead:after{width:200px}
 .hc-best{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 10px}
 .hc-best b{width:88px;height:88px;font-size:40px}
 .hc-best li>span{font-size:17px}
 .hc-best small{font-size:12.5px}
 .hc-bad{grid-template-columns:1fr}
 .hc-bad li{grid-template-columns:34px 1fr;gap:10px}.hc-bad b{font-size:22px}
 main table.hc-table tbody th{width:44px}
 main table.hc-table td:nth-child(2){width:auto;white-space:normal}
 main table.hc-table td{font-size:13px}
 main table.hc-table td small{display:none} /* подсказка о фазе повторяется из строки в строку — на телефоне строки короче */
 .hc-r{display:flex;flex-direction:column;align-items:flex-start;gap:4px;font-size:14px}
 .hc-r i{width:20px;height:20px;font-size:11px}
 .hc-months li{width:calc((100% - 8px) / 3)}
 .hc-months .hc-n{width:52px;height:52px;font-size:25px}
 .hc-months small{font-size:12px}
}
/* процент освещённости рядом с фазой: в строку через точку, на телефоне — второй строкой */
.hc-ph .hc-pct:before{content:'· '}
@media (max-width:640px){.hc-ph .hc-pct{display:block}.hc-ph .hc-pct:before{content:none}}
/* облако слева выше подписи «Луна сегодня», чтобы не ложилось под текст */
.hc-hero .sg-c1{top:-4%;left:-30%}
@media (max-width:640px){.hc-hero .sg-c1{top:44%;left:-36%}}