/* Version 14: Version 13 with no style changes (Carolyn Johnson, 2026-11-05: the RUK Fitness Assessment
   moves to Friday at 7:00 AM, and a RUKGAMES question joins the FAQs; its RUKGAMES uses the same .rg red).
   This is site-v13.css, rescoped to .rukcon12-v14 with keyframes prefixed r12v14-.
   Version 13: Version 12 with Carolyn Johnson's RUKGAMES and Forum update (2026-11-04): the RUKGAMES
   notice at the top of the agenda, a RUKGAMES row on the day before the main event, and every RUKGAMES
   in red ("Add in red text wherever you mention RUKGAMES"). Its rules are in "Version 13 additions" at
   the end; everything above is site-v12.css, rescoped to .rukcon12-v14.
   Version 12: Version 11 with Will Stratman's black and white RUK + RUQ lockups (2026-11-03). No style
   changes: the component picks the white or black lockup, and .hero-rukruq / .story-logos keep their sizes.
   Layout fix after it was published (Will Stratman, 2026-11-04): see "Hero layout" at the end.
   Version 11 has no style changes: this is site-v10.css, rescoped to .rukcon12-v14.
   Version 9 — Version 8 with Will Stratman's 2026-10-22 asks: a story section under the hero
   (RUKCON 11's "It's Time To Go All In." block, with the verse; its words are written in the
   Website editor's Main copy), a distinct Premium lanyard pass, and a bigger hero logo.
   A copy of site-v9.css with every rule rescoped to .rukcon12-v14 and keyframes prefixed
   r12v14-. Version 10's own rules are in the "Version 10 additions" block at the end.
   Served as a static stylesheet and linked only by pages that render Version 9,
   so no other route (RUKCON 11's homepage and /events/[eventSlug] in particular)
   downloads it. Edit this file directly. */
/* ============ Brand tokens ============ */
  .rukcon12-v14 {
    --blue: #143760;
    --blue-deep: #0d2645;
    --blue-ink: #091b33;
    --gold: #dfb136;
    --gold-dark: #9a7514;
    --red: #d93025;
    --white: #ffffff;
    --ivory: #faf8f3;
    --soft: rgba(255, 255, 255, .74);
    --line: rgba(255, 255, 255, .14);
    --gold-line: rgba(223, 177, 54, .38);
    --gold-grad: linear-gradient(135deg, #c3941f 0%, #dfb136 32%, #f4dc8c 52%, #dfb136 72%, #b88a1d 100%);
    --gold-text: linear-gradient(110deg, #b88a1d 0%, #dfb136 30%, #fbeab0 45%, #dfb136 60%, #b88a1d 100%);
    --serif: var(--font-cormorant), "Cormorant Garamond", Georgia, serif;
    --sans: var(--font-montserrat), "Montserrat", system-ui, sans-serif;
    --ease: cubic-bezier(.22, 1, .36, 1);
    --gutter: max(64px, calc((100vw - 1320px) / 2));
  }
  /* The mockup's document-level rules, scoped to this page. Element defaults from
     styles/typography.css (uppercase headings, body paragraph type) are reset here
     so only Lance's rules below style the page. */
  .rukcon12-v14, .rukcon12-v14 *, .rukcon12-v14 *::before, .rukcon12-v14 *::after { box-sizing: border-box; }
  .rukcon12-v14 { min-height: 100vh; font-family: var(--sans); line-height: normal; background: var(--blue-ink); color: white; -webkit-font-smoothing: antialiased; }
  /* :where() keeps these at one-class specificity, like the mockup's element
     rules, so Lance's class rules below still win. */
  .rukcon12-v14 :where(h1, h2, h3, p) { font-family: inherit; color: inherit; text-transform: none; letter-spacing: normal; line-height: inherit; font-size: inherit; font-weight: inherit; }
  .rukcon12-v14 :where(a) { color: inherit; text-decoration: none; }
  .rukcon12-v14 :where(button) { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
  .rukcon12-v14 :where(img) { display: block; max-width: 100%; }
  .rukcon12-v14 :where(svg) { flex: none; }
  .rukcon12-v14 :where(:focus-visible) { outline: 2px solid var(--gold); outline-offset: 4px; }
  .rukcon12-v14 section[id] { scroll-margin-top: 100px; }
  .rukcon12-v14 :is(.eyebrow, .lede) { font-family: inherit; line-height: normal; color: inherit; letter-spacing: normal; }
  .rukcon12-v14 .skip { position: fixed; z-index: 200; top: -100px; left: 16px; padding: 12px 20px; background: var(--gold); color: var(--blue-ink); font-weight: 700; border-radius: 999px; }
  .rukcon12-v14 .skip:focus { top: 16px; }

  /* ============ Shared atoms ============ */
  .rukcon12-v14 .logo { display: inline-flex; align-items: center; }
  .rukcon12-v14 .logo img { height: 32px; width: auto; transition: height .4s var(--ease); }
  .rukcon12-v14 .eyebrow { margin: 0 0 24px; display: flex; align-items: center; gap: 14px; font-size: 11px; font-weight: 700; letter-spacing: .26em; text-transform: uppercase; color: var(--gold); }
  .rukcon12-v14 .eyebrow .rule { width: 40px; height: 1px; background: currentColor; }
  .rukcon12-v14 .lede { margin: 0 0 30px; max-width: 440px; font-size: 16px; line-height: 1.7; color: var(--soft); }
  .rukcon12-v14 .cta-gold { position: relative; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; gap: 12px; background: var(--gold-grad); background-size: 200% 100%; color: var(--blue-ink); font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; padding: 17px 28px; border-radius: 999px; white-space: nowrap; box-shadow: 0 10px 30px -10px rgba(223,177,54,.55), inset 0 1px 0 rgba(255,255,255,.45); transition: background-position .6s var(--ease), transform .3s var(--ease); }
  .rukcon12-v14 .cta-gold::after { content: ""; position: absolute; inset: 0; background: linear-gradient(105deg, transparent 35%, rgba(255,255,255,.7) 50%, transparent 65%); transform: translateX(-130%); animation: r12v14-sheen 5s var(--ease) infinite; }
  .rukcon12-v14 .cta-gold:hover { background-position: 100% 0; transform: translateY(-1px); }
  .rukcon12-v14 .cta-gold svg { transition: transform .3s var(--ease); }
  .rukcon12-v14 .cta-gold:hover svg { transform: translateX(4px); }
  @keyframes r12v14-sheen { 0%, 62% { transform: translateX(-130%); } 82%, 100% { transform: translateX(130%); } }
  @keyframes r12v14-rise { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }
  .rukcon12-v14 .in { animation: r12v14-rise 1.1s var(--ease) both; animation-delay: calc(var(--d, 0) * 1s); }

  /* ============ NAV · Aurum Glass ============ */
  /* Frosted white ("Pearl Glass") bar that morphs into a pill on scroll */
  .rukcon12-v14 .glass { position: fixed; z-index: 100; top: 20px; left: 50%; width: calc(100% - 48px); max-width: 1400px; transform: translateX(-50%); display: flex; align-items: center; gap: 28px; height: 74px; padding: 0 12px 0 28px; border-radius: 22px; color: var(--blue); background: rgba(255,255,255,.93); backdrop-filter: blur(22px) saturate(180%); -webkit-backdrop-filter: blur(22px) saturate(180%); box-shadow: inset 0 0 0 1px rgba(255,255,255,.9), inset 0 -1px 0 rgba(223,177,54,.35), 0 24px 60px -24px rgba(0,0,0,.55); transition: width .7s var(--ease), max-width .7s var(--ease), height .5s var(--ease), top .5s var(--ease), background .5s, border-radius .5s var(--ease); }
  .rukcon12-v14 .glass.scrolled { max-width: 1040px; height: 62px; top: 14px; gap: 18px; padding-left: 24px; border-radius: 999px; background: rgba(255,255,255,.96); }
  .rukcon12-v14 .glass.scrolled .links a { padding: 12px 11px; letter-spacing: .15em; }
  .rukcon12-v14 .glass.scrolled .links a::after { left: 11px; right: 11px; }
  .rukcon12-v14 .glass.scrolled .logo img { height: 24px; }
  /* Links: wide-spaced capitals with a gold underline ("Classic White" style) */
  .rukcon12-v14 .glass .links { display: flex; align-items: center; margin: 0 auto; }
  .rukcon12-v14 .glass .links a { position: relative; padding: 12px 14px; font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: #4b5a6e; white-space: nowrap; transition: color .3s; }
  .rukcon12-v14 .glass .links a::after { content: ""; position: absolute; left: 14px; right: 14px; bottom: 4px; height: 2px; background: var(--gold); transform: scaleX(0); transform-origin: left; transition: transform .35s var(--ease); }
  .rukcon12-v14 .glass .links a:hover, .rukcon12-v14 .glass .links a.is-active { color: var(--blue); }
  .rukcon12-v14 .glass .links a:hover::after, .rukcon12-v14 .glass .links a.is-active::after { transform: scaleX(1); }
  .rukcon12-v14 .glass .cta-gold { flex: none; padding: 14px 22px; box-shadow: 0 8px 20px -10px rgba(184,138,29,.7); }
  .rukcon12-v14 .m-ticket, .rukcon12-v14 .menu-toggle { display: none; }
  .rukcon12-v14 .burger { position: relative; width: 22px; height: 12px; }
  .rukcon12-v14 .burger::before, .rukcon12-v14 .burger::after { content: ""; position: absolute; left: 0; height: 1.5px; background: currentColor; transition: transform .4s var(--ease), top .4s var(--ease), width .4s var(--ease); }
  .rukcon12-v14 .burger::before { top: 0; width: 100%; }
  .rukcon12-v14 .burger::after { top: 10px; width: 62%; }
  .rukcon12-v14 .menu-open .burger::before { top: 5px; transform: rotate(45deg); }
  .rukcon12-v14 .menu-open .burger::after { top: 5px; width: 100%; transform: rotate(-45deg); }
  .rukcon12-v14 .sheet { position: fixed; z-index: 99; top: 84px; left: 12px; right: 12px; padding: 14px; border-radius: 26px; color: var(--blue); background: rgba(255,255,255,.96); backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px); box-shadow: inset 0 0 0 1px rgba(223,177,54,.3), 0 30px 60px -20px rgba(0,0,0,.7); opacity: 0; visibility: hidden; transform: translateY(-14px) scale(.98); transform-origin: top center; transition: opacity .35s, transform .5s var(--ease), visibility .35s; }
  .rukcon12-v14 .menu-open .sheet { opacity: 1; visibility: visible; transform: none; }
  .rukcon12-v14 .sheet a.row { display: flex; align-items: center; padding: 16px 14px; font-size: 13px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; border-bottom: 1px solid rgba(20,55,96,.1); }
  .rukcon12-v14 .sheet a.row span { font-family: var(--serif); font-style: italic; font-weight: 500; letter-spacing: 0; text-transform: none; color: #b8891c; font-size: 18px; margin-right: 14px; }
  .rukcon12-v14 .sheet a.row svg { margin-left: auto; color: #b8891c; }
  .rukcon12-v14 .sheet .cta-gold { width: 100%; justify-content: center; margin-top: 14px; }

  /* ============ HERO · Bold & Vivid wall + Gold Highlight copy ============ */
  /* Fixed, balanced height rather than full-screen */
  .rukcon12-v14 .hero { position: relative; height: 780px; display: flex; align-items: center; overflow: hidden; background: var(--blue-ink); }
  /* Solid navy behind the copy that ends sharply, so the photos stay at full color */
  .rukcon12-v14 .hero::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(90deg, var(--blue-ink) 0%, var(--blue-ink) 36%, rgba(9,27,51,.85) 45%, rgba(9,27,51,0) 60%); }
  .rukcon12-v14 .wall-wrap { position: absolute; inset: 0; perspective: 2200px; perspective-origin: 70% 40%; }
  .rukcon12-v14 .wall { position: absolute; left: 38%; top: -40%; width: 88%; height: 185%; display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; --g: 20px; transform: rotateX(22deg) rotateZ(-16deg); animation: r12v14-wallIn 2s var(--ease) both; }
  @keyframes r12v14-wallIn { from { opacity: 0; transform: rotateX(38deg) rotateZ(-24deg) translateY(120px); } to { opacity: 1; transform: rotateX(22deg) rotateZ(-16deg); } }
  .rukcon12-v14 .col { overflow: hidden; min-height: 0; }
  .rukcon12-v14 .track { display: flex; flex-direction: column; gap: var(--g); animation: r12v14-up var(--dur, 50s) linear infinite; }
  .rukcon12-v14 .col:nth-child(even) .track { animation-name: r12v14-down; }
  .rukcon12-v14 .col:nth-child(1) .track { --dur: 52s; } .rukcon12-v14 .col:nth-child(2) .track { --dur: 60s; } .rukcon12-v14 .col:nth-child(3) .track { --dur: 44s; } .rukcon12-v14 .col:nth-child(4) .track { --dur: 56s; } .rukcon12-v14 .col:nth-child(5) .track { --dur: 48s; }
  @keyframes r12v14-up { from { transform: translateY(0); } to { transform: translateY(calc(-50% - var(--g) / 2)); } }
  @keyframes r12v14-down { from { transform: translateY(calc(-50% - var(--g) / 2)); } to { transform: translateY(0); } }
  /* Each photo is a white-matted print with a handwritten-style caption */
  .rukcon12-v14 .track figure { position: relative; margin: 0; padding: 9px 9px 32px; border-radius: 6px; background: #fdfcf9; box-shadow: 0 26px 44px -20px rgba(0,0,0,.65); backface-visibility: hidden; }
  .rukcon12-v14 .track img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 2px; filter: saturate(1.12) contrast(1.06) brightness(1.05); }
  .rukcon12-v14 .track figure.wide img { aspect-ratio: 4 / 3.4; }
  .rukcon12-v14 .track figcaption { position: absolute; left: 11px; right: 11px; bottom: 7px; font-family: var(--serif); font-style: italic; font-weight: 500; font-size: 17px; color: var(--blue); }
  .rukcon12-v14 .hero .copy { position: relative; z-index: 3; padding: 96px 0 0 var(--gutter); max-width: calc(var(--gutter) + 660px); }
  .rukcon12-v14 .hero .eyebrow { margin-bottom: 26px; gap: 14px; font-size: 12px; font-weight: 800; letter-spacing: .2em; color: white; }
  .rukcon12-v14 .hero .eyebrow .chip { padding: 8px 14px; border-radius: 999px; background: var(--gold-grad); color: var(--blue-ink); font-weight: 900; letter-spacing: .14em; }
  /* Main event date: navy glass card floating on the photo wall */
  .rukcon12-v14 .date-card { position: absolute; z-index: 4; right: var(--gutter); bottom: 72px; display: flex; align-items: center; gap: 20px; padding: 16px 26px 16px 20px; border-radius: 18px; background: rgba(9,27,51,.86); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); box-shadow: inset 0 0 0 1px var(--gold), 0 30px 60px -20px rgba(0,0,0,.8); }
  .rukcon12-v14 .date-card .ic { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 12px; background: var(--gold-grad); color: var(--blue-ink); }
  .rukcon12-v14 .date-card small { display: block; margin-bottom: 5px; font-size: 10px; font-weight: 800; letter-spacing: .24em; text-transform: uppercase; color: var(--gold); }
  .rukcon12-v14 .date-card b { display: block; font-family: var(--serif); font-size: 28px; font-weight: 600; line-height: 1; white-space: nowrap; }
  .rukcon12-v14 .date-card span { display: block; margin-top: 5px; font-size: 11px; font-weight: 600; letter-spacing: .08em; color: rgba(255,255,255,.74); }
  .rukcon12-v14 .hero h1 { margin: 0 0 26px; font-weight: 700; font-size: clamp(56px, 6.4vw, 92px); line-height: .95; letter-spacing: -.045em; }
  /* "count." printed in navy on a slanted gold marker block that swipes in */
  .rukcon12-v14 .hero .hl { position: relative; z-index: 0; display: inline-block; padding: 0 .14em .04em; margin-left: .04em; color: var(--blue-ink); font-weight: 900; letter-spacing: -.05em; }
  .rukcon12-v14 .hero .hl::before { content: ""; position: absolute; z-index: -1; inset: .08em 0 .02em; border-radius: .12em; background: var(--gold-grad); transform: skewX(-8deg); transform-origin: left; box-shadow: 0 18px 40px -12px rgba(223,177,54,.55); animation: r12v14-marker .9s var(--ease) .8s both; }
  @keyframes r12v14-marker { from { transform: skewX(-8deg) scaleX(0); } to { transform: skewX(-8deg) scaleX(1); } }
  .rukcon12-v14 .hero .lede { max-width: 480px; margin-bottom: 34px; font-size: 19px; font-weight: 500; line-height: 1.6; color: rgba(255,255,255,.9); }
  .rukcon12-v14 .hero .cta-gold { padding: 20px 34px; font-size: 13px; box-shadow: 0 12px 34px -10px rgba(223,177,54,.6), inset 0 1px 0 rgba(255,255,255,.45); }
  .rukcon12-v14 .cta-row { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 22px; }

  /* ============ Hero edge · Scroll notch rising from the next section ============ */
  .rukcon12-v14 .notch { position: relative; z-index: 6; height: 0; }
  .rukcon12-v14 .notch .tab { position: absolute; left: 50%; top: -44px; width: 180px; height: 44px; transform: translateX(-50%); border-radius: 26px 26px 0 0; background: var(--ivory); }
  .rukcon12-v14 .notch .tab::before, .rukcon12-v14 .notch .tab::after { content: ""; position: absolute; bottom: 0; width: 26px; height: 26px; }
  /* Concave fillets: ivory with a quarter circle cut from the outer top corner */
  .rukcon12-v14 .notch .tab::before { left: -26px; background: radial-gradient(circle at 0 0, transparent 26px, var(--ivory) 26.5px); }
  .rukcon12-v14 .notch .tab::after { right: -26px; background: radial-gradient(circle at 100% 0, transparent 26px, var(--ivory) 26.5px); }
  .rukcon12-v14 .notch a { position: absolute; left: 50%; top: -32px; transform: translateX(-50%); display: grid; justify-items: center; gap: 6px; font-size: 9.5px; font-weight: 800; letter-spacing: .26em; text-transform: uppercase; color: var(--blue); }
  .rukcon12-v14 .notch a b { display: grid; place-items: center; width: 40px; height: 40px; margin-top: -2px; border-radius: 50%; background: var(--gold-grad); color: var(--blue-ink); box-shadow: 0 10px 20px -8px rgba(184,138,29,.8); animation: r12v14-bob 2s ease-in-out infinite; transition: transform .3s var(--ease); }
  .rukcon12-v14 .notch a:hover b { animation-play-state: paused; transform: translateY(4px); }
  @keyframes r12v14-bob { 50% { transform: translateY(5px); } }

  /* ============ THE EXPERIENCE · Bento grid, pillars read 01 → 04 ============ */
  .rukcon12-v14 .xp { position: relative; padding: 110px var(--gutter) 110px; background: var(--ivory); color: var(--blue); }
  .rukcon12-v14 .xp-grid { display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: 230px 380px 150px; gap: 14px; }
  .rukcon12-v14 .xp .tile { position: relative; border-radius: 22px; overflow: hidden; isolation: isolate; }
  .rukcon12-v14 .xp-head { grid-column: span 2; padding: 36px 38px; display: flex; flex-direction: column; justify-content: flex-end; background: radial-gradient(90% 90% at 20% 0%, #1a4473 0%, var(--blue) 50%, var(--blue-ink) 100%); }
  .rukcon12-v14 .xp-head .eyebrow { margin: 0 0 18px; gap: 14px; font-size: 12px; font-weight: 800; letter-spacing: .22em; color: var(--gold); }
  .rukcon12-v14 .xp-head .eyebrow .rule { width: 40px; height: 2px; }
  .rukcon12-v14 .xp-head h2 { margin: 0; font-weight: 700; font-size: clamp(36px, 3.3vw, 48px); line-height: 1.02; letter-spacing: -.04em; color: white; }
  .rukcon12-v14 .xp-head h2 .g { color: transparent; background: var(--gold-text); -webkit-background-clip: text; background-clip: text; font-weight: 800; }
  .rukcon12-v14 .xp-lede { grid-column: span 2; padding: 28px 34px; display: flex; align-items: center; background: white; box-shadow: inset 0 0 0 1px rgba(20,55,96,.08); }
  .rukcon12-v14 .xp-lede p { margin: 0; font-size: 18px; font-weight: 600; line-height: 1.6; color: var(--blue); }
  .rukcon12-v14 .xp-pillar { color: white; }
  .rukcon12-v14 .xp-pillar img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; filter: saturate(1.1); transition: transform 1s var(--ease); }
  .rukcon12-v14 .xp-pillar::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(9,27,51,.05) 30%, rgba(9,27,51,.9) 100%); }
  .rukcon12-v14 .xp-pillar:hover img { transform: scale(1.06); }
  .rukcon12-v14 .xp-pillar .n { position: absolute; top: 16px; left: 18px; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: var(--gold-grad); color: var(--blue-ink); font-family: var(--serif); font-style: italic; font-weight: 600; font-size: 21px; box-shadow: 0 10px 20px -8px rgba(0,0,0,.5); }
  .rukcon12-v14 .xp-pillar .tb { position: absolute; left: 22px; right: 22px; bottom: 20px; }
  .rukcon12-v14 .xp-pillar h3 { margin: 0 0 6px; font-weight: 900; font-size: 30px; letter-spacing: -.02em; text-transform: uppercase; }
  .rukcon12-v14 .xp-pillar p { margin: 0; font-size: 14px; font-weight: 500; line-height: 1.5; color: rgba(255,255,255,.9); }
  .rukcon12-v14 .xp-plan { grid-column: span 3; padding: 28px 34px; display: flex; align-items: center; gap: 28px; background: var(--gold-grad); color: var(--blue-ink); }
  .rukcon12-v14 .xp-plan b { flex: none; font-family: var(--serif); font-style: italic; font-weight: 500; font-size: 32px; line-height: 1.05; }
  .rukcon12-v14 .xp-plan p { margin: 0; font-size: 15px; font-weight: 600; line-height: 1.55; }
  .rukcon12-v14 .xp-stat { padding: 24px 28px; display: flex; align-items: center; gap: 18px; background: var(--blue-ink); color: white; }
  .rukcon12-v14 .xp-stat strong { font-family: var(--serif); font-weight: 500; font-size: 84px; line-height: .8; color: var(--gold); }
  .rukcon12-v14 .xp-stat span { font-size: 12px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; line-height: 1.6; }

  /* ============ PROGRAM · Ticket stubs ============ */
  .rukcon12-v14 .pg { position: relative; padding: 110px var(--gutter) 120px; color: white; background: radial-gradient(70% 60% at 85% 0%, rgba(223,177,54,.12), transparent 60%), linear-gradient(180deg, var(--blue) 0%, var(--blue-deep) 55%, var(--blue-ink) 100%); }
  .rukcon12-v14 .pg-head { display: grid; grid-template-columns: 1.1fr 1fr; gap: 56px; align-items: end; margin-bottom: 52px; }
  .rukcon12-v14 .pg-head .eyebrow { margin: 0 0 18px; gap: 14px; font-size: 12px; font-weight: 800; letter-spacing: .22em; color: var(--gold); }
  .rukcon12-v14 .pg-head .eyebrow .rule { width: 40px; height: 2px; }
  .rukcon12-v14 .pg-head h2 { margin: 0; font-weight: 700; font-size: clamp(44px, 4.4vw, 64px); line-height: 1; letter-spacing: -.04em; }
  .rukcon12-v14 .pg-head h2 .g { color: transparent; background: var(--gold-text); -webkit-background-clip: text; background-clip: text; font-weight: 800; }
  .rukcon12-v14 .pg-head p { margin: 0 0 22px; font-size: 17px; font-weight: 500; line-height: 1.65; color: rgba(255,255,255,.9); }
  .rukcon12-v14 .pg-tickets { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
  /* The drop shadow lives on the wrapper so the ticket's cut-out notches stay see-through */
  .rukcon12-v14 .pg-tkw { filter: drop-shadow(0 26px 34px rgba(0,0,0,.45)); transition: transform .5s var(--ease); }
  .rukcon12-v14 .pg-tkw:hover { transform: translateY(-8px) rotate(-.6deg); }
  .rukcon12-v14 .pg-tk { --cut: 104px; height: 100%; display: grid; grid-template-rows: auto 1fr; border-radius: 22px; background: var(--ivory); color: var(--blue);
    -webkit-mask: radial-gradient(circle 13px at 0 var(--cut), transparent 12.5px, #000 13px), radial-gradient(circle 13px at 100% var(--cut), transparent 12.5px, #000 13px); -webkit-mask-composite: source-in;
    mask: radial-gradient(circle 13px at 0 var(--cut), transparent 12.5px, #000 13px) intersect, radial-gradient(circle 13px at 100% var(--cut), transparent 12.5px, #000 13px); }
  .rukcon12-v14 .pg-stub { position: relative; display: flex; align-items: center; justify-content: space-between; height: var(--cut); padding: 0 26px; border-radius: 22px 22px 0 0; background: var(--gold-grad); color: var(--blue-ink); }
  .rukcon12-v14 .pg-stub::after { content: ""; position: absolute; left: 20px; right: 20px; bottom: 0; border-bottom: 2px dashed rgba(9,27,51,.35); }
  .rukcon12-v14 .pg-stub strong { display: block; margin-bottom: 6px; font-family: var(--serif); font-weight: 600; font-size: 60px; line-height: .8; font-variant-numeric: lining-nums; }
  .rukcon12-v14 .pg-stub .d span, .rukcon12-v14 .pg-stub .w { font-size: 11px; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; }
  .rukcon12-v14 .pg-stub .w { text-align: right; letter-spacing: .2em; line-height: 1.6; }
  .rukcon12-v14 .pg-body { padding: 26px 26px 28px; }
  .rukcon12-v14 .pg-body .ph { height: 160px; margin-bottom: 20px; border-radius: 14px; overflow: hidden; }
  .rukcon12-v14 .pg-body .ph img { width: 100%; height: 100%; object-fit: cover; filter: saturate(1.1); }
  .rukcon12-v14 .pg-body small { font-size: 10px; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; color: var(--gold-dark); }
  .rukcon12-v14 .pg-body h3 { margin: 6px 0 10px; font-weight: 900; font-size: 26px; line-height: 1.05; letter-spacing: -.02em; text-transform: uppercase; }
  .rukcon12-v14 .pg-body p { margin: 0; font-size: 14.5px; font-weight: 500; line-height: 1.55; color: #3d4c60; }
  .rukcon12-v14 .pg-body .gala { margin-top: 14px; padding-top: 14px; border-top: 1px solid rgba(20,55,96,.12); font-size: 13.5px; }
  .rukcon12-v14 .pg-body .gala b { color: var(--gold-dark); }
  .rukcon12-v14 .pg-head p.last { margin-bottom: 0; }
  /* RUKSERVE from Event details (shown only when admins fill it in). */
  .rukcon12-v14 .pg-serve { margin-top: 22px; display: flex; align-items: center; gap: 22px; padding: 22px 28px; border-radius: 22px; background: rgba(255,255,255,.06); box-shadow: inset 0 0 0 1px var(--gold-line); }
  .rukcon12-v14 .pg-serve .ic { display: grid; place-items: center; flex: none; width: 58px; height: 58px; border-radius: 16px; background: var(--gold-grad); color: var(--blue-ink); }
  .rukcon12-v14 .pg-serve h3 { margin: 0 0 4px; font-weight: 800; font-size: 20px; }
  .rukcon12-v14 .pg-serve p { margin: 0; font-size: 14.5px; line-height: 1.55; color: rgba(255,255,255,.9); }
  .rukcon12-v14 .pg-serve .tag { margin-left: auto; flex: none; padding: 7px 14px; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--gold-line); color: var(--gold); font-size: 10px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }

  /* ============ TICKETS · The Golden Pass ============ */
  .rukcon12-v14 .tx { position: relative; padding: 110px var(--gutter) 120px; background: var(--ivory); color: var(--blue); }
  .rukcon12-v14 .tx-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: center; }
  /* Slack ask: General and Premium each hang on Version 2's lanyard pass, side by side (stacked on phones), each with its own inclusions and button below. */
  .rukcon12-v14 .tx-passes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px; align-items: stretch; margin: 6px 0 34px; }
  .rukcon12-v14 .tx-ticket { display: flex; flex-direction: column; align-items: center; min-width: 0; }
  .rukcon12-v14 .tx-ticket .tx-pass-wrap { margin-bottom: 40px; }
  .rukcon12-v14 .tx-ticket-body { display: flex; flex: 1; flex-direction: column; width: 100%; max-width: 440px; }
  .rukcon12-v14 .tx-ticket-body .tx-incl { flex: 1; align-content: start; }
  .rukcon12-v14 .tx-ticket-body .cta-gold { margin-top: auto; align-self: flex-start; }
  .rukcon12-v14 .tx-pass .tx-amount del { display: block; margin: 0 0 6px; font-size: 15px; font-weight: 700; opacity: .7; }
  .rukcon12-v14 .tx-phase { margin: 0 0 16px; font-size: 13px; font-weight: 700; color: var(--gold-dark); }
  .rukcon12-v14 .tx-compare { overflow-x: auto; margin: 8px 0 22px; }
  .rukcon12-v14 .tx-compare table { width: 100%; border-collapse: collapse; font-size: 14.5px; }
  .rukcon12-v14 .tx-compare caption { text-align: left; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; font-size: 12px; margin-bottom: 10px; }
  .rukcon12-v14 .tx-compare th, .rukcon12-v14 .tx-compare td { text-align: left; padding: 10px 12px; border-bottom: 1px solid rgba(20,55,96,.12); vertical-align: top; }
  .rukcon12-v14 .tx-compare th[scope="row"] { font-weight: 700; width: 42%; }
  .rukcon12-v14 .verse { margin: 14px 0 0; max-width: 38rem; font-size: 15px; font-style: italic; line-height: 1.45; color: #3d4c60; }
  .rukcon12-v14 .tx .eyebrow { margin: 0 0 18px; gap: 14px; font-size: 12px; font-weight: 800; letter-spacing: .22em; color: var(--gold-dark); }
  .rukcon12-v14 .tx .eyebrow .rule { width: 40px; height: 2px; }
  .rukcon12-v14 .tx h2 { margin: 0 0 18px; font-weight: 700; font-size: clamp(44px, 4.2vw, 60px); line-height: 1; letter-spacing: -.04em; }
  .rukcon12-v14 .tx h2 .g { color: transparent; background: linear-gradient(110deg, #b88a1d 0%, #d9a82c 30%, #e9c55f 45%, #d9a82c 60%, #b88a1d 100%); -webkit-background-clip: text; background-clip: text; font-weight: 800; }
  .rukcon12-v14 .tx-sum { margin: 0 0 30px; font-size: 18px; font-weight: 500; line-height: 1.6; color: #3d4c60; }
  .rukcon12-v14 .tx-incl { margin: 0 0 34px; padding: 0; list-style: none; display: grid; gap: 14px; }
  .rukcon12-v14 .tx-incl li { display: flex; align-items: center; gap: 14px; font-size: 16px; font-weight: 600; }
  .rukcon12-v14 .tx-incl li i { display: grid; place-items: center; flex: none; width: 30px; height: 30px; border-radius: 50%; background: var(--gold-grad); color: var(--blue-ink); font-style: normal; }
  .rukcon12-v14 .tx .cta-gold { padding: 19px 30px; font-size: 13px; }
  /* The pass: hangs from a lanyard, sways, and tilts toward the cursor on hover */
  /* ============ RISE UP QUEENS · Freedom (top of Tickets; design preview only) ============ */
  /* flow-root keeps the divider's bottom margin inside this section; otherwise it collapses into a gap that shows the navy page background. */
  .rukcon12-v14 .rq-section { position: relative; display: flow-root; padding: 110px var(--gutter) 0; background: var(--ivory); color: var(--blue); }
  /* Tickets continues the same ivory right after the divider; #tickets still clears the fixed header. */
  .rukcon12-v14 .rq-section + .tx { padding-top: 0; scroll-margin-top: 100px; }
  .rukcon12-v14 .rq { --rq-magenta: #e8208f; --rq-magenta-text: #dc1e88; --rq-grad: linear-gradient(100deg, #e8208f 0%, #c43fae 45%, #00b9c6 100%); --rq-script: "Great Vibes", "Cormorant Garamond", cursive; position: relative; display: grid; grid-template-columns: 1fr minmax(0, 580px) 1fr; gap: 26px; align-items: center; padding: 10px 0 0; }
  .rukcon12-v14 .rq::before { content: ""; position: absolute; inset: -60px calc(-1 * var(--gutter)); z-index: 0; pointer-events: none; background: radial-gradient(40% 50% at 12% 30%, rgba(232,32,143,.08), transparent 70%), radial-gradient(40% 50% at 88% 70%, rgba(0,185,198,.09), transparent 70%); }
  .rukcon12-v14 .rq-pols { position: relative; z-index: 1; display: grid; gap: 26px; justify-items: center; }
  .rukcon12-v14 .rq-pol { position: relative; width: 210px; margin: 0; padding: 10px 10px 42px; background: white; box-shadow: 0 18px 30px -16px rgba(20,55,96,.45); transition: transform .6s var(--ease); }
  .rukcon12-v14 .rq-pol:hover { transform: rotate(0deg) translateY(-6px) scale(1.04) !important; z-index: 3; }
  .rukcon12-v14 .rq-pol img { display: block; width: 100%; height: 190px; object-fit: cover; }
  .rukcon12-v14 .rq-pol figcaption { position: absolute; left: 0; right: 0; bottom: 6px; text-align: center; font-family: var(--rq-script); font-size: 28px; line-height: 1; color: var(--rq-magenta-text); }
  .rukcon12-v14 .rq-pol::before { content: ""; position: absolute; z-index: 1; top: -10px; left: 50%; width: 76px; height: 20px; transform: translateX(-50%) rotate(-3deg); background: rgba(232,32,143,.35); }
  .rukcon12-v14 .rq-pol.is-cyan::before { background: rgba(0,185,198,.4); }
  .rukcon12-v14 .rq-pols .rq-pol:nth-child(1) { transform: rotate(-6deg); }
  .rukcon12-v14 .rq-pols .rq-pol:nth-child(2) { transform: rotate(4deg) translateX(18px); }
  .rukcon12-v14 .rq-pols .rq-pol:nth-child(3) { transform: rotate(-3deg); }
  .rukcon12-v14 .rq-pols.is-right .rq-pol:nth-child(1) { transform: rotate(5deg); }
  .rukcon12-v14 .rq-pols.is-right .rq-pol:nth-child(2) { transform: rotate(-4deg) translateX(-18px); }
  .rukcon12-v14 .rq-pols.is-right .rq-pol:nth-child(3) { transform: rotate(3deg); }
  .rukcon12-v14 .rq-paper { position: relative; z-index: 2; padding: 34px; background: #fffdfa; text-align: center; box-shadow: 0 40px 70px -36px rgba(20,55,96,.55); }
  .rukcon12-v14 .rq-paper::before { content: ""; position: absolute; top: -12px; left: 50%; width: 110px; height: 24px; transform: translateX(-50%) rotate(2deg); background: rgba(232,32,143,.35); }
  .rukcon12-v14 .rq-presents { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 4px; font-size: 11px; font-weight: 800; letter-spacing: .26em; text-transform: uppercase; color: var(--rq-magenta-text); }
  .rukcon12-v14 .rq-presents img { width: auto; height: 30px; }
  .rukcon12-v14 .rq-logo { display: block; width: 280px; height: auto; margin: 10px auto 0; }
  .rukcon12-v14 .rq-tagline { margin: 4px 0 0; font-size: 12px; font-weight: 800; letter-spacing: .3em; text-transform: uppercase; color: var(--blue); }
  .rukcon12-v14 .rq-tagline span { color: var(--rq-magenta-text); }
  .rukcon12-v14 .rq-vid { position: relative; display: block; width: 100%; margin: 22px 0 0; padding: 0; overflow: hidden; aspect-ratio: 16 / 9; border: 0; border-radius: 10px; background: #111; cursor: pointer; font: inherit; color: inherit; }
  .rukcon12-v14 .rq-vid .poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
  .rukcon12-v14 .rq-vid:hover .poster { transform: scale(1.04); }
  .rukcon12-v14 .rq-vid::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, transparent 55%, rgba(0,0,0,.45)); }
  .rukcon12-v14 .rq-vid.is-playing { cursor: default; }
  .rukcon12-v14 .rq-vid.is-playing::after { display: none; }
  .rukcon12-v14 .rq-vid iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
  .rukcon12-v14 .rq-play { position: absolute; z-index: 2; left: 50%; top: 50%; display: grid; place-items: center; width: 72px; height: 72px; border-radius: 50%; background: white; color: var(--rq-magenta); transform: translate(-50%, -50%); box-shadow: 0 16px 40px -10px rgba(0,0,0,.55); transition: transform .4s var(--ease); }
  .rukcon12-v14 .rq-vid:hover .rq-play { transform: translate(-50%, -50%) scale(1.07); }
  .rukcon12-v14 .rq-play::before { content: ""; position: absolute; inset: -12px; border-radius: 50%; border: 1.5px solid rgba(255,255,255,.75); animation: r12v14-rq-ring 2.4s ease-out infinite; }
  @keyframes r12v14-rq-ring { 0% { transform: scale(.85); opacity: 1; } 100% { transform: scale(1.45); opacity: 0; } }
  .rukcon12-v14 .rq-dur { position: absolute; z-index: 2; left: 14px; bottom: 12px; padding: 6px 11px; border-radius: 999px; background: rgba(0,0,0,.55); font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: white; }
  .rukcon12-v14 .rq-paper h2 { margin: 24px 0 0; font-weight: 700; font-size: 30px; line-height: 1.05; letter-spacing: -.04em; color: var(--blue); }
  .rukcon12-v14 .rq-grad { color: transparent; background: var(--rq-grad); -webkit-background-clip: text; background-clip: text; font-weight: 800; }
  .rukcon12-v14 .rq-body { margin: 12px auto 0; max-width: 520px; font-size: 15px; line-height: 1.65; color: #3d4c60; }
  .rukcon12-v14 .rq-acts { display: flex; flex-direction: column; align-items: center; gap: 12px; margin-top: 24px; }
  .rukcon12-v14 .rq-cta { position: relative; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; gap: 12px; padding: 19px 34px; border-radius: 999px; background: var(--rq-magenta); color: white; font-size: 13px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; white-space: nowrap; box-shadow: 0 14px 30px -10px rgba(232,32,143,.55); transition: background .3s, transform .3s var(--ease); }
  .rukcon12-v14 .rq-cta:hover { background: #b81870; transform: translateY(-2px); }
  .rukcon12-v14 .rq-cta::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(105deg, transparent 35%, rgba(255,255,255,.55) 50%, transparent 65%); transform: translateX(-130%); animation: r12v14-sheen 5s var(--ease) infinite; }
  .rukcon12-v14 .rq-sep { font-size: 10.5px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: #6b7686; }
  .rukcon12-v14 .rq-divider { position: relative; display: grid; place-items: center; height: 120px; margin: 90px calc(-1 * var(--gutter)) 100px; overflow: hidden; }
  .rukcon12-v14 .rq-divider .tape { position: absolute; left: 0; right: 0; top: 50%; height: 54px; transform: translateY(-50%) rotate(-1.6deg); background: repeating-linear-gradient(135deg, rgba(232,32,143,.22) 0 14px, rgba(232,32,143,.14) 14px 28px); -webkit-mask: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); mask: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); }
  .rukcon12-v14 .rq-divider .tape.is-cyan { height: 30px; transform: translateY(-50%) rotate(1.2deg); background: rgba(0,185,198,.2); }
  .rukcon12-v14 .rq-divider .note { position: relative; z-index: 1; padding: 10px 26px 12px; background: #fffdfa; box-shadow: 0 14px 26px -14px rgba(20,55,96,.45); transform: rotate(-1.6deg); font-family: "Great Vibes", "Cormorant Garamond", cursive; font-size: 36px; line-height: 1; color: var(--blue); white-space: nowrap; }
  .rukcon12-v14 .rq-divider .note b { font-weight: 400; color: #dc1e88; }
  @media (max-width: 1180px) { .rukcon12-v14 .rq-pol { width: 160px; } .rukcon12-v14 .rq-pol img { height: 145px; } .rukcon12-v14 .rq-pol figcaption { font-size: 23px; } }
  @media (max-width: 860px) {
    .rukcon12-v14 .rq-section { padding: 72px 18px 0; }
    .rukcon12-v14 .rq { grid-template-columns: 1fr; gap: 30px; padding: 0; }
    .rukcon12-v14 .rq::before { inset: -40px -18px; }
    .rukcon12-v14 .rq-pols { grid-template-columns: repeat(3, 1fr); gap: 8px; }
    .rukcon12-v14 .rq-pols.is-right { order: 3; }
    .rukcon12-v14 .rq-pol { width: 100%; padding: 6px 6px 26px; }
    .rukcon12-v14 .rq-pol img { height: 92px; }
    .rukcon12-v14 .rq-pol figcaption { bottom: 4px; font-size: 18px; }
    .rukcon12-v14 .rq-pols .rq-pol:nth-child(n), .rukcon12-v14 .rq-pols.is-right .rq-pol:nth-child(n) { transform: rotate(-3deg); }
    .rukcon12-v14 .rq-pols .rq-pol:nth-child(2), .rukcon12-v14 .rq-pols.is-right .rq-pol:nth-child(2) { transform: rotate(3deg); }
    .rukcon12-v14 .rq-paper { padding: 26px 18px; }
    .rukcon12-v14 .rq-logo { width: 220px; }
    .rukcon12-v14 .rq-paper h2 { font-size: 26px; }
    .rukcon12-v14 .rq-cta { width: 100%; }
    .rukcon12-v14 .rq-divider { margin: 64px -18px 72px; }
    .rukcon12-v14 .rq-divider .note { font-size: 28px; }
  }
  .rukcon12-v14 .tx-pass-wrap { perspective: 1400px; display: grid; justify-items: center; }
  .rukcon12-v14 .tx-rig { display: flex; flex-direction: column; align-items: center; transform-origin: 50% 0; transform-style: preserve-3d; animation: r12v14-sway 5.5s ease-in-out infinite; }
  .rukcon12-v14 .tx-strap { position: relative; width: 38px; height: 150px; overflow: hidden; -webkit-mask: linear-gradient(180deg, transparent, #000 45%); mask: linear-gradient(180deg, transparent, #000 45%); background: repeating-linear-gradient(90deg, #17406e 0 3px, #12355d 3px 6px); box-shadow: inset 0 0 0 1px rgba(223,177,54,.35), inset 6px 0 8px -6px rgba(0,0,0,.5), inset -6px 0 8px -6px rgba(0,0,0,.5); }
  .rukcon12-v14 .tx-strap::after { content: ""; position: absolute; inset: 0 5px; border-left: 1px dashed rgba(255,255,255,.18); border-right: 1px dashed rgba(255,255,255,.18); }
  .rukcon12-v14 .tx-strap span { position: absolute; left: 50%; top: 0; transform: translateX(-50%) rotate(180deg); writing-mode: vertical-rl; font-size: 9px; font-weight: 900; letter-spacing: .3em; white-space: nowrap; color: rgba(223,177,54,.85); }
  .rukcon12-v14 .tx-crimp { position: relative; z-index: 2; width: 46px; height: 14px; margin-top: -4px; border-radius: 3px; background: linear-gradient(90deg, #8d939b 0%, #eef0f3 38%, #b7bcc3 60%, #7c828a 100%); box-shadow: 0 2px 4px rgba(0,0,0,.3); }
  .rukcon12-v14 .tx-tail { position: relative; z-index: 2; width: 38px; height: 34px; background: repeating-linear-gradient(90deg, #17406e 0 3px, #12355d 3px 6px); box-shadow: inset 0 0 0 1px rgba(223,177,54,.35); }
  .rukcon12-v14 .tx-pass { position: relative; width: 360px; height: 540px; border-radius: 24px; overflow: hidden; color: white; background: radial-gradient(120% 90% at 20% 0%, #1d4a7c 0%, var(--blue) 45%, var(--blue-ink) 100%); box-shadow: 0 50px 90px -30px rgba(9,27,51,.75), inset 0 0 0 1px var(--gold-line); margin-top: -20px; transform-origin: 50% 0; transition: transform .6s var(--ease); }
  .rukcon12-v14 .tx-pass-wrap:hover .tx-rig { animation-play-state: paused; }
  @keyframes r12v14-sway { 0%, 100% { transform: rotate(-2.2deg); } 50% { transform: rotate(2.2deg); } }
  .rukcon12-v14 .tx-pass .hole { position: absolute; z-index: 3; left: 50%; top: 14px; width: 50px; height: 14px; transform: translateX(-50%); border-radius: 999px; background: #050d1a; box-shadow: inset 0 2px 4px rgba(0,0,0,.8), 0 1px 0 rgba(255,255,255,.18); }
  .rukcon12-v14 .tx-pass .tx-fold { position: absolute; z-index: 4; left: 50%; top: 10px; width: 38px; height: 12px; transform: translateX(-50%); border-radius: 0 0 10px 10px; background: linear-gradient(180deg, #12355d, #08203d); box-shadow: 0 3px 4px rgba(0,0,0,.45); }
  .rukcon12-v14 .tx-pass .foil { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(115deg, transparent 30%, rgba(255,240,190,.28) 45%, rgba(255,255,255,.08) 50%, transparent 62%); background-size: 250% 100%; mix-blend-mode: screen; animation: r12v14-foil 4.5s ease-in-out infinite; }
  @keyframes r12v14-foil { 0%, 100% { background-position: 120% 0; } 50% { background-position: -20% 0; } }
  .rukcon12-v14 .tx-pass .top { padding: 56px 30px 0; }
  .rukcon12-v14 .tx-pass .top img { height: 30px; width: auto; }
  .rukcon12-v14 .tx-pass .tier { margin: 30px 0 0; font-size: 11px; font-weight: 800; letter-spacing: .26em; text-transform: uppercase; color: var(--gold); }
  .rukcon12-v14 .tx-pass h3 { margin: 6px 0 0; font-weight: 900; font-size: 40px; line-height: .95; letter-spacing: -.03em; text-transform: uppercase; }
  .rukcon12-v14 .tx-pass .photo { height: 150px; margin: 24px 30px 0; border-radius: 14px; overflow: hidden; }
  .rukcon12-v14 .tx-pass .photo img { width: 100%; height: 100%; object-fit: cover; }
  .rukcon12-v14 .tx-pass .base { position: absolute; left: 0; right: 0; bottom: 0; padding: 22px 30px 26px; display: flex; align-items: flex-end; justify-content: space-between; background: var(--gold-grad); color: var(--blue-ink); }
  .rukcon12-v14 .tx-price { display: flex; align-items: baseline; gap: 8px; }
  .rukcon12-v14 .tx-price b { font-family: var(--serif); font-weight: 500; font-size: 60px; line-height: .85; font-variant-numeric: lining-nums; }
  /* Port: Tailwind preflight gives sup position:relative; top:-.5em; line-height:0. Undo it to match the mockup. */
  .rukcon12-v14 .tx-price b sup { font-size: .42em; vertical-align: .9em; margin-right: 2px; position: static; top: auto; line-height: 1; }
  .rukcon12-v14 .tx-price span { font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; opacity: .8; }
  .rukcon12-v14 .tx-pass .when { text-align: right; font-size: 11px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; line-height: 1.6; }

  /* ============ PLAN YOUR STAY · Map & booking card ============ */
  .rukcon12-v14 .st { position: relative; height: 800px; overflow: hidden; color: white; background: var(--blue-deep); }
  /* Live map, desaturated and tinted brand navy; the navy background shows if the map can't load */
  /* Centred on the hotel (OpenStreetMap: 33.22321, -97.16888). The iframe is 140% wide at -4%, so it covers the full width and its centre, the hotel, sits at 66% under the pin. */
  .rukcon12-v14 .st-map { position: absolute; top: -60px; left: -4%; width: 140%; height: calc(100% + 120px); border: 0; pointer-events: none; filter: grayscale(1) contrast(1.05) brightness(.9); }
  .rukcon12-v14 .st::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(90deg, rgba(9,27,51,.92) 0%, rgba(13,38,69,.65) 45%, rgba(20,55,96,.35) 100%); mix-blend-mode: multiply; }
  .rukcon12-v14 .st::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: radial-gradient(40% 50% at 66% 50%, transparent 0%, rgba(9,27,51,.35) 100%); }
  /* Logo badge pin: the tail's tip sits exactly on the hotel; the float animation keeps that anchor */
  .rukcon12-v14 .st-pin { position: absolute; z-index: 2; left: 66%; top: 50%; transform: translate(-50%, -100%); display: grid; justify-items: center; pointer-events: none; animation: r12v14-pin-float 3s ease-in-out infinite; }
  @keyframes r12v14-pin-float { 0%, 100% { transform: translate(-50%, -100%); } 50% { transform: translate(-50%, calc(-100% - 6px)); } }
  .rukcon12-v14 .st-pin .badge { display: grid; place-items: center; width: 92px; height: 92px; border-radius: 50%; background: white; box-shadow: 0 0 0 5px var(--red), 0 18px 30px -10px rgba(0,0,0,.6); }
  .rukcon12-v14 .st-pin .badge img { width: 74px; height: auto; }
  .rukcon12-v14 .st-pin .tail { width: 0; height: 0; margin-top: 3px; border-left: 12px solid transparent; border-right: 12px solid transparent; border-top: 18px solid var(--red); filter: drop-shadow(0 6px 6px rgba(0,0,0,.35)); }
  .rukcon12-v14 .st-pin .name { position: absolute; top: 46px; left: calc(100% + 14px); transform: translateY(-50%); padding: 8px 14px; border-radius: 10px; background: rgba(9,27,51,.92); color: white; font-size: 12px; font-weight: 800; white-space: nowrap; box-shadow: inset 0 0 0 1px var(--gold-line), 0 14px 30px -12px rgba(0,0,0,.6); }
  .rukcon12-v14 .st-pin .name small { display: block; font-size: 9px; letter-spacing: .2em; text-transform: uppercase; color: var(--gold); }
  @keyframes r12v14-ping { from { transform: scale(.8); opacity: 1; } to { transform: scale(2.6); opacity: 0; } }
  .rukcon12-v14 .st-card { position: absolute; z-index: 3; left: var(--gutter); top: 50%; width: 520px; transform: translateY(-50%); padding: 40px 40px 34px; border-radius: 28px; background: rgba(9,27,51,.84); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); box-shadow: inset 0 0 0 1px var(--gold-line), 0 40px 80px -30px rgba(0,0,0,.9); }
  .rukcon12-v14 .st-card .eyebrow { margin: 0 0 18px; gap: 14px; font-size: 12px; font-weight: 800; letter-spacing: .22em; color: var(--gold); }
  .rukcon12-v14 .st-card .eyebrow .rule { width: 40px; height: 2px; }
  .rukcon12-v14 .st-card h2 { margin: 0; font-weight: 700; font-size: 58px; line-height: 1; letter-spacing: -.04em; }
  .rukcon12-v14 .st-card h2 .g { color: transparent; background: var(--gold-text); -webkit-background-clip: text; background-clip: text; font-weight: 800; }
  .rukcon12-v14 .st-card .venue { margin: 18px 0 10px; font-size: 18px; font-weight: 800; }
  .rukcon12-v14 .st-card .intro { margin: 0; font-size: 16px; font-weight: 500; line-height: 1.65; color: rgba(255,255,255,.9); }
  /* Stay actions: Lance's "Concierge Menu" (design-sources/rukcon12-v2-update-stay, option E). */
  .rukcon12-v14 .st-menu { margin-top: 30px; border-top: 1px solid var(--line); }
  .rukcon12-v14 .st-row { position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: 48px 1fr auto; align-items: center; gap: 16px; padding: 16px 4px; border-bottom: 1px solid var(--line); }
  .rukcon12-v14 .st-row::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(223,177,54,.16), transparent 80%); transform: translateX(-100%); transition: transform .6s var(--ease); }
  .rukcon12-v14 .st-row:hover::before { transform: none; }
  .rukcon12-v14 .st-row .ic { position: relative; overflow: hidden; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; color: var(--gold); box-shadow: inset 0 0 0 1px var(--gold-line); }
  .rukcon12-v14 .st-row.is-main .ic { color: var(--blue-ink); background: var(--gold-grad); box-shadow: 0 10px 22px -10px rgba(223,177,54,.8); }
  .rukcon12-v14 .st-row.is-main .ic::after { content: ""; position: absolute; inset: 0; background: linear-gradient(105deg, transparent 35%, rgba(255,255,255,.65) 50%, transparent 65%); transform: translateX(-130%); animation: r12v14-sheen 5s var(--ease) infinite; }
  .rukcon12-v14 .st-row b { display: block; font-family: var(--serif); font-size: 27px; font-weight: 600; line-height: 1.05; }
  .rukcon12-v14 .st-row.is-main b { color: transparent; background: var(--gold-text); -webkit-background-clip: text; background-clip: text; }
  .rukcon12-v14 .st-row small { display: block; margin-top: 3px; font-size: 10.5px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: rgba(255,255,255,.55); }
  .rukcon12-v14 .st-row > svg { color: var(--gold); transition: transform .5s var(--ease); }
  .rukcon12-v14 .st-row:hover > svg { transform: translateX(6px); }
  .rukcon12-v14 .st-fine { margin: 18px 0 0; font-size: 12.5px; line-height: 1.55; color: rgba(255,255,255,.55); }

  /* ============ FAQs · centered accordion ============ */
  .rukcon12-v14 .fq { padding: 110px var(--gutter) 60px; background: var(--ivory); color: var(--blue); }
  .rukcon12-v14 .fq-inner { max-width: 860px; margin: 0 auto; }
  .rukcon12-v14 .fq-head { margin-bottom: 44px; text-align: center; }
  .rukcon12-v14 .fq-head .eyebrow { justify-content: center; margin: 0 0 18px; gap: 14px; font-size: 12px; font-weight: 800; letter-spacing: .22em; color: var(--gold-dark); }
  .rukcon12-v14 .fq-head .eyebrow .rule { width: 40px; height: 2px; }
  .rukcon12-v14 .fq-head h2 { margin: 0; font-weight: 700; font-size: clamp(44px, 4.2vw, 60px); line-height: 1; letter-spacing: -.04em; }
  .rukcon12-v14 .fq-head h2 .g { color: transparent; background: linear-gradient(110deg, #b88a1d 0%, #d9a82c 30%, #e9c55f 45%, #d9a82c 60%, #b88a1d 100%); -webkit-background-clip: text; background-clip: text; font-weight: 800; }
  .rukcon12-v14 .fq-list { border-top: 1px solid rgba(20,55,96,.12); }
  .rukcon12-v14 .qa { border-bottom: 1px solid rgba(20,55,96,.12); }
  .rukcon12-v14 .qa summary { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 20px; padding: 24px 0; cursor: pointer; list-style: none; }
  .rukcon12-v14 .qa summary::-webkit-details-marker { display: none; }
  .rukcon12-v14 .qa .n { min-width: 30px; font-family: var(--serif); font-style: italic; font-weight: 500; font-size: 22px; color: var(--gold-dark); }
  .rukcon12-v14 .qa h3 { margin: 0; font-size: 19px; font-weight: 700; letter-spacing: -.01em; transition: color .3s; }
  .rukcon12-v14 .qa summary:hover h3 { color: var(--gold-dark); }
  .rukcon12-v14 .qa .pm { position: relative; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px rgba(20,55,96,.12); transition: background .35s, box-shadow .35s; }
  .rukcon12-v14 .qa .pm::before, .rukcon12-v14 .qa .pm::after { content: ""; position: absolute; width: 14px; height: 2px; border-radius: 2px; background: var(--blue); transition: transform .4s var(--ease); }
  .rukcon12-v14 .qa .pm::after { transform: rotate(90deg); }
  .rukcon12-v14 .qa[open] .pm { background: var(--gold-grad); box-shadow: none; }
  .rukcon12-v14 .qa[open] .pm::after { transform: rotate(0deg); }
  .rukcon12-v14 .qa .ans { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .5s var(--ease); }
  .rukcon12-v14 .qa[open] .ans { grid-template-rows: 1fr; }
  .rukcon12-v14 .qa .ans > div { overflow: hidden; }
  .rukcon12-v14 .qa .ans p { margin: 0; padding: 0 70px 26px 50px; font-size: 16px; line-height: 1.7; color: #3d4c60; }

  /* ============ CLOSING & FOOTER ============ */
  .rukcon12-v14 .ft { color: white; background: radial-gradient(70% 60% at 50% 0%, rgba(223,177,54,.14), transparent 60%), linear-gradient(180deg, var(--blue) 0%, var(--blue-deep) 50%, var(--blue-ink) 100%); }
  /* Floating gold CTA: the seam is ivory on top and navy below, so the card straddles the FAQs and the footer */
  .rukcon12-v14 .ft-seam { position: relative; padding: 0 var(--gutter); background: linear-gradient(180deg, var(--ivory) 0 50%, transparent 50%); }
  .rukcon12-v14 .ft-cta { position: relative; overflow: hidden; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 36px; max-width: 1180px; margin: 0 auto; padding: 44px 50px; border-radius: 30px; background: var(--gold-grad); color: var(--blue-ink); box-shadow: 0 50px 90px -40px rgba(9,27,51,.75), inset 0 1px 0 rgba(255,255,255,.5); transition: transform .6s var(--ease); }
  .rukcon12-v14 .ft-cta:hover { transform: translateY(-6px); }
  .rukcon12-v14 .ft-cta::before { content: "12"; position: absolute; right: 22%; top: 50%; transform: translateY(-50%); font-weight: 900; font-size: 280px; line-height: .8; letter-spacing: -.06em; color: rgba(255,255,255,.18); pointer-events: none; }
  .rukcon12-v14 .ft-cta .cal { position: relative; display: grid; place-items: center; width: 118px; height: 118px; border-radius: 26px; background: var(--blue-ink); color: white; text-align: center; box-shadow: 0 16px 30px -12px rgba(9,27,51,.7); }
  .rukcon12-v14 .ft-cta .cal small { display: block; font-size: 11px; font-weight: 900; letter-spacing: .22em; text-transform: uppercase; color: var(--gold); }
  .rukcon12-v14 .ft-cta .cal small.yr { margin-top: 4px; color: rgba(255,255,255,.6); }
  .rukcon12-v14 .ft-cta .cal b { display: block; margin-top: 4px; font-family: var(--serif); font-size: 40px; font-weight: 600; line-height: 1; font-variant-numeric: lining-nums; }
  .rukcon12-v14 .ft-cta .eyebrow { margin: 0 0 16px; gap: 14px; font-size: 12px; font-weight: 800; letter-spacing: .22em; color: var(--blue-ink); }
  .rukcon12-v14 .ft-cta .eyebrow .rule { width: 36px; height: 2px; }
  .rukcon12-v14 .ft-cta h2 { position: relative; margin: 0; font-weight: 700; font-size: clamp(34px, 3.3vw, 46px); line-height: 1; letter-spacing: -.04em; }
  .rukcon12-v14 .ft-cta h2 span { color: white; font-weight: 800; text-shadow: 0 2px 14px rgba(154,117,20,.5); }
  .rukcon12-v14 .ft-cta .meta { position: relative; margin: 14px 0 0; font-size: 16px; font-weight: 600; color: rgba(9,27,51,.75); }
  .rukcon12-v14 .ft-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 12px; padding: 19px 30px; border-radius: 999px; background: var(--blue-ink); color: white; font-size: 13px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; white-space: nowrap; box-shadow: 0 14px 30px -12px rgba(9,27,51,.7); transition: transform .3s var(--ease); }
  .rukcon12-v14 .ft-btn svg { color: var(--gold); transition: transform .3s var(--ease); }
  .rukcon12-v14 .ft-btn:hover { transform: translateY(-2px); }
  .rukcon12-v14 .ft-btn:hover svg { transform: translateX(4px); }
  .rukcon12-v14 .ft-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 30px; padding: 64px var(--gutter) 34px; color: rgba(255,255,255,.74); font-size: 13px; }
  .rukcon12-v14 .ft-row img { height: 28px; width: auto; }
  .rukcon12-v14 .ft-row nav { display: flex; flex-wrap: wrap; gap: 26px; }
  .rukcon12-v14 .ft-row nav a { font-weight: 700; transition: color .3s; }
  .rukcon12-v14 .ft-row nav a:hover { color: var(--gold); }
  .rukcon12-v14 .ft-legal { width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20px; padding-top: 20px; border-top: 1px solid var(--line); font-size: 12px; color: rgba(255,255,255,.5); }
  .rukcon12-v14 .ft-legal a:hover { color: white; }

  /* ============ Responsive ============ */
  @media (min-width: 861px) and (max-width: 1240px) {
    .rukcon12-v14 .glass, .rukcon12-v14 .glass.scrolled { gap: 12px; padding-left: 20px; }
    .rukcon12-v14 .glass .links a, .rukcon12-v14 .glass.scrolled .links a { padding: 10px 8px; font-size: 10.5px; letter-spacing: .1em; }
    .rukcon12-v14 .glass .links a::after, .rukcon12-v14 .glass.scrolled .links a::after { left: 8px; right: 8px; }
    .rukcon12-v14 .glass .cta-gold { padding: 12px 16px; font-size: 11px; }
    .rukcon12-v14 .glass .cta-more { display: none; }
  }
  /* Mid widths (small laptops, landscape tablets): widen the navy area and push the wall right */
  @media (min-width: 861px) and (max-width: 1240px) {
    .rukcon12-v14 .hero::before { background: linear-gradient(90deg, var(--blue-ink) 0%, var(--blue-ink) 48%, rgba(9,27,51,.85) 57%, rgba(9,27,51,0) 72%); }
    .rukcon12-v14 .wall { left: 52%; width: 80%; }
    .rukcon12-v14 .hero .copy { max-width: calc(var(--gutter) + 500px); padding-left: 48px; }
    .rukcon12-v14 .hero h1 { font-size: clamp(52px, 5.8vw, 70px); }
    .rukcon12-v14 .date-card { right: 32px; bottom: 56px; }
  }
  @media (min-width: 861px) and (max-width: 1240px) { .rukcon12-v14 .xp-plan b { font-size: 26px; } .rukcon12-v14 .xp-pillar h3 { font-size: 24px; } .rukcon12-v14 .xp-grid { grid-template-rows: 230px 340px auto; } }
  @media (min-width: 861px) and (max-width: 1240px) { .rukcon12-v14 .pg-body h3 { font-size: 22px; } .rukcon12-v14 .pg-stub strong { font-size: 54px; } }
  @media (min-width: 861px) and (max-width: 1240px) { .rukcon12-v14 .ft-cta { gap: 26px; padding: 36px 34px; } .rukcon12-v14 .ft-cta .cal { width: 96px; height: 96px; } .rukcon12-v14 .ft-cta .cal b { font-size: 32px; } }
  @media (max-width: 860px) {
    .rukcon12-v14 .glass, .rukcon12-v14 .glass.scrolled { width: calc(100% - 24px); top: 12px; height: 62px; padding: 0 8px 0 18px; gap: 10px; border-radius: 999px; }
    .rukcon12-v14 .glass .logo img, .rukcon12-v14 .glass.scrolled .logo img { height: 22px; }
    .rukcon12-v14 .glass .links, .rukcon12-v14 .glass > .cta-gold { display: none; }
    .rukcon12-v14 .m-ticket { display: inline-grid; place-items: center; margin-left: auto; width: 44px; height: 44px; border-radius: 50%; background: var(--gold-grad); color: var(--blue-ink); }
    .rukcon12-v14 .menu-toggle { display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; color: var(--blue); background: rgba(20,55,96,.07); }
    /* Hero: photos sit clean at the top, copy on solid navy below */
    .rukcon12-v14 .hero { display: block; height: auto; min-height: 0; max-height: none; }
    .rukcon12-v14 .hero::before { display: none; }
    .rukcon12-v14 .wall-wrap { position: relative; height: 380px; overflow: hidden; perspective-origin: 50% 40%; mask-image: linear-gradient(180deg, black 80%, transparent); -webkit-mask-image: linear-gradient(180deg, black 80%, transparent); }
    .rukcon12-v14 .wall { left: -75%; top: -95%; width: 260%; height: 300%; gap: 10px; --g: 10px; transform: rotateX(16deg) rotateZ(-14deg); animation: none; }
    .rukcon12-v14 .track figure { padding: 5px 5px 18px; }
    .rukcon12-v14 .track figcaption { font-size: 11px; bottom: 3px; left: 6px; }
    .rukcon12-v14 .hero .copy { max-width: none; margin-top: 4px; padding: 0 22px 90px; }
    .rukcon12-v14 .hero .eyebrow { margin-bottom: 16px; font-size: 9.5px; letter-spacing: .1em; gap: 8px; white-space: nowrap; }
    .rukcon12-v14 .hero .eyebrow .chip { padding: 6px 10px; }
    .rukcon12-v14 .date-card { right: auto; left: 22px; bottom: auto; top: 268px; gap: 14px; padding: 12px 20px 12px 14px; }
    .rukcon12-v14 .date-card .ic { width: 40px; height: 40px; }
    .rukcon12-v14 .date-card b { font-size: 23px; }
    .rukcon12-v14 .hero h1 { font-size: clamp(42px, 13.4vw, 54px); margin-bottom: 18px; }
    .rukcon12-v14 .hero .lede { font-size: 16px; margin-bottom: 24px; }
    .rukcon12-v14 .cta-row { display: grid; gap: 12px; }
    .rukcon12-v14 .hero .cta-gold { padding: 19px 24px; }
    .rukcon12-v14 .xp { padding: 72px 18px 72px; }
    .rukcon12-v14 .xp-grid { grid-template-columns: 1fr 1fr; grid-template-rows: none; gap: 10px; }
    .rukcon12-v14 .xp-head, .rukcon12-v14 .xp-lede, .rukcon12-v14 .xp-plan, .rukcon12-v14 .xp-stat { grid-column: span 2; }
    .rukcon12-v14 .xp-head { padding: 26px 22px; }
    .rukcon12-v14 .xp-head .eyebrow { font-size: 10px; letter-spacing: .14em; gap: 10px; }
    .rukcon12-v14 .xp-head .eyebrow .rule { width: 22px; }
    .rukcon12-v14 .xp-head h2 { font-size: 32px; }
    .rukcon12-v14 .xp-lede { padding: 22px; }
    .rukcon12-v14 .xp-lede p { font-size: 15px; }
    .rukcon12-v14 .xp-pillar { height: 250px; }
    .rukcon12-v14 .xp-pillar h3 { font-size: 22px; }
    .rukcon12-v14 .xp-pillar p { font-size: 13px; }
    .rukcon12-v14 .xp-plan { flex-direction: column; align-items: flex-start; gap: 10px; padding: 24px 22px; }
    .rukcon12-v14 .xp-plan b { font-size: 26px; }
    .rukcon12-v14 .xp-stat { padding: 20px 22px; }
    .rukcon12-v14 .xp-stat strong { font-size: 56px; }
    .rukcon12-v14 .pg { padding: 72px 18px 80px; }
    .rukcon12-v14 .pg-serve { flex-wrap: wrap; padding: 20px; }
    .rukcon12-v14 .pg-serve .tag { margin-left: 80px; flex: 0 1 auto; max-width: calc(100% - 80px); white-space: normal; }
    .rukcon12-v14 .pg-head { grid-template-columns: 1fr; gap: 18px; margin-bottom: 32px; }
    .rukcon12-v14 .pg-head .eyebrow { font-size: 10px; letter-spacing: .14em; gap: 10px; }
    .rukcon12-v14 .pg-head .eyebrow .rule { width: 22px; }
    .rukcon12-v14 .pg-head h2 { font-size: 40px; }
    .rukcon12-v14 .pg-head p { font-size: 15px; }
    .rukcon12-v14 .pg-tickets { grid-template-columns: 1fr; gap: 18px; }
    .rukcon12-v14 .pg-tk { --cut: 94px; }
    .rukcon12-v14 .pg-stub strong { font-size: 52px; }
    .rukcon12-v14 .tx { padding: 72px 18px 80px; }
    .rukcon12-v14 .tx-grid { grid-template-columns: 1fr; gap: 18px; }
    .rukcon12-v14 .tx-passes { grid-template-columns: 1fr; gap: 64px; }
    .rukcon12-v14 .tx-ticket .tx-pass-wrap { margin-bottom: 30px; }
    .rukcon12-v14 .tx-ticket-body .cta-gold { width: 100%; }
    .rukcon12-v14 .tx-pass .tx-price { flex-wrap: wrap; row-gap: 4px; }
    .rukcon12-v14 .tx-pass .tx-price span { flex-basis: 100%; }
    .rukcon12-v14 .tx-pass .when { white-space: nowrap; }
    .rukcon12-v14 .tx-pass-wrap { order: -1; }
    .rukcon12-v14 .tx-strap { height: 80px; }
    .rukcon12-v14 .tx-pass { width: 290px; height: 450px; }
    .rukcon12-v14 .tx-pass h3 { font-size: 32px; }
    .rukcon12-v14 .tx-pass .photo { height: 110px; }
    .rukcon12-v14 .tx-price b { font-size: 48px; }
    .rukcon12-v14 .tx .eyebrow { font-size: 10px; letter-spacing: .14em; gap: 10px; }
    .rukcon12-v14 .tx .eyebrow .rule { width: 22px; }
    .rukcon12-v14 .tx h2 { font-size: 38px; }
    .rukcon12-v14 .tx-sum { font-size: 16px; }
    .rukcon12-v14 .tx-incl li { font-size: 14.5px; }
    .rukcon12-v14 .tx .cta-gold { width: 100%; }
    .rukcon12-v14 .st { height: auto; display: grid; }
    .rukcon12-v14 .st::before, .rukcon12-v14 .st::after { display: none; }
    .rukcon12-v14 .st-map { position: relative; inset: auto; width: 100%; height: 380px; order: -1; }
    .rukcon12-v14 .st-pin { left: 50%; top: 190px; }
    .rukcon12-v14 .st-pin .name { top: auto; bottom: calc(100% + 10px); left: 50%; transform: translateX(-50%); }
    .rukcon12-v14 .st-card { position: relative; left: auto; top: auto; width: auto; transform: none; margin: -40px 14px 64px; padding: 28px 22px; background: rgba(9,27,51,.96); }
    .rukcon12-v14 .st-card .eyebrow { font-size: 10px; letter-spacing: .14em; gap: 10px; }
    .rukcon12-v14 .st-card .eyebrow .rule { width: 22px; }
    .rukcon12-v14 .st-card h2 { font-size: 40px; }
    .rukcon12-v14 .st-card .venue { font-size: 16px; }
    .rukcon12-v14 .st-card .intro { font-size: 15px; }
    .rukcon12-v14 .st-row b { font-size: 23px; }
    .rukcon12-v14 .fq { padding: 72px 18px 80px; }
    .rukcon12-v14 .fq-head { margin-bottom: 30px; }
    .rukcon12-v14 .fq-head .eyebrow { font-size: 10px; letter-spacing: .14em; gap: 10px; }
    .rukcon12-v14 .fq-head .eyebrow .rule { width: 22px; }
    .rukcon12-v14 .fq-head h2 { font-size: 38px; }
    .rukcon12-v14 .qa summary { gap: 12px; padding: 18px 0; }
    .rukcon12-v14 .qa h3 { font-size: 16px; }
    .rukcon12-v14 .qa .n { min-width: 22px; font-size: 18px; }
    .rukcon12-v14 .qa .pm { width: 34px; height: 34px; }
    .rukcon12-v14 .qa .ans p { padding: 0 0 20px 34px; font-size: 14.5px; }
    .rukcon12-v14 .fq { padding-bottom: 40px; }
    .rukcon12-v14 .ft-seam { padding: 0 14px; }
    .rukcon12-v14 .ft-cta { grid-template-columns: 1fr; gap: 20px; padding: 30px 24px; }
    .rukcon12-v14 .ft-cta::before { font-size: 180px; right: -10px; }
    .rukcon12-v14 .ft-cta .cal { width: 88px; height: 88px; border-radius: 20px; }
    .rukcon12-v14 .ft-cta .cal b { font-size: 30px; }
    .rukcon12-v14 .ft-cta .eyebrow { font-size: 10px; letter-spacing: .14em; gap: 10px; }
    .rukcon12-v14 .ft-cta .eyebrow .rule { width: 20px; }
    .rukcon12-v14 .ft-cta h2 { font-size: 32px; }
    .rukcon12-v14 .ft-cta .meta { font-size: 14px; }
    .rukcon12-v14 .ft-btn { width: 100%; }
    .rukcon12-v14 .ft-cta:hover { transform: none; }
    .rukcon12-v14 .ft-row { flex-direction: column; align-items: flex-start; gap: 20px; padding: 30px 20px; }
    .rukcon12-v14 .ft-row nav { gap: 14px 20px; }
    .rukcon12-v14 .ft-legal { flex-direction: column; gap: 6px; }
  }
  @media (prefers-reduced-motion: reduce) { .rukcon12-v14 *, .rukcon12-v14 *::before, .rukcon12-v14 *::after { animation: none !important; transition-duration: .01s !important; } }

  /* ============ Additions for the live site (not in the mockup) ============ */
  /* Real ticket/date status, as the 10/13 content review asks. */
  .rukcon12-v14 .tx-policy { margin: 18px 0 0; max-width: 460px; font-size: 13px; font-weight: 500; line-height: 1.55; color: #3d4c60; white-space: pre-line; }
  .rukcon12-v14 .tx-policy p { margin: 0 0 6px; }
  .rukcon12-v14 .tx-policy a { text-decoration: underline; text-underline-offset: 3px; }
  .rukcon12-v14 .tx .cta-gold[aria-disabled="true"] { background: #d9d4c7; color: #3d4c60; box-shadow: none; }
  .rukcon12-v14 .tx .cta-gold[aria-disabled="true"]::after { display: none; }
  .rukcon12-v14 .tx-note { margin: 14px 0 0; max-width: 440px; font-size: 13px; font-weight: 500; line-height: 1.55; color: #5b6878; }
  .rukcon12-v14 .qa .ans a { text-decoration: underline; text-underline-offset: 3px; color: var(--blue); }
  .rukcon12-v14 .review { position: fixed; z-index: 150; right: 16px; bottom: 16px; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; max-width: calc(100% - 32px); padding: 10px 16px; border-radius: 16px; background: rgba(9,27,51,.94); box-shadow: inset 0 0 0 1px var(--gold-line), 0 18px 40px -16px rgba(0,0,0,.7); color: rgba(255,255,255,.88); font-size: 12px; font-weight: 600; }
  .rukcon12-v14 .review strong { color: var(--gold); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; font-size: 10.5px; }
  .rukcon12-v14 .review a { text-decoration: underline; text-underline-offset: 3px; color: white; }
  @media (max-width: 860px) { .rukcon12-v14 .review { left: 8px; right: 8px; bottom: 8px; max-width: none; font-size: 11px; } }
  /* Saved agenda sessions on a program stub (private preview and published site). */
  .rukcon12-v14 .pg-sessions { display: grid; margin: 16px 0 0; padding: 0; list-style: none; }
  .rukcon12-v14 .pg-session { display: grid; gap: 2px; padding: 12px 0; border-top: 1px solid rgba(20,55,96,.12); }
  .rukcon12-v14 .pg-session b { font-size: 15px; font-weight: 800; line-height: 1.3; color: var(--blue); overflow-wrap: anywhere; }
  .rukcon12-v14 .pg-time { font-size: 10.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-dark); }
  .rukcon12-v14 .pg-room, .rukcon12-v14 .pg-speakers { font-size: 13px; font-weight: 500; line-height: 1.45; color: #3d4c60; overflow-wrap: anywhere; }
  .rukcon12-v14 .pg-session details summary { display: inline-flex; align-items: center; min-height: 44px; cursor: pointer; font-size: 13px; font-weight: 700; color: var(--gold-dark); }
  .rukcon12-v14 .pg-session details p { margin: 0 0 4px; font-size: 13.5px; white-space: pre-line; }

  /* ============ Version 5 additions (Will Stratman's walkthrough) ============ */
  /* Hero: room for the countdown above the headline; "count." in plain gold text (no highlight box). */
  .rukcon12-v14 .hero { height: 860px; }
  .rukcon12-v14 .hero .copy { padding-top: 104px; }
  .rukcon12-v14 .hero .eyebrow { margin-bottom: 20px; }
  .rukcon12-v14 .hero h1 .gold { color: var(--gold); font-weight: 900; letter-spacing: -.05em; }
  /* The verse reads on the navy hero (Version 4 prints it in the ivory sections' grey). */
  .rukcon12-v14 .hero .verse { color: rgba(255,255,255,.72); }
  .rukcon12-v14 .countdown { display: grid; grid-template-columns: repeat(4, minmax(0, 88px)); gap: 10px; margin: 0 0 26px; }
  .rukcon12-v14 .cd-cell { display: grid; justify-items: center; gap: 4px; padding: 12px 6px 10px; border-radius: 14px; background: rgba(255,255,255,.06); box-shadow: inset 0 0 0 1px var(--gold-line); }
  .rukcon12-v14 .cd-cell strong { font-family: var(--serif); font-size: 38px; font-weight: 600; line-height: .9; font-variant-numeric: tabular-nums lining-nums; color: white; }
  .rukcon12-v14 .cd-cell small { font-size: 9.5px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: var(--gold); }

  /* The four pillars: the RUKCON 11 statement across the top, then the four pillar cards. */
  .rukcon12-v14 .xp-grid { grid-template-rows: auto 380px; }
  .rukcon12-v14 .xp-head { grid-column: 1 / -1; align-items: center; justify-content: center; padding: 56px 38px 52px; text-align: center; background: radial-gradient(70% 120% at 50% 0%, #1a4473 0%, var(--blue) 45%, var(--blue-ink) 100%); }
  .rukcon12-v14 .xp-head .eyebrow { justify-content: center; margin-bottom: 22px; }
  .rukcon12-v14 .xp-head h2 { font-weight: 900; font-size: clamp(36px, 5vw, 64px); line-height: 1; letter-spacing: -.03em; color: #f5f4f0; }
  .rukcon12-v14 .xp-head h2 .g { color: var(--gold); background: none; -webkit-background-clip: border-box; background-clip: border-box; font-weight: 900; }
  .rukcon12-v14 .xp-statement { position: relative; max-width: 560px; margin: 28px auto 0; padding-top: 28px; font-size: 17px; font-weight: 500; line-height: 1.7; color: rgba(255,255,255,.88); }
  .rukcon12-v14 .xp-statement::before { content: ""; position: absolute; top: 0; left: 50%; width: 64px; height: 2px; transform: translateX(-50%); background: var(--gold-line); }

  /* The agenda: the RUKCON 11 vertical day list, a gold date tab beside each day's sessions. */
  .rukcon12-v14 .ag-days { display: grid; gap: 22px; }
  .rukcon12-v14 .ag-day { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 0; overflow: hidden; border-radius: 22px; background: var(--ivory); color: var(--blue); box-shadow: 0 26px 44px -26px rgba(0,0,0,.6); }
  .rukcon12-v14 .ag-tab { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 2px; padding: 26px 8px; background: var(--gold-grad); color: var(--blue-ink); }
  .rukcon12-v14 .ag-month { font-size: 12px; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; }
  .rukcon12-v14 .ag-num { font-family: var(--serif); font-size: 58px; font-weight: 600; line-height: .9; font-variant-numeric: lining-nums; }
  .rukcon12-v14 .ag-body { min-width: 0; padding: 26px 30px 24px; }
  .rukcon12-v14 .ag-weekday { margin: 0 0 4px; font-size: 10.5px; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; color: var(--gold-dark); }
  .rukcon12-v14 .ag-title { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0; font-weight: 900; font-size: 26px; line-height: 1.1; letter-spacing: -.02em; text-transform: uppercase; overflow-wrap: anywhere; }
  .rukcon12-v14 .ag-tag { display: inline-flex; align-items: center; padding: 3px 10px; border-radius: 999px; background: var(--blue); color: var(--gold); font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
  .rukcon12-v14 .ag-desc { margin: 8px 0 0; font-size: 15px; font-weight: 500; line-height: 1.55; color: #3d4c60; }
  .rukcon12-v14 .ag-events { display: grid; margin: 18px 0 0; padding: 0; list-style: none; }
  .rukcon12-v14 .ag-ev { display: grid; grid-template-columns: 168px minmax(0, 1fr); gap: 4px 18px; padding: 14px 0; border-top: 1px solid rgba(20,55,96,.12); }
  .rukcon12-v14 .ag-time { padding-top: 2px; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--gold-dark); }
  .rukcon12-v14 .ag-main { display: grid; gap: 3px; min-width: 0; }
  .rukcon12-v14 .ag-name { font-size: 16px; font-weight: 800; line-height: 1.3; color: var(--blue); overflow-wrap: anywhere; }
  .rukcon12-v14 .ag-place { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; font-weight: 700; color: #3d4c60; }
  .rukcon12-v14 .ag-place svg { color: var(--gold-dark); }
  .rukcon12-v14 .ag-speakers, .rukcon12-v14 .ag-detail { font-size: 13.5px; font-weight: 500; line-height: 1.5; color: #3d4c60; overflow-wrap: anywhere; white-space: pre-line; }
  .rukcon12-v14 .ag-ev.is-gala { margin-top: 6px; padding: 14px 16px; border-top: 0; border-radius: 14px; background: var(--blue); }
  .rukcon12-v14 .ag-ev.is-gala .ag-time { color: var(--gold); }
  .rukcon12-v14 .ag-ev.is-gala .ag-name { color: white; }
  .rukcon12-v14 .ag-ev.is-gala .ag-detail, .rukcon12-v14 .ag-ev.is-gala .ag-place, .rukcon12-v14 .ag-ev.is-gala .ag-speakers { color: rgba(255,255,255,.82); }

  /* Past speakers: the four RUKCON 11 featured speakers, then eight past speakers. */
  .rukcon12-v14 .sp { position: relative; padding: 110px var(--gutter) 120px; border-top: 1px solid var(--gold-line); background: radial-gradient(60% 50% at 15% 0%, rgba(223,177,54,.1), transparent 60%), var(--blue-ink); color: white; }
  .rukcon12-v14 .sp-head { max-width: 640px; margin: 0 auto 48px; text-align: center; }
  .rukcon12-v14 .sp-head .eyebrow { justify-content: center; margin: 0 0 18px; font-size: 12px; font-weight: 800; letter-spacing: .22em; }
  .rukcon12-v14 .sp-head .eyebrow .rule { width: 40px; height: 2px; }
  .rukcon12-v14 .sp-head h2 { margin: 0; font-weight: 700; font-size: clamp(44px, 4.4vw, 64px); line-height: 1; letter-spacing: -.04em; }
  .rukcon12-v14 .sp-head h2 .g { color: transparent; background: var(--gold-text); -webkit-background-clip: text; background-clip: text; font-weight: 800; }
  .rukcon12-v14 .sp-head p { margin: 16px 0 0; font-size: 17px; font-weight: 500; line-height: 1.6; color: rgba(255,255,255,.82); }
  .rukcon12-v14 .sp-featured, .rukcon12-v14 .sp-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; margin: 0; padding: 0; list-style: none; }
  .rukcon12-v14 .sp-featured { margin-bottom: 18px; }
  .rukcon12-v14 .sp-card { position: relative; overflow: hidden; border-radius: 20px; background: #141414; box-shadow: inset 0 0 0 1px rgba(255,255,255,.08); }
  .rukcon12-v14 .sp-card.is-featured { box-shadow: inset 0 0 0 1px var(--gold-line); }
  .rukcon12-v14 .sp-photo { aspect-ratio: 4 / 5; overflow: hidden; }
  .rukcon12-v14 .sp-card.is-featured .sp-photo { aspect-ratio: 1 / 1; }
  .rukcon12-v14 .sp-photo img { width: 100%; height: 100%; object-fit: cover; object-position: top center; transition: transform 1s var(--ease); }
  .rukcon12-v14 .sp-card:hover .sp-photo img { transform: scale(1.04); }
  .rukcon12-v14 .sp-info { position: absolute; left: 0; right: 0; bottom: 0; padding: 48px 18px 18px; background: linear-gradient(180deg, transparent 0%, rgba(9,27,51,.88) 45%, rgba(9,27,51,.96) 100%); }
  .rukcon12-v14 .sp-tag { display: inline-block; margin-bottom: 8px; padding: 3px 10px; border-radius: 999px; background: var(--gold-grad); color: var(--blue-ink); font-size: 9.5px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
  .rukcon12-v14 .sp-info h3 { margin: 0; font-weight: 900; font-size: 20px; line-height: 1.15; letter-spacing: -.01em; text-transform: uppercase; overflow-wrap: anywhere; }
  .rukcon12-v14 .sp-info p { margin: 4px 0 0; font-size: 13px; font-weight: 600; line-height: 1.4; color: rgba(255,255,255,.78); }

  /* Rise Up Queens: the headline sits first, and with no divider the section keeps its own bottom space. */
  .rukcon12-v14 .rq-paper.is-headline-first > h2:first-child { margin: 0 0 22px; font-size: 34px; }
  .rukcon12-v14 .rq-section.is-plain { padding-bottom: 110px; }

  @media (min-width: 861px) and (max-width: 1240px) {
    .rukcon12-v14 .hero { height: 820px; }
    .rukcon12-v14 .sp-featured, .rukcon12-v14 .sp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }
  @media (max-width: 860px) {
    .rukcon12-v14 .hero { height: auto; }
    .rukcon12-v14 .hero .copy { padding-top: 0; }
    /* Long venue names wrap inside the date card instead of running off the phone screen. */
    .rukcon12-v14 .date-card { right: 22px; }
    .rukcon12-v14 .date-card b { white-space: normal; font-size: 20px; line-height: 1.1; }
    .rukcon12-v14 .countdown { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-bottom: 20px; }
    .rukcon12-v14 .cd-cell { padding: 10px 4px 8px; border-radius: 12px; }
    .rukcon12-v14 .cd-cell strong { font-size: 30px; }
    .rukcon12-v14 .cd-cell small { font-size: 8.5px; letter-spacing: .12em; }
    .rukcon12-v14 .xp-grid { grid-template-rows: none; }
    .rukcon12-v14 .xp-head { padding: 36px 22px 32px; }
    .rukcon12-v14 .xp-head h2 { font-size: 34px; }
    .rukcon12-v14 .xp-statement { margin-top: 22px; padding-top: 22px; font-size: 15px; }
    .rukcon12-v14 .ag-days { gap: 16px; }
    .rukcon12-v14 .ag-day { grid-template-columns: 1fr; }
    .rukcon12-v14 .ag-tab { flex-direction: row; justify-content: flex-start; align-items: baseline; gap: 10px; padding: 14px 20px; }
    .rukcon12-v14 .ag-num { font-size: 40px; }
    .rukcon12-v14 .ag-body { padding: 20px 20px 18px; }
    .rukcon12-v14 .ag-title { font-size: 22px; }
    .rukcon12-v14 .ag-ev { grid-template-columns: 1fr; gap: 4px; }
    .rukcon12-v14 .ag-ev.is-gala { padding: 14px; }
    .rukcon12-v14 .sp { padding: 72px 18px 80px; }
    .rukcon12-v14 .sp-head { margin-bottom: 30px; }
    .rukcon12-v14 .sp-head .eyebrow { gap: 10px; font-size: 10px; letter-spacing: .14em; }
    .rukcon12-v14 .sp-head .eyebrow .rule { width: 22px; }
    .rukcon12-v14 .sp-head h2 { font-size: 40px; }
    .rukcon12-v14 .sp-head p { font-size: 15px; }
    .rukcon12-v14 .sp-featured, .rukcon12-v14 .sp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .rukcon12-v14 .sp-featured { margin-bottom: 10px; }
    .rukcon12-v14 .sp-info { padding: 36px 12px 12px; }
    .rukcon12-v14 .sp-info h3 { font-size: 15px; }
    .rukcon12-v14 .sp-info p { font-size: 11.5px; }
    .rukcon12-v14 .sp-tag { margin-bottom: 6px; padding: 2px 8px; font-size: 8.5px; }
    .rukcon12-v14 .rq-paper.is-headline-first > h2:first-child { font-size: 28px; }
    .rukcon12-v14 .rq-section.is-plain { padding-bottom: 72px; }
  }

  /* ============ Version 7 additions (Will Stratman's review comments on Version 6) ============ */
  /* #17: no captions under the wall photos, so each print has an even mat. */
  .rukcon12-v14 .track figure { padding: 9px; }
  /* Four longer columns of five different photos: each column's loop is taller than the column, so no photo shows twice at once. */
  .rukcon12-v14 .wall { grid-template-columns: repeat(4, 1fr); }

  /* #3: the RUKCON 12 logo, large, above the headline (where Version 6 had the countdown). */
  .rukcon12-v14 .hero-logo { display: block; width: min(440px, 100%); height: auto; margin: 0 0 28px; filter: drop-shadow(0 4px 18px rgba(0,0,0,.45)); }
  /* #7: RUKCON 11's line under the hero button. */
  .rukcon12-v14 .bring { display: flex; flex-wrap: wrap; margin: 20px 0 0; font-size: 11px; font-weight: 800; line-height: 1.6; letter-spacing: .22em; text-transform: uppercase; color: white; }
  /* #2: the countdown sits in the right-hand area, on top of the date and venue card, at the same width. */
  .rukcon12-v14 .hero-side { position: absolute; z-index: 4; right: var(--gutter); bottom: 72px; display: grid; gap: 14px; }
  .rukcon12-v14 .hero-side .date-card { position: static; }
  .rukcon12-v14 .hero-side .countdown { grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; padding: 12px; border-radius: 18px; background: rgba(9,27,51,.86); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); box-shadow: inset 0 0 0 1px var(--gold), 0 30px 60px -20px rgba(0,0,0,.8); }

  /* #8: RUKCON 11's pillar cards: the photo on top with a gold edge, then the pillar and its words. */
  .rukcon12-v14 .xp-grid { grid-template-rows: auto auto; }
  .rukcon12-v14 .xp-pillar { display: flex; flex-direction: column; background: var(--blue-ink); color: white; }
  .rukcon12-v14 .xp-pillar::before { display: none; }
  .rukcon12-v14 .xp-photo { position: relative; flex: none; height: 200px; overflow: hidden; }
  .rukcon12-v14 .xp-photo::after { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(to right, var(--gold), transparent); }
  .rukcon12-v14 .xp-pillar .xp-photo img { position: static; z-index: auto; width: 100%; height: 100%; object-fit: cover; }
  .rukcon12-v14 .xp-pillar .tb { position: static; flex: 1; padding: 26px 24px 28px; }
  .rukcon12-v14 .xp-pillar h3 { margin: 0 0 12px; font-size: 13px; font-weight: 900; letter-spacing: .22em; color: var(--gold); }
  .rukcon12-v14 .xp-pillar p { font-size: 14.5px; line-height: 1.75; color: white; }

  /* #9: the agenda heading stands alone (no intro line beside it). */
  .rukcon12-v14 .pg-head { grid-template-columns: 1fr; }

  /* #10: RUKCON 11's scrolling speaker strip, paused on hover, with no topic pills. */
  .rukcon12-v14 .sp-strip { position: relative; overflow: hidden; margin: 0 calc(-1 * var(--gutter)); padding: 8px 0 16px; }
  .rukcon12-v14 .sp-strip::before, .rukcon12-v14 .sp-strip::after { content: ""; position: absolute; z-index: 2; top: 0; bottom: 0; width: 140px; pointer-events: none; }
  .rukcon12-v14 .sp-strip::before { left: 0; background: linear-gradient(to right, var(--blue-ink), transparent); }
  .rukcon12-v14 .sp-strip::after { right: 0; background: linear-gradient(to left, var(--blue-ink), transparent); }
  /* Each card carries its own right margin, so half the track is exactly one set and the loop has no jump. */
  .rukcon12-v14 .sp-track { display: flex; width: max-content; margin: 0; padding: 0; list-style: none; animation: r12v14-speakers 52s linear infinite; }
  .rukcon12-v14 .sp-strip:hover .sp-track { animation-play-state: paused; }
  @keyframes r12v14-speakers { from { transform: translateX(0); } to { transform: translateX(-50%); } }
  .rukcon12-v14 .sp-track .sp-card { flex: none; width: 220px; margin-right: 20px; border-radius: 16px; transition: transform .25s, box-shadow .25s; }
  .rukcon12-v14 .sp-track .sp-card:hover { transform: translateY(-6px); box-shadow: 0 20px 60px rgba(0,0,0,.5), 0 0 0 1px rgba(223,177,54,.3); }
  .rukcon12-v14 .sp-track .sp-card.is-featured .sp-photo { aspect-ratio: 4 / 5; }

  /* #11-#12: the Rise Up Queens headline in the "her own seat" type, then the bigger logo in the paper. */
  .rukcon12-v14 .rq-section { --rq-grad: linear-gradient(100deg, #e8208f 0%, #c43fae 45%, #00b9c6 100%); }
  .rukcon12-v14 .rq-head { position: relative; z-index: 2; max-width: 780px; margin: 0 auto 56px; text-align: center; }
  .rukcon12-v14 .rq-head h2 { margin: 0; font-weight: 700; font-size: clamp(38px, 4vw, 56px); line-height: 1.05; letter-spacing: -.04em; color: var(--blue); }
  .rukcon12-v14 .rq-sub { margin: 18px auto 0; max-width: 620px; font-size: 18px; font-weight: 500; line-height: 1.6; color: #3d4c60; }
  .rukcon12-v14 .rq-ruq-logo { display: block; width: 300px; max-width: 100%; height: auto; margin: 4px auto 8px; }
  .rukcon12-v14 .rq-paper.is-logo-first .rq-presents { margin-top: 0; }

  /* Slack ask: the lanyard passes swing and tilt toward the cursor on hover (Rukcon12V2Pass). The swing never pushes the page sideways, and touch screens get the swing but no tilt. */
  .rukcon12-v14 .tx { overflow-x: clip; }
  @media (hover: none) { .rukcon12-v14 .tx-pass { transform: none !important; } }

  /* Extra fix: "starts with intention." was white on gold (under 2:1). Navy serif italic on the gold card is at least 5.5:1, on its darkest gold (#b88a1d). */
  .rukcon12-v14 .ft-cta h2 span { font-family: var(--serif); font-style: italic; font-weight: 700; color: var(--blue-ink); text-shadow: none; }

  @media (min-width: 861px) and (max-width: 1240px) {
    .rukcon12-v14 .hero-logo { width: min(360px, 100%); }
    /* Wider columns at mid widths keep each column loop taller than the column (#17). */
    .rukcon12-v14 .wall { left: 50%; width: 112%; }
    .rukcon12-v14 .hero-side { right: 32px; bottom: 56px; }
    .rukcon12-v14 .hero-side .date-card b { font-size: 24px; }
    .rukcon12-v14 .hero-side .cd-cell strong { font-size: 30px; }
    .rukcon12-v14 .xp-photo { height: 160px; }
  }
  @media (max-width: 860px) {
    .rukcon12-v14 .track figure { padding: 5px; }
    .rukcon12-v14 .hero .copy { padding-bottom: 28px; }
    .rukcon12-v14 .hero-logo { width: min(280px, 100%); margin-bottom: 20px; }
    .rukcon12-v14 .bring { margin-top: 16px; font-size: 10px; letter-spacing: .16em; }
    .rukcon12-v14 .hero-side { position: static; margin: 0 22px; padding-bottom: 90px; }
    .rukcon12-v14 .xp-pillar { height: auto; }
    .rukcon12-v14 .xp-photo { height: 150px; }
    .rukcon12-v14 .xp-pillar .tb { padding: 20px 18px 22px; }
    .rukcon12-v14 .xp-pillar h3 { font-size: 12px; }
    .rukcon12-v14 .xp-pillar p { font-size: 13.5px; line-height: 1.65; }
    .rukcon12-v14 .sp-strip { margin: 0 -18px; }
    .rukcon12-v14 .sp-strip::before, .rukcon12-v14 .sp-strip::after { width: 48px; }
    .rukcon12-v14 .sp-track .sp-card { width: 160px; margin-right: 12px; }
    .rukcon12-v14 .rq-head { margin-bottom: 36px; }
    .rukcon12-v14 .rq-head h2 { font-size: 32px; }
    .rukcon12-v14 .rq-sub { font-size: 16px; }
    .rukcon12-v14 .rq-ruq-logo { width: 240px; }
  }
  @media (max-width: 560px) { .rukcon12-v14 .xp-grid { grid-template-columns: 1fr; } }
  /* Reduced motion: the speaker strip stops and scrolls by hand instead (one set), and the ticket passes neither swing nor tilt. */
  @media (prefers-reduced-motion: reduce) {
    .rukcon12-v14 .sp-strip { overflow-x: auto; }
    .rukcon12-v14 .sp-track .sp-card.is-loop { display: none; }
    .rukcon12-v14 .tx-rig { animation: none !important; transform: none !important; }
    .rukcon12-v14 .tx-pass { transform: none !important; }
  }

/* ============ Version 8 additions ============ */
/* Freedom's dates, from the site model (the agenda's event details), under the subheadline. */
.rukcon12-v14 .rq-dates { margin: 10px auto 0; font-family: var(--sans); font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #b4236e; }

/* ============ Version 9 additions (Will Stratman, Slack, 2026-10-22) ============ */
/* Bigger RUKCON12 logo in the hero: 640px on desktop (was 440px), 480px at mid widths, the full column on phones. */
.rukcon12-v14 .hero { height: auto; min-height: 960px; }
.rukcon12-v14 .hero .copy { padding-top: 112px; padding-bottom: 150px; max-width: calc(var(--gutter) + 700px); }
.rukcon12-v14 .hero-logo { width: min(640px, 100%); margin-bottom: 30px; }
/* The RUK + RUQ logos at the top of the hero, under the menu. */
.rukcon12-v14 .rukruq { display: block; height: auto; }
.rukcon12-v14 .hero-rukruq { width: min(300px, 100%); margin: 0 0 22px; filter: drop-shadow(0 3px 12px rgba(0,0,0,.45)); }

/* The story under the hero (Will Stratman's mock): ivory page, navy headline, the verse in a navy quote card, a teal callout. */
.rukcon12-v14 .story { position: relative; padding: 96px var(--gutter) 40px; background: var(--ivory); color: var(--blue-ink); scroll-margin-top: 90px; }
.rukcon12-v14 .story-inner { max-width: 860px; margin: 0 auto; }
.rukcon12-v14 .story-head { margin: 0 0 40px; font-weight: 900; font-size: clamp(48px, 6vw, 84px); line-height: .95; letter-spacing: -.045em; color: var(--blue-ink); }
.rukcon12-v14 .story-verse { position: relative; margin: 0 0 48px; padding: 40px 44px 34px; border-radius: 26px; background: var(--blue-ink); color: white; box-shadow: 0 30px 60px -30px rgba(9,27,51,.6); }
.rukcon12-v14 .story-quote { display: block; height: 58px; font-family: Georgia, serif; font-size: 120px; font-weight: 700; line-height: .9; color: var(--gold); }
.rukcon12-v14 .story-verse blockquote { margin: 0; }
.rukcon12-v14 .story-verse blockquote p { margin: 0; font-size: clamp(20px, 2.1vw, 28px); font-weight: 500; line-height: 1.5; white-space: pre-line; }
.rukcon12-v14 .story-verse figcaption { margin-top: 22px; font-size: 12px; font-weight: 800; letter-spacing: .24em; text-transform: uppercase; color: var(--gold); }
.rukcon12-v14 .story-body p { margin: 0 0 26px; font-size: 19px; font-weight: 400; line-height: 1.75; color: #3a4556; white-space: pre-line; }
.rukcon12-v14 .story-body .story-callout { margin: 34px 0; padding: 4px 0 4px 26px; border-left: 4px solid #1fa0a8; font-size: 21px; font-weight: 800; line-height: 1.55; color: var(--blue-ink); }
.rukcon12-v14 .story-for { margin: 8px 0 30px; padding: 28px 28px 22px; border-left: 4px solid var(--gold); border-radius: 0 16px 16px 0; background: white; }
.rukcon12-v14 .story-for-title { margin: 0 0 14px; font-size: 12px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-dark); }
.rukcon12-v14 .story-for ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 12px; }
.rukcon12-v14 .story-for li { display: flex; gap: 12px; font-size: 16px; line-height: 1.6; color: #3a4556; }
.rukcon12-v14 .story-for li i { flex: none; display: grid; place-items: center; width: 22px; height: 22px; margin-top: 2px; border-radius: 50%; background: var(--gold-grad); color: var(--blue-ink); }
.rukcon12-v14 .story-closing { margin: 10px 0 44px; font-size: 24px; font-weight: 800; line-height: 1.35; color: var(--blue-ink); }
.rukcon12-v14 .story-logos { width: min(420px, 100%); margin: 0 auto; }
.rukcon12-v14 .story + .xp { padding-top: 70px; }
/* RUK standard: text the Directors have not approved shows in another colour on the previews, with a note. */
.rukcon12-v14 .story-note { margin: 0 0 28px; padding: 12px 16px; border: 1px dashed #7a3db8; border-radius: 12px; background: #f4ecfb; font-size: 13px; font-weight: 600; line-height: 1.5; color: #5b2a8c; }
.rukcon12-v14 .story.is-review .story-head,
.rukcon12-v14 .story.is-review .story-body p,
.rukcon12-v14 .story.is-review .story-body .story-callout,
.rukcon12-v14 .story.is-review .story-for li,
.rukcon12-v14 .story.is-review .story-closing { color: #7a3db8; }
.rukcon12-v14 .story.is-review .story-verse blockquote p { color: #d9c2f2; }

/* The discount and its deadline, much more prominent: a navy banner with the phase, its last day, the saving and a countdown. */
.rukcon12-v14 .tx-promo { display: flex; align-items: center; justify-content: space-between; gap: 28px; margin: 4px 0 40px; padding: 26px 30px; border-radius: 22px; background: var(--blue-ink); color: white; box-shadow: inset 0 0 0 2px var(--gold), 0 30px 60px -28px rgba(9,27,51,.7); }
.rukcon12-v14 .tx-promo-kicker { display: inline-block; margin: 0 0 10px; padding: 7px 14px; border-radius: 999px; background: var(--gold-grad); color: var(--blue-ink); font-size: 13px; font-weight: 900; letter-spacing: .2em; text-transform: uppercase; }
.rukcon12-v14 .tx-promo-ends { margin: 0; font-size: clamp(26px, 2.6vw, 36px); font-weight: 900; line-height: 1.1; letter-spacing: -.02em; color: var(--gold); }
.rukcon12-v14 .tx-promo-save { margin: 10px 0 0; font-size: 16px; font-weight: 600; line-height: 1.5; color: rgba(255,255,255,.9); }
.rukcon12-v14 .tx-promo .countdown { flex: none; display: grid; grid-template-columns: repeat(4, minmax(64px, 1fr)); gap: 8px; margin: 0; }
.rukcon12-v14 .tx-promo .cd-cell { display: grid; justify-items: center; gap: 4px; padding: 12px 8px; border-radius: 14px; background: rgba(255,255,255,.07); box-shadow: inset 0 0 0 1px var(--gold-line); }
.rukcon12-v14 .tx-promo .cd-cell strong { font-family: var(--serif); font-size: 34px; font-weight: 600; line-height: 1; color: white; font-variant-numeric: tabular-nums; }
.rukcon12-v14 .tx-promo .cd-cell small { font-size: 9.5px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--gold); }
.rukcon12-v14 .tx-phase { font-size: 15px; font-weight: 800; color: var(--gold-dark); }
/* The phase and saving on each pass, across the bottom of its photo. */
.rukcon12-v14 .tx-pass .photo { position: relative; }
.rukcon12-v14 .pass-promo { position: absolute; left: 0; right: 0; bottom: 0; padding: 9px 12px; background: rgba(217,48,37,.94); color: white; font-size: 11.5px; font-weight: 900; letter-spacing: .14em; text-align: center; text-transform: uppercase; }

/* Premium looks different from General: a black-and-gold foil card on a gold lanyard, with a PREMIUM band. General keeps the navy pass. */
.rukcon12-v14 .is-premium .tx-strap, .rukcon12-v14 .is-premium .tx-tail { background: repeating-linear-gradient(90deg, #d9ac3a 0 3px, #b88a1d 3px 6px); box-shadow: inset 0 0 0 1px rgba(255,255,255,.35), inset 6px 0 8px -6px rgba(0,0,0,.4), inset -6px 0 8px -6px rgba(0,0,0,.4); }
.rukcon12-v14 .is-premium .tx-strap span { color: var(--blue-ink); }
.rukcon12-v14 .is-premium .tx-pass { background: radial-gradient(120% 90% at 20% 0%, #3b2f12 0%, #17130a 50%, #050403 100%); box-shadow: 0 50px 90px -30px rgba(9,27,51,.8), inset 0 0 0 2px var(--gold), inset 0 0 0 7px rgba(223,177,54,.18); }
.rukcon12-v14 .is-premium .tx-pass .tx-fold { background: linear-gradient(180deg, #d9ac3a, #8f6a12); }
.rukcon12-v14 .is-premium .tx-pass .foil { background: linear-gradient(115deg, transparent 25%, rgba(255,225,140,.42) 42%, rgba(255,255,255,.18) 50%, transparent 64%); background-size: 250% 100%; }
.rukcon12-v14 .is-premium .tx-pass .tier { color: #f4dc8c; }
.rukcon12-v14 .is-premium .tx-pass h3 { color: transparent; background: var(--gold-text); -webkit-background-clip: text; background-clip: text; }
.rukcon12-v14 .is-premium .tx-pass .photo { box-shadow: 0 0 0 2px var(--gold); }
.rukcon12-v14 .is-premium .tx-pass .base { background: #050403; color: var(--gold); box-shadow: inset 0 2px 0 var(--gold); }
.rukcon12-v14 .tx-band { position: absolute; z-index: 5; top: 34px; right: -54px; width: 210px; padding: 8px 0; transform: rotate(45deg); background: var(--gold-grad); color: var(--blue-ink); font-size: 12px; font-weight: 900; letter-spacing: .32em; text-align: center; text-transform: uppercase; box-shadow: 0 6px 14px rgba(0,0,0,.45); }

@media (min-width: 861px) and (max-width: 1240px) {
  .rukcon12-v14 .hero { min-height: 900px; }
  .rukcon12-v14 .hero-logo { width: min(480px, 100%); }
  .rukcon12-v14 .hero .copy { padding-bottom: 130px; }
}
@media (max-width: 860px) {
  .rukcon12-v14 .hero { min-height: 0; }
  .rukcon12-v14 .hero .copy { padding-bottom: 28px; }
  /* Phones: the logo takes the full column (331px at 375px wide), never wider, so nothing scrolls sideways. */
  .rukcon12-v14 .hero-logo { width: 100%; max-width: 420px; margin-bottom: 22px; }
  .rukcon12-v14 .hero-rukruq { width: min(220px, 100%); margin-bottom: 16px; }
  .rukcon12-v14 .story { padding: 70px 22px 30px; }
  .rukcon12-v14 .story-head { margin-bottom: 28px; font-size: clamp(42px, 13vw, 56px); }
  .rukcon12-v14 .story-verse { margin-bottom: 34px; padding: 28px 22px 24px; border-radius: 20px; }
  .rukcon12-v14 .story-quote { height: 44px; font-size: 92px; }
  .rukcon12-v14 .story-verse blockquote p { font-size: 19px; }
  .rukcon12-v14 .story-body p { font-size: 16.5px; line-height: 1.7; }
  .rukcon12-v14 .story-body .story-callout { margin: 26px 0; padding-left: 18px; font-size: 18px; }
  .rukcon12-v14 .story-closing { font-size: 20px; margin-bottom: 34px; }
  .rukcon12-v14 .story-logos { width: min(280px, 100%); }
  .rukcon12-v14 .tx-promo { flex-direction: column; align-items: stretch; gap: 18px; padding: 22px 18px; }
  .rukcon12-v14 .tx-promo .countdown { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
  .rukcon12-v14 .tx-promo .cd-cell strong { font-size: 26px; }
  .rukcon12-v14 .tx-band { top: 26px; right: -58px; font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .rukcon12-v14 .is-premium .tx-pass .foil { animation: none; }
}

/* Carolyn Johnson (2026-10-23): a session's Register button, and the stay text as paragraphs. */
.rukcon12-v14 .ag-register { justify-self: start; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; margin-top: 6px; padding: 10px 18px; border-radius: 999px; background: var(--blue); color: var(--gold); font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; text-decoration: none; }
.rukcon12-v14 .ag-register:hover, .rukcon12-v14 .ag-register:focus-visible { background: var(--blue-ink); color: white; }
.rukcon12-v14 .ag-ev.is-gala .ag-register { background: var(--gold-grad); color: var(--blue-ink); }
.rukcon12-v14 .st-text { display: grid; gap: 10px; }
/* The longer stay text needs a taller section on desktop so the card keeps its margin above and below. */
@media (min-width: 861px) {
  .rukcon12-v14 .st { height: auto; min-height: 920px; }
}
.rukcon12-v14 .st-text .intro { font-size: 15px; line-height: 1.55; }
@media (max-width: 860px) {
  .rukcon12-v14 .st-text .intro { font-size: 14.5px; }
}


/* Version 10 additions: Freedom hours and the event venue under the dates. */
.rukcon12-v14 .rq-hours,
.rukcon12-v14 .rq-venue {
  margin: 6px auto 0;
  max-width: 36rem;
  font-family: var(--sans);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: none;
  color: var(--ink, #1c2430);
}
.rukcon12-v14 .rq-venue { font-weight: 700; }

/* Jayden, 2026-10-31. Brand hexes match lib/events/ruq-brand.ts.
   Date is 19px bold so RUQ pink clears large-text contrast. Teal does not.
   The RUQ logo is narrower than the Freedom logo (280px / 220px) and has
   clear space of about half its height. No script captions. */
.rukcon12-v14 .rq-dates {
  font-size: 19px;
  font-weight: 700;
  color: #F7009F;
}
.rukcon12-v14 .rq-tagline,
.rukcon12-v14 .rq-tagline span { color: #00B9C6; }
/* Lato is scoped to the queens section. The rest of Version 10 keeps --sans (Montserrat).
   Each weight is its own next/font family, so font-weight alone would not select it. */
.rukcon12-v14 #queens,
.rukcon12-v14 #queens :where(p, a, span, button, figcaption) {
  font-family: var(--font-ruq-lato-light), "Lato", sans-serif;
}
.rukcon12-v14 #queens .rq-head h2,
.rukcon12-v14 #queens .rq-dates,
.rukcon12-v14 #queens .rq-venue,
.rukcon12-v14 #queens .rq-tagline,
.rukcon12-v14 #queens .rq-tagline span,
.rukcon12-v14 #queens .rq-cta,
.rukcon12-v14 #queens .rq-presents {
  font-family: var(--font-ruq-lato-bold), "Lato", sans-serif;
}
.rukcon12-v14 #queens .rq-sub,
.rukcon12-v14 #queens .rq-hours,
.rukcon12-v14 #queens .rq-sep {
  font-family: var(--font-ruq-lato-regular), "Lato", sans-serif;
}
.rukcon12-v14 .rq-ruq-logo {
  width: 160px;
  height: auto;
  margin: 42px auto;
}
@media (max-width: 860px) {
  .rukcon12-v14 .rq-ruq-logo { width: 140px; margin: 36px auto; }
}
/* Italic Cormorant is its own next/font family. font-style alone cannot select it. */
.rukcon12-v14 .sheet a.row span,
.rukcon12-v14 .track figcaption,
.rukcon12-v14 .xp-pillar .n,
.rukcon12-v14 .xp-plan b,
.rukcon12-v14 .qa .n,
.rukcon12-v14 .ft-cta h2 span {
  font-family: var(--font-cormorant-italic), "Cormorant Garamond", Georgia, serif;
}
.rukcon12-v14 .verse {
  font-family: var(--font-montserrat-italic), var(--font-montserrat), "Montserrat", system-ui, sans-serif;
}

/* ============ Hero layout (Will Stratman, Slack, 2026-11-04) ============ */
/* A layout fix on the published Version 12 (Rule 7): no copy, links or content change. */
/* Desktop and landscape tablets: "the ticker box needs to be more in line with the top of the logo like
   I've mocked here." The countdown's top lines up with the top of the RUKCON12 wordmark, on the right
   over the collage, and the date card stays under it. The copy starts at the top of the hero (not
   centred in its minimum height), so the wordmark's top is fixed: the copy's top padding, the RUK + RUQ
   lockup (300px wide, 1200x488 art) and its margin, the date chip and its margin. The column starts
   right of the wordmark, headline and button line, so it never covers them (at 1024px wide it used to
   cover the end of "For RUK + RUQ members, friends and family"). The venue name wraps in the card. */
@media (min-width: 861px) {
  .rukcon12-v14 .hero { --r12-wordmark-top: calc(112px + 300px * 488 / 1200 + 22px + 31px + 20px); }
  .rukcon12-v14 .hero .copy { align-self: flex-start; }
  .rukcon12-v14 .hero-side { top: var(--r12-wordmark-top); bottom: auto; }
  .rukcon12-v14 .hero-side .date-card b { white-space: normal; line-height: 1.1; }
}
@media (min-width: 1241px) {
  .rukcon12-v14 .hero-side { width: min(660px, calc(100% - 2 * var(--gutter) - 700px)); }
}
@media (min-width: 861px) and (max-width: 1240px) {
  /* The copy column is 48px + 480px here (the wordmark and the lede), the countdown takes the rest. */
  .rukcon12-v14 .hero-side { width: calc(100% - 32px - 560px); }
  .rukcon12-v14 .hero-side .countdown { gap: 6px; padding: 10px; }
  .rukcon12-v14 .hero-side .cd-cell strong { font-size: clamp(22px, 2.6vw, 30px); }
  .rukcon12-v14 .hero-side .cd-cell small { font-size: 8px; letter-spacing: .12em; }
  .rukcon12-v14 .hero-side .date-card { gap: 14px; padding: 14px 18px 14px 14px; }
  .rukcon12-v14 .hero-side .date-card b { font-size: clamp(18px, 2vw, 24px); }
}
/* Phones: "we need to move everything up considerably. It's probably fine if it sits on top of the
   scrolling images." Version 9's 112px top padding no longer applies on phones, and the copy starts
   240px up, over the collage, which now fades to navy sooner so the white logos and text stay readable
   on top of it. Follow-up (Will Stratman, 2026-11-04 13:53): "The mobile version still needs the content
   higher", so the pull-up went from 130px to 240px: the RUK + RUQ logos start 140px from the top, just
   under the floating header (which ends at 74px), and the countdown comes up onto the first screen. */
@media (max-width: 860px) {
  .rukcon12-v14 .wall-wrap { mask-image: linear-gradient(180deg, black 22%, rgba(0,0,0,.35) 46%, transparent 72%); -webkit-mask-image: linear-gradient(180deg, black 22%, rgba(0,0,0,.35) 46%, transparent 72%); }
  .rukcon12-v14 .hero .copy { padding-top: 0; margin-top: -240px; }
}

/* ============ Version 13 additions: RUKGAMES (Carolyn Johnson, 2026-11-04) ============ */
/* One red for every RUKGAMES mention. --rukgames is for light (ivory) cards: #b3261e is 6.2:1 on the
   ivory. On navy (the Gala row, or any dark block) it switches to #ff8a80, 5.3:1 on --blue and more on
   the deeper navies. Both pass WCAG AA for body text. */
.rukcon12-v14 { --rukgames: #b3261e; --rukgames-on-dark: #ff8a80; }
.rukcon12-v14 .rg { color: var(--rukgames); font-weight: 800; }
.rukcon12-v14 .ag-ev.is-gala .rg, .rukcon12-v14 .ag-tag .rg { color: var(--rukgames-on-dark); }
.rukcon12-v14 .rg-notice { position: relative; margin: 0 0 22px; padding: 28px 32px 26px 36px; overflow: hidden; border-radius: 22px; background: var(--ivory); color: var(--blue); box-shadow: 0 26px 44px -26px rgba(0,0,0,.6); }
.rukcon12-v14 .rg-notice::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 8px; background: var(--rukgames); }
.rukcon12-v14 .rg-kicker { display: inline-flex; margin: 0 0 10px; padding: 4px 12px; border-radius: 999px; background: var(--rukgames); color: white; font-size: 11px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
.rukcon12-v14 .rg-title { margin: 0 0 10px; font-weight: 900; font-size: 26px; line-height: 1.1; letter-spacing: -.02em; text-transform: uppercase; overflow-wrap: anywhere; }
.rukcon12-v14 .rg-subtitle { margin: 20px 0 8px; padding-top: 18px; border-top: 1px solid rgba(20,55,96,.12); font-weight: 900; font-size: 18px; line-height: 1.2; letter-spacing: -.01em; text-transform: uppercase; }
.rukcon12-v14 .rg-body { max-width: 860px; margin: 0; font-size: 15.5px; font-weight: 500; line-height: 1.6; color: #2c3a4e; }
.rukcon12-v14 .rg-when { display: inline-flex; align-items: center; gap: 8px; margin: 14px 0 0; padding: 8px 14px; border-radius: 12px; background: rgba(20,55,96,.07); font-size: 14px; font-weight: 800; line-height: 1.4; color: var(--blue); }
.rukcon12-v14 .rg-when svg { flex: none; color: var(--gold-dark); }
.rukcon12-v14 .ag-ev.is-rukgames .ag-name { font-size: 17px; }
.rukcon12-v14 .ag-tentative { display: block; margin-top: 4px; font-size: 10.5px; font-weight: 700; letter-spacing: .06em; color: #5a6677; text-transform: none; }
@media (max-width: 860px) {
  .rukcon12-v14 .rg-notice { margin-bottom: 16px; padding: 22px 20px 20px 26px; }
  .rukcon12-v14 .rg-title { font-size: 21px; }
  .rukcon12-v14 .rg-subtitle { font-size: 16px; }
  .rukcon12-v14 .rg-body { font-size: 15px; }
  .rukcon12-v14 .rg-when { display: flex; align-items: flex-start; }
}

/* Sponsor link (RUKCON 12 parity, 2026-11-09): RUKCON 11's "Other Ways In" sponsor card, shown only
   when the website copy saves one (model.sponsor). New class names only; nothing above changes. */
.rukcon12-v14 .sx { padding: 72px var(--gutter); background: var(--blue); color: #fff; }
.rukcon12-v14 .sx-inner { max-width: 860px; margin: 0 auto; }
.rukcon12-v14 .sx .eyebrow { margin: 0 0 18px; font-size: 12px; font-weight: 800; letter-spacing: .22em; }
.rukcon12-v14 .sx-card { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 24px; padding: 28px 32px; border-radius: 24px; color: inherit; text-decoration: none; box-shadow: inset 0 0 0 1px var(--gold-line); transition: background .4s var(--ease); }
.rukcon12-v14 .sx-card:hover, .rukcon12-v14 .sx-card:focus-visible { background: rgba(223, 177, 54, .08); }
.rukcon12-v14 .sx-copy b { display: block; font-family: var(--serif); font-size: 36px; font-weight: 600; line-height: 1.05; color: transparent; background: var(--gold-text); -webkit-background-clip: text; background-clip: text; }
.rukcon12-v14 .sx-copy small { display: block; margin-top: 8px; font-size: 15px; line-height: 1.5; color: rgba(255, 255, 255, .78); }
.rukcon12-v14 .sx-card > svg { color: var(--gold); transition: transform .5s var(--ease); }
.rukcon12-v14 .sx-card:hover > svg { transform: translateX(4px); }
@media (max-width: 860px) {
  .rukcon12-v14 .sx { padding: 56px 18px; }
  .rukcon12-v14 .sx-card { gap: 16px; padding: 22px 20px; }
  .rukcon12-v14 .sx-copy b { font-size: 28px; }
}
/* RUK standard on the agenda (private preview only): saved sessions that are not live yet show in the review colour, with a note. */
.rukcon12-v14 .ag-review-note { margin: 0 0 22px; padding: 12px 16px; border: 1px dashed #7a3db8; border-radius: 12px; background: #f4ecfb; font-size: 13px; font-weight: 600; line-height: 1.5; color: #5b2a8c; }
.rukcon12-v14 .ag-ev.is-review .ag-time,
.rukcon12-v14 .ag-ev.is-review .ag-name,
.rukcon12-v14 .ag-ev.is-review .ag-place,
.rukcon12-v14 .ag-ev.is-review .ag-speakers,
.rukcon12-v14 .ag-ev.is-review .ag-detail { color: #7a3db8; }
.rukcon12-v14 .ag-ev.is-review { box-shadow: inset 3px 0 0 #7a3db8; margin-left: -12px; padding-left: 12px; }
.rukcon12-v14 .ag-ev.is-gala.is-review .ag-time,
.rukcon12-v14 .ag-ev.is-gala.is-review .ag-name,
.rukcon12-v14 .ag-ev.is-gala.is-review .ag-place,
.rukcon12-v14 .ag-ev.is-gala.is-review .ag-speakers,
.rukcon12-v14 .ag-ev.is-gala.is-review .ag-detail { color: #d9c2f2; }