/* Photographic V3: both themes share the approved grid and live typography. */
:root[data-theme] .hero:after{display:none}
:root[data-theme] .hero-art{-webkit-mask-image:none;mask-image:none}
:root[data-theme] .hero-art img{object-fit:contain;object-position:right bottom}
:root[data-theme] .hero h1{max-width:100%;font-size:clamp(42px,3.6vw,48px);line-height:1.08}
:root[data-theme] .hero h1 span{display:inline;font-size:1em;line-height:inherit;margin:0}
:root[data-theme] .hero-eyebrow,:root[data-theme] .hero-description,:root[data-theme] .hero-actions,:root[data-theme] .hero-meta{max-width:100%}
:root[data-theme] .hero-eyebrow{font-size:13px;letter-spacing:.055em}
:root[data-theme] .hero-actions{flex-wrap:wrap;gap:14px 24px}
/* Alpha fades blend the light artwork into the section, including wide screens.
   Keep the portrait and meeting intact; only the outer background edges fade. */
:root[data-theme="light"] .hero-art{
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 48px),linear-gradient(90deg,transparent,#000 44px,#000 calc(100% - 44px),transparent);
  mask-image:linear-gradient(180deg,transparent,#000 48px),linear-gradient(90deg,transparent,#000 44px,#000 calc(100% - 44px),transparent);
  -webkit-mask-composite:source-in;
  mask-composite:intersect;
}

@media(min-width:981px){
  :root[data-theme] .hero{min-height:clamp(760px,calc(50vw + 112px),912px);padding-top:172px;padding-bottom:64px}
  /* Reuse the same .container as every section below; only its first column holds copy. */
  :root[data-theme] .hero-inner{display:grid;grid-template-columns:43% minmax(0,1fr)}
  :root[data-theme] .hero-inner>*{grid-column:1}
  :root[data-theme] .hero-art{inset:auto 0 0;width:min(100%,1600px);height:auto;aspect-ratio:2 / 1;max-height:none;margin-inline:auto}
  :root[data-theme] .hero-description{font-size:18px}
  :root[data-theme] .hero-meta{font-size:14px;flex-direction:column;gap:8px}
}
@media(min-width:1601px){
  /* Blend only the artwork edges into the full-width navy section. */
  :root[data-theme="dark"] .hero-art:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#030528,transparent 7%,transparent 94%,#030528),linear-gradient(180deg,#030528,transparent 24px)}
}
@media(max-width:980px){
  :root[data-theme] .hero{display:flex;flex-direction:column;min-height:0;padding-bottom:0}
  :root[data-theme] .hero-inner{order:0}
  :root[data-theme] .hero h1{max-width:740px;font-size:clamp(36px,6.5vw,58px)}
  :root[data-theme] .hero-art{position:relative;inset:auto;order:1;z-index:0;display:block;width:100%;height:auto;max-height:none;aspect-ratio:2 / 1;margin-top:30px;opacity:1}
  :root[data-theme] .hero-art img{height:100%;width:100%}
  :root[data-theme] .hero-meta{background:none;padding:0}
}
@media(max-width:767px){
  :root[data-theme] .hero h1{font-size:clamp(36px,9.6vw,46px)}
  :root[data-theme] .hero-description{max-width:370px}
  :root[data-theme] .hero-art{aspect-ratio:4 / 3;overflow:hidden}
  /* Crop only the empty left portion on mobile; keep the full right-side group. */
  :root[data-theme] .hero-art img{object-fit:cover;object-position:right center}
  :root[data-theme="light"] .hero-art{
    -webkit-mask-image:linear-gradient(180deg,transparent,#000 38px);
    mask-image:linear-gradient(180deg,transparent,#000 38px);
  }
}

/* Event facts form an open editorial signature below the purchase actions. */
:root[data-theme] .hero-meta{
  --hero-fact-accent:var(--blue);--hero-fact-ink:#030528;--hero-fact-muted:#414b64;
  position:relative;display:grid;gap:19px;width:100%;margin-top:35px;padding:25px 0 0;
  border-radius:0;background:none;color:var(--hero-fact-ink);
}
:root[data-theme="dark"] .hero-meta{--hero-fact-accent:var(--yellow);--hero-fact-ink:#f5f8ff;--hero-fact-muted:#d5def0}
.hero-meta::before{content:"";position:absolute;top:0;left:0;width:46px;height:3px;background:var(--hero-fact-accent);transform:skewX(-30deg)}
.hero-meta .hero-event-date{display:flex;align-items:center;flex-wrap:wrap;gap:12px 18px;margin:0;color:var(--hero-fact-accent)}
.hero-meta .hero-event-date>strong{font-size:clamp(46px,4.1vw,58px);font-weight:500;line-height:1;letter-spacing:-.065em;white-space:nowrap;font-variant-numeric:tabular-nums}
.hero-meta .hero-event-date>strong>span{font-size:.5em;font-weight:400;letter-spacing:-.025em}
.hero-meta .hero-date-month{font-size:18px;font-weight:500;line-height:1.3;letter-spacing:-.015em;color:var(--hero-fact-ink)}
.hero-meta .hero-event-venue{min-width:0}
.hero-meta .hero-event-venue>strong{display:block;font-size:23px;font-weight:500;line-height:1.2;letter-spacing:-.025em}
.hero-meta .hero-event-venue>p{max-width:400px;margin-top:8px;color:var(--hero-fact-muted);font-size:14px;line-height:1.55;text-wrap:pretty}
@media(max-width:980px){
  :root[data-theme] .hero-meta{max-width:540px;gap:17px;margin-top:32px;padding-top:23px}
}
@media(max-width:767px){
  .hero-meta .hero-event-date>strong{font-size:50px}
  .hero-meta .hero-date-month{font-size:17px}
  .hero-meta .hero-event-venue>strong{font-size:22px}
  .hero-meta .hero-event-venue>p{max-width:360px;font-size:14px}
}
@media(max-width:374px){
  .hero-meta .hero-event-date{gap:12px}
  .hero-meta .hero-event-date>strong{font-size:44px}
  .hero-meta .hero-date-month{font-size:16px}
  .hero-meta .hero-event-venue>strong{font-size:21px}
}

/* Fair photography uses the same grid with a readable, theme-aware edge fade. */
:root[data-theme] .hero[data-scene="fair"] { --hero-scene-rgb: 241,242,244; }
:root[data-theme="dark"] .hero[data-scene="fair"] { --hero-scene-rgb: 3,5,40; }
:root[data-theme="dark"][data-palette="blue"] .hero[data-scene="fair"] { --hero-scene-rgb: 3,12,46; }
:root[data-theme] .hero[data-scene="fair"] .hero-art {
  -webkit-mask-image:none;
  mask-image:none;
}
:root[data-theme] .hero[data-scene="fair"] .hero-art img {
  object-fit:cover;
  object-position:right center;
}
:root[data-theme] .hero[data-scene="fair"] .hero-art:after {
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(var(--hero-scene-rgb),1),rgba(var(--hero-scene-rgb),.98) 20%,rgba(var(--hero-scene-rgb),.94) 34%,rgba(var(--hero-scene-rgb),.7) 44%,rgba(var(--hero-scene-rgb),0) 62%,rgba(var(--hero-scene-rgb),0) 95%,rgba(var(--hero-scene-rgb),1)),
    linear-gradient(180deg,rgba(var(--hero-scene-rgb),1),rgba(var(--hero-scene-rgb),0) 16%,rgba(var(--hero-scene-rgb),0) 88%,rgba(var(--hero-scene-rgb),1));
}
@media(min-width:981px) {
  :root[data-theme] .hero[data-scene="fair"] .hero-art {
    inset:112px 0 0;width:min(100%,1920px);height:calc(100% - 112px);aspect-ratio:auto;
  }
}
@media(max-width:980px) {
  :root[data-theme] .hero[data-scene="fair"] .hero-art { aspect-ratio:16 / 9; }
  :root[data-theme] .hero[data-scene="fair"] .hero-art:after {
    background:linear-gradient(180deg,rgba(var(--hero-scene-rgb),1),rgba(var(--hero-scene-rgb),0) 22%,rgba(var(--hero-scene-rgb),0) 92%,rgba(var(--hero-scene-rgb),.7));
  }
}
@media(max-width:767px) {
  :root[data-theme] .hero[data-scene="fair"] .hero-art { aspect-ratio:4 / 3; }
}

/* Keep the fair visible sooner on phones and the copy comfortable on tablets. */
@media(min-width:981px) and (max-width:1180px) {
  :root[data-theme] .hero[data-scene="fair"] .hero-inner { grid-template-columns:48% minmax(0,1fr); }
  :root[data-theme] .hero[data-scene="fair"] h1 { font-size:40px; }
  :root[data-theme] .hero[data-scene="fair"] .hero-art:after {
    background:
      linear-gradient(90deg,rgba(var(--hero-scene-rgb),1),rgba(var(--hero-scene-rgb),.98) 30%,rgba(var(--hero-scene-rgb),.94) 42%,rgba(var(--hero-scene-rgb),.86) 48%,rgba(var(--hero-scene-rgb),.15) 62%,rgba(var(--hero-scene-rgb),0) 70%,rgba(var(--hero-scene-rgb),0) 95%,rgba(var(--hero-scene-rgb),1)),
      linear-gradient(180deg,rgba(var(--hero-scene-rgb),1),rgba(var(--hero-scene-rgb),0) 16%,rgba(var(--hero-scene-rgb),0) 88%,rgba(var(--hero-scene-rgb),1));
  }
}
@media(max-width:767px) {
  :root[data-theme] .hero[data-scene="fair"] { padding-top:112px; }
  :root[data-theme] .hero[data-scene="fair"] h1 { font-size:clamp(32px,8.6vw,37px); line-height:1.1; }
  :root[data-theme] .hero[data-scene="fair"] .hero-eyebrow { font-size:11px; line-height:1.5; margin-bottom:18px; }
  :root[data-theme] .hero[data-scene="fair"] .hero-description { font-size:16px; line-height:1.55; margin-top:18px; }
  :root[data-theme] .hero[data-scene="fair"] .hero-actions { margin-top:20px; gap:4px 18px; }
  :root[data-theme] .hero[data-scene="fair"] .hero-actions .text-link { min-height:44px; }
  :root[data-theme] .hero[data-scene="fair"] .hero-meta { margin-top:20px; padding-top:17px; gap:15px; }
  :root[data-theme] .hero[data-scene="fair"] .hero-art { margin-top:20px; }
}

/* Separate review strip, never drawn over a portrait. */
.hero-review{background:#101646;color:#f5f8ff;border-block:1px solid #344279;--focus:#ffe43b}
.hero-review-inner{padding-block:18px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.hero-review label{font-size:14px;font-weight:500}
.hero-review-controls{display:flex;align-items:center;gap:8px}
.hero-review select{font:inherit;font-size:14px;color:#f5f8ff;background:#030528;border:1px solid #6574a2;border-radius:8px;padding:10px 32px 10px 14px;min-height:44px;max-width:100%;width:280px}
.hero-review-arrow{display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;border:1px solid #6574a2;border-radius:50%;background:transparent;color:white}
.hero-review-arrow:hover{background:#263164}
.hero-review-arrow img{filter:invert(1)}
.hero-review-back{transform:rotate(180deg)}
.hero-review-clean{font-size:13px;text-decoration:underline;text-underline-offset:4px;min-height:44px;display:flex;align-items:center}
.hero-review :focus-visible{outline-color:#ffe43b}
@media(max-width:980px){.hero-review-inner{flex-wrap:wrap}.hero-review-controls{order:2;width:100%}.hero-review select{flex:1;width:auto;min-width:0}.hero-review-clean{margin-left:auto}}