/* Two deliberately composed flyer canvases, fitted to the available viewport. */
*,:before,:after { box-sizing: border-box; }
:root { --paper:#f7f7f6; --ink:#201b17; --muted:#665b51; --accent:#5a1f2a; --rule:#d8d2cb; --fit:1; }
html,body { margin:0; width:100%; height:100%; overflow:hidden; }
body { color:var(--ink); background:#e9e5df; font-family:Arial,Helvetica,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
a:focus-visible { outline:3px solid var(--accent); outline-offset:5px; }
p,h1,h2,figure,ul { margin:0; }
.stage { position:relative; width:100%; height:100vh; height:100dvh; display:grid; place-items:center; overflow:hidden; }
.sheet { --canvas-width:1280px; --canvas-height:850px; position:absolute; left:50%; top:50%; width:1280px; height:850px; padding:30px 44px 24px; display:grid; grid-template-rows:44px minmax(0,1fr) 106px 108px 76px; gap:20px; background:var(--paper); transform:translate(-50%,-50%) scale(var(--fit)); transform-origin:center; flex:none; }
.sheet-head { display:flex; justify-content:space-between; align-items:flex-start; border-bottom:1px solid var(--rule); }
.wordmark { font-size:19px; font-weight:700; letter-spacing:.24em; }
.head-label { font-size:10px; font-weight:700; letter-spacing:.15em; padding-top:4px; color:var(--accent); }
.sheet-main { display:grid; grid-template-columns:1.2fr 1fr; gap:45px; min-height:0; }
.hero-copy { display:flex; flex-direction:column; justify-content:center; }
.eyebrow { font-size:10px; font-weight:700; letter-spacing:.14em; color:var(--accent); }
h1 { font-size:51px; line-height:1.035; letter-spacing:-.045em; font-weight:700; margin:17px 0; max-width:19ch; }
h1 span { color:var(--accent); }
.hero-description { font-size:17px; line-height:1.55; max-width:48ch; }
.hero-note { font-size:12px; color:var(--muted); margin-top:18px; }
.hero-image { position:relative; min-height:0; overflow:hidden; background:#d9d3ca; }
.hero-image img { width:100%; height:100%; display:block; object-fit:cover; object-position:center 30%; }
.programme-band { border-top:1px solid var(--rule); padding-top:15px; }
.programme { padding:0; margin-top:14px; list-style:none; display:grid; grid-template-columns:repeat(4,1fr); }
.programme li { padding:0 20px; border-left:1px solid var(--rule); display:grid; grid-template-columns:auto 1fr; column-gap:11px; row-gap:6px; }
.programme li:first-child { padding-left:0; border:0; }
.programme li:last-child { padding-right:0; }
.programme li > span { color:var(--accent); font-size:11px; font-weight:700; align-self:center; }
.programme strong { font-size:16px; letter-spacing:-.025em; }
.programme p { grid-column:2; font-size:12px; color:var(--muted); }
.cta-band { background:var(--accent); color:#fff; padding:20px 27px; display:flex; justify-content:space-between; align-items:center; gap:30px; }
.cta-band h2 { font-size:25px; line-height:1.1; letter-spacing:-.025em; }
.cta-band h2 br { display:none; }
.cta-band p { font-size:12px; line-height:1.4; margin-top:9px; color:#f1dfe4; }
.scope-button { display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; gap:32px; padding:17px 22px; background:#fff; color:var(--accent); font-size:14px; font-weight:700; }
.scope-button span { font-size:23px; line-height:1; }
.scope-button:hover { background:#f0e7e3; }
.scope-button:focus-visible { outline-color:#fff; }
.sheet-foot { border-top:1px solid var(--rule); padding-top:10px; }
.credential { font-size:12px; font-weight:600; }
.credential span { color:var(--accent); }
.boundary { font-size:10px; line-height:1.4; color:var(--muted); margin-top:6px; }
.foot-row { display:flex; justify-content:space-between; gap:15px; font-size:10px; color:var(--muted); margin-top:9px; }
.foot-row nav { display:flex; gap:22px; }
.foot-row a { text-decoration:underline; text-underline-offset:3px; }
@media (max-aspect-ratio: 4/5) {
  .sheet { --canvas-width:390px; --canvas-height:800px; width:390px; height:800px; padding:17px 20px; grid-template-rows:33px minmax(0,1fr) 98px 94px 79px; gap:13px; }
  .sheet-head { align-items:flex-start; }
  .wordmark { font-size:13px; letter-spacing:.18em; }
  .head-label { font-size:6.5px; letter-spacing:.08em; padding-top:4px; }
  .sheet-main { grid-template-columns:1fr; grid-template-rows:auto minmax(0,1fr); gap:15px; }
  .hero-copy { justify-content:start; }
  .eyebrow { font-size:8px; }
  h1 { font-size:32px; line-height:1.04; max-width:20ch; margin:10px 0 11px; }
  .hero-description { font-size:13px; line-height:1.45; }
  .hero-note { display:none; }
  .hero-image img { object-position:center 30%; }
  .programme-band { padding-top:10px; }
  .programme { grid-template-columns:1fr 1fr; gap:10px 15px; margin-top:10px; }
  .programme li,.programme li:first-child { padding:0; border:0; column-gap:7px; row-gap:3px; }
  .programme li > span { font-size:9px; }
  .programme strong { font-size:12px; }
  .programme p { font-size:9px; }
  .cta-band { padding:13px 14px; gap:12px; }
  .cta-band h2 { font-size:16px; line-height:1.13; }
  .cta-band h2 br { display:block; }
  .cta-band p { font-size:9px; line-height:1.35; margin-top:6px; max-width:21ch; }
  .scope-button { font-size:10px; padding:15px 10px; gap:8px; }
  .scope-button span { font-size:17px; }
  .sheet-foot { padding-top:9px; }
  .credential { font-size:9px; line-height:1.4; }
  .credential span { white-space:nowrap; }
  .boundary { font-size:8px; line-height:1.35; margin-top:5px; }
  .foot-row { font-size:8px; margin-top:8px; gap:8px; }
  .foot-row nav { gap:10px; }
  .site-address { display:none; }
}
@media print {
  @page { size: landscape; margin:0; }
  html,body,.stage { height:auto; overflow:visible; background:#fff; }
  .sheet { position:relative; left:0; top:0; transform:none; zoom:.85; }
}

/* The dialog sits outside the scaled flyer so its controls stay at normal size. */
button { font:inherit; cursor:pointer; }
button:focus-visible { outline:3px solid var(--accent); outline-offset:4px; }
.watch-overview { display:inline-flex; align-items:center; gap:12px; min-height:46px; border:1px solid #fff; border-radius:3px; padding:10px 17px; background:#fff; color:var(--accent); font-size:13px; font-weight:700; letter-spacing:0; }
.watch-overview[hidden] { display:none; }
.watch-overview:hover { background:#eee5e1; }
.watch-overview:focus-visible { outline-color:white; }
.play-icon { width:23px; height:23px; border:1px solid #d7bdc2; border-radius:50%; display:grid; place-items:center; font-size:9px; padding-left:2px; }
.overview-dialog { border:0; padding:0; width:min(920px,calc(100vw - 32px)); max-width:none; max-height:calc(100dvh - 32px); color:var(--ink); background:var(--paper); box-shadow:0 20px 100px #0006; }
.overview-dialog::backdrop { background:rgba(20,17,16,.77); backdrop-filter:blur(5px); }
.overview-header { display:flex; align-items:center; justify-content:space-between; padding:14px 22px; border-bottom:1px solid var(--rule); gap:15px; }
.overview-header > span { font-size:10px; font-weight:700; letter-spacing:.1em; }
.close-overview { display:flex; align-items:center; gap:15px; padding:7px 10px; min-height:44px; border:1px solid var(--rule); background:transparent; color:var(--ink); font-size:12px; }
.close-overview > span { font-size:24px; line-height:1; }
.overview-content { display:grid; grid-template-columns:auto 1fr; gap:35px; padding:26px; align-items:center; }
.video-preview { height:min(540px,calc(100dvh - 170px)); aspect-ratio:9/16; background:#261d1b; color:white; display:flex; flex-direction:column; align-items:center; justify-content:center; position:relative; gap:20px; text-align:center; border:1px solid #51413b; }
.preview-badge { position:absolute; top:20px; font-size:9px; letter-spacing:.17em; color:#d0b6ac; }
.preview-play { display:grid; place-items:center; height:62px; width:62px; border:1px solid #b18e83; border-radius:50%; font-size:20px; padding-left:4px; color:#eee1dc; }
.video-preview strong { font-size:24px; line-height:1.2; letter-spacing:-.02em; }
.preview-format { font-size:11px; color:#d0b6ac; }
.overview-copy h2 { font-size:34px; line-height:1.1; letter-spacing:-.035em; margin:14px 0 18px; }
.overview-copy > p:not(.eyebrow) { font-size:14px; line-height:1.7; }
.overview-copy .scope-button { background:var(--accent); color:#fff; margin:24px 0 16px; font-size:13px; gap:16px; }
.overview-copy .scope-button:focus-visible { outline-color:var(--accent); }
.overview-copy > .preview-note { color:var(--muted); font-size:11px!important; }
@media (max-aspect-ratio:4/5) {
  .watch-overview { min-height:40px; font-size:11px; padding:8px 12px; gap:9px; }
  .play-icon { width:20px; height:20px; font-size:8px; }
}
@media (max-width:600px) {
  .overview-header { padding:8px 12px; }
  .overview-header > span { font-size:8px; letter-spacing:.07em; }
  .overview-content { grid-template-columns:1fr; gap:14px; padding:16px; }
  .video-preview { height:min(360px,40dvh); justify-self:center; gap:14px; }
  .video-preview strong { font-size:20px; }
  .preview-format { font-size:9px; }
  .overview-copy { text-align:center; }
  .overview-copy .eyebrow, .overview-copy > p:not(.preview-note) { display:none; }
  .overview-copy h2 { font-size:24px; margin:0; }
  .overview-copy .scope-button { margin:14px 0 10px; min-height:48px; font-size:13px; padding:13px 20px; }
}
@media print { .overview-dialog,.watch-overview { display:none!important; } }

/* Keep the consent controls outside the scaled flyer so they remain readable. */
.foot-row button { padding:0; border:0; background:none; color:inherit; font:inherit; text-decoration:underline; text-underline-offset:3px; }
.cookie-banner { position:fixed; inset:auto 0 0; z-index:1000; background:var(--ink); color:#fff; border-top:1px solid #ffffff40; max-height:85dvh; overflow:auto; }
.cookie-banner[hidden], .foot-row button[hidden] { display:none; }
.cookie-inner { max-width:1280px; margin:auto; padding:18px 24px; display:flex; flex-wrap:wrap; align-items:center; gap:16px 24px; }
.cookie-copy { flex:1 1 360px; font-size:13px; line-height:1.55; }
.cookie-copy strong { display:block; font-size:15px; margin-bottom:4px; }
.cookie-copy a { text-decoration:underline; }
.cookie-actions { display:flex; flex:1 1 490px; gap:12px; }
.cookie-btn { flex:1; min-height:48px; padding:12px; border:1px solid #fff; background:transparent; color:#fff; font-size:12px; font-weight:600; line-height:1.4; }
.cookie-btn:hover { background:#fff; color:var(--ink); }
.cookie-banner :focus-visible { outline:3px solid #fff; outline-offset:3px; }
@media (max-width:600px) {
  .cookie-inner { padding:16px; gap:14px; }
  .cookie-actions { gap:10px; }
  .cookie-btn { font-size:12px; }
  .foot-row { gap:5px; }
  .foot-row nav { gap:7px; }
}
@media print { .cookie-banner,.foot-row button { display:none!important; } }

/* Campaign video player. The media source is attached only after a deliberate click. */
.watch-overview { position:absolute; inset:0; z-index:1; width:100%; display:flex; flex-direction:column; justify-content:center; gap:16px; border:0; border-radius:0; background:linear-gradient(#0001,#0005); color:#fff; padding:24px; font-family:inherit; font-size:24px; font-weight:700; line-height:1.1; letter-spacing:-.025em; text-align:center; }
.watch-overview > span:last-child { font-family:Georgia,"Times New Roman",serif; font-size:28px; font-weight:700; line-height:1.15; letter-spacing:-.03em; color:#f1e6c9; -webkit-text-stroke:1.25px #201b17; paint-order:stroke fill; text-shadow:0 2px 3px #000b; }
.watch-overview:hover { background:#0005; }
.watch-overview:focus-visible { outline-offset:-5px; }
.watch-overview .play-icon { width:68px; height:68px; border:2px solid #fff; border-radius:50%; background:#201b1780; font-size:24px; }
.overview-video { display:block; width:min(600px,62vw); height:auto; max-width:100%; aspect-ratio:16/9; object-fit:contain; background:#111; }
.overview-error { color:var(--muted); font-size:12px!important; }
.overview-error[hidden] { display:none; }
@media (max-aspect-ratio:4/5) {
  .watch-overview { font-size:18px; gap:10px; padding:14px 14px 34px; }
  .watch-overview > span:last-child { font-size:21px; -webkit-text-stroke:1px #201b17; }
  .watch-overview .play-icon { width:46px; height:46px; font-size:17px; }
}
@media (max-width:600px) {
  .overview-video { width:100%; height:auto; justify-self:center; }
  .overview-copy > .overview-error:not([hidden]) { display:block; }
}
