/* Photo-led components shared by all themes. Colours come from each theme's variables where possible. */
:root{--ph-shade:7,30,54;--ph-radius:var(--radius,16px)}
.hero--photo{position:relative;isolation:isolate;color:#fff;overflow:hidden;min-height:min(84vh,780px);display:flex;align-items:center;padding:clamp(3rem,7vw,5.5rem) 0}
.hero--photo .hero-media{position:absolute;inset:0;z-index:-2}
.hero--photo .hero-media img{width:100%;height:100%;object-fit:cover;object-position:var(--ph-pos,center)}
.hero--photo .hero-shade{position:absolute;inset:0;z-index:-1;background:
  linear-gradient(90deg,rgba(var(--ph-shade),.90) 0%,rgba(var(--ph-shade),.74) 40%,rgba(var(--ph-shade),.22) 66%,rgba(var(--ph-shade),.06) 100%),
  linear-gradient(180deg,rgba(var(--ph-shade),.08) 0%,rgba(var(--ph-shade),.12) 60%,rgba(var(--ph-shade),.5) 100%)}
/* text on the right, landmark clear on the left */
.hero--right .hero-shade{background:
  linear-gradient(270deg,rgba(var(--ph-shade),.90) 0%,rgba(var(--ph-shade),.76) 40%,rgba(var(--ph-shade),.22) 66%,rgba(var(--ph-shade),.06) 100%),
  linear-gradient(180deg,rgba(var(--ph-shade),.08) 0%,rgba(var(--ph-shade),.12) 60%,rgba(var(--ph-shade),.5) 100%)}
.hero--right .wrap{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}
.hero--right .wrap>div:first-child,.hero--right .wrap>.hero-copy{order:2}
.hero--right .hero-panel{order:1;justify-self:start;align-self:end;width:min(100%,380px)}
.hero--right .hero-side{order:1;justify-self:start;align-self:end;width:min(100%,460px)}
.hero--right .hero-panel{background:rgba(var(--ph-shade),.58);color:#fff;border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 24px 50px rgba(0,0,0,.35)}
.hero--right .hero-panel h3,.hero--right .hero-panel ol,.hero--right .hero-panel .mini b{color:#fff}
.hero--right .hero-panel p,.hero--right .hero-panel .mini{color:rgba(255,255,255,.82)}
.hero--right .hero-panel .mini{border-top-color:rgba(255,255,255,.2)}
.hero--right .hero-panel .mini svg{color:var(--ph-em,#8FDDF0)}
.hero--photo .wrap{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:3rem;align-items:center}
.hero--photo h1,.hero--photo .lead,.hero--photo p{color:#fff}
.hero--photo h1 em{color:var(--ph-em,#8FDDF0)}
.hero--photo .lead{color:rgba(255,255,255,.86)}
.hero--photo .eyebrow{color:var(--ph-em,#8FDDF0)}
.hero--photo .eyebrow::before{background:var(--ph-em,#8FDDF0)}
.hero--photo .trust-strip{border-top-color:rgba(255,255,255,.22)}
.hero--photo .trust-strip span{color:#fff}
.hero--photo .trust-strip svg{color:var(--ph-em,#8FDDF0)}
.hero--photo .btn--ghost{color:#fff;border-color:rgba(255,255,255,.55);background:rgba(255,255,255,.08)}
.hero--photo .btn--ghost:hover{background:rgba(255,255,255,.18)}
.hero--photo .skyline{display:none}
.hero-panel{background:rgba(255,255,255,.96);color:var(--ink,#0F1F33);border-radius:var(--ph-radius);padding:1.5rem 1.6rem;box-shadow:0 30px 60px rgba(0,0,0,.35);justify-self:end;width:min(100%,420px)}
.hero-panel h3{margin:0 0 .35rem;font-size:1.05rem;color:var(--ink,#0F1F33)}
.hero-panel p{color:var(--muted,#52677C);margin:0 0 .9rem;font-size:.95rem}
.hero-panel ol{margin:0;padding-left:1.2rem;color:var(--ink,#0F1F33);font-size:.95rem;display:grid;gap:.45rem}
.hero-panel .mini{display:flex;gap:.6rem;align-items:center;margin-top:1rem;padding-top:.9rem;border-top:1px solid var(--line,#D9E4EC);font-size:.86rem;color:var(--muted,#52677C)}
.hero-panel .mini b{color:var(--ink,#0F1F33)}
.hero-panel .mini svg{width:22px;height:22px;flex:none;color:var(--accent,#1B7FA8)}
.hero-photo-credit{position:absolute;right:12px;bottom:10px;font-size:.66rem;color:rgba(255,255,255,.55);z-index:1}
.hero-photo-credit a{color:inherit}
@media (max-width:900px){
  .hero--photo{min-height:0;padding:3rem 0 2.5rem}
  .hero--photo .wrap,.hero--right .wrap{grid-template-columns:1fr;gap:1.6rem}
  .hero--right .wrap>div:first-child,.hero--right .wrap>.hero-copy{order:1}
  .hero--right .hero-panel,.hero--right .hero-side{order:2;width:100%}
  .hero--photo .hero-shade{background:linear-gradient(180deg,rgba(var(--ph-shade),.86) 0%,rgba(var(--ph-shade),.78) 55%,rgba(var(--ph-shade),.9) 100%)}
  .hero-panel{justify-self:stretch;width:100%}
}
/* split hero: theme background, photo as a tall card on the right with the panel overlapping it */
.hero--split .wrap{position:relative;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:3.5rem;align-items:center}
.hero--split .art,.hero--split .hero-art-wide{display:none}
.hero-split-side{position:relative;justify-self:end;width:100%;max-width:540px;padding:0 0 2.2rem 2.4rem}
.hero-split-side .hero-split-img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:var(--ph-pos,center);border-radius:var(--ph-radius);box-shadow:0 34px 70px rgba(0,0,0,.35)}
.hero-split-side .hero-panel{position:absolute;left:0;bottom:0;width:min(88%,380px)}
.hero--right .hero-card{order:1;justify-self:start;align-self:end}
@media (max-width:900px){
  .hero--split .wrap{grid-template-columns:1fr;gap:1.6rem}
  .hero-split-side{max-width:none;padding:0}
  .hero-split-side .hero-split-img{aspect-ratio:16/11}
  .hero-split-side .hero-panel{position:static;width:100%;margin-top:1rem}
}
/* cards with a photo on top */
.card .card-photo{margin:calc(var(--card-pad,1.5rem) * -1) calc(var(--card-pad,1.5rem) * -1) 1.1rem;aspect-ratio:16/10;overflow:hidden;border-radius:var(--ph-radius) var(--ph-radius) 0 0;background:#dfe6ec}
.card .card-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}
.card:hover .card-photo img{transform:scale(1.04)}
.floor .swatch--photo{height:170px;overflow:hidden}
.floor .swatch--photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}
.floor:hover .swatch--photo img{transform:scale(1.05)}
/* gallery mosaic */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:250px;gap:12px;margin-top:1.6rem}
.gallery figure{margin:0;position:relative;overflow:hidden;border-radius:var(--ph-radius);background:#dfe6ec}
.gallery figure:first-child{grid-column:span 2;grid-row:span 2}
.gallery img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s ease}
.gallery figure:hover img{transform:scale(1.05)}
.gallery figcaption{position:absolute;left:0;right:0;bottom:0;padding:2rem 1rem .8rem;background:linear-gradient(180deg,transparent,rgba(0,0,0,.72));color:#fff;font-size:.86rem;font-weight:600;line-height:1.3}
.gallery figure:first-child figcaption{font-size:1.02rem;padding:3rem 1.2rem 1rem}
@media (max-width:900px){.gallery{grid-template-columns:repeat(2,1fr);grid-auto-rows:170px}.gallery figure:first-child{grid-column:span 2;grid-row:span 1}.gallery figure:last-child:nth-child(even){grid-column:span 2}}
/* crew / people strip */
.crew{display:grid;grid-template-columns:1.1fr .9fr;gap:2.4rem;align-items:center;margin-top:1.4rem}
.crew-photos{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.crew-photos figure{margin:0;overflow:hidden;border-radius:var(--ph-radius);aspect-ratio:4/5;background:#dfe6ec}
.crew-photos figure:first-child{grid-row:span 2;aspect-ratio:auto}
.crew-photos img{width:100%;height:100%;object-fit:cover;display:block}
.crew ul.facts{list-style:none;padding:0;margin:1rem 0 0;display:grid;gap:.6rem}
.crew ul.facts li{display:flex;gap:.6rem;align-items:flex-start}
.crew ul.facts svg{flex:none;width:20px;height:20px;margin-top:.15rem;color:var(--green,#1C8A5B)}
@media (max-width:900px){.crew{grid-template-columns:1fr}}
/* banner photo on inner pages */
.photo-banner{margin:1.6rem auto 0;max-width:var(--wrap,1180px);padding:0 var(--gutter,24px)}
.photo-banner figure{margin:0;overflow:hidden;border-radius:var(--ph-radius);aspect-ratio:21/8;background:#dfe6ec;position:relative}
.photo-banner img{width:100%;height:100%;object-fit:cover;display:block}
.photo-banner figcaption{position:absolute;left:0;right:0;bottom:0;padding:2rem 1.2rem .9rem;background:linear-gradient(180deg,transparent,rgba(0,0,0,.65));color:#fff;font-weight:600;font-size:.95rem}
@media (max-width:640px){.photo-banner figure{aspect-ratio:16/10}}
/* CTA band with photo */
.cta-band--photo{position:relative;isolation:isolate;overflow:hidden}
.cta-band--photo .band-media{position:absolute;inset:0;z-index:-2}
.cta-band--photo .band-media img{width:100%;height:100%;object-fit:cover}
.cta-band--photo .band-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(var(--ph-shade),.88) 0%,rgba(var(--ph-shade),.72) 50%,rgba(var(--ph-shade),.45) 100%)}
.cta-band--photo .skyline{display:none}
.photo-credits-link{opacity:.8}

.hero--photo .planks{display:none}
.hero--photo .hero-side .quote{box-shadow:0 30px 60px rgba(0,0,0,.35);color:var(--ink,#0F1F33)}
.hero--photo .hero-side .quote td,.hero--photo .hero-side .quote .note{color:var(--ink,#0F1F33)}
.hero--photo.hero--centered .wrap{grid-template-columns:minmax(0,1fr) minmax(0,.8fr);text-align:left}
.hero--photo.hero--centered .hero-copy{margin:0;max-width:none}
.hero--photo.hero--centered .actions,.hero--photo.hero--centered .trust-strip{justify-content:flex-start}
