/* MRS official logo branding (logo-preview). Colors sampled from the official MRS logo:
   blue #286BA6 · navy #233881 · flame red-orange #DF542F · flame orange #E7792B · black #1A1919 */
:root {
  --brand-blue: #286BA6; --brand-navy: #233881; --brand-flame: #DF542F; --brand-flame-2: #E7792B; --brand-black: #1A1919;
  --accent: #DF542F; --accent-dark: #B9431F; --orange: #DF542F; --orange-hot: #E7792B;
}

/* Standard page background: the logo's own gear/blueprint line art, subtle, fixed right. */
html body {
  background-image: url("/brand/bg-gear-top.png"), url("/brand/bg-gear-bottom.png") !important;
  background-repeat: no-repeat, no-repeat !important;
  background-position: right -2rem top 4.5rem, right -2rem bottom 0 !important;
  background-size: min(680px, 78vw) auto, min(680px, 78vw) auto !important;
  background-attachment: fixed, fixed !important;
}
@media (max-width: 640px) {
  html body { background-position: right -1rem top 7.5rem, right -1rem bottom 0 !important; background-size: 88vw auto, 88vw auto !important; }
}
@media print { html body { background-image: none !important; } }

/* Header lockup: official logo on a clean white plate (the navy header would hide the black "MRS"). */
.site-header .brand { gap: .7rem; align-items: center; text-decoration: none; }
.brand-logo-plate {
  display: inline-flex; align-items: center; flex: none; line-height: 0;
  background: #fff; border-radius: 10px; padding: .3rem .55rem;
  box-shadow: 0 1px 0 rgba(255,255,255,.15), 0 2px 8px rgba(0,0,0,.25);
}
.brand-logo-plate img { display: block; height: 3.6rem; width: auto; }
.site-header .brand-name { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.site-header .brand-sub { font-size: .8rem; }
@media (max-width: 520px) {
  .brand-logo-plate { padding: .25rem .45rem; border-radius: 8px; }
  .brand-logo-plate img { height: 2.35rem; }
  .site-header .brand-sub { font-size: .66rem; max-width: 9.5rem; line-height: 1.2; }
}
@media (max-width: 350px) { .site-header .brand-sub { display: none; } }

/* Footer: training center block, above the American footer line. */
.mrs-tc-foot { border-top: 1px solid rgba(201,212,227,.18); margin-top: 1rem; padding: 1rem 0 .4rem; color: #c9d4e3; font-size: .9rem; }
.mrs-tc-foot-inner { display: flex; flex-wrap: wrap; gap: .9rem 1.4rem; align-items: center; }
.mrs-tc-foot .mrs-tc-foot-logo { display: inline-flex; background: #fff; border-radius: 10px; padding: .4rem .6rem; line-height: 0; border: 0 !important; }
.mrs-tc-foot .mrs-tc-foot-logo img { height: 4.2rem; width: auto; display: block; }
.mrs-tc-foot p { margin: 0 0 .2rem; }
.mrs-tc-foot .mrs-tc-foot-label { font-family: var(--mono, ui-monospace, monospace); font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; color: #8fa0b5; }
.mrs-tc-foot a { color: #ffd3b0; }
.mrs-tc-foot address { font-style: normal; }

/* Training center card (home section, contact page). */
.mrs-tc { padding: 2.2rem 0 2.4rem; }
.mrs-tc-card {
  background: rgba(255,255,255,.94); border: 1px solid #d8dee8; border-top: 4px solid var(--brand-blue);
  border-radius: 14px; box-shadow: 0 10px 32px rgba(10,22,40,.10); padding: 1.4rem 1.4rem 1.3rem; color: #0A1628;
}
.mrs-tc-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 1.2rem 2rem; align-items: start; }
@media (max-width: 760px) { .mrs-tc-grid { grid-template-columns: 1fr; } .mrs-tc-logo img { max-width: 260px; } }
.mrs-tc-eyebrow { font-family: var(--mono, ui-monospace, monospace); font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; color: var(--brand-blue); margin: 0 0 .35rem; font-weight: 600; }
.mrs-tc h2, .mrs-tc-card h2 { font-family: var(--display, "Barlow Condensed", sans-serif); text-transform: uppercase; letter-spacing: .02em; font-size: clamp(1.7rem, 4.5vw, 2.3rem); line-height: 1.05; margin: 0 0 .6rem; color: #0A1628; }
.mrs-tc-card p { margin: 0 0 .7rem; line-height: 1.5; color: #1c2e4a; }
.mrs-tc-list { margin: 0 0 .9rem; padding-left: 1.1rem; color: #1c2e4a; line-height: 1.5; }
.mrs-tc-list li { margin: 0 0 .25rem; }
.mrs-tc-addr { font-style: normal; background: #f3f6fa; border-left: 4px solid var(--brand-flame); border-radius: 8px; padding: .75rem .9rem; margin: 0 0 1rem; line-height: 1.5; color: #0A1628; }
.mrs-tc-addr strong { display: block; font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; color: var(--brand-navy); }
.mrs-tc-addr a { color: var(--brand-blue); font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }
.mrs-tc-actions { display: flex; flex-wrap: wrap; gap: .6rem .8rem; align-items: center; margin: 0 0 .7rem; }
.mrs-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 2.75rem; padding: .6rem 1.1rem; border-radius: 10px; font-weight: 700; text-decoration: none !important; border: 2px solid transparent; line-height: 1.2; text-align: center; }
.mrs-btn-primary { background: var(--brand-blue); color: #fff !important; }
.mrs-btn-primary:hover, .mrs-btn-primary:focus-visible { background: var(--brand-navy); }
.mrs-btn-ghost { background: #fff; color: var(--brand-navy) !important; border-color: var(--brand-blue); }
.mrs-btn-ghost:hover { background: #eef4fa; }
.mrs-tc-secondary { font-size: .95rem; margin: .2rem 0 0; }
.mrs-tc-secondary a { color: var(--brand-blue); font-weight: 700; }
.mrs-tc-logo { background: #fff; border-radius: 12px; padding: .8rem; border: 1px solid #e3e8ef; line-height: 0; text-align: center; margin: 0 0 1rem; }
.mrs-tc-logo img { width: 100%; max-width: 380px; height: auto; }
.mrs-tc-photos { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .6rem; }
.mrs-tc-photos[hidden] { display: none !important; }
.mrs-tc-photos figure { margin: 0; border-radius: 10px; overflow: hidden; background: #e9edf3; aspect-ratio: 4 / 3; }
.mrs-tc-photos img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mrs-tc-note { font-size: .98rem; margin: .8rem 0 0; }
.mrs-tc-note a { color: var(--brand-blue); font-weight: 700; }
/* Light-footer pages (how-to, 404) */
.mrs-tc-foot--light { color: #2F4F6F; border-top-color: #d8dee8; text-align: left; }
.mrs-tc-foot--light .mrs-tc-foot-inner { justify-content: center; }
.mrs-tc-foot--light a { color: var(--brand-blue); }
.mrs-tc-foot--light .mrs-tc-foot-label { color: #5a6b82; }
.mrs-tc-foot--light .mrs-tc-foot-logo { border: 1px solid #e3e8ef !important; }
.mrs-logo-standalone { margin: 0 0 1rem; line-height: 0; }
.mrs-logo-standalone .brand-logo-plate img { height: 3.6rem; }

/* Back to Home (every public page): fixed to the top of the screen so it follows scrolling (desktop + phone), 44px tap target.
   An in-flow spacer of the same height means it never covers page content; sticky page headers sit just below it;
   z-index 65 is above page headers (20-40) and under drawers/modals (70+). iOS safe area respected. */
:root{--mrs-home-h:44px;--mrs-home-top:calc(var(--mrs-home-h) + env(safe-area-inset-top,0px))}
html{scroll-padding-top:calc(var(--mrs-home-top) + .5rem)}
.mrs-home-sp{height:var(--mrs-home-top)}
.mrs-home{position:fixed;top:0;left:0;right:0;z-index:65;box-sizing:border-box;display:flex;align-items:center;gap:.4rem;height:var(--mrs-home-top);padding:env(safe-area-inset-top,0px) max(1rem,env(safe-area-inset-right,0px)) 0 max(1rem,env(safe-area-inset-left,0px));background:#1f2937;color:#fff;font:600 1rem/1.2 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;text-decoration:none;border-bottom:2px solid #E8825D;box-shadow:0 2px 6px rgba(0,0,0,.18)}
.mrs-home:hover,.mrs-home:focus-visible{background:#111827;color:#fff;text-decoration:underline}
.mrs-home:focus-visible{outline:3px solid #f6b894;outline-offset:-3px}
body .site-header{top:var(--mrs-home-top)}
@media print{.mrs-home,.mrs-home-sp{display:none}
}

