/*
Document Title: NexoProof Opportunity Intelligence — Public Product Page Expansion Styles
Document ID: QA-004-WEB-OI-001
Artifact Type: Public Website Stylesheet
Classification: PUBLIC
Disclosure Status: Public product presentation only; contains no customer data or protected CORE IP
Owner: NexoProof Intelligence
Related Work Item: QA-004 / Issue #200 / Draft PR #201
Version: 5.0.1
Status: Founder pre-promotion product-page candidate

Visual authority: 01-docs/brand/. Blue/white dominate, gold is a restrained premium accent,
and green is reserved for explicitly verified/validated states.
*/
.opportunity-product-page{--np-blue:#0B4EDB;--np-deep:#0A3D91;--np-night:#04142F;--np-gold:#D4A42C;--np-ink:#111827;--np-steel:#6B7280;--np-line:#E5EAF1;--np-light:#F5F7FA;--np-white:#FFFFFF}
.oi-launch-chip{display:inline-flex;align-items:center;gap:9px;margin:0 0 18px;padding:8px 12px;border:1px solid #cad8ef;border-radius:999px;background:#f7faff;color:var(--np-deep);font-size:.69rem;font-weight:850;letter-spacing:.07em;text-transform:uppercase}.oi-launch-chip::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--np-gold)}
.oi-evidence-boundary{margin-top:18px;padding:13px 15px;border-left:3px solid var(--np-gold);border-radius:0 10px 10px 0;background:#fffaf0;color:#65551f;font-size:.76rem;line-height:1.55}
.oi-coverage{padding:96px 0;background:linear-gradient(180deg,#f7faff 0,#fff 100%);border-top:1px solid var(--np-line);border-bottom:1px solid var(--np-line)}.oi-coverage-heading{display:grid;grid-template-columns:1.08fr .92fr;gap:64px;align-items:end;margin:16px 0 38px}.oi-coverage-heading h2,.oi-preview-heading h2,.oi-license-heading h2{margin:0;color:var(--np-night);font-size:clamp(2.6rem,4.8vw,4.7rem);line-height:1.02;letter-spacing:-.045em}.oi-coverage-heading p,.oi-preview-heading p,.oi-license-heading p{margin:0;color:var(--np-steel);font-size:1rem;line-height:1.72}
.oi-coverage-track{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;position:relative;margin-top:34px}.oi-coverage-track::before{content:"";position:absolute;left:9%;right:9%;top:39px;height:2px;background:linear-gradient(90deg,var(--np-blue),#7fa8f0,var(--np-gold))}.oi-coverage-step{position:relative;padding:0 18px;text-align:center}.oi-coverage-node{position:relative;z-index:2;width:78px;height:78px;margin:0 auto 18px;display:grid;place-items:center;border:7px solid #f7faff;border-radius:50%;background:linear-gradient(145deg,var(--np-blue),var(--np-deep));box-shadow:0 11px 27px rgba(11,78,219,.18);color:#fff;font:800 1.32rem/1 "Space Grotesk","Inter",sans-serif}.oi-coverage-step:nth-child(4) .oi-coverage-node{background:linear-gradient(145deg,#d9b342,var(--np-gold));color:#17191d}.oi-coverage-step strong{display:block;color:var(--np-night);font:750 1.03rem/1.25 "Space Grotesk","Inter",sans-serif}.oi-coverage-step p{max-width:250px;margin:8px auto 0;color:var(--np-steel);font-size:.77rem;line-height:1.52}.oi-coverage-floor{margin-top:34px;padding:18px 20px;border:1px solid #d8e3f1;border-radius:14px;background:#fff;color:#617087;font-size:.78rem;line-height:1.6}.oi-coverage-floor strong{color:var(--np-night)}
.oi-preview{padding:102px 0;background:#fff}.oi-preview-heading{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:end;margin:16px 0 38px}.oi-preview-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.oi-intel-preview{position:relative;min-height:340px;overflow:hidden;border:1px solid #dfe7f1;border-radius:22px;background:#fff;box-shadow:0 22px 55px rgba(6,27,66,.08)}.oi-intel-preview>header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 20px;border-bottom:1px solid #e7edf5;background:#fbfdff}.oi-intel-preview>header span{color:var(--np-blue);font-size:.62rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase}.oi-intel-preview>header b{color:#607089;font-size:.62rem}.oi-intel-body{padding:20px}.oi-mini-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.oi-mini-kpis div{padding:14px;border:1px solid #e1e8f1;border-radius:12px;background:#f9fbfe}.oi-mini-kpis small{display:block;color:#738198;font-size:.54rem;font-weight:850;text-transform:uppercase;letter-spacing:.06em}.oi-mini-kpis strong{display:block;margin-top:5px;color:var(--np-night);font:800 1.22rem/1 "Space Grotesk","Inter",sans-serif}.oi-mini-bars{height:124px;margin-top:19px;display:flex;align-items:end;gap:9px;padding:0 8px 22px;border-bottom:1px solid #dce5ef}.oi-mini-bars i{flex:1;min-width:14px;border-radius:7px 7px 2px 2px;background:linear-gradient(180deg,#3a77ec,var(--np-blue));opacity:.94}.oi-mini-bars i:nth-child(1){height:37%}.oi-mini-bars i:nth-child(2){height:63%}.oi-mini-bars i:nth-child(3){height:82%}.oi-mini-bars i:nth-child(4){height:54%}.oi-mini-bars i:nth-child(5){height:91%}.oi-mini-bars i:nth-child(6){height:69%}.oi-mini-caption{margin-top:11px;color:#687890;font-size:.68rem;line-height:1.5}
.oi-mini-map{position:relative;height:224px;border:1px solid #dde6f0;border-radius:15px;background:linear-gradient(135deg,#edf4fb,#f9fbfe);overflow:hidden}.oi-mini-map::before,.oi-mini-map::after{content:"";position:absolute;inset:0;background-image:linear-gradient(#dbe5ef 1px,transparent 1px),linear-gradient(90deg,#dbe5ef 1px,transparent 1px);background-size:38px 38px;opacity:.5}.oi-mini-map::after{inset:23px 29px;background:none;border:2px solid #b9cae0;border-radius:42% 58% 55% 45%/37% 45% 55% 63%;transform:rotate(-5deg);opacity:.85}.oi-map-dot{position:absolute;z-index:2;width:10px;height:10px;border:3px solid #fff;border-radius:50%;background:var(--np-blue);box-shadow:0 3px 10px rgba(11,78,219,.28)}.oi-map-dot.d1{left:31%;top:30%}.oi-map-dot.d2{left:49%;top:38%}.oi-map-dot.d3{left:58%;top:55%}.oi-map-dot.d4{left:41%;top:66%}.oi-map-dot.d5{left:68%;top:31%}.oi-map-legend{position:absolute;z-index:3;right:12px;bottom:12px;padding:8px 10px;border-radius:9px;background:#fffffff2;box-shadow:0 7px 18px rgba(6,27,66,.12);color:#53647b;font-size:.58rem;font-weight:800}
.oi-pursuit-mini{display:grid;grid-template-columns:1.05fr .95fr;gap:12px}.oi-pursuit-list{display:grid;gap:7px}.oi-pursuit-row{display:grid;grid-template-columns:1fr auto;gap:8px;padding:11px;border:1px solid #e0e8f2;border-radius:11px;background:#fbfdff}.oi-pursuit-row.is-active{border-left:3px solid var(--np-blue);background:#f4f8ff}.oi-pursuit-row strong{font-size:.7rem;color:var(--np-night)}.oi-pursuit-row small{display:block;margin-top:4px;color:#78869a;font-size:.56rem}.oi-fit{align-self:center;padding:5px 7px;border:1px solid #b9ccef;border-radius:999px;background:#eef4ff;color:var(--np-deep);font-size:.54rem;font-weight:900}.oi-pursuit-detail{padding:14px;border:1px solid #d7e2ef;border-radius:12px;background:#f8fbff}.oi-pursuit-detail span{font-size:.55rem;font-weight:900;letter-spacing:.08em;color:var(--np-blue);text-transform:uppercase}.oi-pursuit-detail h3{margin:7px 0 12px;color:var(--np-night);font-size:1rem}.oi-pursuit-detail dl{margin:0;display:grid;gap:9px}.oi-pursuit-detail div{padding-top:8px;border-top:1px solid #e0e8f2}.oi-pursuit-detail dt{font-size:.51rem;font-weight:850;color:#7b8798;text-transform:uppercase}.oi-pursuit-detail dd{margin:3px 0 0;color:var(--np-night);font-size:.67rem;font-weight:800}
.oi-artifact-sheet{min-height:228px;padding:20px;border:1px solid #d8e1ec;border-radius:14px;background:#fff;box-shadow:0 13px 32px rgba(6,27,66,.07)}.oi-artifact-top{display:flex;justify-content:space-between;gap:18px;padding-bottom:12px;border-bottom:2px solid var(--np-blue)}.oi-artifact-top strong{color:var(--np-night);font-size:.9rem}.oi-artifact-top span{color:var(--np-blue);font-size:.55rem;font-weight:900;letter-spacing:.08em}.oi-artifact-sections{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:15px}.oi-artifact-sections div{min-height:112px;padding:11px;border-radius:10px;background:#f7f9fc}.oi-artifact-sections strong{display:block;color:var(--np-deep);font-size:.59rem;text-transform:uppercase;letter-spacing:.06em}.oi-artifact-sections i{display:block;height:5px;margin-top:10px;border-radius:99px;background:#d8e2ef}.oi-artifact-sections i:nth-of-type(2){width:83%}.oi-artifact-sections i:nth-of-type(3){width:66%}.oi-preview-disclaimer{margin-top:20px;color:#7b8798;font-size:.72rem;line-height:1.55}
.oi-license{padding:100px 0;background:var(--np-night);color:#fff}.oi-license .product-eyebrow{color:#93b9fb}.oi-license-heading{display:grid;grid-template-columns:1fr .85fr;gap:70px;align-items:end;margin:16px 0 38px}.oi-license-heading h2{color:#fff}.oi-license-heading p{color:#c9d7eb}.oi-license-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:20px}.oi-license-claim{padding:34px;border:1px solid #ffffff1c;border-radius:22px;background:linear-gradient(145deg,#092555,#0a3d71)}.oi-license-claim span{color:#f1d372;font-size:.64rem;font-weight:900;letter-spacing:.13em}.oi-license-claim strong{display:block;margin:14px 0 12px;font:750 clamp(2rem,3.7vw,3.6rem)/1.05 "Space Grotesk","Inter",sans-serif}.oi-license-claim p{margin:0;color:#cbd9ed;line-height:1.65}.oi-license-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:25px}.oi-license-note{padding:30px;border:1px solid #ffffff1c;border-radius:22px;background:#ffffff0c}.oi-license-note h3{margin:0 0 16px;color:#fff;font-size:1.25rem}.oi-license-note ul{margin:0;padding-left:19px;color:#cbd9ed}.oi-license-note li{margin:0 0 11px;line-height:1.55;font-size:.83rem}.oi-license-note b{color:#fff}
@media(max-width:1000px){.oi-coverage-heading,.oi-preview-heading,.oi-license-heading,.oi-license-grid{grid-template-columns:1fr;gap:20px}.oi-coverage-track{grid-template-columns:repeat(2,1fr);gap:30px 0}.oi-coverage-track::before{display:none}.oi-preview-grid{grid-template-columns:1fr}}
@media(max-width:650px){.oi-coverage,.oi-preview,.oi-license{padding:68px 0}.oi-coverage-track{grid-template-columns:1fr}.oi-preview-grid{gap:13px}.oi-mini-kpis,.oi-artifact-sections{grid-template-columns:1fr}.oi-pursuit-mini{grid-template-columns:1fr}.oi-intel-preview{min-height:auto}.oi-license-claim,.oi-license-note{padding:24px}}

/* QA-004 founder first-fold readability correction.
   Keep the first desktop viewport legible and decision-oriented instead of poster-sized. */
@media(min-width:1081px){
  .opportunity-product-page .oi-hero-grid{min-height:548px;grid-template-columns:1.04fr .96fr;gap:42px;padding:38px 0 44px}
  .opportunity-product-page .oi-hero-copy h1{max-width:700px;margin:11px 0 15px;font-size:clamp(2.7rem,3.75vw,4.15rem);line-height:1.01;letter-spacing:-.052em}
  .opportunity-product-page .oi-hero-copy>p{max-width:650px;margin:0;font-size:.98rem;line-height:1.62}
  .opportunity-product-page .oi-launch-chip{margin-bottom:13px;padding:7px 11px;font-size:.64rem}
  .opportunity-product-page .product-eyebrow{font-size:.67rem;letter-spacing:.13em}
  .opportunity-product-page .oi-capability-row{gap:6px;margin:17px 0 20px}
  .opportunity-product-page .oi-capability-row span{padding:6px 9px;font-size:.66rem}
  .opportunity-product-page .oi-hero-actions .product-primary-cta,.opportunity-product-page .oi-hero-actions .product-secondary-cta{min-height:43px;padding:0 15px;font-size:.76rem}
  .opportunity-product-page .oi-evidence-boundary{max-width:650px;margin-top:13px;padding:10px 13px;font-size:.69rem;line-height:1.48}
  .opportunity-product-page .oi-hero-visual{min-height:438px;border-radius:22px}
}
@media(min-width:721px) and (max-width:1080px){
  .opportunity-product-page .oi-hero-grid{min-height:auto;padding:38px 0 46px;gap:28px}
  .opportunity-product-page .oi-hero-copy h1{margin:11px 0 15px;font-size:clamp(2.7rem,6vw,3.7rem);line-height:1.02;letter-spacing:-.05em}
  .opportunity-product-page .oi-hero-copy>p{font-size:.98rem;line-height:1.62}
  .opportunity-product-page .oi-capability-row{margin:18px 0 21px}
  .opportunity-product-page .oi-hero-visual{min-height:390px}
}
@media(max-width:720px){
  .opportunity-product-page .oi-hero-grid{padding:34px 0 40px}
  .opportunity-product-page .oi-hero-copy h1{margin:10px 0 14px;font-size:clamp(2.25rem,11vw,2.85rem);line-height:1.02;letter-spacing:-.045em}
  .opportunity-product-page .oi-hero-copy>p{font-size:.94rem;line-height:1.58}
  .opportunity-product-page .oi-launch-chip{margin-bottom:12px;font-size:.61rem}
  .opportunity-product-page .oi-capability-row{margin:17px 0 20px}
  .opportunity-product-page .oi-evidence-boundary{margin-top:13px;font-size:.69rem}
  .opportunity-product-page .oi-hero-visual{min-height:300px}
}