/* Keep the original photograph's lantern in frame and pulse its real light. */
.hero {
  --lighthouse-focal-x: 50%;
  background-position: var(--lighthouse-focal-x) center;
  overflow: hidden;
}
.lighthouse-flash {
  position: absolute;
  z-index: -2;
  pointer-events: none;
  visibility: hidden;
  background: url('lighthouse-night.png') 0 0 / 100% 100% no-repeat;
  /* Masks stay in the source photograph's coordinates, including on mobile. */
  -webkit-mask-image:
    radial-gradient(ellipse 3.8% 8.5% at 82.03% 24.74%, #000 18%, rgba(0,0,0,.94) 38%, transparent 100%),
    radial-gradient(ellipse 19% 9.5% at 68% 29.8%, #000 8%, rgba(0,0,0,.85) 28%, rgba(0,0,0,.48) 55%, transparent 100%);
  mask-image:
    radial-gradient(ellipse 3.8% 8.5% at 82.03% 24.74%, #000 18%, rgba(0,0,0,.94) 38%, transparent 100%),
    radial-gradient(ellipse 19% 9.5% at 68% 29.8%, #000 8%, rgba(0,0,0,.85) 28%, rgba(0,0,0,.48) 55%, transparent 100%);
  filter: brightness(.36);
  animation: lighthouseSingleFlash 6s ease-in-out infinite;
}
.lighthouse-flash.is-aligned { visibility: visible; }
@keyframes lighthouseSingleFlash {
  0%, 32%, 57%, 100% { filter: brightness(.36); }
  38% { filter: brightness(.52); }
  44% { filter: brightness(1.8); }
  49% { filter: brightness(.78); }
}

/* Extend the existing lighthouse mark: the light begins at its lantern. */
.brand-orbit {
  flex-shrink: 0;
  border-color: rgba(151,207,235,.62);
  box-shadow: 0 0 18px rgba(94,156,207,.15);
}
.brand-orbit:after {
  left: 50%;
  bottom: 14%;
  height: 44%;
  width: 8px;
  transform: translateX(-50%);
  box-shadow: none;
}
.brand-lamp {
  position: absolute;
  left: 50%;
  top: 33%;
  z-index: 2;
  width: 5px;
  height: 4px;
  transform: translateX(-50%);
  border-radius: 1px;
  background: #e5f8ff;
  box-shadow: 0 0 6px 2px rgba(170,227,255,.7);
  animation: logoLanternFlash 6s ease-in-out infinite;
}
.brand-orbit:before {
  display: block !important;
  left: 50%;
  right: auto;
  top: calc(33% - 5px);
  width: 39px;
  height: 14px;
  background: linear-gradient(90deg, transparent, rgba(186,231,255,.38) 35%, #ecfbff 50%, rgba(186,231,255,.38) 65%, transparent);
  clip-path: polygon(0 0, 50% 40%, 100% 0, 100% 100%, 50% 60%, 0 100%);
  transform: translateX(-50%);
  transform-origin: 50% 50%;
  filter: drop-shadow(0 0 2px rgba(174,225,255,.65));
  opacity: .22;
  animation: logoRayFlash 6s ease-in-out infinite;
}
@keyframes logoLanternFlash {
  0%, 32%, 57%, 100% { opacity: .6; }
  44% { opacity: 1; }
}
@keyframes logoRayFlash {
  0%, 32%, 57%, 100% { opacity: .22; }
  44% { opacity: 1; }
}

.counselor-gender {
  margin-left: .5em;
  font-size: .875rem;
  font-weight: 400;
  letter-spacing: .04em;
  color: var(--muted);
}

/* One clear fee, in the existing blue night-sky palette. */
.pricing { padding-top: 0; }
.price-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 28px;
  max-width: 800px;
  margin: auto;
  padding: 28px 36px;
  border: 1px solid rgba(126,213,239,.25);
  background: linear-gradient(125deg, #0b233b, #061525);
}
.price-intro .eyebrow { margin: 0 0 10px; font-size: .875rem; }
.price-intro h2 { margin: 0; font-size: clamp(1.375rem, 2.1vw, 1.625rem); }
.price-amount { padding-left: 28px; border-left: 1px solid var(--line); text-align: right; }
.fee-duration { margin: 0 0 8px; font-size: 1rem; color: #b8ccdc; }
.fee-duration strong { margin: 0 4px 0 6px; font-size: 1.25rem; font-weight: 500; color: #edf7ff; }
.fee-price { display: flex; align-items: baseline; justify-content: flex-end; gap: 7px; margin: 0; white-space: nowrap; line-height: 1.1; }
.fee-price strong { font: 400 clamp(2.25rem, 4vw, 3rem) / 1.1 Georgia, serif; letter-spacing: .025em; color: #edf7ff; }
.fee-price span { font-size: 1.125rem; color: #acc5da; }
.fee-tax { font-size: .875rem; letter-spacing: 0; color: #acc5da; }
@media (min-width: 801px) and (max-width: 1050px) {
  .navlinks { gap: 16px; }
  .navlinks .button { padding-inline: 18px; }
}
@media (max-width: 800px) {
  .hero { --lighthouse-focal-x: 88%; }
}
@media (max-width: 600px) {
  .price-panel { grid-template-columns: 1fr; gap: 18px; padding: 22px 20px; }
  .price-amount { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 12px; border-left: 0; border-top: 1px solid var(--line); padding: 18px 0 0; }
  .fee-duration { margin: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .lighthouse-flash { animation: none; filter: brightness(1); }
  .brand-orbit:before, .brand-lamp { animation: none; }
}
