@font-face{ font-family:'Atletico'; src:url('../fonts/Atletico-Regular.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face{ font-family:'Atletico'; src:url('../fonts/Atletico-Bold.woff2') format('woff2'); font-weight:700; font-style:normal; font-display:swap; }
@font-face{ font-family:'Polin'; src:url('../fonts/Polin-Regular.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face{ font-family:'Polin'; src:url('../fonts/Polin-Semibold.woff2') format('woff2'); font-weight:600; font-style:normal; font-display:swap; }

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  background:#F5F7F6;
  color:#0C3B42;
  font-family:'Polin', system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

.page{
  position:relative;
  min-height:100vh;
  min-height:100svh;
  overflow:hidden;
  display:flex;
  flex-direction:column;
}

/* atmosphere */
.orb{ position:absolute; border-radius:50%; pointer-events:none; z-index:0; }
.orb-teal{ top:-220px; right:-180px; width:640px; height:640px; background:radial-gradient(circle, rgba(63,180,155,.16), transparent 68%); animation:drift 14s ease-in-out infinite; }
.orb-coral{ bottom:-200px; left:-160px; width:520px; height:520px; background:radial-gradient(circle, rgba(225,85,59,.10), transparent 70%); animation:drift 18s ease-in-out infinite reverse; }
.ring{ position:absolute; bottom:70px; left:9%; width:300px; height:300px; border:1px solid rgba(225,85,59,.16); border-radius:50%; pointer-events:none; z-index:0; }

/* top bar */
.topbar{ position:relative; z-index:2; padding:34px clamp(20px,8vw,120px) 0; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.brand{ display:flex; align-items:center; gap:12px; }
.brand .name{ font-weight:600; font-size:15px; letter-spacing:.02em; }
.year{ font-size:13px; letter-spacing:.24em; color:#5C6E6B; font-weight:600; }

/* center */
.center{ position:relative; z-index:2; flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:48px clamp(20px,8vw,120px) 64px; }

.eyebrow{ display:inline-flex; align-items:center; gap:12px; color:#BC4127; font-weight:600; font-size:clamp(13px,2.6vw,15px); letter-spacing:.05em; margin-bottom:26px; }
.eyebrow .line{ width:clamp(18px,5vw,28px); height:1.5px; background:#E1553B; }

h1{
  font-family:'Atletico', sans-serif;
  font-weight:700;
  font-size:clamp(38px,10.5vw,116px);
  line-height:.98;
  letter-spacing:-0.01em;
  margin:0;
  color:#0C3B42;
  text-wrap:balance;
}
h1 .hbr{ display:inline; }

.subtitle{ font-family:'Atletico',sans-serif; font-weight:400; font-size:clamp(19px,3.4vw,30px); color:#48605F; margin:26px 0 0; text-wrap:balance; }
.presenters{ font-family:'Polin',sans-serif; font-size:clamp(15px,2.8vw,17px); color:#5C6E6B; margin:14px 0 0; }

.quote{
  margin:clamp(26px,4vw,34px) 0 0;
  padding-top:clamp(20px,3vw,26px);
  border-top:1px solid #DDE6E4;
  font-family:'Atletico',sans-serif;
  font-size:clamp(17px,3vw,24px);
  color:#0C3B42;
  max-width:640px;
  text-wrap:balance;
}

/* footer */
.foot{ position:relative; z-index:2; padding:0 clamp(20px,8vw,120px) 30px; text-align:center; font-size:13px; color:#5C6E6B; line-height:1.6; }

/* entrance — enhancement only; content is visible at rest */
@keyframes drift{ 0%,100%{ transform:translate(0,0); } 50%{ transform:translate(24px,-20px); } }
@keyframes rise{ from{ transform:translateY(20px); } to{ transform:translateY(0); } }
.fade{ opacity:1; animation:rise .85s cubic-bezier(.2,.7,.2,1); }
.fade.d1{ animation-delay:.05s; }
.fade.d2{ animation-delay:.15s; }
.fade.d3{ animation-delay:.28s; }
.fade.d4{ animation-delay:.36s; }
.fade.d5{ animation-delay:.46s; }

@media (prefers-reduced-motion: reduce){
  .fade{ opacity:1; animation:none; }
  .orb-teal, .orb-coral{ animation:none; }
}

/* tablet */
@media (max-width:900px){
  .orb-teal{ width:460px; height:460px; top:-160px; right:-120px; }
  .orb-coral{ width:380px; height:380px; }
  .ring{ width:220px; height:220px; bottom:40px; }
}
/* mobile */
@media (max-width:560px){
  .topbar{ padding-top:24px; }
  .brand .name{ font-size:14px; }
  .center{ padding-top:24px; padding-bottom:48px; }
  h1 .hbr{ display:none; }
  .ring{ display:none; }
  .orb-teal{ width:340px; height:340px; top:-120px; right:-90px; }
  .orb-coral{ width:300px; height:300px; bottom:-140px; left:-110px; }
}