/* Точечные правки по рекомендациям one2click: кликабельные элементы и мобильная панель связи. */

/* «10+ лет» ведёт к кейсам, вид прежний */
.studio-fact-link{display:flex;flex-direction:column;gap:inherit;color:inherit;text-decoration:none;cursor:pointer}
.studio-fact-link:hover{text-decoration:none;color:inherit}
.studio-fact-link strong{transition:color 160ms ease}
.studio-fact-link:hover strong{color:#3455d1}
/* Карточка «Более 10 лет» в первом экране: на обороте явный переход к кейсам, повторный клик ведёт в #cases */
.sp-card-cases{display:flex;align-items:center;gap:6px;width:max-content;margin-top:14px;padding:9px 14px;border-radius:999px;background:#fff;color:#2f4bd0;font-size:14px;font-weight:620;line-height:1;transition:background-color 160ms ease}
.sp-card-cases svg{width:16px;height:16px;flex:none}
@media(hover:hover){.offer-card.card-person[aria-expanded=true]:hover .sp-card-cases{background:#e6ecff}}
@media(max-width:600px){.sp-card-cases{margin-top:12px;padding:8px 13px;font-size:13px}}

/* «бесплатно» в заголовках — ссылка, без подчёркивания */
a.offer-highlight,a.first-free{color:inherit;text-decoration:none;cursor:pointer;transition:border-color 160ms ease}
a.offer-highlight:hover,a.first-free:hover{text-decoration:none;color:inherit;border-color:#3455d166}

/* Карточки-концепты первого экрана — ссылки на кейсы */
a.first-concept-card{display:block;cursor:pointer;text-decoration:none}
a.first-concept-card:hover{text-decoration:none}
.first-screen-visual a.first-concept-card[data-stack-position="0"]:hover{outline:1px solid #3455d140;outline-offset:-1px}

/* Карточка кейса кликабельна целиком */
.case-tile.is-clickable{cursor:pointer}
.case-tile.is-clickable h3{transition:color 160ms ease}
@media(hover:hover) and (pointer:fine){.case-tile.is-clickable:hover h3{color:#3455d1}}
.case-tile.is-target{outline:2px solid #3455d1;outline-offset:3px;transition:outline-color 600ms ease}

/* Без обводки после клика, только для клавиатуры */
.studio-fact-link:focus:not(:focus-visible),a.offer-highlight:focus:not(:focus-visible),a.first-free:focus:not(:focus-visible),a.first-concept-card:focus:not(:focus-visible),.mcb-link:focus:not(:focus-visible){outline:none}
a.first-concept-card:focus-visible{outline:3px solid #365bd6;outline-offset:3px}

/* Мобильная панель связи: MAX, Telegram, звонок */
.mobile-contact-bar{display:none}
@media(max-width:760px){
  body{padding-bottom:calc(68px + env(safe-area-inset-bottom,0px))}
  .mobile-contact-bar{position:fixed;left:0;right:0;bottom:0;z-index:45;display:grid;transition:transform var(--mcb-dur,260ms) cubic-bezier(.32,.72,0,1),visibility 0s linear 0s;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:8px 16px calc(8px + env(safe-area-inset-bottom,0px));background:#fff;border-top:1px solid #e3e6eb}
  .mcb-link{display:flex;align-items:center;justify-content:center;gap:7px;min-width:0;height:44px;padding:0 8px;border-radius:12px;font-size:14px;font-weight:560;line-height:1;white-space:nowrap;text-decoration:none;color:#fff;-webkit-tap-highlight-color:transparent}
  .mcb-link:hover{text-decoration:none;color:#fff}
  .mcb-link svg,.mcb-link img{width:19px;height:19px;flex:none}
  .mcb-link svg{fill:currentColor}
  .mcb-max{background:linear-gradient(135deg,#3989ff,#7249eb)}
  .mcb-max img{filter:brightness(0) invert(1)}
  .mcb-tg{background:#229ed9}
  .mcb-call{background:#f1f3f6;color:#202125;border:1px solid #dfe3e8}
  .mcb-call:hover{color:#202125}
  .mcb-call svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  /* Уезжает вниз рядом с формами, при открытом поп-апе или меню и пока набирают текст — тем же плавным движением */
  .mobile-contact-bar.is-tucked,
  body:has(dialog[open]) .mobile-contact-bar,
  body:has(input:not([type=radio]):not([type=checkbox]):focus,textarea:focus,select:focus) .mobile-contact-bar{transform:translateY(calc(100% + 2px));visibility:hidden;transition:transform var(--mcb-dur,260ms) cubic-bezier(.32,.72,0,1),visibility 0s linear var(--mcb-dur,260ms)}
}
@media(prefers-reduced-motion:reduce){.mobile-contact-bar{--mcb-dur:0s}}
@media(max-width:360px){.mcb-link{font-size:13px;gap:5px;padding:0 6px}.mobile-contact-bar{gap:6px;padding-inline:12px}}

/* Цена в первом экране заметнее, без дубля */
.hero .hero-price{font-weight:600;color:#1d2129;white-space:nowrap}

/* Контакты рядом с основной кнопкой — только на десктопе (на мобилке есть нижняя панель) */
.hero-contacts{display:none}
@media(min-width:761px){
  .hero .hero-contacts{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:12px}
  .hc-link{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;color:#fff;flex:none}
  .hc-link svg,.hc-link img{width:17px;height:17px}
  .hc-max{background:linear-gradient(135deg,#3989ff,#7249eb)}
  .hc-max img{filter:brightness(0) invert(1)}
  .hc-tg{background:#229ed9}
  .hc-tg svg{fill:currentColor}
  .hc-phone{display:inline-flex;align-items:center;min-height:36px;padding:0 4px;margin-left:2px;font-size:14px;font-weight:560;color:#1d2129;white-space:nowrap}
  .hc-phone:hover{color:#3455d1;text-decoration:none}
}
.hc-link:focus:not(:focus-visible),.hc-phone:focus:not(:focus-visible){outline:none}

/* Солидные иконки в квизе и формах (18.10) */
.quiz-option-go svg{stroke-width:2.8}

/* Плавность: блоки ниже первого экрана мягко проявляются один раз при прокрутке.
   Класс ставит app.js только тем блокам, которых не видно при загрузке, — без JS всё видно сразу.
   Двигаем только opacity/transform, поэтому раскладка и высоты не меняются. */
.sp-anim-reveal{opacity:0;transform:translateY(22px);transition:opacity 520ms cubic-bezier(.22,1,.36,1),transform 640ms cubic-bezier(.22,1,.36,1)}
.sp-anim-reveal.is-in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.sp-anim-reveal{opacity:1;transform:none;transition:none}}

/* Клик по заголовку «Получите расчёт…» ведёт к квизу: панель коротко подсвечивается рамкой (без теней). */
@keyframes sp-plan-ping{0%,100%{outline-color:transparent}25%,70%{outline-color:#9ad13a}}
.quiz-panel.sp-plan-ping{outline:3px solid transparent;outline-offset:4px;animation:sp-plan-ping 1.4s ease-in-out 1}
@media(prefers-reduced-motion:reduce){.quiz-panel.sp-plan-ping{animation:none}}
