/* Metal Signage — architectural design layer over the Brand Site templates + tool styles. */
body.mst{--ms-ink:#16181c;--ms-graphite:#22262c;--ms-steel:#8a929c;--ms-line:#d9dde2;--ms-soft:#f1f2f4;--ms-red:#d7141c;--ms-red-d:#b30f16;--ms-metal:linear-gradient(135deg,#eceef1 0%,#c9ced4 38%,#f4f5f7 52%,#b7bdc4 100%);color:#1d2025}
body.mst h1,body.mst h2,body.mst h3{letter-spacing:-.01em}
body.mst :focus-visible{outline:3px solid var(--ms-red);outline-offset:2px}

/* Header: light, crisp, thin metal rule */
body.mst .hdr{background:#fff;border-bottom:1px solid var(--ms-line);box-shadow:0 1px 0 rgba(255,255,255,.6) inset}
body.mst .topbar{background:var(--ms-ink);color:#cfd3d8}
body.mst .topbar a{color:#fff}

/* Hero: dark architectural showcase with a dusk glow */
body.mst .hero{background:radial-gradient(120% 90% at 85% 10%,rgba(255,240,220,.10),transparent 55%),radial-gradient(80% 60% at 10% 100%,rgba(215,20,28,.14),transparent 60%),linear-gradient(160deg,#0d0f12 0%,#1b1f25 55%,#262b32 100%);color:#f3f4f6;position:relative;overflow:hidden}
body.mst .hero::after{content:"";position:absolute;inset:auto 0 0 0;height:3px;background:var(--ms-metal);opacity:.55}
body.mst .hero h1{color:#fff}
body.mst .hero .lead,body.mst .hero .lead p{color:#cfd4da}
body.mst .hero .kicker{color:#ff6b70;text-transform:uppercase;letter-spacing:.14em;font-size:.78rem;font-weight:600}
body.mst .hero .crumbs,body.mst .hero .crumbs a{color:#9aa2ab}
body.mst .hero .chips li{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);color:#e7e9ec}
body.mst .hero .btn-ghost{color:#fff;border-color:rgba(255,255,255,.4)}
body.mst .hero-art{background:var(--ms-metal);color:#2a2e34;box-shadow:0 20px 60px rgba(0,0,0,.45)}
body.mst .hero-card{background:#fff;color:var(--ms-ink)}

/* Alternate dark showcase and light information sections */
body.mst .blk{padding-block:clamp(28px,4vw,48px)}
body.mst.mst-tpl-home .blk:nth-of-type(even),body.mst.mst-tpl-generic .blk:nth-of-type(4n+3){background:var(--ms-graphite);color:#e9ebee;border-radius:14px;padding-inline:clamp(18px,3vw,36px);margin-block:18px}
body.mst.mst-tpl-home .blk:nth-of-type(even) h2,body.mst.mst-tpl-generic .blk:nth-of-type(4n+3) h2{color:#fff}
body.mst.mst-tpl-home .blk:nth-of-type(even) a,body.mst.mst-tpl-generic .blk:nth-of-type(4n+3) a{color:#ff8a8f}
body.mst .blk h2{position:relative;padding-top:14px}
body.mst .blk h2::before{content:"";position:absolute;top:0;left:0;width:44px;height:3px;border-radius:2px;background:var(--ms-red)}
body.mst .fam,body.mst .card{transition:transform .25s ease,box-shadow .25s ease}
body.mst .fam:hover,body.mst .card:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(18,20,24,.12)}
body.mst .ftr{background:#0f1114;color:#b7bdc4}
body.mst .ftr a{color:#e6e8eb}

/* ---------- Tools ---------- */
.ms-note{font-size:.85rem;color:#6a717a;margin:.6em 0 0}
.mst .blk[style] .ms-note,.mst .blk:nth-of-type(even) .ms-note{color:#a7aeb6}
.ms-tag{position:absolute;left:10px;bottom:10px;background:rgba(10,12,15,.72);color:#fff;font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;padding:3px 8px;border-radius:999px}
.ms-btn,.ms-btn-s{font:inherit;font-weight:600;border-radius:10px;padding:.75em 1.3em;cursor:pointer;border:2px solid var(--ms-red,#d7141c)}
.ms-btn{background:var(--ms-red,#d7141c);color:#fff}.ms-btn:hover{background:var(--ms-red-d,#b30f16)}
.ms-btn-s{background:transparent;color:inherit;border-color:#9aa1a9}
.ms-btn[disabled]{opacity:.6;cursor:wait}

/* Day / night */
.ms-dn{margin:18px 0}
.ms-dn-stage{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:2/1;background:#111;box-shadow:0 18px 40px rgba(0,0,0,.25)}
.ms-dn-stage svg{display:block;width:100%;height:100%}
.ms-dn-day,.ms-dn-night{position:absolute;inset:0}
.ms-dn-bar{position:absolute;top:0;bottom:0;width:2px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.2);transform:translateX(-1px);pointer-events:none}
.ms-dn-l{left:10px;top:10px;bottom:auto}.ms-dn-r{left:auto;right:10px;top:10px;bottom:auto}
.ms-dn-ctl{display:flex;flex-direction:column;gap:6px;margin-top:10px;font-size:.9rem;font-weight:500}
.ms-dn-ctl input{width:100%;accent-color:var(--ms-red,#d7141c)}

/* Tabs explorers */
.ms-x{margin:18px 0}
.ms-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.ms-tabs button{font:inherit;font-size:.9rem;padding:.5em 1em;border-radius:999px;border:1px solid #b9bfc6;background:#fff;color:#1d2025;cursor:pointer}
.ms-tabs button[aria-selected=true]{background:#16181c;color:#fff;border-color:#16181c}
.ms-panel{border:1px solid var(--ms-line,#d9dde2);border-radius:14px;padding:16px;background:#fff;color:#1d2025}
.ms-panel a{color:var(--ms-red-d,#b30f16)!important}
.ms-split{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:20px;align-items:center}
.ms-art{position:relative;border-radius:10px;overflow:hidden;aspect-ratio:2/1}.ms-art svg{width:100%;height:100%;display:block}
.ms-swatch{aspect-ratio:2/1;border-radius:10px;display:grid;place-items:center;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.ms-swatch span{font:800 clamp(64px,10vw,120px)/1 Poppins,system-ui,sans-serif;color:rgba(0,0,0,.18);text-shadow:0 1px 0 rgba(255,255,255,.6)}
.ms-dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0}
.ms-dl dt{font-weight:600;color:#4a5058}.ms-dl dd{margin:0}
.ms-more{font-weight:600}

/* Gallery */
.ms-filters{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin-bottom:8px}
.ms-filters label{display:flex;flex-direction:column;font-size:.8rem;font-weight:600;gap:4px}
.ms-filters select{font:inherit;font-size:.9rem;padding:.45em .6em;border-radius:8px;border:1px solid #b9bfc6;min-width:150px}
.ms-cards{list-style:none;padding:0;margin:10px 0 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.ms-card{border-radius:12px;overflow:hidden;background:#fff;color:#1d2025;border:1px solid var(--ms-line,#d9dde2);transition:transform .25s,box-shadow .25s}
.ms-card:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(0,0,0,.12)}
.ms-card-art{position:relative;aspect-ratio:2/1}.ms-card-art svg{width:100%;height:100%;display:block}
.ms-card-b{padding:12px 14px}.ms-card-b h3{font-size:1rem;margin:0 0 4px}.ms-card-b p{margin:0 0 6px;font-size:.85rem;color:#5d646d}
.ms-card-b a{color:var(--ms-red-d,#b30f16)!important;font-weight:600;font-size:.9rem}
.ms-count{font-size:.85rem;color:#6a717a;min-height:1.2em;margin:4px 0}

/* Search / areas */
.ms-find{margin:18px 0}
.ms-lbl{display:block;font-weight:600;margin-bottom:6px}
.ms-find input[type=search]{width:100%;max-width:520px;font:inherit;padding:.75em 1em;border-radius:10px;border:1px solid #9aa1a9}
.ms-area-g h3{font-size:.95rem;margin:16px 0 6px;text-transform:uppercase;letter-spacing:.08em}
.ms-area-g ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:6px}
.ms-area-g a{display:inline-block;padding:.35em .8em;border-radius:999px;border:1px solid #b9bfc6;text-decoration:none;font-size:.9rem}
.ms-hits{list-style:none;padding:0;margin:8px 0}.ms-hits li{padding:6px 0;border-bottom:1px solid var(--ms-line,#d9dde2)}.ms-hits span{font-size:.8rem;color:#7a818a}

/* Quote builder + multi-site */
.ms-qb{margin:10px 0 24px}
.ms-qb form{background:#fff;color:#1d2025;border:1px solid var(--ms-line,#d9dde2);border-radius:16px;padding:clamp(16px,3vw,28px)}
.ms-qb a{color:var(--ms-red-d,#b30f16)!important}
.ms-steps{list-style:none;display:flex;flex-wrap:wrap;gap:6px;padding:0;margin:0 0 18px;counter-reset:s}
.ms-steps li{font-size:.82rem;padding:.4em .8em;border-radius:999px;background:var(--ms-soft,#f1f2f4);color:#5d646d;cursor:default}
.ms-steps li span{display:inline-grid;place-items:center;width:1.5em;height:1.5em;border-radius:50%;background:#c3c8ce;color:#fff;font-weight:700;margin-right:4px}
.ms-steps li[aria-current]{background:#16181c;color:#fff}.ms-steps li[aria-current] span,.ms-steps li.done span{background:var(--ms-red,#d7141c)}
.ms-steps li.done{cursor:pointer}
.ms-step{border:0;padding:0;margin:0 0 8px}.ms-step legend{font-size:1.2rem;font-weight:700;margin-bottom:12px;padding:0}
.ms-g2{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.ms-f{margin:0 0 14px;border:0;padding:0}
.ms-f>label,.ms-rad legend{display:block;font-weight:600;font-size:.92rem;margin-bottom:5px}
.ms-f small{font-weight:400;color:#7a818a}
.ms-f input:not([type=checkbox]):not([type=radio]),.ms-f select,.ms-f textarea{width:100%;font:inherit;padding:.65em .8em;border-radius:9px;border:1px solid #9aa1a9;background:#fff;color:#1d2025}
.ms-f [aria-invalid=true]{border-color:#c0141b;box-shadow:0 0 0 1px #c0141b}
.ms-rad label,.ms-chk{display:flex;gap:8px;align-items:flex-start;font-weight:400;font-size:.92rem;margin:4px 0}
.ms-rad{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:2px 12px}.ms-rad legend{grid-column:1/-1}
.ms-help{font-size:.8rem;color:#6a717a;margin:4px 0 0}
.ms-err{color:#b0141a;font-size:.85rem;font-weight:600;margin:4px 0 0}
.ms-nav{display:flex;gap:10px;justify-content:flex-end;margin-top:8px}
.ms-status{margin:12px 0 0;font-weight:600}.ms-status.ms-bad{color:#b0141a}
.ms-sum{background:var(--ms-soft,#f1f2f4);border-radius:10px;padding:12px 14px}
.ms-done{background:#fff;color:#1d2025;border:1px solid var(--ms-line,#d9dde2);border-left:4px solid var(--ms-red,#d7141c);border-radius:14px;padding:22px}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.ms-cond[hidden],.ms-step[hidden]{display:none}

/* Sticky mobile actions */
.mst-mbar{display:none}
@media (max-width:820px){
  .mst-mbar{display:grid;grid-template-columns:1fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:60;box-shadow:0 -6px 20px rgba(0,0,0,.18)}
  .mst-mbar a{display:block;text-align:center;padding:14px 8px;font-weight:700;text-decoration:none;font-size:.95rem}
  .mst-mbar-q{background:#d7141c;color:#fff}.mst-mbar-c{background:#16181c;color:#fff}
  body.mst{padding-bottom:52px}
  .ms-split,.ms-g2{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  body.mst *,body.mst *::before,body.mst *::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
  body.mst .fam:hover,body.mst .card:hover,.ms-card:hover{transform:none}
}