/* Centrul de Strategii Avansate — v1 site styles */
  /* ------------------------------------------------------------ tokens */
  :root {
    --navy: #0a1633;      /* hero + dark sections */
    --ink: #060f26;       /* deepest panels, mega menu */
    --paper: #eef2f9;     /* light sections (cool, not cream) */
    --eu-blue: #003399;   /* EU reflex blue — text/marks on light */
    --eu-blue-lift: #2f5cff; /* reflex blue lifted for dark backgrounds */
    --eu-yellow: #ffcc00; /* the decision point — the only accent */
    --mist: #b8c8ff;      /* secondary text on navy */
    --white: #ffffff;
    --text: #0d1a3a;      /* body text on paper */
    --text-soft: #4a5878;
    --rule-dark: #1d2c55;
    --rule-light: #cdd6ea;

    --head: 350;          /* headlines: regular-light (between Light 300 and Regular 400) */
    --gutter: clamp(16px, 4vw, 56px);
    --max: 1240px;
    --r-sm: 6px; --r-md: 14px;
  }

  * { box-sizing: border-box; }
  html { scroll-behavior: smooth; }
  [id] { scroll-margin-top: 96px; } /* anchors land below the fixed header */
  @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
  body {
    margin: 0; background: var(--navy); color: var(--white);
    font-family: 'Noto Sans', system-ui, sans-serif; font-size: 17px; line-height: 1.6;
    -webkit-font-smoothing: antialiased; overflow-x: hidden;
  }
  img { display: block; max-width: 100%; }
  a { color: inherit; }
  :focus-visible { outline: 2px solid var(--eu-yellow); outline-offset: 3px; border-radius: 4px; }
  .wrap { max-width: var(--max); margin: 0 auto; padding: 0 var(--gutter); }
  .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

  /* display type: Noto Sans, regular width, regular-light weight */
  .display { font-weight: var(--head); line-height: 1.08; letter-spacing: -0.02em; margin: 0; }
  /* global h2: the section-claim size (lect-intro and the newsletter line keep their own, smaller styles) */
  h2, h2.display { font-weight: var(--head); font-size: clamp(26px, 2.8vw, 36px); line-height: 1.22; letter-spacing: -0.01em; margin: 0; }
  h3 { font-weight: 500; font-size: 22px; line-height: 1.25; margin: 0 0 10px; }
  p { margin: 0 0 1em; max-width: 64ch; }

  /* the decision point: the yellow dot motif */
  .dot { display: inline-block; width: .42em; height: .42em; border-radius: 50%; background: var(--eu-yellow); vertical-align: middle; margin: 0 .55em; transform: translateY(-.08em); }

  /* buttons */
  .btn {
    display: inline-flex; align-items: center; justify-content: center; gap: .8em; text-decoration: none; cursor: pointer; white-space: nowrap;
    font-family: 'IBM Plex Mono', ui-monospace, monospace; font-size: .625rem; /* 10px */ font-weight: 500; line-height: 1;
    letter-spacing: .14em; text-transform: uppercase;
    min-height: 2.75rem; padding: 0 1.6rem; border-radius: 999px; border: 1px solid currentColor; background: transparent;
    transition: background-color .2s, color .2s, border-color .2s;
  }
  /* solid */
  .btn-white { background: var(--white); border-color: var(--white); color: var(--eu-blue); }
  .btn-white:hover { background: #dfe6ff; border-color: #dfe6ff; }
  .btn-blue { background: var(--eu-blue); border-color: var(--eu-blue); color: var(--white); }
  .btn-blue:hover { background: #0a40b3; border-color: #0a40b3; }
  .btn-yellow { background: #f2b200; border-color: #f2b200; color: var(--ink); } /* deep yellow — trial */
  .btn-yellow:hover { background: #ffc21a; border-color: #ffc21a; }
  /* outline */
  .btn-outline-white { color: var(--white); border-color: rgba(255, 255, 255, .5); }
  .btn-outline-white:hover { border-color: var(--white); background: rgba(255, 255, 255, .08); }
  .btn-outline-blue { color: var(--eu-blue); border-color: var(--eu-blue); }
  .btn-outline-blue:hover { background: rgba(0, 51, 153, .07); }

  /* ------------------------------------------------------------ header + mega menu */
  .site-header { position: fixed; inset: 0 0 auto; z-index: 50; transition: background-color .3s, box-shadow .3s; }
  .site-header.is-solid, .site-header.has-open { background: rgba(6, 15, 38, .92); backdrop-filter: blur(14px); box-shadow: 0 1px 0 var(--rule-dark); }
  .bar { display: flex; align-items: center; gap: 28px; height: 76px; }
  .brand { display: flex; align-items: center; gap: 12px; text-decoration: none; margin-right: auto; }
  .brand { flex: none; }
  .brand img { display: block; height: 40px; width: auto; }

  .nav { display: flex; align-items: center; gap: 4px; list-style: none; margin: 0; padding: 0; }
  .nav > li > a, .nav-trigger {
    display: inline-flex; align-items: center; gap: 6px; padding: 10px 10px; border-radius: 8px;
    font-family: 'IBM Plex Mono', ui-monospace, monospace; font-size: .6875rem; /* 11px */ font-weight: 500;
    letter-spacing: .12em; text-transform: uppercase; line-height: 1;
    color: var(--white); text-decoration: none;
    background: none; border: 0; cursor: pointer; position: relative; white-space: nowrap;
  }
  .nav-trigger i { font-size: 12px; transition: transform .2s; opacity: .7; }
  .nav-trigger[aria-expanded="true"] i { transform: rotate(180deg); }
  .nav > li > a:hover, .nav-trigger:hover { background: rgba(255, 255, 255, .06); }
  .bar { gap: 20px; max-width: 1440px; }

  .mega {
    position: absolute; left: 0; right: 0; top: 100%;
    background: var(--ink); border-top: 1px solid var(--rule-dark); border-bottom: 1px solid var(--rule-dark);
    opacity: 0; transform: translateY(-6px); visibility: hidden; transition: opacity .18s ease, transform .18s ease, visibility 0s .18s;
  }
  .mega.is-open { opacity: 1; transform: none; visibility: visible; transition: opacity .18s ease, transform .18s ease; }
  .mega-grid { display: grid; grid-template-columns: 1fr 1fr 1.25fr; gap: 48px; padding: 36px var(--gutter) 40px; max-width: var(--max); margin: 0 auto; }
  .mega h4 { margin: 0 0 14px; font-size: 13px; font-weight: 600; color: var(--mist); letter-spacing: .02em; }
  .mega ul { list-style: none; margin: 0; padding: 0; }
  .mega li a { display: block; padding: 8px 0; text-decoration: none; color: var(--white); font-size: 16px; }
  .mega li a:hover { color: var(--eu-yellow); }
  .mega li a small { display: block; color: var(--mist); font-size: 13.5px; line-height: 1.45; margin-top: 2px; }
  .mega .steps li a { display: grid; grid-template-columns: 30px 1fr; padding: 10px 0; }
  .mega .steps b { font-size: 20px; color: var(--eu-yellow); line-height: 1.2; }
  .mega-feature { background: var(--navy); border: 1px solid var(--rule-dark); border-radius: var(--r-md); padding: 24px; }
  .mega-feature p { color: var(--mist); font-size: 15px; }
  .mega-feature .big { font-weight: var(--head); font-size: 30px; line-height: 1.1; color: var(--white); margin: 0 0 8px; }
  .mega-feature blockquote { margin: 0 0 16px; font-size: 21px; line-height: 1.35; font-weight: 500; }
  .mega-foot { grid-column: 1 / -1; border-top: 1px solid var(--rule-dark); padding-top: 16px; font-size: 14px; color: var(--mist); }
  .mega-foot a { color: var(--white); }
  .scrim { position: fixed; inset: 0; background: rgba(3, 8, 22, .55); z-index: 40; opacity: 0; visibility: hidden; transition: opacity .2s, visibility 0s .2s; }
  .scrim.is-on { opacity: 1; visibility: visible; transition: opacity .2s; }

  .burger { display: none; background: none; border: 0; color: var(--white); padding: 8px; cursor: pointer; font-size: 28px; line-height: 1; }

  /* ------------------------------------------------------------ hero */
  .hero { position: relative; min-height: min(100svh, 940px); display: flex; align-items: center; overflow: hidden; background:
    radial-gradient(1200px 700px at 78% 45%, #13285c 0%, rgba(10, 22, 51, 0) 60%), var(--navy); }
  /* two columns: copy left, globe right — they never overlap */
  .hero .wrap { position: relative; z-index: 2; width: 100%; padding-top: 110px; padding-bottom: 72px; pointer-events: none;
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: clamp(32px, 4vw, 64px); }
  .hero-copy { grid-column: 1; pointer-events: auto; }
  .wordmark { font-size: 3.5rem; }
  .wordmark .wide { color: var(--mist); }
  .tagline { margin: 22px 0 30px; font-family: 'IBM Plex Mono', ui-monospace, monospace; font-size: .75rem; font-weight: 400; letter-spacing: .12em; text-transform: uppercase; color: var(--mist); }
  .hero-lead { font-size: 1.3rem; line-height: 1.5; font-weight: 400; color: rgba(255, 255, 255, .74); max-width: 44ch; margin-bottom: 1.75rem; }
  .hero-lead:not(:last-of-type) { margin-bottom: .75em; }
  .hero-ctas { display: flex; flex-wrap: wrap; gap: 12px; }
  /* the globe fills the right half of the viewport (bleeds to the edge); its left edge fades so orbit trails never cut hard */
  .globe { position: absolute; z-index: 1; top: 0; bottom: 0; left: 50%; right: 0;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 9%); mask-image: linear-gradient(90deg, transparent 0, #000 9%); }

  /* ------------------------------------------------------------ sections */
  .section { padding: clamp(72px, 10vw, 128px) 0; }
  .is-paper { background: var(--paper); color: var(--text); }
  .is-ink { background: var(--ink); }
  .is-paper .lede { color: var(--text-soft); }
  .split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 6vw, 96px); align-items: start; }

  /* why */
  /* hierarchy: eyebrow (the question) → h2 (the claim) → underhead (like the hero tagline) → lead → CTA */
  .why .eyebrow { display: inline-block; font-size: .8125rem; font-weight: 500; line-height: 1.35; color: var(--eu-blue); background: rgba(0, 51, 153, .07); padding: 7px 14px; border-radius: 16px; margin: 0 0 22px; } /* pill-like overhead */
  .why-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 5vw, 80px); align-items: center; }
  .why .statement, .discern .statement, .ai .statement { color: var(--text); margin: 0; max-width: 22ch; }
  .why .tagline { color: var(--eu-blue); margin: 22px 0 32px; }
  .why .why-lead { font-size: 1.25rem; line-height: 1.5; color: var(--text); margin: 0 0 32px; max-width: 38ch; }
  .why .why-lead b { color: var(--eu-blue); font-weight: 600; }
  .choice { position: relative; aspect-ratio: 5 / 4; min-height: 320px; cursor: pointer; } /* click picks a new destination */

  /* sequence: înțelege → decide → transformă (a real sequence, so numbered) */
  .seq-head { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 56px; flex-wrap: wrap; }
  .seq-head p { color: var(--mist); margin: 0; max-width: 46ch; }
  .seq { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); position: relative; }
  .seq::before { content: ''; position: absolute; left: 0; right: 0; top: 7px; height: 1px; background: linear-gradient(90deg, var(--eu-yellow), var(--eu-blue-lift) 60%, rgba(47, 92, 255, 0)); }
  .seq li { position: relative; padding: 40px 32px 0 0; }
  .seq li::before { content: ''; position: absolute; top: 0; left: 0; width: 15px; height: 15px; box-sizing: border-box; border-radius: 50%; background: var(--navy); border: 2px solid var(--eu-yellow); }
  .seq li:first-child::before { background: var(--eu-yellow); }
  /* idle process loop (6s): ripple on a dot → the line fills to the next dot → it lights + ripples → … → reset */
  .seq::after { content: ''; position: absolute; left: 7px; top: 6.5px; width: 66.667%; height: 2px; background: var(--eu-yellow); transform-origin: left; transform: scaleX(0); animation: seq-line 6s cubic-bezier(.6, 0, .3, 1) infinite; }
  .seq li::before { z-index: 1; }
  /* ripple: a low-poly ring (two jagged polygons, like the sphere's) centred on the dot; it grows by size, not scale, so lines stay hairline */
  .seq li::after { content: ''; position: absolute; top: 7.5px; left: 7.5px; width: 15px; height: 15px; transform: translate(-50%, -50%) rotate(var(--rot, 0deg)); opacity: 0; pointer-events: none;
    background: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' fill='none' stroke='%23ffcc00'%3E%3Cpolygon points='59.7,92.1 37.5,88.5 12.2,78.5 3.9,49.2 8.2,35.3 23.7,18.1 40.6,9.3 75.7,11.1 90.6,27.6 91.7,41.7 90.7,71.2 72.1,91.6' stroke-width='1.3' vector-effect='non-scaling-stroke'/%3E%3Cpolygon points='74.5,66.1 58.1,74.1 41.3,73.1 21.0,60.6 24.2,44.4 35.5,25.4 54.7,19.6 68.1,29.5 77.3,46.7' stroke-width='1.3' vector-effect='non-scaling-stroke' opacity='.55'/%3E%3C/svg%3E") center / 100% 100% no-repeat; animation: seq-ripple 6s cubic-bezier(.2, .7, .3, 1) infinite; }
  .seq li:nth-child(2)::after { animation-delay: 2.1s; --rot: 130deg; }
  .seq li:nth-child(3)::after { animation-delay: 4.2s; --rot: 250deg; }
  .seq li:nth-child(2)::before { animation: seq-dot-2 6s linear 2.1s infinite; }
  .seq li:nth-child(3)::before { animation: seq-dot-3 6s linear 4.2s infinite; }
  @keyframes seq-line { 0%, 12% { transform: scaleX(0); opacity: 1; } 35%, 47% { transform: scaleX(.5); } 70%, 88% { transform: scaleX(1); opacity: 1; } 98% { transform: scaleX(1); opacity: 0; } 100% { transform: scaleX(0); opacity: 0; } }
  @keyframes seq-ripple { 0% { width: 12px; height: 12px; opacity: .55; transform: translate(-50%, -50%) rotate(var(--rot, 0deg)); } 12% { opacity: .45; } 26% { width: 90px; height: 90px; opacity: 0; transform: translate(-50%, -50%) rotate(calc(var(--rot, 0deg) + 45deg)); } 100% { width: 90px; height: 90px; opacity: 0; } }
  @keyframes seq-dot-2 { 0%, 53% { background: var(--eu-yellow); } 63%, 100% { background: var(--navy); } }
  @keyframes seq-dot-3 { 0%, 18% { background: var(--eu-yellow); } 28%, 100% { background: var(--navy); } }
  @media (prefers-reduced-motion: reduce) { .seq::after, .seq li::before, .seq li::after { animation: none; } }
  .seq .verb { font-weight: var(--head); font-size: clamp(40px, 4.4vw, 58px); line-height: 1; margin: 0 0 14px; }
  .seq h3 { color: var(--white); }
  .seq p { color: var(--mist); font-size: 16px; }

  /* domains matrix — grid lines with dots on the intersections, like the globe mesh */
  .domains-intro { margin: 18px 0 48px; color: var(--text-soft); font-size: 19px; }
  .matrix { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--rule-light); border-left: 1px solid var(--rule-light); list-style: none; margin: 0; padding: 0; }
  .matrix li { position: relative; border-right: 1px solid var(--rule-light); border-bottom: 1px solid var(--rule-light); padding: 30px 22px 34px; min-height: 150px; display: flex; flex-direction: column; justify-content: space-between; gap: 18px; }
  /* z-index lifts each dot over the next cells' borders; the paper ring keeps lines from touching it */
  .matrix li::after { content: ''; position: absolute; z-index: 1; right: -4px; bottom: -4px; width: 7px; height: 7px; border-radius: 50%; background: var(--eu-blue); box-shadow: 0 0 0 3px var(--paper); }
  .matrix li:nth-child(3)::after, .matrix li:nth-child(6)::after { background: #e0a800; }
  .matrix i { font-size: 30px; color: var(--eu-blue); }
  .matrix span { font-weight: 500; font-size: 21px; line-height: 1.2; color: var(--text); }

  /* featured academic program */
  .program { display: grid; grid-template-columns: 1.35fr 1fr; gap: clamp(32px, 5vw, 80px); align-items: start; }
  .program .kicker { display: inline-flex; align-items: center; gap: 10px; color: var(--mist); font-size: 15px; margin-bottom: 18px; }
  .program .kicker .dot { margin: 0; }
  .program h2 { margin-bottom: 18px; }
  .program .sub { color: var(--mist); font-size: 19px; max-width: 44ch; }
  .program h3 { margin-top: 36px; }
  .program p { color: var(--mist); }
  .facts { margin: 0; display: grid; gap: 2px; background: var(--rule-dark); border: 1px solid var(--rule-dark); border-radius: var(--r-md); overflow: hidden; }
  .facts div { background: var(--navy); padding: 20px 22px; display: grid; grid-template-columns: 112px 1fr; gap: 16px; }
  .facts dt { color: var(--mist); font-size: 14px; padding-top: 2px; }
  .facts dd { margin: 0; font-size: 16px; line-height: 1.5; }
  .brochure { margin-top: 20px; background: var(--eu-blue); border-radius: var(--r-md); padding: 24px 22px; }
  .brochure label { display: block; font-weight: 500; font-size: 19px; margin-bottom: 12px; }
  .field { display: flex; gap: 8px; }
  .field input { flex: 1; min-width: 0; font: inherit; font-size: 16px; padding: 12px 14px; border-radius: 999px; border: 1.5px solid rgba(255, 255, 255, .35); background: rgba(255, 255, 255, .08); color: var(--white); }
  .field input::placeholder { color: rgba(255, 255, 255, .6); }
  .field input:focus-visible { outline-offset: 1px; }
  .form-note { margin: 10px 0 0; font-size: 14px; color: #dbe4ff; min-height: 1.4em; }
  /* brochure as a full-width band under both program columns: label left, field right */
  .program .brochure { grid-column: 1 / -1; margin-top: 0; display: grid; grid-template-columns: 1fr minmax(0, 560px); column-gap: 32px; align-items: center; padding: 28px 32px; }
  .program .brochure label { margin: 0; font-size: 21px; }
  .program .brochure .form-note { grid-column: 2; }
  .program .brochure .form-note:empty { display: none; }
  .brochure label.consent { display: flex; align-items: flex-start; gap: 10px; margin: 16px 0 0; font-size: 14px; font-weight: 400; line-height: 1.45; color: #dbe4ff; cursor: pointer; }
  .program .brochure .consent { grid-column: 2; }
  .consent input { flex: none; width: 17px; height: 17px; margin: 1px 0 0; accent-color: var(--eu-yellow); cursor: pointer; }

  /* external links: yellow underline + new-window icon */
  .link-ext { color: inherit; text-decoration: underline; text-decoration-color: var(--eu-yellow); text-decoration-thickness: .5px; text-underline-offset: 4px; /* hairline on retina; 1px on standard screens */ transition: text-decoration-color .15s; }
  .link { color: inherit; text-decoration: underline; text-decoration-color: var(--eu-yellow); text-decoration-thickness: .5px; text-underline-offset: 4px; transition: text-decoration-color .15s; }
  .link:hover, .link-ext:hover { text-decoration-color: currentColor; }
  .link-ext i { font-size: .95em; margin-left: .3em; vertical-align: -.1em; text-decoration: none; display: inline-block; }

  /* discernment: sphere left, copy right */
  .discern-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 80px); align-items: center; }
  .discern .statement { margin-bottom: 28px; } /* same style as the "why" claim */
  .discern .lede { font-size: 1.25rem; line-height: 1.5; color: var(--text); max-width: 40ch; margin: 0 0 28px; }
  .discern .lede b { color: var(--eu-blue); font-weight: 600; }
  /* methods as an underhead (hero-tagline style), bullets between items; wraps cleanly */
  .methods { list-style: none; padding: 0; margin: 0 0 36px; display: flex; flex-wrap: wrap; row-gap: 12px; max-width: 560px; color: var(--eu-blue); line-height: 1.4; }
  .methods li { display: inline-flex; align-items: center; }
  .methods li:not(:last-child)::after { content: ''; width: .42em; height: .42em; border-radius: 50%; background: var(--eu-yellow); margin: 0 .8em; }
  .discern-visual { position: relative; aspect-ratio: 1; max-height: 720px; order: -1; } /* sphere left, copy right (DOM keeps copy first) */

  /* AI: claim + four capabilities, then the closing line */
  .ai-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 80px); align-items: center; }
  .ai .statement { color: var(--white); margin-bottom: 28px; } /* same style as the "why" claim, on ink */
  .ai .lede { font-size: 1.25rem; line-height: 1.5; color: var(--mist); max-width: 40ch; margin: 0 0 24px; }
  .ai .lede b { color: var(--white); font-weight: 600; }
  .ai-list { list-style: none; margin: 0; padding: 0; counter-reset: ai; border-top: 1px solid var(--rule-dark); }
  .ai-list li { counter-increment: ai; display: flex; align-items: baseline; gap: 18px; padding: 18px 0; border-bottom: 1px solid var(--rule-dark); font-size: 1.125rem; font-weight: 500; color: var(--white); }
  .ai-list li::before { content: counter(ai, decimal-leading-zero); font-family: 'IBM Plex Mono', ui-monospace, monospace; font-size: .75rem; letter-spacing: .1em; color: var(--eu-yellow); }
  /* closing line as a quote across both columns: yellow opening + closing marks, no rule */
  .ai-quote { margin: clamp(56px, 7vw, 96px) 0 0; padding: 0; text-align: center; }
  .ai-quote p { position: relative; display: inline-block; margin: 0; padding: 0 1.1em; font-weight: var(--head); font-size: clamp(24px, 2.6vw, 34px); line-height: 1.35; color: var(--white); max-width: 40ch; }
  .ai-quote p::before, .ai-quote p::after { position: absolute; font-size: 2.4em; line-height: 1; color: var(--eu-yellow); }
  .ai-quote p::before { content: '“'; left: -.1em; top: -.55em; }
  .ai-quote p::after { content: '”'; right: -.1em; bottom: -.85em; }
  .ai-visual { position: relative; aspect-ratio: 5 / 4; }

  /* lecturers */
  #lectori h2 { color: var(--white); margin-bottom: 18px; }
  .lect-intro { font-size: 1.125rem; line-height: 1.6; color: var(--mist); max-width: 60ch; margin: 0 0 56px; } /* body text under the h2 */
  .people { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; }
  .people .mono {
    display: grid; place-items: center; width: 132px; height: 132px; border-radius: 50%; margin-bottom: 20px;
    background: radial-gradient(circle at 30% 25%, #1c3577, var(--navy) 70%); color: var(--mist);
    font-weight: 300; font-size: 40px; letter-spacing: .02em;
    box-shadow: 0 0 0 1px var(--rule-dark), 0 0 0 7px var(--navy), 0 0 0 8px #24356a;
  }
  /* photos (lecturer crops), greyscale, hairline ring — same device as the conference speakers */
  .people .person { display: block; text-decoration: none; color: inherit; }
  .people .photo { display: block; width: 132px; height: 132px; border-radius: 50%; margin-bottom: 20px; overflow: hidden; box-shadow: 0 0 0 1px var(--eu-blue-lift), 0 0 0 7px var(--navy), 0 0 0 8px #24356a; }
  .people .photo img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.05); transition: filter .35s; }
  .people .person:hover .photo img { filter: grayscale(1) contrast(1.05) sepia(.35) hue-rotate(190deg) saturate(1.6); }
  .people .person:hover h3 { color: var(--eu-yellow); }
  .people .role { color: var(--mist); font-size: 14px; margin: 0 0 4px; }
  .people h3 { font-size: 21px; margin-bottom: 10px; }
  .people .areas { font-size: 14px; color: #8fa2d6; line-height: 1.5; margin: 0; }
  .lect-foot { margin-top: 56px; padding-top: 28px; border-top: 1px solid var(--rule-dark); display: flex; justify-content: flex-end; align-items: center; gap: 20px; flex-wrap: wrap; }
  .lect-foot p { margin: 0; color: var(--mist); }

  /* masterclass */
  .mc { display: grid; grid-template-columns: 1fr 1.25fr; gap: clamp(32px, 6vw, 96px); align-items: start; }
  .mc h2 { color: var(--text); }
  /* price as a yellow pill under the h2 */
  .price { display: inline-block; margin: 24px 0 0; padding: 11px 22px; border-radius: 999px; background: var(--eu-yellow); color: var(--ink); font-size: 20px; font-weight: 700; line-height: 1.2; letter-spacing: .01em; }
  .mc-dial { position: relative; aspect-ratio: 4 / 3; max-width: 480px; margin-top: 28px; }
  .mc .lede { margin-bottom: 28px; }
  .topics h3 { color: var(--text); margin-bottom: 8px; }
  .topics-intro { color: var(--text-soft); margin: 0 0 24px; max-width: 46ch; }
  .topics ul { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rule-light); }
  .topics a { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 4px; border-bottom: 1px solid var(--rule-light); text-decoration: none; color: var(--text); font-weight: 550; font-size: 18px; transition: color .15s, padding .2s; }
  .topics a:hover { color: var(--eu-blue); padding-left: 12px; }
  .topics a i { flex: none; font-size: 20px; color: var(--eu-blue); }

  /* closing CTA: deep-blue panel, copy left, the hero globe bleeding off the right edge */
  .cta-panel { position: relative; overflow: hidden; border-radius: 24px; color: var(--white); min-height: 440px; display: flex; align-items: center;
    background: radial-gradient(700px 420px at 80% 50%, rgba(47, 92, 255, .45), rgba(47, 92, 255, 0) 70%), linear-gradient(135deg, #003399, #0a1f5c); }
  .cta-copy { position: relative; z-index: 2; padding: clamp(40px, 6vw, 88px); max-width: 640px; }
  .cta h2 { margin: 0 0 20px; max-width: 22ch; } /* global h2 size */
  .cta-lead { font-size: 1.25rem; line-height: 1.5; color: #dbe4ff; margin: 0 0 32px; }
  .cta-actions { display: flex; flex-wrap: wrap; gap: 12px; }
  .cta-globe { position: absolute; z-index: 1; top: -8%; bottom: -8%; right: -12%; width: 60%;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 22%); mask-image: linear-gradient(90deg, transparent 0, #000 22%); }

  /* footer */
  .footer { background: var(--ink); border-top: 1px solid var(--rule-dark); padding: 64px 0 32px; font-size: 15px; }
  .news { display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; padding-bottom: 48px; border-bottom: 1px solid var(--rule-dark); }
  .news h2 { margin: 0; } /* global h2 size */
  .news p { margin: 4px 0 0; color: var(--mist); }
  .news form { flex: 1; max-width: 460px; }
  .news .field input { border-color: #2c3d6e; background: var(--navy); }
  .cols { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; padding: 48px 0; }
  .cols h3 { font-size: 15px; color: var(--mist); font-weight: 600; margin-bottom: 14px; }
  .cols ul { list-style: none; margin: 0; padding: 0; }
  .cols li { margin-bottom: 8px; }
  .cols a { text-decoration: none; }
  .cols a:hover { color: var(--eu-yellow); }
  .legal { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding-top: 24px; border-top: 1px solid var(--rule-dark); color: var(--mist); font-size: 14px; }

  /* ------------------------------------------------------------ responsive */
  @media (max-width: 1280px) {
    .bar > nav, .bar > .btn { display: none; }
    .burger { display: inline-flex; margin-left: auto; }
    .site-header.menu-open { background: var(--ink); }
    /* the menu becomes a full-screen sheet under the bar */
    .site-header.menu-open .bar > nav { display: block; position: fixed; top: 76px; left: 0; right: 0; bottom: 0; overflow: auto; background: var(--ink); padding-bottom: 32px; }
    .site-header.menu-open .nav { display: flex; flex-direction: column; align-items: stretch; gap: 0; padding: 8px var(--gutter) 0; }
    .site-header.menu-open .mobile-cta { display: inline-flex; }
    .nav > li { border-bottom: 1px solid var(--rule-dark); }
    .nav > li > a, .nav-trigger { width: 100%; justify-content: space-between; font-size: .875rem; padding: 20px 0; border-radius: 0; }
    .mega { position: static; border: 0; background: none; display: none; opacity: 1; transform: none; visibility: visible; transition: none; }
    .mega.is-open { display: block; }
    .mega-grid { grid-template-columns: 1fr; gap: 24px; padding: 0 0 24px; }
    .mobile-cta { margin: 24px var(--gutter) 0; }
    .split, .program, .mc, .discern-grid, .ai-grid { grid-template-columns: 1fr; }
    .discern-visual { order: 0; }
    .people { grid-template-columns: repeat(2, 1fr); }
    .matrix { grid-template-columns: repeat(2, 1fr); }
  }
  @media (max-width: 760px) {
    .why-grid { grid-template-columns: 1fr; }
    .cta-panel { flex-direction: column; align-items: stretch; }
    .cta-globe { position: relative; top: auto; right: auto; bottom: auto; width: 100%; height: 280px; margin-top: -24px; -webkit-mask-image: none; mask-image: none; }
    .choice { aspect-ratio: 4 / 3; min-height: 0; }
    body { font-size: 16px; }
    .wordmark { font-size: 2.5rem; }
    .hero-lead { font-size: 1.125rem; }
    .hero { flex-direction: column; align-items: stretch; min-height: auto; }
    .globe { position: relative; left: auto; right: auto; width: 100%; height: 58vw; min-height: 300px; order: -1; margin-top: 76px;
      -webkit-mask-image: none; mask-image: none; }
    .hero .wrap { padding-top: 0; grid-template-columns: 1fr; }
      .seq { grid-template-columns: 1fr; }
    .seq::before { left: 7px; right: auto; top: 0; bottom: 0; width: 1px; height: auto; background: linear-gradient(180deg, var(--eu-yellow), var(--eu-blue-lift) 70%, rgba(47, 92, 255, 0)); }
    .seq li { padding: 0 0 40px 40px; }
    .seq::after { display: none; } /* stacked: row heights vary, so only the dots ripple */
    .people { grid-template-columns: 1fr; }
    .cols { grid-template-columns: 1fr 1fr; }
    .facts div { grid-template-columns: 1fr; gap: 4px; }
    .program .brochure { grid-template-columns: 1fr; padding: 24px 22px; }
    .program .brochure label { margin-bottom: 12px; }
    .program .brochure .form-note, .program .brochure .consent { grid-column: 1; }
    .field { flex-direction: column; }
  }
  .mobile-cta { display: none; }

  /* ------------------------------------------------------------ forms on blue panels (.reg-form) */
  .reg-form { position: relative; z-index: 2; }
  .reg-form .row { display: grid; gap: 14px; }
  .reg-form .row.two { grid-template-columns: 1fr 1fr; }
  .reg-form label.text { display: block; }
  .reg-form label.text span { display: block; font-size: 14px; color: #dbe4ff; margin-bottom: 6px; }
  .reg-form label.text input, .reg-form label.text select, .reg-form label.text textarea { width: 100%; font: inherit; font-size: 16px; padding: 12px 16px; border-radius: 999px; border: 1.5px solid rgba(255, 255, 255, .35); background: rgba(255, 255, 255, .08); color: var(--white); }
  .reg-form label.text textarea { border-radius: 18px; min-height: 110px; resize: vertical; }
  .reg-form label.text select { appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23ffcc00' stroke-width='1.5'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 16px center; background-size: 16px; padding-right: 44px; cursor: pointer; }
  .reg-form label.text select option { color: var(--text); }
  .reg-form label.text input::placeholder, .reg-form label.text textarea::placeholder { color: rgba(255, 255, 255, .55); }
  .reg-form .consent { display: flex; align-items: flex-start; gap: 10px; margin: 16px 0 0; font-size: 14px; line-height: 1.45; color: #dbe4ff; cursor: pointer; }
  .reg-form .consent input { flex: none; width: 17px; height: 17px; margin: 1px 0 0; accent-color: var(--eu-yellow); cursor: pointer; }
  .reg-form .consent a { color: var(--white); text-decoration: underline; text-decoration-color: var(--eu-yellow); text-decoration-thickness: .5px; text-underline-offset: 3px; }
  .reg-form .is-invalid, .reg-form .is-invalid input, .reg-form .is-invalid select, .reg-form .is-invalid textarea { color: #ffd98a; border-color: var(--eu-yellow); }
  .reg-form .actions { margin-top: 22px; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
  .reg-form .form-note { margin: 0; color: #ffd98a; }
  .reg-form .hp { position: absolute; left: -9999px; }
  .form-done h3 { color: var(--white); font-size: 26px; font-weight: var(--head); margin: 0 0 10px; }
  .form-done p { margin: 0; }
  @media (max-width: 760px) { .reg-form .row.two { grid-template-columns: 1fr; } }

  /* ------------------------------------------------------------ FAQ (our addition on program pages) */
  .faq-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 5vw, 80px); align-items: start; }
  .faq h2 { color: var(--text); }
  .faq-list { border-top: 1px solid var(--rule-light); }
  .faq details { border-bottom: 1px solid var(--rule-light); }
  .faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 20px 4px; font-size: 18px; font-weight: 500; color: var(--text); transition: color .15s; }
  .faq summary::-webkit-details-marker { display: none; }
  .faq summary:hover { color: var(--eu-blue); }
  .faq summary i { flex: none; font-size: 20px; color: var(--eu-blue); transition: transform .2s; }
  .faq details[open] summary i { transform: rotate(45deg); }
  .faq details p { margin: 0; padding: 0 4px 22px; color: var(--text-soft); max-width: 60ch; }
  .faq-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 5vw, 80px); align-items: start; }
  @media (max-width: 1280px) { .faq-grid { grid-template-columns: 1fr; } }
  .news-consent { margin-top: 12px; font-size: 13.5px; color: var(--mist); display: flex; gap: 10px; align-items: flex-start; }
  .news-consent input { flex: none; width: 16px; height: 16px; margin-top: 2px; accent-color: var(--eu-yellow); }
  .news-consent a { color: var(--white); }
  .news .form-done { color: var(--white); font-size: 18px; margin: 0; }
  .news .form-note:empty { display: none; }

  /* ------------------------------------------------------------ cookie consent (v2) */
  .consent-banner { position: fixed; z-index: 70; left: 0; right: 0; bottom: 0; padding: 0 var(--gutter) max(16px, env(safe-area-inset-bottom)); }
  .consent-inner { max-width: var(--max); margin: 0 auto; background: var(--ink); border: 1px solid var(--rule-dark); border-radius: var(--r-md); padding: 22px 26px;
    display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px 32px; align-items: center; box-shadow: 0 20px 60px rgba(3, 8, 22, .5); }
  .consent-text p { margin: 0; font-size: 14.5px; line-height: 1.5; color: var(--mist); max-width: none; }
  .consent-text .consent-title { font-size: 16px; font-weight: 500; color: var(--white); margin-bottom: 4px; }
  .consent-text a { color: var(--white); text-decoration: underline; text-decoration-color: var(--eu-yellow); text-decoration-thickness: .5px; text-underline-offset: 3px; }
  .consent-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
  .consent-link { background: none; border: 0; cursor: pointer; color: var(--mist); font: inherit; font-size: 14px; text-decoration: underline; text-underline-offset: 3px; padding: 6px 4px; }
  .consent-link:hover { color: var(--white); }
  .consent-banner[hidden], .consent-dialog[hidden] { display: none; }
  .consent-dialog { position: fixed; z-index: 71; inset: 0; background: rgba(3, 8, 22, .6); display: grid; place-items: center; padding: var(--gutter); }
  .consent-box { position: relative; width: min(560px, 100%); background: var(--ink); border: 1px solid var(--rule-dark); border-radius: var(--r-md); padding: 32px; color: var(--white); max-height: calc(100vh - 2 * var(--gutter)); overflow: auto; }
  .consent-box h2 { font-size: 26px; margin-bottom: 10px; outline: none; }
  .consent-box > p { color: var(--mist); font-size: 15px; margin-bottom: 20px; }
  .consent-cats { list-style: none; margin: 0 0 24px; padding: 0; border-top: 1px solid var(--rule-dark); }
  .consent-cats li { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 16px 0; border-bottom: 1px solid var(--rule-dark); }
  .consent-cats b { display: block; font-weight: 500; font-size: 16px; }
  .consent-cats span { display: block; font-size: 14px; color: var(--mist); line-height: 1.45; }
  .consent-always { flex: none; font-family: 'IBM Plex Mono', ui-monospace, monospace; font-size: .625rem; letter-spacing: .12em; text-transform: uppercase; color: var(--eu-yellow); }
  .switch { position: relative; flex: none; width: 44px; height: 26px; cursor: pointer; }
  .switch input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
  .switch span { position: absolute; inset: 0; border-radius: 999px; background: #24356a; transition: background .2s; }
  .switch span::after { content: ''; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: var(--white); transition: transform .2s; }
  .switch input:checked + span { background: var(--eu-yellow); }
  .switch input:checked + span::after { transform: translateX(18px); }
  .switch input:focus-visible + span { outline: 2px solid var(--eu-yellow); outline-offset: 3px; }
  .consent-close { position: absolute; top: 14px; right: 14px; background: none; border: 0; color: var(--mist); font-size: 24px; cursor: pointer; padding: 6px; line-height: 1; }
  .consent-close:hover { color: var(--white); }
  @media (max-width: 900px) {
    .consent-inner { grid-template-columns: 1fr; }
    .consent-actions .btn { flex: 1 1 auto; }
  }