/* ============================================================
   Дополнения к app.css специально для реального движка tristyle.by:
   оверлей-меню (много рубрик — не влезает в верхний нав) и мелкие
   поправки под WP-контент (реальные фото могут быть разных пропорций).
   ============================================================ */

/* фото в ленте "Клубная жизнь" кликабельны — свой лёгкий лайтбокс (см. inline-script
   в footer этой страницы), без jQuery и без дублирования картинок в data URI —
   просто показываем увеличенную копию того же <img>, который уже на странице. */
.pmq-row img.pmq-photo{cursor:zoom-in;}
.pmq-lightbox{position:fixed;inset:0;z-index:500;background:rgba(10,11,13,0.92);display:flex;align-items:center;justify-content:center;padding:5vh 5vw;opacity:0;visibility:hidden;transition:opacity .25s var(--ease,ease);}
.pmq-lightbox.open{opacity:1;visibility:visible;}
.pmq-lightbox img{max-width:100%;max-height:90vh;border-radius:8px;box-shadow:0 30px 80px -20px rgba(0,0,0,0.6);}
.pmq-lightbox .pmq-lb-close{position:fixed;top:18px;right:clamp(20px,3.4vw,56px);z-index:510;background:none;border:1px solid rgba(244,241,231,0.3);color:#F4F1E7;width:44px;height:44px;border-radius:100px;cursor:pointer;font-size:20px;line-height:1;}
.pmq-lightbox .pmq-lb-close:hover{border-color:var(--cta-hi);color:var(--cta-hi);}

/* оверлей открывается по клику на .burger, независимо от мобильного/десктопа —
   на реальном сайте рубрик слишком много для инлайн-нава */
/* .on-dark переопределяет --bg/--fg/--soft/--line на тёмную схему (см. app.css) —
   благодаря этому оверлей остаётся читаемым независимо от того, какая палитра
   активна на странице под ним (внизу сайта фон светлый пастельный). */
.menu-overlay{
  position:fixed;inset:0;z-index:200;
  background:var(--bg);
  color:var(--fg);
  opacity:0;visibility:hidden;
  transition:opacity .4s var(--ease,cubic-bezier(0.22,1,0.36,1)),visibility 0s linear .4s;
  overflow-y:auto;
}
.menu-overlay.open{opacity:1;visibility:visible;transition:opacity .4s var(--ease,cubic-bezier(0.22,1,0.36,1));}
.mo-in{max-width:1200px;margin:0 auto;padding:110px clamp(20px,3.4vw,56px) 80px;}
.mo-close{position:fixed;top:18px;right:clamp(20px,3.4vw,56px);z-index:210;background:none;border:1px solid var(--line);color:var(--fg);width:44px;height:44px;border-radius:100px;cursor:pointer;font-size:20px;line-height:1;}
.mo-close:hover{border-color:var(--cta);color:var(--cta);}
.mo-primary{display:flex;flex-wrap:wrap;gap:10px 28px;margin-bottom:52px;padding-bottom:40px;border-bottom:1px solid var(--line);}
.mo-primary a{font-family:'Unbounded',sans-serif;font-weight:800;font-size:clamp(22px,3.4vw,38px);text-transform:uppercase;color:var(--fg);transition:color .25s;}
.mo-primary a:hover{color:var(--cta);}
.mo-cols{display:grid;grid-template-columns:1.1fr 1.1fr 0.9fr;gap:40px;}
.mo-col-title{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--cta);margin-bottom:18px;}
.mo-col ul{list-style:none;display:flex;flex-direction:column;gap:13px;}
.mo-col a{font-size:15px;color:var(--soft);transition:color .25s;}
.mo-col a:hover{color:var(--fg);}
@media(max-width:860px){.mo-cols{grid-template-columns:1fr;gap:34px;}.mo-in{padding-top:90px;}}

/* верхний нав — несколько ключевых ссылок реального сайта вместо якорей одностраничника */
.nav-links a.is-anchor{opacity:.9;}

/* На реальном сайте бургер — это вход в оверлей со ВСЕМИ рубриками (20+ страниц),
   а не мобильный фолбэк на пару якорей, как в исходном одностраничном прототипе.
   В app.css .burger скрыт по умолчанию и показывается только в мобильной медиа-query —
   здесь принудительно показываем его на всех разрешениях, не трогая app.css. */
.burger{display:block !important;}

/* карточки на главной ссылаются на реальные шаблоны, где нет заранее известной
   пропорции фото — подстрахуем object-fit по умолчанию, уже есть в .dph img,
   тут только для .post-thumb (блок "Последнее из блога") */
/* У дизайнера карточка списка — простой блок: картинка 4:3 во всю ширину,
   под ней текст (см. assets/theme-extra.css в макетах). Компактную строку
   «фото слева + текст справа» Павел просил только для блока «Последнее из
   блога» на главной — поэтому она и ограничена главной страницей. */
.post-thumb{position:relative;aspect-ratio:4/3;overflow:hidden;border-radius:14px;background:var(--bg2,#1C1F26);}
body.home .post-card{display:flex;align-items:center;gap:22px;padding:20px;}
body.home .post-thumb{flex:0 0 168px;width:168px;border-radius:12px;}
.post-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease,cubic-bezier(0.22,1,0.36,1));}
.post-card:hover .post-thumb img{transform:scale(1.06);}
body.home .post-card .post-body{flex:1;min-width:0;}
.post-card .ic{margin-bottom:10px;}
@media(max-width:640px){
  body.home .post-card{flex-direction:column;align-items:stretch;}
  body.home .post-thumb{width:100%;flex-basis:auto;aspect-ratio:16/10;}
}

/* В app.css .reveal изначально opacity:0 и проявляется по IntersectionObserver
   при скролле — на одностраничном прототипе это уместно. На реальном сайте
   Тристайл нужно регулярно снимать скриншоты прогресса (в т.ч. одним кадром
   через "Capture full size screenshot" в DevTools или похожие расширения) —
   такие инструменты не скроллят страницу по шагам, и observer не успевает
   раскрыть блоки, из-за чего на скриншоте появляются пустые участки, хотя
   на самом деле сайт работает исправно. Поэтому здесь отключаем анимацию
   проявления целиком — контент реального сайта всегда виден сразу. */
.reveal{opacity:1 !important;transform:none !important;transition:none !important;}

/* ПАРТНЁРЫ — сетка логотипов из реального раздела "Спонсоры и партнеры",
   каждый ведёт на настоящий сайт партнёра (поле url из ACF на реальном сайте). */
.partners-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:14px;}
.partner-card{display:flex;align-items:center;justify-content:center;height:110px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px;transition:border-color .3s var(--ease),transform .3s var(--ease);}
.partner-card:hover{border-color:var(--cta-hi);transform:translateY(-3px);}
.partner-card img{max-width:100%;max-height:56px;object-fit:contain;filter:grayscale(1) opacity(.7);transition:filter .3s var(--ease);}
.partner-card:hover img{filter:grayscale(0) opacity(1);}
@media(max-width:860px){.partners-grid{grid-template-columns:repeat(3,1fr);}}
@media(max-width:640px){.partners-grid{grid-template-columns:repeat(2,1fr);}}

/* ОТЗЫВЫ — карточки реальных спортсменов клуба (post_type=reviews), фото + короткая
   цитата + ссылка на полную историю (если есть). Вёрстка сделана так, чтобы позже
   можно было просто заменить фото на превью YouTube-ролика без переверстки. */
.reviews-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:14px;}
.review-card{background:var(--card);border:1px solid var(--line);border-radius:18px;overflow:hidden;display:flex;flex-direction:column;transition:border-color .3s var(--ease),transform .3s var(--ease);}
.review-card:hover{border-color:var(--cta-hi);transform:translateY(-4px);}
body.home .review-card .rv-head{display:flex;align-items:center;gap:12px;margin-bottom:14px;}
/* У дизайнера на странице /reviews/ фото отзыва — крупное, 4:3 во всю ширину
   карточки. Маленькие круглые аватарки Павел просил только для блока отзывов
   на главной, где карточки компактные. */
.review-card .rv-thumb{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--bg2,#1C1F26);}
.review-card .rv-thumb img{transition:transform .6s var(--ease);}
.review-card:hover .rv-thumb img{transform:scale(1.06);}
body.home .review-card .rv-thumb{flex:0 0 52px;width:52px;height:52px;border-radius:50%;aspect-ratio:auto;}
body.home .review-card:hover .rv-thumb img{transform:none;}
.review-card .rv-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 20%;}
.review-card .rv-body{padding:18px 20px 22px;display:flex;flex-direction:column;flex:1;}
body.home .review-card .rv-body{padding:20px 20px 22px;}
.review-card h4{font-size:16.5px;text-transform:uppercase;margin-bottom:4px;}
body.home .review-card h4{font-size:15px;margin-bottom:2px;}
.review-card .rv-position{color:var(--dim);font-size:12px;text-transform:uppercase;letter-spacing:.05em;margin-bottom:10px;}
body.home .review-card .rv-position{font-size:11.5px;margin-bottom:0;}
.review-card .rv-text{color:var(--soft);font-size:14px;line-height:1.55;margin-bottom:14px;flex:1;}
@media(max-width:1080px){.reviews-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.reviews-grid{grid-template-columns:1fr;}}

/* КЛУБ В ЦИФРАХ (компактно) — сжатая версия .stats: только 4 цифры в одну строку.
   Отступы сведены к минимуму по вертикали, чтобы освободившееся место отдать
   под крупные цифры — блок в сумме всё равно ниже, чем обычный .stats. */
.stats-compact .stat{padding:10px 14px;line-height:1;}
.stats-compact .stat .big{font-size:clamp(34px,4.6vw,60px);line-height:1;}
.stats-compact .stat .lbl{margin-top:4px;font-size:12px;line-height:1.25;}
@media(max-width:640px){.stats-compact{grid-template-columns:repeat(2,1fr);}}

/* НАПРАВЛЕНИЯ — компактная сетка плиток вместо аккордеона (чтобы не повторять
   визуально блок FAQ прямо над этим блоком). Все 7 направлений видны сразу,
   без клика — короче по высоте страницы и современнее аккордеона. */
.dirs-compact{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:16px;}
.dir-tile{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px 22px;transition:border-color .3s var(--ease),transform .3s var(--ease);}
.dir-tile:hover{border-color:var(--cta-hi);transform:translateY(-3px);}
.dir-tile h4{font-family:var(--fd);font-weight:600;font-size:15px;text-transform:uppercase;letter-spacing:.02em;margin-bottom:8px;color:var(--fg);}
.dir-tile h4 .ar{color:var(--cta-hi);font-weight:400;}
.dir-tile p{font-size:13.5px;line-height:1.5;color:var(--soft);}
@media(max-width:1080px){.dirs-compact{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.dirs-compact{grid-template-columns:1fr;}}

/* ============================================================
   ОБЩИЕ КОМПОНЕНТЫ ДЛЯ ВНУТРЕННИХ СТРАНИЦ (не главная) — Павел попросил
   переоформить остальные ~19 реальных страниц сайта в новую дизайн-систему,
   сохранив их реальный контент 1:1 (WP_Query/ACF/the_content без изменений,
   меняется только разметка и стили). Здесь — общие блоки, переиспользуемые
   на каждой такой странице, чтобы не плодить дубли CSS.
   ============================================================ */

/* PHERO — «шапка» внутренней страницы: без тёмной фото-подложки, как на
   главной, светлая пастельная, с хлебной крошкой и заголовком. */
.phero{padding:clamp(120px,14vw,168px) 0 clamp(36px,5vw,56px);}
.phero .kicker{margin-bottom:16px;}
.phero h1{font-family:var(--fd);font-weight:800;font-size:clamp(32px,5.4vw,58px);text-transform:uppercase;line-height:1.08;}
.phero .lead{margin-top:16px;max-width:640px;color:var(--soft);font-size:16px;line-height:1.6;}

/* PROSE — типографика для the_content()/ACF wysiwyg-полей (block_1, rule_1,
   и т.д.) — реальный текстовый контент страниц, только с абзацами. */
.prose{color:var(--soft);font-size:15.5px;line-height:1.7;}
.prose p{margin-bottom:14px;}
.prose p:last-child{margin-bottom:0;}
.prose a{color:var(--cta-hi);text-decoration:underline;text-underline-offset:3px;}
.prose strong{color:var(--fg);font-weight:600;}
.prose em.highlight{color:var(--cta-hi);font-style:normal;}
.prose ul,.prose ol{margin:10px 0 14px 20px;}
.prose li{margin-bottom:6px;}
.prose h2,.prose h3{color:var(--fg);margin:22px 0 10px;font-family:var(--fd);text-transform:uppercase;font-size:19px;}

/* SPLIT — простая секция «текст + фото» в 2 колонки, используется на
   about/idea/training и похожих страницах вместо старых .about_second и т.д. */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,64px);align-items:center;}
.split .split-ph{border-radius:20px;overflow:hidden;aspect-ratio:4/3;background:var(--bg2);}
.split .split-ph img{width:100%;height:100%;object-fit:cover;}
.split.rev{grid-template-columns:1fr 1fr;}
.split.rev .split-ph{order:2;}
@media(max-width:860px){.split,.split.rev .split-ph{grid-template-columns:1fr;}.split{grid-template-columns:1fr;}.split .split-ph{order:0 !important;}}

/* TAG-NAV — фильтр категорий (новости, faq, e-mail рассылки) — переиспользуем
   вместо старых .news_category/.answers_left/.emails_left списков. */
.tag-nav{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 8px;}
.tag-nav a{font-family:var(--fm);font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--soft);border:1px solid var(--line);border-radius:100px;padding:9px 18px;transition:border-color .3s var(--ease),color .3s var(--ease),background .3s var(--ease);}
.tag-nav a:hover{border-color:var(--cta-hi);color:var(--cta-hi);}
.tag-nav a.active{background:var(--cta);border-color:var(--cta);color:#fff;}

/* SIMPLE-LIST — плоский список ссылок-строк (обучающие материалы, статьи,
   рассылки) — карточка-строка с заголовком и мета-информацией справа. */
.line-list{display:flex;flex-direction:column;border-top:1px solid var(--line);margin-top:6px;}
.line-item{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 4px;border-bottom:1px solid var(--line);transition:padding-left .3s var(--ease);}
.line-item:hover{padding-left:10px;}
.line-item .li-title{font-size:15.5px;color:var(--fg);}
.line-item .li-meta{font-family:var(--fm);font-size:12.5px;color:var(--dim);white-space:nowrap;}

/* FORM textarea — в app.css есть input/select, добавляем textarea тем же стилем */
.form textarea{background:rgba(13,15,18,0.6);border:1px solid var(--line);border-radius:13px;color:var(--fg);font-family:var(--fb);font-size:15.5px;padding:15px 17px;outline:none;transition:border-color .3s var(--ease);resize:vertical;min-height:120px;}
.form textarea::placeholder{color:var(--dim);}
.form textarea:focus{border-color:var(--cta);}

/* PHOTO-STRIP — простая сетка одинаковых фото-плиток (сборы по годам,
   календарь) без текста поверх, светлая рамка вместо тёмной .dcard. */
.photo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:22px;}
.photo-grid a,.photo-grid .pg-item{display:block;border-radius:16px;overflow:hidden;aspect-ratio:4/3;background:var(--bg2);border:1px solid var(--line);}
.photo-grid img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease);}
.photo-grid a:hover img{transform:scale(1.05);}
@media(max-width:860px){.photo-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.photo-grid{grid-template-columns:1fr;}}

/* PAGINATION — стандартный WP paginate_links(), минимальный стиль под новую систему */
.pagination{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px;}
.pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;padding:0 10px;border:1px solid var(--line);border-radius:100px;font-family:var(--fm);font-size:13px;color:var(--soft);transition:border-color .3s var(--ease),color .3s var(--ease);}
.pagination .page-numbers.current{background:var(--cta);border-color:var(--cta);color:#fff;}
.pagination .page-numbers:hover{border-color:var(--cta-hi);color:var(--cta-hi);}

/* Блок «Почему стоит тренироваться с нами» на /road и /hybrid.
   Ширина первой колонки раньше задавалась инлайн-стилем, который перебивал
   медиазапрос .split — на телефоне текст уезжал за правый край экрана. */
.split.why-row{grid-template-columns:360px 1fr;}
@media(max-width:860px){.split.why-row{grid-template-columns:1fr;gap:10px;}}

/* ---------------------------------------------------------------
   Правки вёрстки при выкате редизайна (проверено на всех страницах
   на 1280px и 390px).

   1. Элементы CSS-сетки по умолчанию не сжимаются уже своего самого
      длинного слова (min-width:auto). Из-за этого длинные русские
      заголовки в карточках раздвигали колонки, и страница уезжала
      вправо: /starts/ до 1900px при экране 1280px, /press/ до 503px
      при 390px.
   2. Крупные заголовки в Unbounded не переносились по слогам:
      «Профессионализм» на /trainers/ и «Общекомандные» на
      /kalendar-startov/ вылезали за правый край телефона.
   3. На /press/ первая карточка растянута инлайн-стилем на две
      колонки; когда на телефоне колонка одна, это создавало вторую,
      пустую, шириной в пол-экрана.
   --------------------------------------------------------------- */

/* 1 */
.offer > *, .dirs > *, .fgrid > *, .coach-grid > *, .revs > *, .stats > *{min-width:0;}

/* 2 */
h1, h2, h3, .dsp{overflow-wrap:break-word;}
@media(max-width:520px){
  .phero h1{font-size:clamp(26px,7.4vw,34px);hyphens:auto;}
}

/* 3 */
@media(max-width:640px){
  .offer > [style*="grid-column"]{grid-column:auto !important;}
}

/* В макете карточки в сетках горизонтальные и не переполняются — вертикальную
   раскладку, которую я добавлял раньше, убрал: причиной переполнения была
   пропавшая обёртка .post-body в шаблонах, а не сама раскладка.
   Оставляем только перенос по слогам для длинных русских заголовков. */
.offer .post-card h3{hyphens:auto;}

/* Старые статьи (шаблон single.php) писались до мобильной эпохи: видео с
   YouTube вставлены с жёсткой шириной 560px, картинки и таблицы — без
   ограничения. На телефоне это разрывало страницу. Ограничиваем ширину
   только внутри текста статьи, саму вёрстку статей не трогаем. */
.post_page iframe, .post_page embed, .post_page object, .post_page video,
.post_page img, .post_page table,
.trainer_page iframe, .trainer_page img, .trainer_page table,
.person-prose iframe, .person-prose img, .person-prose table,
.single-content iframe, .single-content img{max-width:100% !important;}
.post_page iframe, .post_page embed, .post_page object, .post_page video,
.trainer_page iframe, .person-prose iframe{height:auto;aspect-ratio:16/9;}
.post_page img{height:auto;}
.post_page table{display:block;overflow-x:auto;}
.post_page .wp-caption{max-width:100% !important;}
.post_page{overflow-wrap:break-word;}

/* ---------------------------------------------------------------
   КАРТОЧКИ ЛЮДЕЙ — тренеры, профсостав, команда клуба.
   Раньше эти страницы держались на старой вёрстке (.trainer_page,
   .photo_trainer, .first.post) и в новой теме выглядели чужеродно,
   а тренеры и профсостав вовсе остались без стилей.
   --------------------------------------------------------------- */

.back-link{color:var(--cta);text-decoration:underline;text-underline-offset:3px;}

/* Фото человека — вертикальный портрет, чтобы лицо не обрезалось */
.person-split{align-items:start;gap:clamp(24px,4vw,56px);}
.person-split .person-ph{aspect-ratio:3/4;max-width:420px;}
.person-ph img{width:100%;height:100%;object-fit:cover;object-position:center 18%;}

/* Направления тренера (ACF directing) — строка-подзаголовок над регалиями */
.person-directing{color:var(--cta-hi);font-family:var(--fm);font-size:13px;
  text-transform:uppercase;letter-spacing:.06em;margin-bottom:16px;}
.person-directing ul{list-style:none;display:flex;flex-wrap:wrap;gap:8px 16px;}
.person-directing li::before{content:'● ';}

/* Регалии из the_content(): в базе это просто строки с переносами */
.person-prose{font-size:16px;}
.person-prose p{margin-bottom:12px;}
.person-prose strong{color:var(--fg);}
.person-prose ul{list-style:none;display:flex;flex-direction:column;gap:9px;margin:14px 0;}
.person-prose ul li{position:relative;padding-left:18px;}
.person-prose ul li::before{content:'';position:absolute;left:0;top:9px;width:6px;height:6px;
  border-radius:50%;background:var(--cta);}
.person-prose img{max-width:100%;height:auto;border-radius:14px;margin:14px 0;}

/* Соцсети */
.person-soc{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px;}
.person-soc a{display:inline-flex;align-items:center;gap:9px;padding:10px 16px;
  border:1px solid var(--line);border-radius:999px;color:var(--soft);
  font-size:14px;transition:border-color .25s,color .25s;}
.person-soc a:hover{border-color:var(--cta);color:var(--fg);}
.person-soc svg{width:18px;height:18px;flex:0 0 18px;}

/* Переходы к соседним карточкам */
.person-nav{display:grid;grid-template-columns:1fr 1fr;gap:16px;
  border-top:1px solid var(--line);padding-top:22px;}
.pn-link{display:flex;flex-direction:column;gap:6px;min-width:0;}
.pn-next{text-align:right;}
.pn-cap{font-family:var(--fm);font-size:11.5px;text-transform:uppercase;
  letter-spacing:.08em;color:var(--dim);}
.pn-name{font-family:var(--fd);font-weight:800;font-size:clamp(15px,2vw,19px);
  text-transform:uppercase;color:var(--fg);transition:color .25s;
  overflow-wrap:break-word;hyphens:auto;}
.pn-link:hover .pn-name{color:var(--cta);}

@media(max-width:860px){
  .person-split{grid-template-columns:1fr;}
  .person-split .person-ph{max-width:100%;aspect-ratio:4/3;}
}
@media(max-width:560px){
  .person-nav{grid-template-columns:1fr;gap:18px;}
  .pn-next{text-align:left;}
  .person-soc a{flex:1 1 auto;justify-content:center;}
}

/* Картинки завёрнуты в <picture> ради webp. В макете дизайнера обёртки нет,
   и в бегущей фотоленте на главной она становилась лишним флекс-элементом:
   при прокрутке фотографии схлопывались и пропадали. display:contents убирает
   собственный бокс обёртки — раскладка становится ровно такой, как в макете. */
picture{display:contents;}

/* Страница «не найдено»: поле поиска в стилистике форм сайта */
.nf-search{display:flex;gap:12px;flex-wrap:wrap;max-width:620px;}
.nf-search input[type=search]{flex:1 1 260px;min-width:0;padding:15px 18px;border-radius:14px;
  border:1px solid var(--line);background:var(--card);color:var(--fg);font-family:var(--fb);font-size:16px;}
.nf-search input[type=search]:focus{outline:none;border-color:var(--cta);}
.nf-search .btn{flex:0 0 auto;}

/* Подвал: контакты клуба и направления-ссылки в нижней строке */
.fcontact{display:flex;flex-direction:column;gap:6px;margin-top:16px;font-size:15px;}
.fcontact a{color:var(--fg);text-decoration:none;}
.fcontact a:hover{color:var(--cta);}
.fcontact .soft{font-size:13.5px;line-height:1.45;}
.fdirs a{color:inherit;text-decoration:none;transition:color .2s;}
.fdirs a:hover{color:var(--cta);}