/* ====== Base ====== */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; background:#fff; color:#000;
  font: 400 16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial;
}
img{max-width:100%; display:block}
a{color:#008db1; text-decoration:none}
a:hover{text-decoration:underline}

:root{
  --teal: #009CA6;                /* section headings */
  --ink-muted:#000;
  --brand:#1e90ff;               /* link highlight (kept subtle) */
  --hero-blue:#cfe7ee;           /* hero band */
  --radius:14px;
  --shadow:0 6px 24px rgba(15,23,42,.08);
  --container:1180px;            /* default (1440 design) */
  --pad:24px;
}

.container{max-width:var(--container); margin-inline:auto; padding-inline:var(--pad)}
.section{padding-block:25px}
h1{font-weight:700; font-size:34px; line-height:1.2; margin:8px 0 12px}
h2{font-weight:700; font-size:26px; margin:0 0 12px}
h3{font-size:18px; margin:0 0 8px}
.eyebrow{color:var(--ink-muted); margin:0}
.muted{color:var(--ink-muted)}

/* ====== Buttons ====== */
.btn{display:inline-block; border-radius:999px; padding:10px 16px; font-weight:600}
.btn--black{background:#111; color:#fff; box-shadow:var(--shadow)}
.btn--black:hover{filter:brightness(1.05)}
.btn--small{padding:8px 14px}


/* ===== SINGLE-IMAGE HERO (no cropping) ===== */
.hero-split{
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  line-height: 0;
}

.hero-split__img{
  display: block;
  width: 100%;
  height: auto;
}


/* OPTIONAL: cap hero height on ultra-wide screens without cropping */
@media (min-width: 1920px){
  .hero-split__img{ max-height: 720px; margin-inline: auto; }
}

/* OPTIONAL: if you want the hero to be tighter on small phones */
@media (max-width: 420px){
  .hero-split__img{ max-height: 360px; object-fit: contain; }
}



/* ====== Intro text emphasis ====== */
.intro__title{
  
  color:#009CA6; 
  line-height:1.6; 
  margin:0 0 8px;
  font-family: "Lexend", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  /* font-size: 30px; */
  font-size: 24px;
  line-height: 130%;


}
.intro__p{
  margin:0 0 12px;
  font-family: "Lexend", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  /* font-size: 20px; */
    font-size: 16px;
  color:black;
  line-height: 130%;

}

/* ====== Tables ====== */
.heading-teal{
  color:var(--teal);
  font-family: "Lexend", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 30px;
  line-height: 120%;

}
.table__label{margin:18px 0 8px; font-weight:600}
.table-wrap{  overflow:auto}
table{width:100%; border-collapse:collapse; min-width:520px}
thead th{ width:70%; text-align:left; padding:20px 16px; border: 1px solid #000;
  border-left: 0;      /* remove inner verticals */
  border-right: 0;
 font-family: "Lexend", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
  font-size: 20px;
  line-height: 120%;

}
tbody td{padding:20px 16px;  border: 1px solid #000;
  border-left: 0;      /* remove inner verticals */
  border-right: 0;
   font-family: "Lexend", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  font-size: 18px;
  line-height: 120%;
  align-content: start;
}
/* keep the outer box (left & right edges only) */
tr > *:first-child { border-left: 1px solid #000; }
tr > *:last-child  { border-right: 1px solid #000; }

/* ====== Venue ====== */
.venue{ }
.conferencevanue {
  font-family: "Lexend", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 30px;
  line-height: 120%;
}

.conferencevanue1 {
  font-family: "Lexend", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  font-size: 20px;
  line-height: 120%;
}

.muted {
  font-family: "IBM Plex Serif", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 16px;
  line-height: 150%;
  margin-top: 5px;
  margin-bottom: 0px;
}

.hotel__headline {
  font-family: "Lexend", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  font-size: 20px;
  line-height: 120%;
}

.hotel__location {
  font-family: "Lexend", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  font-size: 18px;
  line-height: 120%;

}

.hotel__walk {
  font-family: "Lexend", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 16px;
  line-height: 130%;

}
/* ====== Hotels list ====== */
.hotels{display:flex; flex-direction:column;}
.hotel{
  display:flex; justify-content:space-between; align-items:center; gap:16px;
  background:#fff; border:1px solid #000;  padding:20px
}
.hotel__text{flex:1}
.walk{font-size:16px;}

/* ====== Links ====== */
.links{list-style:none; padding:0; margin:0 0 28px}
.links li+li{margin-top:6px}

/* ====== Info panel ====== */
.panel{ padding-block:24px; padding-bottom: 90px;}
.panel__grid{display:grid; gap:18px; background:#d7edf4;}
.panel__cols{display:grid; gap:18px}
@media (min-width: 900px){
  .panel__cols{grid-template-columns:1fr 1fr}
}

/* ====== Footer bar ====== */
.footer{background:#707a84; color:#fff; padding-block:16px}
.footer a{color:#fff;   font-family: "Lexend", sans-serif;}
.footer__grid{display:flex; justify-content:space-between; align-items:center}

/* ====== RESPONSIVE (match Figma artboards) ====== */

/* Tablet baseline (820) */
@media (max-width: 819.98px){
  :root{--pad:16px}
  .hero__grid{grid-template-columns:1fr; align-items:start}
  .hero__media{height:260px; border-radius:16px}
  .hero__arrows{display:none}
}

/* Desktop – 1440 */
@media (min-width: 1440px){
  :root{--container:1180px}
  .hero__media{height:320px}
  .hero__media img{object-position:76% center}
}

/* Large desktop – 1920 */
@media (min-width: 1920px){
  :root{--container:1320px}
  .hero__grid{grid-template-columns:1.15fr .85fr}
  .hero__media{height:360px}
  .hero__arrows{right:-40px; width:240px}
  .hero__media img{object-position:78% center}
}


.keybutton {
font-family: "Lexend", sans-serif;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
/* font-size: 20px; */
font-size: 16px;
line-height: 120%;
letter-spacing: 2%;
padding: 8px 35px;
margin-top: 15px;

}

.KeyDates1 {
font-family: "Lexend", sans-serif;
font-optical-sizing: auto;
font-weight: 500;
font-style: normal;
/* font-size: 24px; */
font-size: 18px;
line-height: 120%;
}

.usefullink {
  font-family: "Lexend", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 30px;
  line-height: 120%;
}

ul.Visalink li a {
font-family: "Lexend", sans-serif;
  font-weight: 500;
  font-style: normal;
  font-size: 20px;
  line-height: 120%;
  color:#000;
  text-decoration: underline;

}

ul.Visalink li a:hover {
  text-decoration: none;

}

.contactinfo {
  font-family: "IBM Plex Serif", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 16px;
  line-height: 150%;
}

/* ==== Host / Partner logos table ==================================== */
.org-table{
  width: 580px;
  border-collapse: separate;   /* keep spacing clean */
  border-spacing: 0;
  margin: auto;
}

.org-table thead th{
  border: 0;
  padding: 8px 12px 16px;
  text-align: center;
  font-family: "Lexend", sans-serif;
  font-weight: 500;
  font-style: normal;
  font-size: 16px;
  line-height: 130%;
  color:#000;
}

.org-table tbody td{
  border: 0;                  /* no lines between columns */
  padding: 6px 12px 0;
  text-align: center;
  vertical-align: middle;
}

.org-table tbody td a{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
}

.org-table tbody td img{
  max-height: 60px;           /* match your screenshot scale */
  height: auto;
  width: auto;
  display: block;
}

/* subtle hover (optional) */
@media (prefers-reduced-motion: no-preference){
  .org-table tbody td a:hover img{
    transform: scale(1.02);
    transition: transform .18s ease;
  }
}

/* ===== Mobile: stack and show labels from data-label ================= */
@media (max-width: 640px){

  .org-table thead{ display: none; }
  .org-table, .org-table tbody, .org-table tr{ display: block; }
  .org-table tbody td{
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 10px 0 14px;
  }
  .org-table tbody td::before{
    content: attr(data-label);
    margin-bottom: 8px;
    font-weight: 600;
    font-size: 14px;
    color: #6b7280;
    text-align: center;
  }
  .org-table tbody td{    margin-left: -18%; }
}
.panel-divider{
  border:0;                            /* remove default HR */
  height:2px;
  width:100%;
  background: rgba(15,23,42,.35);      /* subtle dark line */
  margin:10px 0 14px;                  /* spacing above/below */
}

.panel__org {
font-family: "Lexend", sans-serif;
  font-weight: 500;
  font-style: normal;
  font-size: 18px;
  line-height: 120%;
  color:#000;

}

.footer__text{
  margin:0 0 12px;
  font-family: "Lexend", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 16px;
  color:black;
  line-height: 130%;

}

html, body { overflow-x: clip; }

/* fallback for older browsers */
@supports not (overflow-x: clip) {
  html, body { overflow-x: hidden; }
}

section.section2 {
    padding-top: unset;
}

.muted2 {
  font-family: "Lexend", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  font-size: 20px;
  line-height: 120%;
  margin-top: 5px;
  margin-bottom: 0px;

}

.only-mobile { display: none; }
.only-desktop { display: table; }

@media (max-width: 450px){
  .only-desktop { display: none; }
  .only-mobile { display: block; }

  .mtable { list-style: none; margin: 0; padding: 0;min-width:unset; }
  .mrow { border: 1px solid #000; border-left: 0; border-right: 0; padding: 12px 16px; margin-bottom: 12px; }
  .mlabel { display: block; font-weight: 600; color:#000; }
  .mvalue { display: block; margin-bottom: 8px; }

/* Mobile: stack hotel content, put button on a new line */
  .hotel{
    flex-direction: column;        /* was row */
    align-items: flex-start;       /* left-align contents */
    justify-content: initial;      /* reset space-between */
    gap: 12px;
  }
  .hotel__text{ width: 100%; }

  /* keep button natural width on the left */
  .hotel .btn{ 
    align-self: flex-start; 
    margin-top: 4px;
  }

  .org-table tbody td{    margin-left: -25%; }

}
/* FRAME the whole list (outer left/right borders only) */
.hotels1{
  border-left: 1px solid #000;
  border-right: 1px solid #000;
  background: #fff;
}

/* Each row draws only its TOP border; last row also draws the BOTTOM one */
.hotel-acc{
  border: 0;                 /* remove per-item box */
  border-top: 1px solid #000;
  margin: 0;                 /* no gaps = no double lines */
}
.hotel-acc:last-of-type{ border-bottom: 1px solid #000; }

/* Summary row — headline left, + right */
.hotel-acc > summary{
  list-style: none;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  cursor: pointer;
}
.hotel-acc > summary::-webkit-details-marker{ display:none; }
.hotel-acc > summary::after{
  content:"+";
  font-weight:700; font-size:1.1rem; line-height:1;
}
.hotel-acc[open] > summary::after{ content:"–"; }

/* Open content — add a divider between summary and content, align like screenshot */
.hotel-acc .hotel__content{
 /*  border-top: 1px solid #000;      single inner divider */
  padding: 10px 16px 14px;
  display: grid;
  grid-template-columns: 1fr max-content;  /* text left, button right */
  align-items: center;
  gap: 16px;
}
.hotel-acc .hotel__left{ display: grid; gap: 6px; }
.hotel-acc .keybutton{ margin: 0; }

/* Mobile: stack and make button full-width */
@media (max-width: 450px){
  .hotel-acc .hotel__content{
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .hotel-acc .keybutton{
    width: 100%;
    text-align: center;
  }
}
@media (max-width: 390px){
  .org-table tbody td{    margin-left: -32%; }
.equal-table {
    width: 550px;
    table-layout: fixed; /* important: makes column widths stable */
  
  }

  @media (max-width: 325px) {
  .org-table tbody td {
    margin-left: -42%;
  }
}

  .footer {

  }
