:root {
  --blue: #65CFE9;
  --purple: #5C068C;
  --orange: #FE5000;
  --white: #FFFFFF;
  --text: #250033;
  --soft: #DDE4EE;
  --container: 1440px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: "Poppins", Arial, sans-serif;
  font-style: italic;
  color: var(--text);
  background: var(--white);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
button, input, select { font: inherit; }
button { cursor: pointer; }

.skip-link {
  position: absolute; top: -100px; left: 20px; z-index: 999;
  padding: 10px 16px; background: var(--white); color: var(--text); border-radius: 999px;
}
.skip-link:focus { top: 20px; }

.site-wrap {
  width: min(100%, var(--container));
  margin-inline: auto;
  padding-inline: clamp(28px, 5vw, 110px);
}
.section { position: relative; overflow: hidden; }
.section h2, .hero h1 { margin: 0; line-height: 1.02; letter-spacing: -0.045em; }

.btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 44px; padding: 12px 26px;
  border: 0; border-radius: 999px;
  color: var(--white); text-decoration: none; text-transform: uppercase;
  font-weight: 700; font-size: 14px; line-height: 1; letter-spacing: .01em;
  transition: transform .18s ease, box-shadow .18s ease;
}
.btn:hover, .btn:focus-visible { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(37,0,51,.22); }
.btn--purple { background: var(--purple); }
.btn--orange { background: var(--orange); }
.btn--small { min-height: 38px; padding: 10px 22px; font-size: 13px; text-transform: capitalize;}
.btn--small { min-height: 38px; padding: 10px 22px; font-size: 13px; text-transform: capitalize;}

/* HERO */
.hero {
  background: var(--orange);
  min-height: 600px;
  color: var(--white);
}
.hero__grid {
  min-height: 600px;
  display: grid;
  grid-template-columns: 56% 44%;
  align-items: center;
  gap: clamp(18px, 3vw, 56px);
}
.hero__visual {
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  overflow: visible;
}
.hero__visual img {
  width: min(730px, 60vw);
  max-width: none;
  transform: translateX(clamp(-120px, -8vw, -48px));
}
.hero__content {  margin-left: auto; }
.hero h1 { font-size: clamp(36px, 3vw, 48px); font-weight: 700; }
.hero__lead { margin: 12px 0 22px; font-size: clamp(22px, 2vw, 35px); line-height: 1.07; font-weight: 700; letter-spacing: -0.035em; }
.hero__notes { list-style: none; margin: 22px 0 0; padding: 0; display: grid; gap: 3px; font-size: 13px; font-weight: 700; }
.hero__notes li::before { content: "•"; margin-right: 7px; }

/* INTRO */
.intro {
  background-color: var(--blue);
  min-height: 530px;
  background-image: url("assets/img/image-bg-section-02.svg");
  background-repeat: no-repeat;
  background-position: right bottom;
  background-size: min(58vw, 760px) auto;
}
.intro__inner { min-height: 530px; display: flex; align-items: center; }
.intro__copy { max-width: 580px; }
.intro h2 { font-size: clamp(36px, 3vw, 48px); font-weight: 500; color: var(--text); }
.intro__tags { margin-top: 42px; display: grid; grid-template-columns: repeat(2, max-content); gap: 16px 20px; }
.intro__tags span {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 48px; padding: 10px 18px; background-color: var(--purple);
  border: 1px solid var(--white); border-radius: 999px;
  color: var(--white); font-size: 16px; font-weight: 400; line-height: 1;
}

/* ABOUT */
.about {
  background: var(--soft);
  padding-block: 112px 88px;
  overflow: visible;
}
.btn--floating {
  position: absolute;
  top: 0; left: 50%; transform: translate(-50%, -50%);
  z-index: 5;
  white-space: nowrap;
}
.btn--floating:hover, .btn--floating:focus-visible { transform: translate(-50%, calc(-50% - 2px)); }
.about__grid { display: grid; grid-template-columns: 42% 58%; gap: clamp(40px, 6vw, 92px); align-items: end; }
.about__image { align-self: end; }
.about__image img { width: min(560px, 100%); margin-left: clamp(-60px, -4vw, 0px); }
.about__text { max-width: 650px; font-size: clamp(16px, 1.35vw, 18px); line-height: 1.55; }
.about__text p { margin: 0 0 23px; }

/* AGENDA */
.agenda {
  min-height: 930px;
  color: var(--white);
  background-image: url("assets/img/court-bg.webp");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center top;
}
.agenda__inner { padding-top: 70px; padding-bottom: 110px; }
.agenda h2 {
  width: min(500px, 92%);
  margin-inline: auto;
  text-align: center;
  font-size: clamp(27px, 4.2vw, 36px);
  font-weight: 500;
  color: var(--white);
}
.agenda__box {
  width: min(900px, 88%);
  margin: 50px auto 0;
  padding: clamp(32px, 6vw, 110px) clamp(54px, 8vw, 140px);
  /*background-image: url("assets/img/image-bg-section-04.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;*/
  border: 7px solid rgba(255,255,255,.88);
  background: rgba(101,207,233,.70);
  color: var(--text);
}
.agenda__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 20px;
  font-size: clamp(18px, 1.4vw, 20px);
  font-weight: 500;
}
.agenda__list li { display: grid; grid-template-columns: 110px 1fr; gap: 28px; align-items: baseline; }
.agenda__list time { color: var(--text); }
.agenda__box p { margin: 28px auto 0; max-width: 720px; text-align: center; font-size: clamp(16px, 1.3vw, 18px); line-height: 1.32; font-weight: 400; }

/* SPEAKERS */
.speakers { background: var(--purple); color: var(--white); padding-block: 66px 72px; text-align: center; }
.speakers h2 { color: var(--orange); font-size: clamp(24px, 2.2vw, 36px); font-weight: 500; margin-bottom: 58px; }
.speakers__row { display: grid; grid-template-columns: repeat(5, 1fr); gap: clamp(24px, 4vw, 88px); align-items: start; }
.speaker-card { display: grid; justify-items: center; gap: 8px; }
.speaker-card__photo {
  position: relative;
  width: clamp(120px, 10vw, 185px); aspect-ratio: 1;
  border-radius: 50%; display: block; isolation: isolate;
}
/*.speaker-card__photo::after {
  content: ""; position: absolute; inset: -5px; border: 7px solid var(--orange); border-radius: 50%;
  transform: translate(10px, -8px); z-index: 2; pointer-events: none;
}*/
.speaker-card__photo img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.speaker-card h3 { margin: 14px 0 0; font-size: 16px; font-weight: 700; color: var(--white); }
.speaker-card p { margin: 0; font-size: 14px; font-weight: 400; color: var(--white); }

/* GALLERY + LOCATION */
.gallery-location { background: var(--soft); padding-block: 88px 100px; }
.gallery-location__grid { display: grid; grid-template-columns: 33% 67%; gap: clamp(36px, 5vw, 86px); align-items: center; }
.location h2 { font-size: clamp(28px, 4.4vw, 36px); font-weight: 500; color: var(--text); }
.location__details { margin-top: 70px; font-size: clamp(15px, 1.3vw, 18px); }
.location__pin { width: 28px; height: 28px; margin-bottom: 18px; }
.location__details strong { display: block; font-weight: 500; margin-bottom: 22px; }
.location__details p { margin: 0 0 26px; }
.gallery { display: grid; grid-template-columns: 1.1fr 1fr 1fr; grid-auto-rows: 188px; gap: 24px; align-items: stretch; }
.gallery__item { appearance: none; border: 0; padding: 0; background: transparent; border-radius: 0; overflow: hidden; box-shadow: none; }
.gallery__item img { width: 100%; height: 100%; object-fit: cover; transition: transform .28s ease, filter .28s ease; }
.gallery__item:hover img, .gallery__item:focus-visible img { transform: scale(1.035); filter: saturate(1.08); }
.gallery__item--tall { grid-row: span 2; }
.gallery__item--wide { grid-column: span 2; }

/* SPONSORS */
.sponsors { background: var(--white); padding-block: 70px 78px; text-align: center; }
.sponsors h2 { color: var(--orange); font-size: clamp(24px, 1.8vw, 32px); font-weight: 700; margin-bottom: 44px; }
.sponsors__grid { display: grid; grid-template-columns: 1.25fr 2.4fr 1.75fr 1.05fr; align-items: center; gap: 0; }
.sponsors__group--titles { min-height: 40px; display: grid; place-items: center; align-content: center; padding: 0 10px; position: relative; }
.sponsors__group { min-height: 220px; display: grid; place-items: center; align-content: center; padding: 0 38px; position: relative; }
.sponsors__group:not(:last-child)::after { content: ""; position: absolute; right: 0; top: 24px; bottom: 24px; width: 1px; background: rgba(254,80,0,.35); }
.sponsors__group--titles span { display: block; font-weight: 500; font-size: 15px; color: var(--orange); }
.sponsors__logos {min-height:90px; align-items: center; justify-content: center; display:grid;}
.sponsors__gold-logos { min-width:400px; display: grid; grid-template-columns: repeat(4, auto); gap: 24px 24px; align-items: center; justify-content: center; }
.sponsors__silver-logos { min-width:200px; display: grid; grid-template-columns: repeat(2, auto); gap: 24px 24px; align-items: center; justify-content: center; }
.logo-cw { width: 250px; max-width: 100%; }
.logo-ar { width: 90px; }
.logo-hpe { width: 180px; }
.logo-watchguard { width: 210px; }
.logo-hornet { width: 145px; }
.logo-arcserve { width: 200px; }
.logo-media { width: 100px; }

/* WHY */
.why {
  background-color: var(--blue);
  background-image: url("assets/img/image-bg-section-07.svg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  color: var(--text);
}
.why__inner { min-height: 620px; display: grid; grid-template-columns: 56% 44%; align-items: center; position: relative; }
.why__copy { max-width: 720px; }
.why h2 { font-size: clamp(30px, 2.6vw, 48px); font-weight: 500; margin-bottom: 28px; }
.why ol { margin: 0 0 30px; padding: 0; list-style: none; display: grid; gap: 12px; font-size: clamp(16px, 1.15vw, 18px); font-weight: 400; }
.why li:nth-child(1)::before { content: "1-0 "; }
.why li:nth-child(2)::before { content: "2-0 "; }
.why li:nth-child(3)::before { content: "3-0 "; }
.why li:nth-child(4)::before { content: "4-0 "; }
.why li:nth-child(5)::before { content: "5-0 "; }
.why li:nth-child(6)::before { content: "6-0 "; }
.why h3 { margin: 0; font-size: clamp(24px, 2vw, 38px); line-height: 1.1; font-weight: 700; }
.why__logo { width: min(500px, 36vw); justify-self: center; position: relative; z-index: 1; }
.why__btn { position: absolute; left: 50%; bottom: 55px; transform: translateX(-50%); }
.why__btn:hover, .why__btn:focus-visible { transform: translate(-50%, -2px); }

/* FORM */
.signup { background: var(--white); padding-block: 28px 90px; background-color: var(--purple);}
.signup__inner { max-width: 920px; background-color: var(--white); padding: 25px 0px; border-radius: 10px; }
.signup h2 { text-align: center; font-size: clamp(24px, 1.8vw, 33px); font-weight: 700; margin-bottom: 34px; }
.form { display: grid; gap: 20px; }
.form fieldset { border: 0; margin: 0; padding: 0; display: grid; gap: 14px; }
.form legend {
  display: inline-flex; align-items: center; min-height: 24px; margin-bottom: 10px; padding: 5px 16px;
  border-radius: 999px; background: var(--purple); color: var(--white); font-size: 12px; font-weight: 700;
}
.form__grid { display: grid; gap: 14px; }
.field { display: grid; gap: 4px; color: var(--text); font-size: 12px; font-weight: 500; }
.field span { line-height: 1.1; }
input, select {
  width: 100%; min-height: 34px; border: 1.5px solid var(--text); border-radius: 0;
  background: var(--white); color: var(--text); padding: 5px 10px; outline: none;
}
select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--orange) 50%), linear-gradient(135deg, var(--orange) 50%, transparent 50%); background-position: calc(100% - 16px) 14px, calc(100% - 10px) 14px; background-size: 6px 6px, 6px 6px; background-repeat: no-repeat; }
input:focus, select:focus { border-color: var(--orange); box-shadow: 0 0 0 2px rgba(254,80,0,.18); }
.form__rgpd { margin-top: 18px; font-size: 12px; line-height: 1.45; }
.form__rgpd h3 { margin: 0 0 10px; font-size: 15px; font-weight: 500; }
.form__rgpd p { margin: 0 0 12px; }
.checkbox { display: flex; gap: 10px; align-items: flex-start; }
.checkbox input { width: 20px; min-height: 20px; flex: 0 0 auto; }
.form__submit { justify-self: center; margin-top: 18px; }

/* FOOTER */
.footer { background: var(--orange); color: var(--white); min-height: 195px; }
.footer__inner { min-height: 195px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.footer__logo img { width: 250px; filter: brightness(0) invert(1); }
.footer__social { display: flex; align-items: center; gap: 16px; font-size: 13px; font-weight: 700; }
.footer__social a { width: 22px; height: 22px; border: 2px solid currentColor; display: inline-flex; align-items: center; justify-content: center; text-decoration: none; font-size: 11px; font-weight: 900; }

/* LIGHTBOX */
.lightbox { position: fixed; inset: 0; z-index: 1000; display: none; align-items: center; justify-content: center; background: rgba(37,0,51,.88); padding: 34px; }
.lightbox.is-open { display: flex; }
.lightbox__figure { margin: 0; width: min(1180px, 88vw); max-height: 86vh; display: grid; gap: 14px; }
.lightbox__image { width: 100%; max-height: 78vh; object-fit: contain; background: rgba(255,255,255,.06); }
.lightbox__caption { color: var(--white); text-align: center; font-weight: 700; }
.lightbox__close, .lightbox__nav { position: absolute; border: 0; color: var(--white); background: var(--orange); border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; }
.lightbox__close { top: 22px; right: 22px; width: 48px; height: 48px; font-size: 32px; line-height: 1; }
.lightbox__nav { top: 50%; width: 54px; height: 54px; font-size: 42px; line-height: 1; transform: translateY(-50%); }
.lightbox__nav--prev { left: 24px; }
.lightbox__nav--next { right: 24px; }

@media (max-width: 1140px) {
  .site-wrap { padding-inline: clamp(24px, 5vw, 64px); }
  .hero__grid { grid-template-columns: 52% 48%; }
  .hero__visual img { width: min(640px, 58vw); transform: translateX(-70px); }
  .intro { background-size: 46vw auto; }
  .about__grid { grid-template-columns: 36% 64%; }
  .speakers__row { gap: 32px; }
  .speaker-card__photo { width: 130px; }
  .gallery-location__grid { grid-template-columns: 38% 62%; gap: 44px; }
  .gallery { grid-auto-rows: 155px; gap: 18px; }
  .sponsors__grid { grid-template-columns: 1fr 1fr 1fr 1fr; }
  .sponsors__group { padding-inline: 20px; }
  .sponsors__gold-logos { min-width:320px; gap: 34px 36px; }
  .sponsors__silver-logos { min-width:200px; }
  .logo-cw { width: min(200px, 18vw); }
  .logo-ar { width: min(60px, 15vw); }
  .logo-hpe { width: min(180px, 15vw); }
  .logo-watchguard { width: min(250px, 20vw); }
  .logo-arcserve { width: min(200px, 16vw); }
}

@media (max-width: 900px) {
  .hero { min-height: auto; }
  .hero__grid { grid-template-columns: 1fr; min-height: auto; padding-top: 28px; padding-bottom: 54px; }
  .hero__visual { justify-content: center; }
  .hero__visual img { width: min(670px, 112vw); transform: translateX(0); }
  .hero__content { display:block; margin: 0 auto; text-align: center; padding-block: 0; max-width: 480px;}
  .hero__notes { justify-items: center; }
  .intro { background-size: 48vw auto; background-position: right bottom; }
  .about__grid { grid-template-columns: 1fr; }
  .about__image { order: 2; opacity: .75; }
  .about__image img { width: 360px; margin-left: -70px; }
  .about__text { max-width: none; }
  .agenda { min-height: auto; }
  .agenda__box { width: 100%; }
  .speakers__row { grid-template-columns: repeat(3, 1fr); row-gap: 42px; }
  .gallery-location__grid { grid-template-columns: 1fr; }
  .location { max-width: 560px; }
  .gallery { grid-auto-rows: 190px; }
  .sponsors__grid { grid-template-columns: 1fr 1fr; gap: 34px 0; }
  .sponsors__group { min-height: 220px; }
  .sponsors__group:nth-child(2)::after { display: none; }
  .sponsors__group span { margin-bottom: 24px; }
  .why__inner { grid-template-columns: 1fr; min-height: 620px; padding-top: 66px; padding-bottom: 110px; }
  .why__copy { max-width: 560px; }
  .why__logo { width: min(300px, 56vw); justify-self: end; margin-top: -60px; }
}

@media (max-width: 760px) {
  .site-wrap { padding-inline: 24px; }
  .btn { min-height: 40px; padding: 11px 22px; font-size: 12px; }
  .hero__grid { padding-bottom: 46px; }
  .hero__visual img { width: 118vw; max-width: none; margin-left: -30vw; }
  .hero h1 { font-size: 34px; }
  .hero__lead { font-size: 24px; }
  .intro { min-height: 790px; background-size: 48vw auto; background-position: right bottom; }
  .intro__inner { min-height: 590px; align-items: flex-start; padding-top: 58px; }
  .intro h2 { font-size: clamp(36px, 11vw, 48px); }
  .intro__tags { grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: 28px; }
  .intro__tags span { min-height: 42px; padding: 10px 14px; font-size: 14px; border-width: 3px; }
  .about { padding-block: 86px 52px; }
  .btn--floating { max-width: calc(100% - 40px); }
  .about__text { font-size: 16px; }
  .about__text p:first-child { font-size: 20px; }
  .agenda__inner { padding-top: 58px; padding-bottom: 70px; }
  .agenda h2 { font-size: 38px; width: 100%; }
  .agenda__box { margin-top: 34px; padding: 28px 22px; border-width: 4px; }
  .agenda__list { font-size: 16px; gap: 14px; }
  .agenda__list li { grid-template-columns: 72px 1fr; gap: 14px; }
  .agenda__box p { margin-top: 30px; font-size: 16px; }
  .speakers { padding-block: 52px; }
  .speakers h2 { font-size: 28px; margin-bottom: 42px; }
  .speakers__row { grid-template-columns: repeat(2, 1fr); gap: 34px 22px; }
  .speaker-card__photo { width: 112px; }
  /*.speaker-card__photo::after { inset: -4px; border-width: 5px; transform: translate(7px, -6px); }*/
  .gallery-location { padding-block: 60px 74px; }
  .location h2 { font-size: 47px; }
  .location__details { margin-top: 42px; font-size: 16px; }
  .gallery { grid-template-columns: 1fr 1fr; grid-auto-rows: 150px; gap: 12px; }
  .gallery__item--tall { grid-row: span 1; }
  .gallery__item--wide { grid-column: span 2; }
  .sponsors { padding-block: 54px; }
  .sponsors__grid { grid:none; /*grid-template-columns: 1fr; */}
  .sponsors__group { display:block; min-height: auto; padding: 32px 0; }
  .sponsors__group::after { display: none; }
  .sponsors__gold-logos { grid-template-columns: 1fr; gap: 50px; text-align:center;}
  .sponsors__gold-logos img{margin: auto;}
  .sponsors__silver-logos {  grid-template-columns: 1fr; gap: 50px; text-align:center;}
  .sponsors__silver-logos img {margin: auto;}
  .logo-cw { width: 230px; }
  .logo-ar { width: 150px; }
  .logo-hpe { width: 183px; }
  .logo-watchguard { width: 208px; }
  .logo-hornet { width: 145px; }
  .logo-arcserve { width: 211px; }
  .why { background-position: center; }
  .why__inner { padding-top: 56px; padding-bottom: 122px; }
  .why ol { font-size: 15px; gap: 10px; }
  .why__logo { width: 240px; justify-self: center; margin-top: 28px; }
  .why__btn { bottom: 46px; }
  .signup { padding-bottom: 62px; }
  .form__rgpd { font-size: 11px; }
  .footer__inner { flex-direction: column; justify-content: center; align-items: center; }
  .lightbox { padding: 16px; }
  .lightbox__nav { width: 42px; height: 42px; font-size: 32px; }
  .lightbox__nav--prev { left: 10px; }
  .lightbox__nav--next { right: 10px; }
  .lightbox__close { width: 42px; height: 42px; top: 10px; right: 10px; }
}

@media (max-width: 430px) {
  .intro h2 { font-size: 36px; }
  .intro__tags { grid-template-columns: 1fr; }
  .speakers__row { grid-template-columns: 1fr; }
  .gallery { grid-template-columns: 1fr; }
  .gallery__item--wide { grid-column: span 1; }
}