:root{
  --bg:#ffffff;
  --panel:#f9f9f9;
  --ink:#222222;
  --muted:#666666;
  --line:#dddddd;
  --accent:#0077cc;
  --accent-2:#005fa3;
  --radius:8px;
  --shadow:0 2px 8px rgba(0,0,0,.06);
  --maxw:800px;
}
*{box-sizing:border-box}
body{margin:0;font:17px/1.6 "Helvetica Neue",Helvetica,Arial,sans-serif;color:var(--ink);background:var(--bg)}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 20px}


.hero {
  padding:20px 0 10px; /* top 40px, bottom 20px */
  text-align:center;
}


.btn{display:inline-block;padding:6px 11px;border-radius:3px; /*was 12 and 22 and 6*/
     border:1px solid var(--accent);background:var(--accent);margin:5px 5px 5px 0px;
     color:#fff;font-weight:700;text-decoration:none}
.btn:hover{background:var(--accent-2);border-color:var(--accent-2)}

/* Topbar */
.topbar{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line)}
.topbar .wrap{max-width:none;padding:0 20px}
.nav{display:flex;align-items:center;justify-content:space-between;min-height:60px}
.menu{display:flex;gap:18px;list-style:none;margin:0;padding:0}
.menu a{display:block;padding:8px 6px;border-radius:4px;color:var(--ink);text-decoration:none;font-weight:500}
.menu a:hover{color:var(--accent)}

/* PTR Logo Boxes */
.logo-block{display:flex;gap:5px;font-family:Arial,sans-serif}
.logo-box{
  background:black;
  color:white;
  width:25px;
  height:25px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
  font-weight:bold;
  cursor:pointer;
  transition:transform .3s ease, background-image .3s ease, color .3s ease;
}
.logo-box.red{border-bottom:3px solid red;animation:pulseRed 3s infinite alternate ease-in-out}
.logo-box.blue{border-bottom:3px solid blue;animation:pulseBlue 2.4s infinite alternate ease-in-out}
.logo-box.yellow{border-bottom:3px solid yellow;animation:pulseYellow 3.6s infinite alternate ease-in-out}
.logo-box:hover{transform:scale(1.2) rotate(5deg);}

/* Animations */
@keyframes pulseRed {
  0%,100%{border-bottom-color:red}
  50%{border-bottom-color:rgba(255,0,0,.5)}
}
@keyframes pulseBlue {
  0%,100%{border-bottom-color:blue}
  50%{border-bottom-color:rgba(0,0,255,.5)}
}
@keyframes pulseYellow {
  0%,100%{border-bottom-color:yellow}
  50%{border-bottom-color:rgba(255,255,0,.5)}
}

.fullbleed {
  max-width:none;
  padding:0;
}
.video-wrapper {
  position:relative;
  width:100vw;
  margin-left:50%;
  transform:translateX(-50%);
  padding-bottom:56.25%; /* 16:9 */
}
.video-wrapper iframe {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}

.hero__pretitle {
  margin: 0px;  /* 10px top, 4px bottom */
  font-size: 15px;
  color: var(--muted);
  font-weight: 500;
}