/**
 * HealthN.E.S.S. — Phase 5 Final Visual QA
 * Unifies CTA chrome, panel depth, and finishing details.
 * No redesign. No new features. No copy changes.
 */

/* --------------------------------------------------------------------------
 * Shared CTA language — header / footer / sticky match proof solids
 * ------------------------------------------------------------------------ */
#mainNav a.bg-primary,
#mainNav button.bg-primary,
footer a.bg-primary,
.mobile-nav-panel__cta {
  min-height: 48px;
  padding: 0.8rem 1.35rem;
  border: 1px solid var(--color-primary);
  border-radius: var(--radius-default, 0.25rem);
  background: var(--color-primary);
  color: var(--color-on-primary);
  box-shadow:
    inset 0 1px 0 rgba(255, 246, 220, 0.22),
    0 10px 28px rgba(0, 0, 0, 0.28);
  letter-spacing: 0.12em;
  transition:
    background-color 0.25s ease,
    border-color 0.25s ease,
    box-shadow 0.25s ease,
    color 0.25s ease;
}

#mainNav a.bg-primary:hover,
#mainNav a.bg-primary:focus-visible,
#mainNav button.bg-primary:hover,
#mainNav button.bg-primary:focus-visible,
footer a.bg-primary:hover,
footer a.bg-primary:focus-visible,
.mobile-nav-panel__cta:hover,
.mobile-nav-panel__cta:focus-visible {
  background: var(--color-primary-container);
  border-color: var(--color-primary-container);
  box-shadow:
    inset 0 1px 0 rgba(255, 246, 220, 0.18),
    0 14px 32px rgba(0, 0, 0, 0.34);
  outline: none;
}

.mobile-inquiry a,
.mobile-inquiry button {
  border-radius: var(--radius-default, 0.25rem);
  box-shadow:
    inset 0 1px 0 rgba(255, 246, 220, 0.2),
    0 8px 24px rgba(0, 0, 0, 0.35);
  font-weight: 700;
  letter-spacing: 0.12em;
}

/* Proof solid / ghost buttons — deliberate, not generic */
.proof-action--solid,
.proof-action--btn,
.hero__cta--primary,
.ascend-reveal__cta {
  border-radius: var(--radius-default, 0.25rem);
  box-shadow:
    inset 0 1px 0 rgba(255, 246, 220, 0.18),
    0 12px 30px rgba(0, 0, 0, 0.28);
}

.proof-action--solid {
  border: 1px solid var(--color-primary);
  justify-content: center;
  gap: 0.45rem;
}

.proof-action--solid .material-symbols-outlined,
.proof-action .material-symbols-outlined,
.hero__cta .material-symbols-outlined {
  font-size: 1rem;
  line-height: 1;
  width: 1rem;
  height: 1rem;
}

.proof-action:not(.proof-action--solid):not(.proof-action--btn) {
  border-bottom-width: 1px;
  border-bottom-style: solid;
  padding-inline: 0.1rem;
}

.svc-hero__actions .proof-action:not(.proof-action--solid),
.about-hero__actions .proof-action:not(.proof-action--solid),
.work-open__actions .proof-action:not(.proof-action--solid),
.insight-soon__actions .proof-action:not(.proof-action--solid),
.insight-cta__actions .proof-action:not(.proof-action--solid),
.faq-cta__actions .proof-action:not(.proof-action--solid),
.contact-premium .proof-action:not(.proof-action--solid),
.svc-cta__actions .proof-action:not(.proof-action--solid),
.about-cta__actions .proof-action:not(.proof-action--solid),
.work-cta__actions .proof-action:not(.proof-action--solid),
.case-cta__actions .proof-action:not(.proof-action--solid) {
  border: 1px solid rgba(242, 202, 80, 0.45);
  border-bottom-width: 1px;
  padding: 0.8rem 1.35rem;
  min-height: 48px;
  justify-content: center;
  border-radius: var(--radius-default, 0.25rem);
  background: rgba(242, 202, 80, 0.03);
  text-decoration: none;
}

.proof-action--btn:hover,
.proof-action--btn:focus-visible,
.svc-hero__actions .proof-action:not(.proof-action--solid):hover,
.svc-hero__actions .proof-action:not(.proof-action--solid):focus-visible,
.about-hero__actions .proof-action:not(.proof-action--solid):hover,
.about-hero__actions .proof-action:not(.proof-action--solid):focus-visible,
.work-open__actions .proof-action:not(.proof-action--solid):hover,
.insight-soon__actions .proof-action:not(.proof-action--solid):hover,
.insight-cta__actions .proof-action:not(.proof-action--solid):hover,
.faq-cta__actions .proof-action:not(.proof-action--solid):hover,
.contact-premium .proof-action:not(.proof-action--solid):hover,
.contact-premium .proof-action:not(.proof-action--solid):focus-visible,
.svc-cta__actions .proof-action:not(.proof-action--solid):hover,
.about-cta__actions .proof-action:not(.proof-action--solid):hover,
.work-cta__actions .proof-action:not(.proof-action--solid):hover,
.case-cta__actions .proof-action:not(.proof-action--solid):hover {
  background: rgba(242, 202, 80, 0.1);
  border-color: rgba(242, 202, 80, 0.7);
  color: var(--color-primary);
  outline: none;
}

/* --------------------------------------------------------------------------
 * Finale / CTA panels — one craft language sitewide
 * ------------------------------------------------------------------------ */
.svc-cta__panel,
.faq-cta__panel,
.insight-cta__panel,
.about-cta__panel,
.work-cta__panel,
.case-cta__panel,
.insight-soon__panel,
.contact-premium,
.vf-finale {
  border-color: rgba(242, 202, 80, 0.3);
  box-shadow:
    inset 0 1px 0 rgba(242, 202, 80, 0.1),
    0 28px 70px rgba(0, 0, 0, 0.34);
}

.inquiry-prepare {
  border-color: rgba(153, 144, 124, 0.22);
  box-shadow: inset 0 1px 0 rgba(242, 202, 80, 0.05);
}

/* --------------------------------------------------------------------------
 * Cards / accordions — less “default component”, more brand surface
 * ------------------------------------------------------------------------ */
.faq-item,
.home-process-step,
.home-scan-card,
.home-pillar,
.work-card,
.insight-soon__topics li,
.case-status,
.case-callout {
  border-color: rgba(153, 144, 124, 0.24);
}

.faq-item,
.home-process-step,
.home-scan-card,
.home-pillar {
  box-shadow: inset 0 1px 0 rgba(242, 202, 80, 0.04);
}

.faq-item[open],
.home-process-step:hover,
.home-process-step:focus-within {
  border-color: rgba(242, 202, 80, 0.48);
}

.work-card {
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.work-card:hover,
.work-card:focus-within {
  border-color: rgba(242, 202, 80, 0.38);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.28);
}

/* --------------------------------------------------------------------------
 * Section rails — consistent horizontal alignment
 * ------------------------------------------------------------------------ */
.svc-hero,
.svc-worlds,
.svc-section,
.svc-cta,
.about-hero,
.about-section,
.about-cta,
.faq-hero,
.faq-section,
.faq-cta,
.insight-open,
.insight-soon,
.insight-cta,
.work-open,
.work-featured,
.work-archive,
.work-cta,
.case-nav,
.case-hero,
.case-section,
.case-cta {
  box-sizing: border-box;
}

/* Footer transition — less abrupt */
footer.bg-background {
  border-top-color: rgba(153, 144, 124, 0.22);
  background:
    linear-gradient(180deg, rgba(22, 23, 22, 0.55), rgba(18, 20, 19, 1) 28%),
    var(--color-background);
}

/* Chapter mark / eyebrows — consistent gold signal */
.chapter-mark,
.svc-hero__eyebrow,
.about-hero__eyebrow,
.faq-hero__eyebrow,
.insight-open__eyebrow,
.work-open__eyebrow,
.case-eyebrow {
  letter-spacing: 0.16em;
}

/* Conv checkpoint / secondary explore links */
.conv-checkpoint__link,
.proof-explore__process {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  letter-spacing: 0.12em;
}

/* --------------------------------------------------------------------------
 * Media frames — avoid disconnected empty rectangles
 * ------------------------------------------------------------------------ */
.vf-media,
.vf-browser,
.hn-media-frame,
.proof-media,
.case-media {
  border-color: rgba(153, 144, 124, 0.22);
}

.vf-media__label,
.case-placeholder__label,
.media-placeholder__label {
  letter-spacing: 0.14em;
}

/* --------------------------------------------------------------------------
 * 404 polish alignment with brand CTAs
 * ------------------------------------------------------------------------ */
.wrap .actions a.primary {
  border: 1px solid var(--color-primary);
  box-shadow:
    inset 0 1px 0 rgba(255, 246, 220, 0.2),
    0 12px 28px rgba(0, 0, 0, 0.28);
}

.wrap .actions a.secondary {
  border-color: rgba(242, 202, 80, 0.4);
  background: rgba(242, 202, 80, 0.03);
}

.wrap .actions a.secondary:hover,
.wrap .actions a.secondary:focus-visible {
  border-color: rgba(242, 202, 80, 0.7);
  background: rgba(242, 202, 80, 0.08);
  outline: none;
}

/* --------------------------------------------------------------------------
 * Reduced motion
 * ------------------------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
  #mainNav a.bg-primary,
  footer a.bg-primary,
  .proof-action--solid,
  .work-card {
    transition: none;
  }
}