/*
Theme Name:   EventCrew
Theme URI:    https://eventcrew.sheriq.site
Description:  Child theme of Hello Elementor carrying the EventCrew design system — brand tokens, surface hierarchy and the ledger used by the compare view. Layout is built in Elementor; this file owns the tokens so a colour is changed in one place rather than forty widgets.
Author:       Sheheryar Khalid
Template:     hello-elementor
Version:      1.0.0
Text Domain:  eventcrew
*/

/* ------------------------------------------------------------------ */
/*  Tokens                                                            */
/*                                                                    */
/*  Bright and photographic: white pages, the photography carries the */
/*  colour, and the logo's orange is kept for the few things a        */
/*  visitor should press. Orange text and fills use the deeper tone,  */
/*  which holds 5:1 against white; the bright logo orange is for      */
/*  marks, never behind text.                                         */
/* ------------------------------------------------------------------ */
:root {
  --ec-orange: #fe590f;
  --ec-orange-deep: #c2410c;
  --ec-orange-hover: #a8380a;
  --ec-orange-wash: #fff1ea;

  --ec-stage: #1c1f2b;
  --ec-stage-deep: #14161f;

  --ec-ground: #ffffff;
  --ec-surface: #ffffff;
  --ec-raise: #f5f6f8;
  --ec-ink: #1c1f2b;
  --ec-muted: #5d6275;
  --ec-line: #e8e9ef;
  --ec-line-strong: #d3d5de;

  --ec-free: #0b7a52;
  --ec-free-wash: #e2f3ec;
  --ec-held: #4f5468;
  --ec-held-wash: #f0f1f4;

  --ec-shadow: 0 1px 2px rgb(16 24 40 / 0.05), 0 10px 28px -14px rgb(16 24 40 / 0.22);
  --ec-shadow-hover: 0 2px 4px rgb(16 24 40 / 0.06), 0 18px 40px -16px rgb(16 24 40 / 0.3);

  --ec-display: "Archivo", ui-sans-serif, system-ui, sans-serif;
  --ec-sans: "Archivo", ui-sans-serif, system-ui, sans-serif;
  --ec-narrow: 100%;
}

body {
  background: var(--ec-ground);
  color: var(--ec-ink);
  font-family: var(--ec-sans);
}

h1, h2, h3, h4,
.ec-display {
  font-family: var(--ec-display);
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.08;
}

/* Prices, capacities and counts line up in columns, so they get figures
   that are the same width. */
.ec-figure,
.ec-price,
.jet-listing-dynamic-field__content.ec-figure {
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}

/* ------------------------------------------------------------------ */
/*  Surfaces                                                          */
/*                                                                    */
/*  Three of them, not one. A listing you can open is not the same    */
/*  kind of object as a filter column, and neither is a ruled row —   */
/*  so they do not share a radius, a border or a shadow.              */
/* ------------------------------------------------------------------ */

/* Listings. Image-led, generous, clickable. */
.ec-card {
  background: var(--ec-surface);
  border: 1px solid var(--ec-line);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: var(--ec-shadow);
  transition: box-shadow 0.2s ease;
}
.ec-card:hover { box-shadow: var(--ec-shadow-hover); }

/* Controls: filters, forms, sidebars. Flat — never a shadow. */
.ec-panel {
  background: var(--ec-surface);
  border: 1px solid var(--ec-line);
  border-radius: 10px;
}

/* Ruled rows, for anything meant to be compared down a column. */
.ec-ledger {
  border-top: 1px solid var(--ec-line);
}
.ec-ledger .jet-listing-grid__item {
  border-bottom: 1px solid var(--ec-line);
  padding: 0.85rem 0.75rem;
  transition: background 0.15s ease;
}
.ec-ledger .jet-listing-grid__item:hover {
  background: var(--ec-raise);
}

/* ------------------------------------------------------------------ */
/*  Status pills — these carry meaning, not decoration                */
/* ------------------------------------------------------------------ */
.ec-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  border-radius: 999px;
  padding: 0.2rem 0.55rem;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.4;
}
.ec-pill--free { background: var(--ec-free-wash); color: var(--ec-free); }
.ec-pill--held { background: var(--ec-held-wash); color: var(--ec-held); }
.ec-pill--brand { background: var(--ec-orange-wash); color: var(--ec-orange-deep); }
.ec-pill--quiet { background: var(--ec-raise); color: var(--ec-muted); }

/* ------------------------------------------------------------------ */
/*  Buttons                                                           */
/* ------------------------------------------------------------------ */
.ec-btn,
.elementor-button.ec-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: 8px;
  padding: 0.7rem 1.15rem;
  background: var(--ec-orange);
  color: #fff;
  border: 1px solid var(--ec-orange);
  font-weight: 600;
  font-size: 0.875rem;
  line-height: 1;
  transition: background 0.18s ease, border-color 0.18s ease;
}
.ec-btn:hover,
.elementor-button.ec-btn:hover {
  background: var(--ec-orange-deep);
  border-color: var(--ec-orange-deep);
  color: #fff;
}
.ec-btn--outline {
  background: var(--ec-surface);
  color: var(--ec-ink);
  border-color: var(--ec-line-strong);
}
.ec-btn--outline:hover {
  background: var(--ec-surface);
  border-color: var(--ec-ink);
  color: var(--ec-ink);
}

/* ------------------------------------------------------------------ */
/*  JetSmartFilters — styled to match the panel, not the plugin       */
/* ------------------------------------------------------------------ */
.jet-filter {
  margin-bottom: 1.25rem;
}
.jet-filter-label,
.jet-filter .jet-filter-label {
  font-weight: 600;
  font-size: 0.875rem;
  margin-bottom: 0.6rem;
}
.jet-checkboxes-list__row,
.jet-radio-list__row {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.3rem 0;
  font-size: 0.9375rem;
  color: var(--ec-muted);
}
.jet-checkboxes-list__row:hover,
.jet-radio-list__row:hover {
  color: var(--ec-ink);
}
.jet-checkboxes-list__input:checked + .jet-checkboxes-list__label,
.jet-radio-list__input:checked + .jet-radio-list__label {
  color: var(--ec-orange);
  font-weight: 600;
}
.jet-filter-items-count {
  color: var(--ec-muted);
  font-variant-numeric: tabular-nums;
}
.jet-active-filter {
  background: var(--ec-orange-wash);
  color: var(--ec-orange-deep);
  border-radius: 999px;
  padding: 0.2rem 0.6rem;
  font-size: 0.8125rem;
}

/* The map is a working control, so it sits in the design rather than
   arriving with its own. */
.jet-map-listing {
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid var(--ec-line);
}

/* ------------------------------------------------------------------ */
/*  Page entry                                                        */
/*                                                                    */
/*  A short fade so a page load is legible. On <main> rather than     */
/*  <body>: an animating ancestor becomes the containing block for    */
/*  position:fixed descendants, which would break a sticky header.    */
/* ------------------------------------------------------------------ */
@keyframes ec-page-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
main,
.site-main {
  animation: ec-page-in 0.18s ease-out backwards;
}

/* ------------------------------------------------------------------ */
/*  Quality floor                                                     */
/* ------------------------------------------------------------------ */
:focus-visible {
  outline: 2px solid var(--ec-orange);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    transition-duration: 0.001ms !important;
  }
}

/* ------------------------------------------------------------------ */
/*  Supplier card internals                                           */
/*                                                                    */
/*  The card is assembled from JetEngine dynamic-field widgets, each   */
/*  of which wraps its value in .jet-listing-dynamic-field__content.   */
/*  Styling therefore hangs off classes put on the widget, not off     */
/*  element types.                                                    */
/* ------------------------------------------------------------------ */
.ec-card__media img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.ec-card__body {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

/* Name and rating sit on one line; the rating must not wrap under a
   long supplier name, so it holds its width. */
.ec-card__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
}
.ec-card__name .jet-listing-dynamic-field__content,
.ec-card__name h3 {
  margin: 0;
  font-family: var(--ec-display);
  font-size: 1.0625rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  line-height: 1.25;
  color: var(--ec-ink);
}
.ec-card__rating .jet-listing-dynamic-field__content {
  flex: none;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--ec-ink);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.ec-card__where .jet-listing-dynamic-terms__link {
  font-size: 0.8125rem;
  color: var(--ec-muted);
  text-decoration: none;
}
.ec-card__where .jet-listing-dynamic-terms__link:hover { color: var(--ec-ink); }

/* Services read as a row of quiet chips rather than a sentence, so a
   supplier covering four categories stays scannable. */
.ec-card__services .jet-listing-dynamic-terms {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
}
.ec-card__services .jet-listing-dynamic-terms__link {
  border-radius: 999px;
  padding: 0.15rem 0.5rem;
  background: var(--ec-raise);
  color: var(--ec-muted);
  font-size: 0.6875rem;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}
.ec-card__services .jet-listing-dynamic-terms__link:hover {
  background: var(--ec-orange-wash);
  color: var(--ec-orange-deep);
}

.ec-card__blurb .jet-listing-dynamic-field__content {
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--ec-muted);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.ec-card__foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-top: 0.25rem;
  padding-top: 0.7rem;
  border-top: 1px solid var(--ec-line);
}
.ec-card__price .jet-listing-dynamic-field__content {
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--ec-ink);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}
.ec-card__price small,
.ec-card__unit .jet-listing-dynamic-field__content {
  font-size: 0.75rem;
  font-weight: 500;
  color: var(--ec-muted);
}

/* Grid gutters — JetEngine's own columns use negative margins, which
   fight rounded cards; set the gap here instead. */
.jet-listing-grid__items { gap: 0; }

/* Price and unit belong together on the left; the availability pill, when a
   date has been chosen, is the thing that goes to the right. space-between
   across three children pushed the unit to the far edge instead. */
.ec-card__foot { justify-content: flex-start; }
.ec-card__foot > .elementor-widget-shortcode { margin-left: auto; }
.ec-card__unit { align-self: flex-end; }

/* ------------------------------------------------------------------ */
/*  Header / footer                                                   */
/* ------------------------------------------------------------------ */
.ec-header {
  background: var(--ec-surface);
  border-bottom: 1px solid var(--ec-line);
  position: sticky;
  top: 0;
  z-index: 50;
}
.ec-header__row {
  align-items: center;
  justify-content: flex-start;
}
.ec-header__logo img { display: block; height: 30px; width: auto; }

/* The nav takes the slack so the CTA sits hard right. */
.ec-header__nav { margin-left: auto; }
.ec-header__nav .elementor-item {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--ec-ink);
  padding: 0.4rem 0.7rem;
}
.ec-header__nav .elementor-item:hover,
.ec-header__nav .elementor-item.elementor-item-active { color: var(--ec-orange); }

.ec-header__cta .elementor-button {
  background: var(--ec-orange);
  border-color: var(--ec-orange);
  color: #fff;
  border-radius: 8px;
  padding: 0.6rem 1rem;
  font-size: 0.8125rem;
  font-weight: 600;
}
.ec-header__cta .elementor-button:hover { background: var(--ec-orange-deep); }

.ec-footer {
  background: var(--ec-ink);
  color: #cfcbc4;
  margin-top: 64px;
}
.ec-footer__row { align-items: center; justify-content: space-between; }
.ec-footer p { margin: 0; font-size: 0.8125rem; }
.ec-footer strong { color: #fff; }

/* ------------------------------------------------------------------ */
/*  Archive headers                                                   */
/* ------------------------------------------------------------------ */
.ec-archive { padding-top: 40px; }
.ec-archive__title .elementor-heading-title {
  font-family: var(--ec-display);
  font-size: clamp(1.9rem, 4vw, 2.6rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.05;
  color: var(--ec-ink);
  margin: 0;
}
.ec-archive__lede p {
  margin: 0.5rem 0 0;
  max-width: 54ch;
  font-size: 0.9375rem;
  color: var(--ec-muted);
}

/* Grid gutters. JetEngine lays items out with padding on each column, so
   the gap goes on the item, not the track. */
.jet-listing-grid__items { margin: 0 -10px; }
.jet-listing-grid__item { padding: 10px; }

/* ------------------------------------------------------------------ */
/*  Brief card                                                        */
/* ------------------------------------------------------------------ */
.ec-card__kicker { align-items: center; flex-wrap: wrap; }
.ec-card--brief .ec-card__where { display: flex; align-items: baseline; gap: 0.35rem; }
.ec-card__area .jet-listing-dynamic-field__content {
  font-size: 0.8125rem;
  color: var(--ec-muted);
}
.ec-card--brief .ec-card__price .jet-listing-dynamic-field__content { font-size: 0.875rem; }

/* Elementor's nav pointer uses the kit accent, which is not our orange. */
.ec-header__nav .e--pointer-underline .elementor-item:before,
.ec-header__nav .e--pointer-underline .elementor-item:after {
  background-color: var(--ec-orange);
}
.ec-header__nav .elementor-item.elementor-item-active { color: var(--ec-orange); }

/* Cards stretch to the row height; the footer is pinned to the bottom so
   price lines up across a row regardless of blurb length. */
.jet-listing-grid__item > .elementor { height: 100%; }
.ec-card { display: flex; flex-direction: column; height: 100%; }
.ec-card__body { flex: 1 1 auto; }
.ec-card__foot { margin-top: auto; }

/* ------------------------------------------------------------------ */
/*  Single supplier / single brief                                    */
/* ------------------------------------------------------------------ */
.ec-single__photo img {
  display: block;
  width: 100%;
  height: clamp(220px, 34vw, 420px);
  object-fit: cover;
}
.ec-single__grid { align-items: flex-start; }
.ec-single__head { align-items: baseline; justify-content: flex-start; }
.ec-single__name .elementor-heading-title,
.ec-single__name .jet-listing-dynamic-field__content {
  margin: 0;
  font-family: var(--ec-display);
  font-size: clamp(1.7rem, 3.4vw, 2.4rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.08;
  color: var(--ec-ink);
}
.ec-single__rating .jet-listing-dynamic-field__content {
  font-size: 0.9375rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.ec-single__where { align-items: baseline; }
.ec-single__where .jet-listing-dynamic-terms__link {
  font-size: 0.9375rem;
  color: var(--ec-muted);
  text-decoration: none;
}
.ec-single__lede .jet-listing-dynamic-field__content {
  font-size: 1.0625rem;
  line-height: 1.6;
  color: var(--ec-ink);
}
.ec-single__h2 .elementor-heading-title {
  font-family: var(--ec-display);
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  margin: 0.6rem 0 0;
}
.ec-prose .jet-listing-dynamic-field__content {
  font-size: 0.9375rem;
  line-height: 1.65;
  color: var(--ec-muted);
}
.ec-prose p { margin: 0 0 0.85em; }

.ec-lines { margin: 0; padding: 0; list-style: none; display: grid; gap: 0.3rem; }
.ec-lines li {
  position: relative;
  padding-left: 1.1rem;
  font-size: 0.9375rem;
  color: var(--ec-ink);
}
/* A rule, not a bullet — these are capability statements, not prose. */
.ec-lines li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.62em;
  width: 0.6rem;
  height: 1px;
  background: var(--ec-orange);
}

.ec-panel {
  background: var(--ec-surface);
  border: 1px solid var(--ec-line);
  border-radius: 14px;
}
.ec-single__panel { position: sticky; top: 84px; }
.ec-panel__price { align-items: baseline; }
.ec-single__price .jet-listing-dynamic-field__content {
  font-family: var(--ec-display);
  font-size: 1.5rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--ec-ink);
  font-variant-numeric: tabular-nums;
}
.ec-panel__h3 .elementor-heading-title {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--ec-muted);
  margin: 0.6rem 0 0;
}
.ec-fact {
  align-items: baseline;
  justify-content: space-between;
  border-top: 1px solid var(--ec-line);
  padding-top: 0.5rem;
}
.ec-fact__label p {
  margin: 0;
  font-size: 0.8125rem;
  color: var(--ec-muted);
}
.ec-fact__value .jet-listing-dynamic-field__content {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--ec-ink);
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.ec-panel__cta { margin-top: 0.4rem; }
.ec-panel__cta .elementor-button {
  width: 100%;
  background: var(--ec-orange);
  border-color: var(--ec-orange);
  border-radius: 9px;
  font-weight: 600;
}
.ec-panel__cta .elementor-button:hover { background: var(--ec-orange-deep); }

@media (max-width: 880px) {
  .ec-single__main,
  .ec-single__aside { width: 100% !important; }
  .ec-single__panel { position: static; }
}

/* ------------------------------------------------------------------ */
/*  Single layout corrections                                         */
/*                                                                    */
/*  Column widths are set here rather than through Elementor's        */
/*  container 'width' control: inside a flex row that control did not  */
/*  apply and both columns fell to full width, stacking the panel      */
/*  under the prose.                                                  */
/* ------------------------------------------------------------------ */
.ec-single__hero,
.ec-single__hero > .e-con-inner { max-width: none; width: 100%; padding: 0; }
.ec-single__photo,
.ec-single__photo .jet-listing-dynamic-image { width: 100%; }
.ec-single__photo img { width: 100%; }

.ec-single__grid { flex-wrap: wrap; }
.ec-single__main  { flex: 1 1 min(620px, 100%); min-width: 0; }
.ec-single__aside { flex: 1 1 300px; min-width: 0; }

/* The kit's default heading colour is a pale blue that disappears on the
   page ground; these headings are structural, so they take ink. */
.ec-single__h2 .elementor-heading-title,
.ec-archive__title .elementor-heading-title { color: var(--ec-ink); }
.ec-lines li::before { background: var(--ec-orange); }

/* Elementor compiles per-element rules with higher specificity than a plain
   class, so these structural overrides are forced. */
.ec-single__hero,
.ec-single__hero > .e-con-inner,
.ec-single__photo,
.ec-single__photo .jet-listing-dynamic-image,
.ec-single__photo img {
  width: 100% !important;
  max-width: none !important;
}
.ec-single__main  { flex: 1 1 560px !important; width: auto !important; }
.ec-single__aside { flex: 0 1 320px !important; width: auto !important; }

/* ------------------------------------------------------------------ */
/*  Filter rail                                                       */
/* ------------------------------------------------------------------ */
.ec-archive__split { align-items: flex-start; flex-wrap: wrap; }
.ec-filters {
  flex: 0 1 260px !important;
  width: auto !important;
  position: sticky;
  top: 84px;
  background: var(--ec-surface);
  border: 1px solid var(--ec-line);
  border-radius: 14px;
}
.ec-archive__results { flex: 1 1 min(640px, 100%) !important; width: auto !important; min-width: 0; }

.ec-filters__title .elementor-heading-title {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--ec-muted);
  margin: 0;
}
.jet-filter-label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--ec-ink);
  margin-bottom: 0.4rem;
}
.jet-checkboxes-list__row,
.jet-radio-list__row {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.15rem 0;
  font-size: 0.8125rem;
  color: var(--ec-ink);
  cursor: pointer;
}
.jet-checkboxes-list__input,
.jet-radio-list__input { accent-color: var(--ec-orange); }
.jet-filter-items-count { color: var(--ec-muted); font-variant-numeric: tabular-nums; }

.jet-search-filter__input,
.ec-filter input[type="text"],
.ec-filter input[type="search"] {
  width: 100%;
  border: 1px solid var(--ec-line);
  border-radius: 8px;
  padding: 0.5rem 0.65rem;
  font-size: 0.8125rem;
}
.ec-filters__clear .jet-remove-all-filters__button,
.ec-filters__clear button {
  border: 1px solid var(--ec-line);
  background: transparent;
  border-radius: 8px;
  padding: 0.45rem 0.8rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--ec-muted);
  cursor: pointer;
}
.ec-pagination { margin-top: 1rem; }
.jet-filters-pagination__item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 34px;
  margin-right: 0.3rem;
  border: 1px solid var(--ec-line);
  border-radius: 8px;
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
}
.jet-filters-pagination__current {
  background: var(--ec-orange);
  border-color: var(--ec-orange);
  color: #fff;
}

@media (max-width: 880px) {
  .ec-filters { position: static; flex-basis: 100% !important; }
}

/* Elementor's per-element rules outrank a plain class, so the brand colour
   is forced on controls the kit would otherwise paint with its accent. */
.ec-header__nav .elementor-item:before,
.ec-header__nav .elementor-item:after { background-color: var(--ec-orange) !important; }

.ec-filters__group .elementor-heading-title {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ec-muted);
  margin: 0.5rem 0 0;
  padding-top: 0.6rem;
  border-top: 1px solid var(--ec-line);
}
.ec-filters .jet-search-filter,
.ec-filters .jet-filter { width: 100%; }
.ec-filters .apply-filters__button,
.ec-filters button[class*="apply"] {
  background: var(--ec-orange) !important;
  border: 1px solid var(--ec-orange) !important;
  color: #fff !important;
  border-radius: 8px;
  padding: 0.45rem 0.9rem;
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
}

/* ------------------------------------------------------------------ */
/*  Home                                                              */
/* ------------------------------------------------------------------ */
.ec-hero { text-align: left; }
.ec-hero__title .elementor-heading-title {
  font-family: var(--ec-display);
  font-size: clamp(2.2rem, 5.5vw, 3.9rem);
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1.02;
  color: var(--ec-ink);
  margin: 0;
  max-width: 18ch;
}
.ec-hero__lede p {
  margin: 1rem 0 0;
  max-width: 56ch;
  font-size: 1.0625rem;
  line-height: 1.55;
  color: var(--ec-muted);
}

/* The search bar is one object, so the controls sit inside a single
   bordered surface rather than looking like three loose inputs. */
.ec-bar {
  margin-top: 1.6rem;
  align-items: center;
  flex-wrap: wrap;
  background: var(--ec-surface);
  border: 1px solid var(--ec-line);
  border-radius: 14px;
  box-shadow: 0 18px 40px -34px rgb(26 26 26 / 0.6);
}
.ec-bar__field { flex: 1 1 200px; min-width: 0; }
.ec-bar__field select,
.ec-bar__field input[type="text"],
.ec-bar__field input[type="search"] {
  width: 100%;
  border: 1px solid var(--ec-line);
  border-radius: 9px;
  padding: 0.6rem 0.7rem;
  font-size: 0.875rem;
  background: var(--ec-surface);
  color: var(--ec-ink);
}
.ec-bar .apply-filters__button,
.ec-bar button[class*="apply"] {
  background: var(--ec-orange) !important;
  border: 1px solid var(--ec-orange) !important;
  color: #fff !important;
  border-radius: 9px;
  padding: 0.6rem 1.1rem;
  font-weight: 600;
  cursor: pointer;
}

.ec-home__block { padding-top: 32px; }
.ec-home__head { align-items: baseline; justify-content: space-between; flex-wrap: wrap; }
.ec-home__h2 .elementor-heading-title {
  font-family: var(--ec-display);
  font-size: clamp(1.3rem, 2.6vw, 1.8rem);
  font-weight: 800;
  letter-spacing: -0.025em;
  color: var(--ec-ink);
  margin: 0 0 1rem;
}
.ec-btn--outline .elementor-button {
  background: transparent;
  border: 1px solid var(--ec-line-strong);
  color: var(--ec-ink);
  border-radius: 8px;
  padding: 0.5rem 0.9rem;
  font-size: 0.8125rem;
  font-weight: 600;
}
.ec-btn--outline .elementor-button:hover {
  border-color: var(--ec-orange);
  color: var(--ec-orange);
}

.ec-how { background: var(--ec-surface); border-top: 1px solid var(--ec-line); }
.ec-how__row { flex-wrap: wrap; align-items: stretch; }
.ec-step {
  flex: 1 1 260px;
  min-width: 0;
  border: 1px solid var(--ec-line);
  border-radius: 12px;
  background: var(--ec-ground);
}
.ec-step__n p {
  margin: 0;
  font-family: var(--ec-display);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--ec-orange);
}
.ec-step__title .elementor-heading-title {
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  color: var(--ec-ink);
  margin: 0;
}
.ec-step__body p { margin: 0; font-size: 0.875rem; line-height: 1.5; color: var(--ec-muted); }

/* The apply button is emitted inside the search widget, so it stacks under
   the input by default; the search filter is laid out as a row to bring the
   two back onto one line, and every control in the bar is given the same
   height so the three fields read as one object. */
.ec-bar .jet-search-filter {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.ec-bar .jet-search-filter__input-wrapper { flex: 1 1 auto; min-width: 0; }
.ec-bar .jet-search-filter__submit { flex: none; white-space: nowrap; }
.ec-bar__field:first-child { flex: 2 1 320px; }

.ec-bar__field select,
.ec-bar__field input[type="text"],
.ec-bar__field input[type="search"],
.ec-bar .jet-search-filter__submit {
  height: 42px;
  line-height: 1;
}
.ec-bar__field select { min-width: 100%; }

/* The bar is laid out as a grid so the three fields divide its width rather
   than sitting at their natural sizes with dead space to the right. */
.ec-bar {
  display: grid !important;
  grid-template-columns: minmax(0, 2.2fr) minmax(0, 1fr) minmax(0, 1fr);
  gap: 10px;
  align-items: center;
}
.ec-bar__field,
.ec-bar__field > div,
.ec-bar__field .jet-filter,
.ec-bar__field .jet-select { width: 100% !important; }
.ec-bar__field select { width: 100% !important; }

@media (max-width: 720px) {
  .ec-bar { grid-template-columns: 1fr; }
}

/* The select sits inside .elementor-widget-container > .jet-filter >
   .jet-select, each of which is inline-width by default, so the chain is
   stretched rather than just the control. */
.ec-bar__field > .elementor-widget-container,
.ec-bar__field .jet-smart-filters-select,
.ec-bar__field .jet-select,
.ec-bar__field .jet-select__control {
  display: block;
  width: 100% !important;
  max-width: none !important;
}
.ec-bar__field .jet-select__control {
  border: 1px solid var(--ec-line);
  border-radius: 9px;
  padding: 0.6rem 0.7rem;
  font-size: 0.875rem;
  height: 42px;
  background: var(--ec-surface);
  color: var(--ec-ink);
}


/* ================================================================== */
/*  Content pages                                                     */
/* ================================================================== */
.ec-eyebrow p {
  margin: 0 0 0.4rem;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--ec-orange);
}
.ec-page__header { padding-top: 56px; }
.ec-page__cta { margin-top: 1.2rem; }
.ec-page__cta .elementor-button {
  background: var(--ec-orange); border-color: var(--ec-orange);
  color: #fff; border-radius: 9px; font-weight: 600;
}
.ec-narrow .e-con-inner { max-width: 74ch; }
.ec-band {
  background: var(--ec-surface);
  border-top: 1px solid var(--ec-line);
  border-bottom: 1px solid var(--ec-line);
}

.ec-page__body p { font-size: 0.9375rem; line-height: 1.65; color: var(--ec-muted); }
.ec-prose-block { max-width: 68ch; }
.ec-prose-block p { font-size: 1.0625rem; line-height: 1.7; margin: 0 0 1.1rem; }

.ec-h2, .ec-page__body h2 {
  font-family: var(--ec-display);
  font-size: 1.4rem; font-weight: 800; letter-spacing: -0.025em;
  color: var(--ec-ink); margin: 2rem 0 0.6rem;
}
.ec-note {
  margin-top: 2rem; padding: 0.9rem 1rem;
  background: var(--ec-raise); border-radius: 12px;
  font-size: 0.8125rem !important; line-height: 1.6;
}

/* about ------------------------------------------------------------ */
.ec-stats {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.5rem; margin: 2.5rem 0 0;
  border-top: 1px solid var(--ec-line); padding-top: 2rem;
}
.ec-stats dd, .ec-stats dt { margin: 0; }
.ec-stat__v {
  font-family: var(--ec-display); font-size: 2rem; font-weight: 800;
  letter-spacing: -0.03em; color: var(--ec-ink); font-variant-numeric: tabular-nums;
}
.ec-stat__l { font-size: 0.8125rem; color: var(--ec-muted); margin-top: 0.15rem; }
.ec-callout {
  margin-top: 2.5rem; padding: 1.4rem;
  background: var(--ec-raise); border-radius: 16px;
}
.ec-callout h2 { margin: 0 0 0.4rem; font-size: 1rem; font-weight: 700; }
.ec-actions { display: flex; flex-wrap: wrap; gap: 0.6rem; margin-top: 2rem; }

.ec-btn-a {
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 9px; padding: 0.65rem 1.1rem;
  background: var(--ec-orange); border: 1px solid var(--ec-orange);
  color: #fff !important; font-size: 0.875rem; font-weight: 600;
  text-decoration: none; line-height: 1;
}
.ec-btn-a:hover { background: var(--ec-orange-deep); }
.ec-btn-a--outline {
  background: transparent; border-color: var(--ec-line-strong);
  color: var(--ec-ink) !important;
}
.ec-btn-a--outline:hover {
  border-color: var(--ec-orange); color: var(--ec-orange) !important; background: transparent;
}

/* how it works ----------------------------------------------------- */
.ec-steps { list-style: none; margin: 0; padding: 0; }
.ec-steps__row {
  display: grid; gap: 1.4rem; padding: 1.8rem 0;
  border-top: 1px solid var(--ec-line);
  grid-template-columns: 1fr;
}
.ec-steps__row:first-child { border-top: 0; padding-top: 0; }
.ec-steps__n span {
  display: block; font-family: var(--ec-display);
  font-size: 0.8125rem; font-weight: 800; color: var(--ec-orange); letter-spacing: 0.06em;
}
.ec-steps__n h2 {
  margin: 0.4rem 0 0; font-family: var(--ec-display);
  font-size: 1.25rem; font-weight: 700; letter-spacing: -0.02em; color: var(--ec-ink);
}
.ec-steps__side h3 {
  margin: 0 0 0.35rem; font-size: 0.8125rem; font-weight: 700; color: var(--ec-orange);
}
.ec-steps__side p { margin: 0; }
@media (min-width: 900px) {
  .ec-steps__row { grid-template-columns: 12rem 1fr 1fr; gap: 2.5rem; }
  .ec-steps__side { border-left: 1px solid var(--ec-line); padding-left: 2rem; }
}

.ec-split { display: grid; gap: 2.5rem; }
.ec-split__h {
  font-family: var(--ec-display); font-size: clamp(1.6rem, 3.2vw, 2.2rem);
  font-weight: 800; letter-spacing: -0.03em; line-height: 1.1;
  color: var(--ec-ink); margin: 0 0 1rem;
}
.ec-facets { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ec-line); }
.ec-facets li {
  display: grid; gap: 0.15rem; padding: 0.8rem 0 0.8rem 1.2rem;
  border-bottom: 1px solid var(--ec-line); position: relative;
}
.ec-facets li::before {
  content: ""; position: absolute; left: 0; top: 1.15rem;
  width: 7px; height: 7px; border-radius: 50%; background: var(--ec-orange);
}
.ec-facets__k { font-size: 0.9375rem; font-weight: 600; color: var(--ec-ink); }
.ec-facets__d { font-size: 0.875rem; color: var(--ec-muted); line-height: 1.55; }
@media (min-width: 1000px) { .ec-split { grid-template-columns: 1fr 1.1fr; gap: 3.5rem; } }

.ec-roles { list-style: none; margin: 1.5rem 0 0; padding: 0; display: grid; gap: 0; }
.ec-roles li { border-bottom: 1px solid var(--ec-line); }
.ec-roles a { display: block; padding: 0.85rem 0; text-decoration: none; }
.ec-roles a:hover .ec-roles__n { color: var(--ec-orange); }
.ec-roles__n { display: block; font-size: 0.9375rem; font-weight: 600; color: var(--ec-ink); }
.ec-roles__d { display: block; margin-top: 0.15rem; font-size: 0.875rem; color: var(--ec-muted); }
@media (min-width: 860px) { .ec-roles { grid-template-columns: 1fr 1fr; column-gap: 3rem; } }

/* pricing ---------------------------------------------------------- */
.ec-plans { display: grid; gap: 1.2rem; }
@media (min-width: 980px) { .ec-plans { grid-template-columns: repeat(3, 1fr); } }
.ec-plan {
  display: flex; flex-direction: column;
  background: var(--ec-surface); border: 1px solid var(--ec-line);
  border-radius: 16px; padding: 1.5rem;
}
.ec-plan--popular { border-color: var(--ec-orange); box-shadow: 0 0 0 1px var(--ec-orange); }
.ec-plan__head { display: flex; align-items: center; justify-content: space-between; gap: 0.6rem; }
.ec-plan__head h2 {
  margin: 0; font-family: var(--ec-display); font-size: 1.4rem;
  font-weight: 700; letter-spacing: -0.02em; color: var(--ec-ink);
}
.ec-plan__price {
  margin: 0.9rem 0 0 !important; font-family: var(--ec-display);
  font-size: 2.4rem !important; font-weight: 800; line-height: 1;
  letter-spacing: -0.035em; color: var(--ec-ink) !important;
}
.ec-plan__per { margin: 0.35rem 0 0 !important; font-size: 0.8125rem !important; }
.ec-plan__pitch { margin: 1rem 0 0 !important; }
.ec-plan__list {
  list-style: none; margin: 1.2rem 0 0; padding: 1.2rem 0 0;
  border-top: 1px solid var(--ec-line); display: grid; gap: 0.6rem;
}
.ec-plan__list li {
  position: relative; padding-left: 1.5rem; font-size: 0.875rem; color: var(--ec-ink);
}
.ec-plan__list li::before { position: absolute; left: 0; top: -0.05rem; font-weight: 700; }
.ec-plan__list li.is-yes::before { content: "\2713"; color: var(--ec-free); }
.ec-plan__list li.is-no::before { content: "\00d7"; color: var(--ec-line-strong); }
.ec-plan__list li.is-no { color: var(--ec-muted); opacity: 0.7; }
.ec-plan__cta { margin: 1.4rem 0 0 !important; }
.ec-plan__cta .ec-btn-a { width: 100%; }
.ec-fineprint { margin-top: 1.6rem !important; text-align: center; font-size: 0.8125rem !important; }
.ec-fineprint a { color: var(--ec-orange); }

.ec-faq { margin: 1.5rem 0 0; }
.ec-faq > div { border-bottom: 1px solid var(--ec-line); padding: 1.1rem 0; }
.ec-faq > div:last-child { border-bottom: 0; }
.ec-faq dt { font-size: 0.9375rem; font-weight: 600; color: var(--ec-ink); }
.ec-faq dd { margin: 0.4rem 0 0; font-size: 0.9375rem; line-height: 1.6; color: var(--ec-muted); }

/* contact ---------------------------------------------------------- */
.ec-cards2 { display: grid; gap: 1.1rem; }
@media (min-width: 700px) { .ec-cards2 { grid-template-columns: 1fr 1fr; } }
.ec-panel-b {
  background: var(--ec-surface); border: 1px solid var(--ec-line);
  border-radius: 14px; padding: 1.4rem;
}
.ec-panel-b h2 { margin: 0 0 0.4rem; font-size: 1.15rem; font-weight: 700; color: var(--ec-ink); }
.ec-panel-b--wide { margin-top: 1.1rem; }
.ec-panel-b address {
  font-style: normal; font-size: 0.9375rem; line-height: 1.65; color: var(--ec-muted);
}
.ec-mail {
  display: inline-block; margin-top: 0.8rem;
  font-size: 0.875rem; font-weight: 600; color: var(--ec-orange); text-decoration: none;
}
.ec-mail:hover { text-decoration: underline; }

/* legal ------------------------------------------------------------ */
.ec-legal h2 { font-size: 1.15rem; margin: 1.8rem 0 0.4rem; }
.ec-legal p { margin: 0 0 0.6rem; }
.ec-legal a { color: var(--ec-orange); }
.ec-updated { font-size: 0.8125rem !important; color: var(--ec-muted); }

/* ================================================================== */
/*  Account and app pages                                             */
/* ================================================================== */
.ec-form { max-width: 460px; }
.ec-form label {
  display: block; font-size: 0.875rem; font-weight: 600; color: var(--ec-ink); margin-bottom: 0.35rem;
}
.ec-form .ec-field { margin-bottom: 1rem; }
.ec-form input, .ec-form select, .ec-form textarea {
  width: 100%; border: 1px solid var(--ec-line); border-radius: 9px;
  padding: 0.6rem 0.7rem; font-size: 0.9375rem; font-family: inherit;
  background: var(--ec-surface); color: var(--ec-ink);
}
.ec-form textarea { min-height: 120px; resize: vertical; }
.ec-form__row { display: flex; align-items: baseline; justify-content: space-between; gap: 0.75rem; }
.ec-form__row a { font-size: 0.75rem; color: var(--ec-orange); }
.ec-form button {
  width: 100%; border: 1px solid var(--ec-orange); background: var(--ec-orange);
  color: #fff; border-radius: 9px; padding: 0.7rem 1rem;
  font-size: 0.9375rem; font-weight: 600; cursor: pointer;
}
.ec-form button:hover { background: var(--ec-orange-deep); }
.ec-alt { margin-top: 1.2rem !important; font-size: 0.875rem !important; }
.ec-alt a { color: var(--ec-orange); }

.ec-empty {
  border: 1px dashed var(--ec-line-strong); border-radius: 14px;
  padding: 2.5rem 1.5rem; text-align: center;
}
.ec-empty h2 { margin: 0 0 0.4rem; font-size: 1.05rem; font-weight: 700; color: var(--ec-ink); }
.ec-empty p { margin: 0 auto; max-width: 44ch; }
.ec-empty .ec-actions { justify-content: center; }

.ec-roles-grid { display: grid; gap: 0.8rem; margin-top: 1.4rem; }
@media (min-width: 760px) { .ec-roles-grid { grid-template-columns: repeat(2, 1fr); } }
.ec-role-slot {
  border: 1px solid var(--ec-line); border-radius: 12px;
  padding: 0.9rem 1rem; background: var(--ec-surface);
}
.ec-role-slot h3 { margin: 0; font-size: 0.9375rem; font-weight: 600; color: var(--ec-ink); }
.ec-role-slot p { margin: 0.2rem 0 0 !important; font-size: 0.8125rem !important; }
.ec-role-slot--empty { background: transparent; border-style: dashed; }


/* ================================================================== */
/*  Saved-items controls                                              */
/* ================================================================== */
.jet-listing-grid__item .ec-card { position: relative; }
.ec-save {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 999px;
  background: rgb(255 255 255 / 0.92);
  box-shadow: 0 2px 8px -2px rgb(26 26 26 / 0.45);
  color: var(--ec-line-strong);
  font-size: 0.95rem;
  line-height: 1;
  cursor: pointer;
  transition: color 0.15s ease, background 0.15s ease;
}
.ec-save:hover { color: var(--ec-orange); background: #fff; }
.ec-save[aria-pressed="true"] { color: var(--ec-orange); }

.screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.ec-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.6rem;
  padding: 0.1rem 0.45rem;
  margin-left: 0.4rem;
  border-radius: 999px;
  background: var(--ec-raise);
  color: var(--ec-muted);
  font-family: var(--ec-sans);
  font-size: 0.75rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  vertical-align: middle;
}

/* ================================================================== */
/*  Post a brief                                                      */
/* ================================================================== */
.ec-form--wide { max-width: 760px; }
.ec-grid2 { display: grid; gap: 0 1rem; }
@media (min-width: 640px) { .ec-grid2 { grid-template-columns: 1fr 1fr; } }

.ec-roleboxes {
  display: grid;
  gap: 0.4rem 1rem;
  padding: 0.9rem 1rem;
  border: 1px solid var(--ec-line);
  border-radius: 10px;
  background: var(--ec-surface);
}
@media (min-width: 640px) { .ec-roleboxes { grid-template-columns: 1fr 1fr; } }
.ec-rolebox {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin: 0 !important;
  font-size: 0.875rem;
  font-weight: 500 !important;
  color: var(--ec-ink);
  cursor: pointer;
}
.ec-rolebox input { width: auto !important; accent-color: var(--ec-orange); }

/* ================================================================== */
/*  404                                                               */
/* ================================================================== */
.ec-404 { text-align: center; }
.ec-404__n {
  margin: 0 !important;
  font-family: var(--ec-display);
  font-size: 4rem !important;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.04em;
  color: var(--ec-line-strong) !important;
  font-variant-numeric: tabular-nums;
}
.ec-404__h {
  margin: 1rem 0 0;
  font-family: var(--ec-display);
  font-size: 2rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: var(--ec-ink);
}
.ec-404__p {
  margin: 0.75rem auto 0 !important;
  max-width: 42ch;
}
.ec-404__a { justify-content: center; }

/* ------------------------------------------------------------------ */
/*  Form outcomes and the honeypot                                    */
/* ------------------------------------------------------------------ */
/* Off-screen rather than display:none — a bot reading the stylesheet
   skips a hidden field, but fills one it believes a human can see. */
.ec-hp {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.ec-notice {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  margin: 0 0 1.5rem;
  padding: 1rem 1.15rem;
  border-radius: 12px;
  border: 1px solid var(--ec-line);
  background: var(--ec-surface);
  font-size: 0.9375rem;
  line-height: 1.55;
}
.ec-notice strong { font-weight: 700; color: var(--ec-ink); }
.ec-notice span { color: var(--ec-muted); }
.ec-notice--ok  { border-color: #b9dcc4; background: #f2fbf5; }
.ec-notice--ok strong { color: #1d6b38; }
.ec-notice--err { border-color: #f0c2ae; background: var(--ec-orange-wash); }
.ec-notice--err strong { color: var(--ec-orange-deep); }
.ec-notice:focus { outline: 2px solid var(--ec-orange); outline-offset: 2px; }

/* ------------------------------------------------------------------ */
/*  Accounts                                                          */
/* ------------------------------------------------------------------ */
/* Signed in, the sign-in and sign-up forms give way to the account
   panel the shortcode prints; the body class is WordPress's own. */
.logged-in .ec-form--auth,
.logged-in .ec-auth-lede { display: none !important; }

.ec-hdr__account { display: none !important; }
.logged-in .ec-hdr__account { display: inline-flex !important; }
.logged-in .ec-hdr__signin { display: none !important; }

.ec-account {
  margin: 0 0 1.5rem;
  padding: 1rem 1.15rem;
  border: 1px solid var(--ec-line);
  border-radius: 12px;
  background: var(--ec-surface);
  font-size: 0.9375rem;
}
.ec-account p { margin: 0 0 0.6rem !important; }
.ec-account p:last-child { margin-bottom: 0 !important; }
.ec-account span { color: var(--ec-muted); font-size: 0.8125rem; }
.ec-account a { color: var(--ec-orange); }
.ec-account .ec-btn-a { color: #fff; }
.ec-account--guest { background: var(--ec-orange-wash); border-color: #f0c2ae; }
.ec-account__out { font-size: 0.8125rem; }

.ec-hint {
  display: block;
  margin-top: 0.35rem;
  font-size: 0.75rem;
  color: var(--ec-muted);
}


/* ================================================================== */
/*  Footer columns                                                    */
/* ================================================================== */
.ec-footer { background: var(--ec-ink); color: #cfcbc4; margin-top: 64px; }
.ec-footer p { margin: 0; font-size: 0.8125rem; line-height: 1.6; }
.ec-footer a { color: #cfcbc4; text-decoration: none; }
.ec-footer a:hover { color: #fff; }

.ec-footer__brand strong {
  color: #fff;
  font-family: var(--ec-display);
  font-size: 1.05rem;
  letter-spacing: -0.02em;
}
.ec-footer__blurb { margin-top: 0.4rem !important; max-width: 46ch; color: #9d9892; }

.ec-footer__cols {
  display: grid;
  gap: 1.8rem;
  margin-top: 2rem;
  padding-top: 2rem;
  border-top: 1px solid rgb(255 255 255 / 0.12);
}
@media (min-width: 720px) { .ec-footer__cols { grid-template-columns: repeat(3, 1fr); } }

.ec-footer__col h2 {
  margin: 0 0 0.7rem;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: #8a857f;
}
.ec-footer__col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.45rem; }
.ec-footer__col a { font-size: 0.875rem; }

.ec-footer__legal {
  margin-top: 2rem !important;
  padding-top: 1.2rem;
  border-top: 1px solid rgb(255 255 255 / 0.12);
}
.ec-footer__legal p { color: #8a857f; font-size: 0.75rem; }

/* An Elementor button in a column container stretches to the container's
   width; these are inline calls to action, not full-width bars. */
.ec-page__cta { align-self: flex-start; }
.ec-page__cta .elementor-button {
  width: auto;
  display: inline-flex;
  padding: 0.65rem 1.15rem;
  font-size: 0.875rem;
}
.ec-page__header .elementor-widget-button { width: auto; }


/* ================================================================== */
/*  Enquiry form                                                      */
/* ================================================================== */
.ec-enquiry-wrap { margin-top: 1.6rem; }
.ec-enquiry {
  background: var(--ec-surface);
  border: 1px solid var(--ec-line);
  border-radius: 16px;
  padding: 1.5rem;
  max-width: none;
}
.ec-enquiry h2 {
  margin: 0;
  font-family: var(--ec-display);
  font-size: 1.25rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--ec-ink);
}
.ec-enquiry__lede {
  margin: 0.4rem 0 1.2rem !important;
  font-size: 0.875rem !important;
  color: var(--ec-muted);
}
.ec-enquiry__foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.8rem;
  margin-top: 0.4rem;
}
.ec-enquiry__foot button { width: auto !important; padding: 0.65rem 1.2rem; }
.ec-enquiry__foot span { font-size: 0.8125rem; color: var(--ec-muted); }

.ec-sent {
  margin-top: 1.6rem;
  border: 1px solid var(--ec-free);
  background: var(--ec-free-wash);
  border-radius: 16px;
  padding: 1.5rem;
}
.ec-sent h2 {
  margin: 0;
  font-family: var(--ec-display);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--ec-free);
}
.ec-sent p { margin: 0.4rem 0 0; font-size: 0.9375rem; color: var(--ec-free); }
.ec-sent .ec-actions { margin-top: 1.1rem; }
.ec-sent .ec-btn-a--outline { border-color: var(--ec-free); color: var(--ec-free) !important; cursor: pointer; }

/* ================================================================== */
/*  Save control on a single page                                     */
/* ================================================================== */
.ec-save-host { margin-top: 0.2rem; }
.ec-save--lg {
  position: static;
  width: 100%;
  height: auto;
  gap: 0.45rem;
  padding: 0.6rem 1rem;
  border: 1px solid var(--ec-line-strong);
  border-radius: 9px;
  background: transparent;
  box-shadow: none;
  color: var(--ec-muted);
  font-size: 0.875rem;
  font-weight: 600;
}
.ec-save--lg:hover { border-color: var(--ec-orange); color: var(--ec-orange); background: transparent; }
.ec-save--lg[aria-pressed="true"] {
  border-color: var(--ec-orange);
  background: var(--ec-orange-wash);
  color: var(--ec-orange-deep);
}

/* ================================================================== */
/*  Dashboard enquiry list                                            */
/* ================================================================== */
.ec-enq { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: 0.6rem; }
.ec-enq__row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  border: 1px solid var(--ec-line);
  border-radius: 12px;
  background: var(--ec-surface);
  padding: 0.9rem 1rem;
}
.ec-enq__name {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--ec-ink);
  text-decoration: none;
}
.ec-enq__name:hover { color: var(--ec-orange); }
.ec-enq__msg {
  margin: 0.25rem 0 0 !important;
  font-size: 0.8125rem !important;
  line-height: 1.5;
  color: var(--ec-muted);
}
.ec-enq__meta {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.3rem;
  flex: none;
}
.ec-enq__when { font-size: 0.75rem; color: var(--ec-muted); font-variant-numeric: tabular-nums; }

/* ================================================================== */
/*  Availability date picker                                          */
/* ================================================================== */
.ec-date { display: flex; align-items: center; gap: 0.45rem; }
.ec-date__input {
  flex: 1 1 auto;
  min-width: 0;
  border: 1px solid var(--ec-line);
  border-radius: 8px;
  padding: 0.45rem 0.55rem;
  font-size: 0.8125rem;
  font-family: inherit;
  background: var(--ec-surface);
  color: var(--ec-ink);
}
.ec-date__clear {
  flex: none;
  border: 1px solid var(--ec-line);
  background: transparent;
  border-radius: 8px;
  padding: 0.4rem 0.6rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--ec-muted);
  cursor: pointer;
}
.ec-date__clear:hover { border-color: var(--ec-orange); color: var(--ec-orange); }

/* The availability pill on a card only appears once a date is chosen. */
.ec-card__foot .ec-pill--free,
.ec-card__foot .ec-pill--held { margin-left: auto; }


/* ================================================================== */
/*  Sorting toolbar                                                   */
/* ================================================================== */
.ec-toolbar { justify-content: flex-end; align-items: center; margin-bottom: 0.4rem; }
.ec-sorting { min-width: 0; }
.jet-sorting-select {
  border: 1px solid var(--ec-line);
  border-radius: 9px;
  padding: 0.45rem 0.6rem;
  font-size: 0.8125rem;
  font-family: inherit;
  background: var(--ec-surface);
  color: var(--ec-ink);
  min-width: 190px;
}

/* ================================================================== */
/*  Range and rating filters                                          */
/* ================================================================== */
.jet-range__inputs { display: flex; align-items: center; gap: 0.4rem; margin-top: 0.5rem; }
.jet-range__inputs__container { flex: 1 1 0; min-width: 0; }
.jet-range__inputs input,
.jet-range__values input {
  width: 100%;
  border: 1px solid var(--ec-line);
  border-radius: 8px;
  padding: 0.35rem 0.45rem;
  font-size: 0.8125rem;
  font-variant-numeric: tabular-nums;
  background: var(--ec-surface);
  color: var(--ec-ink);
}
.jet-range__inputs__group__text { font-size: 0.75rem; color: var(--ec-muted); }
.jet-range__slider { margin: 0.6rem 0.3rem; }
.jet-range__slider .ui-slider-range,
.jet-range__slider-range { background: var(--ec-orange) !important; }
.jet-range__slider .ui-slider-handle,
.jet-range__slider-handle {
  background: #fff !important;
  border: 2px solid var(--ec-orange) !important;
  border-radius: 50%;
}
.jet-range__values { font-size: 0.8125rem; color: var(--ec-ink); font-variant-numeric: tabular-nums; }

.jet-rating { display: flex; flex-direction: column; gap: 0.25rem; }
.jet-rating__item, .jet-rating-item { cursor: pointer; }
.jet-rating i, .jet-rating svg { color: var(--ec-orange); }

/* A filter group keeps breathing room from the one above it. */
.ec-filters .jet-filter { margin-bottom: 0.2rem; }


/* ================================================================== */
/*  Portfolio gallery                                                 */
/* ================================================================== */
.ec-gallery { display: grid; gap: 0.6rem; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 700px) { .ec-gallery { grid-template-columns: repeat(3, 1fr); } }
.ec-gallery__item {
  display: block;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid var(--ec-line);
  line-height: 0;
}
.ec-gallery__img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  transition: transform 0.3s ease;
}
.ec-gallery__item:hover .ec-gallery__img { transform: scale(1.04); }

/* ================================================================== */
/*  Reviews                                                           */
/* ================================================================== */
.ec-reviews { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.8rem; }
.ec-review {
  border: 1px solid var(--ec-line);
  border-radius: 14px;
  background: var(--ec-surface);
  padding: 1.1rem 1.2rem;
}
.ec-review__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
}
.ec-review__stars { color: var(--ec-orange); font-size: 0.9375rem; letter-spacing: 0.06em; }
.ec-review__when { font-size: 0.75rem; color: var(--ec-muted); }
.ec-review__text {
  margin: 0.55rem 0 0 !important;
  font-size: 0.9375rem !important;
  line-height: 1.6;
  color: var(--ec-ink) !important;
}
.ec-review__who {
  margin: 0.7rem 0 0 !important;
  font-size: 0.8125rem !important;
  color: var(--ec-muted) !important;
}
.ec-review__who strong { color: var(--ec-ink); font-weight: 600; }
.ec-review__who span::before { content: " · "; }


/* ================================================================== */
/*  Collapsible filter rail (small screens only)                      */
/* ================================================================== */
.ec-filters__toggle { display: none; }

@media (max-width: 880px) {
  .ec-filters--collapsible .ec-filters__toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    border: 0;
    background: transparent;
    padding: 0.2rem 0;
    font-family: var(--ec-display);
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--ec-ink);
    cursor: pointer;
  }
  .ec-filters__chev {
    display: inline-block;
    transform: rotate(90deg);
    transition: transform 0.2s ease;
    color: var(--ec-muted);
    font-size: 1.1rem;
  }
  .ec-filters--open .ec-filters__chev { transform: rotate(-90deg); }

  /* Everything after the toggle collapses; the toggle itself stays. */
  .ec-filters--collapsible > *:not(.ec-filters__toggle) { display: none; }
  .ec-filters--collapsible.ec-filters--open > * { display: block; }
  .ec-filters--collapsible.ec-filters--open > .ec-filters__toggle { display: flex; }

  /* The "Refine" heading is redundant once the toggle carries the label. */
  .ec-filters--collapsible .ec-filters__title { display: none !important; }
}


/* ================================================================== */
/*  Map                                                               */
/* ================================================================== */
.ec-map { margin-bottom: 0.8rem; }
.ec-map .jet-map-listing,
.ec-map .leaflet-container {
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid var(--ec-line);
}
.leaflet-container { font-family: var(--ec-sans); }

/* A 440px map above the results is most of a phone screen before a single
   supplier appears, so it gives up height where space is scarce. */
@media (max-width: 880px) {
  .ec-map .jet-map-listing,
  .ec-map .leaflet-container { height: 260px !important; }
}

/* Cluster bubbles in the brand palette rather than Leaflet's defaults. */
.marker-cluster-small div, .marker-cluster-medium div, .marker-cluster-large div {
  background: var(--ec-orange) !important;
  color: #fff !important;
  font-family: var(--ec-sans);
  font-weight: 700;
}
.marker-cluster-small, .marker-cluster-medium, .marker-cluster-large {
  background: rgb(254 89 15 / 0.28) !important;
}

/* The enquiry form nests its control inside the label, so the caption is the
   span rather than the label itself. */
.ec-enquiry .ec-field label { display: block; margin-bottom: 0; }
.ec-enquiry .ec-field label > span {
  display: block;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--ec-ink);
  margin-bottom: 0.35rem;
}


/* ================================================================== */
/*  Saved-only grids                                                  */
/*                                                                    */
/*  /saved/ and /team/ print every record and let crew.js show the    */
/*  saved ones. Hiding the grid after load was too late: the browser  */
/*  had already fetched around 25 card images -- roughly 2.7MB -- to  */
/*  render a page that then said "nothing saved yet".                 */
/*                                                                    */
/*  Starting hidden means the images are never laid out, so lazy      */
/*  loading skips them entirely until a match reveals the grid.       */
/* ================================================================== */
.ec-saved-scope,
.ec-saved-scope-brief { display: none; }

.ec-saved-scope.ec-ready,
.ec-saved-scope-brief.ec-ready { display: block; }

/* ================================================================== */
/*  Roles a brief needs                                               */
/* ================================================================== */
.ec-roles-needed { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.ec-role-need { border-bottom: 1px solid var(--ec-line); }
.ec-role-need:first-child { border-top: 1px solid var(--ec-line); }
.ec-role-need a {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.8rem 0;
  text-decoration: none;
}
.ec-role-need__name {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--ec-ink);
}
.ec-role-need a:hover .ec-role-need__name { color: var(--ec-orange); }
.ec-role-need__count {
  flex: none;
  font-size: 0.8125rem;
  color: var(--ec-muted);
  font-variant-numeric: tabular-nums;
}
.ec-role-need__where { color: var(--ec-muted); }
.ec-role-need--empty .ec-role-need__name { color: var(--ec-muted); }
.ec-role-need--empty .ec-role-need__count { color: var(--ec-held); }

/* A filter that came from the URL reads as active, not just checked. */
.jet-checkboxes-list__row.is-active { font-weight: 600; color: var(--ec-orange); }

/* The availability control: a date, and a way back to seeing everyone. */
.ec-date { display: block; }
.ec-date__row { display: flex; align-items: center; gap: 0.45rem; }
.ec-date__all {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin-top: 0.5rem;
  font-size: 0.75rem;
  color: var(--ec-muted);
  cursor: pointer;
}
.ec-date__all input { accent-color: var(--ec-orange); }

/* ------------------------------------------------------------------ */
/*  Distance control                                                  */
/* ------------------------------------------------------------------ */
.ec-near { display: block; }
.ec-near__ask,
.ec-near__off {
  width: 100%;
  border: 1px solid var(--ec-line-strong);
  background: transparent;
  border-radius: 8px;
  padding: 0.5rem 0.8rem;
  font-size: 0.8125rem;
  font-weight: 600;
  font-family: inherit;
  color: var(--ec-ink);
  cursor: pointer;
}
.ec-near__ask:hover,
.ec-near__off:hover { border-color: var(--ec-orange); color: var(--ec-orange); }
.ec-near__ask[disabled] { opacity: 0.6; cursor: default; }
.ec-near__note {
  margin: 0.5rem 0 0 !important;
  font-size: 0.75rem !important;
  line-height: 1.5;
  color: var(--ec-muted) !important;
}
.ec-near__on {
  display: flex;
  flex-direction: column;
  margin: 0 0 0.6rem !important;
  font-size: 0.8125rem !important;
}
.ec-near__on strong { color: var(--ec-orange); }
.ec-near__on span { color: var(--ec-muted); font-size: 0.75rem; }
.ec-near__radius {
  width: 100%;
  margin-bottom: 0.5rem;
  border: 1px solid var(--ec-line-strong);
  border-radius: 8px;
  padding: 0.45rem 0.6rem;
  font-family: inherit;
  font-size: 0.8125rem;
  background: var(--ec-surface);
  color: var(--ec-ink);
}

/* The per-card distance, sitting after the city on the card's where line. */
.ec-km {
  margin-left: 0.5rem;
  padding-left: 0.5rem;
  border-left: 1px solid var(--ec-line);
  color: var(--ec-orange);
  font-size: 0.8125rem;   /* the city link's size; the wrapper's is 16px */
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}


/* ================================================================== */
/*  Header — rebuilt to match the static build                        */
/*                                                                    */
/*  Supersedes the earlier header rules above. The differences that   */
/*  mattered: the nav sits next to the logo rather than centred, the  */
/*  active item is an orange pill rather than Elementor's green       */
/*  underline, and the right-hand cluster carries Shortlist, Saved    */
/*  and Sign in before the CTA.                                       */
/* ================================================================== */
.ec-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgb(247 246 244 / 0.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--ec-line);
}
.ec-header > .e-con-inner { max-width: 1440px; }

.ec-header__row {
  align-items: center;
  justify-content: flex-start;
  min-height: 64px;
  flex-wrap: nowrap;
}

.ec-header__logo { flex: none; }
.ec-header__logo img { display: block; height: 28px; width: auto; }

/* The nav follows the logo; the action cluster takes the slack. */
.ec-header__nav { flex: none; margin-left: 0 !important; }
.ec-header__actions { margin-left: auto; flex: none; }

.ec-header__nav .elementor-nav-menu { gap: 0.15rem; }
.ec-header__nav .elementor-item {
  border-radius: 8px;
  padding: 0.5rem 0.75rem !important;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--ec-muted) !important;
  transition: background 0.15s ease, color 0.15s ease;
}
.ec-header__nav .elementor-item:hover {
  background: var(--ec-raise);
  color: var(--ec-ink) !important;
}
/* Elementor's kit paints the active item with its own accent, which is not
   this brand's orange, so the state is forced. */
.ec-header__nav .elementor-item.elementor-item-active,
.ec-header__nav .elementor-item-active {
  background: var(--ec-orange-wash) !important;
  color: var(--ec-orange) !important;
  font-weight: 600;
}
/* The underline pointer belongs to a different design; remove it. */
.ec-header__nav .elementor-item:before,
.ec-header__nav .elementor-item:after { display: none !important; }

/* ---- right-hand cluster ------------------------------------------ */
.ec-hdr__actions {
  display: flex;
  align-items: center;
  gap: 0.35rem;
}
.ec-hdr__actions a { text-decoration: none; }

.ec-hdr__link {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  border-radius: 8px;
  padding: 0.5rem 0.7rem;
  font-size: 0.875rem;
  color: var(--ec-muted);
  transition: background 0.15s ease, color 0.15s ease;
}
.ec-hdr__link:hover { background: var(--ec-raise); color: var(--ec-ink); }

.ec-hdr__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.15rem;
  padding: 0.05rem 0.35rem;
  border-radius: 999px;
  background: var(--ec-orange);
  color: #fff;
  font-size: 0.6875rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.ec-hdr__icon {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.55rem;
  border-radius: 8px;
  color: var(--ec-muted);
  transition: background 0.15s ease, color 0.15s ease;
}
.ec-hdr__icon:hover { background: var(--ec-raise); color: var(--ec-ink); }
.ec-hdr__dot {
  position: absolute;
  top: 0.3rem;
  right: 0.3rem;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ec-orange);
  box-shadow: 0 0 0 2px var(--ec-ground);
}

.ec-hdr__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  padding: 0.5rem 0.85rem;
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
}
.ec-hdr__btn--outline {
  border: 1px solid var(--ec-line-strong);
  color: var(--ec-ink);
}
.ec-hdr__btn--outline:hover { border-color: var(--ec-orange); color: var(--ec-orange); }
.ec-hdr__btn--primary {
  background: var(--ec-orange);
  border: 1px solid var(--ec-orange);
  color: #fff;
}
.ec-hdr__btn--primary:hover { background: var(--ec-orange-deep); }

/* The original drops these in the same order as the room runs out. */
@media (max-width: 1100px) { .ec-hdr__shortlist span:not(.ec-hdr__badge) { display: none; } }
@media (max-width: 900px)  { .ec-hdr__btn--outline { display: none; } }
@media (max-width: 640px)  { .ec-hdr__icon, .ec-hdr__shortlist { display: none; } }

/* An explicit display value beats the browser's own [hidden] rule, so the
   badge and the dot kept showing a zero state they were told to hide. */
.ec-hdr__badge[hidden],
.ec-hdr__dot[hidden],
.ec-chip[hidden] { display: none !important; }

/* On small screens the nav collapses to a burger. It is a widget that sits
   after the logo in source order, which left it stranded mid-header; the
   original puts it last, after the call to action. */
@media (max-width: 1024px) {
  .ec-header__row { flex-wrap: nowrap; }
  .ec-header__logo    { order: 1; }
  .ec-header__actions { order: 2; margin-left: auto; }
  .ec-header__nav     { order: 3; margin-left: 0.2rem !important; }
}

/* Three items on one nowrap row at 390px came to four pixels more than the
   viewport, which scrolls the whole page sideways. The gap and the wordmark
   give up that space rather than letting the row wrap, which would double
   the header height. */
@media (max-width: 1024px) {
  .ec-header { padding-left: 16px !important; padding-right: 16px !important; }
  .ec-header__row { gap: 8px !important; }
  .ec-header__nav { margin-left: 0 !important; min-width: 0; }
  .ec-header__logo img { height: 24px; }
  .ec-hdr__btn--primary { padding: 0.5rem 0.7rem; font-size: 0.78rem; }
}

/* ================================================================== */
/*  Sticky header                                                     */
/*                                                                    */
/*  position:sticky was on .ec-header, which Elementor renders inside  */
/*  a <header class="elementor-NNN"> wrapper only as tall as itself.   */
/*  A sticky element can only travel within its parent's box, so with  */
/*  a 65px parent it had nowhere to stick and scrolled away with the   */
/*  page. The wrapper has to carry it.                                 */
/* ================================================================== */
header.elementor,
.elementor-location-header {
  position: sticky;
  top: 0;
  z-index: 50;
}
/* The inner section keeps the background so the sticky bar is opaque. */
.ec-header { position: static; }

/* Our own clear control. JetSmartFilters' version hides itself when it was
   not the thing that applied the filter, which is always the case here. */
.ec-clear {
  width: 100%;
  margin-top: 0.9rem;
  border: 1px solid var(--ec-line-strong);
  background: transparent;
  border-radius: 8px;
  padding: 0.5rem 0.8rem;
  font-size: 0.8125rem;
  font-weight: 600;
  font-family: inherit;
  color: var(--ec-ink);
  cursor: pointer;
}
.ec-clear:hover { border-color: var(--ec-orange); color: var(--ec-orange); }
/* JSF's own button stays hidden rather than sitting there doing nothing. */
.ec-filters__clear { display: none; }

/* ================================================================== */
/*  Home: bright and photographic                                     */
/*                                                                    */
/*  White space, large photographs, soft shadows, and the orange kept */
/*  for the things a visitor presses.                                 */
/* ================================================================== */

/* ---- hero ------------------------------------------------------------ */
.ec-hero > .e-con-inner { max-width: 1280px; }

.ec-bright-hero { position: relative; }

.ec-bright-hero__photo {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-radius: 28px;
  min-height: clamp(420px, 62vh, 600px);
  display: flex;
  align-items: flex-end;
}
.ec-bright-hero__img {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  object-position: 50% 55%;
}
/* Only as much shade as the headline needs, and only behind it. */
.ec-bright-hero__photo::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(90deg, rgb(20 22 31 / 0.5) 0%, rgb(20 22 31 / 0.22) 45%, rgb(20 22 31 / 0) 70%),
    linear-gradient(0deg, rgb(20 22 31 / 0.66) 0%, rgb(20 22 31 / 0.2) 45%, rgb(20 22 31 / 0) 65%);
}
.ec-bright-hero__copy {
  padding: clamp(28px, 5vw, 56px);
  padding-bottom: clamp(72px, 9vw, 96px);
  max-width: 760px;
}
.ec-bright-hero__copy h1 {
  margin: 0;
  font-size: clamp(2.5rem, 5.6vw, 4.4rem);
  font-weight: 750;
  line-height: 1.02;
  letter-spacing: -0.035em;
  color: #fff;
  text-wrap: balance;
  text-shadow: 0 2px 24px rgb(20 22 31 / 0.35);
}
.ec-bright-hero__copy p {
  margin: 1rem 0 0 !important;
  max-width: 52ch;
  font-size: clamp(1.02rem, 1.4vw, 1.2rem) !important;
  line-height: 1.55;
  color: rgb(255 255 255 / 0.9) !important;
}

/* ---- the search: a white bar riding the photo's lower edge ---------- */
.ec-search {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1.2fr 1.2fr 1fr auto;
  align-items: stretch;
  gap: 0;
  max-width: 980px;
  margin: -44px auto 0;
  padding: 8px;
  border: 1px solid var(--ec-line);
  border-radius: 999px;
  background: var(--ec-surface);
  box-shadow: 0 12px 40px -12px rgb(16 24 40 / 0.28);
}
.ec-search__field {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
  margin: 0;
  padding: 8px 22px;
  border-radius: 999px;
}
.ec-search__field + .ec-search__field { border-left: 1px solid var(--ec-line); }
.ec-search__field:hover { background: var(--ec-raise); }
.ec-search__field span { font-size: 0.75rem; font-weight: 700; color: var(--ec-ink); }
.ec-search__field select,
.ec-search__field input {
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0 !important;
  background: transparent;
  font: inherit;
  font-size: 0.9375rem;
  color: var(--ec-muted);
  outline: none;
  box-shadow: none !important;
}
.ec-search__field:focus-within { background: var(--ec-raise); box-shadow: inset 0 0 0 2px var(--ec-ink); }
.ec-search__go {
  align-self: stretch;
  padding: 0 30px;
  border: 0;
  border-radius: 999px;
  background: var(--ec-orange-deep);
  color: #fff;
  font: inherit;
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
}
.ec-search__go:hover { background: var(--ec-orange-hover); }

/* The four promises the site actually keeps. */
.ec-trust {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px 32px;
  margin: 26px 0 0;
  padding: 0;
}
.ec-trust li {
  position: relative;
  padding-left: 26px;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--ec-ink);
}
.ec-trust li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 18px;
  height: 18px;
  margin-top: -9px;
  border-radius: 50%;
  background: var(--ec-orange-wash)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23c2410c' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='M4 8.4l2.6 2.6L12 5.6'/%3E%3C/svg%3E")
    center / 12px no-repeat;
}

/* ---- section heads --------------------------------------------------- */
.ec-home__head { align-items: flex-end; justify-content: space-between; margin-bottom: 28px; }
.ec-home__headtext h2,
.ec-tiles__head h2,
.ec-how__h2 {
  margin: 0;
  font-size: clamp(1.8rem, 3.4vw, 2.6rem);
  font-weight: 750;
  line-height: 1.08;
  letter-spacing: -0.03em;
  color: var(--ec-ink);
}
.ec-home__headtext p,
.ec-tiles__head p { margin: 0.5rem 0 0 !important; max-width: 60ch; color: var(--ec-muted); }

/* ---- service tiles ---------------------------------------------------- */
.ec-tiles__head { margin-bottom: 28px; }
.ec-tiles {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr));
  gap: 28px 20px;
}
.ec-tiles a { display: block; text-decoration: none; color: var(--ec-ink); }
.ec-tiles__media {
  display: block;
  overflow: hidden;
  border-radius: 16px;
  aspect-ratio: 4 / 3;
  background: var(--ec-raise);
}
.ec-tiles__img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  transition: transform 0.35s ease;
}
.ec-tiles a:hover .ec-tiles__img { transform: scale(1.04); }
.ec-tiles strong { display: block; margin-top: 12px; font-size: 1.0625rem; font-weight: 700; letter-spacing: -0.01em; }
.ec-tiles__desc { display: block; margin-top: 4px; font-size: 0.875rem; line-height: 1.5; color: var(--ec-muted); }

/* ---- how it works ----------------------------------------------------- */
.ec-how { background: var(--ec-raise); }
.ec-steps3 {
  list-style: none;
  counter-reset: step;
  margin: 28px 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  gap: 20px;
}
.ec-steps3 li {
  counter-increment: step;
  padding: 26px;
  border-radius: 18px;
  background: var(--ec-surface);
  box-shadow: var(--ec-shadow);
}
.ec-steps3 li::before {
  content: counter(step);
  display: inline-grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--ec-orange-wash);
  color: var(--ec-orange-deep);
  font-weight: 800;
}
.ec-steps3 h3 { margin: 16px 0 0; font-size: 1.2rem; font-weight: 700; color: var(--ec-ink); }
.ec-steps3 p { margin: 0.5rem 0 0 !important; font-size: 0.9375rem !important; line-height: 1.6; color: var(--ec-muted); }

/* ---- for suppliers ---------------------------------------------------- */
.ec-supply__card {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: stretch;
  overflow: hidden;
  border-radius: 28px;
  background: var(--ec-orange-wash);
}
.ec-supply__media { min-height: 320px; }
.ec-supply__img { display: block; width: 100% !important; height: 100% !important; object-fit: cover; }
.ec-supply__inner { align-self: center; padding: clamp(28px, 5vw, 56px); }
.ec-supply__inner h2 { margin: 0; font-size: clamp(1.8rem, 3.4vw, 2.6rem); font-weight: 750; letter-spacing: -0.03em; color: var(--ec-ink); }
.ec-supply__inner p { margin: 0.9rem 0 0 !important; max-width: 48ch; line-height: 1.6; color: var(--ec-muted); }
.ec-supply .ec-supply__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 1.6rem !important; }

/* ---- small screens ---------------------------------------------------- */
@media (max-width: 860px) {
  .ec-search {
    grid-template-columns: 1fr;
    border-radius: 22px;
    margin-top: -32px;
    padding: 10px;
  }
  .ec-search__field { border-radius: 14px; padding: 10px 14px; }
  .ec-search__field + .ec-search__field { border-left: 0; border-top: 1px solid var(--ec-line); border-radius: 0; }
  .ec-search__go { margin-top: 6px; padding: 14px; border-radius: 14px; }
  .ec-trust { justify-content: flex-start; }
  .ec-supply__card { grid-template-columns: 1fr; }
  .ec-supply__media { min-height: 220px; }
}
@media (max-width: 600px) {
  .ec-bright-hero__photo { border-radius: 20px; min-height: 380px; }
  .ec-tiles { grid-template-columns: 1fr 1fr; gap: 20px 14px; }
  .ec-tiles__desc { display: none; }
}

/* ================================================================== */
/*  Marketplace screens: dashboard inbox, listing editor, reviews     */
/* ================================================================== */

/* Anchors the forms redirect back to sit below the sticky header. */
.ec-anchor { scroll-margin-top: 90px; }
#enquiry, #reviews, #received, #sent, #briefs,
#listing-form, #brief-form, #contact-form { scroll-margin-top: 90px; }

.ec-pill--ok { background: var(--ec-free-wash); color: var(--ec-free); }

/* Guests see the gate above the brief form, not the form itself. */
body:not(.logged-in) #brief-form { display: none; }

.ec-dash-empty { color: var(--ec-muted); font-size: 0.9375rem; }
.ec-dash-empty a { color: var(--ec-orange); }

/* ---- inbox ------------------------------------------------------------ */
.ec-inbox { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.9rem; }
.ec-inbox__item {
  border: 1px solid var(--ec-line);
  border-radius: 14px;
  background: var(--ec-surface);
  padding: 1.1rem 1.2rem;
}
.ec-inbox__item.is-new { border-color: var(--ec-orange); box-shadow: 0 0 0 1px var(--ec-orange) inset; }
.ec-inbox__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.9375rem;
}
.ec-inbox__head a { color: var(--ec-ink); text-decoration: none; }
.ec-inbox__head a:hover strong { color: var(--ec-orange); }
.ec-inbox__head span { color: var(--ec-muted); }
.ec-inbox__head time { margin-left: auto; font-size: 0.8125rem; color: var(--ec-muted); }
.ec-inbox__facts { margin: 0.35rem 0 0 !important; font-size: 0.8125rem; color: var(--ec-muted); }
.ec-inbox__msg { margin: 0.6rem 0 0 !important; font-size: 0.9375rem; line-height: 1.6; }
.ec-inbox__from { margin: 0.4rem 0 0 !important; font-size: 0.8125rem; }
.ec-inbox__from a { color: var(--ec-orange); }
.ec-inbox__reply {
  margin-top: 0.8rem;
  padding: 0.7rem 0.9rem;
  border-left: 3px solid var(--ec-orange);
  background: var(--ec-orange-wash);
  border-radius: 0 10px 10px 0;
}
.ec-inbox__reply span {
  display: block;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ec-orange-deep);
}
.ec-inbox__reply p { margin: 0.3rem 0 0 !important; font-size: 0.9375rem; line-height: 1.6; }
.ec-inbox__form { margin-top: 0.8rem; display: grid; gap: 0.5rem; }
.ec-inbox__form textarea { min-height: 4.5rem; }
.ec-inbox__form button { justify-self: start; }

/* A one-button form inside a list row, e.g. "Close" on a brief. */
.ec-inline-form { display: inline; margin: 0 0 0 0.5rem; }
.ec-linkbtn {
  border: 0;
  background: none;
  padding: 0;
  font: inherit;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--ec-orange);
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ---- listing editor ----------------------------------------------------- */
.ec-listing__state { display: flex; align-items: center; gap: 0.6rem; margin: 0 0 1.2rem !important; font-size: 0.9375rem; }
.ec-listing__state a { color: var(--ec-orange); }
.ec-listing__current img {
  display: block;
  width: 100%;
  max-width: 320px;
  height: auto;
  border-radius: 12px;
  margin-bottom: 0.6rem;
}
.ec-check { display: flex; align-items: center; gap: 0.45rem; font-size: 0.875rem; margin-bottom: 1rem; }
.ec-check input { accent-color: var(--ec-orange); }
#listing-form .ec-h2 { margin-top: 1.8rem; }
#listing-form .ec-h2:first-of-type { margin-top: 0; }
.ec-field label .ec-hint { display: inline; margin-left: 0.3rem; font-weight: 400; }

/* ---- reviews ------------------------------------------------------------ */
.ec-review-gate { font-size: 0.875rem; color: var(--ec-muted); margin-top: 1rem !important; }
.ec-review-gate a { color: var(--ec-orange); }
.ec-review-form { margin-top: 1.2rem; padding: 1.2rem; border: 1px solid var(--ec-line); border-radius: 14px; background: var(--ec-surface); }
.ec-review-form h3 { margin: 0 0 0.8rem; font-size: 1.05rem; }
.ec-stars { border: 0; margin: 0 0 1rem; padding: 0; display: flex; flex-wrap: wrap; gap: 0.4rem; }
.ec-stars legend { font-size: 0.875rem; font-weight: 600; margin-bottom: 0.4rem; padding: 0; }
.ec-stars__opt {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  border: 1px solid var(--ec-line-strong);
  border-radius: 999px;
  padding: 0.3rem 0.7rem;
  font-size: 0.8125rem;
  cursor: pointer;
}
.ec-stars__opt input { accent-color: var(--ec-orange); }
.ec-stars__opt:has(input:checked) { border-color: var(--ec-orange); color: var(--ec-orange); }

@media (max-width: 640px) {
  .ec-inbox__head time { margin-left: 0; width: 100%; }
}

/* ---- delete account ---------------------------------------------------- */
.ec-danger { margin-top: 3rem; border-top: 1px solid var(--ec-line); padding-top: 1.2rem; font-size: 0.9375rem; }
.ec-danger summary { cursor: pointer; font-weight: 600; color: var(--ec-muted); }
.ec-danger p { color: var(--ec-muted); max-width: 60ch; }
.ec-danger .ec-form { max-width: 360px; }
.ec-btn-danger { background: #b42318 !important; border-color: #b42318 !important; }

/* The not-yet-available plan keeps its own height beside the full one. */
.ec-plans--single .ec-plan:not(.ec-plan--popular) { align-self: start; }
/* Links in panels take the brand colour, not the parent theme's pink. */
.ec-panel-b p a, .ec-legal a, .ec-faq a { color: var(--ec-orange); }
/* The form's label rules make every label a block; this one is a row. */
.ec-form label.ec-check { display: flex !important; flex-direction: row; align-items: center; gap: 0.5rem; font-weight: 500; }
.ec-form label.ec-check input { width: auto !important; margin: 0; }

/* ---- example listings and briefs --------------------------------------- */
.ec-example-host {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 2;
  width: auto !important;
}
.ec-example-tag {
  display: inline-block;
  padding: 0.22rem 0.6rem;
  border-radius: 999px;
  background: rgb(28 25 23 / 0.82);
  color: #fff;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  backdrop-filter: blur(6px);
}
.ec-example-pill-host { width: auto !important; }
.ec-example-pill-host .ec-example-tag {
  background: var(--ec-held-wash);
  color: var(--ec-held);
  letter-spacing: 0.04em;
  padding: 0.2rem 0.55rem;
}
.ec-notice--info { border-color: var(--ec-line-strong); background: var(--ec-held-wash); }
.ec-notice--info strong { color: var(--ec-ink); }
.ec-example-cta { margin: 0.8rem 0 0 !important; }
.ec-example-note:empty, .ec-example-note .elementor-widget-container:empty { display: none; }
/* Examples take no enquiries or reviews; the note above says so. */
.ec-is-example .ec-enquiry-wrap,
.ec-is-example .ec-review-host { display: none !important; }
.ec-is-example .ec-panel__cta { display: none !important; }

/* ================================================================== */
/*  Planning guides and the FAQ                                       */
/*                                                                    */
/*  A guide reads like an article: one column at a reading measure,   */
/*  the photograph a little wider than the text. The list of guides   */
/*  uses the same photograph-and-words form as the service tiles.     */
/* ================================================================== */

/* ---- the list of guides ------------------------------------------- */
.ec-guides {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr));
  gap: 36px 24px;
}
.ec-guides a { display: block; text-decoration: none; color: var(--ec-ink); }
.ec-guides__media {
  display: block;
  overflow: hidden;
  border-radius: 18px;
  aspect-ratio: 3 / 2;
  background: var(--ec-raise);
}
.ec-guides__img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  transition: transform 0.35s ease;
}
.ec-guides a:hover .ec-guides__img { transform: scale(1.04); }
.ec-guides__body { display: block; margin-top: 14px; }
.ec-guides strong {
  display: block;
  font-family: var(--ec-display);
  font-size: 1.1875rem;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.015em;
  text-wrap: balance;
}
.ec-guides a:hover strong { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.ec-guides__excerpt { display: block; margin-top: 6px; font-size: 0.9375rem; line-height: 1.55; color: var(--ec-muted); }
.ec-guides__time { display: block; margin-top: 10px; font-size: 0.8125rem; font-weight: 600; color: var(--ec-muted); }
.ec-guides__title {
  margin: 0 0 24px;
  font-size: clamp(1.5rem, 2.6vw, 2rem);
  font-weight: 750;
  letter-spacing: -0.025em;
  color: var(--ec-ink);
}

/* ---- a guide ---------------------------------------------------------- */
/* Hello's own rule is body:not([class*=elementor-page-]) .site-main. */
body.ec-is-guide main.site-main {
  max-width: 1120px;
  margin-inline: auto;
  padding: clamp(32px, 6vw, 64px) 24px 88px;
}
.ec-is-guide .page-content > * { max-width: 700px; margin-inline: auto; }
.ec-guide__back { margin: 0 0 14px; }
.ec-guide__back a {
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--ec-orange-deep);
  text-decoration: none;
}
.ec-guide__back a::before { content: "\2190\00a0"; }
.ec-guide__back a:hover { text-decoration: underline; }
.ec-guide__title {
  margin: 0;
  font-family: var(--ec-display);
  font-size: clamp(2.1rem, 4.6vw, 3.3rem);
  font-weight: 750;
  line-height: 1.05;
  letter-spacing: -0.035em;
  color: var(--ec-ink);
  text-wrap: balance;
}
.ec-guide__lede { margin: 1rem 0 0; font-size: 1.1875rem; line-height: 1.55; color: var(--ec-muted); }
.ec-guide__meta { margin: 1rem 0 0; font-size: 0.875rem; font-weight: 600; color: var(--ec-muted); }

.ec-is-guide .page-content > .ec-guide__figure { max-width: 900px; margin: 32px auto 8px; }
.ec-guide__photo {
  display: block;
  width: 100% !important;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: 22px;
}

.ec-guide__body { font-size: 1.0625rem; line-height: 1.72; color: var(--ec-ink); }
.ec-guide__body > p:first-child { font-size: 1.1875rem; line-height: 1.6; }
.ec-guide__body p { margin: 1.1rem 0 0; }
.ec-guide__body h2 {
  margin: 2.4rem 0 0;
  font-family: var(--ec-display);
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: var(--ec-ink);
}
.ec-guide__body ul { margin: 1rem 0 0; padding-left: 1.25rem; }
.ec-guide__body li { margin: 0.55rem 0 0; padding-left: 0.25rem; }
.ec-guide__body li::marker { color: var(--ec-orange-deep); }
.ec-guide__body strong { font-weight: 700; }

.ec-guide__cta {
  margin-top: 56px !important;
  padding: clamp(24px, 4vw, 40px);
  border-radius: 22px;
  background: var(--ec-orange-wash);
}
.ec-guide__cta h2 { margin: 0; font-size: clamp(1.4rem, 2.6vw, 1.85rem); font-weight: 750; letter-spacing: -0.025em; color: var(--ec-ink); }
.ec-guide__cta p { margin: 0.6rem 0 0; color: var(--ec-muted); line-height: 1.6; }
.ec-guide__cta a { text-decoration: none; }
.ec-guide__cta .ec-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 1.3rem; }

/* More guides sit at full width under the article. */
.ec-is-guide .page-content > .ec-guides__title { max-width: none; margin-top: 72px; }
.ec-is-guide .page-content > .ec-guides { max-width: none; }

/* ---- FAQ -------------------------------------------------------------- */
#faq { scroll-margin-top: 104px; }
.ec-faqwrap {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr);
  gap: clamp(24px, 5vw, 72px);
  align-items: start;
}
.ec-faqwrap__head h2 {
  margin: 0;
  font-size: clamp(1.8rem, 3.4vw, 2.6rem);
  font-weight: 750;
  line-height: 1.08;
  letter-spacing: -0.03em;
  color: var(--ec-ink);
}
.ec-faqwrap__head p { margin: 0.7rem 0 0 !important; max-width: 36ch; color: var(--ec-muted); line-height: 1.6; }
.ec-faqwrap__head a { color: var(--ec-orange-deep); font-weight: 700; }

.ec-faq2 { border-top: 1px solid var(--ec-line-strong); }
.ec-faq2__item { border-bottom: 1px solid var(--ec-line-strong); }
.ec-faq2__item summary {
  position: relative;
  display: block;
  padding: 20px 44px 20px 0;
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1.4;
  color: var(--ec-ink);
  cursor: pointer;
  list-style: none;
}
.ec-faq2__item summary::-webkit-details-marker { display: none; }
/* A plus that turns into a minus as the answer opens. */
.ec-faq2__item summary::before,
.ec-faq2__item summary::after {
  content: "";
  position: absolute;
  right: 8px;
  top: 50%;
  width: 16px;
  height: 2px;
  border-radius: 2px;
  background: var(--ec-ink);
  transition: transform 0.2s ease;
}
.ec-faq2__item summary::after { transform: rotate(90deg); }
.ec-faq2__item[open] summary::after { transform: rotate(0deg); }
.ec-faq2__item summary:hover { color: var(--ec-orange-deep); }
.ec-faq2__item summary:focus-visible { outline: 2px solid var(--ec-ink); outline-offset: 4px; border-radius: 4px; }
.ec-faq2__item p { margin: -6px 0 0 !important; padding: 0 44px 22px 0; font-size: 1rem !important; line-height: 1.65; color: var(--ec-muted); max-width: 64ch; }

@media (prefers-reduced-motion: reduce) {
  .ec-guides__img,
  .ec-faq2__item summary::after { transition: none; }
}

@media (max-width: 860px) {
  .ec-faqwrap { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  body.ec-is-guide main.site-main { padding-inline: 16px; }
  .ec-guide__photo { border-radius: 16px; aspect-ratio: 3 / 2; }
  .ec-guide__body { font-size: 1rem; }
  .ec-guide__body > p:first-child { font-size: 1.0625rem; }
}

/* ================================================================== */
/*  Site-wide: bright and photographic                                */
/*                                                                    */
/*  Loaded last. Headlines are bold and close-set at normal width,    */
/*  surfaces are white with soft shadows, the header and footer are   */
/*  light, and every orange button is the deep orange with white      */
/*  text (5.2:1).                                                     */
/* ================================================================== */

/* ---- page titles ---------------------------------------------------- */
.ec-archive__title .elementor-heading-title,
.ec-single__name .elementor-heading-title,
.ec-single__name .jet-listing-dynamic-field__content,
h1.ec-single__name {
  font-family: var(--ec-display) !important;
  font-weight: 750 !important;
  font-size: clamp(2.2rem, 4.6vw, 3.6rem) !important;
  line-height: 1.04 !important;
  letter-spacing: -0.035em !important;
  text-wrap: balance;
}

/* A page's name above a sentence-length title: plain, not shouted. */
.ec-eyebrow p {
  margin: 0 0 0.6rem !important;
  font-size: 0.9375rem !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--ec-orange-deep) !important;
}
.ec-archive__lede p,
.ec-archive__lede { max-width: 60ch; font-size: 1.0625rem; line-height: 1.6; }

h2.ec-h2,
.ec-h2 { font-size: clamp(1.5rem, 2.6vw, 2rem); line-height: 1.1; letter-spacing: -0.025em; }

/* Headings inside text blocks inherited Elementor's grey body colour. */
:where(.elementor-widget-text-editor) :is(h1, h2, h3, h4) { color: var(--ec-ink); }

/* ---- buttons ---------------------------------------------------------- */
.ec-btn-a,
.ec-btn,
.elementor-button.ec-btn,
.ec-page__cta .elementor-button,
.ec-panel__cta .elementor-button,
.ec-hdr__btn--primary,
.ec-form button[type="submit"]:not(.ec-btn-danger),
.jet-search-filter__submit,
button.jet-search-filter__submit.apply-filters__button {
  border-radius: 999px !important;
  font-weight: 700 !important;
}
.ec-btn-a:not(.ec-btn-a--outline):not(.ec-btn-a--ghost),
.ec-btn,
.elementor-button.ec-btn,
.ec-page__cta .elementor-button,
.ec-panel__cta .elementor-button,
.ec-hdr__btn--primary,
.ec-form button[type="submit"]:not(.ec-btn-danger),
.jet-search-filter__submit,
button.jet-search-filter__submit.apply-filters__button,
.ec-account .ec-btn-a {
  background: var(--ec-orange-deep) !important;
  border-color: var(--ec-orange-deep) !important;
  color: #fff !important;
}
.jet-search-filter__submit .jet-search-filter__submit-text { color: #fff !important; }
.ec-btn-a:not(.ec-btn-a--outline):not(.ec-btn-a--ghost):hover,
.ec-btn:hover,
.elementor-button.ec-btn:hover,
.ec-page__cta .elementor-button:hover,
.ec-panel__cta .elementor-button:hover,
.ec-hdr__btn--primary:hover,
.ec-form button[type="submit"]:not(.ec-btn-danger):hover,
.jet-search-filter__submit:hover {
  background: var(--ec-orange-hover) !important;
  border-color: var(--ec-orange-hover) !important;
  color: #fff !important;
}
.ec-btn-a--outline {
  background: var(--ec-surface) !important;
  border-color: var(--ec-line-strong) !important;
  color: var(--ec-ink) !important;
}
.ec-btn-a--outline:hover { border-color: var(--ec-ink) !important; }

/* ---- header ----------------------------------------------------------- */
.ec-header {
  background: rgb(255 255 255 / 0.96) !important;
  border-bottom: 1px solid var(--ec-line);
  backdrop-filter: saturate(1.4) blur(10px);
}
.ec-header__nav .elementor-item {
  border-radius: 999px !important;
  color: var(--ec-ink) !important;
  font-weight: 600 !important;
}
.ec-header__nav .elementor-item:hover { background: var(--ec-raise) !important; color: var(--ec-ink) !important; }
.ec-header__nav .elementor-item.elementor-item-active,
.ec-header__nav .elementor-item-active {
  background: var(--ec-raise) !important;
  color: var(--ec-ink) !important;
}
.ec-hdr__btn { border-radius: 999px !important; font-weight: 700 !important; }

/* ---- cards ------------------------------------------------------------ */
.ec-card__name .jet-listing-dynamic-field__content,
.ec-card__name h3,
.ec-card__name {
  font-family: var(--ec-display) !important;
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.015em !important;
}
.ec-save { color: var(--ec-muted); }
.ec-save:hover,
.ec-save[aria-pressed="true"] { color: var(--ec-orange-deep); }

/* ---- panels and filters ---------------------------------------------- */
.ec-panel { border-radius: 18px !important; box-shadow: var(--ec-shadow); }
.ec-filters__title .elementor-heading-title,
.ec-filters__group .elementor-heading-title {
  text-transform: none !important;
  letter-spacing: -0.01em !important;
  font-family: var(--ec-display) !important;
  font-weight: 700 !important;
  color: var(--ec-ink) !important;
}
.ec-filters__title .elementor-heading-title { font-size: 1.25rem !important; }
.ec-filters__group .elementor-heading-title { font-size: 0.98rem !important; }

/* ---- forms ------------------------------------------------------------ */
.ec-form input:focus,
.ec-form select:focus,
.ec-form textarea:focus {
  outline: 2px solid var(--ec-ink);
  outline-offset: 1px;
  border-color: var(--ec-ink);
}

/* ---- empty states: an invitation, not a placeholder ----------------- */
.ec-empty {
  text-align: left !important;
  border: 1px solid var(--ec-line) !important;
  border-style: solid !important;
  border-radius: 22px;
  background: var(--ec-surface) !important;
  box-shadow: var(--ec-shadow);
  padding: clamp(24px, 4vw, 44px) !important;
}
.ec-empty h2 {
  margin: 0 0 0.6rem !important;
  font-family: var(--ec-display) !important;
  font-size: clamp(1.5rem, 2.8vw, 2.1rem) !important;
  font-weight: 750 !important;
  line-height: 1.08;
  letter-spacing: -0.03em;
  color: var(--ec-ink);
}
.ec-empty p { margin: 0 !important; max-width: 60ch; color: var(--ec-muted); line-height: 1.6; }
.ec-empty .ec-actions { justify-content: flex-start !important; margin-top: 1.3rem !important; }
.ec-empty a:not(.ec-btn-a) { color: var(--ec-orange-deep); font-weight: 600; }
.ec-empty--invite { background: var(--ec-orange-wash) !important; border-color: #fcd9c6 !important; box-shadow: none; }

/* ---- footer ----------------------------------------------------------- */
.ec-footer {
  background: var(--ec-raise) !important;
  color: var(--ec-muted);
  margin-top: 0 !important;
  border-top: 1px solid var(--ec-line);
}
.ec-footer p { color: var(--ec-muted); }
.ec-footer a { color: var(--ec-ink); }
.ec-footer a:hover { color: var(--ec-orange-deep); }
.ec-footer__col h2 {
  font-family: var(--ec-sans) !important;
  font-size: 0.875rem !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--ec-ink) !important;
}
.ec-footer__brand strong { color: var(--ec-ink) !important; font-size: 1.3rem; letter-spacing: -0.02em; }
.ec-footer__legal p { color: var(--ec-muted) !important; }

/* Small orange text always uses the deep tone (5.2:1 on white). */
.ec-account a:not(.ec-btn-a),
.ec-notice a,
.ec-review-gate a,
.ec-dash-empty a,
.ec-listing__state a,
.ec-inbox__from a,
.ec-sideline a,
.ec-briefs__note a { color: var(--ec-orange-deep) !important; }

/* ---- text contrast ----------------------------------------------------- */
/* Elementor's default body grey (#7a7a7a) is 4.3:1 on white; the muted ink
   is 6.1:1. Set on the kit's own variable so every text block follows. */
body[class*="elementor-kit-"] { --e-global-color-text: #5d6275; }

/* The bright orange is for fills. Orange text is always the deep tone. */
.ec-alt a,
.ec-form__row a,
.ec-fineprint a,
.ec-legal a,
.ec-faq a,
.ec-panel-b a:not(.ec-btn-a),
.ec-page__body p a:not(.ec-btn-a),
.ec-mail,
.ec-steps__n span,
.ec-steps__side h3,
.ec-404__n { color: var(--ec-orange-deep) !important; }

/* ---- sign in and sign up ---------------------------------------------- */
.ec-auth-page > .e-con-inner { max-width: 1180px; }
.ec-auth {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(32px, 6vw, 88px);
  align-items: stretch;
}
.ec-auth__main { align-self: center; max-width: 460px; width: 100%; justify-self: end; padding: 24px 0; }
.ec-auth__title {
  margin: 0;
  font-family: var(--ec-display);
  font-size: clamp(2.2rem, 4.2vw, 3.2rem);
  font-weight: 750;
  line-height: 1.04;
  letter-spacing: -0.035em;
  color: var(--ec-ink);
}
.ec-auth .ec-auth-lede { margin: 0.8rem 0 1.8rem !important; font-size: 1.0625rem; line-height: 1.55; color: var(--ec-muted); }
.ec-auth .ec-form { max-width: none; }
.ec-auth .ec-form input,
.ec-auth .ec-form select { padding: 0.75rem 0.85rem; border-color: var(--ec-line-strong); border-radius: 12px; }
.ec-auth .ec-form button { margin-top: 0.4rem; padding: 0.85rem 1rem; border-radius: 999px; font-size: 1rem; font-weight: 700; }
.ec-form__privacy { margin: 0.9rem 0 0 !important; font-size: 0.8125rem !important; line-height: 1.5; color: var(--ec-muted); }
.ec-form__privacy a { color: var(--ec-orange-deep); }
.ec-auth .ec-alt { margin-top: 1.4rem !important; color: var(--ec-muted); }

.ec-auth__aside {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 600px;
  border-radius: 28px;
  display: flex;
  align-items: flex-end;
  padding: 20px;
}
.ec-auth__img {
  position: absolute;
  inset: 0;
  z-index: -1;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}
.ec-auth__card {
  width: 100%;
  padding: 24px 26px;
  border-radius: 20px;
  background: rgb(255 255 255 / 0.95);
  backdrop-filter: blur(8px);
  box-shadow: 0 12px 40px -16px rgb(16 24 40 / 0.35);
}
.ec-auth__card h2 { margin: 0 0 14px; font-size: 1.25rem; font-weight: 750; letter-spacing: -0.02em; color: var(--ec-ink); }
.ec-auth__list { display: grid; gap: 10px; justify-content: start; margin: 0; }

@media (max-width: 900px) {
  .ec-auth { grid-template-columns: 1fr; }
  .ec-auth__main { justify-self: stretch; max-width: 520px; padding: 0; }
  .ec-auth__aside { min-height: 0; padding: 0; border-radius: 22px; }
  .ec-auth__img { display: none; }
  .ec-auth__card { background: var(--ec-raise); box-shadow: none; backdrop-filter: none; }
}

/* ---- filter controls ---------------------------------------------------- */
/* Checkboxes: a white box that fills with the deep orange when ticked. The
   plugin's own ticked state was a pale grey that read as disabled, and the
   ticked label turned the bright orange (3.2:1). */
.jet-checkboxes-list__row { padding: 0.2rem 0 !important; }
.jet-checkboxes-list__item { display: block; width: 100%; cursor: pointer; }
.jet-checkboxes-list__button { display: flex !important; align-items: center; gap: 10px; padding: 3px 0; }
.jet-checkboxes-list__decorator {
  flex: none;
  display: inline-grid !important;
  place-items: center;
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
  border: 1.5px solid var(--ec-line-strong) !important;
  border-radius: 6px !important;
  background: var(--ec-surface) !important;
  transition: background-color 0.15s ease, border-color 0.15s ease;
}
.jet-checkboxes-list__checked-icon { display: none !important; line-height: 0; }
.jet-checkboxes-list__checked-icon svg { width: 12px !important; height: 12px !important; fill: #fff !important; }
.jet-checkboxes-list__label { font-size: 0.9375rem !important; color: var(--ec-ink) !important; font-weight: 400 !important; }
.jet-checkboxes-list__item:hover .jet-checkboxes-list__decorator { border-color: var(--ec-ink) !important; }
.jet-checkboxes-list__input:checked + .jet-checkboxes-list__button .jet-checkboxes-list__decorator {
  background: var(--ec-orange-deep) !important;
  border-color: var(--ec-orange-deep) !important;
}
.jet-checkboxes-list__input:checked + .jet-checkboxes-list__button .jet-checkboxes-list__checked-icon { display: block !important; }
.jet-checkboxes-list__input:checked + .jet-checkboxes-list__button .jet-checkboxes-list__label,
.jet-checkboxes-list__row.is-active .jet-checkboxes-list__label { font-weight: 600 !important; color: var(--ec-ink) !important; }
.jet-checkboxes-list__row.is-active { color: var(--ec-ink) !important; }
.jet-checkboxes-list__input:focus-visible + .jet-checkboxes-list__button .jet-checkboxes-list__decorator {
  outline: 2px solid var(--ec-ink);
  outline-offset: 2px;
}

/* "Show all cities" */
.jet-filter-items-moreless { margin-top: 6px; }
.jet-filter-items-moreless__toggle {
  display: inline-block;
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--ec-orange-deep);
  cursor: pointer;
}
.jet-filter-items-moreless__toggle:hover { text-decoration: underline; }
.jet-filter-items-moreless:focus-visible { outline: 2px solid var(--ec-ink); outline-offset: 3px; border-radius: 4px; }

/* Text, date and sort inputs share one look. */
.jet-search-filter__input,
.ec-date__input,
.ec-sorting select,
.jet-sorting-select {
  height: 42px !important;
  padding: 0 12px !important;
  border: 1px solid var(--ec-line-strong) !important;
  border-radius: 12px !important;
  background-color: var(--ec-surface) !important;
  font: inherit !important;
  font-size: 0.9375rem !important;
  color: var(--ec-ink) !important;
  box-shadow: none !important;
}
.ec-date__input { flex: 1 1 auto; min-width: 0; }
.jet-search-filter__input:focus,
.ec-date__input:focus,
.ec-sorting select:focus { outline: 2px solid var(--ec-ink) !important; outline-offset: 1px; border-color: var(--ec-ink) !important; }
.ec-sorting select { min-width: 220px; cursor: pointer; }
.ec-date__clear { height: 42px; border-radius: 12px !important; }

/* Price: a native two-thumb range. */
.jet-range__slider__track { background: var(--ec-line) !important; height: 4px !important; border-radius: 4px !important; }
.jet-range__slider__track__range { background: var(--ec-orange-deep) !important; }
.jet-range__slider__input::-webkit-slider-thumb {
  width: 20px; height: 20px; border-radius: 50%;
  background: var(--ec-surface) !important; border: 2px solid var(--ec-orange-deep) !important;
  box-shadow: 0 1px 4px rgb(16 24 40 / 0.2);
}
.jet-range__slider__input::-moz-range-thumb {
  width: 18px; height: 18px; border-radius: 50%;
  background: var(--ec-surface); border: 2px solid var(--ec-orange-deep);
}
.jet-range__inputs__group { height: 42px; border-radius: 12px; overflow: hidden; border: 1px solid var(--ec-line-strong); }
.jet-range__inputs__group input { height: 100% !important; border: 0 !important; border-radius: 0 !important; }

/* Rating: grey stars at rest; the chosen star and those below it fill. */
.jet-rating i, .jet-rating svg { color: inherit !important; }
.jet-rating-star__label { color: var(--ec-line-strong) !important; font-size: 1.375rem !important; padding-right: 2px; cursor: pointer; }
.jet-rating-star__input:checked ~ .jet-rating-star__label,
.jet-rating-stars__fields:hover .jet-rating-star__label:hover,
.jet-rating-stars__fields:hover .jet-rating-star__label:hover ~ .jet-rating-star__label { color: var(--ec-orange) !important; }
.jet-rating-star__input:focus-visible + .jet-rating-star__label { outline: 2px solid var(--ec-ink); outline-offset: 2px; border-radius: 4px; }

/* No suppliers: line the card up with the page edge, not the grid gutter. */
.jet-listing-not-found { margin: 0 !important; width: 100% !important; }

/* Clear filters: a quiet full-width button at the foot of the panel. */
.ec-clear { border-radius: 999px !important; height: 42px; font-weight: 700; color: var(--ec-ink) !important; }
.ec-clear:hover { border-color: var(--ec-ink) !important; color: var(--ec-ink) !important; }

/* ---- header on small screens ------------------------------------------ */
/* The closed dropdown sat in the widget's flow and gave it a 100px width,
   which pushed the call to action towards the middle and pinned the menu
   button to the top-left of an oversized box. The dropdown now hangs from
   the button instead, and the widget is only as big as the button. */
@media (max-width: 1024px) {
  .ec-header__row { align-items: center !important; }
  .ec-header__nav { position: relative; flex: none !important; width: auto !important; align-self: center !important; }
  .elementor-menu-toggle {
    width: 40px !important;
    height: 40px !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: var(--ec-raise) !important;
    color: var(--ec-ink) !important;
  }
  .ec-header__nav .elementor-nav-menu--dropdown {
    position: absolute !important;
    top: calc(100% + 12px) !important;
    right: 0 !important;
    left: auto !important;
    width: min(300px, calc(100vw - 32px)) !important;
    border-radius: 18px;
    background: var(--ec-surface) !important;
    box-shadow: 0 18px 48px -16px rgb(16 24 40 / 0.35);
    overflow: hidden;
  }
  .ec-header__nav .elementor-nav-menu--dropdown .elementor-item {
    padding: 14px 20px !important;
    border-radius: 0 !important;
    font-size: 1rem !important;
    color: var(--ec-ink) !important;
    background: transparent !important;
  }
  .ec-header__nav .elementor-nav-menu--dropdown .elementor-item:hover,
  .ec-header__nav .elementor-nav-menu--dropdown .elementor-item-active { background: var(--ec-raise) !important; }
}
.ec-menu-extra--first { border-top: 1px solid var(--ec-line); }

/* ---- secondary buttons -------------------------------------------------- */
/* Hello Elementor's reset paints every button:hover and button:focus pink
   (#c36). These buttons set a border and text colour on hover but no
   background, so the pink came through -- with orange text on it while
   "Finding you..." held focus. Every state now sets all three. */
.ec-near__ask,
.ec-near__off,
.ec-date__clear,
.ec-clear {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  border: 1px solid var(--ec-line-strong) !important;
  border-radius: 999px !important;
  background: var(--ec-surface) !important;
  color: var(--ec-ink) !important;
  font-family: inherit;
  font-size: 0.875rem !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: border-color 0.15s ease, background-color 0.15s ease;
}
.ec-near__ask,
.ec-near__off,
.ec-clear { width: 100%; }
.ec-date__clear { padding: 0 14px !important; }
.ec-near__ask:hover,
.ec-near__off:hover,
.ec-date__clear:hover,
.ec-clear:hover {
  border-color: var(--ec-ink) !important;
  background: var(--ec-raise) !important;
  color: var(--ec-ink) !important;
}
.ec-near__ask:focus,
.ec-near__off:focus,
.ec-date__clear:focus,
.ec-clear:focus {
  background: var(--ec-surface) !important;
  color: var(--ec-ink) !important;
}
.ec-near__ask:focus-visible,
.ec-near__off:focus-visible,
.ec-date__clear:focus-visible,
.ec-clear:focus-visible { outline: 2px solid var(--ec-ink) !important; outline-offset: 2px; }

/* A location pin before "Use my location". */
.ec-near__ask::before {
  content: "";
  width: 16px;
  height: 16px;
  flex: none;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a7 7 0 0 0-7 7c0 5.2 7 13 7 13s7-7.8 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 12 6.5a2.5 2.5 0 0 1 0 5z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a7 7 0 0 0-7 7c0 5.2 7 13 7 13s7-7.8 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 12 6.5a2.5 2.5 0 0 1 0 5z'/%3E%3C/svg%3E") center / contain no-repeat;
}
/* While the browser looks up the position: a spinner in place of the pin,
   the text stays fully readable, and the button cannot be pressed twice. */
.ec-near__ask[disabled],
.ec-near__ask[disabled]:hover,
.ec-near__ask[disabled]:focus {
  opacity: 1 !important;
  cursor: progress;
  background: var(--ec-raise) !important;
  border-color: var(--ec-line-strong) !important;
  color: var(--ec-ink) !important;
}
.ec-near__ask[disabled]::before {
  -webkit-mask: none;
          mask: none;
  background: none;
  border: 2px solid var(--ec-line-strong);
  border-top-color: var(--ec-orange-deep);
  border-radius: 50%;
  animation: ec-spin 0.8s linear infinite;
}
@keyframes ec-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .ec-near__ask[disabled]::before { animation-duration: 2.4s; }
}

/* Distance shown on the panel and on cards: orange text is the deep tone. */
.ec-near__on strong { color: var(--ec-ink) !important; }
.ec-km { color: var(--ec-orange-deep) !important; }
.ec-near__radius { height: 42px; border-radius: 12px !important; font-size: 0.875rem !important; }

/* ---- save (favourite) buttons --------------------------------------------- */
/* Clicking the star leaves it focused, and Hello Elementor's reset paints a
   focused button pink (#c36). Every state is set here, so a click only ever
   shows saved or not saved, and the keyboard gets a clear ring instead. */
.ec-save:not(.ec-save--lg) {
  width: 38px !important;
  height: 38px !important;
  border: 0 !important;
  background: rgb(255 255 255 / 0.94) !important;
  color: var(--ec-muted) !important;
  font-size: 1.05rem !important;
  box-shadow: 0 2px 10px -2px rgb(16 24 40 / 0.35) !important;
  backdrop-filter: blur(6px);
  transition: color 0.15s ease, background-color 0.15s ease, transform 0.15s ease;
}
.ec-save:not(.ec-save--lg):hover {
  background: #fff !important;
  color: var(--ec-ink) !important;
  transform: scale(1.06);
}
.ec-save:not(.ec-save--lg):focus {
  background: rgb(255 255 255 / 0.94) !important;
  color: var(--ec-muted) !important;
}
.ec-save:not(.ec-save--lg)[aria-pressed="true"],
.ec-save:not(.ec-save--lg)[aria-pressed="true"]:hover,
.ec-save:not(.ec-save--lg)[aria-pressed="true"]:focus {
  background: var(--ec-orange-deep) !important;
  color: #fff !important;
}
.ec-save:not(.ec-save--lg):focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--ec-ink) !important;
}

.ec-save--lg {
  min-height: 44px;
  border: 1px solid var(--ec-line-strong) !important;
  border-radius: 999px !important;
  background: var(--ec-surface) !important;
  color: var(--ec-ink) !important;
  font-weight: 700 !important;
}
.ec-save--lg .ec-save__i { color: var(--ec-muted); }
.ec-save--lg:hover { border-color: var(--ec-ink) !important; background: var(--ec-raise) !important; color: var(--ec-ink) !important; }
.ec-save--lg:focus { background: var(--ec-surface) !important; color: var(--ec-ink) !important; }
.ec-save--lg[aria-pressed="true"],
.ec-save--lg[aria-pressed="true"]:hover,
.ec-save--lg[aria-pressed="true"]:focus {
  border-color: var(--ec-orange-deep) !important;
  background: var(--ec-orange-wash) !important;
  color: var(--ec-orange-deep) !important;
}
.ec-save--lg[aria-pressed="true"] .ec-save__i { color: var(--ec-orange-deep); }
.ec-save--lg:focus-visible { outline: 2px solid var(--ec-ink) !important; outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  .ec-save:not(.ec-save--lg):hover { transform: none; }
}

/* ---- dashboard ------------------------------------------------------------- */
/* Signed in: one slim line, not a box that fills the width. */
.ec-account:not(.ec-account--guest) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 16px;
  padding: 12px 16px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: var(--ec-raise) !important;
}
.ec-account:not(.ec-account--guest) p { margin: 0 !important; }
.ec-account:not(.ec-account--guest) .ec-actions { margin: 0 !important; }
.ec-account__out {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 14px;
  border: 1px solid var(--ec-line-strong);
  border-radius: 999px;
  background: var(--ec-surface);
  font-size: 0.8125rem !important;
  font-weight: 700;
  color: var(--ec-ink) !important;
  text-decoration: none;
}
.ec-account__out:hover { border-color: var(--ec-ink); }

/* Four figures, each a way in to what it counts. */
.ec-stats--dash {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 24px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
.ec-stats--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ec-stat {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 18px 20px;
  border: 1px solid var(--ec-line);
  border-radius: 16px;
  background: var(--ec-surface);
  color: var(--ec-ink);
  text-decoration: none;
  transition: border-color 0.15s ease;
}
.ec-stat:hover { border-color: var(--ec-ink); }
.ec-stat:focus-visible { outline: 2px solid var(--ec-ink); outline-offset: 2px; }
.ec-stat .ec-stat__v { font-size: 2.25rem; line-height: 1; }
.ec-stat .ec-stat__l { margin: 0; font-size: 0.875rem; font-weight: 600; color: var(--ec-muted); }

.ec-dash .ec-cards2 { margin-top: 12px !important; gap: 12px; }
.ec-dash .ec-panel-b { border-radius: 16px; box-shadow: none; }

/* One heading size for every section. */
.ec-dash .ec-h2 {
  margin: 48px 0 14px !important;
  font-size: 1.5rem !important;
  font-weight: 750;
  letter-spacing: -0.02em;
}

/* Briefs: the close control is a small button, not an underlined link. */
.ec-dash .ec-enq__row { border-radius: 14px; padding: 14px 16px; align-items: center; }
.ec-dash .ec-enq__meta { flex-direction: row; align-items: center; gap: 10px; }
.ec-dash .ec-inline-form { margin: 0; }
.ec-closebtn {
  min-height: 32px;
  padding: 0 12px !important;
  border: 1px solid var(--ec-line-strong) !important;
  border-radius: 999px !important;
  background: var(--ec-surface) !important;
  color: var(--ec-ink) !important;
  font-size: 0.8125rem !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  cursor: pointer;
}
.ec-closebtn:hover { border-color: var(--ec-ink) !important; background: var(--ec-raise) !important; }
.ec-closebtn:focus { background: var(--ec-surface) !important; color: var(--ec-ink) !important; }
.ec-closebtn:focus-visible { outline: 2px solid var(--ec-ink) !important; outline-offset: 2px; }

/* Enquiries: an unread one gets an accent edge, not a full orange frame. */
.ec-dash .ec-inbox__item { border-radius: 16px; padding: 18px 20px; }
.ec-dash .ec-inbox__item.is-new {
  border-color: var(--ec-line) !important;
  box-shadow: inset 4px 0 0 var(--ec-orange-deep) !important;
}
.ec-inbox__reply { border-left-color: var(--ec-orange-deep) !important; }
.ec-inbox__reply span {
  font-size: 0.8125rem !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
/* The reply box takes the card's width; its button is sized to its words. */
.ec-dash .ec-inbox__form { max-width: none; grid-template-columns: 1fr; }
.ec-dash .ec-inbox__form textarea { min-height: 96px; border-radius: 12px; }
.ec-dash .ec-inbox__form button {
  width: auto !important;
  justify-self: start;
  min-height: 42px;
  padding: 0 22px !important;
}

/* Empty states inside the dashboard sit flat, like the rest of it. */
.ec-dash .ec-empty { box-shadow: none !important; background: var(--ec-raise) !important; border: 0 !important; }

@media (max-width: 700px) {
  .ec-stats--dash, .ec-stats--3 { grid-template-columns: 1fr 1fr; }
  .ec-dash .ec-enq__row { flex-direction: column; align-items: flex-start; }
}

/* A card with no photograph: the business's initials on a quiet field. */
.ec-noimg {
  display: grid !important;
  place-items: center !important;
  place-content: center !important;
  width: 100%;
  aspect-ratio: 4 / 3;
  background:
    radial-gradient(120% 90% at 100% 0%, var(--ec-orange-wash) 0%, transparent 60%),
    var(--ec-raise);
  text-decoration: none !important;
}
.ec-noimg__mark {
  display: grid;
  margin: auto;
  place-items: center;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: var(--ec-surface);
  box-shadow: 0 2px 12px -4px rgb(16 24 40 / 0.25);
  font-family: var(--ec-display);
  font-size: 1.5rem;
  font-weight: 750;
  letter-spacing: -0.02em;
  color: var(--ec-orange-deep);
}