/* ---- revltraining.com site header, copied from the live site 29 Sep 2026 (site_header.py) ---- */
@font-face{ font-family:'REVL Site Mono'; src:url('fonts/fraktion-mono-regular.woff2') format('woff2');
  font-weight:400; font-style:normal; font-display:swap; }
#rsh, #rsh *{ box-sizing:border-box; margin:0; padding:0; }
#rsh{ position:fixed; top:0; left:0; right:0; z-index:70; display:flex; align-items:center;
  min-height:120px; padding:20px 0; background-color:transparent; transition:background-color 1s;
  font-size:16px; line-height:1; letter-spacing:0; text-align:left;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; text-rendering:auto; }
#rsh.rsh-fx{ background-color:#1A1A1A; }
#rsh a{ text-decoration:none; }
#rsh ul{ list-style:none; }
#rsh img{ max-width:none; border:0; }

#rsh .rsh-logo{ flex:0 0 auto; display:flex; align-items:center; padding-left:4%; position:relative; z-index:2; }
#rsh .rsh-logo a{ display:block; padding-top:1.86px; }
#rsh .rsh-logo img{ display:block; width:157px; height:45px; object-fit:contain; object-position:center top; }

#rsh .rsh-mid{ flex:1 1 0; min-width:0; display:flex; justify-content:center; align-items:center; }
#rsh .rsh-mlogo{ display:none; }
#rsh .rsh-nav ul{ display:flex; flex-wrap:nowrap; }
#rsh .rsh-nav li{ display:flex; }
#rsh .rsh-nav a{ display:flex; align-items:center; margin:0 calc(clamp(12px, 8vw + -70px, 50px) / 2);
  padding:4px 10px; font-family:'Neue Haas Grotesk Display Pro',sans-serif; font-weight:700;
  font-size:clamp(15px, 1.25vw, 20px); line-height:27px; letter-spacing:-.02em; text-transform:uppercase;
  color:#808080; white-space:nowrap; transition:.4s; }
#rsh .rsh-nav a:hover, #rsh .rsh-nav a:focus, #rsh .rsh-nav a.is-current{ color:#FFFFFF; }
#rsh a.is-current{ text-decoration:underline; text-underline-offset:5px; }

#rsh .rsh-btn{ flex:0 0 auto; display:flex; justify-content:flex-end; align-items:center; padding-right:4%; }
#rsh .rsh-join{ position:relative; top:.6px; display:inline-flex; align-items:center; gap:10px;
  font-family:'REVL Site Mono','PP Fraktion Mono',monospace; font-weight:700; font-size:20px;
  line-height:27.2px; letter-spacing:-.02em; color:#FFFFFF; border-bottom:2px solid #FFFFFF;
  white-space:nowrap; transition:.3s; }
#rsh .rsh-join svg{ display:block; flex:0 0 auto; width:1em; height:auto; }
#rsh .rsh-join:hover{ color:rgb(204,202,187); border-color:rgb(204,202,187); }
#rsh .rsh-join:hover svg{ transform:translateX(5px); transition:transform .3s; }

#rsh .rsh-tog, #rsh .rsh-drop{ display:none; }

/* the site's type steps */
@media (max-width:1600px){
  #rsh .rsh-nav a{ padding:5px 0 0; }
  #rsh .rsh-join{ font-size:18px; }
}
@media (max-width:1300px){
  #rsh .rsh-nav a{ padding:0; }
  #rsh .rsh-join{ font-size:15px; top:1.99px; }
}
@media (max-width:1100px){ #rsh .rsh-btn{ padding-right:2%; } }

/* tablet and phone: the burger and the full-screen panel */
@media (max-width:1024px){
  #rsh{ padding:30px 0 0; }
  #rsh .rsh-logo{ flex:0 0 50%; }
  #rsh .rsh-mid{ flex:0 0 50%; justify-content:flex-end; padding-right:30px; }
  #rsh .rsh-nav, #rsh .rsh-btn{ display:none; }
  #rsh .rsh-tog{ display:flex; align-items:center; justify-content:center; position:relative; z-index:2;
    margin-left:auto; padding:7.5px; font-size:30px; line-height:1; color:#FFFFFF; cursor:pointer;
    background:none; border:0; border-radius:0; -webkit-appearance:none; appearance:none; }
  #rsh .rsh-tog span{ display:flex; line-height:1; }
  #rsh .rsh-tog svg{ display:block; width:1em; height:auto; }
  #rsh .rsh-tog .rsh-i-close{ display:none; }
  #rsh.rsh-open .rsh-tog .rsh-i-open{ display:none; }
  #rsh.rsh-open .rsh-tog .rsh-i-close{ display:flex; }
  #rsh .rsh-drop{ display:block; position:fixed; left:0; right:0; top:.13px; bottom:0; z-index:1;
    padding-top:140px; padding-bottom:50px; background-color:#1A1A1A; overflow-y:auto;
    transform:scaleY(0); transform-origin:top; visibility:hidden; transition:transform .3s, visibility 0s .3s; }
  #rsh.rsh-open .rsh-drop{ transform:scaleY(1); visibility:visible; transition:transform .3s; }
  #rsh .rsh-drop li{ display:block; }
  #rsh .rsh-drop a{ display:flex; align-items:center; padding:28px 40px; background-color:#1A1A1A;
    font-family:'Neue Haas Grotesk Display Pro',sans-serif; font-weight:700; font-size:36px; line-height:27px;
    letter-spacing:-.02em; text-transform:uppercase; color:#808080; transition:.2s linear; }
  #rsh .rsh-drop a:hover, #rsh .rsh-drop a:focus, #rsh .rsh-drop a.is-current{ color:#FFFFFF; }
}
@media (max-width:767px){
  #rsh{ min-height:0; padding:20px 20px 22px; justify-content:space-between; }
  #rsh .rsh-logo{ display:none; }
  #rsh .rsh-mid{ flex:0 0 100%; justify-content:space-between; padding-right:0; }
  #rsh .rsh-mlogo{ display:block; position:relative; z-index:2; }
  #rsh .rsh-mlogo img{ display:block; width:97px; height:53px; object-fit:contain; object-position:center center; }
  #rsh .rsh-drop{ top:-18.38px; }
  #rsh .rsh-drop a{ padding:20px 46px; font-size:32px; letter-spacing:0; }
}
/* FIND AND JOIN REVL in the panel (the site's two rules, both apply at exactly 768) */
@media (max-width:768px){
  #rsh .rsh-drop .mi-join a{ display:block; width:max-content; margin:40px 0 2px 47px; padding:0;
    border-bottom:1px solid #FFFFFF; font-size:20px; line-height:30px; color:#FFFFFF; font-weight:200; }
}
@media (min-width:768px){
  #rsh .rsh-drop .mi-join a{ margin-top:40px; margin-bottom:0; width:36%; font-size:24px; line-height:30px;
    color:#FFFFFF; font-weight:200; }
}
/* Home and FIND AND JOIN REVL live only in the burger panel, and the site hides them from 1024 up
   (so the tablet panel at exactly 1024 shows five items, as the site's does). Last, so it wins. */
@media (min-width:1024px){ #rsh ul li.mi-home, #rsh ul li.mi-join{ display:none; } }
/* ---- revltraining.com.au: where its header measures differently from .com's ---- */
#rsh.rsh-au .rsh-logo img{ object-fit:cover; object-position:50% 0; }
/* the site sets -0.02em on the 20px button and the text inherits it as -0.4px when it steps down */
#rsh.rsh-au .rsh-join{ letter-spacing:-.4px; }
@media (max-width:1600px){ #rsh.rsh-au .rsh-nav a{ padding:4px 10px; } }
@media (max-width:1300px){ #rsh.rsh-au .rsh-nav a{ padding:5px 0 0; } }
@media (max-width:1100px){ #rsh.rsh-au .rsh-btn{ padding-right:4%; } }
@media (max-width:1024px){ #rsh.rsh-au .rsh-drop{ padding-top:150px; } }