/* Hallmark · custom MissaciWeb glass and fluid interactions · brand-preserving revision */
/* MissaciWeb · restrained glass materials and progressive interactions. */
:root {
  --interaction-glass-base: color-mix(in srgb, var(--surface) 84%, transparent);
  --interaction-glass-highlight: color-mix(in srgb, var(--blue) 12%, var(--surface));
  --interaction-glass-feature-edge: color-mix(in srgb, var(--blue) 75%, var(--glass-line));
  --interaction-glass-edge: color-mix(in srgb, var(--text) 25%, transparent);
  --interaction-glass-light: color-mix(in srgb, var(--text) 9%, transparent);
  --interaction-glass-clear: color-mix(in srgb, var(--text) 0%, transparent);
  --interaction-glass-accent: color-mix(in srgb, var(--text) 6%, transparent);
  --interaction-shadow: color-mix(in srgb, var(--bg) 74%, transparent);
  --interaction-shadow-soft: color-mix(in srgb, var(--bg) 30%, transparent);
  --interaction-nav-base: color-mix(in srgb, var(--bg) 82%, transparent);
  --interaction-nav-menu: color-mix(in srgb, var(--bg) 95%, transparent);
  --interaction-ease: cubic-bezier(.22, 1, .36, 1);
  --legacy-card-ease: cubic-bezier(.16, 1, .3, 1);
  --legacy-card-ring-strong: color-mix(in srgb, var(--cyan) 42%, transparent);
  --legacy-card-ring-mid: color-mix(in srgb, var(--cyan) 24%, transparent);
  --legacy-card-ring-soft: color-mix(in srgb, var(--cyan) 14%, transparent);
  --legacy-card-reflection: linear-gradient(115deg, transparent 38%,
    color-mix(in srgb, var(--text) 5.5%, transparent) 49%, transparent 60%);
  --legacy-card-rings: radial-gradient(circle,
    var(--legacy-card-ring-strong) 0 12%, var(--surface) 13% 23%,
    var(--legacy-card-ring-mid) 24% 36%, transparent 37% 48%,
    var(--legacy-card-ring-soft) 49% 60%, transparent 61%);
}

.site-header, .site-header.is-scrolled, body:not(.is-home) .site-header {
  border: 0;
  background: transparent;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
.site-header .header-inner {
  position: relative;
  width: min(1184px, calc(100% - 48px));
  height: 70px;
  margin: var(--space-sm) auto;
  padding-inline: var(--space-lg);
  border: 1px solid var(--interaction-glass-edge);
  border-radius: var(--radius-pill);
  background: var(--interaction-nav-base);
  box-shadow: inset 0 1px 0 var(--interaction-glass-light),
    0 12px 32px -24px var(--interaction-shadow);
  -webkit-backdrop-filter: blur(22px) saturate(135%);
  backdrop-filter: blur(22px) saturate(135%);
}
.site-header .brand, .site-header .main-nav a, .site-header .header-contact { min-height: 44px; }
.site-header .main-nav a { display: inline-flex; align-items: center; }
.site-header .main-nav .mobile-nav-contact { display: none; }

@media (max-width: 1050px) and (min-width: 761px) {
  .site-header .header-inner { gap: 20px; padding-inline: 20px; }
  .site-header .main-nav { gap: 20px; }
  .site-header .main-nav .mobile-nav-contact { display: inline-flex; }
}

@media (max-width: 760px) {
  .site-header .header-inner {
    width: calc(100% - 24px);
    height: 64px;
    margin: var(--space-sm) auto;
    padding-inline: var(--space-md);
  }
  .site-header .main-nav {
    inset: 74px 0 auto;
    padding: var(--space-md) var(--space-md);
    border: 1px solid var(--interaction-glass-edge);
    border-radius: var(--radius-card);
    background: var(--interaction-nav-menu);
    box-shadow: 0 20px 48px -28px var(--interaction-shadow);
    -webkit-backdrop-filter: blur(22px) saturate(135%);
    backdrop-filter: blur(22px) saturate(135%);
  }
  .site-header .main-nav a { padding: var(--space-sm) 4px; }
  .site-header .main-nav .mobile-nav-contact { display: inline-flex; }
  .js .site-header .main-nav.is-open { max-height: calc(100dvh - 108px); }
  html:not(.js) .site-header .header-inner { border-radius: var(--radius-card); }
  html:not(.js) .site-header .main-nav { padding: 0; border: 0; background: transparent; box-shadow: none; }
}

.plan-card, .contact-card, .method-strip {
  position: relative;
  isolation: isolate;
  border: 1px solid var(--interaction-glass-edge);
  background: var(--interaction-glass-base);
  box-shadow: inset 0 1px 0 var(--interaction-glass-light),
    0 8px 20px -12px var(--interaction-shadow-soft),
    0 28px 60px -38px var(--interaction-shadow);
}

/* These surfaces sit over a flat background. The sheen supplies their material
   without rerasterizing a large backdrop during scroll or pointer movement. */
.plan-card, .contact-card, .method-strip {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.plan-card::before, .contact-card::before, .method-strip::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(138deg, var(--interaction-glass-light),
    var(--interaction-glass-clear) 37%, var(--interaction-glass-clear) 72%,
    var(--interaction-glass-accent));
}

.plan-card:nth-child(2) {
  border-color: var(--interaction-glass-feature-edge);
  background: var(--interaction-glass-highlight);
}

.plan-card::after {
  content: '';
  position: absolute;
  z-index: -1;
  inset: -1px;
  border: 1px solid var(--cyan);
  border-radius: inherit;
  pointer-events: none;
  opacity: 0;
  box-shadow: inset 0 1px 0 var(--interaction-glass-light),
    0 18px 36px -26px var(--interaction-glass-accent);
  transition: opacity 450ms var(--legacy-card-ease);
}

.plan-card:focus-within::after { opacity: .65; }
.plan-card:has(:focus-visible)::after { transition: none; }
.plan-card .button, .contact-card .button { min-height: 48px; }
.contact-links a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}
.faq summary { min-height: 44px; }

/* The spring owns transform; a reveal owns the independent translate property. */
.plan-card.has-pointer-spring { transform-origin: 50% 50%; }
.plan-card.is-pointer-moving { will-change: transform; }

/* Existing navigation/button feedback also respects pointer capabilities. */
.button:hover, .service-choice:hover { transform: none; }
.button:focus-visible, .service-choice:focus-visible { transition: none; }

@media (hover: hover) and (pointer: fine) {
  .plan-card.is-pointer-over::after, .plan-card:hover::after { opacity: .55; }
  .plan-card:not(.has-pointer-spring) {
    transition: transform 280ms var(--interaction-ease);
  }
  .plan-card:not(.has-pointer-spring):hover {
    transform: translateY(-10px) scale(1.01);
  }
  .button:hover { transform: translateY(-2px); }
  .button:active { transform: scale(.98); }
  .service-choice:hover { transform: translateX(4px); }
}

@media (hover: none), (pointer: coarse) {
  .plan-card:not(.has-pointer-spring):has(.button:active) { transform: scale(.996); }
  .plan-card .button:active, .contact-card .button:active { transform: scale(.98); }
}

.button:focus-visible, .button:active:focus-visible, .service-choice:focus-visible,
.plan-card:not(.has-pointer-spring):has(:focus-visible) { transform: none; }

@media (prefers-reduced-transparency: reduce) {
  .site-header .header-inner, .site-header .main-nav {
    background: var(--bg);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  .plan-card, .contact-card, .method-strip {
    background: var(--surface);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  .plan-card:nth-child(2) { background: var(--interaction-glass-highlight); }
  .plan-card::before, .contact-card::before, .method-strip::before { display: none; }
}

@media (prefers-contrast: more) {
  .site-header .header-inner, .site-header .main-nav {
    background: var(--bg);
    border-color: var(--text);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  .plan-card, .contact-card, .method-strip {
    background: var(--bg);
    border-color: var(--text);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  .plan-card:nth-child(2) { background: var(--surface); border-color: var(--cyan); }
  .plan-card::before, .contact-card::before, .method-strip::before { display: none; }
  .plan-card::after { border-width: 2px; }
  .plan-kicker, .plan-type, .plan-meta, .contact-card p { color: var(--text); }
}

@media (prefers-reduced-motion: reduce) {
  .plan-card, .plan-card:hover, .plan-card.has-pointer-spring,
  .plan-card:not(.has-pointer-spring):has(.button:active),
  .button:hover, .button:active, .service-choice:hover {
    transform: none !important;
  }
  .plan-card, .plan-card::after, .button, .service-choice { transition: none; }
  .plan-card.is-pointer-moving { will-change: auto; }
}

@media(min-width:761px){.cookie-banner{left:auto;right:20px}}

/* Reused from the original MissaciWeb cards: corner rings, diagonal reflection
   and the plans' cyan light. Only the interaction activates them; no idle loop. */
.card-legacy-effects {
  position: absolute;
  z-index: -1;
  inset: 0;
  overflow: clip;
  border-radius: inherit;
  pointer-events: none;
}
.card-legacy-effects > span { position: absolute; pointer-events: none; }
.card-legacy-glow {
  inset: 20% -15%;
  border-radius: 50%;
  background: var(--blue);
  box-shadow: 0 -36px 80px var(--cyan), 80px 44px 100px var(--cyan);
  filter: blur(38px);
  opacity: 0;
  transition: opacity 600ms var(--legacy-card-ease);
}
.card-legacy-rings {
  top: -78px;
  right: -70px;
  width: 172px;
  height: 172px;
  border-radius: 50%;
  background: var(--legacy-card-rings);
  opacity: .58;
  transform: scale(1);
  transform-origin: center;
  transition: transform 500ms var(--legacy-card-ease), opacity 300ms var(--legacy-card-ease);
}
.plan-card .card-legacy-rings { display: none; }
.contact-card .card-legacy-glow, .method-strip .card-legacy-glow { display: none; }
.js .card-legacy-sheen {
  inset: -40%;
  background: var(--legacy-card-reflection);
  opacity: 0;
  transform: translateX(-42%);
  transition: transform 650ms var(--legacy-card-ease), opacity 180ms var(--legacy-card-ease);
}
.contact-card, .method-strip {
  transition: transform 300ms var(--legacy-card-ease);
}

@media (hover: hover) and (pointer: fine) {
  html:not(.is-motion-keyboard) .plan-card.is-pointer-over .card-legacy-glow { opacity: .15; }
  html:not(.is-motion-keyboard) .plan-card:nth-child(2).is-pointer-over .card-legacy-glow { opacity: .22; }
  html:not(.is-motion-keyboard) .plan-card.is-pointer-over .card-legacy-sheen,
  html:not(.is-motion-keyboard) .contact-card:hover .card-legacy-sheen,
  html:not(.is-motion-keyboard) .method-strip:hover .card-legacy-sheen {
    opacity: 1;
    transform: translateX(42%);
  }
  html:not(.is-motion-keyboard) .contact-card:hover,
  html:not(.is-motion-keyboard) .method-strip:hover { transform: translateY(-4px); }
  html:not(.is-motion-keyboard) .contact-card:hover .card-legacy-rings,
  html:not(.is-motion-keyboard) .method-strip:hover .card-legacy-rings {
    opacity: .92;
    transform: scale(1.08);
  }
}
@media (hover: none), (pointer: coarse) {
  .card-legacy-sheen, .card-legacy-glow { display: none; }
  .card-legacy-rings { opacity: .36; transition: none; }
  .contact-card:has(.button:active):not(:has(:focus-visible)) { transform: scale(.996); }
}

/* Keyboard focus stays instantaneous, even if the pointer is still above a card. */
html.is-motion-keyboard .contact-card, html.is-motion-keyboard .method-strip,
.contact-card:has(:focus-visible), .method-strip:has(:focus-visible) {
  transform: none !important;
  transition: none;
}
html.is-motion-keyboard .card-legacy-effects > span,
.contact-card:has(:focus-visible) .card-legacy-effects > span,
.method-strip:has(:focus-visible) .card-legacy-effects > span { transition: none; }
.contact-card:has(:focus-visible) .card-legacy-sheen,
.method-strip:has(:focus-visible) .card-legacy-sheen { opacity: 0 !important; transform: translateX(-42%) !important; }
.contact-card:has(:focus-visible) .card-legacy-rings,
.method-strip:has(:focus-visible) .card-legacy-rings { opacity: .58 !important; transform: none !important; }

@media (prefers-reduced-motion: reduce) {
  .contact-card, .method-strip { transform: none !important; transition: none; }
  .card-legacy-effects > span { transition: none !important; transform: none !important; }
  .card-legacy-sheen, .card-legacy-glow { display: none; }
  .card-legacy-rings { opacity: .36 !important; }
}
@media (prefers-contrast: more), (prefers-reduced-transparency: reduce) {
  .card-legacy-effects { display: none; }
}