/* Men Shop legal pages: the app's dark espresso theme (app/lib/core/theme/app_theme.dart). */
@font-face { font-family: "Jost"; src: url("/fonts/Jost-Regular.ttf") format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Jost"; src: url("/fonts/Jost-Medium.ttf") format("truetype"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Inter"; src: url("/fonts/Inter-Regular.ttf") format("truetype"); font-weight: 400; font-display: swap; }

:root {
  color-scheme: dark;
  --bg: #16100B;
  --surface: #211811;
  --ink: #F4ECE3;
  --muted: #B3A394;
  --faint: #807061;
  --line: #33271D;
  --accent: #C89B6D;
}

* { box-sizing: border-box; }
html { background: var(--bg); }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font: 400 16px/1.7 "Inter", system-ui, sans-serif;
  -webkit-text-size-adjust: 100%;
}
.page { max-width: 640px; margin: 0 auto; padding: 40px 20px 32px; }

.wordmark {
  display: block;
  text-align: center;
  font: 400 15px/1 "Jost", sans-serif;
  letter-spacing: 8px;
  color: var(--ink);
  text-decoration: none;
  text-transform: uppercase;
  border: 0;
}
h1 { font: 400 26px/1.3 "Jost", sans-serif; letter-spacing: 5px; text-transform: uppercase; margin: 48px 0 4px; }
h2 { font: 500 12px/1.4 "Jost", sans-serif; letter-spacing: 4px; text-transform: uppercase; color: var(--muted); margin: 32px 0 8px; }
.meta { color: var(--muted); font-size: 14px; margin: 0; }
.rule { display: block; width: 40px; height: 2px; background: var(--accent); margin: 14px 0 0; }
.lead { color: var(--muted); margin: 20px 0 0; }
.muted { color: var(--muted); }
p { margin: 0 0 8px; }

.demo { margin: 24px 0 0; padding: 14px 16px; background: var(--surface); border-left: 2px solid var(--accent); font-size: 15px; }
.demo strong { display: block; font: 500 12px/1.4 "Jost", sans-serif; letter-spacing: 4px; color: var(--accent); margin-bottom: 4px; }

ul, ol { list-style: none; margin: 0 0 8px; padding: 0; }
li { position: relative; padding-left: 18px; margin: 6px 0; }
ul li::before { content: ""; position: absolute; left: 0; top: 0.7em; width: 6px; height: 6px; background: var(--accent); }
ol { counter-reset: step; }
ol li { padding-left: 28px; counter-increment: step; }
ol li::before { content: counter(step); position: absolute; left: 0; font-family: "Jost", sans-serif; color: var(--accent); }

a { color: var(--ink); text-decoration: none; border-bottom: 1px solid var(--accent); overflow-wrap: anywhere; }
a:hover, a:focus-visible { color: var(--accent); }
a:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
code { font: inherit; color: var(--muted); }

footer {
  margin-top: 48px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
  display: flex;
  flex-wrap: wrap;
  gap: 12px 24px;
  justify-content: space-between;
  font: 400 12px/1.4 "Jost", sans-serif;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--faint);
}
footer a { color: var(--faint); border: 0; }
footer a[aria-current="page"] { color: var(--accent); }
