/* ====================================================================
   CASTA.AGENCY — sections.css
   Секции главной страницы (index.html).
   ==================================================================== */

/* ------------------------------ 01 Hero ---------------------------- */

.casta-hero {
  position: relative;
}

.casta-hero__mark {
  display: none;
}

@media (min-width: 1024px) {
  .casta-hero__mark {
    pointer-events: none;
    position: absolute;
    top: calc(-1 * var(--casta-space-28));
    right: var(--casta-hero-mark-right);
    display: block;
    width: var(--casta-hero-mark-w);
    color: var(--casta-color-ink-08);
  }
}

.casta-hero__inner {
  position: relative;
}

.casta-hero__title {
  max-width: var(--casta-measure-hero);
  font-size: var(--casta-fs-display-hero);
}

.casta-hero__lead {
  margin-top: var(--casta-space-8);
  max-width: var(--casta-measure-xl);
  font-size: var(--casta-fs-lg);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-taupe);
}

.casta-hero__lead-strong {
  color: var(--casta-color-ink);
}

.casta-hero__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--casta-space-6);
  margin-top: var(--casta-space-10);
}

/* ---------------------------- 02 Услуги ---------------------------- */
/* Сетка «плитки через волосяную линию» — .casta-tilegrid в components.css */

.casta-services__card {
  background-color: var(--casta-color-bg);
  padding: var(--casta-space-8);
}

@media (min-width: 768px) {
  .casta-services__card {
    padding: var(--casta-space-10);
  }
}

.casta-services__card:hover .casta-glyph {
  transform: scale(1.05);
}

.casta-services__title {
  margin-top: var(--casta-space-6);
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-2xl);
  line-height: var(--casta-lh-tight);
  transition: color var(--casta-dur-fast) var(--casta-ease);
}

.casta-services__card:hover .casta-services__title {
  color: var(--casta-color-accent);
}

.casta-services__desc {
  margin-top: var(--casta-space-3);
  font-size: var(--casta-fs-sm);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-taupe);
}

.casta-services__more {
  margin-top: var(--casta-space-6);
}

/* --------------------------- 03 SEO и GEO -------------------------- */

.casta-seogeo__col {
  background-color: var(--casta-color-bg);
  padding: var(--casta-space-8);
}

@media (min-width: 768px) {
  .casta-seogeo__col {
    padding: var(--casta-space-10);
  }
}

.casta-seogeo__title {
  margin-top: var(--casta-space-4);
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-3xl);
}

.casta-seogeo__points {
  display: flex;
  flex-direction: column;
  gap: var(--casta-space-5);
  margin-top: var(--casta-space-8);
}

.casta-seogeo__point {
  border-top: var(--casta-hairline-w) solid var(--casta-color-hairline);
  padding-top: var(--casta-space-4);
  font-size: var(--casta-fs-sm);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-taupe);
}

.casta-seogeo__more {
  margin-top: var(--casta-space-8);
}

/* --------------------------- 04 Продукты --------------------------- */

.casta-products__card {
  display: flex;
  flex-direction: column;
  background-color: var(--casta-color-bg);
  padding: var(--casta-space-8);
}

@media (min-width: 768px) {
  .casta-products__card {
    padding: var(--casta-space-10);
  }
}

/* ring-1 ring-inset ring-accent */
.casta-products__card--featured {
  box-shadow: inset 0 0 0 var(--casta-hairline-w) var(--casta-color-accent);
}

.casta-products__name {
  margin-top: var(--casta-space-4);
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-2xl);
  line-height: var(--casta-lh-tight);
}

.casta-products__desc {
  margin-top: var(--casta-space-3);
  font-size: var(--casta-fs-sm);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-taupe);
}

.casta-products__price {
  margin-top: var(--casta-space-8);
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-4xl);
  line-height: var(--casta-lh-none);
}

.casta-products__note {
  margin-top: var(--casta-space-2);
  font-size: var(--casta-fs-xs);
  color: var(--casta-color-taupe);
}

.casta-products__tag {
  margin-top: var(--casta-space-6);
  border-left: var(--casta-border-2) solid var(--casta-color-accent);
  padding-left: var(--casta-space-4);
  font-size: var(--casta-fs-sm);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-ink-80);
}

.casta-products__btn {
  margin-top: var(--casta-space-8);
}

/* ----------------------------- 05 Шаги ----------------------------- */

.casta-steps {
  margin-top: var(--casta-space-10);
}

.casta-steps__item {
  display: flex;
  flex-direction: column;
  gap: var(--casta-space-4);
  border-top: var(--casta-hairline-w) solid var(--casta-color-hairline);
  padding: var(--casta-space-7) 0;
}

@media (min-width: 768px) {
  .casta-steps__item {
    flex-direction: row;
    align-items: center;
    gap: var(--casta-space-8);
  }
}

.casta-steps__num {
  display: flex;
  width: var(--casta-size-stepnum);
  height: var(--casta-size-stepnum);
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  border: var(--casta-hairline-w) solid var(--casta-color-hairline);
  border-radius: var(--casta-radius-full);
  background-color: var(--casta-color-grey);
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-2xl);
  line-height: var(--casta-lh-none);
  color: var(--casta-color-accent);
}

@media (min-width: 768px) {
  .casta-steps__num {
    width: var(--casta-size-stepnum-md);
    height: var(--casta-size-stepnum-md);
    font-size: var(--casta-fs-3xl);
  }
}

.casta-steps__title {
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-2xl);
  line-height: var(--casta-lh-tight);
  transition: color var(--casta-dur-fast) var(--casta-ease);
}

@media (min-width: 768px) {
  .casta-steps__title {
    width: var(--casta-step-title-w);
    font-size: var(--casta-fs-3xl);
  }
}

.casta-steps__item:hover .casta-steps__title {
  color: var(--casta-color-accent);
}

.casta-steps__desc {
  font-size: var(--casta-fs-sm);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-taupe);
}

@media (min-width: 768px) {
  .casta-steps__desc {
    flex: 1;
  }
}

/* --------------------------- 07 Портфолио -------------------------- */

.casta-cases__card {
  background-color: var(--casta-color-bg);
  padding: var(--casta-space-8);
}

@media (min-width: 768px) {
  .casta-cases__card {
    padding: var(--casta-space-10);
  }
}

.casta-cases__meta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--casta-space-4);
}

.casta-cases__metric {
  margin-top: var(--casta-space-6);
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-2xl);
  line-height: var(--casta-lh-tight);
  transition: color var(--casta-dur-fast) var(--casta-ease);
}

@media (min-width: 768px) {
  .casta-cases__metric {
    font-size: var(--casta-fs-3xl);
  }
}

.casta-cases__card:hover .casta-cases__metric {
  color: var(--casta-color-accent);
}

.casta-cases__client {
  margin-top: var(--casta-space-4);
  font-size: var(--casta-fs-sm);
  color: var(--casta-color-taupe);
}

.casta-cases__all {
  margin-top: var(--casta-space-10);
}

/* ------------------------ 08 Экспресс-аудит ------------------------ */

.casta-express {
  position: relative;
  overflow: hidden;
  border: var(--casta-hairline-w) solid var(--casta-color-accent-20);
  background-color: var(--casta-color-accent-soft-40);
  padding: var(--casta-space-8);
}

@media (min-width: 768px) {
  .casta-express {
    padding: var(--casta-space-12);
  }
}

@media (min-width: 1024px) {
  .casta-express {
    padding: var(--casta-space-16);
  }
}

.casta-express__mark {
  pointer-events: none;
  position: absolute;
  top: calc(-1 * var(--casta-space-12));
  right: calc(-1 * var(--casta-space-12));
  width: var(--casta-audit-mark-w);
  color: var(--casta-color-accent-10);
}

@media (min-width: 1024px) {
  .casta-express__mark {
    width: var(--casta-audit-mark-w-lg);
  }
}

.casta-express__grid {
  position: relative;
  display: grid;
  gap: var(--casta-space-12);
}

@media (min-width: 1024px) {
  .casta-express__grid {
    grid-template-columns: 1fr 1.1fr;
  }
}

.casta-express__title {
  margin-top: var(--casta-space-5);
}

.casta-express__lead {
  margin-top: var(--casta-space-6);
  max-width: var(--casta-measure-md);
  font-size: var(--casta-fs-lg);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-taupe);
}

.casta-express__list {
  margin-top: var(--casta-space-8);
}

.casta-express__list .casta-checklist__text {
  color: var(--casta-color-ink-90);
}

.casta-express__panel {
  background-color: var(--casta-color-bg);
  padding: var(--casta-space-6);
}

@media (min-width: 768px) {
  .casta-express__panel {
    padding: var(--casta-space-8);
  }
}

@media (min-width: 1024px) {
  .casta-express__panel {
    padding: var(--casta-space-10);
  }
}

.casta-express__panel-title {
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-2xl);
  line-height: var(--casta-lh-tight);
}

.casta-express__panel-note {
  margin-top: var(--casta-space-2);
  font-size: var(--casta-fs-sm);
  color: var(--casta-color-taupe);
}

.casta-express__form {
  margin-top: var(--casta-space-8);
}

/* ---------------------------- 09 Отзывы ---------------------------- */

.casta-reviews__card {
  background-color: var(--casta-color-bg);
  padding: var(--casta-space-8);
}

@media (min-width: 768px) {
  .casta-reviews__card {
    padding: var(--casta-space-10);
  }
}

.casta-reviews__quote {
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-xl);
  line-height: var(--casta-lh-snug);
}

@media (min-width: 768px) {
  .casta-reviews__quote {
    font-size: var(--casta-fs-2xl);
  }
}

.casta-reviews__caption {
  margin-top: var(--casta-space-8);
  border-top: var(--casta-hairline-w) solid var(--casta-color-hairline);
  padding-top: var(--casta-space-4);
}

.casta-reviews__name {
  display: block;
  font-size: var(--casta-fs-sm);
  color: var(--casta-color-ink);
}

.casta-reviews__role {
  display: block;
  margin-top: var(--casta-space-1);
}

/* ----------------------------- 10 О нас ---------------------------- */

.casta-about__grid {
  display: grid;
  gap: var(--casta-space-10);
  margin-top: var(--casta-space-12);
}

@media (min-width: 768px) {
  .casta-about__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.casta-about__text {
  font-size: var(--casta-fs-lg);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-taupe);
}

.casta-about__strong {
  color: var(--casta-color-ink);
}

.casta-about__more {
  margin-top: var(--casta-space-10);
}

/* ---------------------------- 11 Команда --------------------------- */

.casta-team {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--casta-space-12) var(--casta-space-8);
  margin-top: var(--casta-space-10);
}

@media (min-width: 768px) {
  .casta-team {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.casta-team__photo {
  display: flex;
  aspect-ratio: var(--casta-aspect-portrait);
  align-items: center;
  justify-content: center;
  border: var(--casta-hairline-w) solid var(--casta-color-hairline);
  background-color: var(--casta-color-grey);
}

.casta-team__initials {
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-5xl);
  color: var(--casta-color-taupe);
}

@media (min-width: 768px) {
  .casta-team__initials {
    font-size: var(--casta-fs-6xl);
  }
}

.casta-team__name {
  margin-top: var(--casta-space-4);
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-xl);
  line-height: var(--casta-lh-tight);
}

.casta-team__role {
  margin-top: var(--casta-space-1);
}

.casta-team__link {
  margin-top: var(--casta-space-2);
}

/* ------------------------ 12 Ниши и инструменты -------------------- */

.casta-niches__chips {
  display: flex;
  flex-wrap: wrap;
  gap: var(--casta-space-3);
  margin-top: var(--casta-space-10);
}

.casta-niches__chip {
  border: var(--casta-hairline-w) solid var(--casta-color-hairline);
  padding: var(--casta-space-2) var(--casta-space-4);
  font-size: var(--casta-fs-sm);
  letter-spacing: var(--casta-ls-wide);
  color: var(--casta-color-ink-80);
  transition:
    color var(--casta-dur-fast) var(--casta-ease),
    border-color var(--casta-dur-fast) var(--casta-ease);
}

.casta-niches__chip:hover {
  border-color: var(--casta-color-accent);
  color: var(--casta-color-accent);
}

.casta-niches__tools {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--casta-hairline-w);
  margin-top: var(--casta-space-12);
  border: var(--casta-hairline-w) solid var(--casta-color-hairline);
  background-color: var(--casta-color-hairline);
}

@media (min-width: 640px) {
  .casta-niches__tools {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .casta-niches__tools {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}

.casta-niches__tool {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--casta-color-bg);
  padding: var(--casta-space-8) var(--casta-space-4);
  text-align: center;
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-lg);
  color: var(--casta-color-taupe);
  filter: grayscale(1);
  transition:
    color var(--casta-dur-fast) var(--casta-ease),
    filter var(--casta-dur-fast) var(--casta-ease);
}

.casta-niches__tool:hover {
  color: var(--casta-color-accent);
  filter: grayscale(0);
}

/* --------------------------- 13 Статьи ----------------------------- */

.casta-blogfeed__card {
  background-color: var(--casta-color-bg);
}

.casta-blogfeed__media {
  aspect-ratio: var(--casta-aspect-media);
  border-bottom: var(--casta-hairline-w) solid var(--casta-color-hairline);
  background-color: var(--casta-color-grey);
}

.casta-blogfeed__body {
  padding: var(--casta-space-8);
}

.casta-blogfeed__title {
  margin-top: var(--casta-space-4);
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-2xl);
  line-height: var(--casta-lh-tight);
  transition: color var(--casta-dur-fast) var(--casta-ease);
}

.casta-blogfeed__card:hover .casta-blogfeed__title {
  color: var(--casta-color-accent);
}

.casta-blogfeed__lead {
  margin-top: var(--casta-space-3);
  font-size: var(--casta-fs-sm);
  color: var(--casta-color-taupe);
}

.casta-blogfeed__all {
  margin-top: var(--casta-space-10);
}

/* ------------------------ 15 Обсудить проект ----------------------- */

.casta-cta {
  position: relative;
  overflow: hidden;
  border: var(--casta-hairline-w) solid var(--casta-color-hairline);
  background-color: var(--casta-color-ink);
  color: var(--casta-color-on-ink);
}

.casta-cta__mark {
  pointer-events: none;
  position: absolute;
  top: calc(-1 * var(--casta-space-16));
  right: calc(-1 * var(--casta-space-12));
  width: var(--casta-cta-mark-w);
  opacity: 0.07;
}

@media (min-width: 1024px) {
  .casta-cta__mark {
    top: 0;
    right: calc(-1 * var(--casta-space-8));
    width: var(--casta-cta-mark-w-lg);
  }
}

.casta-cta__inner {
  position: relative;
  padding: var(--casta-space-14) var(--casta-space-6);
}

@media (min-width: 768px) {
  .casta-cta__inner {
    padding: var(--casta-space-20) var(--casta-space-14);
  }
}

@media (min-width: 1024px) {
  .casta-cta__inner {
    padding: var(--casta-space-24) var(--casta-space-20);
  }
}

.casta-cta__badge {
  display: inline-block;
  border: var(--casta-hairline-w) solid var(--casta-color-accent-40);
  background-color: var(--casta-color-accent-10);
  padding: var(--casta-space-1-5) var(--casta-space-3);
  color: var(--casta-color-on-accent);
}

.casta-cta__title {
  margin-top: var(--casta-space-8);
  max-width: var(--casta-measure-20ch);
  font-size: var(--casta-fs-display-cta);
  color: var(--casta-color-on-ink);
}

.casta-cta__grid {
  display: grid;
  gap: var(--casta-space-12);
  margin-top: var(--casta-space-12);
}

@media (min-width: 1024px) {
  .casta-cta__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--casta-space-16);
  }
}

.casta-cta__lead {
  max-width: var(--casta-measure-lg);
  font-size: var(--casta-fs-lg);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-on-ink-75);
}

.casta-cta__list {
  margin-top: var(--casta-space-8);
}

.casta-cta__list .casta-checklist__text {
  color: var(--casta-color-on-ink-85);
}

.casta-cta__actions {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.casta-cta__stack {
  display: flex;
  flex-direction: column;
  gap: var(--casta-space-4);
}

.casta-cta__primary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: var(--casta-hairline-w) solid var(--casta-color-accent);
  background-color: var(--casta-color-accent);
  padding: var(--casta-space-5) var(--casta-space-7);
  font-size: var(--casta-fs-sm);
  font-weight: var(--casta-fw-medium);
  letter-spacing: var(--casta-ls-wide);
  color: var(--casta-color-on-accent);
  transition:
    color var(--casta-dur-fast) var(--casta-ease),
    background-color var(--casta-dur-fast) var(--casta-ease),
    border-color var(--casta-dur-fast) var(--casta-ease);
}

.casta-cta__primary:hover {
  border-color: var(--casta-color-on-ink);
  background-color: var(--casta-color-on-ink);
  color: var(--casta-color-ink);
}

.casta-cta__arrow {
  transition: transform var(--casta-dur-fast) var(--casta-ease);
}

.casta-cta__primary:hover .casta-cta__arrow {
  transform: translateX(var(--casta-space-1));
}

.casta-cta__channel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: var(--casta-hairline-w) solid var(--casta-color-on-ink-25);
  padding: var(--casta-space-5) var(--casta-space-7);
  font-size: var(--casta-fs-sm);
  letter-spacing: var(--casta-ls-wide);
  color: var(--casta-color-on-ink);
  transition:
    color var(--casta-dur-fast) var(--casta-ease),
    border-color var(--casta-dur-fast) var(--casta-ease);
}

.casta-cta__channel:hover {
  border-color: var(--casta-color-accent);
  color: var(--casta-color-accent);
}

.casta-cta__channel-name {
  display: flex;
  align-items: center;
  gap: var(--casta-space-2-5);
}

.casta-cta__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--casta-space-6);
  margin-top: var(--casta-space-8);
  border-top: var(--casta-hairline-w) solid var(--casta-color-on-ink-10);
  padding-top: var(--casta-space-6);
  font-size: var(--casta-fs-sm);
  color: var(--casta-color-on-ink-60);
}

.casta-cta__meta-item {
  display: flex;
  align-items: center;
  gap: var(--casta-space-2-5);
}

/* ---------------------------- 16 Контакты -------------------------- */

.casta-contacts__grid {
  display: grid;
  gap: var(--casta-space-14);
  margin-top: var(--casta-space-10);
}

@media (min-width: 1024px) {
  .casta-contacts__grid {
    grid-template-columns: 1.3fr 1fr;
  }
}

.casta-contacts__info {
  display: flex;
  flex-direction: column;
  gap: var(--casta-space-8);
}

.casta-contacts__row {
  border-top: var(--casta-hairline-w) solid var(--casta-color-hairline);
  padding-top: var(--casta-space-4);
}

.casta-contacts__value {
  margin-top: var(--casta-space-2);
  font-size: var(--casta-fs-base);
  color: var(--casta-color-ink);
}


/* ====================== 404 — страница не найдена ====================== */
/* Отдельная служебная страница, в счетчик секций не входит. */

.casta-notfound__text {
  max-width: 46ch;
  margin-top: var(--casta-space-4);
  font-size: var(--casta-fs-lg);
  line-height: var(--casta-lh-body);
  color: var(--casta-color-taupe);
}

.casta-notfound__links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--casta-space-4) var(--casta-space-6);
  margin-top: var(--casta-space-8);
  padding: 0;
  list-style: none;
}

.casta-notfound__link {
  font-family: var(--casta-font-mono);
  font-size: var(--casta-fs-label);
  letter-spacing: var(--casta-ls-label);
  text-transform: uppercase;
  color: var(--casta-color-ink);
  text-decoration: none;
  border-bottom: var(--casta-hairline-w) solid var(--casta-color-hairline);
  padding-bottom: var(--casta-space-1);
  transition: color var(--casta-dur-fast) var(--casta-ease),
    border-color var(--casta-dur-fast) var(--casta-ease);
}

.casta-notfound__link:hover,
.casta-notfound__link:focus-visible {
  color: var(--casta-color-accent);
  border-color: var(--casta-color-accent);
}

.casta-notfound__cta {
  margin-top: var(--casta-space-10);
}


/* ========================= services.html — услуги ========================= */
/* Страница /services. Новые блоки: шапка страницы, карточки услуг,
   форматы, тёмная CTA-панель. Общие мелкие компоненты этапа 2
   (кнопки, крошки, плотный список) — в components.css. */

/* Секция-шапка внутренней страницы: py-12 md:py-16 вместо базовых */
.casta-section--pagehead {
  padding-top: var(--casta-space-12);
  padding-bottom: var(--casta-space-12);
}

@media (min-width: 768px) {
  .casta-section--pagehead {
    padding-top: var(--casta-space-16);
    padding-bottom: var(--casta-space-16);
  }
}

/* --------------------------- Шапка страницы ------------------------ */

.casta-pagehead {
  position: relative;
  margin-top: var(--casta-space-8);
}

.casta-pagehead__mark {
  display: none;
}

@media (min-width: 1024px) {
  .casta-pagehead__mark {
    pointer-events: none;
    position: absolute;
    top: calc(-1 * var(--casta-space-20));
    right: var(--casta-pagehead-mark-right);
    display: block;
    width: var(--casta-pagehead-mark-w);
    color: var(--casta-color-ink);
    opacity: 0.07;
  }
}

.casta-pagehead__inner {
  position: relative;
}

/* hyphens/overflow-wrap: одно длинное слово в h1 («конфиденциальности»)
   при 2.25rem шире экрана 360–390px; правило срабатывает только когда
   слово не помещается, на остальных h1 не влияет */
.casta-pagehead__title {
  max-width: var(--casta-measure-20ch);
  font-size: var(--casta-fs-display-page);
  hyphens: auto;
  overflow-wrap: anywhere;
}

.casta-pagehead__lead {
  margin-top: var(--casta-space-7);
  max-width: var(--casta-measure-2xl);
  font-size: var(--casta-fs-lg);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-taupe);
}

/* Ограничитель ширины сетки показателей; ячейки — .casta-stat (components.css) */
.casta-pagehead__stats {
  max-width: var(--casta-measure-2xl);
}

/* -------------------------- Карточки услуг ------------------------- */

.casta-svc__card {
  position: relative;
  display: flex;
  flex-direction: column;
  background-color: var(--casta-color-bg);
  padding: var(--casta-space-8);
}

@media (min-width: 768px) {
  .casta-svc__card {
    padding: var(--casta-space-10);
  }
}

/* ring-1 ring-inset ring-accent */
.casta-svc__card--featured {
  box-shadow: inset 0 0 0 var(--casta-hairline-w) var(--casta-color-accent);
}

/* Угловое позиционирование общего бейджа в карточке услуги.
   Одинаковых контекстов два, поэтому порог правила трёх блоков не достигнут. */
.casta-svc__badge {
  position: absolute;
  top: var(--casta-space-6);
  right: var(--casta-space-8);
}

@media (min-width: 768px) {
  .casta-svc__badge {
    right: var(--casta-space-10);
  }
}

.casta-svc__card:hover .casta-glyph {
  transform: scale(1.05);
}

.casta-svc__title {
  margin-top: var(--casta-space-6);
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-2xl);
  line-height: var(--casta-lh-tight);
  transition: color var(--casta-dur-fast) var(--casta-ease);
}

@media (min-width: 768px) {
  .casta-svc__title {
    font-size: var(--casta-fs-3xl);
  }
}

.casta-svc__card:hover .casta-svc__title {
  color: var(--casta-color-accent);
}

.casta-svc__lead {
  margin-top: var(--casta-space-5);
  font-size: var(--casta-fs-sm);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-taupe);
}

/* Подвал карточки: цена + срок над волосяной линией (.casta-ruletop) */
.casta-svc__foot {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--casta-space-6);
  margin-top: var(--casta-space-8);
  padding-top: var(--casta-space-6);
}

.casta-svc__price {
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-3xl);
  line-height: var(--casta-lh-none);
}

.casta-svc__note {
  margin-top: var(--casta-space-2);
  font-size: var(--casta-fs-xs);
  color: var(--casta-color-taupe);
}

/* ---------------------------- Форматы ------------------------------ */

.casta-formats__card {
  background-color: var(--casta-color-bg);
  padding: var(--casta-space-8);
}

@media (min-width: 768px) {
  .casta-formats__card {
    padding: var(--casta-space-10);
  }
}

.casta-formats__title {
  margin-top: var(--casta-space-4);
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-3xl);
  line-height: var(--casta-lh-tight);
}

.casta-formats__desc {
  margin-top: var(--casta-space-5);
  font-size: var(--casta-fs-sm);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-taupe);
}

/* ------------------- Тёмная CTA-панель внутренних страниц ---------- */

.casta-pagecta {
  position: relative;
  overflow: hidden;
  background-color: var(--casta-color-ink);
  color: var(--casta-color-on-ink);
  padding: var(--casta-space-8);
}

@media (min-width: 768px) {
  .casta-pagecta {
    padding: var(--casta-space-14);
  }
}

.casta-pagecta__mark {
  pointer-events: none;
  position: absolute;
  right: calc(-1 * var(--casta-space-10));
  bottom: calc(-1 * var(--casta-space-24));
  display: none;
  width: var(--casta-pagecta-mark-w);
  opacity: 0.09;
}

@media (min-width: 1024px) {
  .casta-pagecta__mark {
    display: block;
  }
}

.casta-pagecta__inner {
  position: relative;
  max-width: var(--casta-measure-2xl);
}

.casta-pagecta__title {
  margin-top: var(--casta-space-5);
  font-size: var(--casta-fs-display-panel);
  color: var(--casta-color-on-ink);
}

.casta-pagecta__text {
  margin-top: var(--casta-space-5);
  font-size: var(--casta-fs-base);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-on-ink-75);
}


/* ============ services-seo-audit-saita.html — страница SEO-аудита ============ */
/* Блок casta-audit__* принадлежит только лендингу SEO-аудита.
   Секция экспресс-аудита главной после финальной сверки использует
   отдельный префикс casta-express__*. Часть 1: шапка, problem, outcome,
   scope, geo, method, timeline. Часть 2: why, cases, pricing, compare,
   objections, risk, faq, cta (форма заявки). */

/* --------------------------- Шапка-лендинг ------------------------- */

/* Сетка героя: колонка оффера + панель фактов (lg 1.15fr/0.85fr) */
.casta-audit__hero {
  display: grid;
  gap: var(--casta-space-12);
}

@media (min-width: 1024px) {
  .casta-audit__hero {
    grid-template-columns: 1.15fr 0.85fr;
  }
}

.casta-audit__hero-title {
  margin-top: var(--casta-space-4);
  max-width: var(--casta-measure-18ch);
  font-size: var(--casta-fs-display-page);
}

/* Три преимущества под лидом (rule-top в HTML) */
.casta-audit__points {
  display: grid;
  gap: var(--casta-space-4);
  margin-top: var(--casta-space-9);
}

@media (min-width: 640px) {
  .casta-audit__points {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.casta-audit__point {
  padding-top: var(--casta-space-4);
}

/* Пара «тезис + пояснение» (плюсы героя, список GEO-блока) */
.casta-audit__mini-title {
  font-size: var(--casta-fs-sm);
  color: var(--casta-color-ink);
}

/* Вариант тезиса в герое: leading-snug */
.casta-audit__mini-title--snug {
  line-height: var(--casta-lh-snug);
}

.casta-audit__mini-desc {
  margin-top: var(--casta-space-1-5);
  font-size: var(--casta-fs-xs);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-taupe);
}

/* Ряд CTA: кнопка + микротекст (gap-x-6 gap-y-3) */
.casta-audit__cta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: var(--casta-space-6);
  row-gap: var(--casta-space-3);
  margin-top: var(--casta-space-9);
}

.casta-audit__cta-micro {
  max-width: var(--casta-measure-sm);
  font-size: var(--casta-fs-xs);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-taupe);
}

/* Микротекст под кнопками героя */
.casta-audit__micro {
  margin-top: var(--casta-space-4);
  font-size: var(--casta-fs-xs);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-taupe);
}

/* Панель фактов справа (в герое) */
.casta-audit__facts {
  align-self: start;
  border: var(--casta-hairline-w) solid var(--casta-color-hairline);
}

/* Сетка 2×2 показателей; ячейки — .casta-stat (components.css) */
.casta-audit__stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--casta-hairline-w);
  background-color: var(--casta-color-hairline);
}

.casta-audit__fit {
  border-top: var(--casta-hairline-w) solid var(--casta-color-hairline);
  padding: var(--casta-space-6);
}

.casta-audit__fit-list {
  margin-top: var(--casta-space-4);
}

.casta-audit__note {
  margin-top: var(--casta-space-6);
  font-size: var(--casta-fs-xs);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-taupe);
}

/* Чернильное выделение внутри приглушённого текста */
.casta-audit__strong {
  color: var(--casta-color-ink);
}

/* ------------------------ Общие элементы блоков --------------------- */

/* Вводный абзац блока — .casta-section__intro (layout.css); плитка, её
   заголовок/текст/подпись — .casta-tile (components.css); линия-маркер —
   .casta-rule (components.css). Этап 4: вынесены по правилу трёх блоков */

/* Список определений «подпись + значение» (method, cases, compare).
   Разброс mt-4/5/6 и gap-3/4 исходника сведён к одному правилу */
.casta-audit__dl {
  display: flex;
  flex-direction: column;
  gap: var(--casta-space-3);
  margin-top: var(--casta-space-5);
  font-size: var(--casta-fs-sm);
  line-height: var(--casta-lh-relaxed);
}

.casta-audit__dd {
  margin-top: var(--casta-space-1);
  color: var(--casta-color-taupe);
}

.casta-audit__dd--strong {
  color: var(--casta-color-ink-85);
}


/* ----------------------------- 01 Problem --------------------------- */

.casta-audit__problem-text {
  margin-top: var(--casta-space-3);
  font-size: var(--casta-fs-base);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-ink-85);
}

.casta-audit__problem-note {
  font-size: var(--casta-fs-base);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-taupe);
}

/* ------------------------------ 03 Scope ---------------------------- */

/* Итог карточки состава работ (rule-top в HTML) */
.casta-audit__scope-value {
  margin-top: var(--casta-space-7);
  padding-top: var(--casta-space-5);
  font-size: var(--casta-fs-sm);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-ink);
}

/* ------------------------------- 04 GEO ----------------------------- */

.casta-audit__geo {
  display: grid;
  gap: var(--casta-space-10);
  margin-top: var(--casta-space-10);
}

@media (min-width: 1024px) {
  .casta-audit__geo {
    grid-template-columns: 1.1fr 0.9fr;
  }
}

.casta-audit__geo-text {
  display: flex;
  flex-direction: column;
  gap: var(--casta-space-5);
  font-size: var(--casta-fs-base);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-taupe);
}

/* Сетка-плитка без верхнего отступа (лежит внутри своей сетки) */
.casta-audit__geo-list {
  display: grid;
  gap: var(--casta-hairline-w);
  border: var(--casta-hairline-w) solid var(--casta-color-hairline);
  background-color: var(--casta-color-hairline);
}

/* ----------------------------- 05 Method ---------------------------- */

.casta-audit__num {
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-4xl);
  line-height: var(--casta-lh-none);
  color: var(--casta-color-accent);
}

.casta-audit__method-title {
  margin-top: var(--casta-space-5);
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-2xl);
  line-height: var(--casta-lh-tight);
}

/* ---------------------------- 06 Timeline --------------------------- */

.casta-audit__phase-title {
  margin-top: var(--casta-space-3);
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-3xl);
  line-height: var(--casta-lh-tight);
}

/* ------------------------------ 09 Pricing -------------------------- */

/* hyphens: «индивидуально» при text-4xl не помещается в треть контентной
   колонки до ~1400px (в исходнике вылезает так же); переносим по слогам */
.casta-audit__price {
  margin-top: var(--casta-space-5);
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-4xl);
  line-height: var(--casta-lh-none);
  hyphens: auto;
}

/* Рамка «От чего зависит цена» */
.casta-audit__factors {
  margin-top: var(--casta-space-10);
  border: var(--casta-hairline-w) solid var(--casta-color-hairline);
  padding: var(--casta-space-8);
}

/* Горизонтальный список факторов поверх .casta-checklist--dense */
.casta-audit__factors-list {
  flex-direction: row;
  flex-wrap: wrap;
  column-gap: var(--casta-space-8);
  row-gap: var(--casta-space-3);
  margin-top: var(--casta-space-5);
}

/* ------------------------------ 10 Compare -------------------------- */

/* Обёртка таблицы: прокрутка по горизонтали, фокусируется с клавиатуры
   (tabindex="0"); показывается от 768px, ниже — карточки */
.casta-audit__table-wrap {
  display: none;
  margin-top: var(--casta-space-10);
  overflow-x: auto;
}

.casta-audit__table-wrap:focus-visible {
  outline: none;
  box-shadow: var(--casta-shadow-focus);
}

@media (min-width: 768px) {
  .casta-audit__table-wrap {
    display: block;
  }
}

.casta-audit__table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--casta-fs-sm);
  text-align: left;
}

/* Шапка таблицы (с .casta-label): border-y у строки thead */
.casta-audit__th {
  border-top: var(--casta-hairline-w) solid var(--casta-color-hairline);
  border-bottom: var(--casta-hairline-w) solid var(--casta-color-hairline);
  padding: var(--casta-space-4) var(--casta-space-6) var(--casta-space-4) 0;
  text-align: left;
  vertical-align: bottom;
}

.casta-audit__th--accent {
  color: var(--casta-color-accent);
}

.casta-audit__rowhead {
  border-bottom: var(--casta-hairline-w) solid var(--casta-color-hairline);
  padding: var(--casta-space-5) var(--casta-space-6) var(--casta-space-5) 0;
  font-weight: var(--casta-fw-regular);
  text-align: left;
  vertical-align: top;
  color: var(--casta-color-ink);
}

.casta-audit__cell {
  border-bottom: var(--casta-hairline-w) solid var(--casta-color-hairline);
  padding: var(--casta-space-5) var(--casta-space-6) var(--casta-space-5) 0;
  line-height: var(--casta-lh-relaxed);
  vertical-align: top;
  color: var(--casta-color-taupe);
}

.casta-audit__cell--strong {
  color: var(--casta-color-ink-85);
}

/* Карточки сравнения (те же данные, что в таблице): только до 768px */
@media (min-width: 768px) {
  .casta-audit__compare-cards {
    display: none;
  }
}

/* ---------------------------- 11 Objections ------------------------- */

.casta-audit__objection-title {
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-xl);
  line-height: var(--casta-lh-tight);
  color: var(--casta-color-accent);
}

/* -------------------------------- 13 FAQ ---------------------------- */
/* Развёрнутый Q&A без аккордеона (AEO/GEO); .casta-faq главной не
   используется — там аккордеон */

.casta-audit__faq {
  margin-top: var(--casta-space-10);
  border-top: var(--casta-hairline-w) solid var(--casta-color-hairline);
}

/* Статья: номер + тело, по базовой линии */
.casta-audit__qa {
  display: flex;
  align-items: baseline;
  gap: var(--casta-space-6);
  border-bottom: var(--casta-hairline-w) solid var(--casta-color-hairline);
  padding: var(--casta-space-8) 0;
}

.casta-audit__qa-body {
  max-width: var(--casta-measure-3xl);
}

.casta-audit__qa-title {
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-xl);
  line-height: var(--casta-lh-tight);
}

@media (min-width: 768px) {
  .casta-audit__qa-title {
    font-size: var(--casta-fs-2xl);
  }
}

/* Короткий ответ (answer-first) */
.casta-audit__qa-short {
  margin-top: var(--casta-space-4);
  font-size: var(--casta-fs-base);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-ink-90);
}

/* Развёрнутые абзацы ответа */
.casta-audit__qa-long {
  margin-top: var(--casta-space-3);
  font-size: var(--casta-fs-sm);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-taupe);
}

/* ------------------------- 14 CTA: форма заявки --------------------- */

/* Обёртка id="audit-form": тёмная панель с формой + светлая панель шагов */
.casta-audit__request {
  display: grid;
  gap: var(--casta-hairline-w);
  border: var(--casta-hairline-w) solid var(--casta-color-hairline);
  background-color: var(--casta-color-hairline);
}

@media (min-width: 1024px) {
  .casta-audit__request {
    grid-template-columns: 1.1fr 1fr;
  }
}

.casta-audit__request-panel {
  background-color: var(--casta-color-ink);
  padding: var(--casta-space-8);
  color: var(--casta-color-on-ink);
}

@media (min-width: 768px) {
  .casta-audit__request-panel {
    padding: var(--casta-space-10);
  }
}

.casta-audit__request-title {
  margin-top: var(--casta-space-5);
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-3xl);
  line-height: var(--casta-lh-tight);
}

@media (min-width: 768px) {
  .casta-audit__request-title {
    font-size: var(--casta-fs-4xl);
  }
}

.casta-audit__request-text {
  margin-top: var(--casta-space-5);
  font-size: var(--casta-fs-sm);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-on-ink-75);
}

.casta-audit__request-form {
  margin-top: var(--casta-space-9);
}

/* Поля в две колонки от 640px; линии-разделители .casta-form__fields
   не нужны — у каждого поля своя нижняя линия */
.casta-audit__request-fields {
  display: grid;
  gap: var(--casta-space-4);
  border-top: 0;
  border-bottom: 0;
}

@media (min-width: 640px) {
  .casta-audit__request-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Поле на всю ширину сетки */
.casta-audit__request-full {
  grid-column: 1 / -1;
}

/* Тёмная тема формы: контекст .casta-audit__request-panel поверх
   базовых .casta-form__* из components.css. В WordPress эти же правила
   лягут на разметку CF7 внутри той же панели */
.casta-audit__request-panel .casta-form__row {
  background-color: transparent;
  border-bottom: var(--casta-hairline-w) solid var(--casta-color-on-ink-25);
  transition: border-color var(--casta-dur-fast) var(--casta-ease);
}

.casta-audit__request-panel .casta-form__row + .casta-form__row {
  border-top: 0;
}

.casta-audit__request-panel .casta-form__row:focus-within {
  border-bottom-color: var(--casta-color-accent);
}

.casta-audit__request-panel .casta-form__label {
  padding-top: 0;
  color: var(--casta-color-on-ink-60);
}

.casta-audit__request-panel .casta-form__input {
  padding: var(--casta-space-2-5) var(--casta-space-1);
  font-size: var(--casta-fs-sm);
  color: var(--casta-color-on-ink);
}

/* placeholder:text-primary-foreground/35 → ближайший токен on-ink-30 */
.casta-audit__request-panel .casta-form__input::placeholder {
  color: var(--casta-color-on-ink-30);
}

/* text-primary-foreground/50 → ближайший токен on-ink-60 */
.casta-audit__request-panel .casta-form__hint {
  color: var(--casta-color-on-ink-60);
}

/* Сообщение об отправке — как «sent»-блок исходника
   (border-accent/60 → accent-40, bg-accent/10) */
.casta-audit__request-panel .casta-form__status {
  border: var(--casta-hairline-w) solid var(--casta-color-accent-40);
  background-color: var(--casta-color-accent-10);
  padding: var(--casta-space-5);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-on-ink);
}

.casta-audit__request-aside {
  background-color: var(--casta-color-bg);
  padding: var(--casta-space-8);
}

@media (min-width: 768px) {
  .casta-audit__request-aside {
    padding: var(--casta-space-10);
  }
}

/* Шаги «Что произойдёт после заявки» */
.casta-audit__after {
  display: flex;
  flex-direction: column;
  gap: var(--casta-space-6);
  margin-top: var(--casta-space-7);
}

.casta-audit__after-item {
  display: flex;
  gap: var(--casta-space-5);
}

.casta-audit__after-num {
  flex-shrink: 0;
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-2xl);
  line-height: var(--casta-lh-none);
  color: var(--casta-color-accent);
}

.casta-audit__after-text {
  font-size: var(--casta-fs-sm);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-taupe);
}

/* Подвал страницы: дата обновления + автор, ссылка «Все услуги» (с .casta-ruletop) */
.casta-audit__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--casta-space-6);
  margin-top: var(--casta-space-10);
  padding-top: var(--casta-space-6);
}

.casta-audit__meta-text {
  font-size: var(--casta-fs-xs);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-taupe);
}

/* ========================= portfolio.html — кейсы ========================= */
/* Блок casta-portfolio__* — только карточка кейса и её внутренние элементы.
   Плитки (.casta-tile), сетки (.casta-tilegrid), показатели (.casta-stat),
   линия (.casta-rule), ряд действий (.casta-actions), вводный абзац
   (.casta-section__intro), шапка страницы (.casta-pagehead) и тёмная
   CTA-панель (.casta-pagecta) — общие компоненты без новых правил */

/* Карточка: поверх .casta-tile — контекст для углового бейджа и hover */
.casta-portfolio__card {
  position: relative;
}

/* Свежий кейс: на всю ширину сетки от 1024px (ring — .casta-tile--featured) */
@media (min-width: 1024px) {
  .casta-portfolio__card--featured {
    grid-column: span 2;
  }
}

/* Угловое позиционирование общего бейджа в карточке кейса.
   Одинаковых контекстов два, поэтому отдельный общий модификатор не нужен. */
.casta-portfolio__card-badge {
  position: absolute;
  top: var(--casta-space-6);
  right: var(--casta-space-8);
}

@media (min-width: 768px) {
  .casta-portfolio__card-badge {
    right: var(--casta-space-10);
  }
}

/* Глиф + мета (ниша · гео, период) */
.casta-portfolio__card-head {
  display: flex;
  align-items: flex-start;
  gap: var(--casta-space-6);
}

.casta-portfolio__card:hover .casta-glyph {
  transform: scale(1.05);
}

.casta-portfolio__card-meta {
  padding-top: var(--casta-space-1);
}

.casta-portfolio__period {
  margin-top: var(--casta-space-1);
}

/* Заголовок кейса: md:text-[1.8rem] исходника → 3xl (шум) */
.casta-portfolio__card-title {
  margin-top: var(--casta-space-7);
  max-width: var(--casta-measure-34ch);
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-2xl);
  line-height: var(--casta-lh-tight);
  transition: color var(--casta-dur-fast) var(--casta-ease);
}

@media (min-width: 768px) {
  .casta-portfolio__card-title {
    font-size: var(--casta-fs-3xl);
  }
}

.casta-portfolio__card:hover .casta-portfolio__card-title {
  color: var(--casta-color-accent);
}

/* Тело свежего кейса: задача и список слева, метрики справа (md:grid-cols-2) */
@media (min-width: 768px) {
  .casta-portfolio__card--featured .casta-portfolio__card-body {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--casta-space-10);
  }
}

.casta-portfolio__task {
  margin-top: var(--casta-space-5);
  font-size: var(--casta-fs-sm);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-taupe);
}

/* «Задача.» — чернильное выделение в приглушённом абзаце */
.casta-portfolio__em {
  color: var(--casta-color-ink);
}

/* Сетка метрик: mt-8 вместо mt-10 у .casta-tilegrid; в свежем кейсе
   поднимается к верху колонки */
.casta-portfolio__metrics {
  margin-top: var(--casta-space-8);
}

@media (min-width: 768px) {
  .casta-portfolio__card--featured .casta-portfolio__metrics {
    margin-top: var(--casta-space-5);
    align-self: start;
  }
}

/* ================ portfolio-primer-keisa.html — страница кейса ================ */
/* Блок casta-case__* — только структурно уникальное: h1 героя, две колонки
   точки старта, шапка фазы, список результатов с линиями, цитата, mono-ссылки
   подвала. Всё остальное — общие компоненты (tile, tilegrid, stat, checklist,
   actions, pagehead, pagecta, section__intro) */

/* h1: text-[clamp(2rem,4.4vw,3.5rem)] исходника → display-page (шум) */
.casta-case__hero-title {
  margin-top: var(--casta-space-5);
  max-width: var(--casta-measure-26ch);
  font-size: var(--casta-fs-display-page);
}

/* 01 Сводка: значение под mono-подписью в плитке */
.casta-case__fact-value {
  margin-top: var(--casta-space-2);
  font-size: var(--casta-fs-base);
  line-height: var(--casta-lh-snug);
  color: var(--casta-color-ink);
}

/* 02 Точка старта: две текстовые колонки */
.casta-case__start {
  display: grid;
  gap: var(--casta-space-10);
  margin-top: var(--casta-space-10);
}

@media (min-width: 768px) {
  .casta-case__start {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.casta-case__start-title {
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-2xl);
  line-height: var(--casta-lh-tight);
}

.casta-case__start-text {
  margin-top: var(--casta-space-5);
  font-size: var(--casta-fs-sm);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-taupe);
}

/* 04 Фаза работ: mono-метка месяца + линия до края плитки */
.casta-case__phase-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--casta-space-4);
}

.casta-case__phase-line {
  flex: 1;
  height: var(--casta-hairline-w);
  background-color: var(--casta-color-hairline);
}

/* 05 Результат: список слева, цитата справа (lg 1.1fr/0.9fr) */
.casta-case__result {
  display: grid;
  gap: var(--casta-space-10);
  margin-top: var(--casta-space-10);
}

@media (min-width: 1024px) {
  .casta-case__result {
    grid-template-columns: 1.1fr 0.9fr;
  }
}

/* Пункт списка над волосяной линией (с .casta-ruletop) */
.casta-case__result-item {
  padding-top: var(--casta-space-4);
}

.casta-case__result-text {
  font-size: var(--casta-fs-sm);
  line-height: var(--casta-lh-relaxed);
}

/* Цитата: рамка, белая карточка */
.casta-case__quote {
  border: var(--casta-hairline-w) solid var(--casta-color-hairline);
  background-color: var(--casta-color-card);
  padding: var(--casta-space-8);
}

.casta-case__quote-text {
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-xl);
  line-height: var(--casta-lh-snug);
}

@media (min-width: 768px) {
  .casta-case__quote-text {
    font-size: var(--casta-fs-2xl);
  }
}

/* Подпись цитаты (с .casta-ruletop) */
.casta-case__quote-foot {
  margin-top: var(--casta-space-6);
  padding-top: var(--casta-space-5);
}

.casta-case__quote-author {
  font-size: var(--casta-fs-sm);
  color: var(--casta-color-ink);
}

.casta-case__quote-meta {
  margin-top: var(--casta-space-2);
}

/* 09 Подвал: mono-ссылки «← Все кейсы» / «Услуги и цены →» (с .casta-label) */
.casta-case__navlink {
  transition: color var(--casta-dur-fast) var(--casta-ease);
}

.casta-case__navlink:hover {
  color: var(--casta-color-accent);
}

/* ================ blog.html — список статей ================ */
/* Блок casta-blog__* — только структурно уникальное: featured-материал,
   карточка статьи и шапка рубрики. Сетки, плитки, линии, показатели и ряды
   действий — общие компоненты из components.css. */

/* Главный материал: общий тёмный .casta-pagecta с более широким текстом */
.casta-blog__featured .casta-pagecta__inner {
  max-width: var(--casta-measure-3xl);
}

.casta-blog__featured .casta-badge {
  flex-wrap: wrap;
  gap: var(--casta-space-3);
}

.casta-blog__featured .casta-pagecta__title {
  margin-top: var(--casta-space-6);
  font-size: var(--casta-fs-display-panel);
}

.casta-blog__featured .casta-pagecta__text {
  margin-top: var(--casta-space-6);
}

.casta-blog__featured .casta-actions {
  margin-top: var(--casta-space-9);
}

.casta-blog__featured-date {
  color: var(--casta-color-on-ink-60);
}

/* Карточка статьи: flex нужен только для выравнивания общего ряда действий */
.casta-blog__card {
  display: flex;
  flex-direction: column;
}

.casta-blog__card-head {
  display: flex;
  align-items: flex-start;
  gap: var(--casta-space-6);
}

.casta-blog__card-head .casta-glyph {
  flex-shrink: 0;
}

.casta-blog__card .casta-tile__title {
  margin-top: var(--casta-space-7);
  max-width: var(--casta-measure-34ch);
  transition: color var(--casta-dur-fast) var(--casta-ease);
}

.casta-blog__card:hover .casta-tile__title {
  color: var(--casta-color-accent);
}

.casta-blog__card:hover .casta-glyph {
  transform: scale(1.05);
}

.casta-blog__card .casta-tile__text {
  margin-top: var(--casta-space-5);
}

.casta-blog__card .casta-actions {
  margin-top: auto;
}

.casta-blog__topic-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--casta-space-4);
}

.casta-blog__topic-head + .casta-tile__text {
  margin-top: var(--casta-space-3);
}

/* Светлая версия общей CTA-панели: blog.html и страница статьи */
.casta-pagecta--light {
  border: var(--casta-hairline-w) solid var(--casta-color-hairline);
  background-color: var(--casta-color-bg);
  color: var(--casta-color-ink);
}

.casta-pagecta--light .casta-pagecta__title {
  color: var(--casta-color-ink);
}

.casta-pagecta--light .casta-pagecta__text {
  color: var(--casta-color-taupe);
}

/* ================ blog-primer-stati-v-blog.html — тело статьи ================ */
/* Единственный класс блока статьи — .casta-post__body. В WordPress он
   оборачивает вывод the_content(); внутренние элементы редактора остаются
   без классов CASTA. Весь контекстный селектор помещён в :where(), поэтому
   его специфичность равна нулю и классы блоков Gutenberg могут переопределять
   базовую типографику. .casta-audit__table находится вне этой обёртки. */

:where(.casta-post__body) {
  margin-top: var(--casta-space-8);
}

:where(.casta-post__body h2) {
  margin-top: var(--casta-space-12);
  max-width: var(--casta-measure-3xl);
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-2xl);
  line-height: var(--casta-lh-tight);
}

:where(.casta-post__body h3) {
  margin-top: var(--casta-space-8);
  max-width: var(--casta-measure-3xl);
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-xl);
  line-height: var(--casta-lh-tight);
}

@media (min-width: 768px) {
  :where(.casta-post__body h2) {
    font-size: var(--casta-fs-3xl);
  }

  :where(.casta-post__body h3) {
    font-size: var(--casta-fs-2xl);
  }
}

:where(.casta-post__body p) {
  margin-top: var(--casta-space-5);
  max-width: var(--casta-measure-3xl);
  font-size: var(--casta-fs-base);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-ink-80);
}

:where(.casta-post__body a) {
  color: var(--casta-color-accent);
  text-decoration: underline;
  text-decoration-color: var(--casta-color-accent-40);
  text-underline-offset: var(--casta-underline-offset-sm);
  transition: color var(--casta-dur-fast) var(--casta-ease);
}

:where(.casta-post__body a:hover) {
  color: var(--casta-color-ink);
}

:where(.casta-post__body strong) {
  font-weight: var(--casta-fw-semibold);
  color: var(--casta-color-ink);
}

:where(.casta-post__body em) {
  font-style: italic;
}

:where(.casta-post__body blockquote) {
  margin-top: var(--casta-space-8);
  max-width: var(--casta-measure-3xl);
  border-left: var(--casta-border-2) solid var(--casta-color-accent);
  padding: var(--casta-space-1) 0 var(--casta-space-1) var(--casta-space-6);
  font-family: var(--casta-font-display);
  font-size: var(--casta-fs-xl);
  line-height: var(--casta-lh-snug);
  color: var(--casta-color-ink);
}

@media (min-width: 768px) {
  :where(.casta-post__body blockquote) {
    font-size: var(--casta-fs-2xl);
  }
}

:where(.casta-post__body blockquote > p) {
  max-width: none;
  margin-top: 0;
  font: inherit;
  line-height: inherit;
  color: inherit;
}

:where(.casta-post__body ul,
.casta-post__body ol) {
  display: flex;
  flex-direction: column;
  max-width: var(--casta-measure-3xl);
  margin-top: var(--casta-space-5);
}

:where(.casta-post__body ul) {
  gap: var(--casta-space-3);
}

:where(.casta-post__body ul > li) {
  position: relative;
  padding-left: var(--casta-space-6);
  font-size: var(--casta-fs-base);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-ink-80);
}

:where(.casta-post__body ul > li::before) {
  position: absolute;
  top: var(--casta-bullet-sm-top);
  left: 0;
  width: var(--casta-size-bullet);
  height: var(--casta-size-bullet);
  background-color: var(--casta-color-accent);
  content: "";
  transform: rotate(45deg);
}

:where(.casta-post__body ol) {
  gap: var(--casta-space-4);
  counter-reset: casta-post-step;
}

:where(.casta-post__body ol > li) {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: baseline;
  gap: var(--casta-space-5);
  counter-increment: casta-post-step;
  font-size: var(--casta-fs-base);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-ink-80);
}

:where(.casta-post__body ol > li::before) {
  font-family: var(--casta-font-mono);
  font-size: var(--casta-fs-label);
  line-height: var(--casta-lh-label);
  letter-spacing: var(--casta-ls-label);
  color: var(--casta-color-accent);
  content: counter(casta-post-step, decimal-leading-zero);
}

:where(.casta-post__body figure) {
  max-width: 100%;
  margin-top: var(--casta-space-8);
  overflow-x: auto;
}

:where(.casta-post__body table) {
  width: 100%;
  margin-top: var(--casta-space-8);
  border: var(--casta-hairline-w) solid var(--casta-color-hairline);
  border-collapse: collapse;
  background-color: var(--casta-color-bg);
  font-size: var(--casta-fs-sm);
  text-align: left;
}

:where(.casta-post__body figure table) {
  min-width: calc(var(--casta-measure-xl) - var(--casta-space-4));
  margin-top: 0;
}

:where(.casta-post__body thead) {
  background-color: var(--casta-color-ink);
  color: var(--casta-color-on-ink);
}

:where(.casta-post__body th,
.casta-post__body td) {
  padding: var(--casta-space-4) var(--casta-space-5);
  vertical-align: top;
}

:where(.casta-post__body thead th) {
  font-family: var(--casta-font-mono);
  font-weight: var(--casta-fw-regular);
  font-size: var(--casta-fs-label);
  letter-spacing: var(--casta-ls-label);
  text-transform: uppercase;
}

:where(.casta-post__body tbody td) {
  line-height: var(--casta-lh-normal);
  color: var(--casta-color-ink-75);
}

:where(.casta-post__body tbody th,
.casta-post__body tbody td:first-child) {
  font-family: var(--casta-font-display);
  font-weight: var(--casta-fw-regular);
  font-size: var(--casta-fs-base);
  color: var(--casta-color-ink);
}

:where(.casta-post__body tbody tr:not(:last-child) > *) {
  border-bottom: var(--casta-hairline-w) solid var(--casta-color-hairline);
}

:where(.casta-post__body pre) {
  max-width: var(--casta-measure-3xl);
  margin-top: var(--casta-space-8);
  overflow-x: auto;
  background-color: var(--casta-color-ink);
  padding: var(--casta-space-6);
  font-family: var(--casta-font-mono);
  font-size: var(--casta-fs-sm);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-on-ink);
}

:where(.casta-post__body code) {
  background-color: var(--casta-color-ink-08);
  padding: 0 var(--casta-space-1);
  font-family: var(--casta-font-mono);
  font-size: var(--casta-fs-sm);
}

:where(.casta-post__body pre code) {
  background-color: transparent;
  padding: 0;
  font: inherit;
  color: inherit;
}

:where(.casta-post__body img) {
  width: auto;
  height: auto;
}

:where(.casta-post__body figcaption) {
  max-width: var(--casta-measure-3xl);
  margin-top: var(--casta-space-3);
  font-size: var(--casta-fs-xs);
  line-height: var(--casta-lh-relaxed);
  color: var(--casta-color-taupe);
}

:where(.casta-post__body hr) {
  max-width: var(--casta-measure-3xl);
  margin: var(--casta-space-10) 0;
  border: 0;
  border-top: var(--casta-hairline-w) solid var(--casta-color-hairline);
}

/* ============================= contact.html ============================= */
/* Блок casta-contact__* содержит только структурно уникальные элементы:
   ссылочную карточку канала, её шапку/иконку/значение, выравнивание
   карточек режима работы и двухколоночный span формы. Сетки, плитки,
   линии, показатели, ряды действий, кнопки и поля — общие компоненты. */

/* В contact-герое значения — не показатели и могут переноситься; поэтому
   используются .casta-tile, а не nowrap-значение .casta-stat__value. */
.casta-pagehead__stats > .casta-tile {
  display: flex;
  min-height: calc(var(--casta-space-16) + var(--casta-space-16));
  flex-direction: column;
  justify-content: space-between;
  padding-left: var(--casta-space-5);
  padding-right: var(--casta-space-5);
}

.casta-pagehead__stats > .casta-tile .casta-tile__title {
  overflow-wrap: anywhere;
}

/* Кликабельная карточка канала поверх общей .casta-tile. */
.casta-contact__channel {
  display: flex;
  min-width: 0;
  min-height: 100%;
  flex-direction: column;
  color: var(--casta-color-ink);
  transition:
    color var(--casta-dur-fast) var(--casta-ease),
    background-color var(--casta-dur-fast) var(--casta-ease);
}

@media (min-width: 768px) {
  .casta-contact__channel {
    padding: var(--casta-space-10);
  }
}

.casta-contact__channel:hover {
  background-color: var(--casta-color-ink);
  color: var(--casta-color-on-ink);
}

.casta-contact__channel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--casta-space-4);
}

.casta-contact__iconbox {
  display: inline-flex;
  width: var(--casta-space-12);
  height: var(--casta-space-12);
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  border: var(--casta-hairline-w) solid var(--casta-color-hairline);
  color: var(--casta-color-ink);
  transition:
    color var(--casta-dur-fast) var(--casta-ease),
    border-color var(--casta-dur-fast) var(--casta-ease);
}

.casta-contact__icon {
  width: var(--casta-size-icon-md);
  height: var(--casta-size-icon-md);
  flex-shrink: 0;
}

.casta-contact__channel .casta-tile__title {
  margin-top: var(--casta-space-8);
  transition: color var(--casta-dur-fast) var(--casta-ease);
}

.casta-contact__channel-value {
  margin-top: var(--casta-space-2);
  overflow-wrap: anywhere;
  font-size: var(--casta-fs-lg);
  line-height: var(--casta-lh-snug);
}

.casta-contact__channel .casta-tile__text {
  margin-top: auto;
  padding-top: var(--casta-space-5);
  transition: color var(--casta-dur-fast) var(--casta-ease);
}

.casta-contact__channel:hover .casta-contact__iconbox {
  border-color: var(--casta-color-on-ink-30);
  color: var(--casta-color-on-ink);
}

.casta-contact__channel:hover .casta-tile__title,
.casta-contact__channel:hover .casta-contact__channel-value {
  color: var(--casta-color-on-ink);
}

.casta-contact__channel:hover .casta-tile__text {
  color: var(--casta-color-on-ink-75);
}

/* Только контекст общей трёхколоночной tilegrid; своей сетки нет. */
.casta-contact__hours {
  margin-top: 0;
}

.casta-contact__hours .casta-tile {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

.casta-contact__hours > .casta-tile > .casta-contact__icon {
  color: var(--casta-color-accent);
}

.casta-contact__hours .casta-tile__title {
  min-height: var(--casta-size-stepnum);
  margin-top: var(--casta-space-6);
  font-size: var(--casta-fs-display-lg);
}

@media (min-width: 768px) {
  .casta-contact__hours .casta-tile__title {
    min-height: var(--casta-size-stepnum-md);
  }
}

.casta-contact__hours-list {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: var(--casta-space-2-5);
  margin-top: var(--casta-space-5);
}

.casta-contact__hours-list .casta-tile__text {
  margin-top: 0;
}

/* Белая карточка формы; в общей lg-сетке занимает две из трёх колонок. */
.casta-contact__form-card {
  background-color: var(--casta-color-card);
}

.casta-contact__form-card .casta-form__fields {
  margin-top: var(--casta-space-8);
}

.casta-contact__form-card .casta-form__label {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--casta-space-4);
}

.casta-contact__form-card .casta-form__hint {
  margin-top: 0;
  padding: 0 var(--casta-space-1) var(--casta-space-5);
}

.casta-contact__form-card .casta-form__submit {
  gap: var(--casta-space-2);
}

@media (min-width: 768px) {
  .casta-contact__form-card {
    padding: var(--casta-space-10);
  }
}

@media (min-width: 1024px) {
  .casta-contact__form-card {
    grid-column: span 2 / span 2;
  }
}

/* Контурная кнопка на тёмной общей CTA: новый модификатор не нужен. */
.casta-pagecta:not(.casta-pagecta--light) .casta-btn--outline {
  gap: var(--casta-space-2);
  border-color: var(--casta-color-on-ink-30);
  color: var(--casta-color-on-ink);
}

.casta-pagecta:not(.casta-pagecta--light) .casta-btn--outline:hover {
  border-color: var(--casta-color-accent);
  background-color: transparent;
  color: var(--casta-color-accent);
}