/* Tetra — общие стили под reveal-анимации (нужны tetra-page.js и файлам
   компонентов). Подключается ПЕРВЫМ среди tetra-*.css. */

/* маска каждой строки для появления слов (hero heading + section reveals) */
.hero-heading-line,
.section-reveal-line {
  overflow: hidden;
  padding-bottom: 0.08em;
  margin-bottom: -0.08em;
}

/* маска для въезда кнопок сверху вниз */
.button-entry-mask {
  display: inline-grid;
  overflow: hidden;
  max-width: 100%;
  vertical-align: bottom;
}
/* на мобиле кнопки в макете во всю ширину — маска не должна ужимать их по контенту */
@media screen and (max-width: 479px) {
  .button-entry-mask { width: 100%; }
}

/* ================================================================== *
 * Анти-FOUC для scroll-reveal.
 *
 * ВАЖНО: эти правила ДОЛЖНЫ быть продублированы ИНЛАЙН в <head> каждой
 * страницы Webflow вместе с синхронным скриптом, который ставит класс —
 * иначе к моменту, когда подтянется этот файл, флеш уже случится.
 * Здесь блок держим как единый источник правды.
 *
 * Вставить в Webflow → Page Settings → Inside <head> tag (Home и CADD):
 *
 *   <script>
 *     document.documentElement.classList.add('tetra-anim');
 *     setTimeout(function () {
 *       document.documentElement.classList.remove('tetra-anim');
 *     }, 2500);
 *   </script>
 *   <style> …правила ниже… </style>
 *
 * tetra-core.js снимает класс через кадр после DOMContentLoaded (когда все
 * gsap.set() уже отработали); setTimeout — failsafe на случай сбоя JS.
 * ================================================================== */
.tetra-anim .navbar-wrapper,
.tetra-anim .hero_heading,
.tetra-anim .hero_text,
.tetra-anim .hero_button-group,
.tetra-anim .hero_bg-image,
.tetra-anim .intro_heading,
.tetra-anim .section_benefits .eyebrow_text,
.tetra-anim .benefits_item-heading,
.tetra-anim .benefits_item-copy,
.tetra-anim .benefits_item-image-text,
.tetra-anim .trust_heading,
.tetra-anim .trust_intro-text,
.tetra-anim .trust_card,
.tetra-anim .about_heading,
.tetra-anim .about_text,
.tetra-anim .about-card,
.tetra-anim .about-card-animation,
.tetra-anim .cadd-gap_text,
.tetra-anim .cadd-fundamentals_copy,
.tetra-anim .cadd-practice_heading,
.tetra-anim .cadd-practice_card,
.tetra-anim .cta_heading,
.tetra-anim .cta_text,
.tetra-anim .partners_heading,
.tetra-anim .footer_wordmark,
.tetra-anim .footer_wordmark-mob,
.tetra-anim .footer_menu-link,
.tetra-anim .cadd-hero_eyebrow,
.tetra-anim .cadd-hero_heading,
.tetra-anim .cadd-hero_text,
.tetra-anim .cadd-hero_coin,
.tetra-anim .cadd-hero_glow,
.tetra-anim .cadd-activity-card,
.tetra-anim .cadd-consortium,
.tetra-anim .careers-hero_heading,
.tetra-anim .careers-hero_text,
.tetra-anim .careers-hero_content .button,
.tetra-anim .careers-values_split .eyebrow_text,
.tetra-anim .careers-values_text,
.tetra-anim .careers-values_card,
.tetra-anim .careers-cta_heading,
.tetra-anim .careers-cta_text,
.tetra-anim [data-reveal] {
  opacity: 0 !important;
}
/* строки-маски, которые режет SplitText в заголовках */
.tetra-anim .section-reveal-line { opacity: 0 !important; }