/* ==========================================================================
   Lamar Homes inner pages. Loads after /assets/styles.css and /redesign.css
   and reuses the homepage recipes by name (lh-hero, lh-creds, lh-head,
   lh-ledger cells, lh-seq, lh-book, lh-embed, lh-arx, lh-vet, lh-rev,
   lh-final). Base concept: the conversion spine (inner-c), with the grafts
   the judges asked for: the measured city-hero calendar reserve and the
   three-column proof row, the hairline reviewer strip and the purple
   featured review, the white calculator sheet on sand with the purple-900
   result panel, the table card with the overflow-aware fade, the sticky
   split figure, 44px breadcrumb targets, and a booking band that goes sand
   whenever it would sit within two sections of another dark band.
   Brand tokens and rgba tints only. Work Sans only. Every layout class is
   emitted by the generator (no :has()), and nothing here uses !important.
   ========================================================================== */

/* ---------- Rhythm: --lh-sec sections, hairlines instead of colour flips ---------- */
.section { padding-block: var(--lh-sec); background: var(--white); }
.section--tight { padding-block: var(--lh-sec-tight); }
.section--cream { background: var(--sand); }
main > .section + .section { border-top: var(--lh-hair); }
main > .section + .section--cream, main > .section--cream + .section { border-top: var(--lh-hair-soft); }
main > .section.section--dark, main > .section.lh-bookband, main > .section.lh-alertband,
main > .section--dark + .section, main > .lh-alertband + .section { border-top: 0; }
.section--dark { background: var(--purple-950); color: rgba(255, 255, 255, .78); }
.section--dark .eyebrow { color: var(--gold-300); }
.section--dark .eyebrow::before { background: var(--gold-300); }

/* Sentence case: the base sheet still uppercases these. */
.page-hero h1, .hero h1, .hero__kicker, .cta-band h2, .step h3, .social-cta h3, .swatch__name { text-transform: none; }

/* Loose paragraphs dropped straight into a wrap read at prose width. */
.section > .wrap > p { max-width: 72ch; }
.section > .wrap > p + p { margin-top: 18px; }
.section > .wrap > p + .table-wrap, .section > .wrap > .note + p, .section > .wrap > .table-wrap + p,
.section > .wrap > p + .feature-grid, .section > .wrap > .note + .feature-grid, .section > .wrap > .feature-grid + p,
.section > .wrap > p + .split, .section > .wrap > .feature-grid + .table-wrap, .section > .wrap > .feature-grid + .est__disclaimer,
.section > .wrap > .steps-v + .est__disclaimer { margin-top: clamp(26px, 3vw, 36px); }
.section > .wrap > .section-head + p { margin-top: 0; }
.section > .wrap > .est__disclaimer { font-size: .95rem; line-height: 1.6; color: var(--muted); }
.section > .wrap > .est__disclaimer a { color: var(--purple-700); font-weight: 650; text-decoration: underline; text-underline-offset: 3px; }
.lh-fine { max-width: 72ch; font-size: .88rem; line-height: 1.6; color: var(--muted); }
.section > .wrap > .section-head + .lh-fine { margin-top: -8px; }
.btn-row--after { margin-top: clamp(28px, 3.5vw, 40px); }
.section > .wrap > .btn-row { margin-top: 4px; }
.section > .wrap > .section-head + .btn-row { margin-top: -8px; }
.section > .wrap > .prose--intro { max-width: 72ch; }
.section > .wrap > .prose--intro p { font-size: var(--fs-lead); color: var(--body); }
.section > .wrap > .prose--intro p + p { font-size: var(--fs-body); }

/* 44px targets on inline text links: vertical padding on an inline box paints
   and hit-tests without changing the line box, so links still wrap. */
main :is(p, li, td, dd, figcaption, strong, em, b) > a:not(.btn):not(.service__link):not(.lh-book__phone) { padding-block: 14px; }
/* A phone number never breaks across two lines. */
main a[href^="tel:"], .lh-nowrap { white-space: nowrap; }
/* Breadcrumb links: 44px targets without growing the line box. */
.breadcrumb { font-size: .78rem; color: rgba(255, 255, 255, .62); }
.breadcrumb a { display: inline-block; padding-block: 12px; margin-block: -12px; }
.breadcrumb [aria-current] { color: var(--gold-300); }

/* ==========================================================================
   Page hero: the homepage hero with the H1 and lead swapped in, one framed
   photo, and the four trust chips rendered as the credential sheet that
   slides over the hero foot. The wrap becomes display:contents so the sheet
   can span full-bleed while the copy and photo keep the wrap measure; the
   side columns derive from --wrap and --gutter so the copy edge lines up
   with every section below at every viewport.
   ========================================================================== */
.lh-phero {
  position: relative; isolation: isolate; overflow: hidden;
  background: linear-gradient(180deg, var(--purple-900) 0%, var(--purple-950) 100%);
  color: rgba(255, 255, 255, .82);
  padding: clamp(44px, 5.5vw, 72px) 0 0;
  display: grid;
  grid-template-columns:
    [full-start] minmax(var(--gutter), calc((100% - var(--wrap)) / 2 + var(--gutter)))
    [copy-start] minmax(0, 1.08fr)
    [copy-end] clamp(32px, 5vw, 64px)
    [media-start] minmax(0, .92fr)
    [media-end] minmax(var(--gutter), calc((100% - var(--wrap)) / 2 + var(--gutter))) [full-end];
  grid-template-rows: auto auto auto auto auto clamp(56px, 7vw, 92px) auto;
  align-items: start;
}
.lh-phero > .wrap { display: contents; }
.lh-phero > .wrap > * { grid-column: copy; justify-self: start; min-width: 0; }
.lh-phero .breadcrumb { grid-row: 1; }
.lh-phero .eyebrow { grid-row: 2; margin-top: 22px; color: var(--gold-300); }
.lh-phero .eyebrow::before { background: var(--gold-300); }
.lh-phero h1 {
  grid-row: 3; margin-top: 16px;
  font-size: var(--lh-h1); font-weight: 850; color: var(--white);
  letter-spacing: -.03em; line-height: 1.04; max-width: 12.2em;
}
.lh-phero .page-hero__lead { grid-row: 4; margin-top: 20px; font-size: var(--fs-lead); color: rgba(255, 255, 255, .8); max-width: 46ch; }
.lh-phero .lh-phero__cta { grid-row: 5; margin-top: 30px; gap: 12px; }
.lh-phero .btn--lg { padding: 17px 30px; font-size: 1rem; }

.lh-phero .lh-phero__photo {
  grid-column: media; grid-row: 1 / 6; justify-self: stretch; align-self: center;
  margin: 0; position: relative; aspect-ratio: 7 / 5; width: 100%;
  border-radius: var(--lh-r); overflow: hidden;
  box-shadow: var(--shadow-xl); background: var(--purple-800);
}
.lh-phero__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
.lh-phero__photo::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(to top, rgba(21, 8, 34, .45), transparent 42%); }
/* per-photo framing */
.lh-phero__photo img[src*="dsc05258"] { object-position: 50% 6%; }
.lh-phero__photo img[src*="crew-raleigh"] { object-position: 50% 8%; }
.lh-phero__photo img[src*="dsc05314"] { object-position: 50% 55%; }
/* Portrait photo: the frame shows the roof and crew, and the yard sign at the foot stays out of it. */
.lh-phero__photo img[src*="completed-asphalt-shingle"] { object-position: 50% 6%; }
.lh-phero__photo img[src*="professional-roofing-services"] { object-position: 50% 60%; }
.lh-phero__photo img[src*="team-lamarhomes-roofing"] { object-position: 50% 30%; }
.lh-phero__photo img[src*="lamar-homes-roofing-team"] { object-position: 50% 40%; }
.lh-phero__photo img[src*="skilled-roofers"] { object-position: 50% 40%; }
.lh-phero__photo img[src*="storm-damage-roof-restoration"] { object-position: 50% 40%; }
.lh-phero__photo img[src*="snapinsta"] { object-position: 50% 62%; }
.lh-phero__photo img[src*="paint.webp"] { object-position: 50% 40%; }

/* The credential sheet: white (or sand, matched to the first section),
   rounded, shadowed, full-bleed via the section's ::after painted into the
   same grid row; the chips sit on top of it in hairline cells. */
.lh-phero--sheet::after {
  content: ""; grid-column: full; grid-row: 7; align-self: stretch;
  background: var(--white); border-radius: 28px 28px 0 0;
  box-shadow: 0 -18px 50px rgba(21, 8, 34, .22);
}
.lh-phero--sand::after { background: var(--sand); }
.lh-phero .lh-creds__row {
  grid-column: copy-start / media-end; grid-row: 7; justify-self: stretch;
  position: relative; z-index: 1; margin: 0;
  display: grid; grid-template-columns: .84fr 1.04fr .96fr 1.26fr; gap: 0;
  padding: clamp(22px, 2.8vw, 30px) 0 clamp(20px, 2.4vw, 26px);
  color: var(--ink);
}
.lh-phero .chip {
  display: grid; grid-template-columns: 36px minmax(0, 1fr); align-items: center; column-gap: 14px; min-width: 0;
  padding: 4px clamp(14px, 2vw, 26px); border: 0; border-left: var(--lh-hair-soft); border-radius: 0;
  background: none; color: var(--ink);
  font-size: .92rem; font-weight: 800; letter-spacing: -.01em; text-transform: none; line-height: 1.25;
}
.lh-phero .chip:first-child { border-left: 0; padding-left: 0; }
.lh-phero .chip > svg { width: 36px; height: 36px; color: var(--gold-600); grid-column: 1; grid-row: 1 / 3; }
.lh-phero .chip--rating { grid-template-rows: auto auto; row-gap: 5px; }
.lh-phero .chip--rating .lh-stars { grid-column: 2; grid-row: 1; }
.lh-phero .chip--rating .lh-stars svg { width: 13px; height: 13px; color: var(--gold-400); }
/* Pages without chips (guides, tools, legal, 404) keep a plain foot and the
   first section slides over it with the same rounded sheet. */
.lh-phero--plain { grid-template-rows: auto auto auto auto auto 0 0; padding-bottom: clamp(76px, 9vw, 120px); }
.lh-phero--plain + .section, .lh-phero--plain + .lh-final {
  position: relative; z-index: 3; margin-top: -28px;
  border-radius: 28px 28px 0 0; box-shadow: 0 -18px 50px rgba(21, 8, 34, .2); border-top: 0;
}
.lh-phero--nophoto { grid-template-columns: [full-start] minmax(var(--gutter), calc((100% - var(--wrap)) / 2 + var(--gutter))) [copy-start media-start] minmax(0, 1fr) [copy-end media-end] minmax(var(--gutter), calc((100% - var(--wrap)) / 2 + var(--gutter))) [full-end]; }
.lh-phero--nophoto h1 { max-width: 16em; }
.lh-phero--sheet + .section { padding-top: clamp(44px, 5.5vw, 72px); border-top: 0; }
.lh-phero--sheet + .section--cream { padding-top: clamp(44px, 5.5vw, 72px); }

/* ==========================================================================
   City hero (page_hero_calendar): the homepage booking split. Copy at left,
   the calendar at right in the purple-600 card, on the solid brand gradient.
   ========================================================================== */
.lh-hero-city { background: linear-gradient(180deg, var(--purple-900) 0%, var(--purple-950) 100%); color: rgba(255, 255, 255, .82); }
.lh-hero-city::after { display: none; }
.lh-hero-city .hero__inner { padding-block: clamp(40px, 5vw, 64px) clamp(56px, 7vw, 96px); }
.lh-hero-city .hero__stack { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 5vw, 72px); align-items: start; justify-items: stretch; }
.lh-hero-city .hero__copy { max-width: none; text-align: left; min-width: 0; }
.lh-hero-city .hero__flag {
  margin: 20px 0 0; padding: 8px 14px 8px 10px;
  background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .14);
  font-size: .82rem; font-weight: 650; letter-spacing: .01em; text-transform: none; color: var(--white);
}
.lh-hero-city h1 { margin-top: 22px; font-size: var(--lh-h1); font-weight: 850; letter-spacing: -.03em; line-height: 1.04; color: var(--white); }
.lh-hero-city .hero__lead { margin: 20px 0 0; max-width: 46ch; font-size: var(--fs-lead); color: rgba(255, 255, 255, .8); }
.lh-hero-city .chips { margin-top: 26px; padding-top: 20px; border-top: 1px solid rgba(255, 255, 255, .12); gap: 10px 22px; }
.lh-hero-city .chip { padding: 0; border: 0; background: none; font-size: .86rem; font-weight: 650; letter-spacing: 0; text-transform: none; color: rgba(255, 255, 255, .86); }
.lh-hero-city .chip svg { width: 16px; height: 16px; }
.lh-hero-city .hero__kicker { margin-top: 28px; font-size: 1.05rem; font-weight: 750; letter-spacing: -.01em; color: var(--white); max-width: 30ch; }
.lh-hero-city .hero__phone { margin-top: 12px; padding-block: 6px; min-height: 44px; font-size: clamp(1.9rem, 1.35rem + 2.2vw, 3rem); }
.lh-hero-city .hero__phone svg { width: .72em; height: .72em; }
.lh-hero-city .hero__phone:hover { transform: none; color: var(--white); }
.lh-hero-city .hero__proof { margin-top: 26px; padding-top: 22px; gap: 0; grid-template-columns: repeat(3, minmax(0, 1fr)); justify-content: stretch; }
.lh-hero-city .hero__proof > div { padding: 0 20px; border-left: 1px solid rgba(255, 255, 255, .14); min-width: 0; }
.lh-hero-city .hero__proof > div:first-child { padding-left: 0; border-left: 0; }
.lh-hero-city .hero__proof dt { font-size: 1.7rem; letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.lh-hero-city .hero__proof dd { margin-top: 6px; font-size: .8rem; letter-spacing: 0; text-transform: none; font-weight: 600; line-height: 1.4; color: rgba(255, 255, 255, .66); }
/* The embed column carries no transform or transition and a real min-width,
   so the GHL width probe never sees a 0px box. */
.lh-hero-city .hero__booking { max-width: none; min-width: 280px; }
.lh-hero-city .hero__booking .embed-card { padding: 0; background: var(--purple-600); border: 1px solid rgba(255, 255, 255, .16); box-shadow: var(--shadow-xl); overflow: hidden; border-radius: var(--lh-r); }
.lh-hero-city .hero__booking .embed-card iframe { border-radius: 11px; }
.lh-hero-city .hero__booking .lh-embed::before { color: rgba(255, 255, 255, .72); }
.lh-hero-city .hero__booking-note { margin-top: 14px; text-align: left; font-size: .92rem; color: rgba(255, 255, 255, .7); }

/* Calendar reserve for the hero column, measured Sept 2026. Above 1100 the
   calendar sits in the 7/12 column, the same width as the homepage, so the
   homepage values in redesign.css apply. Below that the hero stacks and the
   calendar takes the full wrap (max 860px), which renders the wide two-panel
   layout. */
@media (max-width: 1100px) { .lh-hero-city .lh-embed--hero { --lh-cal: 872px; } }
/* The widget switches to its narrow layout once the iframe is 718px or less:
   at 810 the column is still 728px wide and renders 872. */
@media (max-width: 810px) { .lh-bookband .lh-embed--cal { --lh-cal: 872px; } }
@media (max-width: 809px) { .lh-hero-city .lh-embed--hero, .lh-bookband .lh-embed--cal { --lh-cal: 740px; } }
@media (max-width: 690px) { .lh-hero-city .lh-embed--hero { --lh-cal: 794px; } }
@media (max-width: 480px) { .lh-hero-city .lh-embed--hero { --lh-cal: 744px; } }
@media (max-width: 372px) { .lh-hero-city .lh-embed--hero { --lh-cal: 775px; } }

/* ==========================================================================
   Section heads: the homepage .lh-head (left H2 with the dash eyebrow, the
   sub in the right column). In a --sidehead section the head becomes a
   sticky sidebar beside the prose or the FAQ list.
   ========================================================================== */
.section-head {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "eye sub" "h2 sub";
  align-items: end; gap: 0 40px; max-width: none; margin-inline: 0; text-align: left;
  margin-bottom: clamp(30px, 4vw, 48px);
}
.section-head .eyebrow { grid-area: eye; align-self: start; justify-self: start; }
.section-head h2 { grid-area: h2; margin-top: 14px; font-size: var(--lh-h2); }
.section-head p { grid-area: sub; margin-top: 0; font-size: var(--fs-lead); color: var(--muted); max-width: 48ch; align-self: end; text-wrap: pretty; }
.section--dark .section-head p { color: rgba(255, 255, 255, .72); }
.section-head--areas h2 { font-size: clamp(1.25rem, 1.05rem + .7vw, 1.6rem); }

.section--sidehead > .wrap { display: grid; grid-template-columns: minmax(0, .42fr) minmax(0, .58fr); gap: clamp(28px, 4vw, 64px); align-items: start; }
.section--sidehead > .wrap > .section-head { display: block; margin-bottom: 0; position: sticky; top: 96px; }
.section--sidehead > .wrap > .section-head p { margin-top: 12px; max-width: 40ch; }
.section--sidehead > .wrap > .prose { max-width: none; }
.section--sidehead > .wrap > .faq { max-width: none; margin: 0; }

/* ---------- Prose ---------- */
.prose h2 { font-size: var(--lh-h2); margin-top: clamp(34px, 4vw, 48px); }
.prose h2:first-child { margin-top: 0; }
.prose h3 { font-size: 1.2rem; margin-top: 30px; }
.prose > p:first-child { font-size: var(--fs-lead); color: var(--body); }
.prose ul li::before { margin-top: 11px; }
.section > .wrap > .prose { max-width: 72ch; }

/* ---------- Split: the .lh-about grid, figure travels with long copy ---------- */
.split, .split--wide-left { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(36px, 5vw, 80px); align-items: start; }
.split--wide-left { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); }
.split h2 { margin-top: 16px; font-size: var(--lh-h2); }
.split .prose { margin-top: 20px; max-width: none; }
.split .prose > p:first-child { font-size: var(--fs-lead); }
.split__media { margin: 0; position: sticky; top: 104px; align-self: start; aspect-ratio: 4 / 3; border-radius: var(--lh-r); overflow: hidden; box-shadow: var(--shadow-lg); background: var(--cream); }
.split__media img { width: 100%; height: 100%; object-fit: cover; border-radius: 0; box-shadow: none; }
.split__media img[src*="dependable-results"] { object-position: 50% 30%; }
.split__media img[src*="lamar-homes-roofing-team"] { object-position: 50% 40%; }
.split__media img[src*="completed-asphalt-shingle"] { object-position: 50% 0; }
.split__media img[src*="truck-and-crew-crop"] { object-position: 40% 50%; }
.split__media--logo { aspect-ratio: 4 / 3; box-shadow: var(--shadow-sm); background: var(--white); border: var(--lh-hair-soft); padding: clamp(28px, 4vw, 56px); }
.split__media--logo img { height: 100%; object-fit: contain; }
.split__media--banner { aspect-ratio: auto; box-shadow: var(--shadow-md); }
.split__media--banner img { height: auto; }
.prose .btn { margin-top: 4px; }
.prose .steps-v { margin-top: 0; }
.prose .steps-v li::before { margin-top: 0; }
.prose .steps-v li > div > * + * { margin-top: 8px; }
.prose .steps-v h3 { margin-top: 0; }

/* ==========================================================================
   Cards become hairline cells (the homepage ledger), except reviews, embeds
   and the calculator sheet, which keep the 12px card recipe.
   ========================================================================== */
.feature-grid { grid-template-columns: repeat(auto-fit, minmax(min(236px, 100%), 1fr)); gap: clamp(28px, 3.4vw, 40px) clamp(24px, 3vw, 44px); }
.feature-grid--2 { grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); }
.feature-grid--n3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.feature-grid--n4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.feature-grid--n6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.feature-grid--n5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.feature-grid--n7, .feature-grid--n8 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.feature {
  background: none; border: 0; border-top: var(--lh-hair); border-radius: 0;
  padding: 22px 0 0; box-shadow: none; transition: none; min-width: 0;
}
.feature:hover { transform: none; box-shadow: none; }
.section--cream .feature { background: none; }
.feature__icon { width: 44px; height: 44px; border-radius: 50%; background: var(--purple-800); color: var(--gold-300); box-shadow: none; }
.feature__icon svg { width: 20px; height: 20px; }
.feature h3 { margin-top: 16px; font-size: 1.08rem; }
.feature > h3:first-child { margin-top: 0; }
.feature p { margin-top: 9px; font-size: .95rem; color: var(--muted); }
.feature__price { margin-top: 8px; font-size: 1.1rem; color: var(--gold-700); }
.feature .service__link { margin-top: 10px; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-size: .88rem; font-weight: 750; color: var(--purple-700); }
.feature .service__link svg { width: 15px; height: 15px; transition: transform .25s var(--lh-ease); }
.feature .service__link:hover svg { transform: translateX(4px); }

/* Ledger mode (no icons): the homepage "Choose Lamar Homes" cells with a
   gold numeral, hairline-left, first column flush. */
.feature-grid--ledger { gap: 0; border-top: var(--lh-hair); counter-reset: lg; }
.feature-grid--ledger > .feature { counter-increment: lg; border-top: 0; border-left: var(--lh-hair-soft); padding: 26px 26px 12px; }
.feature-grid--ledger > .feature::before { content: counter(lg, decimal-leading-zero); display: block; font-size: .8rem; font-weight: 800; letter-spacing: .14em; color: var(--gold-700); }
.feature-grid--ledger > .feature > h3:first-child { margin-top: 12px; }
.feature-grid--ledger > .feature h3 { margin-top: 12px; font-size: 1.06rem; }
.feature-grid--ledger > .feature p { margin-top: 8px; font-size: .93rem; }
.feature-grid--ledger.feature-grid--n2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.feature-grid--ledger.feature-grid--n3, .feature-grid--ledger.feature-grid--n6, .feature-grid--ledger.feature-grid--n5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.feature-grid--ledger.feature-grid--n4, .feature-grid--ledger.feature-grid--n7, .feature-grid--ledger.feature-grid--n8 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.feature-grid--ledger.feature-grid--n2 > .feature:nth-child(2n+1),
.feature-grid--ledger.feature-grid--n3 > .feature:nth-child(3n+1),
.feature-grid--ledger.feature-grid--n5 > .feature:nth-child(3n+1),
.feature-grid--ledger.feature-grid--n6 > .feature:nth-child(3n+1),
.feature-grid--ledger.feature-grid--n4 > .feature:nth-child(4n+1),
.feature-grid--ledger.feature-grid--n7 > .feature:nth-child(4n+1),
.feature-grid--ledger.feature-grid--n8 > .feature:nth-child(4n+1) { border-left: 0; padding-left: 0; }
.feature-grid--ledger.feature-grid--n3 > .feature:nth-child(n+4),
.feature-grid--ledger.feature-grid--n5 > .feature:nth-child(n+4),
.feature-grid--ledger.feature-grid--n6 > .feature:nth-child(n+4),
.feature-grid--ledger.feature-grid--n4 > .feature:nth-child(n+5),
.feature-grid--ledger.feature-grid--n7 > .feature:nth-child(n+5),
.feature-grid--ledger.feature-grid--n8 > .feature:nth-child(n+5) { border-top: var(--lh-hair-soft); margin-top: 14px; }
.feature h3 > a { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); min-height: 44px; margin-block: -10px; transition: color .25s var(--lh-ease); }
.feature h3 > a::after { content: ""; width: 8px; height: 8px; flex: none; border-top: 2px solid var(--gold-600); border-right: 2px solid var(--gold-600); transform: rotate(45deg); opacity: .85; transition: transform .35s var(--lh-ease); }
.feature h3 > a:hover { color: var(--purple-800); }
.feature h3 > a:hover::after { transform: rotate(45deg) translate(2px, -2px); }

/* Numbered steps: .lh-seq */
.steps-v { gap: 0; }
.steps-v li { background: none; border: 0; border-top: var(--lh-hair); border-radius: 0; box-shadow: none; padding: 22px 0; grid-template-columns: 46px minmax(0, 1fr); gap: 18px; align-items: start; }
.steps-v li:first-child { border-top: 0; padding-top: 4px; }
.steps-v li::before { content: counter(s); width: 44px; height: 44px; border-radius: 50%; background: var(--purple-800); color: var(--gold-300); font-size: .98rem; letter-spacing: 0; }
.steps-v h3 { font-size: 1.08rem; padding-top: 9px; }
.steps-v p { margin-top: 8px; font-size: .95rem; color: var(--body); }
.steps-v--grid { grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: var(--lh-hair); }
.steps-v--grid li { grid-template-columns: 1fr; gap: 14px; border-top: 0; border-left: var(--lh-hair-soft); padding: 24px 24px 8px; }
.steps-v--grid li:first-child { padding-top: 24px; }
.steps-v--grid li:nth-child(3n+1) { border-left: 0; padding-left: 0; }
.steps-v--grid li:nth-child(n+4) { border-top: var(--lh-hair-soft); }
.steps-v--grid h3 { padding-top: 0; }

/* Contact cells: gold labels, icons flush left */
.contact-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; }
.contact-card { background: none; border: 0; border-left: var(--lh-hair-soft); border-radius: 0; box-shadow: none; padding: 4px 26px 0; min-width: 0; }
.contact-card:first-child { border-left: 0; padding-left: 0; }
.contact-card__icon { display: flex; justify-content: flex-start; align-items: center; width: auto; height: 26px; background: none; color: var(--gold-600); border-radius: 0; }
.contact-card__icon svg { width: 26px; height: 26px; }
.contact-card h2, .contact-card h3 { margin-top: 16px; font-size: .8rem; font-weight: 750; letter-spacing: .1em; color: var(--gold-700); }
.contact-card a, .contact-card p { margin-top: 8px; font-size: 1.12rem; font-weight: 800; color: var(--ink); letter-spacing: -.01em; overflow-wrap: normal; }
.contact-card a { display: inline-block; min-height: 44px; }

/* Team: photo and text, no box */
.team-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 3vw, 40px); }
.team-card { background: none; border: 0; border-radius: 0; box-shadow: none; overflow: visible; }
.team-card__media { aspect-ratio: 4 / 5; border-radius: var(--lh-r); overflow: hidden; box-shadow: var(--shadow-lg); background: var(--cream); }
.team-card__media img { object-position: 50% 18%; }
.team-card__body { padding: 18px 0 0; }
.team-card h3 { font-size: 1.16rem; }
.team-card__role { margin-top: 6px; font-size: .8rem; letter-spacing: .1em; color: var(--gold-700); }
.team-card p { margin-top: 10px; font-size: .95rem; color: var(--muted); }

/* Values on the dark band: .lh-pstep cells with the oversized gold numeral */
.values { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-top: 1px solid rgba(255, 255, 255, .12); }
.value { background: none; border: 0; border-left: 1px solid rgba(255, 255, 255, .1); border-radius: 0; padding: 28px 28px 10px; min-width: 0; }
.value:nth-child(3n+1) { border-left: 0; padding-left: 0; }
.value:nth-child(3n) { padding-right: 0; }
.value:nth-child(n+4) { border-top: 1px solid rgba(255, 255, 255, .12); margin-top: 22px; }
.value__n { font-size: 2.2rem; font-weight: 850; letter-spacing: -.04em; line-height: 1; color: var(--gold-400); }
.value h3 { margin-top: 14px; font-size: 1.1rem; }
.value p { margin-top: 10px; font-size: .94rem; color: rgba(255, 255, 255, .72); }

/* Reviews: .lh-rev cards, the first one featured in purple like the homepage */
.review-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; align-items: start; }
.review-grid > :nth-child(3n+2) { margin-top: 34px; }
.review { border-radius: var(--lh-r); border: var(--lh-hair-soft); padding: 22px 22px 20px; box-shadow: var(--shadow-sm); }
.review__stars { gap: 2px; }
.review__stars svg { width: 13px; height: 13px; }
.review blockquote { margin-top: 12px; font-size: .94rem; line-height: 1.6; }
.review figcaption { margin-top: 16px; padding-top: 14px; font-size: .9rem; display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 12px; }
.review figcaption span { margin-top: 0; font-size: .78rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.review-grid > .review:first-child { background: var(--purple-800); border-color: var(--purple-800); box-shadow: var(--shadow-lg); }
.review-grid > .review:first-child blockquote { color: var(--white); font-size: 1.02rem; }
.review-grid > .review:first-child figcaption { color: var(--white); border-top-color: rgba(255, 255, 255, .14); }
.review-grid > .review:first-child figcaption span { color: rgba(255, 255, 255, .6); }

/* Google rating: the homepage .lh-rating card and the hairline reviewer strip */
.grating { gap: clamp(28px, 4vw, 44px); }
.grating__score { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 20px; border-radius: var(--lh-r); border: var(--lh-hair-soft); box-shadow: var(--shadow-sm); padding: 22px 24px; }
.grating__g svg { width: 44px; height: 44px; }
.grating__score > div { gap: 6px; }
.grating__num { font-size: 3rem; letter-spacing: -.04em; }
.grating__stars svg { width: 18px; height: 18px; }
.grating__meta { font-size: .9rem; }
.grating__score .btn { margin-left: 0; min-height: 44px; justify-self: end; }
.gshots { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; border-top: var(--lh-hair); border-bottom: var(--lh-hair); }
.gshot { display: flex; align-items: center; gap: 14px; padding: 16px 20px; border: 0; border-left: var(--lh-hair-soft); border-radius: 0; box-shadow: none; background: none; }
.gshot:first-child { border-left: 0; padding-left: 0; }
.gshot img { width: 52px; height: 52px; border-radius: 50%; object-fit: cover; flex: none; box-shadow: 0 0 0 2px rgba(239, 194, 74, .6); }
.gshot figcaption { padding: 0; border: 0; font-size: .95rem; font-weight: 750; }

/* FAQ: the homepage rows (redesign.css); no centring, no cap */
.faq { max-width: none; margin-inline: 0; gap: 0; }
.section > .wrap > .faq:only-child { max-width: 880px; }
.faq summary { font-size: 1.02rem; }
.faq__body p { font-size: .96rem; color: var(--body); }
.faq__body a { color: var(--purple-700); font-weight: 650; text-decoration: underline; text-underline-offset: 3px; }

/* Services hub: .lh-svc, no box */
.services { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(32px, 3.5vw, 48px) clamp(18px, 2.4vw, 28px); }
.service { background: none; border: 0; border-radius: 0; box-shadow: none; overflow: visible; transition: none; }
.service:hover { transform: none; box-shadow: none; }
.service__media { border-radius: var(--lh-r); }
.service__media img { transition: transform .8s var(--lh-ease); }
.service:hover .service__media img { transform: scale(1.04); }
.service__tag { top: auto; bottom: 12px; left: 12px; background: rgba(21, 8, 34, .84); color: var(--gold-300); font-size: .75rem; padding: 5px 11px; backdrop-filter: none; }
.service__body { padding: 16px 0 0; }
.service h2, .service h3 { font-size: 1.1rem; }
.service p { margin-top: 9px; font-size: .93rem; }
/* Block link so a wrapped label keeps its arrow beside the last word; the padding keeps the 44px target. */
.service__link { display: block; margin-top: 4px; min-height: 0; padding-block: 13px; text-wrap: balance; line-height: 1.4; }
.service__link svg { display: inline-block; vertical-align: -3px; margin-left: 4px; }
.service .service__link::after { content: ""; position: absolute; inset: 0; }

/* Events (Lamar Cares), insurers, zones, gallery, swatches, claim diagrams */
.events { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-top: var(--lh-hair); }
.event { background: none; border: 0; border-left: var(--lh-hair-soft); border-radius: 0; box-shadow: none; padding: 26px 26px 12px; transition: none; min-width: 0; }
.event:hover { transform: none; box-shadow: none; }
.event:nth-child(3n+1) { border-left: 0; padding-left: 0; }
.event:nth-child(n+4) { border-top: var(--lh-hair-soft); margin-top: 14px; }
.event__season { color: var(--gold-700); }
.event h3 { margin-top: 12px; font-size: 1.08rem; }
.event p { margin-top: 8px; font-size: .93rem; }
.logo-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0; border-top: var(--lh-hair); border-left: var(--lh-hair); }
.logo-grid li { border: 0; border-right: var(--lh-hair); border-bottom: var(--lh-hair); border-radius: 0; box-shadow: none; background: none; min-height: 104px; }
.zones { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-top: var(--lh-hair); }
.zone { background: none; border: 0; border-left: var(--lh-hair-soft); border-radius: 0; box-shadow: none; padding: 26px 26px 12px; transition: none; min-width: 0; }
.zone:hover { transform: none; box-shadow: none; }
.zone:nth-child(3n+1) { border-left: 0; padding-left: 0; }
.zone__dist { color: var(--gold-700); }
.zone h3 { margin-top: 12px; }
.zone__towns li { background: var(--white); border: var(--lh-hair); }
.section--cream .zone__towns li { background: var(--white); }
.gallery { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(10px, 1.4vw, 18px); }
.gallery img { border-radius: var(--lh-r); box-shadow: none; }
.swatch { border-radius: var(--lh-r); box-shadow: var(--shadow-sm); }
.swatch__name { font-size: .95rem; letter-spacing: 0; }
.claim-diagram { border-radius: var(--lh-r); box-shadow: var(--shadow-sm); }
.claim-diagram img { border-radius: 8px; }
.claim-diagrams__note { text-align: left; }
.ig-grid iframe { border-radius: var(--lh-r); }

/* Calculators: white sheet on sand, result panel in purple-900, gold range */
.section--est { background: var(--sand); color: var(--body); }
.section--est .tool-nav { margin: 0 0 clamp(22px, 3vw, 32px); gap: 8px; }
.section--est .tool-nav a, .tool-nav__on { display: inline-flex; align-items: center; min-height: 44px; padding: 6px 16px; font-size: .84rem; font-weight: 650; }
.section--est .tool-nav a { background: var(--white); border: 1.5px solid var(--line); color: var(--ink); }
.section--est .tool-nav a:hover { border-color: var(--purple-800); color: var(--purple-800); }
.tool-nav__on { background: var(--gold-500); color: var(--purple-950); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; font-size: .76rem; }
.est, .est--tool {
  background: var(--white); border: var(--lh-hair-soft); border-radius: var(--lh-r);
  box-shadow: var(--shadow-md); overflow: hidden;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 0; align-items: stretch;
}
.est__controls, .est--tool .est__controls { padding: clamp(24px, 3vw, 40px); gap: 20px; align-content: start; }
.est__field span { color: var(--ink); font-size: .9rem; }
.est__field em { color: var(--gold-700); }
.est__field select { color: var(--ink); background: var(--sand); border: 1.5px solid var(--line); border-radius: 8px; }
.est__field select:focus { outline: none; border-color: var(--purple-600); box-shadow: 0 0 0 4px rgba(95, 42, 145, .12); }
.est__field input[type="range"] { font: inherit; color: inherit; accent-color: var(--gold-500); }
.est__field input[type="range"]:focus-visible { outline: 3px solid var(--gold-400); outline-offset: 3px; }
.est__out, .est--tool .est__out {
  background: var(--purple-900); border: 0; border-radius: 0;
  padding: clamp(28px, 3.4vw, 44px); text-align: left;
  display: flex; flex-direction: column; justify-content: center; align-items: flex-start;
}
.est__label { color: rgba(255, 255, 255, .62); }
.est__label--sub { margin-top: 22px; }
.est__range { margin-top: 10px; color: var(--gold-300); font-size: clamp(2rem, 1.4rem + 2.2vw, 3rem); letter-spacing: -.035em; }
.est--tool .est__range { font-size: clamp(2.4rem, 1.6rem + 3vw, 3.6rem); }
.est__mo { color: var(--white); }
.est--tool .est__mo { font-size: clamp(1.4rem, 1.1rem + 1.2vw, 1.9rem); }
.est__out .est__fine, .est--tool .est__out .est__fine { color: rgba(255, 255, 255, .62); margin-top: 8px; font-size: .84rem; max-width: 36ch; }
.est__out .est__fine strong { color: var(--gold-300); }
.est__controls .est__fine { margin-top: -4px; font-size: .84rem; color: var(--muted); }
.est__out .btn, .est__cta { margin-top: 24px; width: auto; align-self: flex-start; min-height: 44px; box-shadow: 0 1px 2px rgba(23, 18, 31, .12); }
.est__out .est__disclaimer { color: rgba(255, 255, 255, .5); max-width: 44ch; }

/* Tables: rounded white card, purple-950 header, hairline rows, fade only when it scrolls */
.table-wrap { margin: 0 0 14px; border: var(--lh-hair-soft); border-radius: var(--lh-r); box-shadow: var(--shadow-sm); background: var(--white); }
.section-head + .table-wrap { margin-top: 0; }
.table { border: 0; border-radius: 0; box-shadow: none; font-size: .95rem; min-width: 560px; background: transparent; }
.table thead th { background: var(--purple-950); color: var(--gold-300); font-weight: 750; padding: 14px 18px; }
.table td { padding: 13px 18px; border-top: var(--lh-hair-soft); }
.table tbody tr:first-child td { border-top: 0; }
.table tbody tr:nth-child(odd) td { background: transparent; }
.table td:first-child { white-space: normal; }
.table :is(th, td):nth-child(2), .table :is(th, td):nth-child(3) { white-space: nowrap; }
.table-wrap.is-scrollable, .claim-diagram.is-scrollable { -webkit-mask-image: linear-gradient(90deg, var(--ink) calc(100% - 36px), transparent); mask-image: linear-gradient(90deg, var(--ink) calc(100% - 36px), transparent); }
.note { margin-top: 10px; max-width: 72ch; border-left: 3px solid var(--gold-500); }
.note a { color: var(--purple-700); font-weight: 650; text-decoration: underline; text-underline-offset: 3px; }

/* Contact consent */
.lh-consent { margin-top: 14px; font-size: .82rem; color: var(--muted); }

/* ==========================================================================
   Areas: the homepage bordered grid, gold chevrons, sand hover
   ========================================================================== */
.areas__grid { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0; border-top: var(--lh-hair); border-left: var(--lh-hair); }
.area {
  display: flex; align-items: center; gap: 10px; padding: 18px; min-height: 60px;
  background: none; border: 0; border-right: var(--lh-hair); border-bottom: var(--lh-hair); border-radius: 0;
  box-shadow: none; font-size: .95rem; font-weight: 600; color: var(--body); transition: none; min-width: 0;
}
.area:hover { transform: none; box-shadow: none; border-color: var(--line); }
.area svg { display: none; }
.area--link { padding: 0; font-weight: 650; color: var(--ink); }
.area--link:hover { border-color: var(--line); }
.area--link > a {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  width: 100%; padding: 18px; min-height: 60px;
  transition: background-color .25s var(--lh-ease), color .25s var(--lh-ease);
}
.area--link > a::after { content: ""; width: 8px; height: 8px; flex: none; border-top: 2px solid var(--gold-600); border-right: 2px solid var(--gold-600); transform: rotate(45deg); opacity: .85; transition: transform .35s var(--lh-ease), opacity .25s ease; }
.area--link > a:hover { background: var(--sand); color: var(--purple-800); }
.area--link > a:hover::after { transform: rotate(45deg) translate(2px, -2px); opacity: 1; }
.area--current { background: var(--sand); color: var(--purple-800); font-weight: 750; border-color: var(--line); }
.areas__note { margin-top: 24px; text-align: left; font-size: .95rem; color: var(--muted); }
.areas__note strong { color: var(--ink); font-weight: 650; }
.areas__note--after { margin-top: 28px; }

/* ==========================================================================
   Storm alert: the homepage veteran band recipe (solid purple-800, gold rule).
   Straight under a hero it keeps the card form on white.
   ========================================================================== */
.lh-alertband { background: var(--purple-800); border-top: 4px solid var(--gold-500); padding-block: clamp(36px, 4.5vw, 56px); color: rgba(255, 255, 255, .8); }
.alert { background: none; border-radius: 0; padding: 0; box-shadow: none; grid-template-columns: auto minmax(0, 1fr) auto; gap: clamp(22px, 3.5vw, 44px); color: rgba(255, 255, 255, .8); overflow: visible; }
.alert__pulse { animation: none; box-shadow: none; width: 76px; height: 76px; background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .16); color: var(--gold-300); }
.alert__pulse svg { width: 36px; height: 36px; }
.alert h2 { font-size: clamp(1.3rem, 1.05rem + 1vw, 1.75rem); max-width: 28ch; }
.alert p { margin-top: 10px; font-size: .96rem; max-width: 60ch; color: rgba(255, 255, 255, .78); }
.alert__list { margin-top: 16px; gap: 8px 22px; }
.alert__list li { font-size: .86rem; color: rgba(255, 255, 255, .86); }
.alert__cta { display: flex; flex-direction: column; gap: 10px; }
.alert__cta .btn { min-height: 44px; }
.alert .btn--ghost { border: 1.5px solid rgba(255, 255, 255, .3); background: rgba(255, 255, 255, .04); }
.alert .btn--ghost:hover { border-color: var(--white); background: rgba(255, 255, 255, .1); }
main > .section.lh-alertband--first { background: var(--white); border-top: 0; padding-block: clamp(44px, 5.5vw, 72px) var(--lh-sec-tight); }
.lh-alertband--first .alert { background: var(--purple-800); border-radius: var(--lh-r); padding: clamp(26px, 3.5vw, 40px); box-shadow: var(--shadow-lg); border-top: 4px solid var(--gold-500); }
main > .lh-alertband--first + .section { border-top: var(--lh-hair); }

/* ==========================================================================
   Booking: the homepage's dark booking moment, phone in gold, calendar in
   the purple-600 wrapper with its reserved height
   ========================================================================== */
.lh-bookband { background: var(--purple-950); color: rgba(255, 255, 255, .78); }
.lh-bookband .lh-book { margin-top: 0; padding-top: 0; border-top: 0; scroll-margin-top: 24px; }
.lh-bookband .eyebrow { color: var(--gold-300); }
.lh-bookband .eyebrow::before { background: var(--gold-300); }
.lh-bookband h2.lh-book__label { margin-top: 14px; }
.lh-book__lead { margin-top: 16px; font-size: 1rem; color: rgba(255, 255, 255, .74); max-width: 46ch; }
.lh-bookband .lh-book__meta { margin-top: 22px; }
.lh-bookband .lh-book__meta li { align-items: flex-start; }
.lh-bookband .lh-book__meta svg { margin-top: 4px; }
.lh-bookband .lh-book__cta { margin-top: 24px; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, .14); }
.lh-book__phone--inner { margin-top: 0; padding-block: 6px; font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.3rem); gap: 12px; white-space: nowrap; }
.lh-book__phone--inner svg { width: .72em; height: .72em; flex: none; }
.lh-bookband .lh-embed { padding: 0; background: var(--purple-600); border: 1px solid rgba(255, 255, 255, .16); box-shadow: var(--shadow-xl); overflow: hidden; }
.lh-bookband .lh-embed iframe { border-radius: 11px; }
.lh-bookband .lh-embed::before { color: rgba(255, 255, 255, .72); }
main > .lh-bookband + .lh-final { border-top: 1px solid rgba(255, 255, 255, .12); }
/* Within two sections of another dark band the booking moment goes sand, so
   a page never runs three purple bands in a row; the calendar keeps its card. */
main > .section.lh-bookband--light { background: var(--sand); color: var(--body); border-top: var(--lh-hair-soft); }
.lh-bookband--light .eyebrow { color: var(--gold-700); }
.lh-bookband--light .eyebrow::before { background: var(--gold-500); }
.lh-bookband--light .lh-book__label { color: var(--ink); }
.lh-bookband--light .lh-book__lead { color: var(--body); }
.lh-bookband--light .lh-book__meta { color: var(--ink); }
.lh-bookband--light .lh-book__meta svg { color: var(--gold-500); }
.lh-bookband--light .lh-book__cta { border-top-color: var(--line); }
.lh-bookband--light .lh-book__phone { color: var(--purple-800); }
.lh-bookband--light .lh-book__phone svg { color: var(--gold-600); }
.lh-bookband--light .lh-book__phone:hover { color: var(--purple-600); }
main > .lh-bookband--light + .lh-final { border-top: 0; }

/* Contact enquiry: the homepage split with the sticky form */
.lh-enquiry--inner .lh-enquiry__grid { grid-template-areas: "copy form"; }
.lh-enquiry--inner .lh-list { margin-top: 22px; }
.lh-enquiry--inner .lh-consent { margin-top: 22px; padding-top: 18px; border-top: var(--lh-hair); text-align: left; max-width: 46ch; }
.lh-enquiry--inner .btn--outline svg { width: 15px; height: 15px; }

/* Final band: the homepage closer */
.lh-final--inner .btn-row .btn { min-height: 48px; }

/* Guides: the "On this page" rail. Built by redesign.js OUTSIDE <main> on
   /guides/<slug>/ and shown only where the margin beside the wrap has room
   for it, so the article keeps its full measure. */
.lh-rail { display: none; }
@media (min-width: 1660px) {
  .lh-rail {
    display: block; position: fixed; top: 132px; z-index: 5; width: 200px;
    left: calc(50% + var(--wrap) / 2 + 24px);
    opacity: 0; visibility: hidden; transform: translateY(8px);
    transition: opacity .35s var(--lh-ease), transform .35s var(--lh-ease), visibility 0s linear .35s;
  }
  .lh-rail.is-on { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
  .lh-rail__title { display: block; padding-bottom: 12px; border-bottom: var(--lh-hair); font-size: .72rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-700); }
  .lh-rail ol { margin-top: 8px; }
  .lh-rail a { display: block; padding: 7px 0 7px 14px; border-left: 2px solid transparent; font-size: .84rem; line-height: 1.35; color: var(--muted); transition: color .2s var(--lh-ease), border-color .2s var(--lh-ease); }
  .lh-rail a:hover { color: var(--ink); }
  .lh-rail li.is-active a { color: var(--purple-800); font-weight: 700; border-left-color: var(--gold-500); }
}

/* Reveal safety for sticky children: nothing stays translated once shown. */
html.js .split__media[data-rv].is-in, html.js .section-head[data-rv].is-in { transform: none; }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1180px) {
  .services { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .logo-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 1100px) {
  .lh-bookband .lh-book { grid-template-columns: 1fr; gap: 28px; }
  .lh-bookband .lh-book__copy--inner { display: block; }
  .lh-bookband .lh-book__meta { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 24px; }
  .lh-hero-city .hero__stack { grid-template-columns: 1fr; gap: 32px; }
  .lh-hero-city .hero__booking { max-width: 860px; }
  .lh-hero-city .hero__proof { max-width: 560px; }
}

@media (max-width: 1000px) {
  .section-head { grid-template-columns: 1fr; grid-template-areas: "eye" "h2" "sub"; }
  .section-head p { margin-top: 12px; }
  .lh-enquiry--inner .lh-enquiry__grid { grid-template-areas: "copy" "form"; }
  .areas__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .contact-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; }
  .contact-card { padding: 22px 22px 0; }
  .contact-card:nth-child(odd) { border-left: 0; padding-left: 0; }
  .contact-card:nth-child(-n+2) { padding-top: 4px; }
  .contact-card:nth-child(n+3) { border-top: var(--lh-hair-soft); margin-top: 22px; }
  .feature-grid--n3, .feature-grid--n4, .feature-grid--n5, .feature-grid--n6, .feature-grid--n7, .feature-grid--n8 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .feature-grid--ledger { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .feature-grid--ledger.feature-grid--n2, .feature-grid--ledger.feature-grid--n3, .feature-grid--ledger.feature-grid--n4,
  .feature-grid--ledger.feature-grid--n5, .feature-grid--ledger.feature-grid--n6, .feature-grid--ledger.feature-grid--n7,
  .feature-grid--ledger.feature-grid--n8 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .feature-grid--ledger > .feature:nth-child(n) { border-left: var(--lh-hair-soft); border-top: 0; margin-top: 0; padding: 22px 22px 8px; }
  .feature-grid--ledger > .feature:nth-child(2n+1) { border-left: 0; padding-left: 0; }
  .feature-grid--ledger > .feature:nth-child(n+3) { border-top: var(--lh-hair-soft); margin-top: 14px; }
  .gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .events, .zones { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .event:nth-child(n), .zone:nth-child(n) { border-left: var(--lh-hair-soft); border-top: 0; margin-top: 0; padding: 22px 22px 8px; }
  .event:nth-child(2n+1), .zone:nth-child(2n+1) { border-left: 0; padding-left: 0; }
  .event:nth-child(n+3), .zone:nth-child(n+3) { border-top: var(--lh-hair-soft); margin-top: 14px; }
  .values { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .value:nth-child(n) { border-left: 1px solid rgba(255, 255, 255, .1); border-top: 0; margin-top: 0; padding: 24px 24px 8px; }
  .value:nth-child(2n+1) { border-left: 0; padding-left: 0; }
  .value:nth-child(2n) { padding-right: 0; }
  .value:nth-child(n+3) { border-top: 1px solid rgba(255, 255, 255, .12); margin-top: 18px; }
}

@media (max-width: 900px) {
  .lh-phero {
    grid-template-columns: [full-start] minmax(var(--gutter), 1fr) [copy-start media-start] minmax(0, calc(var(--wrap) - 2 * var(--gutter))) [copy-end media-end] minmax(var(--gutter), 1fr) [full-end];
    grid-template-rows: auto auto auto auto auto auto clamp(40px, 6vw, 56px) auto;
    padding-top: 36px;
  }
  .lh-phero .lh-phero__photo { grid-row: 6; margin-top: 30px; align-self: start; aspect-ratio: 16 / 10; }
  .lh-phero--plain { grid-template-rows: auto auto auto auto auto auto 0 0; padding-bottom: 84px; }
  .lh-phero--nophoto { grid-template-rows: auto auto auto auto auto 0 0 0; }
  .lh-phero .lh-creds__row, .lh-phero--sheet::after { grid-row: 8; }
  .lh-phero h1 { max-width: none; }
  .lh-phero--sheet::after { border-radius: 22px 22px 0 0; }
  .lh-phero--plain + .section, .lh-phero--plain + .lh-final { border-radius: 22px 22px 0 0; }
  .lh-phero .lh-creds__row { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 6px 0 18px; }
  .lh-phero .chip { padding: 16px 16px 0 16px; font-size: .92rem; }
  .lh-phero .chip:nth-child(odd) { border-left: 0; padding-left: 0; }
  .lh-phero .chip > svg { width: 30px; height: 30px; }
  .lh-phero .chip { grid-template-columns: 30px minmax(0, 1fr); }
  .section--sidehead > .wrap { grid-template-columns: 1fr; gap: 0; }
  .section--sidehead > .wrap > .section-head { position: static; margin-bottom: clamp(26px, 4vw, 40px); }
  .section--sidehead > .wrap > .section-head p { max-width: 56ch; }
  .split, .split--wide-left { grid-template-columns: 1fr; gap: 30px; }
  .split__media { position: static; aspect-ratio: 3 / 2; }
  .split--flip .split__media { order: -1; }
  .split__media--logo { aspect-ratio: 5 / 2; }
  .services { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .team-grid { gap: 20px 16px; }
  .team-card p { font-size: .9rem; }
  .review-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .review-grid > :nth-child(3n+2) { margin-top: 0; }
  .review-grid > :nth-child(even) { margin-top: 34px; }
  .gshots { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gshot:nth-child(n) { padding: 14px 16px; border-left: var(--lh-hair-soft); }
  .gshot:nth-child(2n+1) { border-left: 0; padding-left: 0; }
  .gshot:nth-child(n+3) { border-top: var(--lh-hair-soft); }
  .grating__score { grid-template-columns: auto auto minmax(0, 1fr); }
  .grating__score .btn { grid-column: 1 / -1; justify-self: start; }
  .alert { grid-template-columns: auto minmax(0, 1fr); text-align: left; justify-items: start; }
  .alert__list { justify-content: flex-start; }
  .alert__cta { grid-column: 2; flex-direction: row; flex-wrap: wrap; width: auto; }
  .lh-hero-city .hero__inner { padding-top: 32px; }
  .steps-v--grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .steps-v--grid li:nth-child(n) { border-left: var(--lh-hair-soft); border-top: 0; padding: 22px 22px 8px; }
  .steps-v--grid li:nth-child(2n+1) { border-left: 0; padding-left: 0; }
  .steps-v--grid li:nth-child(n+3) { border-top: var(--lh-hair-soft); }
  .est, .est--tool { grid-template-columns: 1fr; }
  .logo-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 860px) {
  /* The phone number and the calendar both land in the first screen. */
  .lh-hero-city .chips { display: none; }
  .lh-hero-city .hero__kicker { margin-top: 24px; }
}

@media (max-width: 820px) {
  .values { grid-template-columns: 1fr; border-top: 0; }
  .value:nth-child(n) { padding: 18px 0; border-left: 0; border-top: 1px solid rgba(255, 255, 255, .12); margin-top: 0; display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 4px 12px; align-items: start; }
  .value:first-child { padding-top: 0; border-top: 0; }
  .value__n { font-size: 1.6rem; grid-row: span 2; padding-top: 2px; }
  .value h3 { margin-top: 0; font-size: 1.02rem; }
  .value p { margin-top: 6px; font-size: .9rem; }
}

@media (max-width: 700px) {
  .table td:first-child { white-space: normal; min-width: 150px; }
  .alert { grid-template-columns: 1fr; }
  .alert__cta { grid-column: auto; }
  .alert__pulse { width: 64px; height: 64px; }
  .alert__pulse svg { width: 30px; height: 30px; }
  .review-grid { grid-template-columns: 1fr; }
  .review-grid > :nth-child(even) { margin-top: 0; }
  .lh-bookband .lh-book__meta { grid-template-columns: 1fr; }
  .team-grid { grid-template-columns: 1fr; gap: 0; }
  .team-card { display: grid; grid-template-columns: 132px minmax(0, 1fr); gap: 20px; align-items: start; padding: 22px 0; border-top: var(--lh-hair); }
  .team-card:first-child { border-top: 0; padding-top: 0; }
  .team-card__media { aspect-ratio: 4 / 5; border-radius: 8px; box-shadow: var(--shadow-md); }
  .team-card__body { padding: 0; }
  .events, .zones { grid-template-columns: 1fr; }
  .event:nth-child(n), .zone:nth-child(n) { border-left: 0; padding: 20px 0 6px; border-top: var(--lh-hair-soft); margin-top: 0; }
  .event:first-child, .zone:first-child { border-top: 0; padding-top: 4px; }
  .logo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 600px) {
  .gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .areas__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .area, .area--link > a { padding: 14px; min-height: 52px; font-size: .92rem; }
  .area--link { padding: 0; }
  .services { grid-template-columns: 1fr; gap: 14px; }
  .service { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 14px; align-items: start; }
  .service__media { border-radius: 8px; }
  .service__tag { display: none; }
  .service__body { padding: 0; }
  .service h2, .service h3 { font-size: 1rem; }
  .service p { font-size: .88rem; line-height: 1.5; margin-top: 5px; }
  .service__link { margin-top: 2px; font-size: .84rem; }
  .gshots { grid-template-columns: 1fr; }
  .gshot:nth-child(n) { border-left: 0; padding-left: 0; }
  .gshot:nth-child(n+2) { border-top: var(--lh-hair-soft); }
  .feature-grid--ledger { grid-template-columns: 1fr; }
  .feature-grid--ledger.feature-grid--n2, .feature-grid--ledger.feature-grid--n3, .feature-grid--ledger.feature-grid--n4,
  .feature-grid--ledger.feature-grid--n5, .feature-grid--ledger.feature-grid--n6, .feature-grid--ledger.feature-grid--n7,
  .feature-grid--ledger.feature-grid--n8 { grid-template-columns: 1fr; }
  .feature-grid--ledger > .feature:nth-child(n) { border-left: 0; padding: 20px 0 4px; margin-top: 0; border-top: var(--lh-hair-soft); }
  .feature-grid--ledger > .feature:first-child { border-top: 0; padding-top: 4px; }
  .steps-v--grid { grid-template-columns: 1fr; }
  .steps-v--grid li:nth-child(n) { border-left: 0; border-top: var(--lh-hair-soft); padding: 20px 0 6px; }
  .steps-v--grid li:first-child { border-top: 0; padding-top: 4px; }
}

@media (max-width: 560px) {
  .lh-phero { padding-top: 28px; }
  .lh-phero .page-hero__lead { font-size: 1rem; margin-top: 16px; }
  .lh-phero .lh-phero__cta { margin-top: 24px; }
  .lh-phero .lh-phero__photo { margin-top: 24px; }
  .lh-phero .chip { font-size: .88rem; column-gap: 10px; }
  .lh-phero .chip > svg { width: 26px; height: 26px; }
  .lh-phero .chip { grid-template-columns: 26px minmax(0, 1fr); }
  .lh-phero .chip--rating .lh-stars svg { width: 12px; height: 12px; }
  .section-head p, .split .prose > p:first-child, .prose > p:first-child, .lh-enquiry__lead, .section > .wrap > .prose--intro p { font-size: 1rem; }
  .steps-v li { grid-template-columns: 40px minmax(0, 1fr); gap: 14px; }
  .steps-v li::before { width: 38px; height: 38px; font-size: .9rem; }
  .steps-v h3 { padding-top: 6px; }
  .steps-v p { font-size: .9rem; }
  .feature-grid, .feature-grid--2, .feature-grid--n3, .feature-grid--n4, .feature-grid--n5, .feature-grid--n6, .feature-grid--n7, .feature-grid--n8 { grid-template-columns: 1fr; gap: 22px; }
  .feature { padding-top: 18px; }
  .lh-book__phone--inner { font-size: clamp(1.4rem, 1rem + 2vw, 1.8rem); }
  .lh-hero-city .hero__proof { gap: 0; }
  .lh-hero-city .hero__proof > div { padding: 0 12px; }
  .lh-hero-city .hero__proof dt { font-size: 1.4rem; }
  .lh-hero-city .hero__proof dd { font-size: .78rem; }
  .lh-hero-city .hero__phone { font-size: clamp(1.7rem, 1.2rem + 2.4vw, 2.2rem); }
  .contact-grid { grid-template-columns: 1fr; }
  .contact-card:nth-child(n) { border-left: 0; padding: 18px 0 0; border-top: var(--lh-hair-soft); margin-top: 18px; }
  .contact-card:first-child { padding-top: 0; border-top: 0; margin-top: 0; }
  .contact-card a, .contact-card p { font-size: 1.02rem; }
  .review { padding: 18px 18px 16px; }
  .review blockquote { font-size: .9rem; }
  .grating__num { font-size: 2.4rem; }
  .grating__score { padding: 18px; gap: 14px; }
  .table { min-width: 520px; font-size: .9rem; }
  .table thead th { padding: 12px 14px; }
  .table td { padding: 11px 14px; }
  .est__controls, .est--tool .est__controls { padding: 20px 18px; }
  .est__out, .est--tool .est__out { padding: 24px 20px; }
  .est__out .btn, .est__cta { width: 100%; }
  .est--tool .est__range { font-size: 2.2rem; }
  .section--est .tool-nav a, .tool-nav__on { font-size: .8rem; padding: 6px 12px; }
  .faq summary { padding: 14px 4px 14px 0; font-size: .98rem; }
  .faq__body { padding-right: 16px; }
  .alert__pulse { width: 60px; height: 60px; }
  .alert__pulse svg { width: 28px; height: 28px; }
  .lh-final--inner { padding-block: 56px; }
  .lh-fine { font-size: .84rem; }
}

@media (max-width: 400px) {
  .lh-phero .lh-phero__cta .btn, .lh-final--inner .btn-row .btn { width: 100%; }
  .lh-phero .lh-creds__row { grid-template-columns: 1fr; padding-bottom: 14px; }
  .lh-phero .chip:nth-child(n) { border-left: 0; padding: 12px 0 0; }
  .lh-phero .chip:nth-child(n+2) { border-top: var(--lh-hair-soft); padding-top: 12px; }
  .lh-phero .chip--rating { row-gap: 3px; }
  .service { grid-template-columns: 104px minmax(0, 1fr); }
  .team-card { grid-template-columns: 96px minmax(0, 1fr); gap: 14px; }
  .lh-hero-city .hero__proof > div { padding: 0 8px; }
  .lh-hero-city .hero__proof dt { font-size: 1.25rem; }
}

@media (prefers-reduced-motion: reduce) {
  .area--link > a, .area--link > a::after, .feature h3 > a, .feature h3 > a::after, .feature .service__link svg, .service__media img, .lh-rail { transition: none; }
}