/*
Theme Name: EFIRKI
Description: Самостоятельная классическая тема на основе утверждённого прототипа efirki.ru.
Version: 0.2.0
Requires at least: 6.5
Requires PHP: 7.4
Text Domain: efirki
*/

body.admin-bar .site-header { top: var(--wp-admin--admin-bar--height, 32px); }
body.admin-bar #faq-nebulizer { scroll-margin-top: calc(100px + var(--wp-admin--admin-bar--height, 32px)); }

main#top { scroll-margin-top: 88px; }
#contact { scroll-margin-top: 107px; }
body.admin-bar main#top { scroll-margin-top: calc(88px + var(--wp-admin--admin-bar--height, 32px)); }
body.admin-bar #contact { scroll-margin-top: calc(107px + var(--wp-admin--admin-bar--height, 32px)); }

@media (max-width: 560px) {
  #contact { scroll-margin-top: 97px; }
  body.admin-bar #contact { scroll-margin-top: calc(97px + var(--wp-admin--admin-bar--height, 32px)); }
}

.contact-form .contact-consent-link {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.contact-form .contact-consent-link:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}

.site-footer .footer-brand-link,
.site-footer .footer-brand-link:hover {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}

.site-footer .footer-links a {
  color: inherit;
  text-decoration-line: underline;
  text-decoration-color: transparent;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
  transition: text-decoration-color .15s ease;
}

.site-footer .footer-links a:hover,
.site-footer .footer-links a:focus-visible {
  text-decoration-color: currentColor;
}

.site-footer .footer-brand-link:focus-visible,
.site-footer .footer-links a:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}

@media (max-width: 560px) {
  .hero.section {
    min-height: auto;
    padding: 22px 0 32px;
  }

  .hero .hero-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    align-items: start;
  }

  .hero .hero-copy { display: contents; }

  .hero .brand-signature {
    order: 0;
    margin: 0 0 4px;
    font-size: 20px;
  }

  .hero .hero-copy h1 {
    order: 1;
    margin: 0 0 12px;
    font-size: 64px;
    line-height: 1;
  }

  .hero .hero-product {
    order: 2;
    max-width: 100%;
    margin: 0 0 12px;
    font-size: 28px;
    line-height: 1.18;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .hero .hero-lead {
    order: 3;
    max-width: 100%;
    margin: 0 0 12px;
  }

  .hero .hero-product-stage {
    order: 4;
    width: 100%;
    min-height: 0;
    margin: 4px 0 22px;
    transform: none;
  }

  .hero .hero-product-img {
    width: 100%;
    max-width: 380px;
    height: auto;
    max-height: none;
    object-fit: contain;
  }

  .hero .product-halo { display: none; }

  .hero .cta-row {
    order: 5;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
    width: 100%;
  }
}