/* getreviewmachine.com shell (2026-10-22): the product header and footer on every Review Machine page.
   The header reuses the studio .header/.nav classes, so js/main.js (phone menu, anchor offset) and
   js/rm-landing.js (#rmsubLinks section marking) keep working. Fractalic Studio sits in the footer. */

.rmh .nav{justify-content:flex-start;gap:24px}
.rmh__brand{display:flex;flex-direction:column;gap:1px;flex:0 0 auto}
.rmh__name{display:flex;align-items:center;gap:10px;font-size:19px;font-weight:700;letter-spacing:-.01em;color:var(--ink);text-decoration:none;white-space:nowrap}
.rmh__name::before{content:'';width:12px;height:12px;border-radius:3px;background:var(--accent);flex:none}
.rmh__by{font-size:12px;font-weight:500;color:var(--graphite);text-decoration:none;padding-left:22px;white-space:nowrap}
.rmh__by:hover{color:var(--accent-hover)}
.rmh .nav__list{gap:4px}
.rmh .nav__link{display:block;padding:8px 10px;border-radius:8px;font-size:15px;white-space:nowrap;text-decoration:none}
.rmh .nav__link:hover{background:var(--bg-alt)}
.rmh .nav__link.on{color:var(--accent-hover);background:var(--accent-light);font-weight:600}
.rmh__end{margin-left:auto;display:flex;align-items:center;gap:16px;flex:0 0 auto}
.rmh__price{font-size:14px;color:var(--graphite);white-space:nowrap}
.rmh__price b{color:var(--ink);font-weight:600}
.rmh .nav__cta.nav__cta--always{margin-right:0}
@media (max-width:1239px){.rmh__price{display:none}}
@media (min-width:768px) and (max-width:1099px){
  .rmh .nav{gap:14px}
  .rmh .nav__link{font-size:14px;padding:8px 7px}
  .rmh .nav__link.rmh__ind{display:none}
}
@media (max-width:767px){
  .rmh__name{font-size:17px;gap:8px}
  .rmh__name::before{width:10px;height:10px}
  .rmh__by{font-size:11px;padding-left:18px}
  .rmh__end{gap:10px}
  .rmh .nav__menu.active .nav__link{font-size:16px;padding:10px 4px}
}
@media (max-width:359px){.rmh__by{display:none}}

/* one fixed bar now (the product sub-bar is gone): anchors land just below it */
main section[id], main [id].rm-sub, main details[id]{scroll-margin-top:92px}

.rmf{background:var(--ink);color:#D1D5DB;padding:56px 0 0}
.rmf__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px}
.rmf__col{display:flex;flex-direction:column;gap:10px;font-size:15px;line-height:1.6}
.rmf__name{display:flex;align-items:center;gap:10px;font-size:19px;font-weight:700;color:#FFFFFF}
.rmf__name::before{content:'';width:12px;height:12px;border-radius:3px;background:var(--accent);flex:none}
.rmf__col p{margin:0}
.rmf__head{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#9CA3AF}
.rmf__col a{color:#E5E7EB;text-decoration:none}
.rmf__col a:hover{color:#FFFFFF;text-decoration:underline}
.rmf__col a.rmf__studio{color:#6EE7B7;font-weight:600}
.rmf__bottom{margin-top:44px;border-top:1px solid #1F2937;padding:18px 0 32px;display:flex;flex-wrap:wrap;gap:8px 24px;font-size:13px;color:#9CA3AF}
.rmf__bottom a{color:#9CA3AF}
.rmf__bottom a:hover{color:#E5E7EB}
.rmf__note{flex-basis:100%}
@media (max-width:767px){
  .rmf{padding-top:36px}
  .rmf__grid{grid-template-columns:1fr;gap:28px}
  .rmf__bottom{margin-top:28px}
}