/* AI Natives – shared styles. Page-specific values stay inline, exactly as in the design files. */
:root {
  --headline: 'Megrim';
  --headline-weight: 400;
}
body { margin: 0; background: #22665F; -webkit-font-smoothing: antialiased; }
a { color: #CFB3E8; }
a:hover { color: #F3FFF8; }
[hidden] { display: none !important; }

/* Headlines: Megrim (Anton fallback) with a subtle outline thickening */
.hl {
  font-family: var(--headline), 'Anton', sans-serif;
  font-weight: var(--headline-weight);
  -webkit-text-stroke: 0.018em currentColor;
  paint-order: stroke fill;
}

/* Hover states (inline styles set the resting state, so these need !important) */
.hov-btn:hover { background: #DCC6F0 !important; color: #16161A !important; }
.hov-submit:hover { background: #DCC6F0 !important; }
.hov-arrow:hover { background: rgba(207,179,232,1) !important; }
.hov-map:hover { background: #16161A !important; color: #F3FFF8 !important; }

/* Home marquee */
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { [style*="animation:marquee"] { animation-duration: 120s !important; } }

/* Program carousel */
[data-carousel-rail]::-webkit-scrollbar { display: none; }

/* Home hero on phones: shift the crop so the eye sits just right of centre (desktop unchanged) */
@media (max-width: 700px) { .home-hero-img { object-position: 63% top !important; } }

/* Phones: home headlines as large as the width allows; more space above the header */
@media (max-width: 700px) {
  .home-h1 { font-size: calc((100vw - 2 * clamp(20px, 8vw, 150px)) / 7.2) !important; }
  .home-h2 { font-size: calc((100vw - 2 * clamp(20px, 8vw, 150px)) / 7.5) !important; }
  .site-header { padding-top: 40px !important; }
}