@font-face {
  font-family: "IBM Plex Sans";
  src: url("fonts/ibm-plex-sans.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 700;
  font-display: swap;
}

@font-face {
  font-family: "Public Sans";
  src: url("fonts/public-sans.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

body.twgbf-page {
  max-width: none;
  margin: 0 !important;
  padding: 0;
  background: #101112;
}

body.twgbf-page.admin-bar {
  --twgbf-admin-bar: 32px;
}

#twgbf-campaign.twgbf {
  --twgbf-bg: #101112;
  --twgbf-panel: #18191b;
  --twgbf-line: #373739;
  --twgbf-white: #f2f1ed;
  --twgbf-muted: #c2c1bc;
  --twgbf-gold: #e0c28e;
  --twgbf-ink: #171614;
  --twgbf-silver: #e7e7e3;
  --twgbf-heading: "IBM Plex Sans", "Segoe UI", Arial, sans-serif;
  --twgbf-text: "Public Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --twgbf-gutter: clamp(1.125rem, 4vw, 3.1rem);
  --twgbf-space: clamp(3.6rem, 7.5vw, 7.2rem);
  position: relative;
  isolation: isolate;
  overflow: clip;
  width: 100%;
  max-width: none;
  background: var(--twgbf-bg);
  color: var(--twgbf-white);
  font: 400 16px/1.65 var(--twgbf-text);
  text-align: left;
  text-transform: none;
  letter-spacing: normal;
}

#twgbf-campaign,
#twgbf-campaign *,
#twgbf-campaign *::before,
#twgbf-campaign *::after {
  box-sizing: border-box;
}

#twgbf-campaign :where(h1, h2, p, ul, figure) {
  margin: 0;
  padding: 0;
}

#twgbf-campaign :where(h1, h2) {
  color: inherit;
  font-family: var(--twgbf-heading);
  font-style: normal;
  font-weight: 600;
  line-height: 1.12;
  letter-spacing: -.018em;
  text-transform: none;
}

#twgbf-campaign :where(a, button, label, input, summary) {
  font-family: var(--twgbf-text);
  letter-spacing: normal;
  text-transform: none;
}

#twgbf-campaign a {
  color: inherit;
  box-shadow: none;
  text-decoration: none;
}

#twgbf-campaign :where(a, button, input, summary):focus-visible {
  outline: 2px solid var(--twgbf-gold);
  outline-offset: 4px;
}

#twgbf-campaign .twgbf-shell {
  width: min(78rem, calc(100% - 2 * var(--twgbf-gutter)));
  margin-inline: auto;
}

#twgbf-campaign .twgbf-top {
  position: absolute;
  top: 0;
}

#twgbf-campaign .twgbf-skip {
  position: absolute;
  z-index: 5;
  top: .65rem;
  left: var(--twgbf-gutter);
  padding: .58rem .95rem;
  background: var(--twgbf-gold);
  color: var(--twgbf-ink);
  transform: translateY(-200%);
}

#twgbf-campaign .twgbf-skip:focus {
  transform: none;
}

#twgbf-campaign :is(#twlp-inhalt, #twlp-zugang, #twlp-globus, #twlp-stationen, #twlp-ueber-uns, #twlp-ablauf) {
  scroll-margin-top: calc(5.5rem + var(--twgbf-admin-bar, 0px));
}

#twgbf-campaign .twgbf-header {
  position: sticky;
  z-index: 3;
  top: var(--twgbf-admin-bar, 0px);
  border-bottom: 1px solid #2e2e30;
  background: #101112;
}

#twgbf-campaign .twgbf-header-row,
#twgbf-campaign .twgbf-footer-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .85rem;
}

#twgbf-campaign .twgbf-header-row {
  min-height: 4.25rem;
}

#twgbf-campaign .twgbf-brand {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: .64rem;
  color: var(--twgbf-white);
  font-size: .97rem;
  font-weight: 700;
  line-height: 1;
}

#twgbf-campaign .twgbf-brand strong {
  color: var(--twgbf-gold);
}

#twgbf-campaign .twgbf-monogram {
  display: grid;
  width: 2.25rem;
  aspect-ratio: 1;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid #806c4d;
  background: #1e1b17;
  color: var(--twgbf-gold);
  font: 700 .76rem/1 var(--twgbf-heading);
}

#twgbf-campaign .twgbf-nav,
#twgbf-campaign .twgbf-legal {
  display: flex;
  align-items: center;
  gap: clamp(.85rem, 2.9vw, 2.15rem);
}

#twgbf-campaign .twgbf-nav a,
#twgbf-campaign .twgbf-legal a {
  color: var(--twgbf-muted);
  font-size: .88rem;
  font-weight: 600;
}

#twgbf-campaign .twgbf-nav a:hover,
#twgbf-campaign .twgbf-legal a:hover {
  color: var(--twgbf-white);
  text-decoration: underline;
  text-underline-offset: .23em;
}

#twgbf-campaign .twgbf-button,
#twgbf-campaign .twgbf-text-link {
  display: inline-flex;
  min-height: 2.85rem;
  align-items: center;
  justify-content: center;
  gap: .62rem;
  font-size: .9375rem;
  font-weight: 650;
  line-height: 1.25;
}

#twgbf-campaign .twgbf-button {
  padding: .76rem 1.08rem;
  border: 1px solid transparent;
  border-radius: .25rem;
  background: var(--twgbf-gold);
  color: var(--twgbf-ink) !important;
  text-align: center;
  cursor: pointer;
}

#twgbf-campaign .twgbf-button:hover {
  background: #eed4a6;
}

#twgbf-campaign .twgbf-button-small {
  min-height: 2.65rem;
  padding: .58rem .82rem;
  font-size: .84rem;
}

#twgbf-campaign .twgbf-button-ink {
  background: var(--twgbf-ink);
  color: var(--twgbf-white) !important;
}

#twgbf-campaign .twgbf-button-ink:hover {
  background: #36332e;
}

#twgbf-campaign .twgbf-button-ink:focus-visible {
  outline-color: var(--twgbf-ink);
}

#twgbf-campaign :is(.twgbf-button, .twgbf-text-link) svg {
  width: 1.13em;
  height: 1.13em;
  flex: 0 0 auto;
}

#twgbf-campaign .twgbf-text-link {
  color: var(--twgbf-white);
  text-decoration: underline;
  text-underline-offset: .25em;
}

#twgbf-campaign .twgbf-text-link:hover {
  color: var(--twgbf-gold);
}

#twgbf-campaign .twgbf-kicker {
  color: var(--twgbf-gold);
  font-size: .75rem;
  font-weight: 700;
  line-height: 1.4;
  text-transform: uppercase;
  letter-spacing: .09em;
}

#twgbf-campaign .twgbf-kicker > span {
  margin-inline: .24rem;
}

/* Kampagnenauftakt */
#twgbf-campaign .twgbf-hero {
  position: relative;
  isolation: isolate;
  display: grid;
  min-height: 34rem;
  align-items: center;
  background: var(--twgbf-bg);
}

#twgbf-campaign .twgbf-hero-art {
  position: absolute;
  z-index: -1;
  inset: 0 0 0 auto;
  width: min(100%, 100rem);
  overflow: hidden;
  pointer-events: none;
}

#twgbf-campaign .twgbf-hero-art img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: right center;
}

#twgbf-campaign .twgbf-hero-art::after {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, #101112 14%, #101112ed 29%, #10111294 48%, transparent 75%),
    linear-gradient(0deg, #101112 0%, #10111200 28%);
  content: "";
}

#twgbf-campaign .twgbf-hero-content {
  padding-block: clamp(3.2rem, 5.1vw, 5.25rem);
}

#twgbf-campaign .twgbf-hero h1 {
  margin-block: .16em .23em;
  font-size: clamp(2.65rem, 7vw, 6.75rem);
  font-weight: 700;
  line-height: 1.02;
  letter-spacing: -.024em;
}

#twgbf-campaign .twgbf-hero h1 span,
#twgbf-campaign .twgbf-hero h1 strong {
  display: block;
}

#twgbf-campaign .twgbf-hero h1 strong {
  color: var(--twgbf-gold);
  font-weight: inherit;
}

#twgbf-campaign .twgbf-hero-timing {
  display: grid;
  grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr);
  gap: .72rem 1.15rem;
  max-width: 37.5rem;
  margin: 0;
  color: var(--twgbf-white);
  line-height: 1.3;
}

#twgbf-campaign .twgbf-hero-timing > div {
  padding-left: .72rem;
  border-left: 2px solid var(--twgbf-gold);
}

#twgbf-campaign .twgbf-hero-timing dt {
  color: var(--twgbf-gold);
  font-size: .75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
}

#twgbf-campaign .twgbf-hero-timing dd {
  margin: .23rem 0 0;
  font-size: clamp(1rem, 1.5vw, 1.17rem);
  font-weight: 650;
}

#twgbf-campaign .twgbf-hero-description {
  max-width: 54ch;
  margin-top: .75rem;
  color: var(--twgbf-muted);
  font-size: clamp(1rem, 1.4vw, 1.125rem);
  text-wrap: pretty;
}

#twgbf-campaign .twgbf-hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem 1.15rem;
  margin-top: 1.28rem;
}

/* Rabatt und Countdown */
#twgbf-campaign .twgbf-deal-strip {
  border-block: 1px solid #383538;
  background: var(--twgbf-panel);
}

#twgbf-campaign .twgbf-deal-row {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  align-items: stretch;
}

#twgbf-campaign .twgbf-discount {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: clamp(.85rem, 2.5vw, 1.75rem);
  padding: .9rem 1rem .9rem 0;
}

#twgbf-campaign .twgbf-discount-number {
  flex: 0 0 auto;
  color: var(--twgbf-gold);
}

#twgbf-campaign .twgbf-discount-number > span {
  display: block;
  font-size: .75rem;
  font-weight: 700;
  line-height: 1.2;
  text-transform: uppercase;
  letter-spacing: .07em;
}

#twgbf-campaign .twgbf-discount-number strong {
  display: block;
  font: 700 clamp(2.55rem, 5.25vw, 4rem)/1 var(--twgbf-heading);
  letter-spacing: -.025em;
}

#twgbf-campaign .twgbf-discount-number strong span {
  font-size: .54em;
}

#twgbf-campaign .twgbf-discount p {
  font-size: .9375rem;
  font-weight: 650;
  line-height: 1.35;
}

#twgbf-campaign .twgbf-discount p span {
  display: block;
  margin-top: .19rem;
  color: var(--twgbf-muted);
  font-size: .875rem;
  font-weight: 500;
}

#twgbf-campaign .twgbf-countdown {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: .6rem .95rem;
  padding: .9rem 0 .9rem clamp(.95rem, 3vw, 2.2rem);
  border-left: 1px solid #383538;
}

#twgbf-campaign .twgbf-countdown [hidden] {
  display: none !important;
}

#twgbf-campaign .twgbf-countdown-date {
  display: grid;
  gap: .1rem;
  color: var(--twgbf-muted);
  font-size: .875rem;
  line-height: 1.3;
}

#twgbf-campaign .twgbf-countdown-date span {
  color: var(--twgbf-gold);
  font-size: .75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
}

#twgbf-campaign .twgbf-countdown-readout {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

#twgbf-campaign .twgbf-unit {
  min-width: clamp(2.55rem, 4.8vw, 4.3rem);
  padding-inline: .33rem;
  color: var(--twgbf-muted);
  font-size: .75rem;
  line-height: 1.2;
  text-align: center;
}

#twgbf-campaign .twgbf-unit + .twgbf-unit {
  border-left: 1px solid #49494b;
}

#twgbf-campaign .twgbf-unit strong {
  display: block;
  margin-bottom: .13rem;
  color: var(--twgbf-white);
  font: 650 clamp(1.35rem, 2.55vw, 2rem)/1.1 var(--twgbf-heading);
  font-variant-numeric: tabular-nums;
}

#twgbf-campaign .twgbf-unit abbr {
  border: 0;
  text-decoration: none;
}

#twgbf-campaign .twgbf-countdown-status {
  color: var(--twgbf-white);
  font-size: .91rem;
  font-weight: 700;
}

/* Originalglobus und Anmeldung */
#twgbf-campaign .twgbf-access,
#twgbf-campaign .twgbf-study,
#twgbf-campaign .twgbf-faq {
  padding-block: var(--twgbf-space);
}

#twgbf-campaign .twgbf-access-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(1.65rem, 5.6vw, 5.5rem);
}

#twgbf-campaign .twgbf-globe h2,
#twgbf-campaign .twgbf-form-panel h2 {
  margin-top: .32em;
  font-size: clamp(1.95rem, 3.65vw, 3.5rem);
  text-wrap: balance;
}

#twgbf-campaign .twgbf-globe > p:not(.twgbf-kicker) {
  max-width: 52ch;
  margin-top: .7rem;
  color: var(--twgbf-muted);
  font-size: 1.0625rem;
}

#twgbf-campaign .twgbf-globe-figure {
  margin-top: 1.2rem;
  border: 1px solid var(--twgbf-line);
  background: #15171b;
}

#twgbf-campaign .twgbf-globe-art {
  position: relative;
  display: grid;
  min-width: 0;
  place-items: center;
  padding: 1.8rem .7rem .35rem;
  background: radial-gradient(ellipse at 50% 44%, #222b35, #13151a 76%);
}

#twgbf-campaign .twgbf-globe-image {
  position: relative;
  width: min(88%, 27rem);
}

#twgbf-campaign .twgbf-globe-image img {
  display: block;
  width: 100%;
  height: auto;
  mix-blend-mode: screen;
  mask-image: radial-gradient(ellipse 75% 77% at 50% 50%, #000 63%, transparent 98%);
}

#twgbf-campaign .twgbf-globe-marker {
  position: absolute;
  top: 15.8%;
  left: 35.9%;
  display: grid;
  width: 20.25%;
  height: 5.75%;
  place-items: center;
  border: 1px solid #4e8461;
  background: #091b14;
  color: #c4ead1;
  font: 700 clamp(.43rem, .7vw, .62rem)/1 var(--twgbf-text);
  white-space: nowrap;
}

#twgbf-campaign .twgbf-globe-label {
  position: absolute;
  z-index: 1;
  top: .78rem;
  right: .88rem;
  left: .88rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: .2rem .65rem;
  color: var(--twgbf-muted);
  font-size: .75rem;
  font-weight: 700;
  line-height: 1.25;
  text-transform: uppercase;
  letter-spacing: .07em;
}

#twgbf-campaign .twgbf-globe-label span:last-child {
  color: var(--twgbf-gold);
}

#twgbf-campaign .twgbf-globe-figure figcaption {
  padding: .66rem .88rem;
  border-top: 1px solid var(--twgbf-line);
  color: var(--twgbf-muted);
  font-size: .875rem;
}

#twgbf-campaign .twgbf-form-panel {
  min-width: 0;
  padding: clamp(1.25rem, 3.65vw, 3.05rem);
  border-top: 3px solid #b59562;
  background: var(--twgbf-silver);
  color: var(--twgbf-ink);
  color-scheme: light;
}

#twgbf-campaign .twgbf-form-panel .twgbf-kicker {
  color: #5b472a;
}

#twgbf-campaign .twgbf-form-panel h2 {
  font-size: clamp(1.85rem, 3.3vw, 3.1rem);
}

#twgbf-campaign .twgbf-benefits {
  display: grid;
  gap: .53rem;
  margin: .95rem 0 1.25rem;
  list-style: none;
}

#twgbf-campaign .twgbf-benefits li {
  display: grid;
  grid-template-columns: .75rem minmax(0, 1fr);
  gap: .45rem;
  margin: 0;
  color: #302f2c;
  font-size: 1rem;
  font-weight: 550;
  line-height: 1.48;
}

#twgbf-campaign .twgbf-benefits li::before {
  width: .51rem;
  height: .29rem;
  margin: .37rem 0 0 .07rem;
  border: solid #74562e;
  border-width: 0 0 1.5px 1.5px;
  transform: rotate(-45deg);
  content: "";
}

#twgbf-campaign .twgbf-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .68rem;
}

#twgbf-campaign .twgbf-field label {
  display: block;
  margin-bottom: .29rem;
  color: var(--twgbf-ink);
  font-size: .9375rem;
  font-weight: 650;
}

#twgbf-campaign .twgbf-field input {
  display: block;
  width: 100%;
  min-height: 2.9rem;
  padding: .45rem .63rem;
  border: 1px solid #7b7a74;
  border-radius: .18rem;
  background: #f7f6f3;
  color: var(--twgbf-ink);
  font-size: 1rem;
}

#twgbf-campaign .twgbf-form :is(input, a):focus-visible {
  outline: 2px solid var(--twgbf-ink);
  outline-offset: 2px;
}

#twgbf-campaign .twgbf-consent {
  display: flex;
  align-items: flex-start;
  gap: .58rem;
  margin-block: .9rem 1rem;
  color: #353432;
  font-size: .875rem;
  font-weight: 400;
  line-height: 1.55;
  cursor: pointer;
}

#twgbf-campaign .twgbf-consent input {
  appearance: auto;
  width: 1.06rem;
  height: 1.06rem;
  flex: 0 0 1.06rem;
  margin: .13rem 0 0;
  accent-color: var(--twgbf-ink);
  cursor: pointer;
}

#twgbf-campaign .twgbf-form .twgbf-button {
  width: 100%;
  min-height: 3rem;
}

#twgbf-campaign .twgbf-form-foot {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: .16rem .68rem;
  margin-top: .58rem;
  color: #494843;
  font-size: .875rem;
}

#twgbf-campaign .twgbf-form-foot a {
  color: #373530;
  text-decoration: underline;
  text-underline-offset: .2em;
}

/* Lernbereich */
#twgbf-campaign .twgbf-study {
  border-block: 1px solid #343436;
  background: #18191b;
}

#twgbf-campaign .twgbf-study-head {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
  align-items: end;
  gap: .8rem 2.2rem;
  margin-bottom: clamp(1.3rem, 3.2vw, 2.55rem);
}

#twgbf-campaign .twgbf-study-head h2,
#twgbf-campaign .twgbf-about-copy h2,
#twgbf-campaign .twgbf-ticket-copy h2,
#twgbf-campaign .twgbf-faq h2 {
  margin-top: .26em;
  font-size: clamp(2.125rem, 4.35vw, 3.875rem);
  text-wrap: balance;
}

#twgbf-campaign .twgbf-study-head > p {
  max-width: 43ch;
  color: var(--twgbf-muted);
  font-size: 1.0625rem;
}

#twgbf-campaign .twgbf-study-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.14fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(1.4rem, 4.6vw, 4.25rem);
}

#twgbf-campaign .twgbf-study-art {
  overflow: hidden;
  aspect-ratio: 3 / 2;
  border: 1px solid #505052;
  background: #141415;
}

#twgbf-campaign .twgbf-study-art img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#twgbf-campaign :is(.twgbf-lessons, .twgbf-faq-list) details {
  border-top: 1px solid #4b4b4e;
}

#twgbf-campaign :is(.twgbf-lessons, .twgbf-faq-list) details:last-child {
  border-bottom: 1px solid #4b4b4e;
}

#twgbf-campaign :is(.twgbf-lessons, .twgbf-faq-list) summary {
  display: flex;
  min-height: 3.55rem;
  align-items: center;
  gap: .68rem;
  padding: .7rem .42rem .7rem 0;
  color: var(--twgbf-white);
  font-size: clamp(1rem, 1.6vw, 1.15rem);
  font-weight: 650;
  line-height: 1.35;
  list-style: none;
  cursor: pointer;
}

#twgbf-campaign summary::-webkit-details-marker {
  display: none;
}

#twgbf-campaign :is(.twgbf-lessons, .twgbf-faq-list) summary::after {
  width: .52rem;
  height: .52rem;
  flex: 0 0 auto;
  margin-left: auto;
  border: solid var(--twgbf-gold);
  border-width: 0 1.5px 1.5px 0;
  transform: translateY(-.1rem) rotate(45deg);
  content: "";
}

#twgbf-campaign details[open] > summary::after {
  transform: translateY(.1rem) rotate(225deg);
}

#twgbf-campaign .twgbf-index {
  flex: 0 0 1.55rem;
  color: var(--twgbf-gold);
  font-size: .75rem;
  font-weight: 700;
}

#twgbf-campaign :is(.twgbf-lessons, .twgbf-faq-list) details > p {
  max-width: 60ch;
  padding: 0 .8rem 1rem 0;
  color: var(--twgbf-muted);
  font-size: 1rem;
}

#twgbf-campaign .twgbf-lessons details > p {
  padding-left: 2.23rem;
}

/* Porträt und Redaktionstext */
#twgbf-campaign .twgbf-about {
  padding-top: var(--twgbf-space);
}

#twgbf-campaign .twgbf-about-grid {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  align-items: center;
  gap: clamp(1.45rem, 5vw, 4.65rem);
}

#twgbf-campaign .twgbf-about-copy > p:not(.twgbf-kicker) {
  max-width: 53ch;
  margin-top: .82rem;
  color: var(--twgbf-muted);
  font-size: 1.0625rem;
  text-wrap: pretty;
}

#twgbf-campaign .twgbf-about-copy > p.twgbf-about-lead {
  color: var(--twgbf-white);
  font-size: clamp(1.04rem, 1.5vw, 1.22rem);
  font-weight: 600;
  line-height: 1.48;
}

#twgbf-campaign .twgbf-about-copy .twgbf-text-link {
  margin-top: .7rem;
}

#twgbf-campaign .twgbf-about-portrait {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 1px solid #494237;
  background: var(--twgbf-panel);
}

#twgbf-campaign .twgbf-about-portrait img {
  display: block;
  width: 100%;
  height: auto;
}

#twgbf-campaign .twgbf-about-portrait figcaption {
  position: absolute;
  bottom: clamp(.78rem, 2.2vw, 1.45rem);
  left: clamp(.78rem, 2.2vw, 1.45rem);
  padding-left: .61rem;
  border-left: 2px solid var(--twgbf-gold);
  color: var(--twgbf-muted);
  font-size: clamp(.75rem, 1.15vw, .875rem);
  line-height: 1.45;
}

#twgbf-campaign .twgbf-about-portrait figcaption strong {
  display: block;
  color: var(--twgbf-white);
  font-size: 1.13em;
  font-weight: 700;
}

/* Angebot und Abschluss */
#twgbf-campaign .twgbf-reveal {
  padding-top: var(--twgbf-space);
}

#twgbf-campaign .twgbf-ticket {
  display: grid;
  grid-template-columns: minmax(0, .74fr) minmax(0, 1.26fr);
  background: var(--twgbf-gold);
  color: var(--twgbf-ink);
}

#twgbf-campaign .twgbf-ticket-date,
#twgbf-campaign .twgbf-ticket-copy {
  padding: clamp(1.2rem, 4vw, 3.45rem);
}

#twgbf-campaign .twgbf-ticket-date {
  display: flex;
  min-width: 0;
  flex-direction: column;
  justify-content: center;
  gap: .65rem;
  border-right: 1px dashed #8b6b3f;
  background: repeating-linear-gradient(135deg, #3927180b 0 1px, transparent 1px 8px);
}

#twgbf-campaign .twgbf-ticket-date > span {
  font-size: .75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
}

#twgbf-campaign .twgbf-ticket-date strong {
  font: 700 clamp(3.3rem, 8.8vw, 8.6rem)/1 var(--twgbf-heading);
  letter-spacing: -.025em;
  white-space: nowrap;
}

#twgbf-campaign .twgbf-ticket-date strong span {
  font-size: .58em;
}

#twgbf-campaign .twgbf-ticket-copy .twgbf-kicker {
  color: #49371f;
}

#twgbf-campaign .twgbf-ticket-copy > p:not(.twgbf-kicker) {
  max-width: 48ch;
  margin-top: .74rem;
  font-size: 1.0625rem;
}

#twgbf-campaign .twgbf-ticket-copy .twgbf-button {
  margin-top: .96rem;
}

#twgbf-campaign .twgbf-faq-grid {
  display: grid;
  grid-template-columns: minmax(0, .73fr) minmax(0, 1.27fr);
  gap: 1.25rem 2rem;
}

#twgbf-campaign .twgbf-faq-list summary {
  font-size: 1rem;
}

#twgbf-campaign .twgbf-footer {
  padding-block: 1.65rem 2rem;
  border-top: 1px solid var(--twgbf-line);
}

#twgbf-campaign .twgbf-footer-row {
  flex-wrap: wrap;
}

#twgbf-campaign .twgbf-footer-row p,
#twgbf-campaign .twgbf-risk {
  color: var(--twgbf-muted);
  font-size: .875rem;
}

#twgbf-campaign .twgbf-risk {
  max-width: 108ch;
  margin-top: 1.15rem;
}

#twgbf-campaign .twgbf-risk strong {
  display: block;
  margin-bottom: .12rem;
  color: var(--twgbf-white);
}

@media (max-width: 52rem) {
  #twgbf-campaign .twgbf-hero {
    min-height: 30rem;
  }

  #twgbf-campaign .twgbf-hero-art {
    width: 82%;
  }

  #twgbf-campaign .twgbf-study-head {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 48.875rem) {
  body.twgbf-page.admin-bar {
    --twgbf-admin-bar: 46px;
  }
}

@media (max-width: 46rem) {
  #twgbf-campaign .twgbf-nav {
    display: none;
  }

  #twgbf-campaign .twgbf-header-row {
    min-height: 3.65rem;
  }

  #twgbf-campaign .twgbf-hero {
    min-height: 0;
  }

  #twgbf-campaign .twgbf-hero h1 {
    font-size: clamp(2.65rem, 11.8vw, 5rem);
  }

  #twgbf-campaign .twgbf-hero-content {
    padding-block: 2.8rem 7.8rem;
  }

  #twgbf-campaign .twgbf-hero-timing {
    grid-template-columns: minmax(0, 1fr);
  }

  #twgbf-campaign .twgbf-hero-art {
    inset: auto 0 0;
    width: 100%;
    height: min(63%, 22rem);
  }

  #twgbf-campaign .twgbf-hero-art img {
    object-fit: cover;
    object-position: 79% 61%;
  }

  #twgbf-campaign .twgbf-hero-art::after {
    background:
      linear-gradient(180deg, #101112 0%, #101112ca 26%, #10111210 69%, #101112 100%),
      linear-gradient(90deg, #101112ab, transparent 85%);
  }

  #twgbf-campaign .twgbf-deal-row,
  #twgbf-campaign .twgbf-access-grid,
  #twgbf-campaign .twgbf-study-grid,
  #twgbf-campaign .twgbf-about-grid,
  #twgbf-campaign .twgbf-ticket,
  #twgbf-campaign .twgbf-faq-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  #twgbf-campaign .twgbf-countdown {
    padding-left: 0;
    border-top: 1px solid #383538;
    border-left: 0;
  }

  #twgbf-campaign .twgbf-form-panel {
    grid-row: 1;
  }

  #twgbf-campaign .twgbf-ticket-date {
    flex-flow: row wrap;
    align-items: center;
    justify-content: space-between;
    border-right: 0;
    border-bottom: 1px dashed #8b6b3f;
  }

  #twgbf-campaign .twgbf-ticket-date strong {
    font-size: clamp(3.1rem, 10.5vw, 5.4rem);
  }
}

@media (max-width: 37.5rem) {
  body.twgbf-page.admin-bar {
    --twgbf-admin-bar: 0px;
  }
}

@media (max-width: 29rem) {
  #twgbf-campaign .twgbf-header-row {
    gap: .45rem;
  }

  #twgbf-campaign .twgbf-brand {
    gap: .4rem;
    font-size: .83rem;
  }

  #twgbf-campaign .twgbf-monogram {
    width: 1.8rem;
    font-size: .66rem;
  }

  #twgbf-campaign .twgbf-button-small {
    padding-inline: .58rem;
    font-size: .8125rem;
  }

  #twgbf-campaign .twgbf-countdown {
    grid-template-columns: minmax(0, 1fr);
  }

  #twgbf-campaign .twgbf-countdown-date {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: .16rem .6rem;
  }

  #twgbf-campaign .twgbf-unit {
    min-width: 0;
  }

  #twgbf-campaign .twgbf-fields {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (prefers-reduced-motion: no-preference) {
  html:has(body.twgbf-page) {
    scroll-behavior: smooth;
  }

  #twgbf-campaign .twgbf-button svg {
    transition: transform .18s ease;
  }

  #twgbf-campaign .twgbf-button:hover svg {
    transform: translateX(.16rem);
  }
}