/*
Document Title: NexoProof Opportunity Intelligence — Landing Page First-Viewport Polish
Document ID: QA-004-WEB-OI-LANDING-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: 1.1.0
Status: Founder pre-promotion presentation candidate

Purpose:
Improve first-viewport readability on the Opportunity Intelligence landing page without changing the
founder-approved commercial message, evidence claims, product identity, or visual system. The product family
is visually distinct from its first Transportation & Infrastructure configuration, and the right-side product
preview remains fully visible instead of clipping its final decision-support row.

Visual authority: 01-docs/brand/. Blue/white remain dominant, gold is restrained, green is not introduced.
*/

/* Product-family hierarchy: Opportunity Intelligence is the family; Transportation & Infrastructure is
   the first product configuration beneath it. Existing source text is retained in HTML for semantics. */
.opportunity-product-page .oi-hero-copy .product-eyebrow{
  font-size:0;
  align-items:flex-start;
}
.opportunity-product-page .oi-hero-copy .product-eyebrow::after{
  content:"NEXOPROOF OPPORTUNITY INTELLIGENCE\A TRANSPORTATION & INFRASTRUCTURE";
  white-space:pre-line;
  font-size:.66rem;
  line-height:1.5;
  letter-spacing:.13em;
  color:var(--np-blue,#0B4EDB);
  font-weight:800;
}

@media (min-width:1081px){
  .opportunity-product-page .oi-hero-grid{
    min-height:calc(100svh - 205px);
    grid-template-columns:minmax(0,.93fr) minmax(430px,1.07fr);
    gap:42px;
    align-items:center;
    padding:34px 0 40px;
  }
  .opportunity-product-page .oi-launch-chip{
    margin-bottom:12px;
    padding:7px 11px;
    font-size:.64rem;
  }
  .opportunity-product-page .oi-hero-copy h1{
    max-width:760px;
    margin:12px 0 16px;
    font-size:clamp(3rem,4.25vw,4.55rem);
    line-height:.965;
    letter-spacing:-.058em;
  }
  .opportunity-product-page .oi-hero-copy>p{
    max-width:660px;
    margin:0;
    font-size:.96rem;
    line-height:1.58;
  }
  .opportunity-product-page .oi-capability-row{
    gap:6px;
    margin:18px 0 20px;
  }
  .opportunity-product-page .oi-capability-row span{
    padding:6px 9px;
    font-size:.64rem;
  }
  .opportunity-product-page .oi-hero-actions{gap:9px}
  .opportunity-product-page .oi-hero-actions .product-primary-cta,
  .opportunity-product-page .oi-hero-actions .product-secondary-cta{
    min-height:44px;
    padding:0 16px;
    font-size:.77rem;
  }
  .opportunity-product-page .oi-evidence-boundary{
    max-width:700px;
    margin-top:14px;
    padding:10px 13px;
    font-size:.68rem;
    line-height:1.45;
  }
  .opportunity-product-page .oi-hero-visual{
    min-height:500px;
    max-height:none;
    padding:22px 24px;
    border-radius:24px;
  }
  .opportunity-product-page .oi-screen-head{padding-bottom:11px}
  .opportunity-product-page .oi-screen-metrics{margin:14px 0}
  .opportunity-product-page .oi-screen-metrics article{padding:15px}
  .opportunity-product-page .oi-screen-metrics article:first-child{min-height:136px}
  .opportunity-product-page .oi-screen-stream{gap:6px}
  .opportunity-product-page .oi-screen-stream>div{padding:8px 10px}
  .opportunity-product-page .oi-screen-foot{margin-top:10px;padding-top:10px}
}

@media (min-width:1081px) and (max-height:860px){
  .opportunity-product-page .oi-hero-grid{
    min-height:auto;
    padding:26px 0 32px;
  }
  .opportunity-product-page .oi-hero-copy h1{
    font-size:clamp(2.7rem,3.85vw,4rem);
    margin:10px 0 13px;
  }
  .opportunity-product-page .oi-hero-copy>p{font-size:.9rem;line-height:1.5}
  .opportunity-product-page .oi-capability-row{margin:14px 0 16px}
  .opportunity-product-page .oi-evidence-boundary{margin-top:11px;padding:9px 12px}
  .opportunity-product-page .oi-hero-visual{
    min-height:475px;
    max-height:none;
    padding:18px 20px;
  }
  .opportunity-product-page .oi-screen-head{padding-bottom:9px}
  .opportunity-product-page .oi-screen-metrics{margin:10px 0}
  .opportunity-product-page .oi-screen-metrics article{padding:12px}
  .opportunity-product-page .oi-screen-metrics article:first-child{min-height:112px}
  .opportunity-product-page .oi-screen-stream{gap:5px}
  .opportunity-product-page .oi-screen-stream>div{padding:7px 9px}
  .opportunity-product-page .oi-screen-stream>div b{font-size:.8rem}
  .opportunity-product-page .oi-screen-stream>div small{font-size:.6rem}
  .opportunity-product-page .oi-screen-foot{margin-top:8px;padding-top:8px}
}

@media (min-width:721px) and (max-width:1080px){
  .opportunity-product-page .oi-hero-grid{padding:38px 0 46px;gap:30px}
  .opportunity-product-page .oi-hero-copy h1{font-size:clamp(3rem,7vw,4.6rem);margin:12px 0 17px}
  .opportunity-product-page .oi-hero-copy>p{font-size:1rem;line-height:1.6}
  .opportunity-product-page .oi-hero-visual{max-height:none}
}

@media (max-width:720px){
  .opportunity-product-page .oi-hero-grid{padding:34px 0 42px}
  .opportunity-product-page .oi-launch-chip{margin-bottom:12px;font-size:.61rem}
  .opportunity-product-page .oi-hero-copy .product-eyebrow::after{font-size:.61rem;line-height:1.45}
  .opportunity-product-page .oi-hero-copy h1{margin:12px 0 16px;font-size:clamp(2.45rem,12vw,3.25rem);line-height:.98;letter-spacing:-.052em}
  .opportunity-product-page .oi-hero-copy>p{font-size:.94rem;line-height:1.58}
  .opportunity-product-page .oi-capability-row{margin:18px 0}
  .opportunity-product-page .oi-evidence-boundary{margin-top:14px}
  .opportunity-product-page .oi-hero-visual{max-height:none}
}
