/*
 * Lombardo Lettering — component and utility layer.
 *
 * WHY THIS FILE EXISTS
 * --------------------
 * These are the component shapes that neither a core block nor an Elementor
 * widget has a control for: the white card, the bordered tile row, the 4:3
 * gallery frame, the accent-bulleted checklist, the spec row, the hero scrim.
 * The converter emits their class names into each element's CSS Classes field,
 * and the original block markup uses the same names — so both the imported
 * Elementor pages AND any page not yet imported depend on this file.
 *
 * The first build omitted it. That is why cards, tiles, thumbnails and the
 * hero lost their shapes.
 *
 * Every colour and size below refers to a theme.json preset variable, which
 * the companion theme now declares. Changing a brand colour in one place still
 * changes all of this.
 */

/* ------------------------------------------------------------- components */

/* Accent rule under a heading. */
.is-style-ll-rule {
	display: block; width: 34px; height: 3px;
	background: var(--wp--preset--color--accent); margin: 0 0 12px;
}
.is-style-ll-rule-lg {
	display: block; width: 56px; height: 4px;
	background: var(--wp--preset--color--accent); margin-top: 14px;
}

/* Small uppercase label above a heading. */
.is-style-ll-eyebrow {
	font-size: var(--wp--preset--font-size--tiny);
	letter-spacing: .18em; text-transform: uppercase;
	color: var(--wp--preset--color--gold); font-weight: 700;
}
.is-style-ll-kicker {
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: .14em; color: var(--wp--preset--color--text-faint);
	text-transform: uppercase;
}

/* White card. */
.is-style-ll-card, .ll-card {
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 4px; padding: 18px 20px;
}
.is-style-ll-card > :last-child, .ll-card > :last-child { margin-bottom: 0; }

/* Callout panel with an accent top edge. */
.is-style-ll-callout, .ll-callout {
	background: var(--wp--preset--color--paper);
	border-top: 4px solid var(--wp--preset--color--accent);
	padding: 20px; border-radius: 0 0 4px 4px;
}

/* Tile link — the bordered white row used across service and area lists. */
.is-style-ll-tile, .ll-tile,
.is-style-ll-tile .wp-block-button__link,
.ll-tile .wp-block-button__link,
.ll-tile .elementor-button {
	display: flex; align-items: center; min-height: 48px;
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 3px; padding: 12px 14px;
	color: var(--wp--preset--color--ink-text);
	font-weight: 600; font-size: var(--wp--preset--font-size--compact);
	text-decoration: none;
}
.is-style-ll-tile:hover, .ll-tile:hover,
.is-style-ll-tile .wp-block-button__link:hover,
.ll-tile .wp-block-button__link:hover,
.ll-tile .elementor-button:hover { border-color: var(--wp--preset--color--accent); }

/* Town link — by far the most repeated element on the site. */
.is-style-ll-townlist { margin: 0; padding: 0; list-style: none; display: grid; gap: 2px; }
.is-style-ll-townlist a, .is-style-ll-townlink {
	display: block; padding: 5px 0;
	color: var(--wp--preset--color--text-soft);
	font-size: var(--wp--preset--font-size--compact); text-decoration: none;
}
.is-style-ll-townlist a:hover, .is-style-ll-townlink:hover {
	color: var(--wp--preset--color--ink); text-decoration: underline;
	text-decoration-color: var(--wp--preset--color--accent); text-underline-offset: 3px;
}

/* Checklist with square accent bullets. */
.is-style-ll-checklist, .ll-checklist { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.is-style-ll-checklist li, .ll-check {
	display: flex; gap: 11px; align-items: flex-start;
	color: var(--wp--preset--color--ink-border);
}
.is-style-ll-checklist li::before, .ll-check::before {
	content: ""; flex: none; width: 8px; height: 8px;
	background: var(--wp--preset--color--accent); margin-top: 9px; display: block;
}

/* Specification rows on dark panels. */
.is-style-ll-specs { margin: 0; padding: 0; list-style: none; }
.is-style-ll-specs li, .ll-spec {
	display: flex; gap: 14px; align-items: baseline; padding: 13px 0;
	border-bottom: 1px solid var(--wp--preset--color--ink-line);
	color: var(--wp--preset--color--cream);
	font-size: var(--wp--preset--font-size--base);
}
.is-style-ll-specs li > strong, .ll-spec > strong {
	flex: none; color: var(--wp--preset--color--accent);
	font-weight: 700; font-size: var(--wp--preset--font-size--compact);
}

/* Gallery thumbnail in a fixed 4:3 frame. */
.is-style-ll-thumb, .ll-thumb {
	display: block; background: var(--wp--preset--color--line-alt);
	border-radius: 3px; overflow: hidden; aspect-ratio: 4 / 3; margin: 0;
}
.is-style-ll-thumb > a, .ll-thumb > a { display: block; width: 100%; height: 100%; }
.is-style-ll-thumb img, .ll-thumb img,
.ll-thumb .elementor-widget-container img {
	width: 100%; height: 100%; object-fit: cover; display: block;
}
/* Elementor's own `.elementor img { height: auto }` outranks the rules above,
   so most gallery photos sat at their natural height inside the 4:3 frame.
   Every link/container/img inside the image widget must fill the frame. */
.elementor .elementor-widget-image.is-style-ll-thumb > .elementor-widget-container,
.elementor .elementor-widget-image.is-style-ll-thumb a,
.elementor .elementor-widget-image.is-style-ll-thumb img {
	display: block; width: 100%; height: 100%; max-width: none;
}
.elementor .elementor-widget-image.is-style-ll-thumb img { object-fit: cover; }
.is-style-ll-thumb figcaption, .ll-as-figcaption {
	margin-top: 7px; font-size: var(--wp--preset--font-size--x-small);
	color: var(--wp--preset--color--text-muted); font-weight: 600;
}
.ll-as-figure { margin: 0; }

/* Large intro paragraph. */
.is-style-ll-lede, .ll-lede {
	font-size: var(--wp--preset--font-size--subhead); line-height: 1.5;
	color: var(--wp--preset--color--ink-text); font-weight: 500;
}

/* Statistic. */
.is-style-ll-stat {
	display: block; font-family: var(--wp--preset--font-family--display);
	font-size: calc(var(--wp--preset--font-size--feature) * 1.22);
	font-weight: 700; color: var(--wp--preset--color--accent); line-height: 1;
}

/* Breadcrumb trail. */
.ll-breadcrumb {
	font-size: var(--wp--preset--font-size--x-small);
	color: var(--wp--preset--color--text-muted);
	display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
}
.ll-breadcrumb [aria-current] { color: var(--wp--preset--color--ink); font-weight: 600; }
.ll-breadcrumb .sep { opacity: .5; }

/* Embedded Google Map. */
.ll-map {
	border: 1px solid var(--wp--preset--color--line); border-radius: 4px;
	overflow: hidden; background: var(--wp--preset--color--paper);
}
.ll-map iframe { width: 100%; height: 300px; border: 0; display: block; }

/*
 * Hero with video or image behind a scrim.
 *
 * Only needed while a page still holds the ORIGINAL block markup: once
 * imported, the converter folds the media into the Elementor container's own
 * background and these absolutely-positioned children no longer exist.
 * Harmless either way, and it keeps the pre-import site looking right.
 */
.ll-hero { position: relative; overflow: hidden; }
.ll-hero__media { position: absolute; inset: 0; margin: 0; }
.ll-hero__media video, .ll-hero__media img {
	width: 100%; height: 100%; object-fit: cover; opacity: .32; display: block;
}
.ll-hero__scrim { position: absolute; inset: 0; }
.ll-hero > .ll-u-relative, .ll-hero__body { position: relative; z-index: 1; }

/* The original raw quote form, for any page not yet imported. */
.ll-form {
	background: var(--wp--preset--color--ink-soft);
	border: 1px solid var(--wp--preset--color--ink-line);
	border-radius: 4px; padding: 22px; display: grid; gap: 14px;
}
.ll-form label {
	display: grid; gap: 6px; min-width: 0;
	color: var(--wp--preset--color--text-invert);
	font-size: var(--wp--preset--font-size--small); font-weight: 600;
}
.ll-form input, .ll-form select, .ll-form textarea {
	background: var(--wp--preset--color--ink);
	border: 1px solid var(--wp--preset--color--ink-border);
	color: var(--wp--preset--color--white); border-radius: 3px; padding: 13px;
	font-size: var(--wp--preset--font-size--base);
	min-height: 48px; min-width: 0; width: 100%; max-width: 100%;
}
.ll-form input[type="file"] {
	border-style: dashed; border-color: var(--wp--preset--color--text-mid);
	color: var(--wp--preset--color--text-invert-muted);
	font-size: var(--wp--preset--font-size--compact);
}
.ll-form textarea { min-height: 0; }
.ll-form button {
	background: var(--wp--preset--color--accent); color: var(--wp--preset--color--ink);
	border: none; border-radius: 3px; padding: 16px; font-weight: 700;
	font-size: var(--wp--preset--font-size--medium); min-height: 52px; cursor: pointer;
	font-family: var(--wp--preset--font-family--display);
	text-transform: uppercase; letter-spacing: .06em;
}
.ll-form button:hover { background: var(--wp--preset--color--white); }
.ll-form .note { color: var(--wp--preset--color--text-faint); font-size: var(--wp--preset--font-size--x-small); }

/* Trust / logo strip. */
.ll-logos { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 14px 40px; }
.ll-logos img { height: 38px; width: auto; object-fit: contain; }
.ll-logos span {
	font-family: var(--wp--preset--font-family--display); text-transform: uppercase;
	font-size: var(--wp--preset--font-size--compact); letter-spacing: .08em;
	color: var(--wp--preset--color--text-muted);
}

/* Cited-source lists on the long-form pages. */
.ll-sources { list-style: none; margin: 0; padding: 0; }
.ll-sources li {
	padding-left: 16px; position: relative; margin-bottom: 7px;
	color: var(--wp--preset--color--text-mid); line-height: 1.55;
}
.ll-sources li::before {
	content: ""; position: absolute; left: 0; top: 9px;
	width: 7px; height: 1px; background: var(--wp--preset--color--accent);
}
.ll-sources a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.ll-sources a:hover { color: var(--wp--preset--color--ink); }

.ll-article :where(p) { line-height: 1.68; }
.ll-article :where(h2) { margin-top: 1.8em; }
.ll-article :where(h3) { margin-top: 1.4em; }
.ll-article :where(figure) { margin-left: 0; margin-right: 0; }

.ll-table { width: 100%; border-collapse: collapse; }
.ll-table th, .ll-table td { text-align: left; }

/*
 * TABLES ON A DESKTOP.
 *
 * The port arrived with no table styling at all: no rules, no header, no
 * padding, and the table sized itself to its text — 687px of content sitting
 * in a 962px box with the right third empty, columns touching each other.
 *
 * It now fills its column and reads as a table: a dark header in the display
 * face, a hairline under every row, generous cells, and a tint on alternate
 * rows so the eye tracks across. Everything is a Kit variable, so Site
 * Settings restyles these along with the rest of the site.
 */
.wp-block-table table,
.ll-table table {
  width: 100%;
  /* "separate" with no spacing keeps single hairlines AND lets the radius
     clip the corners; "collapse" ignores border-radius. */
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--ll-border-lt);
  border-radius: 5px;
  overflow: hidden;
  background: var(--ll-white);
  font-variant-numeric: tabular-nums;
}

.wp-block-table thead th,
.ll-table thead th {
  background: var(--ll-ink);
  color: var(--ll-white);
  font-family: var(--ll-display);
  font-weight: 600;
  font-size: var(--wp--preset--font-size--x-small, 14px);
  letter-spacing: .06em;
  text-transform: uppercase;
  text-align: left;
  padding: 15px 22px;
  border: 0;
  vertical-align: bottom;
}
.wp-block-table tbody td,
.ll-table tbody td {
  padding: 17px 22px;
  border: 0;
  border-top: 1px solid var(--ll-border-lt);
  vertical-align: top;
  text-align: left;
  line-height: 1.5;
}
/* The dark header already draws that line. */
.wp-block-table tbody tr:first-child td,
.ll-table tbody tr:first-child td { border-top: 0; }
.wp-block-table tbody tr:nth-child(even) td,
.ll-table tbody tr:nth-child(even) td { background: var(--ll-page); }

/* The first cell is what the row is about, so it carries the weight. */
.wp-block-table tbody td:first-child,
.ll-table tbody td:first-child {
  font-weight: 600;
  color: var(--ll-ink);
  width: 26%;
}

/*
 * In a "us versus them" table, our column is the answer. A tint and a pair of
 * hairlines make the comparison land without a word of extra copy. Only
 * tables the build marked as comparisons get this (tools/lib/table-labels.js);
 * a table of sizes or stages has no column to favour.
 */
.wp-block-table table.ll-table-compare thead th:nth-child(2) {
  background: var(--ll-link);
  color: var(--ll-white);
}
.wp-block-table table.ll-table-compare tbody td:nth-child(2) {
  background: color-mix(in srgb, var(--ll-accent) 16%, var(--ll-white));
  box-shadow: inset 1px 0 0 var(--ll-accent), inset -1px 0 0 var(--ll-accent);
  color: var(--ll-ink);
  font-weight: 600;
}
.wp-block-table table.ll-table-compare tbody tr:nth-child(even) td:nth-child(2) {
  background: color-mix(in srgb, var(--ll-accent) 22%, var(--ll-white));
}
/* Browsers without color-mix still get a readable tinted column. */
@supports not (background: color-mix(in srgb, red 50%, white)) {
  .wp-block-table table.ll-table-compare tbody td:nth-child(2) { background: var(--ll-page); }
}

/*
 * TABLES ON A PHONE.
 *
 * These tables are three and four columns wide. Kept as a grid on a 375px
 * screen they can only be read by swiping sideways inside their own box, and
 * the last column is never seen — the client photographed exactly that. Below
 * 768px each row becomes a block instead: the first cell is the row's title,
 * and every other cell is printed under its column name (tools/lib/
 * table-labels.js puts the name on the cell as data-label). Nothing here
 * applies from 768px up, where the table stays a table.
 *
 * A table the client adds later has no labels; it still stacks, it just
 * cannot name its columns.
 */
@media (max-width: 767px) {
  /* Each row becomes its own card, so the table itself stops being a box. */
  .wp-block-table table,
  .ll-table table,
  .elementor-widget-text-editor table {
    display: block;
    width: 100%;
    min-width: 0;
    border: 0;
    border-radius: 0;
    background: none;
    overflow: visible;
  }
  .wp-block-table thead,
  .ll-table thead,
  .elementor-widget-text-editor thead { display: none; }
  .wp-block-table tbody,
  .ll-table tbody,
  .elementor-widget-text-editor tbody { display: block; }
  /* Each row is its own card, so the eye can tell where one ends. */
  .wp-block-table tbody tr,
  .ll-table tbody tr,
  .elementor-widget-text-editor tbody tr {
    display: block;
    margin-bottom: 12px;
    padding: 14px 16px;
    background: var(--ll-white);
    border: 1px solid var(--ll-border-lt);
    border-radius: 4px;
    border-left: 3px solid var(--ll-ink);
  }
  .wp-block-table tbody tr:last-child,
  .ll-table tbody tr:last-child,
  .elementor-widget-text-editor tbody tr:last-child { margin-bottom: 0; }
  .wp-block-table tbody td,
  .ll-table tbody td,
  .elementor-widget-text-editor tbody td {
    display: block;
    width: auto;
    padding: 0;
    border: 0;
    text-align: left;
  }
  /* The row's own title. */
  .wp-block-table tbody td[data-rowhead],
  .ll-table tbody td[data-rowhead],
  .elementor-widget-text-editor tbody td[data-rowhead] {
    margin-bottom: 4px;
    font-family: var(--wp--preset--font-family--display, "Oswald"), sans-serif;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--wp--preset--color--ink, #101113);
  }
  /* Every other cell is announced by its column name. */
  .wp-block-table tbody td[data-label]::before,
  .ll-table tbody td[data-label]::before,
  .elementor-widget-text-editor tbody td[data-label]::before {
    content: attr(data-label);
    display: block;
    margin-top: 10px;
    font-family: var(--wp--preset--font-family--display, "Oswald"), sans-serif;
    font-size: var(--wp--preset--font-size--x-small, 14px);
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--wp--preset--color--text-muted, #36373c);
  }
  /* Cells the client added without a label still need breathing room. */
  .wp-block-table tbody td + td:not([data-label]),
  .ll-table tbody td + td:not([data-label]),
  .elementor-widget-text-editor tbody td + td:not([data-label]) { margin-top: 8px; }

  /* Blog posts carry their own table padding in style.css; unset it here. */
  .ll-post-body .ll-table tbody td { padding: 0; border-bottom: 0; }

  /* Our own answer keeps its tint when the row becomes a card. */
  .wp-block-table table.ll-table-compare tbody tr { border-left-color: var(--ll-accent); }
  .wp-block-table table.ll-table-compare tbody td:nth-child(2) {
    margin-top: 10px;
    padding: 8px 12px;
    background: color-mix(in srgb, var(--ll-accent) 16%, var(--ll-white));
    border-radius: 3px;
    font-weight: 600;
    color: var(--ll-ink);
  }
  .wp-block-table table.ll-table-compare tbody td:nth-child(2)::before { margin-top: 0; }
}

/* -------------------------------------------------------------- utilities */

.ll-u-block { display: block; }
.ll-u-inline-block { display: inline-block; }
.ll-u-inline-flex { display: inline-flex; }
.ll-u-flex { display: flex; }
.ll-u-grid { display: grid; }
.ll-u-column { flex-direction: column; }
.ll-u-items-center { align-items: center; }
.ll-u-items-baseline { align-items: baseline; }
.ll-u-items-start { align-items: flex-start; }
.ll-u-flex-none { flex: none; }
.ll-u-flex-1 { flex: 1; }
.ll-u-full, .ll-u-full > img, .ll-u-full > a > img { width: 100%; }
.ll-u-w-auto, .ll-u-w-auto > img, .ll-u-w-auto > a > img { width: auto; }
.ll-u-h-full, .ll-u-h-full > img, .ll-u-h-full > a > img { height: 100%; }
.ll-u-h-auto, .ll-u-h-auto > img, .ll-u-h-auto > a > img { height: auto; }
.ll-u-minh-48 { min-height: 48px; }
.ll-u-minh-52 { min-height: 52px; }
.ll-u-minw-0 { min-width: 0; }
/* Desktop only: on a phone the table stacks and has no minimum width. */
@media (min-width: 768px) {
  .ll-u-minw-560 { min-width: 560px; }
}
.ll-u-cover, .ll-u-cover > img, .ll-u-cover > a > img { object-fit: cover; }
.ll-u-contain, .ll-u-contain > img, .ll-u-contain > a > img { object-fit: contain; }
/* Partner logos. Elementor's `.elementor img { height: auto }` loads after
   this file and has the same weight as the rule above, so every logo showed
   at its full file size — in the shared "premium materials" section on the
   town pages (block markup inside an Elementor page) as well as in image
   widgets. The doubled class outranks it in both places. */
.ll-u-logo.ll-u-logo > img,
.ll-u-logo.ll-u-logo > a > img {
	height: 38px; width: auto; max-width: 100%; object-fit: contain;
}
.elementor .elementor-widget-image.ll-u-logo { width: auto; max-width: 100%; }
.elementor .elementor-widget-image.ll-u-logo img {
	height: 38px; width: auto; max-width: 100%; object-fit: contain;
}
.ll-u-clip { overflow: hidden; }
.ll-u-scroll { overflow: auto; }
/* Pages imported before 1.7.0 carry the class but not the container setting. */
.e-con.ll-u-clip { --overflow: hidden; }
.e-con.ll-u-scroll { --overflow: auto; }
/*
 * A <figure> carries the browser's own 40px side margins. Around a table that
 * is 80px the table cannot use, so on a 1280px desktop the widget's content
 * measured 1,042px inside a 962px box and grew a scrollbar of its own. The
 * table is meant to fill its column, so the margins go.
 */
figure.wp-block-table { margin-left: 0; margin-right: 0; }

/* A table never widens the page: it scrolls inside its own box. */
.elementor-widget-text-editor:has(table) { max-width: 100%; overflow-x: auto; }
.elementor-widget-text-editor.ll-u-minw-560 { min-width: 0; }
@media (min-width: 768px) {
  .elementor-widget-text-editor.ll-u-minw-560 table { min-width: 560px; }
}
.ll-u-plain-list { list-style: none; }
.ll-u-relative { position: relative; }
.ll-u-logo, .ll-u-logo > img, .ll-u-logo > a > img { height: 38px; width: auto; object-fit: contain; }

/* Content width steps. A width utility only caps the width; centring is a
   separate explicit class, because the source centres containers while
   leaving their contents left-aligned. */
.ll-w-620 { max-width: 620px; }
.ll-w-640 { max-width: 640px; }
.ll-w-680 { max-width: 680px; }
.ll-w-700 { max-width: 700px; }
.ll-w-760 { max-width: 760px; }
.ll-w-860 { max-width: 860px; }
.ll-w-1000 { max-width: 1000px; }
.ll-w-1200 { max-width: 1200px; }
.ll-center { margin-inline: auto; }

/* Rows built from separate blocks: each cell is its own paragraph, and
   paragraphs bring margins the row has to clear or the cells stop sharing a
   line. */
.ll-spec > p, .ll-check > p,
.ll-u-flex > p, .ll-u-inline-flex > p { margin-top: 0; margin-bottom: 0; }
.ll-spec, .ll-check { width: 100%; align-self: stretch; }

.ll-u-inline-flex.wp-block-button > .wp-block-button__link,
.ll-u-flex.wp-block-button > .wp-block-button__link {
	display: inline-flex; align-items: baseline; gap: 10px; text-align: left;
}
.ll-u-column.wp-block-button > .wp-block-button__link {
	flex-direction: column; align-items: flex-start; gap: 2px;
}

/*
 * Auto-fit grids. WordPress grid layout emits auto-fill, which leaves empty
 * tracks; the source used auto-fit so a short final row still stretches.
 * Elementor containers get a fixed column count instead, so these apply to
 * block markup and to any Elementor container carrying the class.
 */
.ll-grid-190.is-layout-grid { grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr)); }
.ll-grid-200.is-layout-grid { grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr)); }
.ll-grid-210.is-layout-grid { grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr)); }
.ll-grid-220.is-layout-grid { grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); }
.ll-grid-230.is-layout-grid { grid-template-columns: repeat(auto-fit, minmax(min(230px, 100%), 1fr)); }
.ll-grid-240.is-layout-grid { grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); }
.ll-grid-260.is-layout-grid { grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr)); }
.ll-grid-268.is-layout-grid { grid-template-columns: repeat(auto-fit, minmax(min(268px, 100%), 1fr)); }
.ll-grid-270.is-layout-grid { grid-template-columns: repeat(auto-fit, minmax(min(270px, 100%), 1fr)); }
.ll-grid-300.is-layout-grid { grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); }
.ll-grid-320.is-layout-grid { grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr)); }
.ll-autofit.is-layout-grid { grid-template-columns: repeat(auto-fit, minmax(min(var(--ll-col, 240px), 100%), 1fr)); }

/* Marks a block whose source style could not be fully expressed. The build
   emits none of these; the rule exists so a future regression is visible. */
.ll-has-residual-style { outline: 0; }

/* ------------------------------------------------- Elementor rhythm reset */

/*
 * The source theme sets paragraph margins to 0 site-wide and spaces blocks
 * with each group's gap. The port gives every paragraph its own text-editor
 * widget inside a container that carries that same gap, so the browser's
 * default 1em paragraph margins would double every gap on the site. Explicit
 * per-block margins from the source are applied as widget margins instead.
 */
.elementor-widget-text-editor p { margin-block: 0; }
.elementor-widget-text-editor p + p { margin-block-start: 1em; }

/* Heading widgets: Elementor resets margins already; keep inline links tidy. */
.elementor-widget-heading .elementor-heading-title a { color: inherit; }

/* A plain text link row (breadcrumbs): widgets size to their content. */
.e-con.e-flex > .elementor-widget-text-editor { flex: 0 1 auto; }
.e-con.e-flex.e-con--column > .elementor-widget-text-editor,
.e-con.e-flex > .elementor-widget-text-editor:only-child { flex: 1 1 auto; }

/* Tile buttons are full-width rows with left-aligned labels. */
.is-style-ll-tile .elementor-button { width: 100%; justify-content: flex-start; }

/* The quote form sits on the dark band it was designed for. */
.ll-form-wrap .wpcf7 {
	background: var(--wp--preset--color--ink-soft);
	border: 1px solid var(--wp--preset--color--ink-line);
	border-radius: 4px;
	padding: 22px;
}

/* Shared sections placed by [ll_synced] inside Elementor pages: the section
   draws its own full-bleed band, so the widget wrapper must not constrain it. */
.elementor-widget-shortcode.ll-synced,
.elementor-widget-shortcode.ll-synced .elementor-shortcode { width: 100%; }
.ll-synced-section > .wp-block-group { margin-block: 0; }

/* Related posts under an article. */
.ll-related { background: var(--wp--preset--color--paper-alt); border-top: 1px solid var(--wp--preset--color--line); }
.ll-related__inner { max-width: 1200px; margin: 0 auto; padding: var(--wp--preset--spacing--60, 58px) 18px; }
.ll-related #ll-related-title { margin: 0 0 22px; font-size: var(--wp--preset--font-size--xx-large); }
