:root {
  --yv-ink: #102234;
  --yv-navy: #173b57;
  --yv-teal: #0f7b78;
  --yv-aqua: #42b9ad;
  --yv-gold: #e7a934;
  --yv-mist: #edf5f5;
  --yv-paper: #fbfcfa;
  --yv-white: #ffffff;
  --yv-slate: #667786;
  --yv-radius: 24px;
  --yv-shadow: 0 22px 60px rgba(16, 34, 52, 0.12);
}

html { scroll-behavior: smooth; }
body { overflow-x: hidden; }
a { transition: color .2s ease, opacity .2s ease, transform .2s ease; }
a:hover { color: var(--yv-gold); }

.yv-site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(251, 252, 250, .92);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(16,34,52,.08);
}
.admin-bar .yv-site-header { top: 32px; }
.yv-header-inner { min-height: 78px; }
.yv-header-inner .wp-block-site-title { font-family: Georgia, serif; font-size: 1.15rem; line-height: 1.1; }
.yv-header-inner .wp-block-site-title a { color: var(--yv-ink); }
.yv-header-kicker { margin: 0; color: var(--yv-teal); text-transform: uppercase; letter-spacing: .13em; font-size: .69rem; font-weight: 800; }
.wp-block-navigation .wp-block-navigation__submenu-container { border: 0; box-shadow: var(--yv-shadow); border-radius: 14px; padding: .55rem; min-width: 230px; }

.yv-hero {
  position: relative;
  overflow: hidden;
  min-height: 720px;
  display: flex;
  align-items: center;
  background:
    radial-gradient(circle at 84% 20%, rgba(66,185,173,.24), transparent 28%),
    radial-gradient(circle at 10% 85%, rgba(231,169,52,.16), transparent 25%),
    linear-gradient(135deg, #102234 0%, #173b57 52%, #0f7b78 100%);
}
.yv-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .09;
  background-image: linear-gradient(rgba(255,255,255,.45) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.45) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(to bottom, #000, transparent 88%);
}
.yv-hero > .wp-block-group__inner-container, .yv-hero > * { position: relative; z-index: 2; }
.yv-hero h1, .yv-hero h2, .yv-hero p { color: var(--yv-white); }
.yv-hero h1 { max-width: 10ch; margin-top: .3rem; margin-bottom: 1.4rem; }
.yv-hero .yv-eyebrow { color: #9fe2dc; }
.yv-hero-copy { max-width: 720px; color: rgba(255,255,255,.82) !important; font-size: clamp(1.05rem,1.8vw,1.3rem); }
.yv-hero .wp-block-button.is-style-outline .wp-block-button__link { color: #fff; border-color: rgba(255,255,255,.45); }
.yv-hero .wp-block-button.is-style-outline .wp-block-button__link:hover { background:#fff; color:var(--yv-ink); }

.yv-portrait-stage {
  position: relative;
  min-height: 500px;
  border-radius: 34px;
  border: 1px solid rgba(255,255,255,.2);
  background: linear-gradient(145deg, rgba(255,255,255,.16), rgba(255,255,255,.04));
  box-shadow: 0 35px 90px rgba(0,0,0,.26);
  display: grid;
  place-items: center;
  overflow: hidden;
}
.yv-portrait-stage::before {
  content: "YV";
  font-family: Georgia, serif;
  font-size: clamp(7rem,16vw,13rem);
  font-weight: 700;
  color: rgba(255,255,255,.08);
  line-height: 1;
}
.yv-portrait-stage .yv-photo-instruction { position:absolute; left:1.5rem; right:1.5rem; bottom:1.5rem; padding:1rem 1.15rem; color:#fff; border-radius:15px; background:rgba(16,34,52,.72); backdrop-filter: blur(8px); font-size:.85rem; }

.yv-section { padding-top: clamp(4.5rem,8vw,8rem); padding-bottom: clamp(4.5rem,8vw,8rem); }
.yv-section-tight { padding-top: 3rem; padding-bottom: 3rem; }
.yv-soft-section { background: linear-gradient(135deg, #edf5f5 0%, #fbfcfa 100%); }
.yv-dark-section { background: var(--yv-ink); color: rgba(255,255,255,.82); }
.yv-dark-section h2, .yv-dark-section h3, .yv-dark-section p, .yv-dark-section li { color: inherit; }
.yv-dark-section h2, .yv-dark-section h3 { color:#fff; }
.yv-eyebrow { color: var(--yv-teal); font-size: .78rem; font-weight: 800; text-transform: uppercase; letter-spacing: .15em; margin-bottom:.7rem; }
.yv-lead { color: var(--yv-slate); font-size: clamp(1.1rem,1.8vw,1.32rem); max-width: 760px; }
.yv-section-title { max-width: 760px; margin-bottom: 2.2rem; }

.yv-card-grid { gap: 1.25rem; }
.yv-card {
  height: 100%;
  padding: clamp(1.4rem,3vw,2rem);
  border: 1px solid rgba(16,34,52,.08);
  border-radius: var(--yv-radius);
  background: var(--yv-white);
  box-shadow: 0 12px 38px rgba(16,34,52,.06);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.yv-card:hover { transform: translateY(-5px); box-shadow: var(--yv-shadow); border-color: rgba(15,123,120,.2); }
.yv-card h3 { margin-top:.75rem; font-size: 1.45rem; }
.yv-card p:last-child { margin-bottom:0; }
.yv-card-number { display:inline-flex; width:42px; height:42px; align-items:center; justify-content:center; border-radius:12px; background:var(--yv-mist); color:var(--yv-teal); font-family:monospace; font-size:.78rem; font-weight:800; }
.yv-card-link { font-weight: 750; }

.yv-stat-band { margin-top:-1px; background:#fff; border-bottom:1px solid rgba(16,34,52,.08); }
.yv-stat { padding:2rem 1rem; text-align:center; }
.yv-stat strong { display:block; color:var(--yv-ink); font-family:Georgia,serif; font-size:clamp(2rem,4vw,3.2rem); line-height:1; }
.yv-stat span { display:block; margin-top:.5rem; color:var(--yv-slate); font-size:.85rem; text-transform:uppercase; letter-spacing:.09em; }

.yv-photo-slot {
  min-height: 300px;
  border: 2px dashed rgba(15,123,120,.28);
  border-radius: var(--yv-radius);
  background:
    linear-gradient(135deg, rgba(66,185,173,.08), rgba(231,169,52,.07)),
    repeating-linear-gradient(45deg, transparent, transparent 18px, rgba(16,34,52,.025) 18px, rgba(16,34,52,.025) 19px);
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:2rem;
  color:var(--yv-slate);
}
.yv-photo-slot strong { display:block; color:var(--yv-teal); }
.yv-photo-slot.is-small { min-height:220px; }
.yv-photo-slot.is-wide { min-height:380px; }

.yv-timeline { position:relative; padding-left:2rem; }
.yv-timeline::before { content:""; position:absolute; left:.45rem; top:.45rem; bottom:.45rem; width:2px; background:linear-gradient(var(--yv-teal),var(--yv-gold)); }
.yv-timeline-item { position:relative; margin-bottom:2.2rem; padding-left:1rem; }
.yv-timeline-item::before { content:""; position:absolute; left:-1.95rem; top:.3rem; width:14px; height:14px; border:3px solid #fff; border-radius:50%; background:var(--yv-teal); box-shadow:0 0 0 2px var(--yv-teal); }
.yv-timeline-item h3 { margin-bottom:.25rem; }
.yv-timeline-meta { color:var(--yv-teal); font-size:.82rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }

.yv-project { overflow:hidden; border-radius:var(--yv-radius); background:#fff; border:1px solid rgba(16,34,52,.08); box-shadow:0 12px 38px rgba(16,34,52,.06); }
.yv-project-body { padding:1.6rem; }
.yv-tag-row { display:flex; flex-wrap:wrap; gap:.45rem; margin:.8rem 0 1rem; }
.yv-tag { display:inline-flex; padding:.35rem .7rem; border-radius:999px; background:var(--yv-mist); color:var(--yv-teal); font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.06em; }

.yv-page-hero { padding-top: clamp(4rem,8vw,7rem); padding-bottom: clamp(3rem,6vw,5.5rem); background:linear-gradient(135deg,#edf5f5,#fbfcfa); border-bottom:1px solid rgba(16,34,52,.07); }
.yv-page-hero h1 { margin-bottom:1rem; }
.yv-page-hero .yv-lead { margin-bottom:0; }

.yv-callout { padding:clamp(1.6rem,4vw,3rem); border-radius:var(--yv-radius); background:linear-gradient(135deg,var(--yv-ink),var(--yv-navy)); color:#fff; box-shadow:var(--yv-shadow); }
.yv-callout h2, .yv-callout h3, .yv-callout p { color:#fff; }
.yv-callout p { color:rgba(255,255,255,.8); }

.yv-note { padding:1rem 1.2rem; border-left:4px solid var(--yv-gold); border-radius:0 12px 12px 0; background:#fff8e8; color:#60491c; }
.yv-checklist { list-style:none; padding-left:0; }
.yv-checklist li { position:relative; padding-left:1.65rem; margin-bottom:.65rem; }
.yv-checklist li::before { content:"✓"; position:absolute; left:0; top:0; color:var(--yv-teal); font-weight:900; }

.wp-block-post-template { gap:1.25rem; }
.wp-block-post-template > li { padding:1.5rem; border:1px solid rgba(16,34,52,.08); border-radius:18px; background:#fff; }
.wp-block-post-featured-image img { border-radius:18px; }
.wp-block-query-pagination { margin-top:2rem; }

.yv-site-footer { margin-top:0; padding-top:4.5rem; padding-bottom:2rem; background:var(--yv-ink); color:rgba(255,255,255,.7); }
.yv-site-footer h2, .yv-site-footer h3, .yv-site-footer .wp-block-site-title, .yv-site-footer .wp-block-site-title a { color:#fff; }
.yv-site-footer a { color:#9fe2dc; }
.yv-footer-rule { border-color:rgba(255,255,255,.12); }
.yv-footer-small { font-size:.82rem; color:rgba(255,255,255,.55); }

.yv-js .yv-reveal { opacity:0; transform:translateY(20px); transition:opacity .65s ease,transform .65s ease; }
.yv-js .yv-reveal.is-visible { opacity:1; transform:none; }

@media (max-width: 900px) {
  /*
   * WordPress 7 navigation overlays use a fixed full-screen container.
   * backdrop-filter on a sticky ancestor creates a containing block on
   * mobile WebKit/Chromium and can trap the overlay inside the header.
   */
  .yv-site-header {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }

  .yv-site-header .wp-block-navigation__responsive-container.is-menu-open {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    z-index: 100000 !important;
    background: var(--yv-paper);
    color: var(--yv-ink);
    padding: 1.5rem;
  }

  .yv-site-header .wp-block-navigation__responsive-dialog,
  .yv-site-header .wp-block-navigation__responsive-container-content {
    min-height: 100%;
    max-height: none;
    overflow: visible;
  }

  .yv-hero { min-height:auto; }
  .yv-portrait-stage { min-height:360px; margin-top:1rem; }
}
@media (max-width: 782px) { .admin-bar .yv-site-header { top:46px; } }
@media (max-width: 600px) {
  .yv-header-inner { min-height:68px; }
  .yv-hero { padding-top:4rem !important; padding-bottom:4rem !important; }
  .yv-hero h1 { max-width:12ch; }
  .yv-section { padding-top:4rem; padding-bottom:4rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation-duration:.01ms !important; transition-duration:.01ms !important; }
  .yv-js .yv-reveal { opacity:1; transform:none; }
}
