@font-face { font-family:'DaysOne'; src:url('/fonts/DaysOne-Regular.woff') format('woff'); font-weight:400; font-display:swap; }

:root {
  --bg: #07080a;
  --bg-alt: #141416;
  --text: #ffffff;
  --text-muted: #d1cdcd;
  --accent: #ac1f1f;
  --accent-hover: #8f1919;
  --font-display: 'DaysOne', Arial, sans-serif;
  --font-body: 'Montserrat', Arial, sans-serif;
  --font-russo: 'Russo One', Arial, sans-serif;
  --container: 1200px;
  --radius: 6px;
}

* { box-sizing: border-box; }
html, body { margin: 0; background: var(--bg); color: var(--text); font-family: var(--font-body); overflow-x: hidden; }
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }

.section { padding: 72px 24px; }
.section__inner { width: 100%; max-width: var(--container); margin: 0 auto; }
.section__title { font-family: var(--font-display); text-transform: uppercase; color: var(--accent); font-size: clamp(24px,4vw,36px); line-height: 1.15; margin: 0 0 32px; }
.section__title--center { text-align: center; }

.btn { display: inline-flex; align-items: center; justify-content: center; padding: 17px 32px; border-radius: var(--radius); font-family: var(--font-russo); font-weight: 400; text-transform: uppercase; letter-spacing: .02em; font-size: 15px; border: 2px solid transparent; cursor: pointer; transition: all .2s ease; }
.btn--primary { background: linear-gradient(180deg,#c0302f,#8f1919); color: #fff; border-color: var(--accent); }
.btn--primary:hover { background: var(--accent-hover); }
.btn--outline { background: transparent; color: #fff; border-color: var(--accent); }
.btn--outline:hover { background: rgba(172,31,31,.15); }

/* ---- header ---- */
.site-header { position: sticky; top: 0; z-index: 50; background: transparent; }
.site-header__inner { max-width: var(--container); margin: 0 auto; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 20px; padding: 18px 24px; }
.site-header__brand { justify-self: start; }
.site-header__actions { justify-self: end; display: flex; align-items: center; gap: 16px; }
.site-header__brand img { width: 84px; height: 84px; border-radius: 50%; }
.site-header__nav { display: flex; justify-content: center; gap: 22px; flex-wrap: wrap; }
.site-header__nav a { font-family: var(--font-russo); font-size: 15px; font-weight: 400; text-transform: uppercase; letter-spacing: .02em; color: #fff; }
.site-header__nav a:hover { color: var(--accent); }
.site-header__burger { display: none; width: 42px; height: 42px; border-radius: 50%; background: #d13b3b; border: none; color: #fff; font-size: 19px; cursor: pointer; align-items: center; justify-content: center; }
@media (max-width: 900px) {
  .site-header__inner { grid-template-columns: auto auto; justify-content: space-between; }
  .site-header__nav { display: none; position: absolute; top: 100%; left: 0; right: 0; background: var(--bg); flex-direction: column; padding: 16px 24px; border-top: 1px solid rgba(255,255,255,.08); }
  .site-header.nav-open .site-header__nav { display: flex; }
  .site-header__burger { display: flex; }
}

/* ---- hero ---- */
.hero { min-height: min(88vh, 760px); margin-top: -72px; display: flex; align-items: center; background-size: cover; background-position: center; background-repeat: no-repeat; padding-top: 192px; }
.hero__inner { max-width: 640px; margin-left: 0; margin-right: auto; }
.hero__title { font-family: var(--font-display); color: var(--accent); font-size: clamp(40px,7vw,72px); text-transform: uppercase; line-height: 1.05; margin: 0 0 20px; }
.hero__subtitle { font-family: var(--font-russo); font-weight: 400; text-transform: uppercase; font-size: 21px; margin: 0 0 24px; }
.hero__meta { display: flex; gap: 32px; flex-wrap: wrap; margin-bottom: 24px; font-size: 15.5px; color: var(--text-muted); }
.hero__addresses .icon-row { margin-bottom: 8px; }
.hero__actions { display: flex; gap: 14px; flex-wrap: wrap; }

/* ---- about ---- */
.about__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.about__text { color: var(--text-muted); line-height: 1.7; margin-bottom: 28px; }
.about__stats { display: flex; gap: 32px; flex-wrap: wrap; }
.about__stat-num { display: block; font-family: var(--font-display); font-size: 34px; color: var(--accent); }
.about__stat-label { display: block; font-size: 13px; color: var(--text-muted); text-transform: uppercase; margin-top: 4px; }
.about__photo img { border-radius: var(--radius); width: 100%; }
@media (max-width: 800px) { .about__inner { grid-template-columns: 1fr; } }

/* ---- features ---- */
.features__grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 32px; text-align: center; }
.feature-card__icon { font-size: 52px; margin-bottom: 16px; display: inline-block; }
img.feature-card__icon { width: 78px; height: 78px; object-fit: contain; margin-bottom: 16px; }
.icon-row { display: flex; align-items: flex-start; gap: 10px; }
.icon-row__icon { flex-shrink: 0; display: flex; align-items: center; padding-top: 2px; }
.icon-row__icon .hero__inline-icon, .icon-row__icon .contacts__inline-icon { font-size: 20px; line-height: 1; }
.icon-row__icon img.hero__inline-icon, .icon-row__icon img.contacts__inline-icon { width: 22px; height: 22px; object-fit: contain; display: block; }
.icon-row__body { flex: 1; min-width: 0; }
.feature-card__title { font-family: var(--font-display); text-transform: uppercase; font-size: 15px; margin-bottom: 10px; }
.feature-card__text { color: var(--text-muted); font-size: 14px; line-height: 1.6; }
@media (max-width: 800px) { .features__grid { grid-template-columns: 1fr; } }

/* ---- pricing ---- */
.pricing__row { display: grid; grid-template-columns: auto 1fr 100px 100px; align-items: baseline; column-gap: 16px; }
.pricing__row--header { margin-bottom: 10px; }
.pricing__row-spacer { visibility: hidden; }
.pricing__col-label { font-family: var(--font-display); color: var(--accent); font-size: 13px; text-align: center; }
.price-cat { margin-bottom: 28px; }
.price-cat__label { display: inline-block; background: var(--accent); color: #fff; font-family: var(--font-display); text-transform: uppercase; padding: 8px 22px; border-radius: 4px; margin-bottom: 16px; font-size: 14px; }
.price-row { padding: 10px 0; border-bottom: 1px dotted rgba(255,255,255,.15); }
.price-row__name { font-size: 14.5px; }
.price-row__dots { align-self: center; border-bottom: 1px dotted rgba(255,255,255,.3); margin: 0 2px 5px; }
.price-row__price { text-align: center; color: var(--accent); font-weight: 700; font-size: 14px; }
.pricing__cta { text-align: center; margin-top: 32px; }

@media (max-width: 640px) {
  .pricing__row--header { display: none; }
  .pricing__row.price-row { grid-template-columns: 1fr 1fr; row-gap: 6px; }
  .price-row__name { grid-column: 1 / -1; }
  .price-row__dots { display: none; }
  .price-row__price { text-align: left; }
  .price-row__price::before { content: attr(data-label); display: block; font-family: var(--font-body); color: var(--text-muted); font-weight: 400; text-transform: uppercase; font-size: 9.5px; letter-spacing: .03em; margin-bottom: 2px; }
}

/* ---- cosmetics ---- */
.cosmetics__grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.cosmetics-card { position: relative; border-radius: var(--radius); overflow: hidden; aspect-ratio: 4/5; }
.cosmetics-card img { width: 100%; height: 100%; object-fit: cover; }
.cosmetics-card__title { position: absolute; bottom: 0; left: 0; right: 0; padding: 14px; background: linear-gradient(0deg,rgba(0,0,0,.85),transparent); font-family: var(--font-display); text-transform: uppercase; font-size: 13px; text-align: center; }
@media (max-width: 800px) { .cosmetics__grid { grid-template-columns: repeat(2, 1fr); gap: 12px; } .cosmetics-card__title { font-size: 10px; padding: 8px; } }

/* ---- academy ---- */
.academy { background-size: cover; background-position: center; background-repeat: no-repeat; text-align: center; }
.academy__text { max-width: 620px; margin: 0 auto 28px; color: var(--text-muted); line-height: 1.7; }

/* ---- reviews ---- */
.reviews__slider-wrap { position: relative; display: flex; align-items: center; gap: 8px; }
.reviews__grid { display: flex; align-items: flex-start; gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; padding-bottom: 8px; flex: 1; }
.reviews__grid::-webkit-scrollbar { height: 6px; }
.reviews__grid::-webkit-scrollbar-thumb { background: rgba(255,255,255,.2); border-radius: 100px; }
.review-card {
  background-image: url('/images/review-card-bg.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: center;
  aspect-ratio: 1554 / 1421;
  color: #17161a;
  padding: 8% 8% 9%;
  scroll-snap-align: start;
  flex: 0 0 calc((100% - 40px) / 3);
  min-width: 260px;
  overflow: hidden;
}
.review-card__text { font-size: 12.5px; line-height: 1.4; color: #3a3a3a; margin: 0; }
.review-card__name { font-weight: 700; text-transform: uppercase; font-size: 13px; margin: 0; }
.review-card__rating { color: var(--accent); margin: 4px 0 8px; font-size: 12px; }
.reviews__arrow { flex-shrink: 0; width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(255,255,255,.25); background: transparent; color: #fff; font-size: 20px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.reviews__arrow:hover { border-color: var(--accent); color: var(--accent); }
@media (max-width: 900px) { .review-card { flex-basis: calc(100% - 24px); } }

/* ---- gallery ---- */
.gallery__subtitle { text-align: center; color: var(--text-muted); margin: -20px 0 28px; }
.gallery__grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }
.gallery__grid img { width: 100%; height: 220px; object-fit: cover; border-radius: var(--radius); }
@media (max-width: 900px) { .gallery__grid { grid-template-columns: repeat(2,1fr); } }

/* ---- partners ---- */
.partners__grid { display: flex; justify-content: center; align-items: center; gap: 32px; flex-wrap: wrap; }
.partner-logo img { max-height: 76px; max-width: 220px; width: auto; object-fit: contain; filter: none; opacity: 1; transition: filter .2s ease, opacity .2s ease; }
.partner-logo:hover img { filter: grayscale(1) brightness(1.4); opacity: .85; }

/* ---- contacts + footer ---- */
.contacts__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.contacts__map { min-height: 320px; border-radius: var(--radius); overflow: hidden; background: var(--bg-alt); }
.contacts__row { margin-bottom: 12px; font-size: 14.5px; }
.contacts__row a:hover { color: var(--accent); }
.contacts__social { display: flex; gap: 10px; margin-top: 20px; }
.social-icon { width: 34px; height: 34px; border-radius: 50%; border: 1px solid rgba(255,255,255,.25); display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; overflow: hidden; }
.social-icon img { width: 100%; height: 100%; object-fit: cover; }
.social-icon:hover { border-color: var(--accent); color: var(--accent); }
@media (max-width: 800px) { .contacts__inner { grid-template-columns: 1fr; } }

.site-footer { padding: 24px; border-top: 1px solid rgba(255,255,255,.08); }
.site-footer__inner { max-width: var(--container); margin: 0 auto; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; font-size: 12px; color: var(--text-muted); }
.site-footer__brand { display: flex; align-items: center; gap: 12px; }
.site-footer__brand img { width: 34px; height: 34px; border-radius: 50%; }
.site-footer__legal { display: flex; gap: 18px; flex-wrap: wrap; }
.site-footer__legal a:hover { color: var(--accent); }
