:root { -webkit-text-size-adjust: 100%; }
html { scroll-behavior: smooth; }
body { font-size: 17px; line-height: 1.6; }

a, button { -webkit-tap-highlight-color: transparent; }

/* ---- Scrollbars ---- */
::-webkit-scrollbar { width: 11px; height: 11px; }
::-webkit-scrollbar-track { background: #F1EBE0; }
::-webkit-scrollbar-thumb { background: #C7B48C; border-radius: 2px; }
::-webkit-scrollbar-thumb:hover { background: #B08D42; }

canvas { max-width: 100%; }

/* ---- Letterspaced small-caps section labels ---- */
.eyebrow {
  font-family: "Source Sans 3", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.28em;
  font-weight: 600;
  font-size: 0.78rem;
}

/* ---- Thin gold rule under headings ---- */
.rule-gold::after {
  content: "";
  display: block;
  width: 68px;
  height: 2px;
  background: #B08D42;
  margin-top: 1.1rem;
}
.rule-gold.center::after { margin-left: auto; margin-right: auto; }

/* ---- Paper grain / subtle texture ---- */
.grain {
  position: relative;
}
.grain::before {
  content: "";
  position: absolute; inset: 0;
  pointer-events: none;
  opacity: 0.04;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---- Photo with navy-tinted overlay for text legibility ---- */
.photo-overlay { position: relative; }
.photo-overlay > .overlay {
  position: absolute; inset: 0;
  background: rgba(27, 42, 58, 0.55);
}
.photo-overlay > .overlay-strong {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(19,31,43,0.72) 0%, rgba(27,42,58,0.62) 55%, rgba(19,31,43,0.80) 100%);
}
.photo-overlay > .content { position: relative; z-index: 1; }

/* ---- Motion hero video ---- */
.hero-video-section { overflow: hidden; background: #131F2B; }
.hero-video {
  display: block;
  /* subtle warm-desaturated grade to match the still photography */
  filter: saturate(0.9) contrast(1.02);
}
/* Extra left-weighted scrim so headline/eyebrow read crisply over motion */
.photo-overlay > .hero-scrim {
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background:
    linear-gradient(90deg, rgba(19,31,43,0.78) 0%, rgba(19,31,43,0.45) 42%, rgba(19,31,43,0.10) 70%, rgba(19,31,43,0.00) 100%),
    linear-gradient(180deg, rgba(19,31,43,0.30) 0%, rgba(19,31,43,0.00) 30%, rgba(19,31,43,0.55) 100%);
}
/* Soften motion for users who prefer reduced motion — freeze on poster */
@media (prefers-reduced-motion: reduce) {
  .hero-video { display: none; }
  .hero-video-section {
    background-image: var(--hero-poster);
    background-size: cover; background-position: center;
  }
}

/* ---- Display heading refinement ---- */
.font-display { letter-spacing: -0.01em; }

/* ---- Portal row hover comfort ---- */
.row-hover { transition: background-color .15s ease; }
.row-hover:hover { background-color: #F1EBE0; }

/* ---- Focus visibility for keyboard users ---- */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 2px solid #B08D42; outline-offset: 2px;
}

/* ---- Fade-in on mount ---- */
.fade-in { animation: fadeIn .35s ease both; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
