
:root {
  --ink: #121212;
  --paper: #f4f1eb;
  --white: #fff;
  --red: #b20f24;
  --red-bright: #d2152f;
  --line: rgba(18, 18, 18, .18);
  --muted: #6c6862;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: Arial, Helvetica, sans-serif; }
main { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }

.site-header {
  height: 76px; position: fixed; inset: 0 0 auto 0; z-index: 50; display: grid;
  grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 clamp(20px, 4vw, 68px);
  background: rgba(244, 241, 235, .92); border-bottom: 1px solid var(--line); backdrop-filter: blur(18px);
}
.brand { display: flex; align-items: center; gap: 12px; font-size: 13px; letter-spacing: .04em; text-transform: uppercase; font-weight: 700; }
.brand b { color: var(--red); }
.brand-mark { display: grid; place-items: center; width: 38px; height: 38px; background: var(--red); color: white; font-size: 11px; letter-spacing: -.08em; }
nav { display: flex; gap: 32px; font-size: 13px; font-weight: 700; }
nav a { position: relative; }
nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -6px; height: 2px; background: var(--red); transition: right .25s; }
nav a:hover::after { right: 0; }
.ticket-button { justify-self: end; display: inline-flex; align-items: center; justify-content: space-between; gap: 34px; min-width: 152px; padding: 14px 17px; border: 1px solid var(--ink); font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; transition: .25s; }
.ticket-button:hover { background: var(--ink); color: var(--white); }
.ticket-button--light { border-color: var(--white); color: var(--white); }
.ticket-button--light:hover { background: var(--white); color: var(--red); }

.hero { min-height: 860px; display: grid; grid-template-columns: 52% 48%; position: relative; padding-top: 76px; background: var(--red); color: white; }
.hero-copy { padding: clamp(70px, 8vw, 130px) clamp(28px, 6vw, 100px) 80px; position: relative; z-index: 2; }
.eyebrow { margin: 0 0 42px; display: flex; align-items: center; gap: 12px; text-transform: uppercase; letter-spacing: .16em; font-weight: 800; font-size: 12px; line-height: 1.5; }
.eyebrow span { width: 38px; height: 2px; background: currentColor; flex: 0 0 auto; }
.eyebrow--light { color: rgba(255,255,255,.65); }
.hero h1 { margin: 0; max-width: 780px; text-transform: uppercase; font-size: clamp(66px, 8.5vw, 142px); letter-spacing: -.075em; line-height: .79; font-weight: 900; }
.hero h1 em { color: transparent; -webkit-text-stroke: 2px rgba(255,255,255,.82); font-style: normal; }
.hero-lead { margin: 44px 0 0; font-family: Georgia, serif; font-size: clamp(20px, 2vw, 30px); line-height: 1.3; font-style: italic; }
.hero-actions { display: flex; align-items: center; gap: 32px; margin-top: 46px; }
.text-link { display: flex; gap: 22px; align-items: center; font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: .08em; border-bottom: 1px solid rgba(255,255,255,.4); padding-bottom: 9px; }
.hero-visual { position: relative; min-height: 784px; background: #222; overflow: hidden; }
.hero-visual::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 48%, rgba(10,0,0,.78)); pointer-events: none; }
.hero-visual img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 52% 40%; filter: saturate(.72) contrast(1.03); }
.hero-stamp { position: absolute; z-index: 2; right: 0; top: 0; display: flex; align-items: center; gap: 13px; padding: 20px 26px; background: var(--paper); color: var(--ink); }
.hero-stamp span { color: var(--red); font-weight: 900; font-size: 54px; line-height: .85; letter-spacing: -.07em; }
.hero-stamp small { text-transform: uppercase; font-weight: 800; font-size: 11px; line-height: 1.2; }
.hero-caption { position: absolute; left: 34px; right: 34px; bottom: 30px; z-index: 2; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.5); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; font-weight: 800; }
.hero-sideword { position: absolute; left: 16px; bottom: 26px; z-index: 3; writing-mode: vertical-rl; transform: rotate(180deg); font-size: 10px; letter-spacing: .3em; opacity: .7; }

.facts { display: grid; grid-template-columns: .8fr 1.7fr .8fr .8fr; padding: 0 clamp(28px, 6vw, 100px); background: var(--ink); color: white; }
.facts div { padding: 30px clamp(16px, 2.5vw, 42px); border-right: 1px solid rgba(255,255,255,.16); }
.facts div:first-child { padding-left: 0; }.facts div:last-child { border-right: 0; }
.facts small { display: block; color: rgba(255,255,255,.5); margin-bottom: 8px; font-size: 10px; text-transform: uppercase; letter-spacing: .16em; }
.facts strong { font-size: 13px; text-transform: uppercase; letter-spacing: .06em; }

.section { padding: 110px clamp(28px, 7.5vw, 124px); }
.section-label { margin-bottom: 70px; padding-bottom: 18px; border-bottom: 1px solid var(--line); color: var(--red); font-size: 11px; text-transform: uppercase; font-weight: 800; letter-spacing: .16em; }
.section-label--light { color: rgba(255,255,255,.55); border-color: rgba(255,255,255,.18); }
.statement-grid { display: grid; grid-template-columns: 1.3fr .8fr; gap: 11vw; align-items: start; }
.statement h2, .format h2, .program h2, .audience h2, .networking h2, .ticket-section h2 { margin: 0; font-size: clamp(44px, 6.2vw, 94px); line-height: .94; letter-spacing: -.065em; text-transform: uppercase; }
h2 i, h2 em { font-family: Georgia, serif; font-weight: 400; text-transform: none; font-style: italic; color: var(--red); letter-spacing: -.045em; }
.rich-text, .format-head > p, .audience-grid > div > p, .networking-copy > p { font-size: 17px; line-height: 1.75; color: #403e3b; }
.rich-text p { margin: 0 0 25px; }.rich-text strong { color: var(--red); }

.manifesto { min-height: 740px; position: relative; display: grid; grid-template-columns: 1fr 1fr; background: var(--ink); color: white; padding: 120px clamp(28px, 7.5vw, 124px); }
.manifesto-number { align-self: end; color: var(--red); font-size: clamp(140px, 23vw, 360px); line-height: .7; font-weight: 900; letter-spacing: -.1em; transform: translateX(-.06em); opacity: .87; }
.manifesto-copy { max-width: 680px; position: relative; z-index: 2; }
.manifesto-copy h2 { font-size: clamp(46px, 5.3vw, 82px); line-height: .96; text-transform: uppercase; letter-spacing: -.06em; margin: 0 0 42px; }
.manifesto-copy h2 em { color: var(--red-bright); font-family: Georgia, serif; font-weight: normal; text-transform: none; }
.manifesto-copy > p:not(.eyebrow) { color: rgba(255,255,255,.62); line-height: 1.7; max-width: 560px; }
blockquote { margin: 45px 0 0; padding: 25px 0 0 35px; border-top: 1px solid rgba(255,255,255,.25); border-left: 3px solid var(--red); font-family: Georgia, serif; font-size: clamp(22px, 2.5vw, 36px); line-height: 1.24; font-style: italic; }

.format-head { display: grid; grid-template-columns: 1.2fr .7fr; gap: 10vw; align-items: end; }
.format-head > p { margin: 0; }
.format-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); margin-top: 86px; }
.format-cards article { background: var(--paper); padding: 40px; min-height: 300px; display: flex; flex-direction: column; }
.format-cards article > span { color: var(--red); font-size: 12px; font-weight: 900; }
.format-cards h3 { margin: auto 0 12px; font-size: 26px; text-transform: uppercase; letter-spacing: -.04em; }
.format-cards p { margin: 0; color: var(--muted); line-height: 1.6; }

.program { background: var(--ink); color: white; }
.program-intro { padding-bottom: 70px; }
.opening-times { display: grid; grid-template-columns: 1fr 1fr; gap: 15px 50px; max-width: 820px; margin: 80px 0 0 auto; border-top: 1px solid rgba(255,255,255,.2); padding-top: 24px; }
.opening-times p { margin: 0; padding: 12px 0; color: rgba(255,255,255,.72); }
.opening-times time { color: var(--red-bright); font-weight: 900; margin-right: 20px; }
.opening-title { grid-column: 2; font-weight: 700; }
.opening-title em { display: inline-block; margin-top: 7px; color: rgba(255,255,255,.55); font-family: Georgia, serif; font-weight: normal; }
.panels { border-top: 1px solid rgba(255,255,255,.18); }
.panel { display: grid; grid-template-columns: clamp(100px, 18vw, 290px) 1fr; padding: 72px clamp(28px, 7.5vw, 124px); border-bottom: 1px solid rgba(255,255,255,.18); }
.panel-number { color: transparent; -webkit-text-stroke: 1px var(--red-bright); font-size: clamp(70px, 10vw, 160px); font-weight: 900; line-height: .75; letter-spacing: -.08em; }
.panel-body { max-width: 850px; }
.panel-body > time { color: var(--red-bright); font-size: 13px; font-weight: 900; letter-spacing: .1em; }
.panel h3 { margin: 16px 0; font-size: clamp(30px, 4vw, 60px); line-height: 1; text-transform: uppercase; letter-spacing: -.055em; }
.panel-question { margin: 0 0 25px; font-family: Georgia, serif; font-style: italic; color: var(--red-bright); font-size: clamp(20px, 2vw, 29px); }
.panel-intro { max-width: 750px; color: rgba(255,255,255,.6); line-height: 1.7; }
.speaker-list { margin-top: 36px; border-top: 1px solid rgba(255,255,255,.17); }
.speaker-list div { display: grid; grid-template-columns: 78px 1fr; padding: 15px 0; border-bottom: 1px solid rgba(255,255,255,.12); }
.speaker-list span { color: var(--red-bright); font-size: 13px; font-weight: 900; }
.speaker-list strong { font-size: 15px; }
.discussion { color: rgba(255,255,255,.52); font-size: 13px; text-transform: uppercase; letter-spacing: .08em; margin: 22px 0; }
details { border-top: 1px solid rgba(255,255,255,.2); border-bottom: 1px solid rgba(255,255,255,.2); padding: 20px 0; }
summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; text-transform: uppercase; letter-spacing: .1em; font-weight: 800; font-size: 12px; }
summary::-webkit-details-marker { display: none; }
summary span { font-size: 21px; color: var(--red-bright); transition: transform .2s; }
details[open] summary span { transform: rotate(45deg); }
details p { color: rgba(255,255,255,.62); line-height: 1.7; padding-right: 10%; }
.breaks { display: flex; flex-wrap: wrap; gap: 15px; padding-top: 42px; padding-bottom: 42px; border-bottom: 1px solid rgba(255,255,255,.18); }
.breaks span { border: 1px solid rgba(255,255,255,.2); padding: 13px 17px; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
.final-panel { background: var(--red); }
.final-panel h2 i { color: white; }.final-panel > p:not(.eyebrow) { color: rgba(255,255,255,.7); }
.final-panel ol { list-style: none; padding: 0; margin: 70px 0; max-width: 900px; border-top: 1px solid rgba(255,255,255,.35); }
.final-panel li { display: grid; grid-template-columns: 60px 1fr; gap: 15px; padding: 21px 0; border-bottom: 1px solid rgba(255,255,255,.35); font-size: clamp(18px, 2vw, 26px); }
.final-panel li span { font-size: 12px; font-weight: 900; padding-top: 6px; }
.closing-time { text-align: right; font-size: clamp(70px, 12vw, 180px); font-weight: 900; line-height: .8; letter-spacing: -.08em; }
.closing-time small { display: block; margin-top: 20px; font-size: 11px; text-transform: uppercase; letter-spacing: .12em; }

.audience-grid { display: grid; grid-template-columns: 1fr .8fr; gap: 9vw; }
.audience-grid > div > p { max-width: 650px; margin-top: 40px; }
.audience ul { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.audience li { display: grid; grid-template-columns: 48px 1fr; padding: 17px 0; border-bottom: 1px solid var(--line); font-weight: 700; text-transform: uppercase; font-size: 13px; line-height: 1.35; }
.audience li span { color: var(--red); font-size: 10px; }

.networking { display: grid; grid-template-columns: 1fr 1fr; min-height: 680px; background: white; }
.networking-image { position: relative; background: #ddd; }
.networking-image img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1); }
.networking-copy { padding: clamp(65px, 8vw, 125px); display: flex; flex-direction: column; justify-content: center; }
.networking-copy .eyebrow { color: var(--red); }.networking-copy h2 { font-size: clamp(42px, 5.5vw, 80px); margin-bottom: 38px; }
.networking-copy > p { max-width: 650px; }

.ticket-section { padding: 120px clamp(22px, 7vw, 110px); background: var(--paper); }
.ticket-heading { text-align: center; max-width: 1050px; margin: 0 auto 70px; }
.ticket-heading .eyebrow { justify-content: center; color: var(--red); }
.ticket-heading h2 { font-size: clamp(46px, 7vw, 104px); }
.ticket-heading > p:last-child { margin-top: 35px; text-transform: uppercase; font-weight: 800; font-size: 12px; letter-spacing: .1em; }
.ticket-widget { max-width: 1100px; margin: 0 auto; padding: clamp(12px, 3vw, 38px); background: white; border-top: 5px solid var(--red); box-shadow: 0 28px 80px rgba(18,18,18,.12); }
#dl-widget { border: 0; width: 100% !important; padding: 0; margin: 0 auto; min-height: 500px; max-width: 1000px; display: block; }

footer { background: var(--ink); color: white; padding: 60px clamp(28px, 7.5vw, 124px); display: grid; grid-template-columns: 1.5fr 1fr 1fr auto; gap: 45px; align-items: end; font-size: 13px; line-height: 1.7; }
.footer-title { font-size: clamp(26px, 3vw, 48px); text-transform: uppercase; letter-spacing: -.05em; font-weight: 900; }.footer-title em { color: var(--red-bright); font-family: Georgia, serif; }
footer a { color: var(--red-bright); font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }

@media (max-width: 1050px) {
  .site-header { grid-template-columns: 1fr auto; }.site-header nav { display: none; }
  .hero { grid-template-columns: 1fr 1fr; min-height: 760px; }.hero-copy { padding-left: 45px; padding-right: 30px; }
  .hero h1 { font-size: clamp(58px, 8.5vw, 90px); }.hero-visual { min-height: 684px; }
  .statement-grid, .format-head, .audience-grid { gap: 6vw; }
  footer { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 760px) {
  .site-header { height: 66px; padding: 0 18px; }.brand > span:last-child { font-size: 11px; }.brand-mark { width: 34px; height: 34px; }.site-header .ticket-button { min-width: auto; padding: 11px 13px; gap: 15px; }
  .hero { display: flex; flex-direction: column; padding-top: 66px; }.hero-copy { padding: 70px 22px 58px; }.hero h1 { font-size: clamp(58px, 19vw, 90px); }.hero-lead { margin-top: 30px; }.hero-actions { align-items: flex-start; flex-direction: column; margin-top: 35px; gap: 25px; }
  .hero-visual { min-height: 590px; order: 2; }.hero-stamp { padding: 15px 18px; }.hero-stamp span { font-size: 44px; }.hero-sideword { display: none; }
  .facts { grid-template-columns: 1fr 1fr; padding: 0 20px; }.facts div, .facts div:first-child { padding: 21px 8px; border-bottom: 1px solid rgba(255,255,255,.15); }.facts div:nth-child(2) { border-right: 0; }
  .section { padding: 76px 22px; }.section-label { margin-bottom: 45px; }
  .statement-grid, .format-head, .audience-grid, .manifesto, .networking { grid-template-columns: 1fr; }
  .statement h2, .format h2, .program h2, .audience h2, .networking h2, .ticket-section h2 { font-size: clamp(42px, 13vw, 68px); }
  .rich-text { margin-top: 42px; }
  .manifesto { min-height: auto; padding: 80px 22px; }.manifesto-number { position: absolute; bottom: 35px; opacity: .12; font-size: 45vw; }.manifesto-copy h2 { font-size: 13vw; }
  .format-head > p { margin-top: 35px; }.format-cards { grid-template-columns: 1fr; margin-top: 55px; }.format-cards article { min-height: 240px; }
  .opening-times { grid-template-columns: 1fr; margin-top: 50px; }.opening-title { grid-column: 1; }.panel { grid-template-columns: 68px 1fr; padding: 52px 22px; }.panel-number { font-size: 60px; }.panel h3 { font-size: 9vw; }.speaker-list div { grid-template-columns: 62px 1fr; }.breaks { padding-top: 35px; padding-bottom: 35px; }.final-panel li { grid-template-columns: 42px 1fr; }.closing-time { margin-top: 60px; }
  .audience ul { margin-top: 55px; }.networking-image { min-height: 340px; }.networking-copy { padding: 76px 22px; }.networking-copy h2 { font-size: 12vw; }
  .ticket-section { padding: 85px 12px; }.ticket-heading { padding: 0 10px; }.ticket-widget { padding: 8px; }.ticket-heading h2 { font-size: 12vw; }#dl-widget { min-height: 650px; }
  footer { grid-template-columns: 1fr; padding: 55px 22px; }
}

@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { transition: none !important; } }
