/* MUNGO Fret & Transit — tarifs (complète styles.css ; ordre des couches déclaré dans styles.css) */
@layer pages {
  /* ---------- tarifs ---------- */
  .rules { display: grid; gap: var(--sp-5); grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); }
  .rule { padding: 1.5rem; border-radius: var(--r-3); background: var(--c-white); display: grid; gap: 0.6rem; align-content: start; }
  .rule__ic { width: 2.25rem; height: 2.25rem; color: var(--c-orange-text); }
  .formula { padding: 0.6rem 0.8rem; border-radius: var(--r-2); background: var(--c-marine); color: var(--c-white); font-size: 0.9375rem; font-weight: 600; letter-spacing: 0.02em; overflow-wrap: anywhere; }
  .rule p:last-child { color: var(--c-muted); font-size: 0.9375rem; }
  .calc { display: grid; gap: var(--sp-5); margin-top: var(--sp-6); grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); }
  .calc__case { margin: 0; padding: 1.5rem; border-radius: var(--r-3); background: var(--c-white); display: grid; gap: 1rem; grid-template-rows: 15rem auto; }
  .calc__svg { width: auto; height: auto; max-width: 100%; margin: auto auto 0; overflow: visible; }
  .calc__case > svg { min-height: 0; }
  .calc__lbl { font-family: var(--font-mono); font-weight: 600; font-size: 20px; fill: var(--c-marine); }
  .calc__case h3 { margin-bottom: 0.2rem; }
  .calc__lines { display: grid; gap: 0.4rem; margin-top: 0.75rem; font-size: 0.8125rem; padding: 0.75rem; border-radius: var(--r-2); background: var(--c-beton); }
  .calc__lines b { color: var(--c-marine); }
  .calc__verdict { display: flex; gap: 0.4em; align-items: center; margin-top: 0.75rem; font-weight: 700; color: var(--c-ok); font-size: 0.9375rem; }
  .opts { display: grid; gap: var(--sp-4); }
  .opts li { display: flex; gap: 1rem; padding: 1.2rem 1.25rem; border-radius: var(--r-3); background: var(--c-white); }
  .opts li > .i { width: 2.25rem; height: 2.25rem; padding: 0.45rem; border-radius: var(--r-2); background: var(--c-orange-pale); color: var(--c-orange-text); }
  .opts h3 { font-size: 1.0625rem; margin-bottom: 0.25rem; }
  .opts p { color: var(--c-muted); font-size: 0.9375rem; }
  .incl { display: grid; gap: var(--sp-5); grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); }
  .incl__col { padding: 1.5rem; border-radius: var(--r-3); border: 2px solid var(--c-ok); }
  .incl__col--no { border: 2px dashed var(--c-line); }
  .incl__col h3 { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.9rem; }
  .incl__col--yes h3 .i { color: var(--c-ok); } .incl__col--no h3 .i { color: var(--c-stop); }
  .incl__col ul { display: grid; gap: 0.5rem; padding-left: 1.1rem; list-style: square; }
  .incl__col li::marker { color: var(--c-orange); }
  .pay { display: grid; gap: var(--sp-4); margin-top: var(--sp-4); }
  .pay li { padding: 1.1rem 1.2rem; border-radius: var(--r-3); background: var(--c-white); border-left: 4px solid var(--c-marine); }
  .pay h3 { font-size: 1.0625rem; margin-bottom: 0.2rem; }
  .pay p { color: var(--c-muted); font-size: 0.9375rem; }

  /* ---------- estimateur ---------- */
  .est { display: grid; gap: var(--sp-6); align-items: start; }
  @media (min-width: 64em) { .est { grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); } .est__out { position: sticky; top: calc(var(--header-h) + 1.5rem); } }
  .est__main { display: grid; gap: var(--sp-5); }
  .est__rows { display: grid; gap: var(--sp-4); }
  .prow { border: 1px solid var(--c-line-soft); border-radius: var(--r-3); padding: 1.1rem 1.2rem 1.2rem; background: var(--c-beton); display: grid; gap: 0.75rem; min-width: 0; }
  .prow__t { font-family: var(--font-mono); font-size: 0.75rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-orange-text); font-weight: 600; padding: 0; float: left; width: 100%; margin-bottom: 0.25rem; }
  .prow__grid { display: grid; gap: 0.9rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 9.5rem), 1fr)); clear: both; }
  .prow__grid .dims { grid-column: 1 / -1; }
  .dims__row { display: flex; align-items: center; gap: 0.4rem; }
  .dims__row .field__input { width: 5.5rem; text-align: center; }
  .dims__row span { color: var(--c-muted); font-weight: 700; }
  .prow__flat { grid-column: 1 / -1; font-size: 0.9375rem; padding: 0.6rem 0.8rem; border-radius: var(--r-2); background: var(--c-white); color: var(--c-marine); font-weight: 600; }
  .prow__rm { justify-self: start; }
  .est__add { justify-self: start; }
  .est__opts { display: grid; gap: 1.1rem; padding: 1.2rem; border-radius: var(--r-3); border: 1px solid var(--c-line-soft); }
  .est__out { display: grid; gap: 0.75rem; }
  .est__out .card { box-shadow: var(--sh-2); border-color: transparent; }
  .est__empty { display: grid; justify-items: center; text-align: center; gap: 0.75rem; padding: 2.5rem 1.5rem; border-radius: var(--r-3); border: 2px dashed var(--c-line); color: var(--c-muted); }
  .est__empty-ic { width: 2.5rem; height: 2.5rem; color: var(--c-line); }
  .est__acts { display: flex; flex-wrap: wrap; gap: 0.5rem; }
  .est__err { padding: 0.9rem 1rem; border-radius: var(--r-2); background: var(--c-stop-bg); color: #6E1712; font-weight: 600; }

}