/* ==========================================================================
   McORven — component & base layer

   Ported from the source project's index.css, plus the styles that were inline
   style props on the original components (animation delays) and the
   accessibility helpers added during the static conversion.
   ========================================================================== */

:root {
  /* Exactly the stacks from the source project's index.css. Do not add
     fallbacks here: they change metrics while the webfonts are still loading
     (and permanently if Google Fonts is unreachable), which shifts button and
     card widths away from the intended design. */
  --font-heading: "Playfair Display", "Noto Serif SC", serif;
  --font-body: "Inter", "Noto Sans SC", sans-serif;
  --font-label: "Inter", "Noto Sans SC", sans-serif;
  --brand-primary: #14345e;
  --brand-accent: #c69a3d;
}

html {
  scroll-behavior: smooth;
  /* keep anchor targets clear of the fixed header */
  scroll-padding-top: 5rem;
}

body {
  font-family: var(--font-body);
  background-color: #fbf9f4;
  color: #0a141f;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin: 0;
}

/* --------------------------------------------------------------------------
   Accessibility
   -------------------------------------------------------------------------- */

.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 100;
  padding: 0.75rem 1.25rem;
  background: #0c223d;
  color: #ddbe6f;
  font-size: 0.875rem;
  font-weight: 600;
  border-radius: 0 0 0.375rem 0;
}

.skip-link:focus {
  left: 0;
}

:focus-visible {
  outline: 2px solid var(--brand-accent);
  outline-offset: 2px;
}

/* --------------------------------------------------------------------------
   Anti-spam honeypot — visually removed without inline styles
   -------------------------------------------------------------------------- */

.mcv-field--company-alt {
  position: absolute !important;
  left: -9999px !important;
  top: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* --------------------------------------------------------------------------
   Scroll reveal

   Replaces the source Reveal IntersectionObserver component. The hidden state
   applies only when scripting is available, so the page degrades to fully
   visible content with JavaScript disabled.
   -------------------------------------------------------------------------- */

.js [data-reveal] {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
    transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}

.js [data-reveal].is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* --------------------------------------------------------------------------
   Animation delays — these were inline animationDelay style props in the source
   -------------------------------------------------------------------------- */

.animate-delay-150 {
  animation-delay: 150ms;
}

.animate-delay-300 {
  animation-delay: 300ms;
}

/* --------------------------------------------------------------------------
   Header state — replaces the source `scrolled` boolean
   -------------------------------------------------------------------------- */

[data-header] {
  background-color: transparent;
}

[data-header].is-scrolled {
  background-color: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-bottom: 1px solid #ece2d0;
}

[data-header].is-scrolled [data-brand-name] {
  color: #081a2f;
}

[data-header].is-scrolled [data-brand-tagline] {
  color: #4a6785;
}

[data-header].is-scrolled [data-nav-link] {
  color: #263d55;
}

[data-header].is-scrolled [data-nav-link]:hover {
  color: #a97f2e;
}

[data-header].is-scrolled [data-menu-icon] {
  color: #081a2f;
}

/* Desktop language switcher follows the same light/dark treatment */
[data-header].is-scrolled #lang-desktop-btn {
  color: #1a2c3e;
}

[data-header].is-scrolled #lang-desktop-btn:hover {
  color: #a97f2e;
}

[data-lang-menu][hidden] {
  display: none !important;
}

[data-lang-caret].is-open {
  transform: rotate(180deg);
}

/* --------------------------------------------------------------------------
   Utility
   -------------------------------------------------------------------------- */

[hidden] {
  display: none !important;
}

img {
  max-width: 100%;
}

/* Thin elegant scrollbar */
::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-track {
  background: #f6f1e7;
}

::-webkit-scrollbar-thumb {
  background: #c69a3d;
  border-radius: 6px;
}

/* --------------------------------------------------------------------------
   Reduced motion
   -------------------------------------------------------------------------- */

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

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .js [data-reveal] {
    opacity: 1;
    transform: none;
  }
}

/* --------------------------------------------------------------------------
   Print
   -------------------------------------------------------------------------- */

@media print {
  [data-header],
  [data-fab-toggle],
  [data-fab-panel],
  .skip-link,
  iframe {
    display: none !important;
  }

  .js [data-reveal] {
    opacity: 1 !important;
    transform: none !important;
  }

  body {
    background: #fff;
    color: #000;
  }
}