/* Flirtlanes — esprit Art nouveau bruxellois : courbes, filets fins, bordeaux sur crème */
:root {
  --bg: #fbf5ef;
  --paper: #fffaf4;
  --wine: #7b2d43;
  --wine-dark: #561c2d;
  --sage: #8fa38a;
  --ink: #2b2226;
  --muted: #7a6a6f;
  --line: #e7d8cc;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
  line-height: 1.7;
}
a { color: var(--wine); }
a:hover { color: var(--wine-dark); }

.ornament {
  height: 26px;
  background:
    radial-gradient(circle at 13px 26px, transparent 12px, var(--wine) 12px 13px, transparent 13px) repeat-x;
  background-size: 26px 26px;
  opacity: .35;
}

header { border-bottom: 1px solid var(--line); background: var(--paper); }
.header-inner {
  max-width: 980px; margin: 0 auto; padding: 18px 24px;
  display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
}
.logo {
  display: flex; align-items: center; gap: 12px;
  text-decoration: none; color: var(--wine-dark);
  font-size: 28px; font-style: italic; letter-spacing: .5px;
}
.logo svg { width: 38px; height: 38px; }
nav { display: flex; gap: 22px; font-family: -apple-system, "Segoe UI", Roboto, sans-serif; font-size: 15px; }
nav a { text-decoration: none; color: var(--muted); }
nav a:hover { color: var(--wine); }

main { max-width: 760px; margin: 0 auto; padding: 48px 24px 64px; }
.kicker {
  font-family: -apple-system, "Segoe UI", Roboto, sans-serif;
  text-transform: uppercase; letter-spacing: 3px; font-size: 13px; color: var(--sage);
}
h1 { font-size: 44px; line-height: 1.15; font-weight: normal; color: var(--wine-dark); margin: 10px 0 24px; }
h2 {
  font-size: 28px; font-weight: normal; font-style: italic; color: var(--wine);
  margin: 52px 0 14px; padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
}
.lede { font-size: 21px; color: #4a3a40; }

.arch {
  margin: 36px 0; padding: 30px 34px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 180px 180px 14px 14px;
  text-align: center;
}
.arch p { margin: 0 0 18px; color: var(--muted); font-style: italic; }

.cta {
  display: inline-block; padding: 14px 34px;
  background: var(--wine); color: #fff; text-decoration: none;
  border-radius: 999px;
  font-family: -apple-system, "Segoe UI", Roboto, sans-serif; font-size: 16px; font-weight: 600;
  box-shadow: 0 6px 18px rgba(123, 45, 67, .25);
}
.cta:hover { background: var(--wine-dark); color: #fff; }
.cta-soft {
  display: inline-block; padding: 12px 28px; border: 1px solid var(--wine);
  border-radius: 999px; text-decoration: none; color: var(--wine);
  font-family: -apple-system, "Segoe UI", Roboto, sans-serif; font-size: 15px;
}
.cta-soft:hover { background: var(--wine); color: #fff; }

.trio { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin: 34px 0; }
.trio div {
  background: var(--paper); border-top: 3px solid var(--sage);
  padding: 18px 18px 14px; font-size: 16px;
}
.trio strong { display: block; color: var(--wine-dark); font-weight: normal; font-style: italic; font-size: 19px; margin-bottom: 6px; }

.quote {
  margin: 34px 0; padding: 4px 0 4px 26px;
  border-left: 3px solid var(--wine); font-style: italic; color: #4a3a40;
}

.reads { list-style: none; padding: 0; }
.reads li { padding: 18px 0; border-bottom: 1px dashed var(--line); }
.reads a { font-size: 21px; text-decoration: none; }
.reads span { display: block; color: var(--muted); font-size: 16px; }

article p, article li { color: #3b2f33; }
.meta { font-family: -apple-system, "Segoe UI", Roboto, sans-serif; font-size: 14px; color: var(--muted); }

footer { border-top: 1px solid var(--line); background: var(--paper); }
.footer-inner {
  max-width: 980px; margin: 0 auto; padding: 24px;
  display: flex; gap: 22px; flex-wrap: wrap;
  font-family: -apple-system, "Segoe UI", Roboto, sans-serif; font-size: 14px; color: var(--muted);
}
.footer-inner a { color: var(--muted); }

@media (max-width: 700px) {
  body { font-size: 17px; }
  h1 { font-size: 34px; }
  .trio { grid-template-columns: 1fr; }
  .arch { border-radius: 120px 120px 12px 12px; padding: 26px 20px; }
}