/* =============================================================================
   Liva Mall V2 — content pages, legal documents, contact, track order, search, 404.
   PHASE 5.5. Every page here is native: no builder markup is rendered, so none of
   the Phase 5.3 colour patches for inherited builder styles remain.
   ========================================================================== */

/* ---------- Document masthead --------------------------------------------- */

.lmv2-v3 .lmv2-doc__head{padding-block:var(--s6) var(--s8)}
.lmv2-v3 .lmv2-doc__eyebrow{margin-top:var(--s6)}
.lmv2-v3 .lmv2-doc__title{margin-top:var(--s3)}
.lmv2-v3 .lmv2-doc__lede{margin-top:var(--s5);font-size:17px;line-height:1.65;color:var(--lmv2-ink-2);max-width:56ch}
.lmv2-v3 .lmv2-doc__meta{
  margin-top:var(--s4);font-family:var(--lmv2-label-ff);font-size:12px;font-weight:600;
  letter-spacing:.1em;text-transform:uppercase;color:var(--lmv2-muted);
}

/* ---------- Guide artwork (PHASE 8F) --------------------------------------
   One shared thumbnail, two presentations. Every guide image is 1672x941, a true
   16:9, with the guide's headline set INSIDE the artwork. That single fact drives
   every rule below: nothing here may crop.

   Cards therefore hold a 16:9 box and use object-fit:contain rather than cover.
   On the current seven that is a no-op, because the source is already 16:9 and
   fills the box exactly with no letterboxing. It only does anything if a future
   guide is uploaded at another ratio, and then it letterboxes instead of slicing
   a headline in half. cover would have looked identical today and quietly
   destroyed that future image, which is the kind of bug nobody finds for months.

   The article hero takes no ratio box at all: width 100% and height auto, so it
   renders at its natural ratio. width and height attributes come from WordPress,
   so the browser reserves the right space and nothing shifts as it loads. */

/* The image itself never distorts: width follows the box, height follows the image. */
.lmv2-v3 .lmv2-guidethumb__img{display:block;width:100%;height:auto}

/* The card box, and the only place a fixed ratio is imposed. */
.lmv2-v3 .lmv2-guidethumb{overflow:hidden;background:var(--lmv2-surface-2);aspect-ratio:16/9}
.lmv2-v3 .lmv2-guidethumb > .lmv2-guidethumb__img{height:100%;object-fit:contain}

/* The hero is held to the article measure, and below 1200 it centres exactly as
   .lmv2-doc__col does, so the image and the words it introduces share an edge. */
.lmv2-v3 .lmv2-doc__hero{
  margin-top:var(--s7);max-width:var(--lmv2-doc,780px);
  border-radius:var(--lmv2-radius-card);overflow:hidden;
  border:1px solid var(--lmv2-line-soft);background:var(--lmv2-surface-2);
}
@media (max-width:1199px){
  .lmv2-v3 .lmv2-doc__hero{margin-inline:auto}
}

/* PHASE 8G. Above 1200 the hero stops borrowing the reading measure and spans the
   whole content shell instead.

   The dead space it removes was not a styling accident, it was a measured 460px at
   1440: the shell is 1240 wide (article 780 + 48 gap + rail 412) and the hero was
   780. BELOW the masthead that remainder is the contents list and the help panel.
   ABOVE it there is no rail, so the same 460px was simply empty, and only on the
   right, which is what made it read as a mistake rather than as margin.

   1200 is the right boundary because it is exactly where the rail appears. Under it
   the rail dissolves and .lmv2-doc__col centres, so the leftover space is symmetric
   margin and there is nothing to fix. Removing the cap here is enough on its own:
   .lmv2-wrap already establishes the shell, so the hero inherits the same left edge
   as the H1, the lede and the article column, and the same right edge as the rail
   and the site header. No new number is invented and nothing needs centring.

   The body keeps its own measure. .lmv2-doc__col is untouched, so prose, lists and
   tables still read at 780. */
@media (min-width:1200px){
  .lmv2-v3 .lmv2-doc__hero{max-width:none}
}
/* ---------- Document layout (PHASE 6) -------------------------------------
   Policy pages, Size Guide, Track Order and generic pages used to sit inside
   .lmv2-wrap--narrow, so the WHOLE page was 720 wide while the header and footer
   were 1320. Measured on the live preview at 1536: header 1320, footer 1320,
   privacy-policy content 720, its breadcrumb 640, the size chart 640.

   Now the shell is the site container and the reading measure sits on the column.
   The width that recovers carries the contents list and the help panel, so nothing
   is stretched and nothing is wasted. Below 1024 the rail dissolves
   (display:contents) and its children return to the single column in reading order:
   contents, then the document, then the help panel.

   --lmv2-doc has a literal fallback rather than a :root declaration, because a
   second declaration at the same specificity would be decided by load order. */

.lmv2-v3 .lmv2-doc__main{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s8)}
.lmv2-v3 .lmv2-doc__col{min-width:0;max-width:var(--lmv2-doc,780px)}
/* A page with no rail has nothing to sit beside, so it centres instead of hugging
   the left edge of a container twice its width. */
.lmv2-v3 .lmv2-doc__col:only-child{margin-inline:auto}

/* The rail only earns its place once it can hold a contents list and a help card. At 1024 the
   sum was 780 + 64 gap + whatever remained, which left the rail 125px wide: measured, cramped,
   and worse than not having one. Below 1200 the page is a single centred column instead. */
@media (max-width:1199px){
  .lmv2-v3 .lmv2-doc__side{display:contents}
  .lmv2-v3 .lmv2-doc__main > .lmv2-doc__col{order:1;margin-inline:auto}
  .lmv2-v3 .lmv2-doc__side > .lmv2-toc{order:0;width:100%;max-width:var(--lmv2-doc,780px);margin-inline:auto}
  .lmv2-v3 .lmv2-doc__side > .lmv2-doc__help{order:2;width:100%;max-width:var(--lmv2-doc,780px);margin-inline:auto}
}

@media (min-width:1200px){
  .lmv2-v3 .lmv2-doc__main{grid-template-columns:minmax(0,var(--lmv2-doc,780px)) minmax(0,1fr);gap:var(--s12);align-items:start}
  /* Placed explicitly rather than by source order. legal.php puts the rail FIRST in the
     markup so the contents list is read before the document on a phone, and without
     these two rules the rail took the 780 track and the policy text got 412. */
  .lmv2-v3 .lmv2-doc__main > .lmv2-doc__col{grid-column:1;grid-row:1}
  .lmv2-v3 .lmv2-doc__main > .lmv2-doc__side{grid-column:2;grid-row:1}
  /* Sticky, but never an inner scroll area. Capping the height put a scrollbar down the
     rail and clipped the help card's email link out of reach on the longer guides. A
     sticky block taller than the viewport simply scrolls its lower half into view with
     the page, which is what a reader expects. */
  .lmv2-v3 .lmv2-doc__side{
    position:sticky;top:calc(var(--lmv2-header) + var(--s6));
    display:grid;gap:var(--s6);align-content:start;
  }
  /* In the rail the contents list is one column, not the two it uses on a wide band. */
  .lmv2-v3 .lmv2-doc__side .lmv2-toc__list{grid-template-columns:1fr}
  .lmv2-v3 .lmv2-doc__side .lmv2-doc__help{margin-bottom:0;padding:var(--s6)}
}

/* Owner content carries bare URLs. A privacy-policy link to tools.google.com/dlpage/gaoptout
   is one unbreakable token, and at 320 it pushed the document 2px past the viewport. Let long
   tokens reflow; `anywhere` rather than `break-all`, so ordinary prose still breaks on words. */
.lmv2-v3 .lmv2-doc__col,
.lmv2-v3 .lmv2-prose{overflow-wrap:anywhere}
.lmv2-v3 .lmv2-doc__col p,
.lmv2-v3 .lmv2-prose p{text-wrap:pretty}

/* Wide content earns the whole column: a size chart or a policy table is not prose. */
.lmv2-v3 .lmv2-doc__col table,
.lmv2-v3 .lmv2-doc__col .lmv2-sizetable,
.lmv2-v3 .lmv2-doc__col figure,
.lmv2-v3 .lmv2-doc__col img{max-width:100%}

.lmv2-v3 .lmv2-doc__head .lmv2-doc__title{max-width:24ch}

/* PHASE 8G-2. The masthead text kept the right-hand void that 8G removed from the
   image. Measured at 1440 with the hero already widened: the hero reaches x=1333,
   the headline's last glyph stopped at x=663 and the lede at x=685, so roughly 670px
   sat empty above a picture that now spans the whole shell. The step between the two
   was the thing that still read as unfinished.

   24ch on a 56px headline is 800px, which was a sensible cap when the hero below it
   was also 780. It is not sensible under a 1240 hero. Above 1200 the cap comes off so
   the headline anchors the same left AND right edge as the artwork, and h1 already
   carries text-wrap:balance, so the lines even out instead of leaving one short straggler.

   The lede does NOT follow it to 1240. A 17px paragraph set 1240 wide runs to about
   115 characters a line, which is roughly half as readable again as it should be. It
   moves to the article measure instead: the same --lmv2-doc the body column uses
   directly below, so it is tied to something real in this layout rather than to a
   number picked to fill space. Wide headline, readable lede, wide image. */
@media (min-width:1200px){
  .lmv2-v3 .lmv2-doc__head .lmv2-doc__title{max-width:none;text-wrap:pretty}
  .lmv2-v3 .lmv2-doc__head .lmv2-doc__lede{max-width:var(--lmv2-doc,780px)}
}
/* text-wrap:pretty is not a detail, it is the other half of the fix. h1 inherits
   text-wrap:balance from system.css, and balance deliberately EVENS the lines rather
   than filling the measure: with the cap removed the headline still wrapped to two
   lines of 831 and 786 inside a 1240 box, so 409px stayed empty and the complaint
   survived the change that was meant to answer it. Greedy wrapping fills the first
   line to the box, which puts the headline's right edge on the same line as the
   artwork's. pretty keeps the widow protection that balance was there for in the
   first place. Below 1200 balance still applies, which is correct at those widths. */

.lmv2-v3 .lmv2-doc__body{padding-bottom:var(--lmv2-section)}
.lmv2-v3 .lmv2-doc__body--commerce{max-width:none;margin-inline:0}
.lmv2-v3 .lmv2-wrap--narrow .lmv2-prose{max-width:none}
/* The column already carries the measure; a second 720 cap inside it would shrink
   the document a second time. */
.lmv2-v3 .lmv2-doc__col .lmv2-prose{max-width:none}

/* Legal documents: findable headings, a comfortable measure, tidy tables. */
.lmv2-v3 .lmv2-legal__body h2{font-size:22px;padding-top:var(--s6);margin-top:2em;border-top:1px solid var(--lmv2-line)}
.lmv2-v3 .lmv2-legal__body h2:first-child{border-top:0;padding-top:0;margin-top:0}
.lmv2-v3 .lmv2-legal__body h3{font-size:17.5px}
.lmv2-v3 .lmv2-legal__body{padding-bottom:var(--s12)}

.lmv2-v3 .lmv2-doc__help{
  margin-bottom:var(--lmv2-section);padding:var(--s8);
  border:1px solid var(--lmv2-line);border-radius:var(--lmv2-radius-card);
  background:var(--lmv2-surface);box-shadow:inset 0 1px 0 var(--lmv2-edge);
}
.lmv2-v3 .lmv2-doc__help p{color:var(--lmv2-ink-2);margin-top:var(--s3)}
.lmv2-v3 .lmv2-doc__helplinks{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s5)}

/* ---------- Contact ------------------------------------------------------- */

.lmv2-v3 .lmv2-contact{display:grid;gap:var(--lmv2-card-gap);grid-template-columns:1fr;margin-bottom:var(--s12)}
@media (min-width:600px){ .lmv2-v3 .lmv2-contact{grid-template-columns:repeat(2,1fr)} }
@media (min-width:1024px){ .lmv2-v3 .lmv2-contact{grid-template-columns:repeat(4,1fr)} }

.lmv2-v3 .lmv2-contact__card{
  display:flex;flex-direction:column;gap:2px;
  padding:var(--s6);border-radius:var(--lmv2-radius-card);
  background:var(--lmv2-surface);box-shadow:inset 0 1px 0 var(--lmv2-edge),var(--lmv2-shadow-1);
  text-decoration:none;color:inherit;
  border:1px solid var(--lmv2-line);
  transition:border-color var(--lmv2-t-micro) ease,transform var(--lmv2-t-base) ease;
}
.lmv2-v3 a.lmv2-contact__card:hover{border-color:var(--lmv2-brand-line);transform:translateY(-2px)}
.lmv2-v3 .lmv2-contact__card--lead{border-color:var(--lmv2-brand-line);background:linear-gradient(180deg,var(--lmv2-brand-ghost),transparent 70%),var(--lmv2-surface)}
.lmv2-v3 .lmv2-contact__icon{
  display:grid;place-items:center;width:44px;height:44px;margin-bottom:var(--s3);
  border-radius:12px;background:var(--lmv2-brand-ghost);color:var(--lmv2-brand-ink);
}
.lmv2-v3 .lmv2-contact__label{font-family:var(--lmv2-label-ff);font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--lmv2-muted)}
.lmv2-v3 .lmv2-contact__value{font-size:16px;font-weight:600;color:var(--lmv2-ink);margin-top:2px;overflow-wrap:anywhere}
.lmv2-v3 .lmv2-contact__note{font-size:13.5px;color:var(--lmv2-muted);margin-top:2px;display:inline-flex;gap:var(--s1);align-items:center}

.lmv2-v3 .lmv2-contactgrid{display:grid;gap:var(--s10);grid-template-columns:1fr;padding-bottom:var(--lmv2-section);align-items:start}
@media (min-width:900px){ .lmv2-v3 .lmv2-contactgrid{grid-template-columns:3fr 2fr;gap:var(--s16)} }
.lmv2-v3 .lmv2-contactform{padding:var(--s8);border-radius:var(--lmv2-radius-card);background:var(--lmv2-surface);border:1px solid var(--lmv2-line);box-shadow:inset 0 1px 0 var(--lmv2-edge),var(--lmv2-shadow-1)}
.lmv2-v3 .lmv2-contactform__body{margin-top:var(--s6)}
.lmv2-v3 .lmv2-contacthelp{padding-top:var(--s2)}
.lmv2-v3 .lmv2-contacthelp__list{display:grid;gap:var(--s5);margin-top:var(--s6)}
.lmv2-v3 .lmv2-contacthelp__list li{display:flex;gap:var(--s4);align-items:flex-start;font-size:15px;line-height:1.6;color:var(--lmv2-ink-2)}
.lmv2-v3 .lmv2-contacthelp__list strong{display:block;color:var(--lmv2-ink);font-weight:600}
.lmv2-v3 .lmv2-contacthelp__list a{display:inline-block;margin-top:2px;color:var(--lmv2-brand-ink)}
.lmv2-v3 .lmv2-contacthelp__icon{flex:0 0 auto;display:grid;place-items:center;width:40px;height:40px;border-radius:10px;background:var(--lmv2-brand-ghost);color:var(--lmv2-brand)}

/* The contact form itself. Labels are added server-side for fields the form plugin
   ships without one. */
.lmv2-v3 .lmv2-genlabel{
  display:block;font-family:var(--lmv2-label-ff);font-size:12.5px;font-weight:600;
  letter-spacing:.04em;text-transform:uppercase;color:var(--lmv2-ink-2);margin:0 0 var(--s2);
}
.lmv2-v3 .fluentform .ff-el-group{margin-bottom:var(--s5)}
.lmv2-v3 .fluentform .ff-btn-submit{margin-top:var(--s2)}
.lmv2-v3 .frm-fluent-form{max-width:none}
.lmv2-v3 .fluentform .ff-el-form-control{background:var(--lmv2-input-bg);border-color:var(--lmv2-input-border);color:var(--lmv2-ink)}
.lmv2-v3 .fluentform .ff-message-success{border:1px solid var(--lmv2-success);border-radius:var(--lmv2-radius-card);padding:var(--s4);color:var(--lmv2-ink)}

/* ---------- Track order (Liva Mall Core renders the lookup) ---------------- */

.lmv2-v3 .lmv2-trackpage__body{padding-bottom:var(--s10)}
/* The owner's own headings follow the lookup card in the page content; measured at 1280 the
   first H2 sat 15px under the card. */
.lmv2-v3 .lmv2-trackpage__body > h2,
.lmv2-v3 .lmv2-trackpage__body > h3{margin-top:var(--s10)}
.lmv2-v3 .lmv2-trackpage__body > h2 + p,
.lmv2-v3 .lmv2-trackpage__body > h3 + p{margin-top:var(--s3)}
.lmv2-v3 .lmc-track__form{
  display:grid;gap:var(--s5);padding:var(--s8);
  border-radius:var(--lmv2-radius-card);background:var(--lmv2-surface);border:1px solid var(--lmv2-line);
  box-shadow:inset 0 1px 0 var(--lmv2-edge),var(--lmv2-shadow-1);
}
@media (min-width:600px){ .lmv2-v3 .lmc-track__form{grid-template-columns:1fr auto;align-items:end} }
.lmv2-v3 .lmc-track__label{display:block;font-family:var(--lmv2-label-ff);font-size:12.5px;font-weight:600;line-height:1.3;letter-spacing:.04em;text-transform:uppercase;color:var(--lmv2-ink-2);margin-bottom:var(--s2)}
.lmv2-v3 .lmc-track__input{min-height:56px;font-size:20px;font-variant-numeric:tabular-nums;letter-spacing:.04em}
.lmv2-v3 .lmc-track__help{font-size:13.5px;color:var(--lmv2-muted);margin-top:var(--s2);line-height:1.5}
/* The hint sits INSIDE .lmc-track__field (Core markup), so it is not a grid item and a
   negative margin only pulled it over the input's bottom border (measured 12px, twice). */
/* Core renders the button with the generic `button` class; system.css paints .button on a
   surface at (0,2,2), which out-ranked the (0,2,0) rule here at phone widths (measured:
   surface-2 at 390px). Compound selector so brand wins at every width. */
body.lmv2-v3 .lmc-track__form button.lmc-track__submit.button,
.lmv2-v3 .lmc-track__submit{min-height:56px;padding-inline:var(--s8);background:var(--lmv2-brand);color:var(--lmv2-on-brand);border-color:var(--lmv2-brand)}
body.lmv2-v3 .lmc-track__form button.lmc-track__submit.button:hover,
.lmv2-v3 .lmc-track__submit:hover{background:var(--lmv2-brand-hover);border-color:var(--lmv2-brand-hover);color:var(--lmv2-on-brand)}
/* The field column holds label + input + hint, so an end-aligned button sank 28px below the
   input (measured). Top-align it and step past the label instead. */
@media (min-width:600px){ .lmv2-v3 .lmc-track__submit{align-self:start;margin-top:calc(12.5px * 1.3 + var(--s2))} }
.lmv2-v3 .lmc-track__notice{
  display:flex;gap:var(--s3);padding:var(--s4) var(--s5);margin-bottom:var(--s5);
  border:1px solid var(--lmv2-line);border-left:3px solid var(--lmv2-error);
  border-radius:var(--lmv2-radius-card);background:var(--lmv2-surface);color:var(--lmv2-ink);font-size:14.5px;line-height:1.55;
}

.lmv2-v3 .lmc-track__result{
  padding:var(--s8);border-radius:var(--lmv2-radius-card);
  background:var(--lmv2-surface);border:1px solid var(--lmv2-line);
  box-shadow:inset 0 1px 0 var(--lmv2-edge),var(--lmv2-shadow-2);
}
.lmv2-v3 .lmc-track__eyebrow{font-family:var(--lmv2-label-ff);font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--lmv2-muted)}
.lmv2-v3 .lmc-track__number{font-family:var(--lmv2-h1-ff);font-size:clamp(30px,5vw,44px);font-weight:700;letter-spacing:-.02em;line-height:1.05;margin-top:var(--s2);font-variant-numeric:tabular-nums;color:var(--lmv2-ink)}
.lmv2-v3 .lmc-track__status{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--s2) var(--s3);margin-top:var(--s5)}
.lmv2-v3 .lmc-track__statuslabel{font-size:14px;color:var(--lmv2-muted)}
.lmv2-v3 .lmc-track__statusname{
  display:inline-flex;align-items:center;min-height:30px;padding:0 var(--s3);border-radius:999px;
  background:var(--lmv2-brand-ghost);color:var(--lmv2-brand-ink);font-size:14px;font-weight:700;
}
.lmv2-v3 .lmc-track__statusname--completed{background:var(--lmv2-brand-ghost);color:var(--lmv2-success)}
.lmv2-v3 .lmc-track__statusname--cancelled,
.lmv2-v3 .lmc-track__statusname--refunded,
.lmv2-v3 .lmc-track__statusname--failed{color:var(--lmv2-error)}
.lmv2-v3 .lmc-track__note{margin-top:var(--s3);color:var(--lmv2-ink-2);line-height:1.6}

/* The four real stages, drawn as a horizontal progress line on wide screens. */
.lmv2-v3 .lmc-track__steps{display:grid;gap:var(--s4);margin-top:var(--s8);padding-top:var(--s6);border-top:1px solid var(--lmv2-line)}
@media (min-width:600px){ .lmv2-v3 .lmc-track__steps{grid-template-columns:repeat(4,1fr);gap:var(--s2)} }
.lmv2-v3 .lmc-track__step{display:flex;gap:var(--s3);align-items:center;position:relative}
@media (min-width:600px){ .lmv2-v3 .lmc-track__step{flex-direction:column;align-items:flex-start;gap:var(--s3)} }
.lmv2-v3 .lmc-track__dot{
  flex:0 0 auto;width:14px;height:14px;border-radius:50%;
  border:2px solid var(--lmv2-line-strong);background:var(--lmv2-surface);position:relative;z-index:1;
}
@media (min-width:600px){
  .lmv2-v3 .lmc-track__step:not(:last-child)::before{
    content:"";position:absolute;top:6px;left:14px;right:calc(var(--s2) * -1);height:2px;background:var(--lmv2-line);
  }
  .lmv2-v3 .lmc-track__step.is-done:not(:last-child)::before{background:var(--lmv2-success)}
}
.lmv2-v3 .lmc-track__step.is-done .lmc-track__dot{background:var(--lmv2-success);border-color:var(--lmv2-success)}
.lmv2-v3 .lmc-track__step.is-current .lmc-track__dot{background:var(--lmv2-brand);border-color:var(--lmv2-brand);box-shadow:0 0 0 4px var(--lmv2-brand-ghost)}
.lmv2-v3 .lmc-track__steplabel{font-size:14px;color:var(--lmv2-muted);font-weight:500}
.lmv2-v3 .lmc-track__step.is-done .lmc-track__steplabel{color:var(--lmv2-ink-2)}
.lmv2-v3 .lmc-track__step.is-current .lmc-track__steplabel{color:var(--lmv2-ink);font-weight:700}

.lmv2-v3 .lmc-track__facts{display:grid;gap:var(--s3);margin-top:var(--s8);grid-template-columns:1fr}
@media (min-width:600px){ .lmv2-v3 .lmc-track__facts{grid-template-columns:repeat(3,1fr)} }
.lmv2-v3 .lmc-track__facts div{padding:var(--s3) var(--s4);border-radius:var(--lmv2-radius-input);background:var(--lmv2-surface-soft);border:1px solid var(--lmv2-line)}
.lmv2-v3 .lmc-track__facts dt{font-family:var(--lmv2-label-ff);font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--lmv2-muted)}
.lmv2-v3 .lmc-track__facts dd{margin-top:2px;font-weight:600;color:var(--lmv2-ink)}
.lmv2-v3 .lmc-track__addr{line-height:1.5}
.lmv2-v3 .lmc-track__notes{margin-top:var(--s6)}
.lmv2-v3 .lmc-track__notesh{font-family:var(--lmv2-label-ff);font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--lmv2-muted)}
.lmv2-v3 .lmc-track__notes ul{display:grid;gap:var(--s3);margin-top:var(--s3)}
.lmv2-v3 .lmc-track__notes li{display:grid;gap:2px;font-size:14.5px;color:var(--lmv2-ink-2)}
.lmv2-v3 .lmc-track__notes time{font-size:12.5px;color:var(--lmv2-muted)}
.lmv2-v3 .lmc-track__again{margin-top:var(--s6)}
.lmv2-v3 .lmc-track__againlink{color:var(--lmv2-brand-ink)}

/* Belt and braces for WooCommerce's own tracking form, should it ever return. */
@media (max-width:600px){
  body.lmv2-v3 .woocommerce-form-track-order .form-row-first,
  body.lmv2-v3 .woocommerce-form-track-order .form-row-last{float:none;width:100%;margin-inline:0}
}

/* ---------- Search results ------------------------------------------------ */

.lmv2-v3 .lmv2-results{display:grid;gap:var(--s5);margin-bottom:var(--lmv2-section)}
.lmv2-v3 .lmv2-result{display:flex;gap:var(--s5);align-items:flex-start;padding-bottom:var(--s5);border-bottom:1px solid var(--lmv2-line)}
.lmv2-v3 .lmv2-result__thumb{flex:0 0 auto;width:84px;height:100px;border-radius:8px;overflow:hidden;background:var(--lmv2-surface)}
.lmv2-v3 .lmv2-result__thumb img{width:100%;height:100%;object-fit:cover}
.lmv2-v3 .lmv2-result__kind{font-family:var(--lmv2-label-ff);font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--lmv2-muted)}
.lmv2-v3 .lmv2-result__title{font-family:var(--lmv2-h3-ff);font-size:17px;font-weight:600;margin-top:2px}
.lmv2-v3 .lmv2-result__title a{text-decoration:none}
.lmv2-v3 .lmv2-result__title a:hover{color:var(--lmv2-brand)}
.lmv2-v3 .lmv2-result__excerpt{margin-top:var(--s2);color:var(--lmv2-muted);font-size:14.5px;line-height:1.6}

/* ---------- 404 ----------------------------------------------------------- */

.lmv2-v3 .lmv2-404{max-width:60ch;margin-inline:auto;text-align:center;padding-block:var(--s20)}
.lmv2-v3 .lmv2-404__code{
  font-family:var(--lmv2-h1-ff);font-size:clamp(72px,18vw,150px);font-weight:700;
  line-height:1;letter-spacing:-.03em;color:var(--lmv2-brand);opacity:.18;
}
.lmv2-v3 .lmv2-404__title{margin-top:calc(var(--s8) * -1)}
.lmv2-v3 .lmv2-404__text{color:var(--lmv2-muted);margin:var(--s4) 0 var(--s8)}
.lmv2-v3 .lmv2-404__form{display:flex;gap:var(--s2);max-width:460px;margin:0 auto var(--s8)}
.lmv2-v3 .lmv2-404__form input[type=search]{flex:1 1 auto;width:auto;min-width:0}
.lmv2-v3 .lmv2-404__ctas{display:flex;flex-wrap:wrap;gap:var(--s3);justify-content:center}
.lmv2-v3 .lmv2-404__cats{margin-top:var(--s10);justify-content:center}

/* Two forms lay a button BESIDE an input, so the phone full-width rule must not
   reach them. Compounded on body so it beats `.lmv2-v3.lmv2-btnfull .lmv2-btn--primary`. */
body.lmv2-v3.lmv2-btnfull .lmv2-404__form .lmv2-btn,
body.lmv2-v3.lmv2-btnfull .lmc-track__form .lmc-track__submit{width:auto;flex:0 0 auto}

/* ---------- Track Order: second factor (Core 1.2.0) ------------------------- */
.lmv2-v3 .lmc-track__verify{margin-top:var(--s6);padding:var(--s6);border-radius:var(--lmv2-radius-card);background:var(--lmv2-surface-soft);border:1px solid var(--lmv2-line)}
.lmv2-v3 .lmc-track__verifyh{font-family:var(--lmv2-h1-ff);font-size:20px;font-weight:700;letter-spacing:-.01em}
.lmv2-v3 .lmc-track__verifytext{margin-top:var(--s2);color:var(--lmv2-ink-2);line-height:1.6;max-width:56ch}
.lmv2-v3 .lmc-track__form--verify{margin-top:var(--s4);padding:0;background:transparent;border:0;box-shadow:none}
.lmv2-v3 .lmc-track__form--verify .lmc-track__input{font-size:18px;letter-spacing:.06em}
.lmv2-v3 .lmc-track__submit--verify{background:var(--lmv2-ink);color:var(--lmv2-bg);border-color:var(--lmv2-ink)}
.lmv2-v3 .lmc-track__submit--verify:hover{background:var(--lmv2-ink-2);border-color:var(--lmv2-ink-2);color:var(--lmv2-bg)}
.lmv2-v3 .lmc-track__verified{margin-top:var(--s6);padding-top:var(--s6);border-top:1px solid var(--lmv2-line)}
.lmv2-v3 .lmc-track__verifiedh{font-family:var(--lmv2-h1-ff);font-size:20px;font-weight:700;letter-spacing:-.01em}
.lmv2-v3 .lmc-track__verifiednote{margin-top:var(--s1);font-size:13.5px;color:var(--lmv2-muted)}
.lmv2-v3 .lmc-track__facts--pii{margin-top:var(--s4)}
@media (min-width:600px){ .lmv2-v3 .lmc-track__facts--pii{grid-template-columns:1fr 2fr} }
.lmv2-v3 .lmc-track__result.is-verified .lmc-track__number::after{content:" \2713";color:var(--lmv2-success);font-size:.6em;vertical-align:middle}

/* 5.6: legal tables scroll (owner content; the cookie table is 385px wide and pushed a 2px
   horizontal scroll at 320px). The table keeps its layout inside a scrolling block. */
.lmv2-v3 .lmv2-doc__body table,.lmv2-v3 .entry-content table,.lmv2-v3 .lmv2-legal table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}

/* ---------- Size Guide page (5.6) -------------------------------------------- */
.lmv2-v3 .lmv2-sizepage__body{margin-bottom:var(--s8)}
.lmv2-v3 .lmv2-sizepage__body .lmv2-sizetable{font-size:16px}

/* ---------- Guides: archive and article (PHASE 6B) ------------------------
   The store had no post templates before this phase, so these are new. Both sit
   on the document layout the policy pages use, which is why the article needs no
   width rules of its own: .lmv2-doc__col already carries the reading measure. */

.lmv2-v3 .lmv2-guides__grid{
  display:grid;grid-template-columns:1fr;gap:var(--lmv2-card-gap,20px);
  list-style:none;margin:0 0 var(--lmv2-section);padding:0;
}
@media (min-width:640px){ .lmv2-v3 .lmv2-guides__grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (min-width:1100px){ .lmv2-v3 .lmv2-guides__grid{grid-template-columns:repeat(3,minmax(0,1fr))} }

.lmv2-v3 .lmv2-guides__card{
  display:flex;flex-direction:column;height:100%;overflow:hidden;
  border:1px solid var(--lmv2-line);border-radius:var(--lmv2-radius-card);
  background:var(--lmv2-surface);box-shadow:inset 0 1px 0 var(--lmv2-edge),var(--lmv2-shadow-1);
  transition:box-shadow var(--lmv2-t-micro) ease,border-color var(--lmv2-t-micro) ease;
}
/* PHASE 8F. The padding moved off the card and onto this, so the artwork can meet
   the card edge instead of floating inside a frame. A card with no featured image
   simply starts with this element and looks exactly as it did before. */
.lmv2-v3 .lmv2-guides__body{
  display:flex;flex-direction:column;gap:var(--s3);flex:1 1 auto;padding:var(--s6);
}
.lmv2-v3 .lmv2-guides__card .lmv2-guidethumb{border-bottom:1px solid var(--lmv2-line-soft)}
.lmv2-v3 .lmv2-guides__card:hover{border-color:var(--lmv2-line-strong,var(--lmv2-line));box-shadow:inset 0 1px 0 var(--lmv2-edge),var(--lmv2-shadow-2)}
.lmv2-v3 .lmv2-guides__title{font-size:18.5px;line-height:1.3;font-family:var(--lmv2-h3-ff);font-weight:600}
.lmv2-v3 .lmv2-guides__title a{color:var(--lmv2-ink);text-decoration:none}
.lmv2-v3 .lmv2-guides__title a:hover{color:var(--lmv2-brand)}
.lmv2-v3 .lmv2-guides__text{font-size:14.5px;line-height:1.6;color:var(--lmv2-ink-2);flex:1 1 auto}
.lmv2-v3 .lmv2-guides__meta{
  font-family:var(--lmv2-label-ff);font-size:11.5px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--lmv2-muted);
}

/* The article itself. Tables are the one thing in these guides that outgrow prose,
   so they scroll inside their own box instead of pushing the page sideways. */
.lmv2-v3 .lmv2-post__body h2{font-size:23px;margin-top:2em;padding-top:var(--s5);border-top:1px solid var(--lmv2-line-soft)}
.lmv2-v3 .lmv2-post__body h2:first-child{border-top:0;padding-top:0;margin-top:0}
.lmv2-v3 .lmv2-post__body h3{font-size:17.5px;margin-top:1.6em}
/* width:100% matters. Without it the block-level table sized itself to the min-content
   of its own header row, and at 320 that pushed .lmv2-doc__col to 302px inside a 273px
   grid track: 13px of document overflow. Measured before and after on the live page. */
.lmv2-v3 .lmv2-post__body table{display:block;width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;font-size:15px}
.lmv2-v3 .lmv2-post__body th,.lmv2-v3 .lmv2-post__body td{padding:var(--s3) var(--s4);border-bottom:1px solid var(--lmv2-line-soft);text-align:left;vertical-align:top}
.lmv2-v3 .lmv2-post__body thead th{white-space:nowrap;font-family:var(--lmv2-label-ff);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--lmv2-muted)}
/* On the narrowest phones a nowrap header is what inflates the table's min-content, so
   the header wraps there and the table stays inside the column. */
@media (max-width:599px){ .lmv2-v3 .lmv2-post__body thead th{white-space:normal} }
.lmv2-v3 .lmv2-post__body ul,.lmv2-v3 .lmv2-post__body ol{padding-left:1.2em;display:grid;gap:var(--s2);margin-top:var(--s3)}
.lmv2-v3 .lmv2-post__body li{list-style:disc}
.lmv2-v3 .lmv2-post__body ol li{list-style:decimal}

.lmv2-v3 .lmv2-post__more{
  margin-top:var(--s10);padding-top:var(--s6);border-top:1px solid var(--lmv2-line);
  margin-bottom:var(--lmv2-section);
}
.lmv2-v3 .lmv2-post__morelist{list-style:none;margin:var(--s4) 0 0;padding:0;display:grid;gap:var(--s3)}
.lmv2-v3 .lmv2-post__morelist a{color:var(--lmv2-ink);text-decoration:none;font-size:16px;display:inline-flex;min-height:28px;align-items:center}
.lmv2-v3 .lmv2-post__morelist a:hover{color:var(--lmv2-brand);text-decoration:underline;text-underline-offset:.18em}