/*
 * Optimal Home Premium Typography & Microinteraction System 0.2.10
 * Selective editorial accents and short, input-friendly CSS transitions.
 */

:root {
  --oh-font-editorial: Georgia, "Times New Roman", serif;
  --oh-motion-quick: 170ms;
  --oh-motion-medium: 260ms;
  --oh-motion-ease: cubic-bezier(0.2, 0.76, 0.24, 1);
}

/* Keep the established Manrope-led identity, then add one editorial voice. */
:where(.oh-decision-compass, .oh-home-knowledge, .oh-service-page, .oh-guide-experience, .oh-property-experience) :is(h1, h2, h3) {
  font-kerning: normal;
  text-wrap: balance;
}

:where(.oh-decision-compass, .oh-home-knowledge, .oh-service-page, .oh-guide-experience, .oh-property-experience) p {
  text-wrap: pretty;
}

.oh-guide-hero h1 span,
.oh-home-knowledge h2 span,
.oh-listings-hero h1 span {
  font-family: var(--oh-font-editorial);
  font-style: italic;
  font-weight: 700;
  letter-spacing: 0;
}

.oh-guide-single__prose blockquote,
.oh-listings-empty blockquote {
  font-family: var(--oh-font-editorial);
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0;
}

.oh-decision-compass__media figcaption strong,
.oh-service-hero__media figcaption strong {
  font-family: var(--oh-font-editorial);
  font-weight: 700;
  letter-spacing: 0;
}

:is(
  .oh-hero-depth__index,
  .oh-decision-compass__tab > span,
  .oh-service-hero__index,
  .oh-service-outcome__grid article > span,
  .oh-service-process__steps li > span,
  .oh-service-checks__list li span,
  .oh-guide-card__meta,
  .oh-guide-faq__meta,
  .oh-guide-single__meta,
  .oh-property-facts strong,
  .oh-listings-method li > span
) {
  font-variant-numeric: tabular-nums lining-nums;
}

.oh-decision-compass__panel li::before {
  font-variant-numeric: tabular-nums lining-nums;
}

/* Links gain a precise reading-direction cue instead of a decorative flourish. */
:is(
  .oh-guide-text-link,
  .oh-property-text-link,
  .oh-home-knowledge__all,
  .oh-home-knowledge__faq > a
) {
  background-image: linear-gradient(90deg, currentColor, currentColor);
  background-position: left calc(100% - 1px);
  background-repeat: no-repeat;
  background-size: 0 1px;
  transition:
    color var(--oh-motion-quick) ease,
    background-size var(--oh-motion-medium) var(--oh-motion-ease),
    transform var(--oh-motion-quick) ease;
}

:is(
  .oh-guide-text-link,
  .oh-property-text-link,
  .oh-home-knowledge__all,
  .oh-home-knowledge__faq > a
):is(:hover, :focus-visible) {
  background-size: 100% 1px;
}

/* A physical press state improves feedback on mouse, keyboard and touch. */
:is(
  #brx-header .oh-header-phone,
  .oh-decision-compass__panel footer a,
  .oh-service-button,
  .oh-guide-button,
  .oh-property-button,
  .oh-contact-form .ff-btn-submit
):active {
  box-shadow:
    inset 4px 4px 10px rgba(17, 25, 29, 0.18),
    inset -2px -2px 7px rgba(255, 255, 255, 0.18) !important;
  transform: translateY(1px) scale(0.985) !important;
}

/* Cards and process rows react only on devices with a real hover pointer. */
.oh-guide-card__monogram,
.oh-guide-card__art img,
.oh-guide-faq__item h3,
.oh-service-outcome__grid article > span,
.oh-service-process__steps li > div,
.oh-service-checks__list li,
.oh-property-gallery img,
.oh-listing-card__image {
  transition-duration: var(--oh-motion-medium);
  transition-timing-function: var(--oh-motion-ease);
}

.oh-service-outcome__grid article,
.oh-guide-faq__item,
.oh-guide-related article {
  position: relative;
  isolation: isolate;
}

.oh-service-outcome__grid article::after,
.oh-guide-faq__item::after,
.oh-guide-related article::after {
  position: absolute;
  z-index: 1;
  right: 22px;
  bottom: 0;
  left: 22px;
  height: 2px;
  border-radius: 999px;
  content: "";
  background: linear-gradient(90deg, transparent, var(--oh-copper), transparent);
  opacity: 0;
  pointer-events: none;
  transform: scaleX(0.2);
  transition:
    opacity var(--oh-motion-quick) ease,
    transform var(--oh-motion-medium) var(--oh-motion-ease);
}

.oh-guide-faq__item::after,
.oh-guide-related article::after {
  background: linear-gradient(90deg, transparent, var(--oh-guide-copper), transparent);
}

/* Focus remains visible even when hover motion is unavailable. */
:is(
  .oh-service-outcome__grid article,
  .oh-service-process__steps li,
  .oh-guide-card,
  .oh-guide-faq__item,
  .oh-guide-related article
):focus-within {
  outline: 2px solid rgba(184, 111, 66, 0.48);
  outline-offset: 4px;
}

@media (hover: hover) and (pointer: fine) {
  .oh-guide-card:hover .oh-guide-card__monogram {
    transform: translateY(-4px) rotate(-2deg) scale(1.025);
  }

  .oh-guide-card:hover .oh-guide-card__art img {
    transform: scale(1.025);
  }

  .oh-guide-faq__item:hover h3 {
    color: var(--oh-guide-copper-dark);
    transform: translateX(3px);
  }

  .oh-service-process__steps li:hover > div {
    transform: translateX(4px);
  }

  .oh-service-outcome__grid article:hover::after,
  .oh-guide-faq__item:hover::after,
  .oh-guide-related article:hover::after {
    opacity: 0.8;
    transform: scaleX(1);
  }

  .oh-contact-form .ff-btn-submit:hover {
    box-shadow:
      0 18px 34px rgba(78, 56, 22, 0.22),
      inset 1px 1px 0 rgba(255, 255, 255, 0.5);
    transform: translateY(-2px);
  }
}

@media (max-width: 767px) {
  .oh-guide-hero h1 span,
  .oh-home-knowledge h2 span,
  .oh-listings-hero h1 span {
    line-height: 1.02;
  }

  .oh-guide-single__prose blockquote,
  .oh-listings-empty blockquote {
    line-height: 1.35;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  :is(
    .oh-guide-text-link,
    .oh-property-text-link,
    .oh-home-knowledge__all,
    .oh-home-knowledge__faq > a,
    .oh-guide-card__monogram,
    .oh-guide-card__art img,
    .oh-guide-single-hero__art img,
    .oh-guide-faq__item h3,
    .oh-service-outcome__grid article > span,
    .oh-service-process__steps li > div,
    .oh-service-checks__list li,
    .oh-property-gallery img,
    .oh-listing-card__image,
    .oh-contact-form .ff-btn-submit
  ) {
    transition: none !important;
  }

  .oh-service-outcome__grid article::after,
  .oh-guide-faq__item::after,
  .oh-guide-related article::after {
    transition: none !important;
  }

  :is(
    #brx-header .oh-header-phone,
    .oh-decision-compass__panel footer a,
    .oh-service-button,
    .oh-guide-button,
    .oh-property-button,
    .oh-contact-form .ff-btn-submit
  ):active {
    transform: none !important;
  }
}