/* Jfokus Conference Site - Vanilla CSS */

/* Google Fonts Import */
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,700');

/* CSS Variables (replacing SCSS variables) */
:root {
  --max-width: 75rem;
  --header-height: 10vw;
  --default-pad: 1.5vw;

  --grey-dark: 51, 51, 51;
  --grey-light: 204, 204, 204;
  --jf-white: 255, 255, 255;
  --jf-black: 0, 0, 0;

  --white: rgba(255, 255, 255, 1);
  --black: rgba(0, 0, 0, 1);

  --jf-success: 100, 200, 130;
  --jf-info: 50, 180, 240;
  --jf-error: 220, 50, 60;
  --jf-warning: 255, 190, 60;

  /* BLUE */
  --jf-primary-dark: 10, 10, 50;
  --jf-primary: 25, 25, 100;
  --jf-primary-light: 130, 150, 210;

  /* GREEN - unused
  --jf-secondary-dark: 0, 40, 20;
  --jf-secondary: 25, 70, 60;
  --jf-secondary-light: 130, 200, 180; */

  /* RED */
  --jf-tertiary-dark: 50, 0, 10;
  --jf-tertiary: 90, 25, 25;
  --jf-tertiary-light: 220, 150, 155;

  --jf-secondary-dark: var(--jf-tertiary-dark);
  --jf-secondary: var(--jf-tertiary);
  --jf-secondary-light: var(--jf-tertiary-light);

  /* YELLOW / GOLD */
  --jf-accent-dark: 180, 150, 70;
  --jf-accent: 220, 200, 150;
  --jf-accent-light: 250, 240, 200;

  --jf-aurora-1: 85, 31, 122;
  --jf-aurora-2: 39, 170, 225;
  --jf-aurora-3: 128, 195, 66;
}

/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
}

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}

pre {
  font-family: monospace, monospace;
  font-size: 1em;
}

a {
  background-color: transparent;
}

abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  text-decoration: underline dotted;
}

b, strong {
  font-weight: bolder;
}

code, kbd, samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

small {
  font-size: 80%;
}

sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub { bottom: -0.25em; }
sup { top: -0.5em; }

img {
  border-style: none;
}

button, input, optgroup, select, select[multiple], textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
  margin: 0;
}

button, input {
  overflow: visible;
}

button, select, select[multiple] {
  text-transform: none;
}

button, [type="button"], [type="reset"], [type="submit"] {
  appearance: button;
}

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

legend {
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal;
}

progress {
  vertical-align: baseline;
}

textarea {
  overflow: auto;
}

[type="checkbox"], [type="radio"] {
  box-sizing: border-box;
  padding: 0;
}

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

[type="search"] {
  appearance: textfield;
  outline-offset: -2px;
}

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

details {
  display: block;
}

summary {
  display: list-item;
}

template {
  display: none;
}

[hidden] {
  display: none;
}

/* Base Styles */
html {
  font-size: 100%;
}

* {
  box-sizing: border-box;
}

body {
  text-rendering: optimizeLegibility;
  padding: 0;
  margin: 0;
  font-family: Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 300;
  line-height: 1.7;
  font-size: 125%;
  color: #0a0a0a;
  background-color: var(--white);
}

html, body, .app {
  text-align: center;
}

.app {
  padding-top: 5rem; /* Account for fixed menu height */
}

a, .popup-link {
  color: rgba(var(--jf-accent-dark), 1);
  line-height: inherit;
  cursor: pointer;
  transition: all .5s;
}

a:active, a:hover, a:focus,
.popup-link:active, .popup-link:hover, .popup-link:focus {
  color: rgba(var(--jf-accent-light), 1);
}

img {
  border: 0;
  display: block;
}

figure {
  margin: 0;
}

button[disabled], html input[disabled] {
  cursor: not-allowed;
}

h1, h2, h4, h5, h6 {
  font-weight: 300;
}

h3 {
  font-weight: 500;
}

/* Layout */
section, footer {
  padding: 2.5rem 1rem 2rem;
}

section > div, footer > div {
  max-width: var(--max-width);
  margin: 0 auto;
}

/* Responsive adjustments */
@media screen and (min-width: 601px) {
  section, footer {
    padding: 3.5rem 1.5rem 3rem;
  }
}

@media screen and (min-width: 801px) {
  section, footer {
    padding: 4rem 2rem 3rem;
  }
}

/* Headers */
.header--big {
  font-weight: 300;
  font-size: 3rem;
  margin: 1rem 0 2rem;
  border-bottom: 1px solid rgba(var(--jf-accent), 1);
}

.header--big span {
  display: block;
  font-size: 2rem;
  line-height: 2.7rem;
}

.header--normal {
  font-weight: 300;
  font-size: 2.75rem;
}

.header--small {
  font-weight: 300;
  font-size: 2rem;
}

/* Buttons */
.btn--default, .btn--top-cfp, .btn--small, .btn--cta, .btn--cta-small {
  cursor: pointer;
  transition: all .2s;
  color: rgba(var(--jf-accent-dark), 1);
  font-weight: 300;
  border-radius: 3rem;
  text-transform: uppercase;
  text-decoration: none;
  text-align: center;
  border: 2px solid rgba(var(--jf-accent-dark), 1);
  line-height: inherit;
  background-color: rgba(var(--jf-primary-dark), 1);
  padding: .5rem 1rem;
  font-size: 1.5rem;
  display: inline-block;
}

.btn--square {
  background-color: rgba(var(--jf-primary), .5);
  border-width: 1px;
  border-radius: .5rem;
}

.btn--default:hover, .btn--top-cfp:hover, .btn--small:hover, 
.btn--cta:hover, .btn--cta-small:hover {
  color: rgba(var(--jf-primary-dark), 1);
  border: 2px solid rgba(var(--jf-accent-dark), 1);
  background-color: rgba(var(--jf-accent), 1);
}

.btn--default:active, .btn--top-cfp:active, .btn--small:active,
.btn--cta:active, .btn--cta-small:active {
  box-shadow: inset 0 .5px 1px rgba(var(--grey-dark), 1), inset 0 -1px 1px rgba(var(--grey-light), 1);
  color: rgba(var(--jf-primary-dark), 1);
  border: 2px solid rgba(var(--jf-accent-dark), 1);
  background-color: rgba(var(--jf-accent), 1);
}

.btn--small {
  padding: .3rem 1rem;
  font-size: 1.25rem;
  line-height: 1.15;
}

.btn--cta {
  margin: 2rem 0;
  line-height: 1.25;
}

.btn--cta-small {
  font-weight: 500;
  padding: .5rem 1rem;
  font-size: 1rem;
}

/* Hero Header */
.top-header {
  width: 100vw;
  height: 40vh;
  min-height: 175px;
  max-height: 400px;
  padding: 1rem 0;
  position: relative;
  overflow: hidden;
  background-repeat: repeat, no-repeat, no-repeat;
  background-position: left top, top center, top center;
  background-size: auto, contain, auto;
  background-attachment: fixed, scroll, scroll;
  color: var(--black);
  margin-top: 0; /* Remove any top margin since app has padding-top */
}

.top-header {
  background-image: url(../images/patterns/stars-max-5.png), linear-gradient(-90deg, rgba(var(--jf-primary-dark), 1) 0%, rgba(var(--jf-primary-dark), 1) 100%);
}

.top-header .app-logo {
  position: relative;
  z-index: 10;
  margin: 0 auto;
  width: 100%;
  height: 100%;
  background-image: url(../images/jfokus2026hero-v1.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center bottom;
}

.app-logo h1 {
  text-indent: -9999px;
  margin: 0;
}

/* Animated Background Elements */
.base {
  position: absolute;
  filter: blur(50px);
  opacity: .8;
}

.base, .base:after, .base:before {
	height: 20vh;
	width: 15vw;
	background-color: rgba(var(--jf-aurora-2), .6);
	transform: rotate(0) translate(25px) rotate(0);
	position: absolute;
	border-radius: 50%;
}

.base:after, .base:before {
	content: "";
	width: 15vw;
	display: block;
}

.one {
	left: 5vw;
	top: 0;
	z-index: 3;
	background-color: rgba(var(--jf-aurora-2), .7);
	animation: rotateRight 5s linear infinite, toggleOpacity 4s linear infinite;
}

.one:before {
	left: 10vw;
	top: 3vh;
	background-color: rgba(var(--jf-aurora-2), .6);
  animation: rotateRight 6s linear infinite, toggleOpacity 5s linear infinite;
}

.one:after {
  left: 0;
	top: 6vh;
	background-color: rgba(var(--jf-aurora-3), .8);
  animation: rotateRight 5s linear infinite, toggleOpacity 3s linear infinite;
}

.two {
	width: 100vw;
	height: 150px;
	left: 0;
	top: 1vh;
	border-radius: 0;
	background-color: rgba(var(--jf-aurora-1), .1);
	transform: rotate(0) translate(15px) rotate(0);
	animation: rotateSmall 5s linear infinite;
}

.two:before {
	left: 40vw;
	top: 4vh;
  background-color: rgba(var(--jf-aurora-2), .6);
	animation: rotateLeft 5s linear infinite, toggleOpacity 6s linear infinite;
}

.two:after {
  left: 30vw;
	top: 4vh;
	background-color: rgba(var(--jf-aurora-2), .6);
  animation: rotateRight 7s linear infinite, toggleOpacity 7s linear infinite;
}

.three {
  background-color: rgba(var(--jf-aurora-2), .6);
	top: 5.5vh;
	right: 10vw;
	transform: rotate(0) translate(25px) rotate(0);
  animation: rotateRight 7s linear infinite, toggleOpacity 5s linear infinite;
}

.three:before {
	right: 10vw;
	background-color: rgba(var(--jf-aurora-2), .6);
  animation: rotateLeft 4s linear infinite;
}

.three:after {
	right: 20vw;
	animation: rotateRight 5s linear infinite;
}

.four {
	top: 2vh;
	right: 15vw;
  background-color: rgba(var(--jf-aurora-3), .5);
	animation: rotateRight 7s linear infinite;
	transform: rotate(0) translate(25px) rotate(0);
}

.four:before {
	right: 25vw;
  background-color: rgba(var(--jf-aurora-3), .6);
	animation: rotateLeft 4s linear infinite, toggleOpacity 4s linear infinite;
}

.four:after {
	right: 50vw;
  background-color: rgba(var(--jf-aurora-3), .6);
	animation: rotateRight 5s linear infinite, toggleOpacity 5s linear infinite;
}

@keyframes toggleOpacity {
  0% { opacity: 1; }
  50% { opacity: 0.1; }
  100% { opacity: 1; }
}

@keyframes rotateRight {
  to { transform: rotate(1turn) translate(25px) rotate(-1turn); }
}

@keyframes rotateLeft {
  to { transform: rotate(-1turn) translate(25px) rotate(1turn); }
}

@keyframes rotateSmall {
  to { transform: rotate(-1turn) translate(15px) rotate(1turn); }
}

/* Top page sections */
.top-intro {
  background-image: url(../images/bg2.svg), linear-gradient(180deg, rgba(var(--jf-tertiary-dark), 1) 10%, rgba(var(--jf-tertiary), .5) 50%, rgba(var(--jf-tertiary-dark), 1) 90%);
  background-color: rgba(var(--jf-tertiary-dark), 1);
  background-repeat: repeat, repeat;
  background-attachment: scroll, scroll;
  background-size: 15rem;
  border-top: 1px solid rgba(var(--jf-accent-dark), 1);
  color: rgba(var(--jf-accent), 1);
  width: 100vw;
}

.top-intro .header--big, .top-intro .header--small {
  border: 0;
  margin-top: 0;
}

.top-register {
  background-image: url(../images/bg4.svg), linear-gradient(180deg, rgba(var(--jf-tertiary-dark), .9) 0%, rgba(var(--jf-tertiary-dark), 1) 50%, rgba(var(--jf-tertiary-dark), .9) 100%);
  background-repeat: repeat, repeat;
  background-attachment: scroll, scroll;
  background-size: 2rem;
  border-bottom: 1px solid rgba(var(--jf-accent-dark), 1);
  color: rgba(var(--jf-accent), 1);
  width: 100vw;
}

.top-cfp {
  background-image: url(../images/bg4.svg), linear-gradient(180deg, rgba(var(--jf-primary-dark), .9) 0%, rgba(var(--jf-primary-dark), 1) 50%, rgba(var(--jf-primary-dark), .9) 100%);
  background-repeat: repeat, repeat;
  background-attachment: scroll, scroll;
  background-size: 2rem;
  border-bottom: 1px solid rgba(var(--jf-accent-dark), 1);
  color: rgba(var(--jf-accent-dark), 1);
  width: 100vw;
}

.top-news {
  color: rgba(var(--jf-accent), 1);
  background-image: linear-gradient(180deg, rgba(var(--jf-primary-dark), 1) 10%, rgba(var(--jf-primary), .5) 50%, rgba(var(--jf-primary-dark), 1) 90%);
  background-color: rgba(var(--jf-primary-dark), 1);
  border: 1px solid rgba(var(--jf-accent-dark), 1);
  border-width: 1px 0;
  width: 100vw;
}

.top-news .header--big {
  margin-bottom: 2rem;
  text-align: center;
}

.top-video {
  background-image: linear-gradient(180deg, rgba(var(--jf-primary-dark), 1) 20%, rgba(var(--jf-primary), 1) 70%);
  background-repeat: repeat;
  background-attachment: scroll;
  max-height: 40rem;
  border-bottom: 1px solid rgba(var(--jf-accent-dark), 1);
  overflow: hidden;
  width: 100vw;
}

.yt-container {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 25px;
  height: 0;
  margin: 0 auto;
  max-width: 60rem;
}

.yt-player {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  max-height: 35rem;
}

/* News Section */
.news--news + .news--news::before {
  background-image: url(../images/divider.svg);
  background-repeat: no-repeat;
  background-position: 50% 0%;
  background-size: 100px;
  content: "";
  width: 100%;
  height: 20px;
  display: block;
  margin-top: -3.6rem;
  position: absolute;
  left: 0;
}

.news--news {
  max-width: calc(var(--max-width)/3*2);
  margin: 0 auto 3rem;
  padding: 1.5rem;
  background-color: rgba(var(--jf-primary), .5);
  border-radius: 8px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.news--news h2 {
  color: rgba(var(--jf-accent-light), 1);
  font-weight: 500;
  margin-bottom: 1rem;
  font-size: 1.5rem;
}

.news--news p {
  color: rgba(var(--jf-accent-light), 1);
  line-height: 1.6;
  margin-bottom: 1rem;
}

.news--news a {
  text-decoration: underline;
}

/* ===== PAGE STYLES CONSOLIDATION ===== */

/* Page Layout Base Styles */
.page-speakers,
.page-schedule,
.page-talks,
.page-articles,
.page-hero,
.page-courses,
.page-courses--course,
.page-status,
.page-register {
  background-color: rgba(var(--jf-primary-dark), 1);
  border-bottom: 1px solid rgba(var(--jf-accent-dark), 1);
  color: rgba(var(--jf-accent-light), 1);
}

/* Page-specific variations */
.page-speakers,
.page-talks {
  padding-top: 1rem;
}

.page-schedule {
  padding-top: 1rem;
}

.page-schedule > div {
  max-width: var(--max-width);
}

.page-schedule h2 span {
  font-size: 0.75em;
  font-weight: 500;
  display: block;
  line-height: 1;
}

.page-articles .articles--article {
  text-align: left;
}

.page-status {
  text-align: left;
  width: 100%;
  height: 100%;
  scroll-behavior: auto;
}

.page-register {
  border-bottom: 1px solid rgba(var(--jf-primary), 1);
  padding-top: 1rem;
}

.register--register {
  text-align: left;
}

/* Page-specific child elements */
.page-articles ul {
  list-style-type: none;
  margin: 2rem 0 0;
  padding: 0;
}

.page-hero {
  margin-top: 2rem;
  text-align: left;
  margin: 0 auto;
  width: 100%;
  height: 100%;
  text-align: left;
}

.page-hero figure img {
  width: 20vw;
  height: 20vw;
  max-height: 10rem;
  max-width: 10rem;
  object-fit: cover;
  border: 5px solid rgb(194, 187, 224);
  border-radius: 50%;
}

.page-hero p {
  line-height: 1.45;
  font-size: 1.0rem;
}

.page-hero .page-hero--description {
  max-width: var(--max-width);
  margin: 0 auto;
  text-align: left;
}

.page-hero .page-hero--description h3 {
  color: rgba(var(--jf-accent-dark), 1);
  font-weight: 500;
  margin: 1rem 0;
}

.page-hero .article-content h1,
.page-hero .article-content h2,
.page-hero .article-content h3,
.page-hero .article-content h4 {
  color: rgba(var(--jf-accent-dark), 1);
  margin: 1.5rem 0 1rem 0;
}

.page-hero .article-content p {
  margin: 1rem 0;
  line-height: 1.6;
}

.page-hero .article-content ul,
.page-hero .article-content ol {
  margin: 1rem 0;
  padding-left: 2rem;
}

.page-hero .article-content li {
  margin: 0.5rem 0;
  line-height: 1.5;
}

.page-hero .article-content a img {
  margin: 1rem 0;
  max-width: 100%;
}

.page-hero .page-hero--btn-create a {
  display: inline-block;
}

.page-hero div span {
  display: inline-block;
}

.page-hero input.text, .page-hero textarea {
  width: 100%;
  padding: 0.75rem;
  border: 1px solid rgba(var(--grey-light), 1);
  border-radius: 4px;
  font-family: inherit;
  font-size: 1rem;
  margin-top: 0.25rem;
}

.page-hero label {
  display: block;
  margin-bottom: 1rem;
  font-weight: 500;
}

.page-hero input[type="checkbox"] {
  width: auto;
  margin-right: 0.5rem;
}

.page-hero dl {
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 0.5rem 1rem;
  margin: 2rem 0;
}

.page-hero dt {
  font-weight: 600;
  color: rgba(var(--jf-accent-dark), 1);
}

.page-hero dd {
  margin: 0;
}

.page-hero .alert {
  position: fixed;
  top: 8rem;
  left: 5%;
  width: 90%;
  z-index: 1000;
  transition: opacity 1s;
}

.page-courses .courses--course {
  border-top: 1px solid rgba(var(--jf-accent-light), 1);
  padding: 1rem;
  margin-bottom: .5rem;
}

.page-courses .courses--course h2 {
  color: rgba(var(--jf-accent-dark), 1);
  margin: 0;
  text-align: left;
}

.page-courses .courses--course p {
  color: rgba(var(--jf-accent-dark), 1);
  text-align: left;
  padding-left: 6.5rem;
}

.page-courses .courses--course p span {
  font-style: italic;
}

.page-courses .courses--course .speaker-image {
  background-image: url('../images/safari-pinned-tab.svg');
  background-repeat: no-repeat;
  background-size: cover;
  height: 5rem;
  width: 5rem;
  border-radius: 50%;
  float: left;
  margin-top: 0.9rem;
}

.page-courses .courses--course a {
  display: block;
  color: rgba(var(--jf-accent-dark), 1);
  padding-left: 6.5rem;
}

.page-courses .courses--course a:hover {
  text-decoration: underline;
  color: rgba(var(--jf-accent-light), 1);
}

.page-courses .courses--article {
  text-align: left;
  padding: 0;
  margin-bottom: 2rem;
}

.page-courses--course {
  text-align: left;
}
.page-courses--course .speakers--speaker {
  flex-direction: row;
}
.page-courses--course .speakers--speaker .btn--cta {
  margin-bottom: 0;
}

.page-courses--course h1 {
  margin-top: 3rem;
}

.page-status div span {
  display: inline-block;
  font-style: italic;
}

.page-register h2 {
  margin: 4rem 0 0 0;
}

/* Page-specific media queries */
@media screen and (min-width: 601px) {
  .page-hero .alert {
    top: 8rem;
  }
}

@media screen and (max-width: 600px) {
  .page-hero dl {
    grid-template-columns: 1fr;
    gap: 0.25rem;
  }

  .page-hero dt {
    font-weight: 600;
    margin-top: 1rem;
  }

  .page-hero dd {
    margin-bottom: 0.5rem;
  }
}

/* Speakers Section */

.speakers-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 2rem;
  margin: 2rem 0;
}

.speaker {
  background: rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  padding: 1.5rem;
  text-align: center;
}

.speaker figure {
  margin: 0 0 1rem 0;
}

.speaker img {
  width: 150px;
  height: 150px;
  margin: 0 auto;
  object-fit: cover;
  border: 5px solid rgba(var(--jf-primary), 1);
  border-radius: 50%;
}

.speaker-info h3 {
  margin: 1rem 0 0.5rem 0;
  font-size: 1.5rem;
}

.speaker-info .company {
  font-style: italic;
  color: rgba(var(--grey-dark), 1);
  margin: 0.5rem 0;
}

.speaker-info .bio {
  font-size: 0.9rem;
  line-height: 1.4;
  margin: 1rem 0;
}

/* Talks Section */

.talks-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
  gap: 2rem;
  margin: 2rem 0;
}

.talk {
  background: rgba(var(--jf-white), .1);
  border-radius: 8px;
  padding: 1.5rem;
  text-align: left;
}

.talk--info {
  overflow-wrap: break-word;
}

.talk-info h3 {
  margin: 0 0 0.5rem 0;
  font-size: 1.4rem;
}

.talk-info .talk-type {
  font-style: italic;
  color: rgba(var(--jf-accent-dark), 1);
  text-transform: uppercase;
  font-size: 0.9rem;
  margin: 0.5rem 0;
}

.talk-info .speakers {
  margin: 0.5rem 0;
  font-size: 0.9rem;
}

.talk-info .speakers a {
  color: rgba(var(--jf-primary-dark), 1);
  text-decoration: none;
}

.talk-info .speakers a:hover {
  color: rgba(var(--jf-accent-dark), 1);
}

.talk-info .summary {
  font-size: 0.9rem;
  line-height: 1.4;
  margin: 1rem 0;
}

@media screen and (max-width: 600px) {
  .talks--time {
    flex-direction: column;
  }
}

/* Section footers */
.footer-partners {
  background-color: rgba(var(--jf-primary-dark), 1);
  border-bottom: 1px solid rgba(var(--jf-accent-dark), 1);
  color: var(--white);
  width: 100vw;
}

.footer-partners div > a {
  display: inline-block;
  margin: 0 1.5rem 1rem 0;
}

.footer-partners div > a > img {
  height: 30px;
  width: auto;
  display: inline;
  max-width: 120px;
}

.section-footer {
  margin-top: 2rem;
  text-align: center;
}

/* Countdown Clock */
.outer-countdown {
  color: rgba(var(--jf-primary-dark), 1);
  display: flex;
  justify-content: center;
  margin: 2rem 0;
}

.inner-countdown {
  font-size: 3rem;
  display: flex;
  gap: 2rem;
}

.cd-outer {
  margin: 0 4px;
  text-align: center;
}

.cd-outer span {
  border: 2px solid rgba(var(--jf-accent-dark), 1);
  border-radius: 0.5rem;
  padding: 0 0.5rem;
  line-height: 4rem;
  min-width: 30px;
  display: inline-block;
  text-align: center;
  font-size: 3rem;
  font-weight: 700;
  color: rgba(var(--jf-accent), 1);
  background: rgba(var(--jf-black), 0.2);
  min-width: 4rem;
}

.cd-outer aside {
  display: block;
  margin-top: 0.5rem;
  text-transform: uppercase;
  color: var(--white);
  font-size: 1.25rem;
}

@media (max-width: 768px) {
  .inner-countdown {
    font-size: 1.5rem;
  }
  .cd-outer aside {
    font-size: 0.75rem;
  }
}

@media screen and (max-width: 600px) {
  .inner-countdown {
    gap: 1rem;
  }
  .cd-outer span {
    border-radius: 0.5rem;
    line-height: 2rem;
    font-size: 2rem;
    padding: 0.5rem;
    min-width: 3rem;
  }
}

/* Footer Links */
.top-links {
  width: 100vw;
  background-image: linear-gradient(180deg, rgba(var(--jf-tertiary-dark), 1) 0%, rgba(var(--jf-black), .5) 100%);
  background-repeat: repeat;
  background-attachment: scroll;
  background-color: rgba(var(--jf-tertiary-dark), 1);
  color: rgba(var(--grey-light), 1);
}

.footer--nav {
  columns: 3 12em;
}

.footer--nav a {
  display: block;
  font-size: 1.5rem;
  color: rgba(var(--grey-light), 1);
}

.footer--nav a:hover {
  color: rgba(var(--jf-accent), 1);
}

.divider {
  margin-top: 1rem;
}

.divider span {
  display: block;
  font-size: 2rem;
  margin-bottom: 1.5rem;
}

/* Alerts */
.alert {
  border: 4px solid;
  color: rgba(var(--jf-white), 1);
  font-style: italic;
  padding: 1rem;
  margin: 4rem 0;
  background-color: rgba(var(--jf-white), .25);
  border-radius: 1rem;
}

.alert:before {
  content: '!';
  margin-right: .5rem;
  font-weight: 600;
  font-style: normal;
  width: 2rem;
  height: 2rem;
  display: inline-block;
  border-radius: 50%;
  text-align: center;
  border: 2px solid rgba(var(--jf-white), 1);
  color: var(--white);
}

.alert--modal {
  position: fixed;
  top: 3rem;
  left: 2vw;
  z-index: 1000;
  max-width: 96vw;
  overflow-wrap: break-word;
}
.alert--modal .alert {
  background-color: rgba(var(--jf-primary-dark), .5);
  backdrop-filter: blur(1rem);
}

.alert--error {
  border-color: rgba(var(--jf-error), 1);
}

.alert--error:before {
  content: '☠︎';
  background-color: rgba(var(--jf-error), .9);
}

.alert--success {
  border-color: rgba(var(--jf-success), 1);
}

.alert--success:before {
  background-color: rgba(var(--jf-success), .9);
}

.alert--info {
  border-color: rgba(var(--jf-info), 1);
}

.alert--info:before {
  content: 'i';
  background-color: rgba(var(--jf-info), .9)
}

.alert--warning {
  border-color: rgba(var(--jf-warning), 1);
}

.alert--warning:before {
  content: '⚠︎';
  background-color: rgba(var(--jf-warning), .9);
}

/* Responsive Design */
@media screen and (max-width: 800px) {
  .top-header {
    height: 20vh;
    min-height: 16rem;
  }

  .header--big {
    font-size: 2.5rem;
  }

  .header--big span {
    font-size: 1.75rem;
    line-height: 2.2rem;
  }

  .header--normal {
    font-size: 2rem;
  }

  .header--small {
    font-size: 1.75rem;
  }

  .talks-grid {
    grid-template-columns: 1fr;
  }

  .speakers-grid {
    grid-template-columns: 1fr;
  }
}

@media screen and (max-width: 600px) {
  .top-header {
    height: 10vh;
    min-height: 12.5rem;
  }

  .header--big {
    font-size: 2rem;
    line-height: 1.25;
    margin-bottom: 1rem;
  }

  .header--big span {
    font-size: 1.25rem;
    line-height: 1.8rem;
  }

  .header--normal {
    font-size: 1.75rem;
    line-height: 1.25;
  }

  .header--small {
    font-size: 1.5rem;
    line-height: 1.25;
  }

  p {
    font-size: 1.25rem;
  }

  .footer--nav {
    columns: 1 12em;
  }
}

/* Loading states and Messages */
.loading {
  font-size: 1.2rem;
  text-align: center;
  padding: 2rem;
  font-style: italic;
  color: rgba(var(--jf-accent-dark), 1);
}

/* Show/hide utilities */
@media screen and (max-width: 600px) {
  .show-for-sp {
    display: block;
  }
  .hide-for-sp {
    display: none;
  }
}

@media screen and (min-width: 601px) {
  .show-for-sp {
    display: none;
  }
  .hide-for-sp {
    display: block;
  }
}

/* Navigation Menu */
.top-menu {
  z-index: 60;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  margin: 0;
  background-image: url(../images/patterns/stars-max-25.png), linear-gradient(180deg, rgba(var(--jf-primary), 1), rgba(var(--jf-primary-dark), 1));
  background-repeat: repeat, no-repeat;
  background-position: center, top center;
  background-size: auto, contain;
  border-bottom: 1px solid rgba(var(--jf-accent-dark), 1);
  height: 5rem;
}

.top-menu .inner {
  width: 100vw;
  max-width: var(--max-width);
  display: flex;
  gap: .5rem;
  align-items: stretch;
  margin: 0 auto;
  height: 5rem;
}

.top-menu .main-logo {
  width: 16rem;
  display: block;
  padding: .25rem 1rem;
  min-width: 10rem;
}

.top-menu .app-logo {
  margin: 0;
  text-align: left;
  display: block;
  width: 100%;
  height: 100%;
  background-size: contain;
  background-image: url(../images/jfokus-simple-2026.svg);
  background-position: left bottom;
  background-repeat: no-repeat;
}

.top-menu .main-menu {
  width: 100vw;
  display: flex;
  align-items: flex-end;
  flex: 100%;
  justify-content: space-evenly;
}

.top-menu .main-menu a {
  display: block;
  color: rgba(var(--jf-accent-dark), 1);
  padding: .25rem;
  line-height: 1.25;
  text-decoration: none;
  border-bottom: 1px solid transparent;
}

.top-menu .main-menu a:last-of-type {
  border-right: none;
}

.top-menu .main-menu a:hover {
  color: var(--black);
  background-color: rgba(var(--jf-accent-dark), 1);
  text-decoration: underline;
}

.top-menu .top-menu--date {
  width: 16rem;
  display: flex;
  align-items: flex-end;
  padding: .25rem 1rem;
  color: rgba(var(--jf-accent-dark), 1);
  font-weight: 700;
  flex: auto;
  line-height: 1.23;
}

.top-menu .burger {
  position: absolute;
  z-index: 1;
  width: 30px;
  height: 100%;
  top: .5rem;
  right: 1rem;
  padding: 1rem;
  margin: 0;
  cursor: pointer;
  display: none;
}

.top-menu .burger button {
  position: absolute;
  top: 0;
  right: 0;
  opacity: 1;
  width: 30px;
  height: 30px;
  border: none;
  outline: none;
  background: none;
}

.top-menu .burger button span {
  border-radius: 2px;
  width: 100%;
  height: 3px;
  background: rgba(var(--grey-light), 1);
  position: absolute;
  left: 0;
  content: "";
  transition-duration: 0.2s;
  transition-timing-function: ease-in-out;
}

.top-menu .burger button span:nth-child(2) {
  top: 13px;
  transform: rotate(0);
}

.top-menu .burger button span:nth-child(1) {
  bottom: 3px;
  transform: rotate(0);
}

.top-menu .burger button span:nth-child(3) {
  top: 3px;
  transform: rotate(0);
}

.top-menu.inactive .burger button span:nth-child(2) {
  background: none;
}

.top-menu.inactive .burger button span:nth-child(3) {
  top: 13px;
  transform: rotate(-45deg);
}

.top-menu.inactive .burger button span:nth-child(1) {
  bottom: 14px;
  transform: rotate(45deg);
}

.top-menu.inactive .main-menu {
  opacity: 1;
  top: 3rem;
}

/* Mobile menu adjustments */
@media screen and (max-width: 960px) {
  .app {
    padding-top: 3rem;
  }

  .top-menu {
    height: 3rem;
  }

  .top-menu .inner {
    height: 3rem;
  }

  .top-menu .main-logo {
    flex: 1;
  }

  .top-menu .app-logo {
    height: 100%;
  }

  .top-menu .top-menu--date {
    font-size: 1rem;
    flex: 1;
    align-items: flex-start;
    width: auto;
  }

  .top-menu .burger {
    display: block;
  }

  .top-menu .main-menu {
    display: block;
    position: absolute;
    transition-duration: .2s;
    transition-timing-function: ease-in-out;
    opacity: 0;
    top: -100vh;
    right: 0;
    width: 100vw;
    background-color: rgba(var(--jf-primary-dark), .5);
    border-bottom: 2px solid rgba(var(--jf-accent-dark), 1);
    backdrop-filter: blur(10px);
  }
}

/* Cookie Banner */
.cookie-box {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  min-width: 320px;
  background-color: rgba(var(--grey-light), 1);
  z-index: 999;
  display: flex;
  justify-content: center;
  flex-direction: row;
  align-items: center;
  padding: 1rem;
}

.cookie-box p {
  line-height: 1.7;
  text-align: left;
  margin: 0 1rem 0 0;
}

.cookie-box p a {
  font-weight: 400;
}

.cookie-box .cookie-btn {
  line-height: 1.2;
  padding: 1rem 2rem;
  border: solid 2px var(--black);
  cursor: pointer;
  transition: all .2s;
  color: var(--black);
  font-weight: 400;
}

.cookie-box .cookie-btn:hover {
  background-color: rgba(var(--grey-dark), 1);
  color: rgba(var(--grey-light), 1);
}

/* Social accounts section */
.social-wrap {
  background-color: rgba(var(--jf-tertiary-dark), 0.25);
  border: 1px dotted rgba(var(--jf-accent-dark), 1);
  padding: 1rem;
  border-radius: 8px;
  margin: 1rem 0;
}

.social-wrap h3 {
  font-size: 1.25rem;
  font-weight: 300;
  margin: 0;
}

/* Talk submissions */
.talklist {
  padding: 1rem;
  margin-bottom: 1rem;
  background-color: rgba(var(--jf-tertiary-dark), .25);
  border-radius: 0.5rem;
  border: 4px solid rgba(var(--jf-accent-dark), 1);
  border-width: 2px 2px 2px 2rem;
  color: rgba(var(--jf-accent-light), 1);
  position: relative;
}
.talklist:before {
  content: "TALK";
  display: block;
  width: 5rem;
  height: 2rem;
  transform: rotate(-90deg);
  position: absolute;
  left: -3.5rem;
  top: calc(50% - 1.5rem);
  font-weight: bold;
  letter-spacing: .5rem;
  color: rgba(var(--jf-primary-dark), 1);
}
.talklist h3 {
  margin-top: 0;
}

.talklist b {
  display: block;
  margin: 0.5rem 0;
  font-size: 0.9rem;
}

.status-0 { color: rgba(var(--jf-info), 1);}
.status-1 { color: rgba(var(--jf-warning), 1);}
.status-2 { color: rgba(var(--jf-success), 1);}
.status-3 { color: rgba(var(--jf-error), 1);}
.status-4 { color: rgba(var(--jf-warning), 1);}

/* Article content styling */
.article-content {
  line-height: 1.6;
  margin: 1rem 0;
}

.article-content h1,
.article-content h2,
.article-content h3,
.article-content h4,
.article-content h5,
.article-content h6 {
  margin: 1.5rem 0 1rem 0;
  color: rgba(var(--jf-primary), 1);
}

.article-content p {
  margin: 1rem 0;
}

.article-content ul,
.article-content ol {
  margin: 1rem 0;
  padding-left: 2rem;
}

.article-content li {
  margin: 0.5rem 0;
}

.article-content a {
  color: rgba(var(--jf-primary), 1);
  text-decoration: underline;
}

.article-content a:hover {
  color: rgba(var(--jf-primary), 1);
}

.article-content blockquote {
  border-left: 4px solid rgba(var(--jf-primary), 1);
  padding-left: 1rem;
  margin: 1rem 0;
  font-style: italic;
}

.article-content code {
  background-color: #f5f5f5;
  padding: 0.2rem 0.4rem;
  border-radius: 3px;
  font-family: 'Courier New', monospace;
}

.article-content pre {
  background-color: #f5f5f5;
  padding: 1rem;
  border-radius: 5px;
  overflow-x: auto;
  margin: 1rem 0;
}

.article-content pre code {
  background: none;
  padding: 0;
}

/* Courses page styles */

.top-courses {
  background-color: rgba(var(--jf-primary-dark), 1);
  border-bottom: 1px solid rgba(var(--jf-accent-dark), 1);
  color: rgba(var(--jf-accent-dark), 1);
}

.top-courses .courses--course a {
  color: var(--black);
}

/* Individual course page styles */
.course-details {
  border: 1px dotted rgba(var(--jf-accent-dark), 1);
  padding: 1rem;
  background-color: rgba(var(--jf-tertiary-dark), .25);
}

.course-details p {
  margin: 0;
}

.course--info {
  padding-top: 1rem;
}

.course--info p,
.course--info li {
  color: rgba(var(--jf-accent-light), 1);
}
.course-top-info-panel {
  border: 2px solid rgba(var(--jf-accent-dark), 1);
  border-radius: 2rem;
}

.course-top-info-panel .speakers--speaker {
  padding: 1rem;
}

.course-top-info-panel .speakers--speaker .speaker--image img {
  width: 10vw;
  height: 10vw;
}

.course-top-info-panel .speakers--speaker h2 {
  font-size: 1.5rem;
}

.course-top-info-panel .speakers--speaker h2 .speaker--company {
  display: block;
  font-style: italic;
}

.status--selection .status--selection--div:last-child {
    border: 0;
    padding: 2rem 0 0;
}

.status--selection .status--selection--div span {
    width: 70%;
}
.status--selection {
  background-color: rgba(var(--jf-tertiary-dark), 0.25);
  border: 1px dotted rgba(var(--jf-accent-dark), 1);
  padding: 1rem;
}

.status--selection .status--selection-badge-company, .status--selection .status--selection-food-extra {
  border: none;
  border-radius: 4px;
  padding: 8px;
  width: 100%;
}

.status--selection .status--selection--div {
  align-items: center;
  border-bottom: 1px dotted rgba(var(--jf-accent-dark), 1);
  display: flex;
  flex-direction:row
}

.status--selection .status--selection--div.vertical {
  align-items: stretch;
  flex-direction:column
}

.status--selection .status--selection--div aside, .status--selection .status--selection--div label {
  flex-grow:1
}

.status--selection .status--selection--div .flex-box {
  align-items: left;
  display: flex;
  flex-direction:row
}

.status--selection .status--selection--div .flex-box label {
  display:none
}

.registration {
  margin: 1rem 0;
  text-align: left;
}

.registration h3 {
  color: rgba(var(--jf-accent-dark), 1);
  margin-bottom: 1rem;
  font-size: 1.5rem;
}

.registration ul {
  list-style-type: none;
  padding: 0;
}

.registration li {
  padding: 0.5rem 0;
  border-bottom: 1px solid rgba(var(--jf-accent-light), 1);
}

.invoices {
  margin: 1rem 0;
  text-align: left;
}

.status--invoices {
  list-style-type: none;
  padding: 0;
}

.status--invoices li {
  list-style: none;
  width: 100%;
  justify-content: left;
  align-content: stretch;
  border: 1px dotted rgba(var(--jf-accent-dark), 1);
  background-color: rgba(var(--jf-tertiary-dark), .25);
}

.status--invoices li:not(:first-child) {
  margin-top: 1rem;
}

.status--invoices li > span {
  padding: 1rem;
}

.status-tabs {
  display: flex;
  flex-direction: row;
}

.status-tab {
  text-align: center;
  flex: 1;
  padding: 0.5rem 0.75rem;
  background-color: rgba(var(--jf-white), .2);
  margin-right: 1px;
  color: rgba(var(--jf-accent-dark), .75);
  cursor: pointer;
  border: none;
}

.status-tab:hover {
  color: rgba(var(--jf-accent-dark), 1);
  background-color: rgba(var(--jf-tertiary-dark), .25);
}

.status-tab.active {
  color: rgba(var(--jf-accent-dark), 1);
  padding-bottom: 0.6rem;
  background-color: rgba(var(--jf-tertiary-dark), .25);
  font-weight: bold;
}
.status-tab.active:hover {
  background-color: rgba(var(--jf-tertiary-dark), .5);
}

.status-tab--area {
  padding: 1rem;
  background-color: rgba(var(--jf-tertiary-dark), .25);
}

.status-tab--div {
  flex-direction: row;
  padding: 1rem 0;
  justify-content: space-around;
}

.status-tab--div > span {
  margin-right: 2rem;
  text-align: left;
  vertical-align: text-top;
  flex: 1 1 100%;
}

@media screen and (max-width: 600px) {
  .status-tab--div {
    flex-direction: column;
    gap:1rem;
  }
  .status-tab--div > span {
    margin-right: 0;
  }
}

.status--waitlist {
  list-style-type: none;
  padding: 0;
}

.status--waitlist li {
  padding: 1rem;
  margin-bottom: 1rem;
  background-color: rgba(var(--jf-tertiary-dark), .25);
  border-radius: 0.5rem;
  border: 4px solid rgba(var(--jf-accent-dark), 1);
  border-width: 2px 2px 2px 2rem;
  color: rgba(var(--jf-accent-light), 1);
  position: relative;
}
.status--waitlist li:before {
  content: "NOTE";
  display: block;
  width: 5rem;
  height: 2rem;
  transform: rotate(-90deg);
  position: absolute;
  left: -3.5rem;
  top: 4rem;
  font-weight: bold;
  letter-spacing: .5rem;
  color: rgba(var(--jf-primary-dark), 1);
}

.status--receipts {
  list-style-type: none;
  padding: 0;
}

.status--receipts li {
  padding: 1rem;
  margin-bottom: 1rem;
  border: 2px solid rgba(var(--jf-success), 1);
  background-color: rgba(var(--jf-success), .25);
  color: rgba(var(--jf-white), 1);
  border-radius: 1rem;
}

.status-tab--div span.status-tab--notices-box {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.einvoicebox {
  padding: .5rem 1rem;
  border: 2px solid rgba(var(--jf-success), 1);
  background-color: rgba(var(--jf-success), .25);
  border-radius: 1rem;
  color: rgba(var(--jf-white), 1);
}

.payexbox {
  padding: 0.3rem;
  display: flex;
  align-items: center;
}

.payexlogo {
  width: 6rem;
  margin: 0.2rem;
}

/* Status Page Specific Styling */
.status--status {
  text-align: left;
}

.status--personal {
  margin: 1rem 0;
  text-align: left;
}

.status--personal h3 {
  color: rgba(var(--jf-accent-dark), 1);
  margin-bottom: 1rem;
  font-size: 1.5rem;
}

.status--personal .personal-details {
  line-height: 1.6;
}

.status--personal .personal-details div {
  margin-bottom: 0.5rem;
}

.status--consent {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(var(--grey-light), 1);
}

.status--consent input[type="checkbox"] {
  margin-right: 0.5rem;
}

/* Status page selection needs clean up */
.status--selection h3 {
  margin: 1rem 0 0;
}

.status--selection h3:first-child {
    margin-top:0
}

.status--selection aside div {
    color:#000
}

.status--selection .status--selection--div {
    border-bottom: 1px solid rgba(var(--grey-dark), 1);
    padding: 1rem 0;
}

/* Ensure empty containers don't create visual space */
#invoices-container:empty,
#reservations-container:empty,
#credits-container:empty,
#qr-container:empty,
#online-access-container:empty,
#referrals-container:empty,
#registration-info-selection:empty {
  display: none;
}

/* Policy content styling */
#policy-container {
  line-height: 1.6;
  margin: 1rem 0;
  text-align: left;
}

#policy-container h1,
#policy-container h2,
#policy-container h3,
#policy-container h4,
#policy-container h5,
#policy-container h6 {
  margin: 1.5rem 0 1rem 0;
  color: rgba(var(--jf-accent-dark), 1);
}

#policy-container p {
  margin: 1rem 0;
}

#policy-container ul,
#policy-container ol {
  margin: 1rem 0;
  padding-left: 2rem;
}

#policy-container li {
  margin: 0.5rem 0;
  line-height: 1.5;
}

#policy-container a {
  color: rgba(var(--jf-primary), 1);
  text-decoration: underline;
}

#policy-container a:hover {
  color: rgba(var(--jf-primary), 1);
}

#policy-container blockquote {
  border-left: 4px solid rgba(var(--jf-primary), 1);
  padding-left: 1rem;
  margin: 1rem 0;
  font-style: italic;
}

#policy-container strong {
  font-weight: bold;
  color: rgba(var(--jf-accent-dark), 1);
}

#policy-container em {
  font-style: italic;
}

/* Speakers Page Styles */
.speakers--speaker {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 4rem 2rem;
  text-align: left;
  border-bottom: 1px solid rgba(var(--jf-accent), 1);
}

.speakers--speaker:last-child {
  border: 0;
}

.speaker--bio {
  display: flex;
  flex-direction: row;
}

.speaker--bio h2 {
  font-weight: 300;
  font-size: 1.5rem;
}

.speaker--image {
  transition: all .5s;
  margin: 0 2rem 0 0;
}

.speaker--image:hover {
  transform: scale(1.05);
}

.speaker--image figure {
  padding-top: 1rem;
}

.speaker--image img {
  width: 20vw;
  height: 20vw;
  max-height: 8rem;
  max-width: 8rem;
  margin: 0 auto;
  object-fit: cover;
  border: 5px solid rgba(var(--jf-accent-dark), 1);
  border-radius: 50%;
}

.speaker--info {
  width: 70%;
}

.speaker--company {
  font-style: italic;
  display: block;
}

.speaker--socials {
  margin: 0.5rem 0;
  display: flex;
  align-items: center;
}

@media screen and (max-width: 600px) {
  .speaker--info {
    text-align: center;
  }
  .speaker--company {
    display: inline;
  }
  .talks--speakers .speaker--company:before {
    content: "";
  }
  .speaker--company:before {
    content: ", ";
  }
  .speaker--bio,
  .speaker--socials {
    justify-content: center;
  }
}

.speaker--socials a {
  margin-right: 1rem;
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  text-indent: -9999px;
  background-size: contain;
}
.social-icon-linkedin {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23b49646"><path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 01-2.063-2.065 2.064 2.064 0 112.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/></svg>');
}
.social-icon-x {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23b49646"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"/></svg>');
}
.social-icon-bsky {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23b49646"><path d="M12 10.8c-1.087-2.114-4.046-6.053-6.798-7.995C2.566.944 1.561 1.266.902 1.565.139 1.908 0 3.08 0 3.768c0 .69.378 5.65.624 6.479.815 2.736 3.713 3.66 6.383 3.364.136-.02.275-.039.415-.056-.138.022-.276.04-.415.056-2.67-.297-5.568.628-6.383 3.364C.378 17.703 0 22.663 0 23.353c0 .688.139 1.86.902 2.203.659.299 1.664.621 4.3-1.24 2.752-1.942 5.711-5.881 6.798-7.995 1.087 2.114 4.046 6.053 6.798 7.995 2.636 1.861 3.641 1.539 4.3 1.24.763-.343.902-1.515.902-2.203 0-.69-.378-5.65-.624-6.479-.815-2.736-3.713-3.66-6.383-3.364-.139.016-.277.034-.415.056.138-.017.276-.036.415-.056 2.67.297 5.568-.628 6.383-3.364.246-.829.624-5.789.624-6.479 0-.688-.139-1.86-.902-2.203-.659-.299-1.664-.621-4.3 1.24-2.752 1.942-5.711 5.881-6.798 7.995z"/></svg>');
}
.social-icon-mastodont {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23b49646"><path d="M23.268 5.313c-.35-2.578-2.617-4.61-5.304-5.004C17.51.242 15.792 0 11.813 0h-.03c-3.98 0-4.835.242-5.288.309C3.882.692 1.496 2.518.917 5.127.64 6.412.61 7.837.661 9.143c.074 1.874.088 3.745.26 5.611.118 1.24.325 2.47.62 3.68.55 2.237 2.777 4.098 4.96 4.857 2.336.792 4.849.923 7.256.38.265-.061.527-.132.786-.213.585-.184 1.27-.39 1.774-.753a.057.057 0 0 0 .023-.043v-1.809a.052.052 0 0 0-.02-.041.053.053 0 0 0-.046-.01 20.282 20.282 0 0 1-4.709.545c-2.73 0-3.463-1.284-3.674-1.818a5.593 5.593 0 0 1-.319-1.433.053.053 0 0 1 .066-.054c1.517.363 3.072.546 4.632.546.376 0 .75 0 1.125-.01 1.57-.044 3.224-.124 4.768-.422.038-.008.077-.015.11-.024 2.435-.464 4.753-1.92 4.989-5.604.008-.145.03-1.52.03-1.67.002-.512.167-3.63-.024-5.545zm-3.748 9.195h-2.561V8.29c0-1.309-.55-1.976-1.67-1.976-1.23 0-1.846.79-1.846 2.35v3.403h-2.546V8.663c0-1.56-.617-2.35-1.848-2.35-1.112 0-1.668.668-1.67 1.977v6.218H4.822V8.102c0-1.31.337-2.35 1.011-3.12.696-.77 1.608-1.164 2.74-1.164 1.311 0 2.302.5 2.962 1.498l.638 1.06.638-1.06c.66-.999 1.65-1.498 2.96-1.498 1.13 0 2.043.395 2.74 1.164.675.77 1.012 1.81 1.012 3.12z"/></svg>');
}
.social-icon-linkedin:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23faf0c8"><path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 01-2.063-2.065 2.064 2.064 0 112.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/></svg>');
}
.social-icon-x:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23faf0c8"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"/></svg>');
}
.social-icon-bsky:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23faf0c8"><path d="M12 10.8c-1.087-2.114-4.046-6.053-6.798-7.995C2.566.944 1.561 1.266.902 1.565.139 1.908 0 3.08 0 3.768c0 .69.378 5.65.624 6.479.815 2.736 3.713 3.66 6.383 3.364.136-.02.275-.039.415-.056-.138.022-.276.04-.415.056-2.67-.297-5.568.628-6.383 3.364C.378 17.703 0 22.663 0 23.353c0 .688.139 1.86.902 2.203.659.299 1.664.621 4.3-1.24 2.752-1.942 5.711-5.881 6.798-7.995 1.087 2.114 4.046 6.053 6.798 7.995 2.636 1.861 3.641 1.539 4.3 1.24.763-.343.902-1.515.902-2.203 0-.69-.378-5.65-.624-6.479-.815-2.736-3.713-3.66-6.383-3.364-.139.016-.277.034-.415.056.138-.017.276-.036.415-.056 2.67.297 5.568-.628 6.383-3.364.246-.829.624-5.789.624-6.479 0-.688-.139-1.86-.902-2.203-.659-.299-1.664-.621-4.3 1.24-2.752 1.942-5.711 5.881-6.798 7.995z"/></svg>');
}
.social-icon-mastodont:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23b49646"><path d="M23.268 5.313c-.35-2.578-2.617-4.61-5.304-5.004C17.51.242 15.792 0 11.813 0h-.03c-3.98 0-4.835.242-5.288.309C3.882.692 1.496 2.518.917 5.127.64 6.412.61 7.837.661 9.143c.074 1.874.088 3.745.26 5.611.118 1.24.325 2.47.62 3.68.55 2.237 2.777 4.098 4.96 4.857 2.336.792 4.849.923 7.256.38.265-.061.527-.132.786-.213.585-.184 1.27-.39 1.774-.753a.057.057 0 0 0 .023-.043v-1.809a.052.052 0 0 0-.02-.041.053.053 0 0 0-.046-.01 20.282 20.282 0 0 1-4.709.545c-2.73 0-3.463-1.284-3.674-1.818a5.593 5.593 0 0 1-.319-1.433.053.053 0 0 1 .066-.054c1.517.363 3.072.546 4.632.546.376 0 .75 0 1.125-.01 1.57-.044 3.224-.124 4.768-.422.038-.008.077-.015.11-.024 2.435-.464 4.753-1.92 4.989-5.604.008-.145.03-1.52.03-1.67.002-.512.167-3.63-.024-5.545zm-3.748 9.195h-2.561V8.29c0-1.309-.55-1.976-1.67-1.976-1.23 0-1.846.79-1.846 2.35v3.403h-2.546V8.663c0-1.56-.617-2.35-1.848-2.35-1.112 0-1.668.668-1.67 1.977v6.218H4.822V8.102c0-1.31.337-2.35 1.011-3.12.696-.77 1.608-1.164 2.74-1.164 1.311 0 2.302.5 2.962 1.498l.638 1.06.638-1.06c.66-.999 1.65-1.498 2.96-1.498 1.13 0 2.043.395 2.74 1.164.675.77 1.012 1.81 1.012 3.12z"/></svg>');
}

/* Resource Icons */
.resource-icon-share {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50" fill="%23faf0c8"><path d="M40,17.5c-1.8287,0-3.5032.6561-4.8047,1.7436l-17.7147-8.8574c.0066-.1288.0195-.2559.0195-.3862,0-4.1422-3.3578-7.5-7.5-7.5s-7.5,3.3578-7.5,7.5,3.3578,7.5,7.5,7.5c1.8287,0,3.5032-.6561,4.8047-1.7436l17.7147,8.8574c-.0066.1288-.0195.2559-.0195.3862s.0129.2574.0195.3862l-17.715,8.8572c-1.3015-1.0874-2.9759-1.7434-4.8045-1.7434-4.1422,0-7.5,3.3578-7.5,7.5s3.3578,7.5,7.5,7.5,7.5-3.3578,7.5-7.5c0-.1302-.0129-.2572-.0195-.3859l17.7148-8.8577c1.3015,1.0875,2.976,1.7435,4.8046,1.7435,4.1422,0,7.5-3.3578,7.5-7.5s-3.3578-7.5-7.5-7.5Z"/></svg>');
  background-size: 24px 24px;
  background-repeat: no-repeat;
  background-position: center;
  width: 28px;
  height: 28px;
  display: inline-block;
}
.resource-icon-share:hover {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50" fill="%23b49646"><path d="M40,17.5c-1.8287,0-3.5032.6561-4.8047,1.7436l-17.7147-8.8574c.0066-.1288.0195-.2559.0195-.3862,0-4.1422-3.3578-7.5-7.5-7.5s-7.5,3.3578-7.5,7.5,3.3578,7.5,7.5,7.5c1.8287,0,3.5032-.6561,4.8047-1.7436l17.7147,8.8574c-.0066.1288-.0195.2559-.0195.3862s.0129.2574.0195.3862l-17.715,8.8572c-1.3015-1.0874-2.9759-1.7434-4.8045-1.7434-4.1422,0-7.5,3.3578-7.5,7.5s3.3578,7.5,7.5,7.5,7.5-3.3578,7.5-7.5c0-.1302-.0129-.2572-.0195-.3859l17.7148-8.8577c1.3015,1.0875,2.976,1.7435,4.8046,1.7435,4.1422,0,7.5-3.3578,7.5-7.5s-3.3578-7.5-7.5-7.5Z"/></svg>');
}
.resource-icon-slides {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23b49646"><path d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-5 14H7v-2h7v2zm3-4H7v-2h10v2zm0-4H7V7h10v2z"/></svg>');
  background-size: 24px 24px;
  background-repeat: no-repeat;
  background-position: center;
  width: 28px;
  height: 28px;
  display: inline-block;
}

.resource-icon-pdf {
  background-image: url('data:image/svg+xml;utf8,<svg viewBox="-4 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg"><g><path fill="%23b49646" d="M25.6686 26.0962C25.1812 26.2401 24.4656 26.2563 23.6984 26.145C22.875 26.0256 22.0351 25.7739 21.2096 25.403C22.6817 25.1888 23.8237 25.2548 24.8005 25.6009C25.0319 25.6829 25.412 25.9021 25.6686 26.0962ZM17.4552 24.7459C17.3953 24.7622 17.3363 24.7776 17.2776 24.7939C16.8815 24.9017 16.4961 25.0069 16.1247 25.1005L15.6239 25.2275C14.6165 25.4824 13.5865 25.7428 12.5692 26.0529C12.9558 25.1206 13.315 24.178 13.6667 23.2564C13.9271 22.5742 14.193 21.8773 14.468 21.1894C14.6075 21.4198 14.7531 21.6503 14.9046 21.8814C15.5948 22.9326 16.4624 23.9045 17.4552 24.7459ZM14.8927 14.2326C14.958 15.383 14.7098 16.4897 14.3457 17.5514C13.8972 16.2386 13.6882 14.7889 14.2489 13.6185C14.3927 13.3185 14.5105 13.1581 14.5869 13.0744C14.7049 13.2566 14.8601 13.6642 14.8927 14.2326ZM9.63347 28.8054C9.38148 29.2562 9.12426 29.6782 8.86063 30.0767C8.22442 31.0355 7.18393 32.0621 6.64941 32.0621C6.59681 32.0621 6.53316 32.0536 6.44015 31.9554C6.38028 31.8926 6.37069 31.8476 6.37359 31.7862C6.39161 31.4337 6.85867 30.8059 7.53527 30.2238C8.14939 29.6957 8.84352 29.2262 9.63347 28.8054ZM27.3706 26.1461C27.2889 24.9719 25.3123 24.2186 25.2928 24.2116C24.5287 23.9407 23.6986 23.8091 22.7552 23.8091C21.7453 23.8091 20.6565 23.9552 19.2582 24.2819C18.014 23.3999 16.9392 22.2957 16.1362 21.0733C15.7816 20.5332 15.4628 19.9941 15.1849 19.4675C15.8633 17.8454 16.4742 16.1013 16.3632 14.1479C16.2737 12.5816 15.5674 11.5295 14.6069 11.5295C13.948 11.5295 13.3807 12.0175 12.9194 12.9813C12.0965 14.6987 12.3128 16.8962 13.562 19.5184C13.1121 20.5751 12.6941 21.6706 12.2895 22.7311C11.7861 24.0498 11.2674 25.4103 10.6828 26.7045C9.04334 27.3532 7.69648 28.1399 6.57402 29.1057C5.8387 29.7373 4.95223 30.7028 4.90163 31.7107C4.87693 32.1854 5.03969 32.6207 5.37044 32.9695C5.72183 33.3398 6.16329 33.5348 6.6487 33.5354C8.25189 33.5354 9.79489 31.3327 10.0876 30.8909C10.6767 30.0029 11.2281 29.0124 11.7684 27.8699C13.1292 27.3781 14.5794 27.011 15.985 26.6562L16.4884 26.5283C16.8668 26.4321 17.2601 26.3257 17.6635 26.2153C18.0904 26.0999 18.5296 25.9802 18.976 25.8665C20.4193 26.7844 21.9714 27.3831 23.4851 27.6028C24.7601 27.7883 25.8924 27.6807 26.6589 27.2811C27.3486 26.9219 27.3866 26.3676 27.3706 26.1461ZM30.4755 36.2428C30.4755 38.3932 28.5802 38.5258 28.1978 38.5301H3.74486C1.60224 38.5301 1.47322 36.6218 1.46913 36.2428L1.46884 3.75642C1.46884 1.6039 3.36763 1.4734 3.74457 1.46908H20.263L20.2718 1.4778V7.92396C20.2718 9.21763 21.0539 11.6669 24.0158 11.6669H30.4203L30.4753 11.7218L30.4755 36.2428ZM28.9572 10.1976H24.0169C21.8749 10.1976 21.7453 8.29969 21.7424 7.92417V2.95307L28.9572 10.1976ZM31.9447 36.2428V11.1157L21.7424 0.871022V0.823357H21.6936L20.8742 0H3.74491C2.44954 0 0 0.785336 0 3.75711V36.2435C0 37.5427 0.782956 40 3.74491 40H28.2001C29.4952 39.9997 31.9447 39.2143 31.9447 36.2428Z"></path></g></svg>');
  background-size: 24px 24px;
  background-repeat: no-repeat;
  background-position: center;
  width: 28px;
  height: 28px;
  display: inline-block;
}

.resource-icon-video {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23b49646"><path d="M21.582 6.186c-.23-1.12-1.204-2.07-2.582-2.236C17.25 3.75 12 3.75 12 3.75s-5.25 0-7 .2c-1.378.166-2.352 1.116-2.582 2.236C2.25 7.936 2.25 12 2.25 12s0 4.064.168 5.814c.23 1.12 1.204 2.07 2.582 2.236 1.75.2 7 .2 7 .2s5.25 0 7-.2c1.378-.166 2.352-1.116 2.582-2.236C21.75 16.064 21.75 12 21.75 12s0-4.064-.168-5.814zM9.75 15.568V8.432L15.5 12l-5.75 3.568z"/></svg>');
  background-size: 24px 24px;
  background-repeat: no-repeat;
  background-position: center;
  width: 28px;
  height: 28px;
  display: inline-block;
}

.resource-icon-source {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23b49646"><path d="M14.6 16.6l4.6-4.6-4.6-4.6L16 6l6 6-6 6-1.4-1.4zm-5.2 0L4.8 12l4.6-4.6L8 6l-6 6 6 6 1.4-1.4z"/></svg>');
  background-size: 24px 24px;
  background-repeat: no-repeat;
  background-position: center;
  width: 28px;
  height: 28px;
  display: inline-block;
}

.share-button {
  display: inline;
  cursor: pointer;
  padding: .5rem 1rem .5rem 2.75rem;
  background-position: .75rem;
  border: 2px solid rgba(var(--jf-accent-dark), 1);
  color: rgba(var(--jf-accent-light), 1);
  border-radius: 2rem;
  font-size: .9rem;
  height: auto;
  width: auto;
  font-style: normal;
  line-height: normal;
  transition: all .5s;
}
.share-button:hover {
  color: rgba(var(--jf-accent-dark), 1);
}

.speaker--talks {
  margin: 1rem 0 2rem;
}

.talks--speakers {
  display: flex;
  align-items: center;
  margin: 2rem 0 0;
  gap: 0.75rem;
  flex-direction: row;
  flex-wrap: wrap;
}

.talks--speaker {
  flex: 0 1 calc(50% - .5rem);
  flex-direction: row;
  display: flex;
}

.talks--speaker div,
.speaker--talks div {
  margin-bottom: 1rem;
}

.talks--speaker em,
.speaker--talks em {
  color: rgba(var(--jf-accent-dark), 1);
  font-style: normal;
  font-weight: 500;
  text-transform: uppercase;
  font-size: 0.9rem;
}

.talks--speaker a,
.speaker--talks a {
  color: rgba(var(--jf-accent-light), 1);
  text-decoration: none;
  margin-left: 0.5rem;
}

.talks--speaker a:hover,
.speaker--talks a:hover {
  text-decoration: underline;
}

/* Talks Page Styles */
.talks--talk {
  padding: 0 0 2rem;
  margin: 0 auto;
  text-align: left;
  border-bottom: 1px solid rgba(var(--jf-accent-light), 1);
}
.talks--toggle {
  border: 0;
  background-color: transparent;
  color: rgba(var(--jf-accent-dark), 1);
  font-weight: bold;
  padding: 0;
  margin: 0;
}
.talks--toggle:hover {
  color: rgba(var(--jf-accent-light), 1);
}

.talks--slides {
  display: inline-block;
  margin: 0 0.5rem;
}

.talks--time {
  font-style: italic;
  color: rgba(var(--jf-accent-dark), 1);
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  gap: 1rem;
}

.talks--talk .speakers--speaker {
  justify-content: left;
  padding: 0.5rem 0 0;
  border: 0;
}

.talks--talk h2 {
  color: rgba(var(--jf-accent-dark), 1);
  margin-bottom: 1rem;
  line-height: 1.4;
}

/* Schedule Page Styles */
.schedule--day {
  padding-left: 0;
  padding-right: 0;
}
.schedule--day > div {
  margin: 0rem 0 6rem;
}

.schedule--day h2 {
  display: block;
  background-color: rgba(var(--jf-accent-dark), 1);
  color: rgba(var(--jf-primary-dark), 1);
  border-radius: 1rem;
  text-align: left;
  padding: 1rem 2rem;
  margin-top: 0;
  font-weight: bold;
  text-transform: uppercase;
}

.schedule--time {
  padding: 0;
}

.schedule--time > h3 {
  margin: 2rem 0 1rem;
  text-align: left;
}

.schedule--linklist {
  margin-bottom: 2rem;
}

.schedule--linklist a {
  display: block;
  text-decoration: none;
  padding: 0.5rem 0;
  font-weight: 500;
}

.schedule--linklist a:hover {
  text-decoration: underline;
}

.schedule--wrap {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  max-width: 100%;
  text-align: left;
}

.schedule--slot {
  background-color: rgba(var(--jf-primary-light), .1);
  font-size: 75%;
  padding: 1rem;
  border: 1px solid rgba(var(--jf-accent-dark), 1);
  flex-grow: 1;
  flex-basis: 0;
  line-height: 1.2;
}

.schedule--slot:first-child {
  border-top-left-radius: 1rem;
  border-bottom-left-radius: 1rem;
}
.schedule--slot:last-child {
  border-top-right-radius: 1rem;
  border-bottom-right-radius: 1rem;
}
.schedule--slot:not(:first-child) {
  border-left: 0;
}

.schedule--slot .talks--slides {
  display: inline-block;
  margin: 0 0.5rem 0 0;
}

.schedule--slot h4 {
  font-size: 100%;
  margin: 1rem 0;
}

.slot--room {
  color: rgba(var(--jf-primary-dark), 1);
  padding: .25rem 1rem;
  background-color: rgba(var(--jf-accent), 1);
  border-radius: 2rem;
  font-size: .9rem;
  font-style: normal;
  font-weight: 500;
  display: inline-block;
}

.schedule--slot h4 > a {
  line-height: 1.5;
}

.schedule--slot a {
  text-decoration: none;
  color: rgba(var(--jf-accent-light), 1);
}

.schedule--slot a:hover {
  color: rgba(var(--jf-accent-dark), 1);
}

.schedule--slot .slot--nontalk {
  font-weight: bold;
  padding: 0 1rem;
  text-transform: capitalize;
}

.schedule--slot .slot--nontalk-cnt {
  color: rgba(var(--jf-accent-light), 1);
  font-weight: bold;
  padding: 0 1rem;
  text-transform: capitalize;
  text-align: center;
}

/* Responsive Design for Schedule */
@media (max-width: 768px) {
  .schedule--wrap {
    display: block;
  }
  .schedule--slot {
    width: 100%;
  }
}

@media (max-width: 960px) {
  .schedule--wrap {
    display: flex;
    flex-direction: column;
    align-items: left;
    max-width: 100%;
  }

  .schedule--slot {
    font-size: 110%;
  }

  .schedule--slot:not(:first-child) {
    border: 1px solid rgba(var(--jf-accent-dark), 1);
    border-top: none;
  }
  .schedule--slot:first-child {
    border-bottom-left-radius: 0;
  }
  .schedule--slot:last-child {
    border-top-right-radius: 0;
  }
  .schedule--slot:first-child {
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
  }
  .schedule--slot:last-child {
    border-bottom-right-radius: 1rem;
    border-bottom-left-radius: 1rem;
  }
}

/* Speaker Detail Styles */
.speaker-detail {
  padding: 2rem var(--default-pad);
  max-width: var(--max-width);
  margin: 0 auto;
}

.speaker-detail-content {
  background: var(--white);
  border-radius: 12px;
  padding: 2rem;
}

.speaker-header {
  display: flex;
  gap: 2rem;
  margin-bottom: 2rem;
}

.speaker-image-large img {
  width: 200px;
  height: 200px;
  border-radius: 50%;
  object-fit: cover;
  border: 4px solid rgba(var(--jf-primary-light), 1);
}

.speaker-meta h1 {
  color: rgba(var(--jf-primary), 1);
  font-size: 2.5rem;
  margin: 0 0 0.5rem 0;
}

.speaker-meta .company {
  color: rgba(var(--jf-primary), 1);
  font-size: 1.3rem;
  font-weight: 500;
  margin: 0 0 1rem 0;
}

.speaker-social {
  display: flex;
  gap: 1rem;
}

.speaker-social a {
  color: rgba(var(--jf-primary), 1);
  text-decoration: none;
  padding: 0.5rem 1rem;
  background: rgba(var(--jf-primary-light), 1);
  border-radius: 20px;
  font-size: 0.9rem;
  transition: background-color 0.2s ease;
}

.speaker-social a:hover {
  background: rgba(var(--jf-primary), 1);
  color: var(--white);
}

.speaker-bio h3,
.speaker-presentations h3 {
  color: rgba(var(--jf-primary), 1);
  font-size: 1.5rem;
  margin: 2rem 0 1rem 0;
  border-bottom: 2px solid rgba(var(--jf-primary-light), 1);
  padding-bottom: 0.5rem;
}

.speaker-bio p {
  line-height: 1.7;
  color: rgba(var(--grey-dark), 1);
}

.presentations-list {
  display: grid;
  gap: 1rem;
  margin: 1rem 0;
}

.presentation-card {
  background: rgba(var(--jf-primary-light), 1);
  border-radius: 8px;
  padding: 1.5rem;
  border-left: 4px solid rgba(var(--jf-primary), 1);
}

.presentation-card h4 {
  margin: 0 0 0.5rem 0;
  font-size: 1.2rem;
}

.presentation-card h4 a {
  color: rgba(var(--jf-primary), 1);
  text-decoration: none;
}

.presentation-card h4 a:hover {
  text-decoration: underline;
}

.presentation-type {
  color: rgba(var(--jf-primary), 1);
  font-weight: 500;
  font-size: 0.9rem;
  margin: 0 0 0.5rem 0;
  text-transform: uppercase;
}

.presentation-summary {
  color: rgba(var(--grey-dark), 1);
  line-height: 1.5;
  margin: 0;
}

.speaker-navigation {
  margin-top: 2rem;
  text-align: center;
}

/* Responsive Design */
@media (max-width: 768px) {
  .speakers-grid {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }

  .speaker-header {
    flex-direction: column;
    text-align: center;
    gap: 1rem;
  }

  .speaker-image-large img {
    width: 150px;
    height: 150px;
  }

  .speaker-meta h1 {
    font-size: 2rem;
  }

  .speaker-social {
    justify-content: center;
  }
}

/* Form Styles */
form > div {
  margin: 1em 0;
  display: flex;
  flex-direction: row;
  align-items: center;
}

.social-wrap p {
  margin: 0.5rem 0;
}

form > div.vertical {
  flex-direction: column;
  align-items: stretch;
}

form > div label {
  flex-grow: 1;
}

/* Gauge Styles */
.registration-status {
  margin-bottom: 2rem;
  text-align: center;
}

.gauge--outer {
  border-radius: 2rem;
  height: 3rem;
  margin: 0 auto 1rem;
  max-width: calc(var(--max-width)/2);
  overflow: hidden;
  width: 100%;
  position: relative;
  background-color: rgba(var(--jf-black), .2);
  border: 3px solid var(--black);
}

.gauge--inner {
  background-color: rgba(var(--jf-success));
  height: 100%;
  transition: all 2s ease;
  width: 0%;
  text-align: left;
  position: absolute;
  left: 0;
}
  
.gauge--inner.gauge-text--hot {
  background-color: rgba(var(--jf-error));
}

.gauge--inner.gauge-text--medium {
  background-color: rgba(var(--jf-warning));
}

/* Country Selector Styles */
.selector {
  color: black;
}

.selector > div {
  border-radius: 0.5rem;
  border: none;
}

/* Discount Section */
.register--discount {
  border: 1px solid var(--white);
  padding: 0 1rem;
  margin-bottom: 3rem;
}

.register--discount span {
  font-weight: 500;
}

/* Input Styles */
input[type="text"],
input[type="tel"],
input[type="email"],
input,
textarea,
select,
select[multiple] {
  height: 2rem;
  padding: 1.5rem 0.5rem;
  border-radius: 0.5rem;
  border: none;
}
input[type="text"],
input[type="tel"],
input[type="email"],
textarea,
select,
select[multiple] {
  display: block;
}
input[type="text"]:hover,
input[type="tel"]:hover,
input[type="email"]:hover,
input:hover,
textarea:hover,
select:hover,
select[multiple]:hover {
  background-color: rgba(var(--jf-white), 1)
}

textarea {
  height: 300px;
  resize: vertical;
}

select,
select[multiple] {
  height: auto;
  padding: 0.4rem 0.5rem;
}

select[multiple] option {
  white-space: normal;
}

input[type="text"],
input[type="tel"],
input[type="email"],
input,
textarea,
select,
select[multiple],
select[multiple]:active,
select[multiple]:focus,
select[multiple]:focus-visible,
select[multiple]:focus-within {
  background-color: rgba(var(--jf-white), .9);
}

select[multiple] option:checked,
select[multiple]:active option:checked,
select[multiple]:target option:checked,
select[multiple]:focus-visible option:checked,
select[multiple]:focus-within option:checked,
select[multiple]:focus option:checked {
  background-color: rgba(var(--jf-accent-dark), .8) !important;
}

/* Flex Box Layout */
.flex-box {
  display: flex;
  flex-direction: row;
}

.flex-box label {
  display: none;
}

input.text {
  width: 100%;
}

input.pcode {
  margin-right: 1rem;
  width: 10rem;
}

input.city {
  flex-grow: 2;
}

/* Checkbox and Radio Styles */
input.check,
input.radio {
  margin-right: 1rem;
  border: 4px solid #ccc;
  border-top-color: #bbb;
  border-left-color: #bbb;
  background: #fff;
  width: 1.2em;
  height: 1.2em;
  border-radius: 50%;
  flex-shrink: 0;
}

/* Mobile Responsive */
@media (max-width: 768px) {
  .hom {
    display: none;
  }

  .flex-box {
    display: block;
  }

  .flex-box label {
    margin-top: 1em;
    display: block;
  }

  input.pcode {
    width: 100%;
    margin-right: 0;
    margin-bottom: 1rem;
  }

  input.city {
    width: 100%;
  }
}

.country-selector {
  position: relative;
  width: 100%;
}

.country-dropdown {
  width: 100%;
  height: auto;
  border: none;
  background-color: #fff;
  font-size: inherit;
  appearance: none;
  border-radius: .5em;
  padding: .4em .5em;
  margin: 0;
  line-height: inherit;
}

.country-dropdown:hover {
  background-color: rgba(255, 255, 255, 0.9);
}

.country-dropdown:focus {
  outline: none;
  box-shadow: 0 0 0 2px rgba(var(--jf-primary), 1);
}

/* ===== INTERACTIVE SCHEDULE STYLES (Personal Schedule Features) ===== */

.status--schedule {
  margin-top: 2rem;
}

.status--schedule .schedule--day {
  padding: 0;
}

.status--schedule .schedule--day:first-child > div {
  display: block;
}

.status--schedule .schedule--day > div.hide {
  display: none;
}

.status--schedule .schedule--day > div.show {
  display: block;
}

.status--schedule .schedule--day h2,
.status--schedule .schedule--day h3 {
  padding: 0 1rem;
}

/* Collapsible day headers */
.status--schedule .schedule--day > h2.schedule--showhide {
  cursor: pointer;
  position: relative;
}

.status--schedule .schedule--day > h2.schedule--showhide::after {
  content: '';
  position: absolute;
  right: .5rem;
  top: .5rem;
  width: 0; 
  height: 0; 
  border-top: 1rem solid transparent;
  border-bottom: 1rem solid transparent;
  border-left: 1rem solid rgba(var(--jf-primary-dark), 1);
  border-right: 1rem solid transparent;
}

.status--schedule .schedule--day > h2.schedule--showhide.active::after {
  right: 1rem;
  top: 1rem;
  border-left: 1rem solid transparent;
  border-top: 1rem solid rgba(var(--jf-primary-dark), 1);
}

.status--schedule .schedule--day > h2.schedule--showhide:hover::after {
  text-decoration: underline;
}

.status--schedule .schedule--day h4,
.status--schedule .schedule--day p {
  font-size: 1rem;
  margin: 0 0 1rem;
  line-height: 1.4;
}
.status--schedule .schedule--day h4.slot--room {
  padding: .25rem .5rem;
  height: 2rem;
  line-height: 1.5rem;
}

/* Interactive schedule slots */
.status--schedule .schedule--slot {
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.speaker-info-btn {
  transition: all 0.2s ease;
}
.speaker-info-btn:hover {
  color: rgba(var(--jf-accent-dark), 1);
}
/* Stars for slot selection */
.status--schedule .schedule-slot-clickable {
  position: absolute;
  right: 1rem;
  color: #ccc;
  margin: 0;
  padding: .1rem;
  background-color: rgba(var(--grey-light), .75);
  height: 2rem;
  width: 2rem;
  border: none;
  border-radius: 1rem;
}
.status--schedule .schedule-slot-clickable:hover,
.status--schedule .slot-selected .schedule-slot-clickable {
  background-color: rgba(var(--jf-accent-dark), 1);
}
.status--schedule .schedule-slot-clickable::before,
.status--schedule .slot-selected .schedule-slot-clickable::before {
  font-size: 1.5rem;
  content: '★';
  color: rgba(var(--jf-primary-dark), 1);
}
.status--schedule .schedule-slot-clickable:hover::before {
  color: rgba(var(--jf-primary-dark), 1);
  content: '★';
}

/* Hover effects */
.status--schedule .schedule--slot:hover {
  background-color: rgba(var(--jf-primary), .25);
}

/* Selected slot styling */
.status--schedule .schedule--slot.slot-selected {
  background-color: rgba(var(--jf-white), 0.1);
}

.status--schedule .schedule--slot.slot-selected:hover {
  background-color: rgba(var(--jf-primary), .25);
}

/* Almost full slot styling */
.status--schedule .schedule--slot.slot-almost-full p::before {
  content: 'Almost full ';
  font-weight: bold;
  font-style: italic;
  color: rgba(var(--jf-warning), 1);
}

/* Full slot styling */
.status--schedule .schedule--slot.slot-full p:not(.slot-tbd)::before {
  content: 'FULLY BOOKED! ';
  font-weight: bold;
  font-style: italic;
  color: rgba(var(--jf-error), 1);
}

/* Unbookable slot styling */
.status--schedule .schedule--slot.slot-unBookable {
  cursor: auto;
  background-color: rgba(var(--grey-dark), 1);
  color: rgba(var(--grey-light), .5);
}
.status--schedule .schedule--slot.slot-unBookable .schedule-slot-details {
  color: rgba(var(--jf-accent-light), .75);
}
.status--schedule .schedule--slot.slot-unBookable:hover {
  background-color: rgba(var(--grey-dark), .75);
}
.status--schedule .schedule--slot.slot-unBookable .slot--room {
  background-color: rgba(var(--grey-light), .5);
}
/* Quick links */
.quick--links {
  display: block;
  padding: .25rem 1rem;
  border: 1px solid rgba(var(--jf-accent-dark), 1);
  border-width: 1px 1px 1px 10px;
  border-radius: .5rem;
}
.quick--links a {
  display: block;
}
.quick--links a:after {
  content: "↓";
  display: inline-block;
  height: 1rem;
  width: 1rem;
  padding-left: .5rem;
}

/* Modal styles for talk details popup */
.modal {
  display: none;
  position: fixed;
  z-index: 1000;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  animation: modalFadeIn 0.3s;
}

.modal-content {
  background-color: var(--white);
  margin: 5% auto;
  padding: 0;
  border: none;
  border-radius: 8px;
  width: 90%;
  max-width: 800px;
  max-height: 85vh;
  overflow-y: auto;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
  animation: modalSlideIn 0.3s;
}

.modal-header {
  background-color: rgba(var(--jf-primary), 1);
  color: rgba(var(--jf-accent-dark), 1);
  padding: 1rem 1.5rem;
  border-radius: 8px 8px 0 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.modal-header h2 {
  margin: 0;
  text-align: left;
  font-size: 1.4rem;
  font-weight: 700;
  padding-right: 1rem;
}

.modal-close {
  font-size: 2rem;
  font-weight: bold;
  cursor: pointer;
  color: rgba(var(--jf-white), 1);
  opacity: 0.7;
  transition: opacity 0.2s;
  line-height: 1;
  padding: 0;
  border: none;
  background: none;
}

.modal-close:hover,
.modal-close:focus {
  opacity: 1;
}

.modal-body {
  padding: 1.5rem;
  background-color: rgba(var(--grey-dark), 1);
}

.modal-speakers {
  margin-bottom: 1rem;
  text-align: left;
}

.modal-speakers > div {
    display: flex;
    gap: .5rem 1rem;
    flex-direction: row;
    flex-wrap: wrap;
}

.modal-speakers h4 {
  color: rgba(var(--jf-primary-light), 1);
  margin: 0 0 0.5rem 0;
  font-size: 1rem;
  font-weight: 600;
  text-transform: uppercase;
  text-align: left;
}
.modal-speakers .speaker--bio {
  color: rgba(var(--jf-accent-light), 1);
}
.modal-speakers .talk--info {
  color: rgba(var(--grey-light), 1);
}
.modal-speakers .speaker--company {
  display: inline;
}
.modal-speakers .speaker--company:before {
  content: ", ";
}
.modal-speakers .speaker--talks {
  border-top: 1px solid rgba(var(--jf-accent-dark), 1);
  padding-top: 1rem;
}

.modal-speaker {
  flex: 0 1 calc(50% - .5rem);
  display: flex;
  align-items: center;
  margin-bottom: 0.75rem;
  gap: 0.75rem;
}

.talks--speaker .speaker--image,
.modal-speaker-image {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  border: 2px solid rgba(var(--jf-accent-dark), 1);
  margin-right: 1rem;
}

.talks--speaker .speaker--image-placeholder,
.modal-speaker-image-placeholder {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: rgba(var(--jf-tertiary), 1);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border: 2px solid rgba(var(--jf-accent-dark), 1);
}

.talks--speaker .speaker--initials,
.speaker-initials {
  color: rgba(var(--jf-white), 1);
  font-weight: bold;
  font-size: 1rem;
}

.talks--speaker .speaker--info,
.modal-speaker-info {
  display: flex;
  flex-direction: column;
  text-align: left;
}

.talks--speaker .speaker--name,
.modal-speaker-name {
  font-weight: 600;
  color: rgba(var(--grey-light), 1);
  font-size: 1rem;
}

.talks--speaker .speaker--company,
.modal-speaker-company {
  color: rgba(var(--grey-light), 1);
  font-style: italic;
  font-size: 0.9rem;
}

.modal-location > div {
  margin-bottom: 1rem;
  padding: 0.5rem;
  background-color: rgba(var(--grey-light), .25);
  border: 2px solid rgba(var(--jf-accent-dark), .75);
  border-radius: 4px;
  font-weight: 500;
  color: rgba(var(--grey-light), 1);
}
@media screen and (max-width: 600px) {
  .modal-location > div {
    font-size: 1rem;
  }
}
.modal-location > div .slot--time {
  margin-left: 1rem;
}

.modal-description {
  margin-bottom: 1.5rem;
  line-height: 1.6;
  text-align: left;
  color: rgba(var(--grey-light), 1);
}

.modal-description h4 {
  color: rgba(var(--jf-primary-light), 1);
  margin: 0 0 0.75rem 0;
  font-size: 1rem;
  font-weight: 600;
  text-transform: uppercase;
}

.modal-resources {
  border-top: 1px solid rgba(var(--grey-light), 1);
  padding-top: 1rem;
}

.modal-resources h4 {
  color: rgba(var(--jf-primary), 1);
  margin: 0 0 0.75rem 0;
  font-size: 1rem;
  font-weight: 600;
}

.modal-resources a {
  display: inline-block;
  margin-right: 1rem;
  margin-bottom: 0.5rem;
  padding: 0.3rem 0.8rem;
  background-color: rgba(var(--jf-tertiary), 1);
  color: rgba(var(--jf-white), 1);
  text-decoration: none;
  border-radius: 4px;
  font-size: 0.9rem;
  transition: background-color 0.2s;
}

.modal-resources a:hover {
  background-color: rgba(var(--jf-tertiary-dark), 1);
}

/* Make schedule slots clickable for popup */
.schedule-slot-clickable {
  cursor: pointer;
  transition: background-color 0.2s;
}

.schedule-slot-clickable:hover {
  background-color: rgba(var(--jf-primary-light), 1);
}

.schedule-slot-clickable p {
  margin: 0.5rem 0;
}

.schedule-slot-details {
  font-size: 0.85rem;
  color: rgba(var(--jf-accent-light), 1);
  margin-top: 0.3rem;
}

/* Schedule slot layout for positioned details button */
.schedule-slot-with-details {
  position: relative;
  display: flex;
  flex-direction: column;
}

.schedule-slot-content {
  flex: 1;
  padding-bottom: 2rem;
}

/* Details button styling - light blue with black text by default */
.details-btn {
  color: rgba(var(--grey-light), 1);
  border: 1px solid rgba(var(--grey-light), .5);
  padding: .25rem 1rem;
  background-color: rgba(var(--jf-primary), 1);
  border-radius: 1rem;
  font-size: .9rem;
  cursor: pointer;
  font-weight: 400;
  align-self: flex-start;
  margin-top: 0.2rem;
  transition: all 0.2s;
}

.details-btn:hover {
  background-color: rgba(var(--jf-primary-dark), 1);
  color: var(--white);
  border-color: rgba(var(--jf-accent-dark), 1);
}

.details-btn:active {
  background-color: rgba(var(--jf-primary-dark), .9);
  color: var(--white);
  border-color: rgba(var(--jf-accent-dark), .9);
  box-shadow: inset 0 2px 2px 1px rgba(var(--jf-black), .75);
}

/* Modal animations */
@keyframes modalFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes modalSlideIn {
  from {
    transform: translateY(-50px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

/* Mobile responsive */
@media (max-width: 768px) {
  .modal-content {
    width: 95%;
    margin: 10% auto;
    max-height: 80vh;
  }
  
  .modal-header {
    padding: 1rem;
  }
  
  .modal-header h2 {
    font-size: 1.2rem;
  }
  
  .modal-body {
    padding: 1rem;
  }
  
  .modal-speaker {
    flex-direction: column;
    gap: 0.5rem;
  }

  .modal-speaker-image,
  .modal-speaker-image-placeholder {
    width: 60px;
    height: 60px;
  }
  
  .speaker-initials {
    font-size: 1.2rem;
  }
}

@media screen and (max-width: 600px) {
  .speakers--speaker {
    padding: 2rem 0 1rem;
  }
  .modal-speakers .speaker--image {
    margin: 0;
  }
  .modal-speaker-image,
  .modal-speaker-image-placeholder {
    margin: 0;
  }
  .modal-speakers > div.speaker--bio,
  .speaker--bio {
    flex-direction: column;
    align-items: center;
    text-align: center;
    justify-content: center;
  }
  .speakers--speaker .speaker--image,
  .speakers--speaker .speaker--info {
    width: 100%;
    margin: 0;
  }
  .speakers--speaker:nth-of-type(odd) .speaker--image,
  .speakers--speaker:nth-of-type(even) .speaker--image {
    width: 100%;
    margin: 0;
  }
  .speaker--image figure {
    padding: 0;
  }
  .modal-speaker-info {
    text-align: center;
  }
}