/* ============================================================================
   TourismRevenue — PUBLIC SITE KIT
   The citizen-facing layer: landing, register, rules, report, privacy. Loaded
   after app.css and built ONLY from its design tokens (--primary, --surface,
   --text, --border, the slate ramp …), so the palette variant and dark mode
   carry through without a second theme being maintained here. Scrims and the
   ink used over photographs are color-mixes of those same tokens.

   Vocabulary (modelled on the ibjx/amuwopay portal kit):
     .pshell        the centred column
     .phero--cover  full-bleed photographic hero with a gradient scrim
     .p-figs        live-figure tiles (overlap the hero on the landing page)
     .psteps        the "how it works" strip
     .pband         photographic section band, text one side / image the other
     .ptools        the four public tools
     .pfund         the dark transparency teaser
     .pgallery      the photo grid + its credit line
     .p-pagehero    slim photographic banner on inner pages
     .p-foot        footer incl. the photography credits
   ============================================================================ */

:root {
  --p-max:        1180px;
  --p-gutter:     clamp(16px, 4vw, 28px);
  /* Ink over a photograph is always light, whatever the theme. */
  --p-photo-ink:       var(--slate-50);
  --p-photo-ink-muted: var(--slate-300);
  --p-photo-ink-faint: var(--slate-400);
  /* The scrim is the deepest slate, mixed to taste. */
  --p-scrim:      var(--slate-900);
  --p-deep:       var(--primary-dk);
  --p-ease:       cubic-bezier(.22, .61, .36, 1);
}

/* ── Base ──────────────────────────────────────────────────────────────────── */
body.tr-site { margin:0; background:var(--bg); color:var(--text); font-family:var(--font); font-size:15px; line-height:1.6; min-height:100vh; min-height:100dvh; display:flex; flex-direction:column; -webkit-text-size-adjust:100%; overflow-x:clip; }
/* Headings take the page ink — except the ones that sit on a photograph, which
   must stay light whatever the theme. :where() keeps this rule at (0,1,1) so a
   component's own heading colour still wins by ordinary specificity. */
.tr-site :is(h1, h2, h3):not(:where(.phero__title, .p-pagehero .p-title, .pfund .psection__title)) { color:var(--text); }
.pshell { width:100%; max-width:var(--p-max); margin:0 auto; padding:0 var(--p-gutter); box-sizing:border-box; min-width:0; }
.p-skip { position:absolute; left:-9999px; }
.p-skip:focus { left:12px; top:12px; z-index:60; background:var(--surface); color:var(--text); padding:8px 12px; border-radius:var(--radius-sm); border:1px solid var(--border-strong); }
.num, .p-num { font-variant-numeric:tabular-nums; font-feature-settings:"tnum"; }
@media (prefers-reduced-motion: reduce) {
  .tr-site *, .tr-site *::before, .tr-site *::after { animation:none !important; transition:none !important; }
}

/* ── Header ────────────────────────────────────────────────────────────────── */
.p-head { position:sticky; top:0; z-index:40; background:color-mix(in srgb, var(--surface) 88%, transparent); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border-bottom:1px solid var(--border); }
.p-head__in { display:flex; align-items:center; gap:12px; height:66px; }
.p-brand { display:flex; align-items:center; gap:11px; text-decoration:none; color:var(--text); min-width:0; flex:none; }
.p-brand img { width:38px; height:38px; border-radius:10px; flex:none; }
.p-brand b { display:block; font-size:15.5px; line-height:1.15; letter-spacing:-.012em; font-weight:800; }
.p-brand small { display:block; font-size:10px; color:var(--text-muted); line-height:1.3; letter-spacing:.04em; text-transform:uppercase; font-weight:600; }
.p-nav { margin-left:auto; display:flex; align-items:center; gap:2px; min-width:0; }
.p-nav a { color:var(--text-muted); text-decoration:none; font-weight:600; font-size:13px; padding:9px 10px; border-radius:var(--radius-sm); white-space:nowrap; transition:background var(--transition), color var(--transition); }
.p-nav a:hover { color:var(--text); background:var(--surface-2); }
.p-nav .p-nav__extra { display:none; }
.p-head.is-open .p-nav .p-nav__extra { display:block; }
.p-nav a[aria-current="page"] { color:var(--primary-lt); background:color-mix(in srgb, var(--primary-lt) 10%, transparent); }
.p-head__act { display:flex; align-items:center; gap:8px; flex:none; }
.p-theme, .p-menu { background:none; border:1px solid var(--border); color:var(--text-muted); border-radius:var(--radius-sm); width:36px; height:36px; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; flex:none; transition:color var(--transition), border-color var(--transition); }
.p-theme:hover, .p-menu:hover { color:var(--text); border-color:var(--border-strong); }
.p-menu { display:none; }
.p-menu svg + svg { display:none; }
.p-head.is-open .p-menu svg { display:none; }
.p-head.is-open .p-menu svg + svg { display:block; }

/* ── Buttons ───────────────────────────────────────────────────────────────── */
.p-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; font-weight:650; font-size:13.5px; padding:10px 16px; border-radius:var(--radius-sm); text-decoration:none; border:1px solid var(--border-strong); background:var(--surface); color:var(--text); cursor:pointer; line-height:1.2; white-space:nowrap; transition:background var(--transition), border-color var(--transition), color var(--transition), transform .12s; }
.p-btn:hover { border-color:var(--primary-lt); color:var(--primary-lt); }
.p-btn:active { transform:translateY(1px); }
.p-btn--primary { background:var(--primary-lt); border-color:var(--primary-lt); color:var(--slate-50); }
.p-btn--primary:hover { background:color-mix(in srgb, var(--primary-lt) 86%, var(--slate-900)); border-color:color-mix(in srgb, var(--primary-lt) 86%, var(--slate-900)); color:var(--slate-50); }
.p-btn--light { background:var(--slate-50); border-color:var(--slate-50); color:var(--slate-900); }
.p-btn--light:hover { background:var(--slate-200); border-color:var(--slate-200); color:var(--slate-900); }
.p-btn--ghost { background:transparent; border-color:color-mix(in srgb, var(--slate-50) 45%, transparent); color:var(--p-photo-ink); }
.p-btn--ghost:hover { border-color:var(--slate-50); color:var(--slate-50); background:color-mix(in srgb, var(--slate-50) 10%, transparent); }
.p-btn--lg { font-size:14.5px; padding:13px 22px; border-radius:var(--radius); }
.p-btn--block { width:100%; }
.p-btn[disabled], .p-btn--disabled { opacity:.55; cursor:not-allowed; pointer-events:none; }

/* ── Page frame ────────────────────────────────────────────────────────────── */
.p-main { flex:1; width:100%; max-width:var(--p-max); margin:0 auto; padding:26px var(--p-gutter) 56px; box-sizing:border-box; min-width:0; }
.p-main--narrow { max-width:860px; }
/* Doubled class so the phone breakpoint's .p-main padding cannot out-order it:
   a bleed page must stay edge to edge at every width. */
.p-main.p-main--bleed { max-width:none; padding:0; }
.p-crumb { display:flex; gap:6px; align-items:center; font-size:12.5px; color:var(--text-muted); margin:0 0 12px; flex-wrap:wrap; }
.p-crumb a { color:var(--text-muted); text-decoration:none; }
.p-crumb a:hover { color:var(--primary-lt); text-decoration:underline; }
.p-title { font-size:clamp(26px, 3.4vw, 34px); line-height:1.15; margin:0 0 10px; letter-spacing:-.022em; font-weight:800; }
.p-lead { margin:0 0 22px; color:var(--text-muted); font-size:15.5px; line-height:1.65; max-width:70ch; }
.p-kicker { display:block; font-size:11.5px; font-weight:750; letter-spacing:.12em; text-transform:uppercase; color:var(--primary-lt); margin-bottom:10px; }
.p-sec-title { font-size:12px; font-weight:750; letter-spacing:.1em; text-transform:uppercase; color:var(--text-muted); margin:28px 0 12px; }

/* Inner-page hero (slim, optionally photographic) */
.p-pagehero { position:relative; background:var(--p-deep); color:var(--p-photo-ink); overflow:hidden; isolation:isolate; }
.p-pagehero__bg { position:absolute; inset:0; z-index:0; }
.p-pagehero__bg img { width:100%; height:100%; object-fit:cover; display:block; }
.p-pagehero__bg::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg, color-mix(in srgb, var(--p-scrim) 84%, transparent) 0%, color-mix(in srgb, var(--p-scrim) 62%, transparent) 55%, color-mix(in srgb, var(--p-scrim) 40%, transparent) 100%); }
.p-pagehero__in { position:relative; z-index:1; padding:clamp(30px, 5vw, 56px) var(--p-gutter) clamp(32px, 5vw, 60px); }
.p-pagehero .p-crumb, .p-pagehero .p-crumb a { color:var(--p-photo-ink-muted); }
.p-pagehero .p-crumb a:hover { color:var(--slate-50); }
.p-pagehero .p-kicker { color:var(--slate-50); opacity:.85; }
.p-pagehero .p-title { color:var(--slate-50); margin-bottom:8px; max-width:24ch; }
.p-pagehero .p-lead { color:var(--p-photo-ink-muted); margin:0; max-width:64ch; }
.p-pagehero__credit { position:absolute; right:var(--p-gutter); bottom:8px; z-index:2; font-size:10.5px; color:var(--p-photo-ink-muted); }
.p-pagehero__credit a { color:inherit; text-decoration:underline; }
.p-pagehero + .p-main { padding-top:28px; }

/* ── Cards, links, figures (shared by every inner page) ────────────────────── */
.p-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:22px 24px; margin-bottom:16px; min-width:0; box-shadow:var(--shadow); }
.p-card--flush { padding:0; overflow:hidden; }
.p-card h2 { font-size:18px; margin:0 0 6px; letter-spacing:-.014em; font-weight:750; }
.p-card h3 { font-size:14.5px; margin:18px 0 6px; font-weight:700; }
/* A card that sits under a section's h2 heads itself with an h3 (the outline
   must not skip a level) but is styled as the card's title, not a sub-heading. */
.p-card .p-card__title { font-size:18px; margin:0 0 6px; letter-spacing:-.014em; font-weight:750; }
.p-card p { font-size:14.5px; line-height:1.7; color:var(--text-muted); margin:0 0 12px; max-width:74ch; }
.p-card p:last-child { margin-bottom:0; }
.p-card ul, .p-card ol { font-size:14.5px; line-height:1.7; color:var(--text-muted); margin:0 0 12px; padding-left:20px; max-width:74ch; }
.p-card li { margin-bottom:6px; }
.p-card strong, .p-card b { color:var(--text); font-weight:650; }

.p-links { display:grid; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); gap:14px; }
.p-link { display:block; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:18px 18px 16px; text-decoration:none; color:var(--text); min-width:0; transition:border-color var(--transition), transform .18s var(--p-ease), box-shadow var(--transition); }
a.p-link:hover { border-color:var(--primary-lt); transform:translateY(-2px); box-shadow:var(--shadow-md); }
.p-link__i { color:var(--primary-lt); display:inline-flex; width:38px; height:38px; align-items:center; justify-content:center; border-radius:10px; background:color-mix(in srgb, var(--primary-lt) 10%, transparent); margin-bottom:12px; }
.p-link b { display:block; font-size:15px; margin-bottom:6px; line-height:1.35; font-weight:700; letter-spacing:-.01em; }
.p-link span { display:block; font-size:13.5px; color:var(--text-muted); line-height:1.58; }
.p-link i { display:block; margin-top:12px; font-style:normal; font-weight:650; font-size:13px; color:var(--primary-lt); }

.p-figs { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:14px; margin-bottom:16px; }
.p-fig { background:var(--surface); border:1px solid var(--border); border-top:3px solid var(--primary-lt); border-radius:var(--radius-lg); padding:18px 19px 16px; min-width:0; box-shadow:var(--shadow); }
.p-fig--muted { border-top-color:var(--border-strong); }
.p-fig--success { border-top-color:var(--success); }
.p-fig--info { border-top-color:var(--info); }
.p-fig--warning { border-top-color:var(--warning); }
.p-fig--accent { border-top-color:var(--accent); }
.p-fig__l { display:block; font-size:11px; font-weight:750; letter-spacing:.08em; text-transform:uppercase; color:var(--text-muted); }
.p-fig__v { display:block; font-size:clamp(24px, 2.4vw, 30px); font-weight:800; letter-spacing:-.03em; margin:8px 0 5px; font-variant-numeric:tabular-nums; font-feature-settings:"tnum"; word-break:break-word; line-height:1.08; }
.p-fig__v--words { font-size:14.5px; font-weight:650; letter-spacing:0; line-height:1.45; color:var(--text-muted); }
.p-fig__n { display:block; font-size:12px; color:var(--text-muted); line-height:1.5; }

.p-kv { display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:14px 20px; margin:0; }
.p-kv dt { font-size:11px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--text-muted); margin:0 0 4px; }
.p-kv dd { margin:0; font-size:14.5px; font-weight:600; line-height:1.45; word-break:break-word; }
.p-kv dd .p-mono { font-weight:650; }

.p-pill { display:inline-flex; align-items:center; gap:5px; font-size:11.5px; font-weight:700; padding:3px 9px; border-radius:999px; border:1px solid var(--border-strong); background:var(--surface-2); color:var(--text-muted); white-space:nowrap; }
.p-pill--success { background:var(--success-bg); border-color:var(--success); color:var(--success); }
.p-pill--warning { background:var(--warning-bg); border-color:var(--warning); color:var(--warning); }
.p-pill--danger  { background:var(--danger-bg);  border-color:var(--danger);  color:var(--danger); }
.p-pill--info    { background:var(--info-bg);    border-color:var(--info);    color:var(--info); }

.p-note { font-size:13.5px; line-height:1.68; color:var(--text-muted); background:var(--surface-2); border:1px dashed var(--border-strong); border-radius:var(--radius); padding:14px 16px; margin:0 0 16px; }
.p-note b { color:var(--text); }
.p-note--info    { background:var(--info-bg);    border-style:solid; border-color:var(--info); }
.p-note--warning { background:var(--warning-bg); border-style:solid; border-color:var(--warning); }
.p-note--danger  { background:var(--danger-bg);  border-style:solid; border-color:var(--danger); }
.p-empty { font-size:13.5px; line-height:1.68; color:var(--text-muted); margin:0; }

.p-scroll { overflow-x:auto; -webkit-overflow-scrolling:touch; max-width:100%; }
.p-table { width:100%; border-collapse:collapse; font-size:13.5px; }
.p-table th { text-align:left; font-size:10.5px; text-transform:uppercase; letter-spacing:.07em; color:var(--text-muted); font-weight:750; padding:9px 10px; border-bottom:1px solid var(--border); }
.p-table td { padding:10px; border-bottom:1px solid var(--border); vertical-align:top; line-height:1.5; overflow-wrap:anywhere; }
.p-table tr:last-child td { border-bottom:none; }
.p-table .num, .p-table th.num { text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
.p-mono { font-family:ui-monospace, Consolas, 'SF Mono', monospace; font-size:12.5px; letter-spacing:-.01em; }

.p-bars { display:grid; gap:10px; }
.p-bar { display:grid; grid-template-columns:minmax(90px, 1fr) 3fr auto; gap:10px; align-items:center; font-size:13.5px; }
.p-bar__t { color:var(--text); font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.p-bar__r { height:8px; border-radius:999px; background:var(--surface-2); border:1px solid var(--border); overflow:hidden; }
.p-bar__r i { display:block; height:100%; background:linear-gradient(90deg, var(--primary-lt), color-mix(in srgb, var(--primary-lt) 70%, var(--accent))); border-radius:999px; }
.p-bar__n { color:var(--text-muted); font-variant-numeric:tabular-nums; font-size:12.5px; min-width:3ch; text-align:right; }

/* register grid inside a flush card (the shared data_table component) */
.p-card--flush .grid { padding:14px 16px 4px; }
.p-op { display:flex; flex-direction:column; gap:2px; min-width:0; }
.p-op b { font-size:13.5px; font-weight:650; }
.p-op a { color:var(--text); text-decoration:none; }
.p-op a:hover { color:var(--primary-lt); text-decoration:underline; }
.p-op small { color:var(--text-muted); font-size:11.5px; }

/* forms */
.p-form { display:grid; gap:16px; max-width:640px; }
.p-form .field-control { width:100%; box-sizing:border-box; }
.p-form__row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.p-hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.p-err { font-size:12.5px; color:var(--danger); margin:5px 0 0; }
.p-verify { display:flex; gap:10px; flex-wrap:wrap; align-items:flex-end; }
.p-verify .field { flex:1 1 240px; margin:0; }
.p-qr { display:flex; gap:18px; align-items:center; flex-wrap:wrap; }
.p-qr img { width:132px; height:132px; border-radius:var(--radius); border:1px solid var(--border); background:var(--slate-50); padding:6px; box-sizing:border-box; }

/* faq */
.p-faq { border-top:1px solid var(--border); }
.p-faq details { border-bottom:1px solid var(--border); }
.p-faq summary { cursor:pointer; padding:15px 2px; font-weight:650; font-size:14.5px; list-style:none; display:flex; gap:10px; align-items:flex-start; }
.p-faq summary::-webkit-details-marker { display:none; }
.p-faq summary::before { content:'+'; color:var(--primary-lt); font-weight:800; flex:none; width:14px; }
.p-faq details[open] summary::before { content:'\2212'; }
.p-faq p { font-size:14px; line-height:1.72; color:var(--text-muted); margin:0 0 14px; padding-left:24px; max-width:74ch; }

/* ── Landing: the photographic hero ───────────────────────────────────────── */
.phero { position:relative; background:var(--p-deep); color:var(--p-photo-ink); overflow:hidden; isolation:isolate; }
.phero__bg { position:absolute; inset:0; z-index:0; }
.phero__bg img { width:100%; height:100%; object-fit:cover; object-position:center 40%; display:block; animation:phero-settle 1.4s var(--p-ease) both; }
/* The scrim is deepest where the copy sits (top-left) and eases off towards
   the sky on the right. Its floor is set by the lead paragraph, 16px body text
   that has to clear 4.5:1 against the brightest pixel under it on a phone —
   the mid stops below are the lightest that do. */
.phero__bg::after { content:""; position:absolute; inset:0;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--p-scrim) 55%, transparent) 0%, color-mix(in srgb, var(--p-scrim) 40%, transparent) 40%, color-mix(in srgb, var(--p-scrim) 82%, transparent) 100%),
    linear-gradient(90deg, color-mix(in srgb, var(--p-scrim) 78%, transparent) 0%, color-mix(in srgb, var(--p-scrim) 62%, transparent) 60%, color-mix(in srgb, var(--p-scrim) 30%, transparent) 100%); }
.phero__in { position:relative; z-index:1; padding-top:clamp(64px, 9vw, 120px); padding-bottom:clamp(120px, 14vw, 176px); }
.phero__copy { max-width:760px; animation:phero-copy .9s var(--p-ease) .25s both; }
.phero__marks { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:22px; }
.p-mark { display:inline-flex; align-items:center; gap:7px; font-size:11.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--slate-50); background:color-mix(in srgb, var(--slate-900) 38%, transparent); border:1px solid color-mix(in srgb, var(--slate-50) 28%, transparent); border-radius:999px; padding:6px 12px 6px 9px; backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
.p-mark svg { color:var(--accent); }
/* Two classes deep on purpose: the h1 must out-specify the site's generic
   heading rule or it inherits the page ink and vanishes into the scrim. */
.phero .phero__title { font-size:clamp(34px, 5.4vw, 62px); line-height:1.04; letter-spacing:-.034em; font-weight:800; margin:0 0 18px; color:var(--slate-50); text-wrap:balance; }
.phero__title em { font-style:normal; color:color-mix(in srgb, var(--accent) 85%, var(--slate-50)); }
.phero__sub { font-size:clamp(16px, 1.7vw, 19.5px); line-height:1.6; color:var(--slate-200); max-width:640px; margin:0 0 30px; }
.phero__sub b { color:var(--slate-50); font-weight:650; }
.phero__cta { display:flex; flex-wrap:wrap; gap:12px; }
.phero__credit, .p-pagehero__credit { background:color-mix(in srgb, var(--slate-900) 70%, transparent); border-radius:999px; padding:3px 9px; }
/* Positioned against .phero__in (the centred column), so on a wide screen the
   credit lines up with the copy's right edge; the bottom offset clears the
   figure tiles that overlap the hero's foot. */
.phero__credit { position:absolute; right:var(--p-gutter); bottom:calc(clamp(120px, 14vw, 176px) - 30px); z-index:1; font-size:10.5px; color:var(--slate-200); text-align:right; }
.phero__credit a { color:inherit; text-decoration:underline; }
@keyframes phero-settle { from { opacity:0; } to { opacity:1; } }
@keyframes phero-copy { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:none; } }

/* Live figures overlap the hero's foot. */
.pfigs { position:relative; z-index:2; margin-top:-96px; }
.pfigs .p-figs { margin-bottom:0; }
.pfigs .p-fig { box-shadow:var(--shadow-lg); }
.pfigs__asat { display:flex; flex-wrap:wrap; gap:8px 16px; align-items:center; justify-content:space-between; font-size:12.5px; color:var(--text-muted); margin:14px 2px 0; }
.pfigs__asat a { color:var(--primary-lt); text-decoration:none; font-weight:650; }
.pfigs__asat a:hover { text-decoration:underline; }

/* ── Sections ──────────────────────────────────────────────────────────────── */
.psection { padding:clamp(48px, 6vw, 84px) 0; }
.psection--tight { padding-top:clamp(32px, 4vw, 48px); }
.psection--alt { background:var(--surface); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.psection__head { max-width:720px; margin-bottom:clamp(24px, 3vw, 36px); }
.psection__head--row { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; max-width:none; flex-wrap:wrap; }
.psection__title { font-size:clamp(24px, 3vw, 36px); line-height:1.12; letter-spacing:-.028em; font-weight:800; margin:0 0 12px; text-wrap:balance; }
.psection__sub { color:var(--text-muted); font-size:15.5px; line-height:1.65; margin:0; max-width:64ch; }

/* How it works */
.psteps { display:grid; grid-template-columns:repeat(5, minmax(0, 1fr)); gap:14px; counter-reset:step; }
.pstep { position:relative; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:20px 18px 18px; min-width:0; }
.pstep::before { counter-increment:step; content:counter(step, decimal-leading-zero); display:block; font-size:12px; font-weight:800; letter-spacing:.1em; color:var(--primary-lt); margin-bottom:12px; font-variant-numeric:tabular-nums; }
.pstep__i { position:absolute; top:16px; right:16px; color:var(--primary-lt); opacity:.85; }
.pstep b { display:block; font-size:15px; font-weight:750; letter-spacing:-.01em; margin-bottom:6px; line-height:1.3; }
.pstep span { display:block; font-size:13.5px; color:var(--text-muted); line-height:1.58; }
.pstep:not(:last-child)::after { content:""; position:absolute; top:50%; right:-14px; width:14px; height:1px; background:var(--border-strong); }

/* Photographic bands */
.pband { display:grid; grid-template-columns:1.05fr 1fr; gap:0; background:var(--surface); border:1px solid var(--border); border-radius:calc(var(--radius-lg) + 4px); overflow:hidden; box-shadow:var(--shadow-md); }
.pband + .pband { margin-top:clamp(20px, 3vw, 32px); }
.pband--reverse .pband__media { order:2; }
.pband__media { position:relative; min-height:300px; background:var(--p-deep); }
.pband__media img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.pband__media figcaption { position:absolute; left:0; right:0; bottom:0; padding:28px 18px 10px; font-size:10.5px; color:var(--p-photo-ink-faint); background:linear-gradient(180deg, transparent, color-mix(in srgb, var(--p-scrim) 70%, transparent)); text-align:right; }
.pband__media figcaption a { color:inherit; text-decoration:underline; }
.pband__body { padding:clamp(26px, 3.6vw, 48px); display:flex; flex-direction:column; justify-content:center; min-width:0; }
.pband__title { font-size:clamp(22px, 2.6vw, 30px); line-height:1.15; letter-spacing:-.024em; font-weight:800; margin:0 0 12px; text-wrap:balance; }
.pband__text { color:var(--text-muted); font-size:15px; line-height:1.68; margin:0 0 10px; max-width:56ch; }
.pband__list { margin:8px 0 0; padding:0; list-style:none; display:grid; gap:9px; }
.pband__list li { display:flex; gap:10px; align-items:flex-start; font-size:14px; line-height:1.55; color:var(--text-muted); }
.pband__list li svg { flex:none; color:var(--success); margin-top:3px; }
.pband__list li b { color:var(--text); font-weight:650; }
.pband__cta { display:flex; flex-wrap:wrap; gap:10px; margin-top:22px; }

/* Audience cards */
.paud { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:14px; }
.paud .p-link { display:flex; flex-direction:column; }
.paud .p-link i { margin-top:auto; padding-top:12px; }

/* Public tools */
.ptools { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:14px; }
.ptool { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:20px 20px 18px; min-width:0; display:flex; flex-direction:column; text-decoration:none; color:var(--text); transition:border-color var(--transition), transform .18s var(--p-ease), box-shadow var(--transition); }
a.ptool:hover { border-color:var(--primary-lt); transform:translateY(-2px); box-shadow:var(--shadow-md); }
.ptool__ic { display:inline-flex; width:42px; height:42px; align-items:center; justify-content:center; border-radius:12px; background:color-mix(in srgb, var(--primary-lt) 12%, transparent); color:var(--primary-lt); margin-bottom:14px; }
.ptool__ic--success { background:color-mix(in srgb, var(--success) 12%, transparent); color:var(--success); }
.ptool__ic--accent { background:color-mix(in srgb, var(--accent) 16%, transparent); color:color-mix(in srgb, var(--accent) 70%, var(--text)); }
.ptool__ic--warning { background:color-mix(in srgb, var(--warning) 12%, transparent); color:var(--warning); }
.ptool b { display:block; font-size:16px; font-weight:750; letter-spacing:-.012em; margin-bottom:6px; line-height:1.3; }
.ptool > span { display:block; font-size:13.5px; color:var(--text-muted); line-height:1.58; }
.ptool i { display:block; margin-top:auto; padding-top:14px; font-style:normal; font-weight:650; font-size:13px; color:var(--primary-lt); }
.ptool__form { margin-top:14px; display:flex; gap:8px; }
.ptool__form input { flex:1; min-width:0; font:inherit; font-size:13px; padding:9px 11px; border:1px solid var(--border-strong); border-radius:var(--radius-sm); background:var(--bg); color:var(--text); }
.ptool__form input:focus { outline:2px solid var(--primary-lt); outline-offset:1px; border-color:var(--primary-lt); }
.ptool__form .p-btn { padding:9px 12px; }

/* The fund teaser (a dark band in both themes) */
.pfund { position:relative; background:var(--p-deep); color:var(--p-photo-ink); overflow:hidden; isolation:isolate; }
.pfund__bg { position:absolute; inset:0; z-index:0; }
.pfund__bg img { width:100%; height:100%; object-fit:cover; display:block; opacity:.28; }
.pfund__bg::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg, color-mix(in srgb, var(--p-deep) 96%, transparent) 0%, color-mix(in srgb, var(--p-deep) 78%, transparent) 60%, color-mix(in srgb, var(--p-deep) 55%, transparent) 100%); }
.pfund__in { position:relative; z-index:1; padding:clamp(48px, 6vw, 84px) var(--p-gutter); }
.pfund .p-kicker { color:color-mix(in srgb, var(--accent) 85%, var(--slate-50)); }
.pfund .psection__title, .pfund .psection__sub { color:var(--slate-50); }
.pfund .psection__sub { color:var(--p-photo-ink-muted); }
.pfund__grid { display:grid; grid-template-columns:repeat(5, minmax(0, 1fr)); gap:12px; margin:clamp(24px, 3vw, 36px) 0 22px; }
.pfund__cell { background:color-mix(in srgb, var(--slate-50) 8%, transparent); border:1px solid color-mix(in srgb, var(--slate-50) 16%, transparent); border-radius:var(--radius-lg); padding:16px 14px 14px; min-width:0; backdrop-filter:blur(4px); }
.pfund__cell--flow { border-top:3px solid var(--accent); }
.pfund__l { display:block; font-size:10.5px; font-weight:750; letter-spacing:.09em; text-transform:uppercase; color:var(--p-photo-ink-muted); }
.pfund__v { display:block; font-size:clamp(17px, 1.45vw, 21px); font-weight:800; letter-spacing:-.03em; margin:8px 0 4px; color:var(--slate-50); font-variant-numeric:tabular-nums; font-feature-settings:"tnum"; word-break:break-word; line-height:1.1; }
.pfund__v--words { font-size:13.5px; font-weight:600; letter-spacing:0; line-height:1.45; color:var(--p-photo-ink-muted); }
.pfund__n { display:block; font-size:11.5px; color:var(--p-photo-ink-faint); line-height:1.45; }
.pfund__foot { display:flex; flex-wrap:wrap; gap:12px 20px; align-items:center; font-size:12.5px; color:var(--p-photo-ink-muted); }

/* Coverage: two columns of bars */
.pcov { display:grid; grid-template-columns:1fr 1fr; gap:16px; }

/* Gallery */
.pgallery { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:14px; }
.pgallery__card { position:relative; margin:0; border-radius:var(--radius-lg); overflow:hidden; background:var(--p-deep); aspect-ratio:4 / 3; box-shadow:var(--shadow); }
.pgallery__card img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .5s var(--p-ease); }
.pgallery__card:hover img { transform:scale(1.045); }
.pgallery__card figcaption { position:absolute; left:0; right:0; bottom:0; padding:34px 14px 12px; color:var(--slate-50); background:linear-gradient(180deg, transparent, color-mix(in srgb, var(--p-scrim) 82%, transparent)); display:flex; flex-direction:column; gap:2px; }
.pgallery__card figcaption b { font-size:13.5px; font-weight:700; letter-spacing:-.01em; }
.pgallery__card figcaption span { font-size:11.5px; color:var(--p-photo-ink-muted); line-height:1.4; }
.pgallery__card--wide { grid-column:span 2; aspect-ratio:auto; }
.pgallery__credit { margin:16px 0 0; font-size:12px; color:var(--text-muted); line-height:1.65; }
.pgallery__credit a { color:inherit; text-decoration:underline; }
.pgallery__credit a:hover { color:var(--primary-lt); }

/* Rules teaser */
.prules { display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(20px, 3vw, 36px); align-items:start; }
.prules__list { display:grid; gap:8px; }
.prules__item { display:flex; gap:14px; align-items:center; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:13px 16px; text-decoration:none; color:var(--text); min-width:0; transition:border-color var(--transition); }
.prules__item:hover { border-color:var(--primary-lt); }
.prules__item svg { flex:none; color:var(--primary-lt); }
.prules__item b { display:block; font-size:14.5px; font-weight:700; letter-spacing:-.01em; }
.prules__item span { display:block; font-size:12.5px; color:var(--text-muted); line-height:1.5; }
.prules__item > div { min-width:0; }

/* ── Footer ────────────────────────────────────────────────────────────────── */
.p-foot { background:var(--surface); border-top:1px solid var(--border); margin-top:auto; }
.p-foot__in { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:28px; padding:44px var(--p-gutter) 30px; }
.p-foot__brand { display:flex; align-items:center; gap:11px; margin-bottom:14px; }
.p-foot__brand img { width:40px; height:40px; border-radius:10px; }
.p-foot__brand b { display:block; font-size:16px; font-weight:800; letter-spacing:-.012em; }
.p-foot__brand small { display:block; font-size:10.5px; color:var(--text-muted); letter-spacing:.06em; text-transform:uppercase; font-weight:600; }
.p-foot__desc { font-size:13.5px; line-height:1.68; color:var(--text-muted); max-width:44ch; margin:0 0 14px; }
.p-foot__head { font-size:11.5px; font-weight:750; letter-spacing:.1em; text-transform:uppercase; color:var(--text); margin-bottom:12px; }
.p-foot__col a, .p-foot__col span { display:block; font-size:13.5px; color:var(--text-muted); text-decoration:none; padding:4px 0; line-height:1.5; }
.p-foot__col a:hover { color:var(--primary-lt); }
.p-foot__marks { display:flex; flex-wrap:wrap; gap:8px; }
.p-foot__marks .p-mark { color:var(--text); background:var(--surface-2); border-color:var(--border); backdrop-filter:none; }
.p-foot__marks .p-mark svg { color:var(--primary-lt); }
.p-foot__photo { border-top:1px solid var(--border); padding:20px var(--p-gutter) 6px; }
.p-foot__photo summary { cursor:pointer; list-style:none; font-size:12.5px; font-weight:650; color:var(--text-muted); display:inline-flex; align-items:center; gap:8px; }
.p-foot__photo summary::-webkit-details-marker { display:none; }
.p-foot__photo summary:hover { color:var(--primary-lt); }
.p-foot__photo details[open] summary { color:var(--text); margin-bottom:10px; }
.p-foot__photo p { font-size:12px; color:var(--text-muted); line-height:1.7; margin:0 0 8px; max-width:none; }
.p-foot__credits { display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:4px 22px; margin:0; padding:0; list-style:none; font-size:12px; color:var(--text-muted); line-height:1.6; }
.p-foot__credits a { color:inherit; text-decoration:underline; }
.p-foot__credits a:hover { color:var(--primary-lt); }
.p-foot__legal { border-top:1px solid var(--border); padding:16px var(--p-gutter) 26px; font-size:12px; color:var(--text-faint); line-height:1.7; display:flex; flex-wrap:wrap; gap:8px 24px; justify-content:space-between; }
.p-foot__legal a { color:var(--text-muted); text-decoration:none; }
.p-foot__legal a:hover { color:var(--primary-lt); }

/* ── Responsive ────────────────────────────────────────────────────────────── */
@media (max-width:1100px) {
  .psteps { grid-template-columns:repeat(3, minmax(0, 1fr)); }
  .pstep::after { display:none; }
  .paud, .ptools, .pgallery { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .pfund__grid { grid-template-columns:repeat(3, minmax(0, 1fr)); }
  .p-foot__in { grid-template-columns:1.6fr 1fr 1fr; }
}
@media (max-width:1160px) {
  .p-menu { display:inline-flex; }
  .p-nav { position:absolute; left:0; right:0; top:100%; background:var(--surface); border-bottom:1px solid var(--border); flex-direction:column; align-items:stretch; padding:8px var(--p-gutter) 14px; gap:2px; display:none; box-shadow:var(--shadow-lg); }
  .p-head.is-open .p-nav { display:flex; }
  .p-nav a { padding:12px 10px; font-size:15px; }
  .p-head__act { margin-left:auto; }
  .p-figs { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .pfigs { margin-top:-72px; }
  .pband, .pband--reverse { grid-template-columns:1fr; }
  .pband--reverse .pband__media { order:0; }
  .pband__media { min-height:240px; aspect-ratio:16 / 9; }
  .prules { grid-template-columns:1fr; }
  .pcov { grid-template-columns:1fr; }
  .p-foot__in { grid-template-columns:1fr 1fr; }
  /* No room in the corner on a phone or tablet: the credit reflows into the
     column under the buttons, so the photograph is still credited where it is
     shown, not only in the footer. */
  .phero__credit { position:static; display:inline-block; margin:18px 0 0; text-align:left; font-size:11px; line-height:1.5; padding:4px 10px; border-radius:var(--radius-sm); max-width:100%; box-sizing:border-box; }
}
@media (max-width:640px) {
  .p-head__in { height:60px; }
  .p-head__act .p-btn--primary { display:none; }
  .p-brand small { display:none; }
  .p-main { padding:20px var(--p-gutter) 40px; }
  .p-card { padding:18px 16px; }
  .p-figs, .psteps, .paud, .ptools, .pgallery { grid-template-columns:1fr; }
  .pgallery__card--wide { grid-column:auto; aspect-ratio:4 / 3; }
  .pfund__grid { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .pfund__cell:first-child { grid-column:span 2; }
  .p-form__row { grid-template-columns:1fr; }
  .p-foot__in { grid-template-columns:1fr; gap:22px; padding-top:34px; }
  .p-bar { grid-template-columns:minmax(70px, 1fr) 2fr auto; }
  .phero__in { padding-top:56px; padding-bottom:110px; }
  .pfigs { margin-top:-64px; }
  .phero__cta .p-btn { flex:1 1 auto; }
  .p-pagehero .p-title { max-width:none; }
}
@media (max-width:400px) {
  .pfund__grid { grid-template-columns:1fr; }
  .pfund__cell:first-child { grid-column:auto; }
}