/* Project-specific styles keep the existing site and project card unchanged. */
.pv-main { --pv-body-size: clamp(17px, 1.1vw, 28px); }
.pv-back-link { display: inline-block; color: var(--secondary); font-size: clamp(14px, .9vw, 22px); line-height: 1.6; }
.pv-back-link span { margin-inline: 12px; color: var(--gold); }
.pv-back-link:hover { color: var(--gold-highlight); }
.pv-hero { display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: clamp(24px, 4vw, 100px); margin-block: clamp(30px, 3vw, 76px) clamp(36px, 3vw, 80px); }
.pv-hero-copy .eyebrow { margin-top: clamp(24px, 2vw, 48px); }
.pv-hero h1 { margin-top: 16px; font-size: clamp(52px, 5vw, 144px); line-height: 1.04; letter-spacing: -.025em; }
.pv-tagline { margin-top: 22px; color: var(--gold-highlight); font-family: var(--serif); font-size: clamp(24px, 1.8vw, 48px); line-height: 1.4; }
.pv-hero-art { width: 100%; height: auto; border: 1px solid var(--border); border-radius: 8px; }
.pv-section-nav { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-bottom: clamp(48px, 4vw, 110px); border-block: 1px solid var(--border); }
.pv-section-nav a { display: flex; align-items: center; gap: clamp(12px, 1.4vw, 36px); padding: clamp(22px, 2vw, 48px); font-family: var(--serif); font-size: clamp(21px, 1.6vw, 42px); line-height: 1.25; }
.pv-section-nav a + a { border-left: 1px solid var(--border); }
.pv-section-nav .icon { margin-left: auto; width: clamp(20px, 1.3vw, 32px); color: var(--gold); }
.pv-section-nav a:hover { background: rgb(200 169 107 / 6%); color: var(--gold-highlight); }
.pv-section { display: grid; grid-template-columns: minmax(180px, .6fr) minmax(0, 2fr); gap: clamp(32px, 5vw, 140px); padding-block: clamp(44px, 4vw, 110px); border-top: 1px solid rgb(200 169 107 / 30%); scroll-margin-top: 30px; }
.pv-section-label h2 { max-width: 10em; margin-top: 16px; font-size: clamp(30px, 2.5vw, 64px); line-height: 1.15; }
.pv-prose { max-width: 66ch; font-size: var(--pv-body-size); line-height: 1.85; color: #d2d8e1; overflow-wrap: break-word; }
.pv-prose h3 { margin-bottom: 30px; color: var(--text); font-size: clamp(40px, 3.2vw, 80px); line-height: 1.15; }
.pv-prose p + p { margin-top: 1.3em; }
.pv-prose strong { color: var(--text); }
.pv-prose .pv-principle { margin-block: 1.8em; padding-left: clamp(22px, 2vw, 48px); border-left: 2px solid var(--gold); }
.pv-prose .pv-signoff { margin-top: 2em; padding-top: 1.3em; border-top: 1px solid var(--border); color: var(--gold-highlight); font-family: var(--serif); font-size: 1.3em; }
.pv-demo-panel { position: relative; isolation: isolate; overflow: hidden; padding: clamp(28px, 4vw, 100px); border: 1px solid rgb(200 169 107 / 35%); border-radius: 8px; background: var(--section); }
.pv-demo-art { position: absolute; z-index: -1; inset: 0; opacity: .28; }
.pv-demo-art img { width: 100%; height: 100%; object-fit: cover; object-position: right center; }
.pv-demo-art::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, #101a2e 10%, rgb(16 26 46 / 65%) 60%, transparent); }
.pv-demo-copy { max-width: 40em; }
.pv-demo-copy h3 { margin-block: 18px 22px; font-size: clamp(34px, 2.8vw, 72px); line-height: 1.15; }
.pv-demo-copy > p:not(.eyebrow) { max-width: 42ch; color: #d2d8e1; font-size: var(--pv-body-size); line-height: 1.7; }
.pv-demo-action { margin-top: clamp(26px, 2.5vw, 60px); }
.pv-demo-action:disabled { cursor: not-allowed; background: var(--gold); color: var(--background); border-color: var(--gold); }
.pv-demo-copy > .pv-status { margin-top: 16px; font-size: clamp(14px, .9vw, 22px); color: var(--secondary); }
.pv-section-description { max-width: 48ch; font-size: var(--pv-body-size); line-height: 1.75; color: var(--secondary); }
.pv-future-note { display: flex; align-items: start; gap: clamp(20px, 2vw, 48px); margin-top: 32px; padding: clamp(28px, 3vw, 72px); border: 1px solid var(--border); border-radius: 8px; background: rgb(16 26 46 / 65%); }
.pv-future-note > .icon { width: clamp(28px, 2vw, 48px); height: auto; color: var(--gold); }
.pv-future-note h3, .pv-article h3 { font-size: clamp(28px, 2vw, 48px); line-height: 1.2; }
.pv-future-note p, .pv-article p { margin-top: 14px; color: var(--secondary); font-size: var(--pv-body-size); line-height: 1.7; }
.pv-articles { margin-top: 32px; }
.pv-article { padding-block: 28px; border-bottom: 1px solid var(--border); }
.pv-article a:hover { color: var(--gold-highlight); }

@media (max-width: 1099px) {
  .pv-section { grid-template-columns: 1fr; gap: 30px; }
  .pv-section-label h2 { max-width: none; }
  .pv-prose { max-width: 66ch; }
  .pv-section-nav a { padding: 22px 16px; gap: 12px; font-size: 21px; }
}

@media (max-width: 699px) {
  .pv-hero { grid-template-columns: 1fr; gap: 30px; }
  .pv-hero h1 { font-size: clamp(46px, 12vw, 72px); }
  .pv-section-nav { grid-template-columns: 1fr; }
  .pv-section-nav a { padding: 20px 0; }
  .pv-section-nav a + a { border-left: 0; border-top: 1px solid var(--border); }
  .pv-section-label h2 { font-size: 34px; }
  .pv-section { padding-block: 40px; }
  .pv-demo-panel { padding: 26px; }
  .pv-demo-copy h3 { font-size: 36px; }
  .pv-demo-action { width: 100%; padding-inline: 18px; }
  .pv-future-note { padding: 24px; gap: 18px; }
}