:root{
  --navy:#102a43;
  --blue:#164f86;
  --cyan:#00a6ce;
  --red:#cf2b2a;
  --paper:#ffffff;
  --muted:#5d6b78;
  --error:#a61b1b;
  --success:#147446;
}

*{box-sizing:border-box}

body{
  min-height:100vh;
  margin:0;
  padding:32px 18px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  color:var(--navy);
  background:
    linear-gradient(rgba(8,28,45,.28),rgba(8,28,45,.28)),
    url("../img/background.webp") center/cover no-repeat fixed;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.35;
  background-image:linear-gradient(rgba(16,42,67,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(16,42,67,.05) 1px,transparent 1px);
  background-size:40px 40px;
}

.container{
  position:relative;
  z-index:1;
  width:min(650px,100%);
  padding:36px;
  border:1px solid rgba(22,79,134,.12);
  border-radius:22px;
  background:rgba(255,255,255,.96);
  box-shadow:0 24px 70px rgba(16,42,67,.16);
}

.form-partners,.logo-bottom{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  width:100%;
}

.form-partners{
  margin-top:5px;
  padding-top:24px;
  border-top:1px solid #e1e9ef;
}
.form-partners img,.logo-bottom img{object-fit:contain}
.form-partners img:first-child,.logo-bottom img:first-child{grid-column:2;width:190px;max-height:86px;justify-self:center}
.form-partners img:last-child,.logo-bottom img:last-child{grid-column:3;width:112px;max-height:70px;justify-self:end}
.form-partners span,.logo-bottom span{color:var(--muted);font-size:13px;text-transform:uppercase;letter-spacing:.12em;white-space:nowrap}

.eyebrow{
  margin:0 0 8px;
  color:var(--red);
  font-size:20px;
  font-weight:800;
  text-align:center;
}

h1{margin:0;text-align:center;font-size:clamp(23.2px,4vw,33.6px);line-height:1.08;letter-spacing:-.025em}
.intro{margin:10px auto 28px;text-align:center;color:#5c9303;font-size:17px;font-weight:650}
.event-logo{
  display:block;
  width:min(280px,72%);
  max-height:110px;
  margin:10px auto 24px;
  object-fit:contain;
}
.thanks-message .event-logo{
  width:min(300px,82%);
  margin:12px auto 0;
}

.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.full-width{grid-column:1/-1}
.input-group{display:flex;flex-direction:column;gap:7px}
.input-group label{font-size:13px;font-weight:750;color:var(--navy)}

input[type="text"],input[type="email"],input[type="tel"]{
  width:100%;
  min-height:48px;
  padding:12px 14px;
  border:1px solid #cbd7e1;
  border-radius:10px;
  outline:none;
  background:#fbfdff;
  color:#102a43;
  font:inherit;
  transition:border-color .2s,box-shadow .2s,background .2s;
}

input:focus{
  border-color:var(--cyan);
  box-shadow:0 0 0 4px rgba(0,166,206,.13);
  background:#fff;
}

.policy-check{
  display:grid;
  grid-template-columns:20px 1fr;
  gap:10px;
  align-items:start;
  margin:20px 0 16px;
  color:#435466;
  font-size:13px;
  line-height:1.45;
  cursor:pointer;
}

.policy-check input{width:18px;height:18px;margin:1px 0 0;accent-color:var(--blue)}

button,.calendar-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:50px;
  padding:12px 18px;
  border:0;
  border-radius:10px;
  color:#fff;
  background:#e1251a;
  box-shadow:0 10px 24px rgba(22,79,134,.22);
  font-size:25px;
  font-weight:800;
  text-decoration:none;
  cursor:pointer;
  transition:transform .18s,box-shadow .18s,opacity .18s;
}

button:hover,.calendar-btn:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(22,79,134,.28)}
button:disabled{opacity:.65;cursor:wait;transform:none}

.feedback{min-height:20px;margin:12px 0 0;text-align:center;font-size:13px;font-weight:650}
.feedback.error{color:var(--error)}
.feedback.success{color:var(--success)}
.feedback.info{color:var(--blue)}

.guest-alert-modal{
  position:fixed;
  inset:0;
  z-index:20;
  display:grid;
  place-items:center;
  padding:20px;
  background:rgba(8,28,45,.58);
}
.guest-alert-modal[hidden]{display:none}
.guest-alert-card{
  position:relative;
  width:min(470px,100%);
  padding:28px 24px 24px;
  border-radius:18px;
  border:1px solid rgba(207,43,42,.15);
  background:#fff;
  box-shadow:0 24px 70px rgba(8,28,45,.28);
  text-align:center;
}
.guest-alert-card h2{
  margin:0 36px 12px;
  color:var(--red);
  font-size:22px;
}
.guest-alert-card p{
  margin:0;
  color:#435466;
  font-size:16px;
  line-height:1.55;
}
.guest-alert-card .guest-alert-close{
  position:absolute;
  top:10px;
  right:10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px!important;
  max-width:36px;
  height:36px!important;
  min-height:36px!important;
  padding:0!important;
  border:0;
  border-radius:50%;
  background:#f3f6f8!important;
  color:var(--navy)!important;
  box-shadow:none!important;
  font-size:25px!important;
  font-weight:800;
  line-height:1;
  cursor:pointer;
}
.guest-alert-card .guest-alert-close:hover,
.guest-alert-card .guest-alert-close:focus{
  transform:none!important;
  box-shadow:none!important;
  color:#fff!important;
  background:var(--red)!important;
}

.thanks{width:min(780px,100%);text-align:center;padding:46px}
.success-mark{
  display:grid;
  place-items:center;
  width:64px;
  height:64px;
  margin:0 auto 22px;
  border-radius:50%;
  color:#fff;
  background:linear-gradient(135deg,var(--success),#32ad70);
  box-shadow:0 12px 28px rgba(20,116,70,.22);
  font-size:34px;
  font-weight:800;
}

.thanks h1{font-size:clamp(22.4px,4vw,33.6px)}
.thanks-message{max-width:650px;margin:22px auto 12px;color:#44586b;font-size:18px;line-height:1.65}
.thanks-message strong{color:var(--navy)}
.partnership{margin:0;color:var(--red);font-weight:800}

.event-details{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin:28px 0 0;
  text-align:left;
}
.event-detail{
  margin:0;
  padding:17px 18px;
  border:1px solid #d9e8f0;
  border-radius:13px;
  background:#f7fbfd;
}
.event-detail.location-detail{grid-column:1/-1}
.event-detail dt{display:flex;align-items:center;gap:9px;margin:0 0 1px;color:var(--red);font-size:20px;font-weight:600;}
.event-detail dt svg{width:34px;height:34px;fill:none;stroke:var(--red);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.event-detail dd{margin:0 0 0 43px;color:#405466;font-size:15px;line-height:1.5}
.event-detail dd strong{color:var(--navy)}
.maps-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-top:12px;
  padding:8px 14px;
  border:2px solid var(--red);
  border-radius:8px;
  color:var(--red);
  background:#fff;
  font-size:13px;
  font-weight:800;
  line-height:1;
  text-decoration:none;
  transition:background .18s,color .18s,transform .18s;
}
.maps-btn:hover{color:#fff;background:var(--red);transform:translateY(-1px)}

.calendar-card{margin:32px 0 22px;padding:24px;border-radius:16px;background:#f4f9fc;border:1px solid #d9e8f0}
.calendar-card h2{margin:0 0 5px;font-size:22px}
.calendar-card p{margin:0 0 18px;color:var(--muted);font-size:14px}
.calendar-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.calendar-btn{min-height:46px;padding:10px;font-size:13px;box-shadow:none;gap:8px}
.calendar-brand-icon{width:21px;height:21px;flex:0 0 auto;display:block}
.calendar-btn.google{border:2px solid #0b57d0;background:#0b57d0;color:#ffffff}
.calendar-btn.outlook{border:2px solid #164f86;background:#fff;color:#164f86}
.calendar-btn.apple{border:2px solid #24292f;background:#24292f;color:#fff}


.mail-status{margin:0;color:var(--muted);font-size:13px}
.logo-bottom{margin-top:30px;padding-top:24px;border-top:1px solid #e1e9ef}

@media (max-width:640px){
  body{padding:16px;align-items:flex-start}
  .container,.thanks{padding:26px 20px;border-radius:16px}
  .form-partners{margin-top:22px;padding-top:20px}
  .form-partners img:first-child,.logo-bottom img:first-child{width:138px}
  .form-partners img:last-child,.logo-bottom img:last-child{width:82px}
  .form-partners span,.logo-bottom span{font-size:9px}
  .form-grid,.calendar-actions{grid-template-columns:1fr}
  .event-logo{width:min(240px,82%)}
  .event-details{grid-template-columns:1fr}
  .event-detail.location-detail{grid-column:auto}
  .full-width{grid-column:auto}
  .thanks-message{font-size:16px}
}
