/* ==========================================================================
   THE NATIONAL IDBT SUMMIT 2026® — site.css
   The 402PAYMENT design language (docs/design-language.md) with the summit's
   own colours (decision D1): Summit Navy, Deep Navy and the summit red.
   The token names of the design language stay (decision F2), so `--orange`
   is the summit red and `--navy` is Summit Navy. One file, no build step.
   ========================================================================== */

/* ---------- Fonts, served from the site (SIL Open Font License) ----------
   Manrope is a variable font (one file for 300–800). Latin and Latin Extended. */
@font-face{font-family:"Manrope";font-style:normal;font-weight:300 800;font-display:swap;src:url(../fonts/manrope-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Manrope";font-style:normal;font-weight:300 800;font-display:swap;src:url(../fonts/manrope-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}

/* ---------- Tokens ----------
   All design values live here. Components only use tokens. */
:root{
  /* summit colours (D1) under the design-language names (F2) */
  --navy:#1B3A5C;          /* Summit Navy: headings, text emphasis */
  --navy-deep:#122840;     /* Deep Navy: header, heroes, CTA band, footer */
  --orange:#FF4436;        /* summit red: the one accent */
  --orange-hover:#E5392C;
  --orange-ink:#C42A1E;    /* red for small text on white (5.7:1) */
  --white:#FFFFFF;
  --paper:#F5F7F9;         /* light grey surface */
  --slot:#EEF2F6;          /* hover fill of paper cards */
  --line:#E1E7EF;          /* hairlines, card edges */
  --slate:#495467;         /* body copy on light surfaces */
  --muted:#7A8A9A;         /* second half of two-tone headings (large text only) */
  --silver:#C5C5C5;        /* summit Silver Gray */
  --navy-800:#2A4A6E; --navy-600:#4D6A8A; --navy-400:#A0B0C0; --navy-200:#D0DAE5; --navy-100:#EEF2F6;
  /* text and lines on Deep Navy */
  --on-navy:#F0F5FA;       /* headings, links */
  --on-navy-2:#B8CDE0;     /* body text (9:1) */
  --on-navy-3:#7A9AB8;     /* small secondary text (5:1) */
  --navy-line:rgba(255,255,255,.12);
  --on-navy-label:#E6EDF5;  /* small uppercase labels on navy */
  /* form status */
  --ok-bg:#E7F4EC; --ok-ink:#14532D; --ok-edge:#1A7F37; --err-bg:rgba(255,68,54,.08); --err-ink:#8A1E15;
  /* one typeface */
  --display:"Manrope",system-ui,sans-serif; --sans:"Manrope",system-ui,sans-serif;
  /* text sizes */
  --fs-xs:13px; --fs-sm:15px; --fs-md:17px; --fs-lg:20px; --fs-xl:26px; --fs-2xl:clamp(30px,3.5vw,48px); --fs-3xl:clamp(40px,6.2vw,88px);
  --gut:clamp(16px,4vw,56px);
  /* corners: small parts, cards and photos, buttons and pills */
  --r-sm:8px; --r-md:16px; --r-pill:999px;
  /* shadows: none on cards at rest, small on hover, large on dialogs and menus (tinted navy) */
  --sh-1:0 1px 2px rgba(18,40,64,.06),0 8px 20px -12px rgba(18,40,64,.18);
  --sh-2:0 24px 64px -24px rgba(18,40,64,.45);
  /* motion: short, a fade or a movement of 8 px or less */
  --ease:cubic-bezier(.22,1,.36,1); --dur:.25s;
  --nav-h:88px;
}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-padding-top:calc(var(--nav-h) + 16px)}
body{background:var(--white);color:var(--navy);font:400 17px/1.65 var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit}
img{display:block;max-width:100%;height:auto}
[hidden]{display:none!important}   /* a component display value never wins over [hidden] */
ul,ol{list-style:none}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.wrap{max-width:1280px;margin:0 auto;padding:0 var(--gut)}
.skip{position:absolute;left:var(--gut);top:-60px;z-index:50;padding:10px 16px;border-radius:var(--r-pill);background:var(--white);color:var(--navy);font-weight:700;text-decoration:none;transition:top var(--dur) var(--ease)}
.skip:focus{top:12px}

/* ---------- Two languages (lang.js) ----------
   Every text is in the markup twice; only the one that matches <html lang>
   shows. A switch fades the content out and in. */
/* .keep-lang: German-only content (legal pages) that stays visible in English mode */
html[lang="de"] [lang="en"],html[lang="en"] [lang="de"]:not(.keep-lang){display:none!important}
main,.site-footer{transition:opacity .16s ease}
html.lang-switching main,html.lang-switching .site-footer{opacity:0}

/* ---------- Type ----------
   Tight headings, open body text. Headings stand on their own: no
   preheadings. A two-part heading steps back in its second half (.mute). */
h1{font:700 clamp(40px,6vw,84px)/1.02 var(--display);letter-spacing:-.035em;max-width:16ch}
h2{font:700 clamp(30px,3.5vw,50px)/1.08 var(--display);letter-spacing:-.03em;max-width:20ch}
h3{font:700 21px/1.2 var(--display);letter-spacing:-.02em}
h1 em,h2 em{font-style:normal;color:var(--orange)}
h1,h2,h3{overflow-wrap:break-word}   /* safety net; long German words carry soft hyphens */
h2 .mute{color:var(--muted)}
p{max-width:62ch}
.intro{color:var(--slate);max-width:36em}
.meta-label{display:block;font-size:var(--fs-xs);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--slate)}
b,strong{font-weight:700}
main{overflow-wrap:break-word}
@media (max-width:420px){h1,h2,h3,main p,main li{-webkit-hyphens:auto;hyphens:auto;overflow-wrap:anywhere}}

/* ---------- Buttons ----------
   Flat: a fill and a 1 px edge. Hover changes the fill, a press shrinks the
   button a little, the arrow moves 3 px. Every variant only sets the tokens. */
.btn{
  --bg:var(--white); --fg:var(--navy); --edge:var(--navy-200); --bg-hover:var(--navy-100); --edge-hover:var(--navy-400);
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;
  height:48px;padding:0 24px;border-radius:var(--r-pill);border:1px solid var(--edge);
  background:var(--bg);color:var(--fg);
  font:700 15px/1 var(--sans);letter-spacing:-.01em;text-decoration:none;white-space:nowrap;
  cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;
  transition:background-color var(--dur) var(--ease),border-color var(--dur) var(--ease),color var(--dur) var(--ease),transform .15s var(--ease)}
.btn:hover{background:var(--bg-hover);border-color:var(--edge-hover)}
.btn:active{transform:scale(.98)}
.btn[disabled]{cursor:progress;opacity:.7}
.btn--primary{--bg:var(--orange);--fg:var(--white);--edge:var(--orange);--bg-hover:var(--orange-hover);--edge-hover:var(--orange-hover)}
/* on Deep Navy only: transparent with a light edge */
.btn--outline{--bg:transparent;--fg:var(--white);--edge:rgba(255,255,255,.28);--bg-hover:rgba(255,255,255,.08);--edge-hover:rgba(255,255,255,.5)}
.btn--sm{height:40px;padding:0 16px;font-size:14px;gap:8px}
.btn--lg{height:56px;padding:0 32px;font-size:17px;gap:12px}
.btn--circle,.btn.btn--circle{width:48px;padding:0}
.btn--circle.btn--sm{width:40px}
.btn .icon{display:inline-flex;transition:transform var(--dur) var(--ease)}
.btn .icon svg{width:18px;height:18px}
.btn--sm .icon svg{width:16px;height:16px}
.btn:hover .icon{transform:translateX(3px)}
.btn--circle:hover .icon,.btn--circle:active .icon{transform:none}
.actions{display:flex;flex-wrap:wrap;gap:12px}
/* phones: main actions take the full width and may wrap to two lines */
@media (max-width:560px){
  .form .btn,.rsvp .btn,.cta-card .btn,.cta-band .btn,.att__controls .btn{width:100%}
  .btn{white-space:normal;text-align:center;line-height:1.25}
  .btn--lg{height:auto;min-height:56px;padding-block:12px}
}

/* text link with an arrow, for forward links inside text blocks */
.link{font-weight:700;color:var(--navy);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--navy-400);transition:text-decoration-color var(--dur) var(--ease)}
.link:hover{text-decoration-color:var(--orange)}
button.link{padding:0;border:0;background:none;cursor:pointer;font:inherit;font-weight:700}
.link--arrow{display:inline-flex;align-items:center;gap:6px}
.link--arrow svg{width:16px;height:16px}


/* ---------- Header ----------
   Deep Navy, as the summit has it (F1). The structure comes from the old
   summit header (PLAN-2, C6): three zones (logo | links centred | language
   and the red sign-up button), and a full-width "Summit 2026" panel with the
   event and the partners. On a summit sub-page, "Summit 2026" carries the red
   line, as any current page does. Built again with the tokens: flat,
   no gradient. It stays in place; once the page moves under it, a hairline
   and the large shadow appear. Hover and the current page: a red line under
   the item, grown from the centre. */
.top{position:sticky;top:0;z-index:20;background:var(--navy-deep);color:var(--on-navy);border-bottom:1px solid transparent;transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.top.is-scrolled{border-bottom-color:var(--navy-line);box-shadow:var(--sh-2)}
.top .bar{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:16px;height:var(--nav-h)}
.top .logo{display:flex;justify-self:start}
.top .logo img{height:60px;width:auto}
.bar__end{display:flex;align-items:center;justify-content:flex-end;gap:10px}

.nav{display:flex;align-items:center;gap:4px}
.nav > a,.nav-drop__btn{position:relative;display:inline-flex;align-items:center;height:44px;white-space:nowrap;padding:0 14px;
  font:600 15px/1 var(--sans);color:var(--on-navy-2);text-decoration:none;transition:color var(--dur) var(--ease)}
.nav > a::after,.nav-drop__btn::after{content:'';position:absolute;left:14px;right:14px;bottom:6px;height:2px;border-radius:2px;background:var(--orange);
  transform:scaleX(0);transition:transform .2s var(--ease)}
.nav-drop__btn::after{right:32px}
.nav > a:hover,.nav > a[aria-current="page"],.nav-drop__btn:hover,.nav-drop__btn[aria-expanded="true"],.nav-drop.is-current .nav-drop__btn{color:var(--white)}
.nav > a:hover::after,.nav > a[aria-current="page"]::after,.nav-drop__btn:hover::after,.nav-drop__btn[aria-expanded="true"]::after,.nav-drop.is-current .nav-drop__btn::after{transform:scaleX(1)}
.nav-drop{display:flex;align-items:center}
/* the sign-up button: the one red button in the bar; on the registration page it stays, without hover motion */
.top .book{flex:none;padding:0 18px}
.top .book[aria-current="page"]{box-shadow:inset 0 0 0 2px rgba(255,255,255,.35)}
.nav-drop__btn{gap:6px;padding:0 12px 0 14px;border:0;background:none;cursor:pointer}
.chev{width:14px;height:14px;flex:none;transition:transform var(--dur) var(--ease)}
.nav-drop__btn[aria-expanded="true"] .chev,.menu-drop[open] .chev{transform:rotate(180deg)}

/* the "Summit 2026" panel: full width under the bar, Summit Navy, a 3 px red
   bottom line, the large shadow; drop-in motion (fade + 6 px) */
.mega{position:absolute;top:100%;left:0;right:0;z-index:5;padding:clamp(28px,3vw,40px) 0 clamp(32px,3.4vw,44px);
  background:var(--navy);border-top:1px solid var(--navy-line);border-bottom:3px solid var(--orange);box-shadow:var(--sh-2);
  opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .2s var(--ease),transform .2s var(--ease),visibility 0s linear .2s}
.top.mega-open .mega{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.mega[hidden]{display:none}
/* less text (D23): links are titles with an icon; the summit name with its
   date in one line; the partners are logo cards with a one-word role */
.mega__grid{display:grid;grid-template-columns:minmax(220px,260px) minmax(0,1fr);gap:clamp(28px,4vw,56px);align-items:start}
.mega__main{padding-right:clamp(24px,3vw,48px);border-right:1px solid var(--navy-line)}
.mega__links{display:grid;gap:2px}
.mega__links a{display:flex;align-items:center;gap:12px;padding:8px 10px;border-radius:var(--r-sm);font-size:15px;font-weight:700;color:var(--white);text-decoration:none;transition:background var(--dur) var(--ease)}
.mega__links a:hover,.mega__links a:focus-visible{background:rgba(255,255,255,.07)}
.mega__links a[aria-current="page"]{background:rgba(255,68,54,.14)}
.mega__ico{flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:var(--r-sm);background:rgba(255,255,255,.07);color:var(--on-navy)}
.mega__ico svg{width:16px;height:16px}
.mega__links a[aria-current="page"] .mega__ico{background:var(--orange);color:var(--white)}
.mega__side{display:grid;gap:18px;align-content:start}
.mega__event{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px;max-width:none}
.mega__title{font:800 16px/1.3 var(--display);letter-spacing:-.01em;color:var(--white)}
.mega__title sup{font-size:.6em}
.mega__when{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--on-navy-label)}
.mega__when::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--orange)}
.mega__cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.mega-card{position:relative;display:grid;justify-items:start;gap:14px;padding:20px 18px 16px;border:1px solid var(--navy-line);border-radius:var(--r-md);background:rgba(255,255,255,.03);color:var(--on-navy-label);text-decoration:none;transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease)}
.mega-card:hover,.mega-card:focus-visible{border-color:rgba(255,255,255,.28);background:rgba(255,255,255,.06)}
.mega-card__logo{display:flex;align-items:center;height:34px}
.mega-card__logo img{height:22px;width:auto}
.mega-card__logo .is-mc{height:30px}
.mega-card__role{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.mega-card > .icon{position:absolute;top:14px;right:14px;opacity:.5;transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease)}
.mega-card > .icon svg{width:15px;height:15px}
.mega-card:hover > .icon{opacity:1;transform:translate(2px,-2px)}

/* language picker: a pill (globe + language); opened, only the other
   language unfolds right below it: one continuous capsule (nav.js) */
.langpick{position:relative;display:flex;align-items:center;flex:none}
.langpick.is-open{z-index:30}
.langpick__btn{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:96px;height:40px;padding:0 12px 0 10px;
  border:1px solid rgba(255,255,255,.28);border-radius:20px;cursor:pointer;background:transparent;
  font:700 13px/1 var(--sans);color:var(--white);
  transition:border-radius .45s var(--ease),border-color .3s var(--ease),color .3s var(--ease)}
.langpick__btn::before{content:'';position:absolute;inset:-1px;z-index:-1;border-radius:inherit;opacity:0;background:var(--white);transition:opacity .3s var(--ease)}
.langpick__btn:hover{border-color:rgba(255,255,255,.5)}
.langpick__btn svg{width:18px;height:18px;flex:none;transition:transform .6s var(--ease)}
.langpick.is-open .langpick__btn{border-color:transparent;border-radius:20px 20px 0 0;color:var(--navy)}
.langpick.is-open .langpick__btn::before{opacity:1}
.langpick.is-open .langpick__btn svg{transform:rotate(-30deg)}
.langpick__slider{position:absolute;top:100%;left:0;right:0;z-index:6;display:flex;justify-content:center;padding:4px 4px 5px;
  border-radius:0 0 20px 20px;background:var(--white);box-shadow:var(--sh-1);
  visibility:hidden;clip-path:inset(0 0 100% 0);transition:clip-path .5s var(--ease),visibility 0s linear .5s}
.langpick.is-open .langpick__slider{visibility:visible;clip-path:inset(0 0 -40px 0);transition-delay:0s}
.langpick__slider button[aria-pressed="true"]{display:none}
.langpick__slider button{flex:1;height:30px;border:1px solid transparent;border-radius:var(--r-pill);background:none;cursor:pointer;font:700 13px/1 var(--sans);color:var(--slate);
  transition:color .2s var(--ease),background .2s var(--ease),border-color .2s var(--ease)}
.langpick__slider button:hover,.langpick__slider button:focus-visible{color:var(--navy);border-color:var(--navy-200);background:var(--navy-100)}

/* menu button (≤1024 px): three lines that fold into an X */
.menu-toggle{display:none;width:44px;height:44px;flex:none}
.menu-toggle .icon svg path{transform-box:view-box;transform-origin:12px 12px;transition:transform .4s var(--ease),opacity .2s var(--ease)}
.menu-toggle[aria-expanded="true"] .icon .l1{transform:rotate(45deg) translateY(5px)}
.menu-toggle[aria-expanded="true"] .icon .l2{opacity:0}
.menu-toggle[aria-expanded="true"] .icon .l3{transform:rotate(-45deg) translateY(-5px)}
.top .menu-toggle .icon,.top .menu-toggle:hover .icon{transform:none}

/* phone and tablet menu: a full-height Deep Navy panel under the bar (as in
   the old summit header); the summit links fold out; no event data, no cards */
.menu{position:fixed;top:var(--nav-h);left:0;right:0;bottom:0;z-index:4;display:flex;flex-direction:column;gap:24px;overflow-y:auto;padding:16px 0 32px;
  background:var(--navy-deep);color:var(--on-navy);border-top:1px solid var(--navy-line);animation:menu-in .35s var(--ease)}
.menu[hidden]{display:none}
.menu > .wrap{width:100%}   /* auto margins in the flex column would shrink and centre them */
.menu nav{display:grid;gap:2px}
.menu nav a,.menu-drop summary{display:flex;align-items:center;min-height:52px;padding:0 16px;border-radius:var(--r-sm);font-weight:600;font-size:19px;color:var(--white);text-decoration:none}
.menu nav a:hover,.menu-drop summary:hover{background:rgba(255,255,255,.06)}
.menu nav a[aria-current="page"]{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:2px;text-decoration-color:var(--orange)}
.menu-drop summary{justify-content:space-between;cursor:pointer;list-style:none}
.menu-drop summary::-webkit-details-marker{display:none}
.menu-drop__list{display:grid;margin:2px 0 8px 16px;padding-left:12px;border-left:1px solid var(--navy-line)}
.menu .menu-drop__list a{min-height:46px;font-size:16px;font-weight:500;color:var(--on-navy-2)}
.menu .menu-drop__list a[aria-current="page"]{color:var(--white)}
.menu__cta .btn{width:100%}
.menu__event{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--on-navy-label)}
.menu__event::before{content:'';display:inline-block;width:7px;height:7px;margin-right:8px;border-radius:50%;background:var(--orange);vertical-align:1px}
@keyframes menu-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
html.has-menu,html.has-dialog{overflow:hidden}

@media (max-width:1240px){.nav{gap:0}.nav > a{padding:0 10px}.nav-drop__btn{padding:0 8px 0 10px}.nav > a::after{left:10px;right:10px}.nav-drop__btn::after{left:10px;right:26px}.top .bar{gap:10px}.top .logo img{height:52px}}
@media (max-width:1024px){
  .top .bar{grid-template-columns:minmax(0,1fr) auto}
  .top .nav,.top .mega{display:none}
  .top .menu-toggle:not([hidden]){display:inline-flex}
}
@media (max-width:640px){:root{--nav-h:68px}.top .logo img{height:42px}}
/* phones: the sign-up button moves from the bar into the menu */
@media (max-width:560px){.top .book{display:none}}
@media (max-width:380px){.top .bar{gap:8px}.bar__end{gap:8px}.top .logo img{height:36px}.langpick__btn{min-width:76px;padding:0 10px 0 8px}}

/* ---------- Sections ----------
   White and light grey alternate; navy only for the summit's dark bands (F1). */
section.band{padding:clamp(80px,9vw,136px) 0}
section.band--tight{padding:clamp(56px,6vw,88px) 0}
.band--paper{background:var(--paper)}
.band + .band:not(.band--paper){border-top:1px solid var(--line)}
.band--paper + .band,.band + .band--paper{border-top:0!important}
.head{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:end;margin-bottom:56px}
.head h2{margin:0}
.head .intro{margin:0}
.head--stack{grid-template-columns:1fr;gap:16px}
.head--stack h2{max-width:26ch}
.section-foot{display:flex;justify-content:center;margin-top:clamp(32px,4vw,48px)}
@media (max-width:1024px){.head{grid-template-columns:1fr;gap:16px;margin-bottom:40px}}

/* ---------- Page hero (sub-pages) ----------
   Deep Navy with a white heading and a calm intro. No decoration. */
.page-hero{background:var(--navy-deep);color:var(--white);padding:clamp(56px,7vw,112px) 0 clamp(56px,6vw,96px)}
.page-hero h1{color:var(--white)}
.page-hero .intro{margin-top:20px;color:var(--on-navy-2);font-size:clamp(17px,1.35vw,19px)}

/* ---------- Home hero ----------
   Deep Navy. On the left the summit name with "IDBT" in red, one sentence,
   the facts (date, venue, participants) and two buttons (sign up, agenda); on the right the
   white summit logo, large, with nothing under it (D24). Behind the content
   the five rotated pills of the old summit hero, rebuilt flat: a translucent
   fill and a 1 px edge, no gradient; they settle in by 8 px and then drift
   6 px up and down, slowly, on the one easing curve. */
.hero{position:relative;overflow:hidden;background:var(--navy-deep);color:var(--white);padding:clamp(48px,7vw,104px) 0 clamp(64px,8vw,120px)}
.hero > .wrap{position:relative;z-index:1}
.hero__grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(260px,.8fr);gap:clamp(32px,5vw,88px);align-items:center}
.hero h1{max-width:none;font-size:var(--fs-3xl);line-height:1;color:var(--white)}
.hero h1 sup{font-size:.36em;vertical-align:super;line-height:0}
.hero__year{display:block;margin-top:.12em;font-size:.6em;color:var(--on-navy-3)}
.hero .lede{margin-top:24px;max-width:34em;color:var(--on-navy-2);font-size:clamp(17px,1.4vw,20px);text-wrap:balance}
.hero__facts{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:24px;font-size:15px;font-weight:600;color:var(--on-navy-2)}
.hero__facts li{display:inline-flex;align-items:center;gap:8px}
.hero__facts svg{width:18px;height:18px;flex:none;color:var(--on-navy-3)}
.hero .actions{margin-top:36px}
.hero__mark{display:grid;place-items:center}
.hero__mark img{width:100%;max-width:420px}
@media (max-width:1024px){.hero__grid{grid-template-columns:1fr}.hero__mark{display:none}}
@media (max-width:640px){.hero .actions{flex-direction:column;align-items:stretch}}

.hero__shapes{position:absolute;inset:0;pointer-events:none}
.hero__shapes span{--rot:0deg;position:absolute;border-radius:var(--r-pill);border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.035);
  transform:rotate(var(--rot));animation:shape-in 1.2s var(--ease) var(--in,0s) both,shape-drift 12s var(--ease) var(--drift,0s) infinite alternate}
.hero__shapes span:nth-child(1){--rot:12deg;--in:.2s;--drift:1.4s;width:580px;height:130px;left:-8%;top:20%;border-color:rgba(255,68,54,.22);background:rgba(255,68,54,.07)}
.hero__shapes span:nth-child(2){--rot:-15deg;--in:.35s;--drift:0s;width:480px;height:110px;right:-6%;top:70%}
.hero__shapes span:nth-child(3){--rot:-8deg;--in:.3s;--drift:3s;width:280px;height:72px;left:6%;bottom:6%;border-color:rgba(255,68,54,.16);background:rgba(255,68,54,.05)}
.hero__shapes span:nth-child(4){--rot:20deg;--in:.45s;--drift:5s;width:190px;height:52px;right:16%;top:8%}
.hero__shapes span:nth-child(5){--rot:-25deg;--in:.5s;--drift:7s;width:140px;height:40px;left:30%;top:5%;border-color:rgba(255,68,54,.14);background:rgba(255,68,54,.04)}
@keyframes shape-in{from{opacity:0;transform:translateY(-8px) rotate(var(--rot))}to{opacity:1;transform:rotate(var(--rot))}}
@keyframes shape-drift{from{transform:rotate(var(--rot))}to{transform:translateY(6px) rotate(var(--rot))}}
@media (max-width:760px){.hero__shapes span:nth-child(1){width:360px;height:90px;left:-30%}.hero__shapes span:nth-child(2){width:300px;height:76px;right:-30%}.hero__shapes span:nth-child(4),.hero__shapes span:nth-child(5){display:none}}

/* ---------- Intro (first visit of the home page, D24) ----------
   The old summit opened with a curtain. Here: Deep Navy, the logo fades in
   and rises 8 px, a red line grows from the centre, then the whole layer (.splash; not .intro, which is the intro paragraph)
   fades out (no large movement). The inline head script only sets
   html.has-intro on the first visit and when motion is allowed; intro.js
   ends it after 1.6 s or on a click or key. Without JS nothing shows. */
.splash{display:none}
html.has-intro .splash{position:fixed;inset:0;z-index:100;display:grid;place-content:center;justify-items:center;gap:24px;background:var(--navy-deep);transition:opacity .45s var(--ease),visibility 0s linear .45s}
html.has-intro:not(.intro-out){overflow:hidden}
html.intro-out .splash{opacity:0;visibility:hidden;pointer-events:none}
.splash__logo{width:min(240px,56vw);animation:intro-rise .7s var(--ease) .1s both}
.splash__line{width:72px;height:3px;border-radius:2px;background:var(--orange);animation:intro-line .6s var(--ease) .55s both}
@keyframes intro-rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes intro-line{from{transform:scaleX(0)}to{transform:scaleX(1)}}
/* after the intro, the hero content comes in one part after the other */
html.has-intro .hero__grid > div > *,html.has-intro .hero__mark{animation:intro-rise .6s var(--ease) both}
html.has-intro .hero h1{animation-delay:1.55s}
html.has-intro .hero .lede{animation-delay:1.71s}
html.has-intro .hero__facts{animation-delay:1.79s}
html.has-intro .hero .actions{animation-delay:1.87s}
html.has-intro .hero__mark{animation-delay:1.7s}
html.has-intro .hero__shapes span{animation-delay:calc(1.5s + var(--in)),var(--drift)}

/* ---------- Partner strip (home) ----------
   Organiser, partner and venue in one row between hairlines, on white. */
.partner-strip{border-bottom:1px solid var(--line)}
.partner-strip ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.partner-strip li{display:grid;justify-items:center;align-content:center;gap:12px;padding:28px 16px}
.partner-strip li + li{border-left:1px solid var(--line)}
.partner-strip img{height:32px;width:auto}
.partner-strip .is-mc{height:40px}
.partner-strip .is-delta{height:30px}
@media (max-width:640px){.partner-strip ul{grid-template-columns:1fr}.partner-strip li + li{border-left:0;border-top:1px solid var(--line)}}

/* ---------- About the summit (home) ----------
   The heading and two paragraphs on the left, a photo of the summit 2025 on
   the right (D26); below both, the four values in one row, each with a
   hairline on top (no icons, no numbers). */
.about{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,96px) clamp(40px,6vw,96px);align-items:center}
.about__text h2{margin-bottom:24px}
.about__text p{color:var(--slate)}
.about__text p + p{margin-top:16px}
.about__photo{margin:0}
.about__photo img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:var(--r-md)}
.about__photo figcaption{margin-top:8px;color:var(--slate);font-size:13px;text-align:right}
.values{grid-column:1 / -1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px clamp(20px,2.4vw,36px);margin-top:clamp(0px,1vw,16px)}
.values li{display:grid;gap:6px;align-content:start;padding-top:18px;border-top:1px solid var(--navy-200)}
.values h3{font:700 17px/1.35 var(--sans);letter-spacing:0}
.values p{color:var(--slate);font-size:16px;line-height:1.6}
@media (max-width:1024px){.values{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:860px){.about{grid-template-columns:1fr}}
@media (max-width:560px){.values{grid-template-columns:1fr}}

/* ---------- Summit code (home, D27) ----------
   The navy statement band: the heading, then the three rules side by side,
   each with a hairline on top, a short title and the organiser's sentence. */
.code-band{background:var(--navy-deep);color:var(--on-navy);padding:clamp(72px,8vw,120px) 0}
.code-band h2{color:var(--white)}
.code{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px clamp(24px,3vw,48px);margin-top:clamp(32px,4vw,56px)}
.code li{display:grid;gap:10px;align-content:start;min-width:0;padding-top:20px;border-top:1px solid var(--navy-line)}
.code h3{font-size:clamp(20px,1.8vw,24px);color:var(--white)}
.code p{color:var(--on-navy-2);font-size:clamp(17px,1.3vw,19px);line-height:1.55}
@media (max-width:860px){.code{grid-template-columns:1fr}}

/* ---------- Venue (home) ----------
   The embedded map (a core element, decision D20) and a white card with the
   venue logo, the address, the two days, the transport and two buttons. */
.venue{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(300px,1fr);gap:16px;align-items:stretch}
.map{overflow:hidden;min-height:420px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--navy-100)}
.map iframe{display:block;width:100%;height:100%;min-height:420px;border:0}
.venue__card{display:flex;flex-direction:column;gap:22px;padding:clamp(24px,2.6vw,36px);border-radius:var(--r-md);background:var(--white)}
.venue__logo{width:150px;height:auto}
.venue address{font-style:normal;font-size:17px;line-height:1.55;color:var(--slate)}
.venue address strong{font-size:19px;color:var(--navy)}
.venue__facts{display:grid;gap:14px;padding-top:20px;border-top:1px solid var(--line)}
.venue__facts div{display:grid;grid-template-columns:110px minmax(0,1fr);gap:12px;align-items:baseline}
.venue__facts dd{display:grid;font-weight:700;color:var(--navy)}
.venue__time{font-weight:500;color:var(--slate);font-variant-numeric:tabular-nums}
.venue .actions{margin-top:auto;padding-top:20px;border-top:1px solid var(--line)}
@media (max-width:860px){.venue{grid-template-columns:1fr}.map,.map iframe{min-height:340px}}
@media (max-width:560px){.venue__facts div{grid-template-columns:1fr;gap:2px}.venue .actions{flex-direction:column;align-items:stretch}}

/* ---------- Two days (home) ----------
   Two paper cards side by side; a small meta line, the audience, a list. */
.days{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.day-card{display:grid;gap:12px;align-content:start;padding:clamp(24px,3vw,36px);border-radius:var(--r-md);background:var(--paper)}
.day-card h3{font-size:clamp(21px,1.8vw,24px)}
.day-card .note{color:var(--slate);font-size:15px}
.ticks{display:grid;gap:0;margin-top:8px;border-top:1px solid var(--line)}
.ticks li{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);font-weight:600;font-size:16px}
.ticks li::before{content:'';flex:none;width:7px;height:7px;border-radius:50%;background:var(--navy)}
@media (max-width:760px){.days{grid-template-columns:1fr}}

/* ---------- Key facts ----------
   Four figures between hairlines. Tabular numerals. */
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-block:1px solid var(--line);margin-top:clamp(48px,6vw,80px)}
.facts li{display:grid;gap:4px;padding:28px 20px}
.facts li + li{border-left:1px solid var(--line)}
.facts b{font:700 clamp(36px,4vw,56px)/1 var(--display);letter-spacing:-.03em;color:var(--navy);font-variant-numeric:tabular-nums}
.facts span{color:var(--slate);font-size:15px;font-weight:600}
@media (max-width:760px){.facts{grid-template-columns:repeat(2,minmax(0,1fr))}.facts li:nth-child(3){border-left:0}.facts li:nth-child(n+3){border-top:1px solid var(--line)}}

/* ---------- Ecosystem (home) ----------
   Six white cards on paper; a line icon, the role, one sentence. */
.eco{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.eco li{display:grid;gap:10px;align-content:start;padding:clamp(22px,2.4vw,30px);border-radius:var(--r-md);background:var(--white)}
.eco svg{width:28px;height:28px;color:var(--navy)}
.eco h3{margin-top:6px;font-size:19px}
.eco p{color:var(--slate);font-size:16px;line-height:1.6}
@media (max-width:1024px){.eco{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.eco{grid-template-columns:1fr}}

/* ---------- Speakers ----------
   Compact cards (home, agenda): the portrait (4:5) on top, name, role and the
   company logo on a paper panel below. The whole card opens the profile
   dialog (dialog.js); without JS it links to speaker.html. */
.speakers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.speaker{position:relative;display:flex;flex-direction:column;overflow:hidden;border-radius:var(--r-md);background:var(--paper);color:var(--navy);text-decoration:none;transition:background var(--dur) var(--ease)}
a.speaker:hover{background:var(--slot)}
.speaker__photo{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--navy)}
.speaker__photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 20%;transition:transform .6s var(--ease)}
a.speaker:hover .speaker__photo img{transform:scale(1.04)}
.speaker__text{display:grid;gap:4px;padding:18px 20px 20px}
.speaker__name{font:700 18px/1.25 var(--display);letter-spacing:-.01em}
.speaker__role{font-size:14px;font-weight:500;line-height:1.45;color:var(--slate)}
.speaker__more{display:inline-flex;align-items:center;gap:6px;margin-top:10px;font-size:14px;font-weight:700;color:var(--navy)}
.speaker__more svg{width:16px;height:16px;transition:transform var(--dur) var(--ease)}
a.speaker:hover .speaker__more{color:var(--orange-ink)}
a.speaker:hover .speaker__more svg{transform:translateX(3px)}
@media (max-width:1024px){.speakers{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.speakers{grid-template-columns:1fr}}

/* speaker page: the full profile. Portrait on the left, text on the right. */
.profiles{display:grid;gap:20px}
.profile{display:grid;grid-template-columns:minmax(200px,280px) minmax(0,1fr);gap:clamp(24px,4vw,56px);padding:12px;border-radius:var(--r-md);background:var(--paper);scroll-margin-top:calc(var(--nav-h) + 24px)}
.profile__photo{overflow:hidden;border-radius:var(--r-sm);background:var(--navy);aspect-ratio:4/5}
.profile__photo img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.profile__body{display:grid;gap:16px;align-content:start;padding:clamp(12px,2vw,28px) clamp(8px,2vw,24px) clamp(12px,2vw,28px) 0}
.profile h2{font-size:clamp(26px,2.6vw,34px);max-width:none}
.profile__role{margin-top:-8px;color:var(--slate);font-weight:600;font-size:16px}
.profile__bio{color:var(--slate);font-size:16px;line-height:1.7}
.quote{padding:14px 18px;border-left:3px solid var(--navy-200);background:var(--white);border-radius:0 var(--r-sm) var(--r-sm) 0}
.quote p{font-weight:600;color:var(--navy);font-size:15.5px;line-height:1.5}
.quote span{display:inline-flex;align-items:center;gap:6px;margin-top:6px;font-size:13px;font-weight:600;color:var(--slate)}
.quote svg{width:14px;height:14px}
.profile__links{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
.profile__links .btn .icon svg{width:16px;height:16px}
.profile__links .btn:hover .icon{transform:none}
.org-logo{height:18px;width:auto}
.org-logo--mc{height:24px}
@media (max-width:760px){.profile{grid-template-columns:1fr}.profile__photo{max-width:320px}.profile__body{padding:4px 8px 16px}}

/* "on stage": the agenda blocks of a speaker, as rows that link to the agenda */
.topics{display:grid;gap:6px}
.topics > .meta-label{margin-bottom:2px}
.topic{display:grid;gap:2px;padding:12px 14px;border-radius:var(--r-sm);background:var(--white);border:1px solid var(--line);text-decoration:none;transition:border-color var(--dur) var(--ease)}
.topic:hover{border-color:var(--navy-200)}
.topic__when{font-size:13px;font-weight:700;color:var(--slate);font-variant-numeric:tabular-nums}
.topic__title{font-weight:700;font-size:15.5px;color:var(--navy)}
a.topic:hover .topic__title{color:var(--orange-ink)}

/* ---------- Partner cards (home) ----------
   White cards on paper: the logo on a paper tile, role, name, text, a link. */
.partners{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.partner{display:flex;flex-direction:column;gap:12px;padding:12px 12px 24px;border-radius:var(--r-md);background:var(--white)}
.partner__logo{display:grid;place-items:center;height:140px;margin-bottom:8px;border-radius:var(--r-sm);background:var(--paper)}
.partner__logo img{height:40px;width:auto}
.partner__logo .is-mc{height:64px}
.partner__logo .is-delta{height:44px}
.partner > :not(.partner__logo){margin-inline:12px}
.partner p{color:var(--slate);font-size:16px;line-height:1.6}
.partner .btn{margin-top:auto;align-self:flex-start}
@media (max-width:1024px){.partners{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.partners{grid-template-columns:1fr}}

/* ---------- Call to action ----------
   .cta-band: the summit's navy band (home, speaker). .cta-card: a paper card
   at the end of a sub-page. One red button per region. */
.cta-band{background:var(--navy);color:var(--white);padding:clamp(80px,9vw,128px) 0}
.cta-band .wrap{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:32px 56px}
.cta-band h2{color:var(--white);max-width:18ch}
.cta-band h2 .mute{color:var(--on-navy-3)}
.cta-band p{margin-top:16px;color:var(--on-navy-2);max-width:34em}
.cta-card{display:flex;align-items:center;justify-content:space-between;gap:28px 56px;padding:clamp(36px,5vw,64px);border-radius:var(--r-md);background:var(--paper)}
.cta-card h2{max-width:22ch;text-wrap:balance}
.cta-card p{margin-top:12px;color:var(--slate)}
.cta-card .actions{flex:none}
@media (max-width:760px){.cta-card{flex-direction:column;align-items:flex-start;padding:32px 24px}.cta-card .actions,.cta-card .btn{width:100%}}

/* ---------- Agenda ----------
   One block per day: the day heading with its date line, then the programme
   as rows divided by hairlines: time | title and topic | presenter.
   Breaks and meals are plain rows; open slots say "to be announced". */
.note-box{max-width:none;padding:18px 22px;border-left:3px solid var(--navy);border-radius:0 var(--r-sm) var(--r-sm) 0;background:var(--paper);color:var(--slate);font-size:16px}
.note-box strong{color:var(--navy)}
.day-jump{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.day-jump a{display:inline-flex;align-items:center;height:40px;padding:0 16px;border:1px solid rgba(255,255,255,.28);border-radius:var(--r-pill);color:var(--white);font-size:14px;font-weight:700;text-decoration:none;transition:background var(--dur) var(--ease),border-color var(--dur) var(--ease)}
.day-jump a:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.5)}
.day{margin-top:clamp(56px,7vw,96px);scroll-margin-top:calc(var(--nav-h) + 24px)}
.day__head{display:grid;gap:8px;padding-bottom:24px;border-bottom:2px solid var(--navy)}
.day__head h2{font-size:clamp(26px,2.8vw,38px);max-width:none}
.day__info{color:var(--slate);font-size:16px;font-weight:600}
.slots{display:grid}
.slot{display:grid;grid-template-columns:140px minmax(0,1fr) minmax(180px,240px);gap:8px 32px;padding:22px 24px;border-bottom:1px solid var(--line)}
.slot__time{font:700 16px/1.4 var(--display);color:var(--navy);font-variant-numeric:tabular-nums;white-space:nowrap}
.slot__body{display:grid;gap:6px;align-content:start}
.slot__body h3{font-size:19px;line-height:1.3}
.slot__body p{color:var(--slate);font-size:16px}
.slot__points{display:grid;gap:4px;margin:2px 0}
.slot__points li{position:relative;padding-left:16px;color:var(--navy);font-size:16px;font-weight:600;line-height:1.5}
.slot__points li::before{content:'';position:absolute;left:2px;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--navy-400)}
.slot__by{display:grid;gap:4px;align-content:start;font-weight:700;font-size:15px;color:var(--navy)}
.slot__by .meta-label{font-size:11px}
.slot__open{font-weight:500;font-style:italic;color:var(--slate)}
.slot:not(:has(.slot__by)) .slot__body{grid-column:2 / -1}
.slot--plain{background:var(--paper)}
.slot--plain .slot__body h3{font:600 16px/1.4 var(--sans);letter-spacing:0;color:var(--slate)}
.slot--plain .slot__time{color:var(--slate)}
.slot--plain .slot__body p{font-size:15px}
.slot--tba .slot__body h3{font:500 16px/1.4 var(--sans);letter-spacing:0;font-style:italic;color:var(--slate)}
@media (max-width:1024px){.slot{grid-template-columns:120px minmax(0,1fr)}.slot__by{grid-column:2}}
@media (max-width:640px){.slot{grid-template-columns:1fr;gap:6px;padding:18px 14px}.slot__by,.slot:not(:has(.slot__by)) .slot__body{grid-column:auto}}

/* ---------- Two columns: info card | form ---------- */
.split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,56px);align-items:start}
.narrow{max-width:760px;margin-inline:auto}
@media (min-width:1025px){.split > .form-card{position:sticky;top:calc(var(--nav-h) + 24px)}}
@media (max-width:1024px){.split{grid-template-columns:1fr}}

/* info card: a paper card with detail rows, dividers and lists */
.info{display:grid;gap:24px;overflow-wrap:break-word;padding:clamp(24px,3vw,36px);border-radius:var(--r-md);background:var(--paper)}
.info h2{font-size:clamp(22px,2vw,26px);max-width:none}
.info h3,.info h2.info__h{font:700 17px/1.35 var(--sans);letter-spacing:0;max-width:none}
.info h2.info__h + *{margin-top:10px}
.info p{color:var(--slate);font-size:16px}
.info p + p{margin-top:10px}
.info hr{border:0;border-top:1px solid var(--line)}
.info h3 + *{margin-top:10px}
.steps + .form-note{margin-top:16px}
.steps{display:grid;gap:12px;counter-reset:step}
.steps li{position:relative;padding-left:40px;color:var(--slate);font-size:16px;counter-increment:step}
.steps li::before{content:counter(step);position:absolute;left:0;top:0;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--navy);color:var(--white);font-size:13px;font-weight:800}
.steps strong{color:var(--navy)}
.logo-row{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.meta-label + .logo-row{margin-top:12px}
.logo-tile{display:grid;place-items:center;height:56px;padding:0 18px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--white)}
.logo-tile img{height:24px;width:auto}
.logo-tile .is-mc{height:32px}
.logo-tile .is-gt{height:32px}

/* ---------- Forms ----------
   48 px fields on a white card with a line; 16 px text on phones so iOS does
   not zoom. Error: a red edge and a short hint under the field. */
.form-card{padding:clamp(24px,3vw,40px);border:1px solid var(--line);border-radius:var(--r-md);background:var(--white)}
.form-card > h2{font-size:clamp(24px,2.4vw,30px);max-width:none}
.form-card > p{margin-top:10px;color:var(--slate);font-size:16px}
.form{display:grid;gap:18px;margin-top:28px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media (max-width:560px){.row{grid-template-columns:1fr}}
.field{display:grid;gap:7px;min-width:0}
.form > *,.split > *,.row > *,.values > *,.event__grid > *,.about > *,.days > *,.hero__grid > *,.att > *,.profile > *,.venue > *,.mega__grid > *,.slot > *{min-width:0}   /* grid items: long words must not widen the track */
.field > label,.field__label{font-size:15px;font-weight:600;color:var(--navy)}
.field input,.field select,.field textarea{width:100%;min-height:48px;padding:12px 14px;border:1px solid var(--navy-200);border-radius:var(--r-sm);background:var(--white);font-size:16px;color:var(--navy);
  transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.field textarea{min-height:140px;resize:vertical}
.field select{appearance:none;padding-right:40px;background:var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231B3A5C' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center/16px}
.field input::placeholder,.field textarea::placeholder{color:var(--navy-400)}
.field input:hover,.field select:hover,.field textarea:hover{border-color:var(--navy-400)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,68,54,.18)}
.field [aria-invalid="true"]{border-color:var(--orange-ink)}
.hint{display:none;font-size:13px;font-weight:600;color:var(--orange-ink)}
[aria-invalid="true"] ~ .hint{display:block}
.check{display:grid;grid-template-columns:22px minmax(0,1fr);gap:4px 12px;align-items:start}
.check input{width:20px;height:20px;margin-top:2px;accent-color:var(--navy)}
.check label{color:var(--slate);font-size:15px;line-height:1.55}
.check label a,.form-note a{color:var(--navy);font-weight:600}
.check .hint{grid-column:2}
.form-note{color:var(--slate);font-size:14px;line-height:1.6}
.form .btn{justify-self:start}
.status{padding:16px 18px;border-radius:var(--r-sm);font-size:15px;line-height:1.55}
.status[hidden]{display:none}
.status a{color:inherit;font-weight:700}
.status p{margin-top:10px}
.status--ok{background:var(--ok-bg);color:var(--ok-ink);box-shadow:inset 3px 0 0 var(--ok-edge)}
.status--error{background:var(--err-bg);color:var(--err-ink);box-shadow:inset 3px 0 0 var(--orange)}
.honey{position:absolute;left:-5000px}
/* Cloudflare Turnstile widget (anmeldung.html): its own iframe, 300 × 65 px */
.turnstile-field{display:grid;gap:6px;min-height:65px}
.turnstile-field .hint[hidden]{display:none}
.turnstile-field .hint:not([hidden]){display:block}

/* ---------- News (aktuelles) ----------
   Paper cards: a date label, the title, the excerpt. */
.news{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.news article{display:flex;flex-direction:column;gap:10px;padding:clamp(22px,2.4vw,30px);border-radius:var(--r-md);background:var(--paper)}
.news h2{font-size:clamp(20px,1.7vw,23px);line-height:1.25;letter-spacing:-.015em;max-width:none}
.news p:not(.meta-label){color:var(--slate);font-size:16px;line-height:1.6}
@media (max-width:1024px){.news{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.news{grid-template-columns:1fr}}

/* ---------- Past events (vergangenes) ----------
   Each event: a ruled head (year, title, meta), the text and a highlights
   card, then the photo gallery. */
.event + .event{margin-top:clamp(72px,9vw,128px)}
.event{scroll-margin-top:calc(var(--nav-h) + 24px)}
.event__head{display:grid;gap:14px;padding-bottom:24px;margin-bottom:32px;border-bottom:1px solid var(--line)}
.event__head h2{max-width:none;font-size:clamp(28px,3vw,42px)}
.meta-row{display:flex;flex-wrap:wrap;gap:8px 24px;color:var(--slate);font-size:15px;font-weight:600}
.meta-row li{display:inline-flex;align-items:center;gap:8px}
.meta-row svg{width:17px;height:17px;flex:none;color:var(--navy-600)}
.event__grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,4vw,64px);align-items:start}
.event__text{display:grid;gap:16px}
.event__text h3{font-size:22px}
.event__text p{color:var(--slate)}
.event__text strong{color:var(--navy)}
.highlights{display:grid;gap:18px;padding:clamp(22px,2.6vw,32px);border-radius:var(--r-md);background:var(--paper)}
.highlights h3{font:700 17px/1.35 var(--sans);letter-spacing:0}
.highlights .ticks{margin-top:0}
.highlights .ticks li{font-weight:500;font-size:15.5px;align-items:flex-start;line-height:1.5}
.highlights .ticks li::before{margin-top:.62em}
.highlights p{color:var(--slate);font-size:15.5px}
@media (max-width:860px){.event__grid{grid-template-columns:1fr}}
/* the film of the summit 2025 (D25): 16:9, navy until the poster loads.
   Custom controls (film.js): a large round red play button on the poster,
   then a flat navy bar: play, seek (red progress), time, mute, full screen.
   The bar fades when the film plays and the pointer rests (.is-idle). */
.film{margin:0 0 clamp(40px,5vw,64px)}
.film__frame{position:relative;overflow:hidden;border-radius:var(--r-md);background:var(--navy-deep)}
.film video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:var(--navy-deep)}
.film.is-full .film__frame,.film__frame:fullscreen{border-radius:0}
.film__frame:fullscreen video{height:100%;object-fit:contain}
.film figcaption{margin-top:12px;color:var(--slate);font-size:14px}
.film__big{position:absolute;left:50%;top:50%;display:grid;place-items:center;width:84px;height:84px;margin:-42px 0 0 -42px;border:0;border-radius:50%;
  background:var(--orange);color:var(--white);cursor:pointer;transition:background var(--dur) var(--ease),transform .15s var(--ease),opacity var(--dur) var(--ease)}
.film__big svg{width:34px;height:34px;margin-left:4px}
.film__big:hover{background:var(--orange-hover)}
.film__big:active{transform:scale(.96)}
.film.has-started:not(.is-ended) .film__big{opacity:0;pointer-events:none}
.film__bar{position:absolute;left:12px;right:12px;bottom:12px;display:flex;align-items:center;gap:6px;padding:6px;border-radius:var(--r-pill);
  background:rgba(18,40,64,.86);color:var(--white);transition:opacity .3s var(--ease),transform .3s var(--ease)}
.film:not(.has-started) .film__bar{opacity:0;pointer-events:none}
.film.is-idle .film__bar{opacity:0;transform:translateY(8px)}
.film.is-idle{cursor:none}
.film__btn{flex:none;display:grid;place-items:center;width:40px;height:40px;border:0;border-radius:50%;background:none;color:inherit;cursor:pointer;transition:background var(--dur) var(--ease)}
.film__btn:hover,.film__btn:focus-visible{background:rgba(255,255,255,.12)}
.film__btn svg{width:20px;height:20px}
.film .ic-pause,.film .ic-muted,.film .ic-exit{display:none}
.film.is-playing .ic-play,.film.is-muted .ic-vol,.film.is-full .ic-full{display:none}
.film.is-playing .ic-pause,.film.is-muted .ic-muted,.film.is-full .ic-exit{display:contents}
.film__time{flex:none;min-width:84px;padding:0 6px;font-size:13px;font-weight:700;text-align:center;font-variant-numeric:tabular-nums;color:var(--on-navy-label)}
/* seek: a 4 px track with the red fill as its own element (no gradient), a transparent range input on top */
.film__track{position:relative;flex:1;min-width:60px;height:24px;margin:0 6px}
.film__track::before,.film__fill{content:'';position:absolute;left:0;top:10px;height:4px;border-radius:2px}
.film__track::before{right:0;background:rgba(255,255,255,.25)}
.film__fill{width:var(--p,0%);background:var(--orange)}
.film__seek{position:absolute;inset:0;width:100%;height:24px;margin:0;background:none;cursor:pointer;-webkit-appearance:none;appearance:none}
.film__seek::-webkit-slider-runnable-track{height:24px;background:none}
.film__seek::-moz-range-track{height:24px;background:none}
.film__seek::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;margin-top:5px;border:0;border-radius:50%;background:var(--white)}
.film__seek::-moz-range-thumb{width:14px;height:14px;border:0;border-radius:50%;background:var(--white)}
.film__seek:focus-visible{outline:2px solid var(--orange);outline-offset:4px;border-radius:2px}
@media (max-width:560px){.film__time{display:none}.film__big{width:64px;height:64px;margin:-32px 0 0 -32px}.film__big svg{width:26px;height:26px}.film__bar{left:8px;right:8px;bottom:8px}}
.gallery{margin-top:clamp(40px,5vw,64px)}
.gallery > .meta-label{margin-bottom:16px}
.gallery__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.gallery__grid + .gallery__grid{margin-top:10px}
.gallery__grid--lead{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:clamp(120px,14vw,200px)}
.gallery__grid--lead .gallery__item:first-child{grid-column:span 2;grid-row:span 2}
.gallery__item{position:relative;display:block;width:100%;aspect-ratio:4/3;padding:0;border:0;overflow:hidden;border-radius:var(--r-sm);background:var(--navy-100);cursor:zoom-in}
.gallery__grid--lead .gallery__item{aspect-ratio:auto;height:100%}
.gallery__item img{width:100%;height:100%;object-fit:cover;color:transparent;transition:transform .8s var(--ease)}
.gallery[hidden]{display:none}
.gallery__item:hover img{transform:scale(1.03)}
.gallery__credit{margin-top:14px;color:var(--slate);font-size:14px}
@media (max-width:760px){.gallery__grid,.gallery__grid--lead{grid-template-columns:1fr 1fr}}
/* lightbox: a native dialog with the photo and round arrows */
.lightbox{margin:auto;max-width:min(1200px,calc(100vw - 32px));max-height:calc(100vh - 32px);padding:0;border:0;background:transparent;overflow:visible}
.lightbox::backdrop{background:rgba(18,40,64,.92)}
.lightbox[open]{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px}
.lightbox img{max-width:100%;max-height:calc(100vh - 120px);margin:auto;border-radius:var(--r-sm)}
.lightbox__close{position:fixed;top:16px;right:16px}
.lightbox .btn svg{width:18px;height:18px}

/* ---------- RSVP (zusage, absage) ----------
   One white card with a line: an icon, the heading, the text, the facts in a
   ruled row, the actions; then a short note. */
.rsvp{display:grid;justify-items:start;gap:16px;padding:clamp(28px,4vw,48px);border:1px solid var(--line);border-radius:var(--r-md);background:var(--white)}
.rsvp h2{font-size:clamp(26px,2.8vw,36px)}
.rsvp p{color:var(--slate)}
.rsvp__icon{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--navy);color:var(--white)}
.rsvp__icon--no{background:var(--navy-100);color:var(--navy)}
.rsvp__icon svg{width:26px;height:26px}
.rsvp__facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;margin-top:8px;border-block:1px solid var(--line)}
.rsvp__facts div{display:grid;gap:4px;padding:16px 16px 16px 0}
.rsvp__facts div + div{padding-left:16px;border-left:1px solid var(--line)}
.rsvp__facts dd{font-weight:700;color:var(--navy)}
.rsvp .actions{margin-top:12px}
.rsvp-note{margin-top:24px;color:var(--slate);font-size:15.5px}
.rsvp-note a{color:var(--navy);font-weight:700}
.rsvp__facts--top{margin:0 0 8px}
.rsvp[tabindex]:focus{outline:none}
.choices{display:grid;gap:10px;border:0}
.choices legend{margin-bottom:12px;font:700 clamp(22px,2.2vw,26px)/1.2 var(--display);letter-spacing:-.02em;color:var(--navy)}
.choice{position:relative;display:grid;grid-template-columns:22px minmax(0,1fr);gap:14px;align-items:start;padding:16px 18px;border:1px solid var(--navy-200);border-radius:var(--r-sm);background:var(--white);cursor:pointer;transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease)}
.choice:hover{border-color:var(--navy-400)}
.choice:has(input:checked){border-color:var(--navy);background:var(--navy-100)}
.choice:has(input:focus-visible){outline:2px solid var(--orange);outline-offset:3px}
.choice input{width:20px;height:20px;margin-top:2px;accent-color:var(--navy)}
.choice__body{display:grid;gap:2px}
.choice__body strong{font-size:16px;color:var(--navy)}
.choice__body > span{font-size:14px;color:var(--slate)}
.choice--no{margin-top:6px}
.choices[aria-invalid="true"] .choice{border-color:var(--orange-ink)}
.choices[aria-invalid="true"] .hint{display:block}
.rsvp-reason{display:grid;gap:18px;padding:18px;border-radius:var(--r-sm);background:var(--paper)}
.rsvp-reason[hidden]{display:none}
@media (max-width:640px){.rsvp__facts{grid-template-columns:1fr}.rsvp__facts div + div{padding-left:0;border-left:0;border-top:1px solid var(--line)}}

/* ---------- "Ich bin dabei" (attending) ----------
   The controls on the left, the live preview of the LinkedIn image on the right. */
.att{display:grid;grid-template-columns:minmax(280px,4fr) minmax(0,7fr);gap:clamp(24px,4vw,56px);align-items:start}
.att__controls{display:grid;gap:20px}
.upload{position:relative;display:grid;justify-items:center;gap:6px;padding:26px 18px;border:1.5px dashed var(--navy-200);border-radius:var(--r-md);background:var(--paper);color:var(--slate);text-align:center;cursor:pointer;transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease)}
.upload:hover,.upload.is-over{border-color:var(--navy);background:var(--slot)}
.upload:focus-within{outline:2px solid var(--orange);outline-offset:3px}
.upload input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.upload svg{width:28px;height:28px;color:var(--navy)}
.upload strong{color:var(--navy);font-size:15px}
.upload__file{font-size:13px;font-weight:600;color:var(--navy);word-break:break-all}
.upload__file:empty{display:none}
.att__controls .btn{justify-self:start}
.att__note{color:var(--slate);font-size:14px}
.att__preview{padding:12px;border-radius:var(--r-md);background:var(--paper)}
.att__preview canvas{display:block;width:100%;height:auto;border-radius:var(--r-sm)}
.att__preview p{margin:12px 4px 0;color:var(--slate);font-size:14px}
@media (max-width:1024px){.att{grid-template-columns:1fr}.att__preview{order:-1}}

/* segmented toggle: a grey track, a white thumb (segmented.js) */
.segmented{position:relative;display:inline-flex;justify-self:start;padding:4px;border-radius:var(--r-pill);background:var(--navy-100)}
.segmented .thumb{position:absolute;top:4px;bottom:4px;left:4px;border-radius:var(--r-pill);opacity:0;background:var(--white);border:1px solid var(--navy-200)}
.segmented.is-ready .thumb{opacity:1;transition:transform .45s var(--ease),width .45s var(--ease)}
.segmented button{position:relative;z-index:1;height:34px;padding:0 16px;border:0;border-radius:var(--r-pill);background:none;cursor:pointer;font:700 13px/1 var(--sans);color:var(--slate);transition:color .3s var(--ease)}
.segmented button[aria-pressed="true"]{color:var(--navy)}
.segmented:not(.is-ready) button[aria-pressed="true"]{background:var(--white)}

/* ---------- Profile dialog (speakers and companies, dialog.js) ----------
   A native dialog: a header (portrait or logo | role, name, link | close),
   then the text. Esc and the backdrop close it; focus returns to the opener. */
.pdialog{margin:auto;width:min(680px,calc(100vw - 32px));max-height:min(88vh,820px);padding:0;border:1px solid var(--navy-200);border-radius:var(--r-md);
  overflow:hidden;background:var(--white);color:var(--navy);box-shadow:var(--sh-2)}
.pdialog[open]{display:flex;flex-direction:column;animation:dialog-in .35s var(--ease)}
.pdialog::backdrop{background:rgba(18,40,64,.5)}
@keyframes dialog-in{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
.pdialog__head{flex:none;position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:20px;padding:20px 72px 20px 20px;border-bottom:1px solid var(--line)}
.pdialog__media{width:112px;aspect-ratio:4/5;overflow:hidden;border-radius:var(--r-sm);background:var(--navy)}
.pdialog__media img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.pdialog__media--logo{display:grid;place-items:center;width:140px;aspect-ratio:auto;height:96px;padding:12px;background:var(--paper)}
.pdialog__media--logo img{width:auto;height:auto;max-height:44px;object-fit:contain}
.pdialog__role{margin-bottom:6px}
.pdialog h2{font-size:clamp(22px,2.4vw,26px);line-height:1.15;max-width:none}
.pdialog__org{margin-top:10px}
.pdialog__org img{height:18px;width:auto}
.pdialog__org .org-logo--mc{height:26px}
.pdialog__close{position:absolute;top:16px;right:16px}
.pdialog__close svg{width:18px;height:18px}
.pdialog__body{overflow:auto;display:grid;gap:16px;padding:22px 28px}
.pdialog__body > p{color:var(--slate);font-size:15.5px;line-height:1.7}
.pdialog__facts{display:grid;gap:8px}
.pdialog__facts li{position:relative;padding-left:18px;color:var(--slate);font-size:15px;line-height:1.55}
.pdialog__facts li::before{content:'';position:absolute;left:2px;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--navy)}
.pdialog__foot{flex:none;display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;padding:16px 28px 22px;border-top:1px solid var(--line)}
.pdialog__foot small{color:var(--slate);font-size:13px}
.pdialog__foot .link{margin-left:auto;font-size:14px}
@media (max-width:640px){.pdialog__head{grid-template-columns:1fr;padding-right:64px}.pdialog__media{width:84px}.pdialog__body{padding:18px 20px}.pdialog__foot{padding:14px 20px 18px}.pdialog__foot .link{margin-left:0}}

/* ---------- Legal pages ---------- */
.legal{max-width:760px}
.legal-note{max-width:760px;margin-bottom:32px}
.legal > p:first-child{font-size:18px;color:var(--navy)}
.legal h2{max-width:none;margin:40px 0 10px;font:700 19px/1.35 var(--sans);letter-spacing:0}
.legal h2:first-child{margin-top:0}
.legal p,.legal li{color:var(--slate)}
.legal p + p{margin-top:10px}
.legal ul{display:grid;gap:6px;margin:12px 0;padding-left:20px;list-style:disc}
.legal ul + p{margin-top:12px}
.legal a{color:var(--navy);font-weight:600}
.legal strong{color:var(--navy)}

/* ---------- Footer ----------
   Tall and Deep Navy: the summit logo, the tagline, organiser and partner on
   the left; two link columns on the right; a bottom row with the trade mark
   line, the legal links and back-to-top. Labels start with "//". */
.site-footer{position:relative;overflow:hidden;background:var(--navy-deep);color:var(--on-navy-2);padding-top:clamp(72px,9vw,120px);font-size:15px}
.site-footer a:not(.btn){color:inherit;text-decoration:none}
.footer-main{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:56px 64px;padding-bottom:clamp(56px,7vw,96px)}
.footer-info{display:grid;gap:28px;align-content:start;justify-items:start}
.footer-logo img{height:72px;width:auto}
.footer-tagline{max-width:34em;color:var(--on-navy-2);line-height:1.6}
.footer-label{display:flex;align-items:center;gap:10px;margin:0 0 12px;max-width:none;font:500 14px/1.4 var(--sans);letter-spacing:0;color:var(--white)}
.footer-label::before{content:'//';font-weight:700;letter-spacing:-.06em;color:var(--on-navy-3)}
.footer-orgs{display:flex;flex-wrap:wrap;gap:32px 48px}
.footer-orgs img{height:24px;width:auto}
.footer-orgs .is-mc{height:30px}
.footer-links{display:grid;grid-template-columns:repeat(2,minmax(150px,230px));gap:40px 56px;align-content:start}
.footer-links .footer-label{margin-bottom:24px}
.footer-links ul{display:grid;gap:14px}
.footer-links ul a{color:var(--white);font-weight:500;font-size:16px;line-height:1.4}
.footer-links ul a:hover,.footer-bottom a:not(.btn):hover{text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--orange)}
/* current page: white with a red underline (red text on Deep Navy is only 4.2:1) */
.footer-links ul a[aria-current="page"],.footer-bottom a[aria-current="page"]{color:var(--white);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:2px;text-decoration-color:var(--orange)}
.footer-bottom{display:flex;align-items:center;gap:16px 28px;flex-wrap:wrap;padding:22px 0;border-top:1px solid var(--navy-line);color:var(--on-navy-3);font-size:14px}
.footer-bottom .sep{margin:0 6px;font-weight:700;letter-spacing:-.06em}
.footer-bottom > span{margin-right:auto}
.footer-bottom a:not(.btn){display:inline-flex;align-items:center;min-height:28px;color:var(--on-navy-2)}
@media (max-width:860px){.footer-main{grid-template-columns:minmax(0,1fr)}}
@media (max-width:560px){.footer-links{grid-template-columns:minmax(0,1fr);gap:36px}.footer-bottom > span{flex-basis:100%}}

/* ---------- Reveal (reveal.js) ----------
   Blocks fade in and rise 8 px, one after another, once. */
[data-reveal].is-armed .rv{opacity:0;transform:translateY(8px)}
[data-reveal].is-in .rv{opacity:1;transform:none;transition:opacity .5s var(--ease),transform .5s var(--ease);transition-delay:calc(var(--i) * var(--step,60ms))}

/* ---------- Corners ----------
   Three radii only. This block wins over every rule above. */
.speaker,.profile,.partner,.cta-card,.day-card,.eco li,.news article,.highlights,.info,.form-card,.rsvp,.map,.venue__card,.film__frame,.pdialog,.mega-card,.att__preview,.upload{border-radius:var(--r-md)!important}
.profile__photo,.partner__logo,.logo-tile,.gallery__item,.topic,.pdialog__media,.field input,.field select,.field textarea,.status,.choice,.rsvp-reason,.mega__links a,.mega__ico{border-radius:var(--r-sm)!important}

/* ---------- Print ----------
   No header panel or menu; every revealed block is visible. */
@media print{
  .top,.skip,.menu,.mega,.site-footer .btn{display:none!important}
  [data-reveal].is-armed .rv{opacity:1!important;transform:none!important}
  section.band{padding:32px 0}
}

/* ---------- Reduced motion ----------
   Every animation has a still version. */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
  [data-reveal].is-armed .rv{opacity:1;transform:none}
  .speaker__photo img,.gallery__item img{transform:none!important}
}