/* Parsenon v1.1 visual mockup — layered on top of the v1 stylesheet.
   Hero, copy, CTAs, sunrise and branding are untouched. Every image below is
   decorative (aria-hidden, empty alt) and sits behind or beside live text. */

.v11-art { margin: 0; position: relative; pointer-events: none; }
.v11-art img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* 1 · Opportunity: a fanned stack of glass sheets beside the two benefits */
.v11-opp__band { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(28px, calc(var(--u) * 4.4), 72px); align-items: center; margin-top: clamp(40px, calc(var(--u) * 4.6), 74px); }
.v11-art--records { aspect-ratio: 4 / 3; margin-left: calc(var(--gutter) * -1); }
.v11-art--records { -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 24%, #000 76%, transparent 100%), linear-gradient(180deg, transparent 0%, #000 22%, #000 78%, transparent 100%); -webkit-mask-composite: source-in; mask-image: linear-gradient(90deg, transparent 0%, #000 24%, #000 76%, transparent 100%), linear-gradient(180deg, transparent 0%, #000 22%, #000 78%, transparent 100%); mask-composite: intersect; }
.v11-opp__benefits { display: grid; gap: 0; border-top: 1px solid var(--line); }
.v11-opp__benefits .benefit { padding: clamp(24px, calc(var(--u) * 2.4), 38px) 0; border-bottom: 1px solid var(--line); border-left: 0 !important; padding-left: 0 !important; }
.v11-opp .benefits { display: none; }

/* 2 · Examples: light threading four panes; cards rest on its lower edge as frosted glass */
.v11-ex__head { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, calc(var(--u) * 4), 64px); align-items: center; }
.v11-art--connection { aspect-ratio: 1600 / 820; margin-right: calc(var(--gutter) * -1); }
.v11-art--connection { -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 18%, #000 88%, transparent 100%), linear-gradient(180deg, transparent 0%, #000 14%, #000 70%, transparent 100%); -webkit-mask-composite: source-in; mask-image: linear-gradient(90deg, transparent 0%, #000 18%, #000 88%, transparent 100%), linear-gradient(180deg, transparent 0%, #000 14%, #000 70%, transparent 100%); mask-composite: intersect; }
.v11-ex .cards { position: relative; z-index: 1; margin-top: clamp(-120px, calc(var(--u) * -7), -40px); }
.v11-ex .card { background: linear-gradient(180deg, rgba(255, 255, 255, .82), rgba(255, 255, 255, .9)); -webkit-backdrop-filter: blur(14px) saturate(1.1); backdrop-filter: blur(14px) saturate(1.1); border-color: rgba(213, 225, 227, .9); }

/* 3 · How it works: one object per step — a pane, two panes meeting, a faceted block */
.v11-art--process { aspect-ratio: 1800 / 700; width: 118%; margin: clamp(8px, calc(var(--u) * 1), 16px) 0 0 -9%; }
.v11-art--process { -webkit-mask-image: linear-gradient(90deg, transparent 2%, #000 14%, #000 86%, transparent 98%), linear-gradient(180deg, transparent 0%, #000 18%, #000 78%, transparent 100%); -webkit-mask-composite: source-in; mask-image: linear-gradient(90deg, transparent 2%, #000 14%, #000 86%, transparent 98%), linear-gradient(180deg, transparent 0%, #000 18%, #000 78%, transparent 100%); mask-composite: intersect; }
.v11-how { overflow-x: clip; }
.v11-how .steps { margin-top: clamp(-36px, calc(var(--u) * -2), -12px); position: relative; }
.v11-step-art { display: none; }
.v11-how .section__cta { display: flex; justify-content: center; }

/* 4 · Rights and control: a sealed glass case holding a small warm block */
.v11-art--scope { aspect-ratio: 12 / 13; max-width: 460px; margin-top: clamp(20px, calc(var(--u) * 2), 32px); }
.v11-art--scope { -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 22%, #000 78%, transparent 100%), linear-gradient(180deg, transparent 0%, #000 18%, #000 82%, transparent 100%); -webkit-mask-composite: source-in; mask-image: linear-gradient(90deg, transparent 0%, #000 22%, #000 78%, transparent 100%), linear-gradient(180deg, transparent 0%, #000 18%, #000 82%, transparent 100%); mask-composite: intersect; }

/* 5 · Buyer path: a prism on ink, warm light in, aqua and amber out */
.v11-buyer { grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); align-items: center; padding-right: 0; padding-block: 0; min-height: clamp(420px, calc(var(--u) * 34), 560px); }
.v11-buyer__copy { display: grid; gap: 18px; justify-items: start; padding-block: clamp(36px, calc(var(--u) * 5.2), 84px); }
.v11-buyer__copy h2 { margin-top: 0; }
.v11-buyer__copy .support { font-size: var(--fs-small); color: #B9D3D3; }
.v11-buyer__art { align-self: stretch; position: relative; }
.v11-buyer__art img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 55% 55%; }
.v11-buyer__art { -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 34%); mask-image: linear-gradient(90deg, transparent 0%, #000 34%); }
.v11-buyer::after { display: none; }

/* 6 · Enquiry pages */
.v11-form-hero .form-hero__art { left: auto; width: 50%; background-image: url("assets/v11/records.webp"); background-position: 45% 64%; background-size: cover; -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 42%); mask-image: linear-gradient(90deg, transparent 0%, #000 42%); opacity: 1; }
.v11-aside-art { margin: -28px -28px 6px; aspect-ratio: 1800 / 700; border-radius: 22px 22px 0 0; overflow: hidden; }
.v11-aside-art img { width: 100%; height: 100%; object-fit: cover; }
/* AI-team brief: ink header card carrying the prism, so the buyer path keeps its own identity */
.v11-ink-head { position: relative; overflow: hidden; isolation: isolate; margin: 4px 0 0; border-radius: clamp(22px, calc(var(--u) * 2), 32px); background: var(--ink); color: #DCEBEB; }
.v11-ink-head .form-hero__head { padding-inline: clamp(28px, calc(var(--u) * 4.4), 72px); position: relative; z-index: 1; }
.v11-ink-head h1 { color: var(--white); }
.v11-ink-head .lead { color: #CFE2E2; }
.v11-ink-head .text-link { color: var(--white); text-decoration-color: rgba(255, 255, 255, .45); }
.v11-ink-head .text-link:hover { color: var(--aqua); }
.v11-ink-head a:focus-visible { outline-color: var(--white); }
.v11-ink-head__art { position: absolute; top: 0; right: 0; bottom: 0; width: 58%; z-index: 0; }
.v11-ink-head__art img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 55%; }
.v11-ink-head__art { -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 42%); mask-image: linear-gradient(90deg, transparent 0%, #000 42%); }
.form-hero.v11-plain { border-bottom: 0; }
.form-hero.v11-plain .form-hero__art { display: none; }

/* responsive */
@media (max-width: 999.98px) {
  .v11-opp__band, .v11-ex__head { grid-template-columns: minmax(0, 1fr); }
  .v11-art--records { margin-inline: calc(var(--gutter) * -1); aspect-ratio: 4 / 3; }
  .v11-art--connection { margin-inline: calc(var(--gutter) * -1); }
  .v11-ex .cards { margin-top: -48px; }
  .v11-buyer { grid-template-columns: minmax(0, 1fr); padding: 0; min-height: 0; }
  .v11-buyer__art { order: -1; height: clamp(240px, 56vw, 380px); }
  .v11-buyer__art { -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent 100%); mask-image: linear-gradient(180deg, #000 55%, transparent 100%); }
  .v11-buyer__art img { object-position: 50% 55%; }
  .v11-buyer__copy { padding: 0 clamp(24px, 5vw, 48px) clamp(32px, 6vw, 48px); margin-top: -24px; }
  .v11-ink-head__art { position: relative; width: 100%; height: clamp(200px, 48vw, 320px); }
  .v11-ink-head__art { -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent 100%); mask-image: linear-gradient(180deg, #000 55%, transparent 100%); }
  .v11-ink-head .form-hero__head { padding-top: 0; margin-top: -28px; }
}
@media (max-width: 759.98px) {
  .v11-art--process { display: none; }
  .v11-how { overflow-x: clip; }
.v11-how .steps { margin-top: 28px; }
  .v11-step-art { display: block; height: 170px; margin: 0 -8px 4px; background: url("assets/v11/process.webp") no-repeat; background-size: 290% auto; -webkit-mask-image: radial-gradient(70% 80% at 50% 50%, #000 50%, transparent 80%); mask-image: radial-gradient(70% 80% at 50% 50%, #000 50%, transparent 80%); }
  .step:nth-child(1) .v11-step-art { background-position: 4% 58%; }
  .step:nth-child(2) .v11-step-art { background-position: 50% 58%; }
  .step:nth-child(3) .v11-step-art { background-position: 96% 62%; }
  .v11-art--scope { max-width: none; }
  .v11-aside-art { margin: -28px -28px 6px; }
  .v11-form-hero .form-hero__art { width: 72%; bottom: auto; height: 170px; background-position: 50% 62%; -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 45%), linear-gradient(180deg, #000 45%, transparent 100%); -webkit-mask-composite: source-in; mask-image: linear-gradient(90deg, transparent 0%, #000 45%), linear-gradient(180deg, #000 45%, transparent 100%); mask-composite: intersect; }
}

/* ---------- v1.1 illustration containers (static) ----------
   The one-shot light pass was removed at the owner's request; illustrations are static. */
.v11-art, .v11-step-art, .v11-form-hero .form-hero__art { overflow: hidden; }
.v11-step-art { position: relative; }
.v11-aside-art { position: relative; }