/* ==========================================================================
   Lamom Paris — Stylesheet
   Design language: split-screen rioja sidebar + scrolling content column.
   Namespaced with the lp- prefix.
   ========================================================================== */

/* --- Self-hosted Bricolage Grotesque (variable, 200–800) ----------------- */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 200 800;
  font-stretch: 100%;
  font-display: swap;
  src: url('fonts/bricolage-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 200 800;
  font-stretch: 100%;
  font-display: swap;
  src: url('fonts/bricolage-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* --- Tokens -------------------------------------------------------------- */
:root {
  --lp-rioja: #6E1423;
  --lp-rioja-dark: #5A0F1C;
  --lp-cream: #F6EFE7;
  --lp-rose: #D9A9A1;
  --lp-rose-dim: #C08A81;
  --lp-white: #FFFFFF;
  --lp-ink: #1C1B1A;
  --lp-ink-2: #33302B;
  --lp-body: #4A4640;
  --lp-meta: #8A847B;
  --lp-panel: #F1EBE1;
  --lp-line: #E2DCD2;
  --lp-page: #D8D3CA;
  --lp-sans: 'Bricolage Grotesque', 'Segoe UI', system-ui, -apple-system, sans-serif;
}

/* --- Base ---------------------------------------------------------------- */
* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--lp-page);
  font-family: var(--lp-sans);
  color: var(--lp-ink);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-optical-sizing: auto;
}

a { color: inherit; text-decoration: none; }
a:hover { opacity: .7; }

img { max-width: 100%; display: block; }

:focus-visible { outline: 2px solid var(--lp-rioja); outline-offset: 2px; }

.lp-skip {
  position: absolute; left: -9999px; top: 0; z-index: 200;
  background: var(--lp-ink); color: var(--lp-cream);
  padding: 12px 18px; font-size: 15px; font-weight: 600;
}
.lp-skip:focus { left: 0; }

/* --- Advertorial disclosure strip ---------------------------------------- */
.lp-disclosure {
  background: var(--lp-ink);
  color: var(--lp-rose);
  text-align: center;
  padding: 8px 16px;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .13em;
  text-transform: uppercase;
  line-height: 1.4;
}

/* --- Shell --------------------------------------------------------------- */
.lp-shell {
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 360px 1fr;
  background: var(--lp-white);
  color: var(--lp-ink);
  align-items: start;
}

/* --- Sidebar ------------------------------------------------------------- */
.lp-side {
  background: var(--lp-rioja);
  color: var(--lp-cream);
  position: sticky;
  top: 0;
  align-self: start;
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 32px;
  padding: 40px 36px 36px;
  overflow-y: auto;
}

.lp-brand { display: block; }
.lp-brand:hover { opacity: 1; }
.lp-brand-name {
  font-size: 44px;
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: .95;
}
.lp-brand-tag {
  margin-top: 14px;
  font-size: 15px;
  line-height: 1.45;
  color: var(--lp-rose);
}

.lp-nav {
  display: flex;
  flex-direction: column;
  gap: 13px;
  margin-top: 44px;
  font-size: 19px;
  font-weight: 500;
}
.lp-nav a {
  color: var(--lp-rose);
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.lp-nav a.is-active { color: var(--lp-cream); }
.lp-nav img { width: 17px; height: 17px; flex: none; }

.lp-side-optin-title {
  font-size: 21px;
  font-weight: 600;
  line-height: 1.25;
}
.lp-side-note {
  margin-top: 11px;
  font-size: 12px;
  line-height: 1.5;
  color: var(--lp-rose-dim);
}
.lp-side-note a { text-decoration: underline; }

/* --- Form controls ------------------------------------------------------- */
.lp-input {
  width: 100%;
  font-family: var(--lp-sans);
  font-size: 15px;
  padding: 13px 14px;
  border: 0;
  background: var(--lp-cream);
  color: var(--lp-ink);
}
.lp-input::placeholder { color: #8A847B; }

.lp-btn {
  width: 100%;
  font-family: var(--lp-sans);
  font-size: 15px;
  font-weight: 600;
  padding: 13px;
  border: 0;
  background: var(--lp-ink);
  color: var(--lp-cream);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
}
.lp-btn:hover { background: #000; }
.lp-btn img { width: 16px; height: 16px; flex: none; }

.lp-side-form { margin-top: 16px; }
.lp-side-form .lp-btn { margin-top: 9px; }

.lp-consent {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  margin-top: 12px;
  font-size: 12px;
  line-height: 1.5;
  color: var(--lp-rose-dim);
  cursor: pointer;
}
.lp-consent input { margin: 2px 0 0; flex: none; accent-color: var(--lp-ink); }

.lp-form-msg {
  margin-top: 10px;
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--lp-cream);
  display: none;
}
.lp-form-msg.is-shown { display: block; }

/* --- Content column ------------------------------------------------------ */
.lp-main { min-width: 0; }

.lp-pad { padding: 40px 48px 0; }
.lp-pad-b { padding-bottom: 40px; }

/* --- Kicker (category label) --------------------------------------------- */
.lp-kicker {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 15px;
  font-weight: 600;
  color: var(--lp-rioja);
}
.lp-kicker img { width: 15px; height: 15px; flex: none; }
.lp-kicker--sm { font-size: 14px; }
.lp-kicker--sm img { width: 14px; height: 14px; }

/* --- Headlines ----------------------------------------------------------- */
.lp-lead-title {
  margin: 12px 0 0;
  font-size: clamp(38px, 4.6vw, 64px);
  font-weight: 800;
  line-height: .98;
  letter-spacing: -.035em;
  max-width: 15em;
  text-wrap: pretty;
}
.lp-lead-dek {
  margin: 18px 0 0;
  font-size: 19px;
  line-height: 1.55;
  color: var(--lp-body);
  max-width: 36em;
}
.lp-meta {
  margin-top: 16px;
  font-size: 14.5px;
  color: var(--lp-meta);
}

.lp-lead-img {
  margin-top: 26px;
  aspect-ratio: 21 / 9;
  overflow: hidden;
  background: var(--lp-panel);
}
.lp-lead-img img { width: 100%; height: 100%; object-fit: cover; }

/* --- Card grid ----------------------------------------------------------- */
.lp-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px 44px;
}
.lp-card-title {
  margin-top: 8px;
  font-size: clamp(24px, 2.2vw, 30px);
  font-weight: 600;
  line-height: 1.08;
  letter-spacing: -.025em;
  text-wrap: pretty;
}
.lp-card-dek {
  margin: 10px 0 0;
  font-size: 16px;
  line-height: 1.55;
  color: var(--lp-body);
}
.lp-card-meta {
  margin-top: 8px;
  font-size: 13.5px;
  color: var(--lp-meta);
}

/* --- Section rule -------------------------------------------------------- */
.lp-sec-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 22px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--lp-ink);
}
.lp-sec-title {
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -.02em;
  margin: 0;
}
.lp-sec-more { font-size: 14.5px; font-weight: 600; color: var(--lp-rioja); }

/* --- Stat band ----------------------------------------------------------- */
.lp-stat {
  margin: 48px 48px 0;
  background: var(--lp-panel);
  padding: 30px 34px;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 40px;
  align-items: center;
}
.lp-stat-num {
  font-size: clamp(56px, 6vw, 88px);
  font-weight: 800;
  letter-spacing: -.045em;
  line-height: 1;
  color: var(--lp-rioja);
}
.lp-stat-txt {
  font-size: 18px;
  line-height: 1.55;
  color: var(--lp-ink-2);
  max-width: 34em;
}

/* --- Article ------------------------------------------------------------- */
.lp-article-top {
  margin-top: 64px;
  border-top: 6px solid var(--lp-rioja);
  padding: 40px 48px 0;
}
.lp-article { max-width: 680px; }
.lp-article--solo { margin-top: 0; border-top: 0; }

.lp-h1 {
  margin: 12px 0 0;
  font-size: clamp(34px, 3.8vw, 52px);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -.032em;
  text-wrap: pretty;
}

.lp-standfirst {
  margin: 32px 0 0;
  font-size: 22px;
  line-height: 1.55;
  font-weight: 500;
}

.lp-article p {
  margin: 20px 0 0;
  font-size: 18px;
  line-height: 1.68;
  color: var(--lp-ink-2);
}

.lp-article h2 {
  margin: 38px 0 0;
  font-size: 28px;
  font-weight: 600;
  letter-spacing: -.02em;
  line-height: 1.15;
  text-wrap: pretty;
}
.lp-article h3 {
  margin: 28px 0 0;
  font-size: 21px;
  font-weight: 600;
  letter-spacing: -.015em;
  line-height: 1.2;
}

.lp-article ul,
.lp-article ol {
  margin: 18px 0 0;
  padding-left: 22px;
  font-size: 18px;
  line-height: 1.68;
  color: var(--lp-ink-2);
}
.lp-article li { margin-bottom: 8px; }
.lp-article li::marker { color: var(--lp-rioja); }

.lp-article strong { font-weight: 700; color: var(--lp-ink); }

.lp-article a:not(.lp-btn):not(.lp-card-link) {
  color: var(--lp-rioja);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.lp-inline-img {
  margin: 34px 0 0;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--lp-panel);
}
.lp-inline-img img { width: 100%; height: 100%; object-fit: cover; }
.lp-caption {
  margin-top: 9px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--lp-meta);
}

/* --- Panels -------------------------------------------------------------- */
.lp-panel {
  margin: 32px 0 0;
  background: var(--lp-panel);
  padding: 26px 30px;
}
.lp-panel-label {
  font-size: 15px;
  font-weight: 600;
  color: var(--lp-rioja);
}
.lp-panel p { margin: 12px 0 0; font-size: 17px; line-height: 1.6; color: var(--lp-ink-2); }
.lp-panel ul, .lp-panel ol { margin: 12px 0 0; font-size: 17px; line-height: 1.6; }
.lp-panel strong { color: var(--lp-rioja); }

.lp-note {
  margin: 28px 0 0;
  border-left: 4px solid var(--lp-rioja);
  background: var(--lp-panel);
  padding: 18px 22px;
  font-size: 16px;
  line-height: 1.6;
  color: var(--lp-ink-2);
}
.lp-note p { margin: 0; font-size: 16px; line-height: 1.6; }
.lp-note p + p { margin-top: 10px; }

/* --- Table --------------------------------------------------------------- */
.lp-table-wrap { margin: 28px 0 0; overflow-x: auto; }
.lp-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 16px;
  line-height: 1.45;
}
.lp-table th,
.lp-table td {
  text-align: left;
  padding: 12px 14px;
  border-bottom: 1px solid var(--lp-line);
  vertical-align: top;
}
.lp-table thead th {
  background: var(--lp-rioja);
  color: var(--lp-cream);
  font-weight: 600;
  font-size: 14.5px;
  border-bottom: 0;
}
.lp-table tbody tr:nth-child(even) { background: #FAF7F2; }
.lp-table td strong { color: var(--lp-rioja); }

/* --- Sources & disclaimer ------------------------------------------------ */
.lp-sources {
  margin: 44px 0 0;
  border-top: 2px solid var(--lp-ink);
  padding-top: 20px;
}
.lp-sources h2 {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--lp-rioja);
}
.lp-sources ul {
  margin: 14px 0 0;
  padding-left: 20px;
  font-size: 15px;
  line-height: 1.6;
  color: var(--lp-body);
}
.lp-sources li { margin-bottom: 10px; }
.lp-sources a { color: var(--lp-rioja); font-weight: 600; word-break: break-word; }

.lp-disclaimer {
  margin: 32px 0 0;
  background: var(--lp-panel);
  border-left: 4px solid var(--lp-rioja);
  padding: 20px 24px;
  font-size: 14.5px;
  line-height: 1.65;
  color: var(--lp-body);
}
.lp-disclaimer strong { color: var(--lp-ink); }
.lp-disclaimer p { margin: 0; font-size: 14.5px; line-height: 1.65; color: var(--lp-body); }
.lp-disclaimer p + p { margin-top: 10px; }

/* --- Opt-in band --------------------------------------------------------- */
.lp-optin {
  margin: 44px 0 56px;
  background: var(--lp-rioja);
  color: var(--lp-cream);
  padding: 34px 36px;
}
.lp-optin-label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 600;
  color: var(--lp-rose);
}
.lp-optin-label img { width: 15px; height: 15px; flex: none; }
.lp-optin-title {
  margin-top: 10px;
  font-size: clamp(24px, 2.4vw, 30px);
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -.028em;
  max-width: 20em;
}
.lp-optin-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  margin-top: 22px;
}
.lp-optin-row .lp-btn { width: auto; padding: 13px 26px; font-size: 15.5px; }
.lp-optin-row .lp-input { font-size: 15.5px; }
.lp-optin .lp-consent,
.lp-optin .lp-side-note { color: var(--lp-rose-dim); }
.lp-optin .lp-side-note { margin-top: 12px; font-size: 12.5px; }

/* --- Related ------------------------------------------------------------- */
.lp-related { margin: 0 0 56px; }
.lp-related .lp-grid { gap: 30px 44px; }

/* --- Footer -------------------------------------------------------------- */
.lp-footer {
  border-top: 1px solid var(--lp-line);
  padding: 26px 48px 34px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
  font-size: 13.5px;
  color: var(--lp-meta);
}
.lp-footer-links { display: flex; gap: 20px; flex-wrap: wrap; }

/* --- Legal pages --------------------------------------------------------- */
.lp-legal { max-width: 720px; }
.lp-legal h1 {
  margin: 0;
  font-size: clamp(32px, 3.4vw, 46px);
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: -.03em;
}
.lp-legal .lp-updated {
  margin-top: 14px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--lp-line);
  font-size: 13.5px;
  color: var(--lp-meta);
}
.lp-legal h2 {
  margin: 36px 0 0;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -.02em;
}
.lp-legal h3 { margin: 24px 0 0; font-size: 18px; font-weight: 600; color: var(--lp-rioja); }
.lp-legal p { margin: 14px 0 0; font-size: 16.5px; line-height: 1.68; color: var(--lp-ink-2); }
.lp-legal ul { margin: 14px 0 0; padding-left: 22px; font-size: 16.5px; line-height: 1.68; color: var(--lp-ink-2); }
.lp-legal li { margin-bottom: 7px; }
.lp-legal a { color: var(--lp-rioja); font-weight: 600; text-decoration: underline; }

.lp-idbox {
  margin: 22px 0 0;
  background: var(--lp-panel);
  border-left: 6px solid var(--lp-rioja);
  padding: 24px 28px;
}
.lp-idbox-name {
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -.02em;
  color: var(--lp-ink);
}
.lp-idbox-label {
  margin-top: 18px;
  font-size: 12px;
  letter-spacing: .1em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--lp-meta);
}
.lp-idbox-vat {
  margin-top: 4px;
  font-size: 30px;
  font-weight: 800;
  letter-spacing: -.01em;
  color: var(--lp-rioja);
}
.lp-idbox-rows { margin-top: 16px; font-size: 16px; line-height: 1.7; color: var(--lp-ink-2); }
.lp-idbox-rows a { color: var(--lp-rioja); font-weight: 600; }

/* --- Thank-you / newsletter page ----------------------------------------- */
.lp-hero-mark {
  width: 56px; height: 56px;
  background: var(--lp-rioja);
  display: flex; align-items: center; justify-content: center;
}
.lp-hero-mark img { width: 26px; height: 26px; }

.lp-steps { counter-reset: lp-step; margin: 26px 0 0; padding: 0; list-style: none; }
.lp-steps li {
  counter-increment: lp-step;
  position: relative;
  padding-left: 46px;
  margin-bottom: 20px;
  font-size: 17px;
  line-height: 1.6;
  color: var(--lp-ink-2);
}
.lp-steps li::before {
  content: counter(lp-step);
  position: absolute; left: 0; top: 0;
  width: 30px; height: 30px;
  background: var(--lp-rioja); color: var(--lp-cream);
  display: flex; align-items: center; justify-content: center;
  font-size: 15px; font-weight: 700;
}

/* --- Cookie banner ------------------------------------------------------- */
.lp-cookie {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 120;
  background: var(--lp-ink);
  color: var(--lp-cream);
  padding: 18px 22px;
  display: none;
}
.lp-cookie.is-shown { display: block; }
.lp-cookie-inner {
  max-width: 1160px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  flex-wrap: wrap;
}
.lp-cookie p { margin: 0; font-size: 14px; line-height: 1.55; max-width: 62em; }
.lp-cookie a { color: var(--lp-rose); text-decoration: underline; }
.lp-cookie-actions { display: flex; gap: 10px; flex: none; }
.lp-cookie-btn {
  font-family: var(--lp-sans);
  font-size: 14px; font-weight: 600;
  padding: 11px 22px; border: 0; cursor: pointer;
  background: var(--lp-cream); color: var(--lp-ink);
}
.lp-cookie-btn--ghost {
  background: transparent;
  color: var(--lp-cream);
  box-shadow: inset 0 0 0 1px var(--lp-rose-dim);
}

/* --- Responsive ---------------------------------------------------------- */
@media (max-width: 1080px) {
  .lp-shell { grid-template-columns: 300px 1fr; }
  .lp-side { padding: 32px 26px 28px; }
  .lp-pad { padding: 32px 34px 0; }
  .lp-stat { margin: 40px 34px 0; }
  .lp-article-top { padding: 34px 34px 0; }
  .lp-footer { padding: 24px 34px 30px; }
}

@media (max-width: 860px) {
  .lp-shell { display: block; }
  .lp-side {
    position: static;
    height: auto;
    display: block;
    padding: 28px 22px 26px;
  }
  .lp-nav {
    margin-top: 24px;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px 20px;
    font-size: 16px;
  }
  .lp-brand-name { font-size: 36px; }
  .lp-side-block { margin-top: 28px; }
  .lp-side-optin-title { font-size: 18px; }
  .lp-pad { padding: 28px 22px 0; }
  .lp-stat {
    margin: 34px 22px 0;
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 24px 24px;
  }
  .lp-article-top { margin-top: 44px; padding: 30px 22px 0; }
  .lp-grid { grid-template-columns: 1fr; gap: 30px; }
  .lp-optin { padding: 26px 22px; }
  .lp-optin-row { grid-template-columns: 1fr; }
  .lp-optin-row .lp-btn { width: 100%; }
  .lp-footer { padding: 22px 22px 28px; flex-direction: column; align-items: flex-start; gap: 14px; }
  .lp-standfirst { font-size: 19px; }
  .lp-article p, .lp-article ul, .lp-article ol { font-size: 17px; }
  .lp-article h2 { font-size: 24px; }
  .lp-lead-dek { font-size: 17px; }
  .lp-cookie-inner { flex-direction: column; align-items: flex-start; }
  .lp-cookie-actions { width: 100%; }
  .lp-cookie-btn { flex: 1; }
}

@media (max-width: 460px) {
  .lp-lead-img { aspect-ratio: 16 / 10; }
  .lp-idbox-vat { font-size: 24px; }
  .lp-table { font-size: 14.5px; }
  .lp-table th, .lp-table td { padding: 10px; }
}

@media print {
  .lp-side, .lp-cookie, .lp-optin, .lp-disclosure { display: none !important; }
  .lp-shell { display: block; }
}