/* ════════════════════════════════════════════════════════════════════
   NYWD PILLAR / LANDING PAGES — distinct body layouts (P1–P7)
   Loads AFTER style.css + nywd-chrome.css + blog-styles.css.
   Reuses shared helpers: .b2-cta, .b2-faq, .btn-pill, .img-slot, .more-news
   ════════════════════════════════════════════════════════════════════ */

/* ───────── SHARED PILLAR HELPERS (.pg-*) ───────── */
.pg-shell { background: #fff; }
.pg-wrap { max-width: 74rem; margin: 0 auto; padding: 0 clamp(1.25rem, 4vw, 2.5rem); }
.pg-narrow { max-width: 52rem; }

.pg-eyebrow {
    font-family: var(--font-secondary);
    font-size: 0.7rem;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--nywd-green);
    font-weight: 700;
    margin-bottom: 1rem;
}
.pg-section { padding: clamp(3rem, 6vw, 5rem) 0; }
.pg-section--tight { padding: clamp(2rem, 4vw, 3.25rem) 0; }

.pg-prose p {
    font-family: var(--font-secondary);
    font-size: 1.0625rem;
    line-height: 1.8;
    color: hsl(210, 9%, 26%);
}
.pg-prose p + p { margin-top: 1.25rem; }
.pg-prose strong { font-weight: 600; color: var(--color-contrast-high); }

.pg-h2 {
    font-family: var(--font-primary);
    font-weight: 500;
    font-size: clamp(1.75rem, 3.4vw, 2.75rem);
    line-height: 1.12;
    letter-spacing: -0.01em;
    color: var(--color-contrast-high);
    text-wrap: balance;
}
.pg-h2 em { font-style: italic; color: var(--nywd-green); font-weight: 400; }

/* ════════════════════════════════════════════════════════════════════
   P1 — VERSUS  (Off-Price vs Authorized Eyewear Distribution)
   Head-to-head split panels + numbered showdown rounds
   ════════════════════════════════════════════════════════════════════ */
.p1-hero {
    background: linear-gradient(160deg, #23272c 0%, #2f353c 100%);
    color: #fff;
    position: relative;
    overflow: hidden;
}
.p1-hero__inner {
    max-width: 74rem;
    margin: 0 auto;
    padding: clamp(2.5rem, 5vw, 4rem) clamp(1.25rem, 4vw, 2.5rem);
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr 0.6fr;
    gap: clamp(2rem, 5vw, 4.5rem);
    align-items: center;
}
.p1-hero__media { align-self: stretch; }
.p1-hero__media img {
    width: 100%; height: 100%; min-height: 400px;
    object-fit: cover; object-position: 55% 18%;
    display: block;
}
@media (max-width: 860px) {
    .p1-hero__inner { grid-template-columns: 1fr; gap: 2rem; }
    .p1-hero__media img { min-height: 0; aspect-ratio: 4 / 3; }
}
.p1-hero__strap {
    font-family: var(--font-secondary);
    font-size: 0.7rem;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: var(--nywd-green);
    font-weight: 700;
    margin-bottom: 1.5rem;
}
.p1-hero h1 {
    font-family: var(--font-primary);
    font-weight: 500;
    font-size: clamp(2.2rem, 5.2vw, 4rem);
    line-height: 1.08;
    letter-spacing: -0.015em;
    color: #fff;
    max-width: 18ch;
    text-wrap: balance;
}
.p1-hero h1 em { font-style: italic; color: #79c3c2; font-weight: 400; }
.p1-hero__sub {
    font-family: var(--font-secondary);
    font-size: clamp(1.0625rem, 1.6vw, 1.25rem);
    line-height: 1.7;
    color: rgba(255,255,255,0.74);
    max-width: 54ch;
    margin-top: 1.5rem;
}
.p1-hero__note {
    margin-top: 1.75rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(255,255,255,0.14);
    font-family: var(--font-secondary);
    font-size: 0.95rem;
    line-height: 1.7;
    color: rgba(255,255,255,0.6);
    max-width: 56ch;
}
.p1-hero__note strong { color: #fff; font-weight: 600; }

/* Versus panels */
.p1-versus {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    max-width: 74rem;
    margin: clamp(2.5rem, 5vw, 4rem) auto 0;
    border: 1px solid hsl(210, 8%, 88%);
}
.p1-panel { padding: clamp(2rem, 3.5vw, 3rem); }
.p1-panel--auth { background: #f3f4f5; }
.p1-panel--off {
    background: var(--nywd-accent-soft);
    border-left: 1px solid hsl(210, 8%, 88%);
    box-shadow: inset 4px 0 0 var(--nywd-green);
}
.p1-panel__tag {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-family: var(--font-secondary);
    font-size: 0.66rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-weight: 700;
    padding: 0.35rem 0.7rem;
    border-radius: 999px;
    margin-bottom: 1.25rem;
}
.p1-panel--auth .p1-panel__tag { background: #e0e3e6; color: #4a525c; }
.p1-panel--off .p1-panel__tag { background: var(--nywd-green); color: #fff; }
.p1-panel h2 {
    font-family: var(--font-primary);
    font-weight: 500;
    font-size: clamp(1.4rem, 2.4vw, 1.9rem);
    line-height: 1.18;
    color: var(--color-contrast-high);
    margin-bottom: 0.75rem;
}
.p1-panel > p {
    font-family: var(--font-secondary);
    font-size: 1rem;
    line-height: 1.7;
    color: hsl(210, 9%, 30%);
    margin-bottom: 1.25rem;
}
.p1-panel__lead {
    font-size: 0.7rem !important;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--color-contrast-medium) !important;
    margin-bottom: 0.875rem !important;
}
.p1-list { display: flex; flex-direction: column; gap: 0.875rem; }
.p1-list li {
    position: relative;
    padding-left: 1.75rem;
    font-family: var(--font-secondary);
    font-size: 0.95rem;
    line-height: 1.55;
    color: hsl(210, 9%, 28%);
}
.p1-list li::before {
    position: absolute;
    left: 0;
    top: 0.05em;
    font-size: 0.95rem;
    font-weight: 700;
}
.p1-panel--auth .p1-list li::before { content: '✕'; color: #9aa1a8; }
.p1-panel--off .p1-list li::before { content: '✓'; color: var(--nywd-green); }

@media (max-width: 800px) {
    .p1-versus { grid-template-columns: 1fr; }
    .p1-panel--off { border-left: 0; border-top: 1px solid hsl(210, 8%, 88%); box-shadow: inset 0 4px 0 var(--nywd-green); }
}

/* Showdown rounds */
.p1-showdown { background: #fff; }
.p1-showdown__head { text-align: center; max-width: 40rem; margin: 0 auto clamp(2.5rem, 4vw, 3.5rem); }
.p1-rounds { display: flex; flex-direction: column; gap: 1.5rem; }
.p1-round {
    border: 1px solid hsl(210, 8%, 88%);
    background: #fff;
}
.p1-round__title {
    display: flex;
    align-items: baseline;
    gap: 1rem;
    padding: 1.25rem clamp(1.25rem, 3vw, 2rem);
    border-bottom: 1px solid hsl(210, 8%, 90%);
    background: var(--nywd-muted);
}
.p1-round__num {
    font-family: var(--font-primary);
    font-style: italic;
    font-size: 1.5rem;
    color: var(--nywd-green);
    line-height: 1;
}
.p1-round__title h3 {
    font-family: var(--font-secondary);
    font-weight: 600;
    font-size: 1.0625rem;
    color: var(--color-contrast-high);
    letter-spacing: -0.005em;
}
.p1-round__cells { display: grid; grid-template-columns: 1fr 1fr; }
.p1-cell { padding: 1.5rem clamp(1.25rem, 3vw, 2rem); }
.p1-cell + .p1-cell { border-left: 1px solid hsl(210, 8%, 90%); }
.p1-cell__label {
    font-family: var(--font-secondary);
    font-size: 0.66rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: 0.625rem;
}
.p1-cell--auth .p1-cell__label { color: #8a929a; }
.p1-cell--off .p1-cell__label { color: var(--nywd-green); }
.p1-cell p {
    font-family: var(--font-secondary);
    font-size: 0.95rem;
    line-height: 1.65;
    color: hsl(210, 9%, 30%);
}
.p1-cell--off { background: hsl(179, 30%, 97%); }
@media (max-width: 700px) {
    .p1-round__cells { grid-template-columns: 1fr; }
    .p1-cell + .p1-cell { border-left: 0; border-top: 1px solid hsl(210, 8%, 90%); }
}

/* Where NYWD fits */
.p1-fit { background: var(--nywd-accent-soft); }
.p1-fit__head { max-width: 44rem; margin: 0 auto clamp(2.5rem, 4vw, 3.25rem); text-align: center; }
.p1-fit__head p { margin-top: 1rem; }
.p1-benefits { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.p1-benefit {
    background: #fff;
    border-top: 3px solid var(--nywd-green);
    padding: 1.75rem;
}
.p1-benefit h3 {
    font-family: var(--font-primary);
    font-weight: 500;
    font-size: 1.3rem;
    color: var(--color-contrast-high);
    margin-bottom: 0.625rem;
}
.p1-benefit p {
    font-family: var(--font-secondary);
    font-size: 0.95rem;
    line-height: 1.65;
    color: hsl(210, 9%, 30%);
}
@media (max-width: 800px) { .p1-benefits { grid-template-columns: 1fr; } }

/* Closing argument */
.p1-close { background: #fff; }
.p1-close__inner { max-width: 52rem; margin: 0 auto; text-align: center; }
.p1-close .pg-h2 { margin-bottom: 1.25rem; }
.p1-close__hidden {
    margin-top: 2rem;
    padding: 1.5rem 1.75rem;
    border: 1px solid hsl(210, 8%, 88%);
    border-left: 3px solid var(--nywd-green);
    background: var(--nywd-muted);
    font-family: var(--font-secondary);
    font-size: 0.975rem;
    line-height: 1.7;
    color: hsl(210, 9%, 28%);
    text-align: left;
}

/* ════════════════════════════════════════════════════════════════════
   P2 — PRIMER / FIELD GUIDE  (What Is Off-Price Eyewear?)
   Editorial explainer: definition device, myth vs reality, field notes
   ════════════════════════════════════════════════════════════════════ */
.p2-hero { background: #fff; border-bottom: 1px solid hsl(210, 8%, 90%); }
.p2-hero__inner { max-width: 64rem; margin: 0 auto; padding: clamp(3rem, 6vw, 5rem) clamp(1.25rem, 4vw, 2.5rem) clamp(2.5rem, 4vw, 3.5rem); }
.p2-hero__strap {
    font-family: var(--font-secondary);
    font-size: 0.7rem; letter-spacing: 0.24em; text-transform: uppercase;
    color: var(--nywd-green); font-weight: 700; margin-bottom: 1.25rem;
}
.p2-hero h1 {
    font-family: var(--font-primary); font-weight: 500;
    font-size: clamp(2.2rem, 5vw, 3.75rem); line-height: 1.14; letter-spacing: -0.015em;
    color: var(--color-contrast-high); max-width: 20ch; text-wrap: balance;
    margin-bottom: 2.25rem;
}
.p2-hero h1 em { font-style: italic; color: var(--nywd-green); font-weight: 400; }
.p2-hero__sub {
    font-family: var(--font-secondary); font-size: clamp(1.0625rem, 1.5vw, 1.2rem);
    line-height: 1.75; color: hsl(210, 9%, 30%); max-width: 58ch; margin-top: 0;
}

/* Definition device */
.p2-def {
    max-width: 64rem; margin: clamp(2.5rem, 5vw, 4rem) auto 0;
    padding: clamp(2rem, 4vw, 3rem) clamp(1.25rem, 4vw, 2.5rem);
    background: var(--nywd-accent-soft);
    border-left: 4px solid var(--nywd-green);
}
.p2-def__label {
    font-family: var(--font-secondary); font-size: 0.66rem; letter-spacing: 0.2em;
    text-transform: uppercase; font-weight: 700; color: var(--nywd-green); margin-bottom: 0.875rem;
}
.p2-def p {
    font-family: var(--font-primary); font-size: clamp(1.35rem, 2.4vw, 1.85rem);
    line-height: 1.4; color: var(--color-contrast-high); font-weight: 400;
}
.p2-def p em { font-style: italic; color: var(--nywd-green); }

/* Myth vs reality */
.p2-myth { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; margin-top: clamp(2.5rem, 4vw, 3.5rem); }
.p2-myth__card { padding: 1.75rem; border: 1px solid hsl(210, 8%, 88%); }
.p2-myth__card--no { background: #f3f4f5; }
.p2-myth__card--yes { background: hsl(179, 30%, 97%); border-color: hsl(179, 25%, 82%); }
.p2-myth__k {
    font-family: var(--font-secondary); font-size: 0.66rem; letter-spacing: 0.16em;
    text-transform: uppercase; font-weight: 700; margin-bottom: 0.75rem;
}
.p2-myth__card--no .p2-myth__k { color: #8a929a; }
.p2-myth__card--yes .p2-myth__k { color: var(--nywd-green); }
.p2-myth__card p { font-family: var(--font-secondary); font-size: 1rem; line-height: 1.7; color: hsl(210, 9%, 28%); }
@media (max-width: 760px) { .p2-myth { grid-template-columns: 1fr; } }

/* Field notes — numbered supply-chain shifts */
.p2-shifts { display: flex; flex-direction: column; }
.p2-shift {
    display: grid; grid-template-columns: 4rem 1fr; gap: 1.5rem; align-items: baseline;
    padding: 1.75rem 0; border-top: 1px solid hsl(210, 8%, 88%);
}
.p2-shift:last-child { border-bottom: 1px solid hsl(210, 8%, 88%); }
.p2-shift__num {
    font-family: var(--font-primary); font-style: italic; font-size: 2.75rem;
    color: var(--nywd-green); line-height: 1; font-feature-settings: "lnum";
}
.p2-shift h3 { font-family: var(--font-secondary); font-weight: 600; font-size: 1.15rem; color: var(--color-contrast-high); margin-bottom: 0.4rem; }
.p2-shift p { font-family: var(--font-secondary); font-size: 1rem; line-height: 1.7; color: hsl(210, 9%, 30%); }
@media (max-width: 600px) { .p2-shift { grid-template-columns: 1fr; gap: 0.5rem; } .p2-shift__num { font-size: 2rem; } }

/* Four advantages */
.p2-adv-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
.p2-adv {
    background: #fff; border: 1px solid hsl(210, 8%, 88%); border-top: 3px solid var(--color-primary);
    padding: 1.75rem;
}
.p2-adv__n {
    font-family: var(--font-secondary); font-size: 0.7rem; letter-spacing: 0.16em;
    text-transform: uppercase; font-weight: 700; color: var(--nywd-green); margin-bottom: 0.6rem;
}
.p2-adv h3 { font-family: var(--font-primary); font-weight: 500; font-size: 1.4rem; color: var(--color-contrast-high); margin-bottom: 0.6rem; }
.p2-adv p { font-family: var(--font-secondary); font-size: 0.95rem; line-height: 1.65; color: hsl(210, 9%, 30%); }
@media (max-width: 760px) { .p2-adv-grid { grid-template-columns: 1fr; } }

/* Authenticity split */
.p2-auth { background: var(--nywd-accent-soft); }
.p2-auth__grid { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: clamp(2rem, 4vw, 3.5rem); align-items: center; }
.p2-auth__media .img-slot { aspect-ratio: 4 / 3; border-radius: 0; }
.p2-auth__copy h2 { margin-bottom: 1rem; }
.p2-guarantees { display: flex; flex-direction: column; gap: 1rem; margin-top: 1.5rem; }
.p2-guarantee {
    display: grid; grid-template-columns: auto 1fr; gap: 1rem; align-items: start;
    background: #fff; padding: 1.25rem 1.5rem; border: 1px solid hsl(210, 8%, 88%);
}
.p2-guarantee__ic {
    width: 38px; height: 38px; flex-shrink: 0; border-radius: 50%;
    background: hsl(179, 30%, 94%); color: var(--nywd-green);
    display: flex; align-items: center; justify-content: center;
}
.p2-guarantee__ic svg { width: 19px; height: 19px; }
.p2-guarantee h4 { font-family: var(--font-secondary); font-weight: 600; font-size: 1rem; color: var(--color-contrast-high); margin-bottom: 0.2rem; }
.p2-guarantee p { font-family: var(--font-secondary); font-size: 0.92rem; line-height: 1.6; color: hsl(210, 9%, 32%); }
@media (max-width: 800px) { .p2-auth__grid { grid-template-columns: 1fr; } .p2-auth__media { order: 2; } }

/* 3-step process (shared style reused by other pages) */
.pg-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; counter-reset: pgstep; }
.pg-step { counter-increment: pgstep; padding-top: 1.25rem; border-top: 2px solid var(--color-primary); }
.pg-step__n {
    font-family: var(--font-primary); font-style: italic; font-size: 2.5rem;
    color: var(--nywd-green); line-height: 1; display: block; margin-bottom: 0.75rem;
}
.pg-step h3 { font-family: var(--font-secondary); font-weight: 600; font-size: 1.0625rem; color: var(--color-contrast-high); margin-bottom: 0.4rem; }
.pg-step p { font-family: var(--font-secondary); font-size: 0.95rem; line-height: 1.65; color: hsl(210, 9%, 30%); }
@media (max-width: 760px) { .pg-steps { grid-template-columns: 1fr; gap: 1.25rem; } }

/* ───────── SHARED COMPARISON TABLE (.pg-cmp) — used by P3/P4/P5/P6 ───────── */
.pg-cmp { border: 1px solid hsl(210, 8%, 86%); background: #fff; overflow: hidden; }
.pg-cmp__row { display: grid; grid-template-columns: 1.3fr 1fr 1fr; border-bottom: 1px solid hsl(210, 8%, 92%); }
.pg-cmp__row:last-child { border-bottom: 0; }
.pg-cmp__row > div { padding: 1.1rem 1.35rem; font-family: var(--font-secondary); font-size: 0.95rem; line-height: 1.55; }
.pg-cmp__row > div + div { border-left: 1px solid hsl(210, 8%, 92%); }
.pg-cmp__row--head > div {
    background: var(--nywd-muted); font-weight: 700; font-size: 0.66rem;
    letter-spacing: 0.14em; text-transform: uppercase; color: var(--color-contrast-medium);
}
.pg-cmp__row--head > div:nth-child(3) { background: var(--color-primary); color: #fff; }
.pg-cmp__metric { font-weight: 600 !important; color: var(--color-contrast-high); }
.pg-cmp__trad { color: var(--color-contrast-medium); }
.pg-cmp__nywd { background: hsl(179, 32%, 96.5%); color: var(--color-primary); font-weight: 500; }
.pg-cmp__nywd strong { color: var(--nywd-green-dark); font-weight: 700; }
@media (max-width: 720px) {
    .pg-cmp__row { grid-template-columns: 1fr; }
    .pg-cmp__row > div + div { border-left: 0; border-top: 1px solid hsl(210, 8%, 92%); }
    .pg-cmp__row--head { display: none; }
    .pg-cmp__metric { background: var(--nywd-muted); }
    .pg-cmp__trad::before { content: 'Traditional — '; font-weight: 700; color: #8a929a; }
    .pg-cmp__nywd::before { content: 'NYWD — '; font-weight: 700; color: var(--nywd-green-dark); }
}

/* ════════════════════════════════════════════════════════════════════
   P3 — BLUEPRINT / SCHEMATIC  (The Profit Blueprint of Off-Price Eyewear)
   Technical flow diagram + comparison + execution steps
   ════════════════════════════════════════════════════════════════════ */
.p3-hero {
    background: #1f2329; color: #fff;
    background-image:
        linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px);
    background-size: 32px 32px;
}
.p3-hero__inner { max-width: 66rem; margin: 0 auto; padding: clamp(3rem, 6vw, 5rem) clamp(1.25rem, 4vw, 2.5rem); }
.p3-hero__strap {
    font-family: ui-monospace, 'SF Mono', Menlo, monospace; font-size: 0.7rem;
    letter-spacing: 0.2em; text-transform: uppercase; color: #79c3c2; margin-bottom: 1.5rem;
}
.p3-hero h1 {
    font-family: var(--font-primary); font-weight: 500; color: #fff;
    font-size: clamp(2.1rem, 4.6vw, 3.6rem); line-height: 1.12; letter-spacing: -0.015em;
    max-width: 22ch; text-wrap: balance; margin-bottom: 1.75rem;
}
.p3-hero h1 em { font-style: italic; color: #79c3c2; font-weight: 400; }
.p3-hero p { font-family: var(--font-secondary); font-size: clamp(1rem, 1.5vw, 1.15rem); line-height: 1.7; color: rgba(255,255,255,0.72); max-width: 60ch; }
.p3-hero p + p { margin-top: 1rem; }

/* Flow schematic */
.p3-flow {
    margin: clamp(2rem, 4vw, 3rem) 0;
    padding: clamp(1.75rem, 4vw, 3rem) clamp(1rem, 3vw, 2rem);
    background: #fbfbfa;
    border: 1px solid hsl(210, 8%, 86%);
    background-image:
        linear-gradient(hsl(210,12%,93%) 1px, transparent 1px),
        linear-gradient(90deg, hsl(210,12%,93%) 1px, transparent 1px);
    background-size: 26px 26px;
}
.p3-flow__inputs { display: flex; flex-wrap: wrap; justify-content: center; align-items: stretch; gap: 0.75rem; }
.p3-input {
    background: #fff; border: 1px solid hsl(210, 8%, 80%);
    padding: 0.85rem 1.1rem; text-align: center; max-width: 14rem;
    font-family: ui-monospace, 'SF Mono', Menlo, monospace; font-size: 0.78rem;
    line-height: 1.4; color: var(--color-contrast-high); font-weight: 500;
    display: flex; align-items: center; justify-content: center;
}
.p3-plus { display: flex; align-items: center; font-family: var(--font-secondary); font-weight: 700; color: var(--nywd-green); font-size: 1.2rem; }
.p3-arrow { display: flex; justify-content: center; padding: 0.5rem 0; color: var(--nywd-green); }
.p3-arrow svg { width: 22px; height: 26px; }
.p3-stage {
    margin: 0 auto; max-width: 40rem; text-align: center;
    background: #fff; border: 1.5px solid var(--color-primary);
    padding: 1rem 1.5rem;
    font-family: var(--font-secondary); font-weight: 600; font-size: 1.0625rem; color: var(--color-contrast-high);
}
.p3-stage--accent { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }
.p3-stage--result { background: hsl(179, 35%, 95%); border: 1.5px solid var(--nywd-green); color: var(--nywd-green-dark); }
.p3-stage--result strong { font-family: var(--font-primary); font-style: italic; font-weight: 500; font-size: 1.35rem; }
@media (max-width: 640px) { .p3-input { max-width: 100%; width: 100%; } .p3-plus { display: none; } .p3-flow__inputs { flex-direction: column; } }

/* Sector cards */
.p3-sectors { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.25rem; }
.p3-sector {
    background: #fff; border: 1px solid hsl(210, 8%, 88%);
    padding: 1.5rem 1.6rem; display: grid; grid-template-columns: auto 1fr; gap: 1rem; align-items: start;
}
.p3-sector__tick { color: var(--nywd-green); font-weight: 700; font-size: 1.1rem; line-height: 1.4; }
.p3-sector h3 { font-family: var(--font-secondary); font-weight: 600; font-size: 1.0625rem; color: var(--color-contrast-high); margin-bottom: 0.3rem; }
.p3-sector p { font-family: var(--font-secondary); font-size: 0.93rem; line-height: 1.6; color: hsl(210, 9%, 32%); }
@media (max-width: 720px) { .p3-sectors { grid-template-columns: 1fr; } }

/* ───────── SHARED LEAD FORM (.pg-form) — mirrors nywd.com register form ───────── */
.pg-form {
    background: #fff; border: 1px solid hsl(210, 8%, 84%);
    padding: clamp(1.5rem, 3vw, 2.25rem);
    box-shadow: 0 20px 50px -30px rgba(31,35,41,0.35);
}
.pg-form__head {
    font-family: var(--font-primary); font-weight: 500; font-size: 1.5rem;
    color: var(--color-contrast-high); margin-bottom: 0.4rem; line-height: 1.2;
}
.pg-form__sub { font-family: var(--font-secondary); font-size: 0.9rem; color: var(--color-contrast-medium); margin-bottom: 1.5rem; line-height: 1.5; }

/* register-style placeholder fields, 2-up grid (textarea full width) */
.pg-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.85rem; }
.pg-input {
    width: 100%; font-family: var(--font-secondary); font-size: 0.95rem;
    padding: 0.72rem 0.85rem; border: 1px solid hsl(210, 8%, 80%); border-radius: 4px;
    background: #fff; color: var(--color-contrast-high);
    transition: border-color .15s, box-shadow .15s;
}
.pg-input::placeholder { color: hsl(210, 8%, 52%); }
.pg-input:focus { outline: none; border-color: var(--nywd-green); box-shadow: 0 0 0 3px hsl(179, 30%, 90%); }
.pg-select { position: relative; }
.pg-select select { width: 100%; appearance: none; -webkit-appearance: none; padding-right: 2.25rem; cursor: pointer; color: hsl(210, 8%, 38%); }
.pg-select::after {
    content: ""; position: absolute; right: 0.95rem; top: 50%; width: 9px; height: 9px;
    border-right: 2px solid hsl(210, 8%, 45%); border-bottom: 2px solid hsl(210, 8%, 45%);
    transform: translateY(-65%) rotate(45deg); pointer-events: none;
}
.pg-textarea { grid-column: 1 / -1; min-height: 84px; resize: vertical; font-family: var(--font-secondary); }
@media (max-width: 480px) { .pg-form__grid { grid-template-columns: 1fr; } }

.pg-form__btn {
    width: 100%; margin-top: 1.25rem; padding: 0.85rem 1rem;
    background: #2A2E33; color: #fff; border-radius: 4px;
    font-family: var(--font-secondary); font-size: 0.78rem; font-weight: 600;
    letter-spacing: 0.06em; text-transform: uppercase; cursor: pointer;
    transition: background .2s;
}
.pg-form__btn:hover { background: #3a4047; }
.pg-form__fine { margin-top: 1rem; font-family: var(--font-secondary); font-size: 0.74rem; line-height: 1.55; color: var(--color-contrast-medium); text-align: center; }
.pg-form__fine a { color: var(--color-contrast-high); text-decoration: underline; text-underline-offset: 2px; }
.pg-form__fine a:hover { opacity: 0.7; }

/* reCAPTCHA v2 "I'm not a robot" checkbox replica (real widget swapped in at integration) */
.pg-recaptcha {
    margin-top: 1.25rem;
    display: flex; align-items: center; gap: 0.75rem;
    width: 304px; max-width: 100%; height: 78px;
    padding: 0 0.85rem 0 0.75rem;
    background: #f9f9f9; border: 1px solid #d3d3d3; border-radius: 3px;
    box-shadow: 0 0 4px 1px rgba(0,0,0,0.06) inset;
    font-family: 'Roboto', var(--font-secondary), sans-serif;
}
.pg-recaptcha__check {
    width: 28px; height: 28px; flex-shrink: 0;
    background: #fff; border: 2px solid #c1c1c1; border-radius: 2px;
}
.pg-recaptcha__label { font-size: 0.85rem; color: #222; flex: 1; }
.pg-recaptcha__brand { display: flex; flex-direction: column; align-items: center; gap: 0.1rem; color: #555; }
.pg-recaptcha__brand svg { width: 30px; height: 30px; }
.pg-recaptcha__brand b { font-size: 0.6rem; font-weight: 500; letter-spacing: 0.01em; color: #555; }
.pg-recaptcha__brand small { font-size: 0.5rem; color: #9b9b9b; }
.pg-recaptcha.pg-recaptcha--real {
    display: block;
    width: 304px;
    max-width: 100%;
    height: auto;
    min-height: 78px;
    margin: 1.25rem auto 0;
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
}
.pg-recaptcha--real #grecaptcha { display: flex; justify-content: center; }
.pg-recaptcha--real #capmsg { display: block; margin-top: 0.4rem; text-align: center; }

/* ════════════════════════════════════════════════════════════════════
   P4 — AUTHORITY PILLAR  (Designer Eyewear Wholesale Distributor USA)
   Split hero with lead form, industry guide, trust scaffolding
   ════════════════════════════════════════════════════════════════════ */
.p4-hero { background: var(--nywd-accent-soft); border-bottom: 1px solid hsl(210,8%,90%); }
.p4-hero__inner {
    max-width: var(--max-w-lg); margin: 0 auto;
    padding: clamp(2.5rem, 5vw, 4.5rem) clamp(1.25rem, 4vw, 2.5rem);
    display: grid; grid-template-columns: 1.05fr 0.95fr; gap: clamp(2rem, 5vw, 4rem); align-items: start;
}
.p4-hero__strap {
    font-family: var(--font-secondary); font-size: 0.7rem; letter-spacing: 0.22em;
    text-transform: uppercase; color: var(--nywd-green); font-weight: 700; margin-bottom: 1.25rem;
}
.p4-hero h1 {
    font-family: var(--font-primary); font-weight: 500;
    font-size: clamp(2.1rem, 4.4vw, 3.4rem); line-height: 1.12; letter-spacing: -0.015em;
    color: var(--color-contrast-high); text-wrap: balance; margin-bottom: 1.6rem;
}
.p4-hero h1 em { font-style: italic; color: var(--nywd-green); font-weight: 400; }
.p4-hero__sub { font-family: var(--font-secondary); font-size: clamp(1rem, 1.4vw, 1.15rem); line-height: 1.7; color: hsl(210, 9%, 30%); max-width: 48ch; }
.p4-trust { display: flex; gap: 2rem; margin-top: 2rem; flex-wrap: wrap; }
.p4-trust__num { font-family: var(--font-primary); font-weight: 500; font-size: 2rem; color: var(--color-contrast-high); line-height: 1; }
.p4-trust__lab { font-family: var(--font-secondary); font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--color-contrast-medium); margin-top: 0.4rem; }
@media (max-width: 880px) {
    .p4-hero__inner { grid-template-columns: 1fr; }
    .p4-hero__form { max-width: 30rem; }
}

/* Three verticals */
.p4-verticals { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.p4-vertical { background: #fff; border: 1px solid hsl(210, 8%, 88%); overflow: hidden; }
.p4-vertical .img-slot { aspect-ratio: 16/10; border-radius: 0; }
.p4-vertical__body { padding: 1.5rem; }
.p4-vertical h3 { font-family: var(--font-primary); font-weight: 500; font-size: 1.25rem; color: var(--color-contrast-high); margin-bottom: 0.5rem; }
.p4-vertical p { font-family: var(--font-secondary); font-size: 0.93rem; line-height: 1.6; color: hsl(210, 9%, 32%); }
@media (max-width: 820px) { .p4-verticals { grid-template-columns: 1fr; } }

/* Sourcing model — 4 numbered feature rows */
.p4-model { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
.p4-feature {
    background: #fff; border: 1px solid hsl(210, 8%, 88%); border-left: 3px solid var(--nywd-green);
    padding: 1.6rem 1.75rem;
}
.p4-feature h3 { font-family: var(--font-secondary); font-weight: 600; font-size: 1.1rem; color: var(--color-contrast-high); margin-bottom: 0.5rem; }
.p4-feature p { font-family: var(--font-secondary); font-size: 0.95rem; line-height: 1.65; color: hsl(210, 9%, 30%); }
@media (max-width: 760px) { .p4-model { grid-template-columns: 1fr; } }

/* Partner sectors — compact list */
.p4-partners { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.25rem 2rem; }
.p4-partner { padding: 1.25rem 0; border-top: 1px solid hsl(210, 8%, 86%); }
.p4-partner h3 { font-family: var(--font-secondary); font-weight: 600; font-size: 1.0625rem; color: var(--color-contrast-high); margin-bottom: 0.35rem; }
.p4-partner p { font-family: var(--font-secondary); font-size: 0.93rem; line-height: 1.6; color: hsl(210, 9%, 32%); }
@media (max-width: 720px) { .p4-partners { grid-template-columns: 1fr; } }

/* ════════════════════════════════════════════════════════════════════
   P5 — HIGH-VELOCITY GATEWAY  (Off-Price Eyewear Wholesale USA)
   Dark centered hero + gateway form, market-factor cards, guarantee band
   ════════════════════════════════════════════════════════════════════ */
.p5-hero { background: linear-gradient(165deg, #22262b 0%, #2e343b 100%); color: #fff; }
.p5-hero__inner { max-width: 56rem; margin: 0 auto; padding: clamp(3rem, 6vw, 5rem) clamp(1.25rem, 4vw, 2.5rem); text-align: center; }
.p5-hero__strap { font-family: var(--font-secondary); font-size: 0.7rem; letter-spacing: 0.24em; text-transform: uppercase; color: #79c3c2; font-weight: 700; margin-bottom: 1.25rem; }
.p5-hero h1 {
    font-family: var(--font-primary); font-weight: 500; color: #fff;
    font-size: clamp(2.1rem, 4.6vw, 3.5rem); line-height: 1.12; letter-spacing: -0.015em;
    max-width: 20ch; margin: 0 auto 1.25rem; text-wrap: balance;
}
.p5-hero h1 em { font-style: italic; color: #79c3c2; font-weight: 400; }
.p5-hero__sub { font-family: var(--font-secondary); font-size: clamp(1.0625rem, 1.6vw, 1.25rem); line-height: 1.7; color: rgba(255,255,255,0.74); max-width: 50ch; margin: 0 auto; }
.p5-hero__form { max-width: 40rem; margin: clamp(2rem, 4vw, 3rem) auto 0; text-align: left; }
.p5-hero__form .pg-field--row3 { display: grid; grid-template-columns: 1fr 1fr; gap: 0.85rem; }
@media (max-width: 560px) { .p5-hero__form .pg-field--row3 { grid-template-columns: 1fr; } }

/* Market-factor cards */
.p5-factors { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
.p5-factor { background: #fff; border: 1px solid hsl(210, 8%, 88%); padding: 1.75rem; }
.p5-factor__n { font-family: var(--font-primary); font-style: italic; font-size: 2.25rem; color: var(--nywd-green); line-height: 1; margin-bottom: 0.75rem; }
.p5-factor h3 { font-family: var(--font-secondary); font-weight: 600; font-size: 1.1rem; color: var(--color-contrast-high); margin-bottom: 0.5rem; }
.p5-factor p { font-family: var(--font-secondary); font-size: 0.95rem; line-height: 1.65; color: hsl(210, 9%, 30%); }
@media (max-width: 760px) { .p5-factors { grid-template-columns: 1fr; } }

/* Fulfill-from-stock guarantee band */
.p5-guarantee {
    background: #1f2329; color: #fff;
    padding: clamp(2.5rem, 5vw, 4rem) clamp(1.5rem, 4vw, 3.5rem);
    max-width: var(--max-w-lg); margin: 0 auto;
    display: grid; grid-template-columns: 1fr 1px 1.1fr; gap: clamp(1.5rem, 4vw, 3rem); align-items: center;
}
.p5-guarantee__rule { background: rgba(255,255,255,0.14); width: 1px; height: 100%; }
.p5-guarantee__k { font-family: var(--font-secondary); font-size: 0.7rem; letter-spacing: 0.2em; text-transform: uppercase; color: #79c3c2; font-weight: 700; margin-bottom: 1rem; }
.p5-guarantee h2 { font-family: var(--font-primary); font-weight: 500; color: #fff; font-size: clamp(1.6rem, 3vw, 2.3rem); line-height: 1.15; text-wrap: balance; }
.p5-guarantee h2 em { font-style: italic; color: #79c3c2; }
.p5-guarantee p { font-family: var(--font-secondary); font-size: 1rem; line-height: 1.7; color: rgba(255,255,255,0.74); }
.p5-guarantee p + p { margin-top: 1rem; }
.p5-guarantee strong { color: #fff; font-weight: 600; }
@media (max-width: 800px) { .p5-guarantee { grid-template-columns: 1fr; } .p5-guarantee__rule { display: none; } }

/* ════════════════════════════════════════════════════════════════════
   P6 — DIRECTORY / GUIDE  (Best Eyewear Distributors in the USA)
   Light editorial: model directory cards, criteria checklist, myth-buster
   ════════════════════════════════════════════════════════════════════ */
.p6-hero { background: #fff; border-bottom: 1px solid hsl(210,8%,90%); }
.p6-hero__inner {
    max-width: var(--max-w-lg); margin: 0 auto;
    padding: clamp(1.75rem,3vw,2.75rem) clamp(1.25rem,4vw,2.5rem);
    display: grid; grid-template-columns: 1.05fr 0.95fr; gap: clamp(2rem,5vw,4rem); align-items: stretch;
}
.p6-hero__copy { align-self: center; }
.p6-hero__media { align-self: stretch; }
.p6-hero__media img {
    width: 100%; height: 100%; min-height: 360px;
    object-fit: cover; object-position: 46% 74%;
    display: block;
}
@media (max-width: 860px) {
    .p6-hero__inner { grid-template-columns: 1fr; gap: 2rem; }
    .p6-hero__media img { min-height: 0; aspect-ratio: 4 / 3; }
}
.p6-hero__strap { font-family: var(--font-secondary); font-size: 0.7rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--nywd-green); font-weight: 700; margin-bottom: 1.25rem; }
.p6-hero h1 { font-family: var(--font-primary); font-weight: 500; font-size: clamp(2.2rem,4.8vw,3.6rem); line-height: 1.12; letter-spacing: -0.015em; color: var(--color-contrast-high); max-width: 18ch; text-wrap: balance; margin-bottom: 1.5rem; }
.p6-hero h1 em { font-style: italic; color: var(--nywd-green); font-weight: 400; }
.p6-hero__sub { font-family: var(--font-secondary); font-size: clamp(1.0625rem,1.5vw,1.2rem); line-height: 1.7; color: hsl(210,9%,30%); max-width: 54ch; margin-bottom: 1.75rem; }

/* Model directory cards */
.p6-models { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; align-items: stretch; }
.p6-model {
    background: #fff; border: 1px solid hsl(210, 8%, 86%);
    display: flex; flex-direction: column;
}
.p6-model--feature { border-color: var(--nywd-green); box-shadow: 0 0 0 1px var(--nywd-green); }
.p6-model__top { padding: 1.5rem 1.6rem; border-bottom: 1px solid hsl(210, 8%, 90%); }
.p6-model--feature .p6-model__top { background: hsl(179, 32%, 96%); }
.p6-model__n { font-family: var(--font-primary); font-style: italic; font-size: 1.5rem; color: var(--nywd-green); line-height: 1; }
.p6-model h3 { font-family: var(--font-primary); font-weight: 500; font-size: 1.35rem; color: var(--color-contrast-high); margin: 0.5rem 0 0; line-height: 1.2; }
.p6-model__body { padding: 1.5rem 1.6rem; display: flex; flex-direction: column; gap: 1rem; flex: 1; }
.p6-model__line { font-family: var(--font-secondary); font-size: 0.92rem; line-height: 1.55; color: hsl(210, 9%, 32%); }
.p6-model__line b { display: block; font-size: 0.64rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--color-contrast-medium); font-weight: 700; margin-bottom: 0.25rem; }
.p6-model__best { margin-top: auto; padding: 1rem 1.6rem; border-top: 1px solid hsl(210, 8%, 90%); background: var(--nywd-muted); font-family: var(--font-secondary); font-size: 0.9rem; line-height: 1.5; color: hsl(210, 9%, 28%); }
.p6-model__best b { display: block; font-size: 0.64rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--nywd-green); font-weight: 700; margin-bottom: 0.3rem; }
.p6-model--feature .p6-model__best { background: hsl(179, 32%, 96%); }
@media (max-width: 880px) { .p6-models { grid-template-columns: 1fr; } }

/* Misconceptions */
.p6-myths { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.p6-myth { background: #fff; border: 1px solid hsl(210, 8%, 88%); padding: 1.75rem; }
.p6-myth__claim { font-family: var(--font-primary); font-style: italic; font-size: 1.2rem; line-height: 1.4; color: var(--color-contrast-medium); margin-bottom: 1rem; padding-bottom: 1rem; border-bottom: 1px solid hsl(210, 8%, 90%); }
.p6-myth__r { font-family: var(--font-secondary); font-size: 0.95rem; line-height: 1.65; color: hsl(210, 9%, 28%); }
.p6-myth__r b { color: var(--nywd-green-dark); font-weight: 700; }
@media (max-width: 760px) { .p6-myths { grid-template-columns: 1fr; } }

/* Selection criteria checklist */
.p6-criteria { display: flex; flex-direction: column; }
.p6-crit { display: grid; grid-template-columns: 3.5rem 1fr; gap: 1.5rem; padding: 1.5rem 0; border-top: 1px solid hsl(210, 8%, 88%); align-items: baseline; }
.p6-crit:last-child { border-bottom: 1px solid hsl(210, 8%, 88%); }
.p6-crit__n { font-family: var(--font-primary); font-style: italic; font-size: 2rem; color: var(--nywd-green); line-height: 1; }
.p6-crit h3 { font-family: var(--font-secondary); font-weight: 600; font-size: 1.0625rem; color: var(--color-contrast-high); margin-bottom: 0.3rem; }
.p6-crit p { font-family: var(--font-secondary); font-size: 0.95rem; line-height: 1.65; color: hsl(210, 9%, 30%); }
@media (max-width: 600px) { .p6-crit { grid-template-columns: 1fr; gap: 0.4rem; } }

/* ════════════════════════════════════════════════════════════════════
   P7 — CONVERSION LANDING  (Dropship Designer Sunglasses)
   E-commerce: image hero, benefit cards, curation themes, access form
   ════════════════════════════════════════════════════════════════════ */
.p7-hero { background: var(--nywd-accent-soft); border-bottom: 1px solid hsl(210,8%,90%); }
.p7-hero__inner {
    max-width: var(--max-w-lg); margin: 0 auto;
    padding: clamp(2.5rem,5vw,4.5rem) clamp(1.25rem,4vw,2.5rem);
    display: grid; grid-template-columns: 1.05fr 0.95fr; gap: clamp(2rem,5vw,4rem); align-items: center;
}
.p7-hero__strap { font-family: var(--font-secondary); font-size: 0.7rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--nywd-green); font-weight: 700; margin-bottom: 1.25rem; }
.p7-hero h1 { font-family: var(--font-primary); font-weight: 500; font-size: clamp(2.1rem,4.4vw,3.4rem); line-height: 1.12; letter-spacing: -0.015em; color: var(--color-contrast-high); text-wrap: balance; margin-bottom: 1.5rem; }
.p7-hero h1 em { font-style: italic; color: var(--nywd-green); font-weight: 400; }
.p7-hero__sub { font-family: var(--font-secondary); font-size: clamp(1rem,1.4vw,1.15rem); line-height: 1.7; color: hsl(210,9%,30%); max-width: 50ch; margin-bottom: 1.75rem; }
.p7-hero__media .img-slot { aspect-ratio: 4/5; border-radius: 0; }
@media (max-width: 860px) { .p7-hero__inner { grid-template-columns: 1fr; } .p7-hero__media { max-width: 26rem; } }

/* Benefit cards */
.p7-why { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.p7-benefit { background: #fff; border: 1px solid hsl(210, 8%, 88%); border-top: 3px solid var(--nywd-green); padding: 1.75rem; }
.p7-benefit__ic { width: 40px; height: 40px; border-radius: 50%; background: hsl(179, 30%, 94%); color: var(--nywd-green); display: flex; align-items: center; justify-content: center; margin-bottom: 1rem; }
.p7-benefit__ic svg { width: 20px; height: 20px; }
.p7-benefit h3 { font-family: var(--font-primary); font-weight: 500; font-size: 1.3rem; color: var(--color-contrast-high); margin-bottom: 0.5rem; }
.p7-benefit p { font-family: var(--font-secondary); font-size: 0.95rem; line-height: 1.65; color: hsl(210, 9%, 30%); }
@media (max-width: 820px) { .p7-why { grid-template-columns: 1fr; } }

/* Benchmarks — numbered */
.p7-benchmarks { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
.p7-bench { background: #fff; border: 1px solid hsl(210, 8%, 88%); padding: 1.6rem 1.75rem; display: grid; grid-template-columns: auto 1fr; gap: 1.25rem; align-items: start; }
.p7-bench__n { font-family: var(--font-primary); font-style: italic; font-size: 2rem; color: var(--nywd-green); line-height: 1; }
.p7-bench h3 { font-family: var(--font-secondary); font-weight: 600; font-size: 1.0625rem; color: var(--color-contrast-high); margin-bottom: 0.35rem; }
.p7-bench p { font-family: var(--font-secondary); font-size: 0.93rem; line-height: 1.6; color: hsl(210, 9%, 30%); }
@media (max-width: 760px) { .p7-benchmarks { grid-template-columns: 1fr; } }

/* Curation themes */
.p7-themes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.p7-theme { background: #fff; border: 1px solid hsl(210, 8%, 88%); overflow: hidden; }
.p7-theme .img-slot { aspect-ratio: 4/3; border-radius: 0; }
.p7-theme__body { padding: 1.5rem; }
.p7-theme__k { font-family: var(--font-secondary); font-size: 0.66rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--nywd-green); font-weight: 700; margin-bottom: 0.5rem; }
.p7-theme h3 { font-family: var(--font-primary); font-weight: 500; font-size: 1.3rem; color: var(--color-contrast-high); margin-bottom: 0.4rem; }
.p7-theme p { font-family: var(--font-secondary); font-size: 0.93rem; line-height: 1.6; color: hsl(210, 9%, 32%); }
@media (max-width: 820px) { .p7-themes { grid-template-columns: 1fr; } }

/* Access — steps + form */
.p7-access { display: grid; grid-template-columns: 1fr 0.9fr; gap: clamp(2rem, 4vw, 3.5rem); align-items: start; }
.p7-access__steps { display: flex; flex-direction: column; }
.p7-access__step { display: grid; grid-template-columns: auto 1fr; gap: 1.25rem; padding: 1.25rem 0; border-top: 1px solid hsl(210, 8%, 86%); align-items: baseline; }
.p7-access__step:last-child { border-bottom: 1px solid hsl(210, 8%, 86%); }
.p7-access__n { font-family: var(--font-primary); font-style: italic; font-size: 1.75rem; color: var(--nywd-green); line-height: 1; }
.p7-access__step h3 { font-family: var(--font-secondary); font-weight: 600; font-size: 1rem; color: var(--color-contrast-high); margin-bottom: 0.25rem; }
.p7-access__step p { font-family: var(--font-secondary); font-size: 0.92rem; line-height: 1.55; color: hsl(210, 9%, 32%); }
@media (max-width: 860px) { .p7-access { grid-template-columns: 1fr; } }