html { scroll-behavior: smooth; }
  body { font-family: 'Inter', sans-serif; background: #0B0B0F; color: #F7F4EE; }
  .font-display { font-family: 'Playfair Display', serif; }

  /* Hero video bg */
  .hero { position: relative; overflow: hidden; }
  .hero-video {
    position: absolute; inset: 0; width: 100%; height: 100%;
    object-fit: cover; z-index: 0;
  }
  .hero-overlay {
    position: absolute; inset: 0; z-index: 1;
    background: linear-gradient(180deg, rgba(11,11,15,.65) 0%, rgba(11,11,15,.75) 50%, #0B0B0F 100%);
  }
  .hero > .hero-content { position: relative; z-index: 2; }

  /* Marquee */
  @keyframes marquee { from {transform: translateX(0)} to {transform: translateX(-50%)} }
  .marquee-track { animation: marquee 40s linear infinite; }

  /* Card hover */
  .card { transition: transform .5s ease, box-shadow .5s ease; }
  .card:hover { transform: translateY(-6px); }
  .card .thumb img { transition: transform .8s ease; }
  .card:hover .thumb img { transform: scale(1.08); }

  /* Carousel */
  .scroll-row { scroll-snap-type: x mandatory; scroll-behavior: smooth; -ms-overflow-style: none; scrollbar-width: none; }
  .scroll-row::-webkit-scrollbar { display: none; }
  .scroll-row > * { scroll-snap-align: start; }

  .divider { width: 60px; height: 2px; background: #DC143C; }

  /* Story Map */
  .map-wrap { position: relative; }
  .map-pin {
    position: absolute; transform: translate(-50%, -100%);
    cursor: pointer; z-index: 5;
  }
  .map-pin .dot {
    display: block;
    width: 18px; height: 18px; border-radius: 9999px;
    background: #DC143C; border: 3px solid #fff;
    box-shadow: 0 4px 14px rgba(220,20,60,.6);
    position: relative;
  }
  .map-pin .dot::after {
    content:''; position:absolute; inset:-3px; border-radius:9999px;
    border: 2px solid #DC143C; animation: ping 2s infinite;
  }
  @keyframes ping { 0%{transform:scale(1);opacity:.8} 80%,100%{transform:scale(2.5);opacity:0} }
  .map-pin .label {
    position: absolute; bottom: calc(100% + 10px); left: 50%; transform: translateX(-50%);
    background: #fff; color: #0B0B0F; padding: 6px 12px; border-radius: 9999px;
    font-size: 11px; font-weight: 600; white-space: nowrap;
    opacity: 0; pointer-events: none; transition: all .3s;
    box-shadow: 0 8px 24px rgba(0,0,0,.4);
  }
  .map-pin:hover .label { opacity: 1; transform: translateX(-50%) translateY(-4px); }

  /* Nav blur */
  .nav-scrolled { background: rgba(11,11,15,.85); backdrop-filter: blur(12px); border-bottom: 1px solid rgba(255,255,255,.06); }

  .play-btn {
    width: 64px; height: 64px; border-radius: 9999px;
    background: rgba(220,20,60,.95); color:#fff; display:flex; align-items:center; justify-content:center;
    box-shadow: 0 10px 40px rgba(220,20,60,.5);
  }
  .reveal { opacity:0; transform: translateY(24px); transition: opacity .9s ease, transform .9s ease; }
  .reveal.in { opacity:1; transform:none; }

  /* Blog card */
  .blog-card { background: #15151B; border: 1px solid rgba(255,255,255,.06); border-radius: 16px; overflow: hidden; transition: all .4s ease; }
  .blog-card:hover { border-color: rgba(220,20,60,.4); transform: translateY(-4px); }

  /* Label tag (eyebrow) */
  .label-tag { font-size: 10px; letter-spacing: 0.3em; text-transform: uppercase; color: #C9A96E; font-family: 'Inter', sans-serif; }

  /* Page hero overlay utility */
  .page-hero-overlay { background: linear-gradient(180deg, rgba(11,11,15,.6) 0%, rgba(11,11,15,.92) 70%, #0B0B0F 100%); }

  /* Active nav link */
  .nav-active { color: #DC143C !important; }

  /* Dropdown Styles */
  .dropdown { position: relative; }
  .dropdown-menu {
    position: absolute; top: 100%; left: 0; min-width: 220px;
    background: #15151B; border: 1px solid rgba(255,255,255,.1);
    border-radius: 12px; padding: 12px 0;
    opacity: 0; transform: translateY(10px); pointer-events: none;
    transition: all .3s ease; z-index: 100;
    box-shadow: 0 15px 40px rgba(0,0,0,0.6);
  }
  .dropdown:hover .dropdown-menu {
    opacity: 1; transform: translateY(0); pointer-events: all;
  }
  .dropdown-item {
    display: block; padding: 10px 24px; color: rgba(255,255,255,.7);
    font-size: 13px; font-weight: 500; transition: all .2s;
  }
  .dropdown-item:hover { background: rgba(255,255,255,.05); color: #DC143C; }
  .dropdown-item.nav-active { background: rgba(220,20,60,.05); }

  /* About page specific */
  .mvv-card { transition: transform .4s ease, border-color .4s ease; }
  .mvv-card:hover { transform: translateY(-4px); }
  .award-item { transition: transform .3s ease, border-color .3s ease; }
  .award-item:hover { transform: translateY(-3px); }