.opc-page{ background: var(--foam-050); }
.opc-page .site-header{ background: rgba(7,28,46,.95); }
.opc-page .main-nav{ gap: 24px; }

.opc-detail-hero{
  position: relative; overflow: hidden;
  min-height: 760px; padding: 170px 0 110px;
  display: flex; align-items: center; text-align: center;
  color: var(--foam-100);
  background:
    radial-gradient(circle at 50% 15%, rgba(74,143,194,.35), transparent 40%),
    linear-gradient(155deg,var(--navy-950),var(--navy-800) 64%,var(--navy-700));
}
.opc-detail-hero-inner{ position: relative; z-index: 1; max-width: 900px; }
.opc-detail-monogram{
  width: 104px; height: 104px; margin: 0 auto 28px;
  display: grid; place-items: center; border: 2px solid var(--gold-400); border-radius: 50%;
  box-shadow: inset 0 0 0 7px var(--navy-900), 0 0 45px rgba(232,185,92,.13);
  color: var(--gold-300); font: 700 2rem/1 var(--font-serif);
}
.opc-detail-hero h1{ margin-top: 14px; color: #fff; font: 700 clamp(2.75rem,7vw,5.5rem)/1.08 var(--font-serif); letter-spacing: -.035em; }
.opc-detail-lead{ max-width: 720px; margin: 28px auto 0; color: #c2d9e9; font-size: 1.16rem; }
.opc-stage{ max-width: 740px; margin: 34px auto 0; padding: 14px 18px; border: 1px solid rgba(232,185,92,.3); border-radius: 12px; background: rgba(232,185,92,.08); color: var(--blue-300); font-size: .84rem; }
.opc-stage strong{ color: var(--gold-300); }

.opc-claim-band{ padding: 34px 0; background: var(--gold-400); color: var(--navy-950); }
.opc-claim-band p{ max-width: 900px; margin: auto; text-align: center; font: 700 1.16rem/1.65 var(--font-serif); }

.opc-content-section,.opc-roadmap-section,.opc-manifesto-section{ padding: 110px 0; }
.opc-section-kicker{ margin-bottom: 10px; color: var(--gold-600); font-size: .76rem; font-weight: 800; letter-spacing: .18em; }
.opc-section-title{ max-width: 820px; color: var(--navy-900); font: 700 clamp(2rem,4.6vw,3.25rem)/1.18 var(--font-serif); letter-spacing: -.02em; }
.opc-section-title--light{ color: #fff; }
.opc-section-intro{ max-width: 820px; margin-top: 22px; color: var(--ink-500); font-size: 1rem; }

.opc-value-grid{ display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; margin-top: 46px; }
.opc-value-card{ position: relative; min-height: 190px; padding: 28px; border: 1px solid rgba(11,39,64,.09); border-radius: 16px; background: #fff; box-shadow: 0 16px 34px -30px rgba(7,28,46,.7); }
.opc-value-card > span{ display: block; margin-bottom: 26px; color: var(--gold-600); font: 700 .75rem/1 var(--font-base); letter-spacing: .12em; }
.opc-value-card h3{ color: var(--navy-900); font-size: 1.06rem; }
.opc-value-card p{ margin-top: 8px; color: var(--ink-500); font-size: .88rem; }

.opc-model-section{ position: relative; overflow: hidden; padding: 92px 0; color: var(--foam-100); background: var(--navy-900); }
.opc-model-section .section-inner{ position: relative; z-index: 1; }
.opc-loop{ display: grid; grid-template-columns: 1fr auto 1fr auto 1.25fr auto 1fr auto 1.25fr; align-items: center; gap: 12px; margin-top: 44px; }
.opc-loop div{ min-height: 104px; padding: 22px 14px; display: grid; place-items: center; border: 1px solid rgba(127,178,217,.25); border-radius: 13px; background: rgba(234,244,251,.055); text-align: center; color: #fff; font-size: .84rem; line-height: 1.45; }
.opc-loop > span{ color: var(--gold-400); font-size: 1.25rem; }

.opc-architecture-section{ background: #fff; }
.opc-layers{ display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 48px; }
.opc-layers article{ display: flex; gap: 18px; padding: 24px; border-radius: 14px; background: var(--foam-050); border: 1px solid rgba(11,39,64,.08); }
.opc-layers article > span{ flex: none; width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; background: var(--navy-800); color: var(--gold-300); font-size: .72rem; font-weight: 800; }
.opc-layers h3,.opc-capability-grid h3{ color: var(--navy-900); font-size: 1rem; }
.opc-layers p,.opc-capability-grid p{ margin-top: 5px; color: var(--ink-500); font-size: .84rem; }
.opc-subheading{ margin: 72px 0 24px; color: var(--navy-900); font: 700 1.55rem/1.3 var(--font-serif); }
.opc-capability-grid{ display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.opc-capability-grid article{ padding: 24px; border-left: 3px solid var(--gold-400); background: var(--foam-050); }

.opc-roadmap-section{ background: var(--foam-100); }
.opc-roadmap{ position: relative; margin-top: 48px; }
.opc-roadmap:before{ content:""; position: absolute; left: 24px; top: 20px; bottom: 20px; width: 1px; background: rgba(74,143,194,.35); }
.opc-roadmap article{ position: relative; display: grid; grid-template-columns: 50px 1fr; gap: 24px; padding: 18px 0; }
.opc-roadmap article > span{ position: relative; z-index: 1; width: 50px; height: 50px; display: grid; place-items: center; border-radius: 50%; background: var(--navy-800); color: var(--gold-300); font-weight: 800; }
.opc-roadmap h3{ color: var(--navy-900); font-size: 1.05rem; }
.opc-roadmap p{ margin-top: 5px; color: var(--ink-500); font-size: .9rem; }

.opc-boundaries-section{ padding: 100px 0; color: var(--foam-100); background: linear-gradient(145deg,var(--navy-950),var(--navy-800)); }
.opc-boundaries-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: start; }
.opc-boundaries-grid > div:first-child > p:last-child{ margin-top: 22px; color: var(--blue-300); }
.opc-risk-card{ padding: 32px; border: 1px solid rgba(232,185,92,.3); border-radius: 18px; background: rgba(232,185,92,.07); }
.opc-risk-card h3{ color: var(--gold-300); font: 700 1.3rem/1.3 var(--font-serif); }
.opc-risk-card ul{ margin: 18px 0 0; padding-left: 1.2rem; color: #c2d9e9; }
.opc-risk-card li{ margin-bottom: 9px; }

.opc-manifesto-section{ text-align: center; }
.opc-manifesto-section .opc-section-title{ margin-left: auto; margin-right: auto; }
.opc-manifesto{ max-width: 820px; margin: 34px auto 0; color: var(--ink-700); font: 400 1.05rem/1.9 var(--font-serif); }
.opc-manifesto p + p{ margin-top: 18px; }
.opc-detail-cta{ max-width: 760px; margin: 64px auto 0; padding: 42px 34px; border-radius: 20px; color: var(--foam-100); background: var(--navy-900); }
.opc-detail-cta h3{ color: #fff; font: 700 1.7rem/1.3 var(--font-serif); }
.opc-detail-cta p{ margin: 12px auto 24px; color: var(--blue-300); }

@media(max-width:900px){
  .opc-value-grid,.opc-capability-grid{ grid-template-columns: 1fr 1fr; }
  .opc-loop{ grid-template-columns: 1fr; }
  .opc-loop > span{ transform: rotate(90deg); text-align: center; }
}

@media(max-width:720px){
  .opc-page .main-nav.open{ max-height: 440px; }
  .opc-detail-hero{ min-height: 0; padding: 132px 0 82px; }
  .opc-detail-hero h1{ font-size: 2.65rem; }
  .opc-detail-lead{ font-size: 1rem; }
  .opc-content-section,.opc-roadmap-section,.opc-manifesto-section{ padding: 76px 0; }
  .opc-value-grid,.opc-capability-grid,.opc-layers,.opc-boundaries-grid{ grid-template-columns: 1fr; }
  .opc-boundaries-grid{ gap: 36px; }
  .opc-value-card{ min-height: 0; }
  .opc-detail-cta{ padding: 34px 24px; }
}