/* Lorne & Vale · practice-area landing pages (fr/avocats/*.html, lawyers/*.html).
   Loaded after lv.css. Only what the landing template needs beyond the design
   system: the hero stage (enquiry card, sequence rail, iPhone), the situation
   cards, the worked economics example. Everything else is lv.css. */

/* ---------- Hero stage: enquiry → rail → iPhone ---------- */
.hero--landing{padding-bottom:clamp(48px,6vw,84px)}
.hero--landing .hero__copy{max-width:920px}
.hero--landing .hero__copy .lead{max-width:680px}
.lstage{position:relative;max-width:var(--wrap);margin:clamp(40px,5vw,64px) auto 0;padding:0 max(20px,env(safe-area-inset-left)) 0 max(20px,env(safe-area-inset-right));display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:clamp(20px,3.5vw,48px);align-items:center}
.lstage .enq{margin:0;max-width:none;box-shadow:var(--sh-2)}
.lstage__seq{flex-direction:column;align-items:flex-start;gap:8px;margin:0}
.lstage__seq li span{display:inline}
.lstage__seq li.is-on{box-shadow:var(--sh-1)}
.lstage__phone{--pw:clamp(220px,22vw,290px)}
.lstage__phone img{filter:drop-shadow(0 34px 70px rgba(0,0,0,.3))}
.hero--landing .figcap{margin-top:22px}
@media (max-width:900px){
  .lstage{grid-template-columns:1fr;justify-items:center;gap:26px}
  .lstage .enq{max-width:560px;width:100%}
  .lstage__seq{flex-direction:row;justify-content:center;align-items:center;gap:6px}
  .lstage__phone{--pw:min(60vw,260px)}
}
@media (max-width:420px){.lstage__seq li{font-size:12px;padding:6px 9px 6px 7px}}

/* ---------- Situations (three intake cases) ---------- */
.sit{display:flex;flex-direction:column;gap:0}
.sit__hd{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.sit__hd .chip{font-size:12px;padding:4px 10px}
.sit__q{font-size:15.5px;line-height:1.55;color:var(--ink);margin-top:10px}
.sit__lab{display:block;margin-top:22px;padding-top:16px;border-top:1px solid var(--line2);font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3)}
.sit__dl{display:grid;gap:12px;margin-top:12px}
.sit__dl dt{font-size:12.5px;font-weight:600;color:var(--ink3);letter-spacing:.01em}
.sit__dl dd{font-size:14.5px;line-height:1.5;color:var(--ink2);margin-top:2px}
.sit__dl dd b{color:var(--ink);font-weight:600}

/* ---------- Worked economics example ---------- */
.eco{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:16px;align-items:stretch;max-width:1040px;margin:0 auto}
.eco>*{min-width:0}
.eco .out__vs:first-of-type{border-top:0}
.eco__rows{margin-top:18px}
.eco__rows .out__vs{padding:11px 0}
.eco__rows .out__vs b{font-size:15px}
/* space-between pinned the CTA to the card floor, leaving up to 500px of
   empty grey beside the taller assumptions card. */
/* The side column ends where its content ends: stretched to the taller
   assumptions card it left a large empty band under the call to action. */
.eco__side{display:flex;flex-direction:column;justify-content:flex-start;gap:clamp(20px,3vw,40px);align-self:start}
.eco .eco__stat{font-size:clamp(2.4rem,4.4vw,3.4rem);font-weight:700;letter-spacing:-.034em;line-height:1;font-variant-numeric:tabular-nums}
@media (max-width:860px){.eco{grid-template-columns:1fr}}

/* ---------- Security notes ---------- */
.notclaim{max-width:760px;margin:28px auto 0;text-align:center;font-size:14px;line-height:1.55;color:var(--ink2)}

/* ---------- Zoomed product windows ----------
   lv.css gives every img max-width:100%, which caps the enlarged image of a
   .zoom figure at the figure's width and leaves a blank strip on the right.
   Scoped to the landing pages so the shared sheet is untouched. */
body[data-landing] .zoom img{max-width:none}
@media (max-width:900px){body[data-landing] .story .zoom img{max-width:100%}}

/* ---------- Compact pricing: custom tier ----------
   In lv.css the "Sur mesure" amount and its description share one grid cell
   with a 120px offset, which the French amount overruns. Same fix as
   pricing-page.css, scoped to the landing pages. */
body[data-landing] .tier--custom .tier__pay{padding-left:184px}
@media (max-width:960px){body[data-landing] .tier--custom .tier__pay{padding-left:0}}