/* =========================================================
   CANCÚN HALF MARATHON 2027
   course.html
========================================================= */

:root{
  --navy:#061f3b;
  --navy2:#07385f;
  --turq:#15c4cb;
  --turq2:#00aeb9;
  --pink:#ef3d7a;
  --paper:#fbfaf7;
  --white:#fff;
  --ink:#102b47;
  --muted:#687b8b;
  --line:#d9e4ea;
  --shadow:0 18px 48px rgba(5,36,63,.14);
}

*{box-sizing:border-box}

html{scroll-behavior:smooth}

body{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  color:var(--ink);
  background:#fff;
}

a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
button{font-family:inherit}


/* LANGUAGE */

.language-bar{
  height:42px;
  background:#03162d;
  color:#fff;
  display:flex;
  align-items:center;
  position:relative;
  z-index:300;
}

.language-inner{
  width:min(1400px,calc(100% - 32px));
  margin:auto;
  display:flex;
  justify-content:flex-end;
}

.language-select{position:relative}

.language-button{
  min-width:118px;
  padding:8px 12px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:5px;
  background:rgba(255,255,255,.05);
  color:#fff;
  font-weight:800;
  display:flex;
  justify-content:space-between;
  gap:16px;
  cursor:pointer;
}

.language-menu{
  position:absolute;
  top:calc(100% + 8px);
  right:0;
  width:220px;
  display:none;
  background:#fff;
  color:var(--ink);
  border-radius:8px;
  overflow:hidden;
  box-shadow:0 18px 45px rgba(0,25,45,.28);
  z-index:400;
}

.language-menu.open{display:block}

.language-menu a{
  display:flex;
  justify-content:space-between;
  padding:12px 15px;
  border-bottom:1px solid #edf1f3;
  font-size:14px;
  font-weight:700;
}

.language-menu a:hover{background:#f2fbfc}
.language-menu strong{color:var(--turq2);font-size:12px}


/* NAV */

.site-header{
  background:var(--navy);
  color:#fff;
  position:sticky;
  top:0;
  z-index:250;
  box-shadow:0 4px 18px rgba(0,0,0,.14);
}

.nav-inner{
  width:min(1400px,calc(100% - 40px));
  min-height:70px;
  margin:auto;
  display:flex;
  align-items:center;
  justify-content:center;
}

.main-nav{
  display:flex;
  align-items:center;
  gap:29px;
  font-size:14px;
  font-weight:800;
}

.main-nav>a,
.menu-dropdown-toggle{
  padding:27px 0 24px;
  border:0;
  border-bottom:3px solid transparent;
  background:transparent;
  color:#fff;
  font:inherit;
  font-weight:800;
  cursor:pointer;
}

.main-nav>a:hover,
.menu-dropdown-toggle:hover,
.menu-dropdown-toggle.active,
.menu-dropdown.open .menu-dropdown-toggle{
  color:var(--turq);
  border-bottom-color:var(--turq);
}

.registration-link{
  padding:13px 20px!important;
  border:0!important;
  border-radius:4px;
  background:var(--pink);
  color:#fff!important;
}

.menu-toggle{
  display:none;
  margin-left:auto;
  border:1px solid rgba(255,255,255,.35);
  background:transparent;
  color:#fff;
  font-size:22px;
  padding:7px 11px;
  border-radius:5px;
}

.menu-dropdown{
  position:relative;
  display:flex;
  align-items:center;
}

.menu-dropdown-panel{
  position:absolute;
  top:100%;
  left:-20px;
  width:270px;
  display:none;
  background:#fff;
  color:var(--ink);
  box-shadow:0 18px 40px rgba(0,25,45,.24);
  border-radius:0 0 9px 9px;
  overflow:hidden;
}

.menu-dropdown.open .menu-dropdown-panel,
.menu-dropdown:hover .menu-dropdown-panel{
  display:block;
}

.menu-dropdown-panel a{
  display:block;
  padding:13px 20px;
  border-bottom:1px solid #edf1f3;
  font-size:13px;
  font-weight:700;
}

.menu-dropdown-panel a:hover,
.menu-dropdown-panel a.current{
  background:#effbfc;
}


/* HERO */

.course-hero{
  min-height:390px;
  position:relative;
  overflow:hidden;
  color:#fff;
  background:
    url('https://cancun-half-marathon.com/images/cancun-home-hero.png')
    center 48% / cover no-repeat;
}

.course-hero-overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(
      90deg,
      rgba(3,31,55,.94) 0%,
      rgba(3,31,55,.74) 38%,
      rgba(3,31,55,.25) 70%,
      rgba(3,31,55,.05) 100%
    );
}

.course-hero-inner{
  position:relative;
  z-index:2;
  width:min(1180px,calc(100% - 48px));
  min-height:390px;
  margin:auto;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.eyebrow{
  color:var(--turq);
  font-size:14px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.course-hero h1{
  margin:10px 0 13px;
  font-size:clamp(48px,6vw,78px);
  line-height:.95;
  letter-spacing:-.045em;
}

.course-hero p{
  max-width:670px;
  margin:0;
  font-size:19px;
  line-height:1.6;
  color:rgba(255,255,255,.93);
}


/* QUICK FACTS */

.quick-facts{
  background:var(--navy);
  color:#fff;
}

.quick-facts-inner{
  width:min(1280px,calc(100% - 30px));
  margin:auto;
  display:grid;
  grid-template-columns:repeat(5,1fr);
}

.quick-fact{
  min-height:94px;
  padding:21px 23px;
  border-right:1px solid rgba(21,196,203,.30);
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.quick-fact:last-child{border-right:0}

.quick-fact span{
  color:var(--turq);
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.07em;
}

.quick-fact strong{
  margin-top:6px;
  font-size:17px;
}


/* GENERIC */

.container{
  width:min(1180px,100%);
  margin:auto;
}

.intro-section,
.maps-section,
.start-section,
.practical-section{
  padding:72px 24px;
}

.section-kicker{
  color:var(--pink);
  font-size:13px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.section-title{
  margin:9px 0 18px;
  color:var(--navy);
  font-size:clamp(34px,4vw,52px);
  line-height:1.03;
  letter-spacing:-.035em;
}

.lead{
  margin:0;
  color:#455d70;
  font-size:19px;
  line-height:1.68;
}


/* INTRO */

.intro-grid{
  display:grid;
  grid-template-columns:1.12fr .88fr;
  gap:60px;
  align-items:center;
}

.course-note{
  padding:28px;
  background:#edf9fb;
  border-left:5px solid var(--turq);
  border-radius:9px;
}

.course-note strong{
  color:var(--navy);
  font-size:20px;
}

.course-note p{
  color:#4d697a;
  line-height:1.62;
}

.course-note small{
  color:#708390;
  line-height:1.5;
}


/* MAPS */

.maps-section{
  background:var(--paper);
}

.maps-intro{
  max-width:780px;
  margin:0 0 35px;
  color:#5c7383;
  line-height:1.65;
}

.maps-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
}

.course-card{
  overflow:hidden;
  background:#fff;
  border:1px solid #dfe8ec;
  border-radius:14px;
  box-shadow:0 10px 32px rgba(7,43,75,.07);
}

.course-card:first-child{
  grid-column:1 / -1;
}

.course-card-head{
  padding:24px 26px 19px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:25px;
}

.course-card-head h3{
  margin:6px 0 0;
  color:var(--navy);
  font-size:27px;
}

.distance-tag{
  display:inline-flex;
  padding:6px 9px;
  border-radius:4px;
  color:#fff;
  background:var(--turq2);
  font-size:11px;
  font-weight:900;
  letter-spacing:.07em;
}

.distance-tag-pink{
  background:var(--pink);
}

.distance-tag-gold{
  background:#d8ad35;
}

.start-time{
  color:var(--navy);
  font-size:17px;
  font-weight:900;
  white-space:nowrap;
}

.map-button{
  width:100%;
  padding:0;
  border:0;
  position:relative;
  display:block;
  cursor:zoom-in;
  background:#eef3f5;
  overflow:hidden;
}

.map-button img{
  width:100%;
  min-height:280px;
  max-height:600px;
  object-fit:contain;
  background:#f1f5f6;
  transition:transform .25s ease;
}

.map-button:hover img{
  transform:scale(1.018);
}

.zoom-label{
  position:absolute;
  right:15px;
  bottom:15px;
  padding:9px 12px;
  border-radius:5px;
  background:rgba(3,31,55,.88);
  color:#fff;
  font-size:12px;
  font-weight:900;
}

.course-card-copy{
  padding:22px 26px 26px;
}

.course-card-copy p{
  margin-top:0;
  color:#5c7383;
  line-height:1.65;
}

.course-meta{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
}

.course-meta span{
  padding:8px 10px;
  border-radius:5px;
  background:#f1f7f8;
  color:#536b7a;
  font-size:12px;
}

.course-meta strong{
  color:var(--navy);
}

.image-file-note{
  margin-top:27px;
  padding:17px 19px;
  border-left:4px solid #e1ba4d;
  background:#fff7df;
  color:#665a38;
  line-height:1.65;
}

.image-file-note code{
  padding:2px 5px;
  border-radius:3px;
  background:#efe7ce;
}


/* START */

.start-grid{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:55px;
  align-items:center;
}

.start-copy p{
  color:#566e7e;
  line-height:1.7;
}

.inline-link{
  display:inline-block;
  margin-top:10px;
  color:var(--pink);
  font-weight:900;
}

.start-card{
  padding:32px;
  border-radius:13px;
  background:var(--navy);
  color:#fff;
}

.start-icon{
  color:var(--turq);
  font-size:39px;
}

.start-card>strong{
  display:block;
  margin-top:12px;
  font-size:27px;
}

.start-card>p{
  color:rgba(255,255,255,.78);
}

.start-times{
  margin-top:25px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

.start-times div{
  padding:15px;
  border:1px solid rgba(255,255,255,.15);
  border-radius:6px;
}

.start-times span{
  display:block;
  color:var(--turq);
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
}

.start-times strong{
  display:block;
  margin-top:4px;
  font-size:20px;
}


/* PRACTICAL */

.practical-section{
  background:#eef8fa;
}

.practical-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}

.practical-grid article{
  padding:28px;
  background:#fff;
  border-radius:12px;
  border:1px solid #dbe8ec;
}

.practical-icon{
  color:var(--turq2);
  font-size:32px;
}

.practical-grid h3{
  margin:12px 0;
  color:var(--navy);
}

.practical-grid p{
  color:#607686;
  line-height:1.6;
}


/* CTA */

.cta{
  padding:68px 24px;
  text-align:center;
  background:#fff;
}

.cta h2{
  margin:0;
  color:var(--navy);
  font-size:clamp(36px,4vw,54px);
}

.cta p{
  margin:15px auto 26px;
  color:#5c7181;
  font-size:18px;
}

.btn-primary-large{
  display:inline-flex;
  padding:16px 25px;
  background:var(--pink);
  color:#fff;
  border-radius:4px;
  font-weight:900;
}


/* PARTNERS */

.partners-band{
  padding:30px 24px;
  background:#eef4f7;
}

.partners-inner{
  width:min(1200px,100%);
  margin:auto;
  display:grid;
  grid-template-columns:1fr auto 1fr auto 1fr;
  align-items:center;
  gap:34px;
}

.partner-logo{
  min-height:100px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.partner-logo img{
  max-height:92px;
  width:auto;
}

.partner-logo--motion img{
  max-height:88px;
}

.partner-divider{
  width:1px;
  height:78px;
  background:rgba(6,43,77,.18);
}

footer{
  padding:24px;
  text-align:center;
  background:#03162d;
  color:rgba(255,255,255,.72);
  font-size:13px;
}


/* LIGHTBOX */

.map-lightbox{
  position:fixed;
  inset:0;
  z-index:1000;
  display:none;
  align-items:center;
  justify-content:center;
  padding:35px;
  background:rgba(0,18,34,.94);
}

.map-lightbox.open{
  display:flex;
}

.lightbox-inner{
  max-width:95vw;
  max-height:92vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
}

.lightbox-inner img{
  max-width:95vw;
  max-height:84vh;
  object-fit:contain;
  background:#fff;
  box-shadow:0 18px 70px rgba(0,0,0,.45);
}

.lightbox-title{
  color:#fff;
  font-size:14px;
  font-weight:800;
}

.lightbox-close{
  position:absolute;
  top:18px;
  right:24px;
  width:46px;
  height:46px;
  border:1px solid rgba(255,255,255,.35);
  border-radius:50%;
  background:rgba(255,255,255,.08);
  color:#fff;
  font-size:32px;
  line-height:1;
  cursor:pointer;
}


/* RESPONSIVE */

@media(max-width:1000px){

  .main-nav{
    gap:16px;
    font-size:12px;
  }

  .intro-grid,
  .start-grid{
    grid-template-columns:1fr;
  }

  .quick-facts-inner{
    grid-template-columns:repeat(3,1fr);
  }

  .partners-inner{
    grid-template-columns:1fr;
    gap:18px;
  }

  .partner-divider{
    width:120px;
    height:1px;
    margin:auto;
  }
}

@media(max-width:760px){

  .nav-inner{
    min-height:58px;
    justify-content:flex-end;
  }

  .menu-toggle{display:block}

  .main-nav{
    display:none;
    position:absolute;
    top:58px;
    left:0;
    right:0;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    background:var(--navy);
    padding:10px 18px 18px;
  }

  .main-nav.open{display:flex}

  .main-nav>a,
  .menu-dropdown-toggle{
    width:100%;
    padding:13px 10px;
    text-align:left;
    border-bottom:1px solid rgba(255,255,255,.10);
  }

  .menu-dropdown{
    display:block;
    width:100%;
  }

  .menu-dropdown-panel{
    position:static;
    width:100%;
    box-shadow:none;
    border-radius:0;
  }

  .menu-dropdown:hover .menu-dropdown-panel{
    display:none;
  }

  .menu-dropdown.open .menu-dropdown-panel{
    display:block;
  }

  .course-hero{
    min-height:325px;
  }

  .course-hero-inner{
    min-height:325px;
    width:calc(100% - 32px);
  }

  .quick-facts-inner{
    grid-template-columns:1fr 1fr;
  }

  .quick-fact{
    border-bottom:1px solid rgba(21,196,203,.25);
  }

  .quick-fact:last-child{
    grid-column:1 / -1;
  }

  .intro-section,
  .maps-section,
  .start-section,
  .practical-section{
    padding:55px 18px;
  }

  .maps-grid,
  .practical-grid{
    grid-template-columns:1fr;
  }

  .course-card:first-child{
    grid-column:auto;
  }

  .course-card-head{
    align-items:flex-start;
  }

  .map-button img{
    min-height:220px;
  }

  .start-times{
    grid-template-columns:1fr;
  }

  .map-lightbox{
    padding:18px;
  }
}
/* Expo-specific layout */
.expo-hero{min-height:390px;position:relative;color:#fff;background:url('https://cancun-half-marathon.com/images/cancun-home-hero.png') center 48%/cover no-repeat}.expo-hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,31,55,.94),rgba(3,31,55,.73) 40%,rgba(3,31,55,.18) 74%,rgba(3,31,55,.04))}.expo-hero-inner{position:relative;z-index:2;width:min(1180px,calc(100% - 48px));min-height:390px;margin:auto;display:flex;flex-direction:column;justify-content:center}.expo-hero h1{margin:10px 0 13px;font-size:clamp(48px,6vw,76px);line-height:.95;letter-spacing:-.045em}.expo-hero p{max-width:650px;margin:0;font-size:19px;line-height:1.6}.expo-facts{background:var(--navy);color:#fff}.expo-facts-inner{width:min(1180px,calc(100% - 30px));margin:auto;display:grid;grid-template-columns:repeat(4,1fr)}.expo-facts-inner>div{min-height:95px;padding:21px 24px;border-right:1px solid rgba(21,196,203,.3);display:flex;flex-direction:column;justify-content:center}.expo-facts span{color:var(--turq);font-size:11px;font-weight:900;text-transform:uppercase}.expo-facts strong{margin-top:6px;font-size:17px}.pickup-section,.schedule-section,.bib-section,.included-section,.next-section{padding:72px 24px}.intro-grid,.schedule-grid,.bib-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:center}.location-card{padding:30px;background:var(--navy);color:#fff;border-radius:13px;display:flex;gap:20px}.location-icon{font-size:38px;color:var(--turq)}.location-card strong{display:block;margin:7px 0;font-size:27px}.pickup-section,.next-section{background:var(--paper)}.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:30px}.steps-grid article{padding:29px;background:#fff;border:1px solid #dfe8ec;border-radius:12px}.step-number{color:var(--turq2);font-weight:900}.steps-grid p,.schedule-copy p,.bib-grid p{color:#5b7282;line-height:1.65}.important-box{margin-top:25px;padding:23px 26px;background:#edf9fb;border-left:5px solid var(--turq);border-radius:7px}.schedule-card{overflow:hidden;border:1px solid #dce7eb;border-radius:12px}.schedule-row{padding:21px 23px;display:flex;justify-content:space-between;border-bottom:1px solid #e3eaed}.schedule-row-alert{background:#fff3f5}.schedule-row-alert strong{color:var(--pink)}.bib-section{background:#eef8fa}.health-card{padding:30px;background:#fff;border-radius:12px;border-top:5px solid var(--pink)}.included-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:11px;margin-top:30px}.included-grid div{min-height:75px;padding:16px;display:flex;align-items:center;justify-content:center;text-align:center;background:#f3f8fa;border-radius:7px;font-weight:800}.next-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.next-grid a{padding:26px;background:#fff;border:1px solid #dfe8ec;border-radius:11px}.next-grid span{color:var(--pink);font-size:11px;font-weight:900;text-transform:uppercase}.next-grid strong{display:block;margin:8px 0 13px;font-size:22px}.next-grid em{color:var(--turq2);font-style:normal;font-weight:800}.cta{padding:68px 24px;text-align:center}.btn-primary-large{display:inline-flex;padding:16px 25px;background:var(--pink);color:#fff;border-radius:4px;font-weight:900}@media(max-width:760px){.expo-facts-inner{grid-template-columns:1fr 1fr}.intro-grid,.schedule-grid,.bib-grid,.steps-grid,.next-grid{grid-template-columns:1fr}.included-grid{grid-template-columns:1fr 1fr}.pickup-section,.schedule-section,.bib-section,.included-section,.next-section{padding:55px 18px}}