*,
*::before,
*::after {
   box-sizing: border-box;
}

* {
   margin: 0;
}

html,
body {
   margin: 0;
   padding: 0;
}

html {
   height: 100%;
}

body {
   line-height: 1.5;
   min-height: 100vh;
}

img,
picture,
figure,
video,
canvas,
svg {
   display: block;
   max-width: 100%;
}

a {
   text-decoration: none;
}

ul {
   margin: 0;
   padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
   margin: 0;
   font-family: var(--font-heading);
   color: var(--color-heading);
}

p {
   margin: 0;
}

input,
button,
textarea,
select {
   font: inherit;
}





/* Design tokens not injected from the theme. Colors, fonts and the title and
   paragraph type scale are defined in the layout from theme settings. */
:root {
   --container-width: 1200px;
   /* spacing scale (tailwind-numbered) */
   --space-1: .25rem;
   --space-2: .5rem;
   --space-3: .75rem;
   --space-4: 1rem;
   --space-5: 1.25rem;
   --space-6: 1.5rem;
   --space-8: 2rem;
   --space-12: 3rem;
   --space-16: 4rem;
   /* radius */
   --radius-sm: .375rem;
   --radius-md: .75rem;
   --radius-lg: 1.25rem;
   --radius-full: 999px;
   /* elevation */
   --shadow-sm: 0 1px 2px rgba(0, 0, 0, .04), 0 10px 26px -18px rgba(0, 0, 0, .22);
   --shadow-md: 0 2px 4px rgba(0, 0, 0, .06), 0 20px 44px -20px rgba(0, 0, 0, .42);
   --shadow-hover: 0 1px 2px rgba(0, 0, 0, .05), 0 24px 50px -22px rgba(0, 0, 0, .34);
   /* motion */
   --ease-out: cubic-bezier(.2, .7, .2, 1);
}

/* Tailwind-style utilities, each resolving to a theme token. Card color
   utilities fold in the per-section override vars (--card-*) so the color
   pickers keep working, falling back to theme tokens then to a literal. */

/* layout */
.relative {
   position: relative;
}

.absolute {
   position: absolute;
}

.inset-0 {
   inset: 0;
}

.flex {
   display: flex;
}

.inline-flex {
   display: inline-flex;
}

.grid {
   display: grid;
}

.flex-col {
   flex-direction: column;
}

.items-center {
   align-items: center;
}

.justify-center {
   justify-content: center;
}

.overflow-hidden {
   overflow: hidden;
}

/* sizing / media */
.w-full {
   width: 100%;
}

.h-full {
   height: 100%;
}

.w-2 {
   width: .5rem;
}

.h-2 {
   height: .5rem;
}

.object-cover {
   object-fit: cover;
}

.aspect-square {
   aspect-ratio: 1/1;
}

.aspect-portrait {
   aspect-ratio: 4/5;
}

.aspect-landscape {
   aspect-ratio: 4/3;
}

/* spacing */
.gap-2 {
   gap: var(--space-2);
}

.gap-3 {
   gap: var(--space-3);
}

.gap-4 {
   gap: var(--space-4);
}

.gap-6 {
   gap: var(--space-6);
}

.p-5 {
   padding: var(--space-5);
}

.px-2 {
   padding-left: var(--space-2);
   padding-right: var(--space-2);
}

.py-1 {
   padding-top: var(--space-1);
   padding-bottom: var(--space-1);
}

.pt-3 {
   padding-top: var(--space-3);
}

.mt-auto {
   margin-top: auto;
}

.mt-5 {
   margin-top: var(--space-5);
}

.mt-6 {
   margin-top: var(--space-6);
}

.mb-1 {
   margin-bottom: var(--space-1);
}

.mb-2 {
   margin-bottom: var(--space-2);
}

.mb-4 {
   margin-bottom: var(--space-4);
}

.mb-8 {
   margin-bottom: var(--space-8);
}

.mx-auto {
   margin-left: auto;
   margin-right: auto;
}

.space-y-8>*+* {
   margin-top: var(--space-8);
}

/* radius */
.rounded-none {
   border-radius: 0;
}

.rounded-sm {
   border-radius: var(--radius-sm);
}

.rounded-md {
   border-radius: var(--radius-md);
}

.rounded-lg {
   border-radius: var(--radius-lg);
}

.rounded-full {
   border-radius: var(--radius-full);
}

/* border */
.border {
   border: 1px solid var(--card-border, var(--color-gray-200, #e5e5e5));
}

.border-t {
   border-top: 1px solid var(--card-border, var(--color-gray-200, #e5e5e5));
}

/* elevation */
.shadow-none {
   box-shadow: none;
}

.shadow-sm {
   box-shadow: var(--shadow-sm);
}

.shadow-md {
   box-shadow: var(--shadow-md);
}

/* color */
.bg-bg {
   background: var(--color-bg);
}

.bg-surface {
   background: var(--card-bg, var(--color-bg));
}

.text-gray-900 {
   color: var(--color-gray-900, #1a1a1a);
}

.text-body {
   color: var(--card-text, var(--color-gray-900, #1a1a1a));
}

/* opacity */
.opacity-40 {
   opacity: .4;
}

.opacity-50 {
   opacity: .5;
}

.opacity-60 {
   opacity: .6;
}

/* typography */
.font-heading {
   font-family: var(--font-heading);
}

.font-body {
   font-family: var(--font-body);
}

.font-medium {
   font-weight: 500;
}

.font-semibold {
   font-weight: 600;
}

.font-bold {
   font-weight: 700;
}

.uppercase {
   text-transform: uppercase;
}

.tracking-tight {
   letter-spacing: -.02em;
}

.tracking-wide {
   letter-spacing: .1em;
}

.line-clamp-2 {
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
   overflow: hidden;
}

/* font sizes (literal micro steps + theme type scale with rem fallbacks).
   Headings ride the title scale; body-level text (card title, price) rides the
   paragraph scale so it never inherits oversized heading sizes. */
.text-2xs {
   font-size: .625rem;
}

.text-xs {
   font-size: .75rem;
}

.text-paragraph-300 {
   font-size: var(--paragraph-300-size, 1.0625rem);
   line-height: var(--paragraph-300-line, 1.3);
}

.text-paragraph-400 {
   font-size: var(--paragraph-400-size, 1.2rem);
   line-height: var(--paragraph-400-line, 1.2);
}

.text-title-400 {
   font-size: var(--title-400-size, 1.625rem);
   line-height: var(--title-400-line, 1.2);
}

/* motion */
.transition {
   transition: transform .35s var(--ease-out), box-shadow .35s var(--ease-out);
}
.section-error { margin: 0 0 1rem; color: var(--color-secondary-700); }

.announcement-bar { position: relative; overflow: hidden; width: 100%; height: 2.25rem; }
.announcement-bar-track { position: relative; height: 100%; }
.announcement-bar-item {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  padding: 0 1rem;
  text-align: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.4s ease;
  line-height: 1.3;
}
.announcement-bar-item[aria-current="true"] { opacity: 1; visibility: visible; }
/* theme.liquid sets font-size directly on the `p` element (not just inherited), which
   otherwise overrides the block's font_size setting applied on this wrapping element.
   Reinstate inheritance with higher specificity. */
.announcement-bar-item p { margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: inherit; font: inherit; }

/* Residual carousel rules that utilities cannot express: structural anchors,
   scroll behavior, JS-driven hover/positioning and the few bespoke surfaces.
   Everything else is composed from base.css utilities in the markup. */

.carousel-section { padding: var(--space-16) var(--space-8); background: var(--carousel-bg, var(--color-bg)); }
.carousel-root { max-width: var(--container-width); margin: 0 auto; --carousel-item: 260px; }
.carousel-root[data-variant="large"] { --carousel-item: 360px; }
.carousel-root[data-variant="full"] { --carousel-item: 100%; }

/* layout wrappers: child targeting (waterfall) and responsive columns can't be
   utilities on a shared snippet, so they stay here, on tokens. */
.carousel-waterfall { columns: 2; gap: var(--space-6); }
.carousel-waterfall > * { margin-bottom: var(--space-6); break-inside: avoid; }
.carousel-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6); }
@media (min-width: 768px) {
  .carousel-waterfall { columns: 4; }
  .carousel-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

.carousel { position: relative; }
.carousel-track { display: flex; gap: var(--space-6); overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; padding: var(--space-2) 0 var(--space-5); }
.carousel-track::-webkit-scrollbar { display: none; }
.carousel-track > * { flex: 0 0 var(--carousel-fit, var(--carousel-item)); scroll-snap-align: start; }
.carousel-root[data-hover="true"] .lot-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-hover); }
.carousel-root[data-hover="true"] .lot-card:hover .lot-card-img { transform: scale(1.05); }

.carousel-arrow { display: none; cursor: pointer; border: 1px solid rgba(0,0,0,0.12); background: var(--color-bg); color: var(--color-gray-900); width: 2.75rem; height: 2.75rem; border-radius: var(--radius-full); align-items: center; justify-content: center; font-size: 1.25rem; line-height: 1; }
.carousel-arrow:disabled { opacity: 0.3; cursor: default; }
.carousel-root[data-show-arrows="true"] .carousel-arrow { display: inline-flex; }
.carousel[data-arrow-position="center"] .carousel-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 1; }
.carousel[data-arrow-position="center"] .carousel-prev { left: -0.5rem; }
.carousel[data-arrow-position="center"] .carousel-next { right: -0.5rem; }
.carousel[data-arrow-position="center"] .carousel-nav { display: none; }

.carousel-dot { background: rgba(0,0,0,0.2); border: none; cursor: pointer; }
.carousel-dot[aria-current="true"] { background: var(--color-gray-900); }

.lot-card-media { background: linear-gradient(135deg, var(--color-gray-100), var(--color-gray-200)); }
.lot-card-img { transition: transform 0.6s var(--ease-out); }
.lot-card-placeholder { color: var(--color-gray-900); opacity: 0.12; }
.lot-card-badge { top: var(--space-3); left: var(--space-3); color: var(--color-gray-900); background: rgba(255,255,255,0.92); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }

.cat-label { font-family: var(--font-body); font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: var(--color-text); opacity: 0.45; margin: 0 0 1rem; }
.cat-list { display: flex; flex-wrap: wrap; gap: 0.625rem; }
.cat-pill { display: inline-flex; align-items: center; gap: 0.375rem; font-family: var(--font-body); font-size: 0.875rem; font-weight: 500; color: var(--color-heading); background: var(--color-gray-100, rgba(0,0,0,0.04)); border: 1px solid var(--color-gray-200, rgba(0,0,0,0.08)); padding: 0.4375rem 1rem; border-radius: 999px; }
.cat-count { font-size: 0.75rem; color: var(--color-text); opacity: 0.4; margin-left: 0.125rem; }

.error-inner { max-width: 640px; margin: 0 auto; text-align: center; }
.error-title { margin: 0 0 1.5rem; }
.error-home { display: inline-block; margin-top: 2rem; padding: 0.875rem 2rem; background: var(--color-primary-500); color: #fff; border-radius: var(--radius-md); }

/* Estimation form: 3-step wizard (objects / contact / recap). Selectors are
   scoped under .estim (or prefixed estim- for the section that wraps it) so the
   other form blocks keep the generic forms.css look. Colors read theme tokens
   with the design value as a concrete fallback. */

/* ---------- section layout ---------- */
/* The estimation_form section pairs the form with a portrait image on its left,
   both aligned to the top. The image takes the design's ~32% of the content width
   (219/688 at md, 304/944 at lg, 415/1310 at xl) and is dropped below 768px,
   where the design has no image at all. */
.estim-layout { display: grid; align-items: start; }
.estim-layout-image { display: none; }
@media (min-width: 768px) {
  .estim-layout--image { grid-template-columns: minmax(0, 32%) minmax(0, 1fr); gap: 1rem; }
  .estim-layout-image { display: block; width: 100%; aspect-ratio: 304 / 503; object-fit: cover; }
  /* once sent, the side image goes too, so the message centres on the page rather
     than sitting in a column beside a much taller image */
  .estim-layout:has(> .form.estim[data-sent]) { grid-template-columns: minmax(0, 1fr); }
  .estim-layout:has(> .form.estim[data-sent]) .estim-layout-image { display: none; }
}
@media (min-width: 1280px) {
  .estim-layout--image { gap: 2rem; }
}

.estim {
  --estim-accent: var(--color-primary-500, #0f62fe);
  --estim-field-bg: var(--color-gray-100, #f2f4f8);
  --estim-field-border: var(--color-gray-300, #c1c7cd);
  --estim-ink: var(--color-gray-900, #21272a);
  --estim-muted: var(--color-gray-600, #697077);
  --estim-line: var(--color-gray-200, #d4d4d4);
  --estim-idle: var(--color-gray-400, #aab5c3);
  display: flex;
  flex-direction: column;
  gap: 3rem;
}
.estim .form-title { font-size: clamp(1.75rem, 4vw, 2.5rem); font-weight: 600; margin: 0; }
.estim .form-fields { gap: 3rem; }
.estim .form-fieldset { gap: 2rem; }
.estim .form-legal { font-size: 0.75rem; line-height: 1.4; color: var(--color-gray-400, #737373); opacity: 1; }

/* headings */
.estim-heading { font-family: var(--font-heading); font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 700; line-height: 1.1; color: var(--estim-ink); margin: 0; }
.estim-subheading { font-family: var(--font-heading); font-size: 1.5rem; font-weight: 700; line-height: 1.1; color: var(--estim-ink); margin: 0; }

/* ---------- stepper ---------- */
/* Each step is [dot][connector]; the label is centered under the dot and, as in
   the design, is wider than the dot it sits under. The row's inline padding is
   exactly that overhang, so the first and last labels never spill out of the
   form no matter how narrow the column gets. */
.estim-steps-dots { display: flex; justify-content: center; list-style: none; margin: 0; padding: 0 3.75rem; }
/* 10.5rem is the design's step width; the steps shrink rather than stretch, so
   a wide column keeps them grouped in the middle instead of spread apart. */
.estim-step { display: flex; align-items: flex-start; gap: 0.5rem; flex: 0 1 10.5rem; min-width: 0; }
/* The last step has no connector, so it must not keep a step-wide box: the empty
   tail would sit inside the centered row and push the dots off centre. */
.estim-step:last-child { flex: 0 0 auto; }
.estim-step-dot { display: flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 40px; height: 40px; padding: 0; border: 1.6px solid var(--estim-idle); border-radius: 999px; background: transparent; color: var(--estim-idle); font-family: var(--font-body); font-size: 1rem; line-height: 1.5; cursor: default; }
/* min-width:0 keeps the column the width of the dot: the wider label overflows
   it evenly on both sides instead of stretching the step and pushing the dots apart. */
.estim-step-head { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; flex: 0 0 2.5rem; min-width: 0; }
.estim-step-label { width: 10rem; font-family: var(--font-body); font-size: 1rem; line-height: 1.4; color: var(--estim-muted); text-align: center; }
@media (max-width: 1023px) {
  .estim-steps-dots { padding: 0 2.5rem; }
  .estim-step-label { width: 7.5rem; }
}
.estim-step-line { flex: 1 1 0; min-width: 0.5rem; height: 1px; margin: 1.25rem 0.5rem 0 0; background: var(--estim-line); }
.estim-step[data-state="done"] .estim-step-dot,
.estim-step[data-state="current"] .estim-step-dot { background: var(--estim-idle); border-color: var(--estim-idle); color: #fff; }
.estim-step[data-state="done"] .estim-step-dot { cursor: pointer; }

.estim-steps-compact { display: none; flex-direction: column; gap: 0.5rem; }
.estim-steps-compact-row { display: flex; align-items: center; gap: 0.8125rem; }
.estim-steps-text { display: flex; flex-direction: column; justify-content: space-between; gap: 0.25rem; }
.estim-steps-count { font-family: var(--font-body); font-size: 0.75rem; line-height: 1.2; color: var(--color-gray-400, #a8aabc); }
.estim-steps-name { font-family: var(--font-body); font-size: 1rem; line-height: 1.4; color: var(--estim-ink); }
.estim-steps-compact .estim-step-dot { background: var(--estim-idle); border-color: var(--estim-idle); color: #fff; }
.estim-steps-track { position: relative; height: 2px; border-radius: 100px; background: var(--color-gray-200, #d9d9d9); }
.estim-steps-bar { position: absolute; inset: 0 auto 0 0; width: 33.333%; border-radius: 100px; background: var(--estim-accent); transition: width 0.25s var(--ease-out); }

@media (max-width: 767px) {
  .estim-steps-dots { display: none; }
  .estim-steps-compact { display: flex; }
}

/* ---------- fields ---------- */
.estim .form-field { gap: 0.5rem; }
.estim .form-label { font-weight: 400; font-size: 0.875rem; line-height: 1.4; color: var(--estim-ink); }
.estim .form-required { color: red; }
.estim .form-input { background: var(--estim-field-bg); border: 0; border-bottom: 1px solid var(--estim-field-border); border-radius: 0; height: 3rem; padding: 0.75rem 1rem; color: var(--color-gray-900, #000); line-height: 1.4; }
.estim textarea.form-input { height: auto; min-height: 9.5rem; padding: 0.875rem 1rem; resize: vertical; }
.estim .form-input:focus { border-bottom-color: var(--estim-accent); outline: 2px solid transparent; outline-offset: -2px; }
.estim .form-input::placeholder { color: var(--estim-muted); opacity: 1; }
.estim .form-error { color: var(--color-error, #c0392b); }

/* Paired fields sit side by side (Poids / Metal, Ville / Code postal). auto-fit
   collapses the empty track, so a category that declares a single conditional
   field gets the design's full-width control instead of a half-width one. */
.estim-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr)); gap: 1rem; align-items: start; }
.estim-group { display: flex; flex-direction: column; gap: 1rem; }

/* select: native control plus the design's chevron */
.estim-select { position: relative; display: flex; }
.estim-select select.form-input { appearance: none; width: 100%; padding-right: 3rem; }
.estim-select-icon { position: absolute; top: 50%; right: 1rem; width: 13px; height: 8px; transform: translateY(-50%); pointer-events: none; }

/* suffixed field (Poids / Grammes, Dimensions / cm) */
.estim-suffixed { position: relative; display: flex; }
.estim-suffixed .form-input { padding-right: 6rem; }
.estim-suffixed-unit { position: absolute; top: 50%; right: 1rem; transform: translateY(-50%); font-family: var(--font-body); font-size: 1rem; font-weight: 500; line-height: 1.4; color: var(--estim-muted); pointer-events: none; }

/* phone with country dial code */
.estim-phone { display: flex; align-items: stretch; background: var(--estim-field-bg); border-bottom: 1px solid var(--estim-field-border); }
.estim-phone .estim-select { flex: 0 0 auto; width: 7.125rem; }
.estim-phone .estim-select select.form-input { background: transparent; border-bottom: 0; padding: 0.75rem 2.25rem 0.75rem 0.625rem; }
.estim-phone .estim-select-icon { right: 0.75rem; }
.estim-phone-sep { flex: 0 0 1px; align-self: center; width: 1px; height: 2.625rem; background: var(--color-gray-200, #dcd9d5); }
.estim-phone .form-input[type="tel"] { flex: 1 1 auto; min-width: 0; background: transparent; border-bottom: 0; }

/* ---------- photos ---------- */
.estim-photos { display: flex; flex-direction: column; gap: 0.5rem; }
.estim-photos-head { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.estim-photos-hint { font-family: var(--font-body); font-size: 0.875rem; line-height: 1.4; color: var(--color-gray-400, #9aa0ae); }
.estim-dropzone { position: relative; display: flex; align-items: center; justify-content: center; min-height: 90px; padding: 1rem; background: var(--color-gray-100, #f3f4f6); border: 1px dashed var(--color-gray-200, #dcd9d5); text-align: center; }
.estim-dropzone-input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.estim-dropzone-text { font-family: var(--font-body); font-size: 1rem; line-height: 1.4; color: var(--estim-muted); }
.estim-dropzone[data-dragover] { border-color: var(--estim-accent); background: var(--estim-field-bg); }

.estim-thumbs { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.estim-thumbs:empty { display: none; }
.estim-thumb { position: relative; width: 121px; height: 121px; background: rgba(168, 168, 168, 0.2); }
.estim-thumb img { width: 100%; height: 100%; object-fit: cover; }
.estim-thumb-remove { position: absolute; top: 4px; right: 4px; display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; padding: 0; background: #fff; border: 2px solid var(--estim-accent); cursor: pointer; }
.estim-thumb-remove img { width: 20px; height: 20px; object-fit: contain; }

/* ---------- alerts ---------- */
.estim-alert { display: flex; align-items: flex-start; gap: 1rem; padding: 0.75rem 1rem; border-radius: var(--radius-sm, 4px); font-family: var(--font-body); font-size: 0.875rem; line-height: 1.4; }
.estim-alert-icon { flex: 0 0 auto; width: 12px; height: 12px; margin-top: 0.25rem; }
.estim-alert-text { flex: 1 1 auto; min-width: 0; margin: 0; }
.estim-alert-strong { font-weight: 600; }
.estim-alert-close { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; width: 12px; height: 12px; margin-top: 0.25rem; padding: 0; background: none; border: 0; cursor: pointer; }
.estim-alert-close img { width: 10px; height: 10px; }
.estim-alert--info { background: #cde8ff; color: #003766; }
.estim-alert--success { background: #d3ffdb; color: #000; }

/* ---------- objects ---------- */
.estim-objects { display: flex; flex-direction: column; gap: 2rem; }
.estim-object { display: flex; flex-direction: column; gap: 1rem; }
.estim-object-head { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
.estim-object-head .estim-heading { flex: 1 1 12rem; }

/* ---------- recap ---------- */
.estim-recap { display: flex; flex-direction: column; gap: 2rem; }
.estim-recap-objects { display: flex; flex-direction: column; gap: 2rem; }
.estim-recap-objects:empty { display: none; }
.estim-recap-block { display: flex; flex-direction: column; gap: 1rem; }
.estim-recap-head { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
.estim-recap-head .estim-subheading { flex: 1 1 12rem; }
.estim-recap-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin: 0; }
.estim-recap-item { display: flex; flex-direction: column; gap: 0.5rem; }
.estim-recap-item--wide { grid-column: 1 / -1; }
.estim-recap-term { font-family: var(--font-body); font-size: 1rem; font-weight: 500; line-height: 1.4; color: var(--color-gray-900, #000); margin: 0; }
.estim-recap-value { font-family: var(--font-body); font-size: 1rem; line-height: 1.4; color: var(--color-gray-900, #000); margin: 0; white-space: pre-line; }

/* ---------- sent ---------- */
/* The accepted state: forms.js sets [data-sent] on the wrapper, which takes the
   form - steps, objects, summary - and the legal note out, leaving this panel
   centered on its own. */
.form.estim[data-sending] > form { opacity: 0; transition: opacity 0.18s ease-out; }
.form.estim[data-sent] > form,
.form.estim[data-sent] .form-legal { display: none; }
/* the panel brings its own vertical space, so drop the wrapper's */
.form.estim[data-sent] { gap: 0; }

/* The panel rises in via a transition, not an animation: its resting state is the
   visible one, so a browser that never runs the transition still shows it. Only
   [data-revealing], which forms.js drops on the next frame, is the offset state. */
.estim-sent { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 4rem 1.5rem; text-align: center; opacity: 1; transform: none; transition: opacity 0.45s ease-out, transform 0.45s cubic-bezier(0.16, 1, 0.3, 1); }
.form.estim[data-revealing] .estim-sent { opacity: 0; transform: translateY(0.75rem); }
.estim-sent-icon { width: 48px; height: 48px; }
.estim-sent-title { font-family: var(--font-heading); font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 700; line-height: 1.1; color: var(--estim-ink); margin: 0; }
.estim-sent-body { max-width: 32rem; font-family: var(--font-body); font-size: 1rem; line-height: 1.4; color: var(--estim-muted); margin: 0; }

@media (prefers-reduced-motion: reduce) {
  .form.estim[data-sending] > form { transition: none; }
  .estim-sent { transition: none; }
}

/* ---------- controls ---------- */
.estim-divider { width: 100%; height: 0; margin: 0; border: 0; border-top: 2px solid var(--estim-line); }
.estim-check { display: flex; align-items: flex-start; gap: 0.5rem; font-family: var(--font-body); font-size: 0.875rem; line-height: 1.4; color: var(--estim-ink); cursor: pointer; }
.estim-check input { flex: 0 0 auto; width: 1rem; height: 1rem; margin: 0.125rem 0.125rem 0; accent-color: var(--estim-accent); }

.estim-actions { display: flex; }
.estim-button { display: flex; align-items: center; justify-content: center; gap: 1rem; min-height: 3rem; padding: 1rem 0.75rem; font-family: var(--font-body); font-size: 1rem; font-weight: 500; line-height: 1; letter-spacing: 0.5px; border: 2px solid transparent; border-radius: 0; background: none; cursor: pointer; }
.estim-button img { flex: 0 0 auto; }
.estim-button--primary { flex: 1 1 auto; background: var(--estim-accent); border-color: var(--estim-accent); color: #fff; }
.estim-button--outline { flex: 1 1 auto; border-color: var(--estim-accent); color: var(--estim-accent); }
.estim-button--ghost { flex: 1 1 auto; color: var(--estim-accent); }
.estim-button--compact { flex: 0 0 auto; min-width: 10.5rem; }
.estim-button[disabled] { background: var(--estim-field-border); border-color: var(--estim-field-border); color: #fff; cursor: not-allowed; }
.estim-button--outline[disabled], .estim-button--ghost[disabled] { background: none; color: var(--estim-field-border); }

.estim-nav { display: flex; flex-direction: column; gap: 2rem; }
.estim-nav-row { display: flex; gap: 1rem; }

@media (max-width: 767px) {
  .estim-nav { position: sticky; bottom: 0; z-index: 1; gap: 1rem; padding: 1rem 0; background: var(--color-bg, #fff); border-top: 1px solid var(--estim-line); }
  .estim-recap-list { grid-template-columns: minmax(0, 1fr); }
}

.eyebrow-tag { display: inline-block; font-family: var(--font-body); font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: var(--color-primary-500); background: var(--color-gray-100, rgba(0,0,0,0.04)); padding: 0.3rem 0.75rem; border-radius: 999px; margin-bottom: 1.5rem; }
.byline-name { font-family: var(--font-body); font-size: 0.9375rem; font-weight: 600; color: var(--color-heading); }
.byline-meta { font-family: var(--font-body); font-size: 0.875rem; color: var(--color-text); opacity: 0.6; }
.read-more { margin-left: auto; display: inline-flex; align-items: center; gap: 0.5rem; font-family: var(--font-body); font-size: 0.9375rem; font-weight: 600; color: var(--color-heading); border-bottom: 2px solid var(--color-primary-500); padding-bottom: 0.125rem; }

.featured-post { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; }
.featured-title { margin: 0 0 1.25rem; }
.featured-excerpt { font-family: var(--font-body); font-size: 1.125rem; color: var(--color-text); line-height: 1.75; margin: 0 0 2rem; opacity: 0.85; }
.post-byline { display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap; }
.featured-media { border-radius: var(--radius-md); overflow: hidden; aspect-ratio: 4/3; }
.featured-media img { width: 100%; height: 100%; object-fit: cover; }

.footer { background: var(--footer-bg, var(--color-bg)); }
.footer .footer-wrap { max-width: var(--container-width); margin: 0 auto; color: var(--color-text); font-family: var(--font-body); }
.footer .footer-grid { display: grid; gap: var(--footer-gap, 2.5rem); grid-template-columns: 1fr; align-items: start; }
@media (min-width: 768px) { .footer .footer-grid { grid-template-columns: repeat(var(--footer-cols, 4), minmax(0, 1fr)); } }
.footer .footer-col-title { font-family: var(--font-heading); font-size: 0.9375rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--color-heading); margin: 0 0 1.25rem; }
.footer .footer-col h1, .footer .footer-col h2, .footer .footer-col h3, .footer .footer-col h4, .footer .footer-col h5, .footer .footer-col h6 { color: var(--color-heading); margin: 0 0 1rem; }
.footer .footer-col h2:not(:first-child), .footer .footer-col h3:not(:first-child), .footer .footer-col h4:not(:first-child), .footer .footer-col h5:not(:first-child) { margin-top: 1.75rem; }
.footer .footer-col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.6rem; }
.footer .footer-col a { color: var(--color-text); text-decoration: none; }
.footer .footer-col a:hover { color: var(--color-heading); }
.footer .footer-col { color: var(--color-text); line-height: 1.7; }
.footer .footer-social-items { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; }
.footer .footer-social--icons .footer-social-item { display: inline-flex; align-items: center; justify-content: center; color: var(--social-icon-color, var(--color-text)); }
.footer .footer-social-item svg { width: var(--social-icon-size, 18px); height: var(--social-icon-size, 18px); }
.footer .footer-social--icons.footer-social--circle .footer-social-item { width: calc(var(--social-icon-size, 18px) + 1.1rem); height: calc(var(--social-icon-size, 18px) + 1.1rem); border-radius: 50%; background: var(--social-icon-bg, var(--color-primary-500, currentColor)); color: var(--social-icon-color, #fff); }
.footer .footer-social-item:hover { opacity: 0.85; }
.footer .footer-col--full { grid-column: 1 / -1; }
.footer .footer-legal-links { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between; align-items: center; font-size: 0.8125rem; color: var(--color-text); }
.footer .footer-legal-list { display: flex; flex-wrap: wrap; gap: 0.4rem 1rem; font-size: 12px; }
.footer .footer-legal-links a { color: var(--color-text); }
.footer .footer-legal-links a:hover { color: var(--color-heading); }

.form-title { font-family: var(--font-heading); font-size: clamp(1.5rem, 3vw, 2.25rem); font-weight: 700; color: var(--color-gray-900, #1a1a1a); letter-spacing: -0.02em; margin: 0 0 2rem; }
.form-fields { display: flex; flex-direction: column; gap: 1.5rem; }
.form-fieldset { display: flex; flex-direction: column; gap: 1.5rem; border: 0; padding: 0; margin: 0; }
.form-step { font-family: var(--font-heading); font-size: 1.125rem; font-weight: 700; color: var(--color-gray-900, #1a1a1a); margin: 0 0 0.5rem; padding: 0; }
.form-step-index { color: var(--color-primary-500, #8a6d3b); }
.form-field { display: flex; flex-direction: column; gap: 0.5rem; }
.form-label { font-family: var(--font-body); font-size: 0.875rem; font-weight: 600; color: var(--color-gray-900, #1a1a1a); }
.form-required { color: var(--color-primary-500, #8a6d3b); }
.form-input { font-family: var(--font-body); font-size: 1rem; color: var(--color-gray-800, #2a2a2a); background: var(--color-gray-100, rgba(0,0,0,0.02)); border: 1px solid var(--color-gray-300, rgba(0,0,0,0.15)); border-radius: 0.5rem; padding: 0.75rem 1rem; width: 100%; outline: none; }
.form-input:focus { border-color: var(--color-primary-500, #1a1a1a); }
textarea.form-input { min-height: 8rem; resize: vertical; }
.form-input-suffix { position: relative; }
.form-suffix { position: absolute; right: 1rem; top: 50%; transform: translateY(-50%); color: var(--color-gray-700, #2a2a2a); opacity: 0.6; }
.form-button { font-family: var(--font-body); font-size: 0.9375rem; font-weight: 700; padding: 0.875rem 1.5rem; cursor: pointer; align-self: flex-start; }
.form-legal { font-family: var(--font-body); font-size: 0.8125rem; color: var(--color-gray-700, #2a2a2a); opacity: 0.6; line-height: 1.6; display: flex; flex-direction: column; gap: 0.75rem; }
.form-note { font-family: var(--font-body); font-size: 0.875rem; color: var(--color-gray-800, #2a2a2a); line-height: 1.6; background: var(--color-gray-100, rgba(0,0,0,0.03)); border-left: 3px solid var(--color-primary-500, #8a6d3b); border-radius: 0.375rem; padding: 0.75rem 1rem; margin: 0; }
.form-status { font-size: 0.9375rem; margin: 0 0 1rem; }
.form-status[data-kind="success"] { color: var(--color-success, #1e7e34); }
.form-status[data-kind="error"] { color: var(--color-error, #c0392b); }
.form-error { font-size: 0.8125rem; color: var(--color-error, #c0392b); margin: 0; }
.form-nav { display: flex; gap: 0.75rem; }
.payform .form-button { width: 100%; align-self: stretch; display: inline-flex; align-items: center; justify-content: center; }
.form-spinner { display: inline-block; width: 1.15em; height: 1.15em; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: form-spin 0.6s linear infinite; }
@keyframes form-spin { to { transform: rotate(360deg); } }
[hidden] { display: none !important; }

div[data-section-type="header"] { display: contents; }

.site-header { position: relative; z-index: 40; background: var(--color-bg); border-bottom: 1px solid var(--color-gray-200, #e5e5e5); }
.site-header[data-sticky="true"] { position: sticky; top: 0; }
.site-header.is-scrolled { box-shadow: var(--shadow-sm); }

.site-header-inner {
  max-width: var(--container-width);
  margin: 0 auto;
  position: relative;
  display: grid;
  align-items: stretch;
  gap: var(--space-4) var(--space-6);
  padding: var(--space-4) var(--space-6);
  grid-template-areas: "logo nav icons";
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
}

.site-header-logo-area { grid-area: logo; display: flex; align-items: stretch; justify-self: start; }
.site-header-nav-area { grid-area: nav; display: flex; align-items: center; min-width: 0; justify-self: center; }
.site-header-actions { grid-area: icons; display: flex; align-items: center; gap: var(--space-4); justify-self: end; }

.site-header-logo { display: flex; align-items: center; }
.site-header-logo img { display: block; width: auto; }
.site-header-logo-placeholder { display: flex; align-items: center; justify-content: center; aspect-ratio: 1; border: 1px dashed var(--color-gray-300, #d4d4d4); border-radius: 4px; color: var(--color-gray-300, #d4d4d4); }

.site-header-search { display: inline-flex; border: none; background: none; padding: 0; cursor: pointer; color: var(--nav-link-color, currentColor); }
.site-header-search:hover { color: var(--nav-link-hover-color, var(--color-primary-500)); }

.site-header[data-search-open="true"] .site-header-nav { display: none; }
.site-header[data-search-open="true"] .site-header-inner { grid-template-columns: auto minmax(0, 1fr) auto; }
.site-header[data-search-open="true"] .site-header-nav-area { justify-self: stretch; }

.site-header-search-form { display: none; align-items: center; gap: var(--space-2); width: 100%; }
.site-header[data-search-open="true"] .site-header-search-form { display: flex; }
.site-header-search-input { flex: 1; min-width: 0; border: none; border-bottom: 1px solid var(--color-gray-300, #d4d4d4); background: none; padding: var(--space-1) 0; font: inherit; color: inherit; }
.site-header-search-input:focus { outline: none; border-bottom-color: var(--nav-link-hover-color, var(--color-primary-500)); }
.site-header-search-close { display: inline-flex; align-items: center; justify-content: center; width: 1.25rem; height: 1.25rem; border: none; background: none; padding: 0; cursor: pointer; color: var(--nav-link-color, currentColor); }
.site-header-search-close:hover { color: var(--nav-link-hover-color, var(--color-primary-500)); }

.site-header-nav { min-width: 0; }
.site-header-nav > ul { display: flex; align-items: center; gap: var(--space-6); flex-wrap: wrap; }
.site-header-nav ul { list-style: none; }
.site-header-nav li { position: relative; }
.site-header-nav-row { display: flex; align-items: center; }
.site-header-nav > ul > li > .site-header-nav-row > a { display: flex; align-items: center; color: var(--nav-link-color, inherit); white-space: nowrap; }
.site-header-nav > ul > li > .site-header-nav-row > a:hover { color: var(--nav-link-hover-color, var(--color-primary-500)); }

.site-header-caret { display: inline-flex; align-items: center; justify-content: center; width: 1.25rem; height: 1.25rem; margin-left: var(--space-1); border: none; background: none; color: var(--nav-link-color, currentColor); cursor: pointer; padding: 0; }
.site-header-nav-row:hover .site-header-caret { color: var(--nav-link-hover-color, var(--color-primary-500)); }

.site-header-nav > ul > li.sub-menu::after { content: ""; position: absolute; top: 100%; left: 0; right: 0; height: var(--space-2); }

.site-header-nav ul ul { display: none; position: absolute; top: calc(100% + var(--space-2)); left: 0; min-width: 220px; flex-direction: column; align-items: stretch; gap: 0; background: var(--color-bg); box-shadow: var(--shadow-md); padding: var(--space-2); z-index: 10; }
.site-header-nav ul ul ul { top: 0; left: 100%; }
.site-header-nav li.sub-menu:hover > ul,
.site-header-nav li.sub-menu.is-open > ul { display: flex; }
.site-header-nav ul ul li { width: 100%; }
.site-header-nav ul ul .site-header-nav-row > a { width: 100%; padding: var(--space-2) var(--space-3); color: var(--nav-link-color, inherit); }
.site-header-nav ul ul .site-header-nav-row > a:hover { color: var(--nav-link-hover-color, var(--color-primary-500)); }

.site-header-burger { display: none; align-items: center; justify-content: center; width: 1.75rem; height: 1.75rem; border: none; background: none; color: var(--nav-link-color, currentColor); cursor: pointer; padding: 0; }
.site-header-burger:hover { color: var(--nav-link-hover-color, var(--color-primary-500)); }

.site-header a:focus-visible,
.site-header button:focus-visible { outline: 2px solid var(--nav-link-hover-color, var(--color-primary-500)); outline-offset: 2px; }

@media (max-width: 900px) {
  .site-header-inner { display: flex; align-items: center; }
  .site-header-nav-area { flex: 0 0 0; min-width: 0; }
  .site-header-actions { margin-left: auto; }
  .site-header-burger { display: flex; }
  .site-header-nav { position: absolute; top: 100%; left: 0; right: 0; display: none; max-height: 80vh; overflow-y: auto; background: var(--color-bg); box-shadow: var(--shadow-md); padding: var(--space-2) var(--space-4); }
  .site-header-nav[data-open="true"] { display: block; }
  .site-header-nav > ul { flex-direction: column; align-items: stretch; gap: 0; }
  .site-header-nav > ul > li > .site-header-nav-row > a { padding: var(--space-2) 0; }
  .site-header-nav ul ul { position: static; box-shadow: none; padding: 0 0 0 var(--space-4); }
  .site-header-nav > ul > li.sub-menu::after { display: none; }
  .site-header[data-search-open="true"] .site-header-nav-area { flex: 1 1 auto; }
}

.img-figure {
    margin: 0 auto;
    display: flex;
    gap: 1rem;
}

.img-link {
    display: block;
    max-width: 100%;
}

.img-media {
    display: block;
    border-radius: var(--radius-md);
}

.img-caption {
    font-family: var(--font-body);
    font-size: 0.9375rem;
    color: var(--color-secondary-700);
    line-height: 1.5;
}

.img-wrap--bg {
    border-radius: var(--radius-md);
}
.news-section { padding: var(--space-16) var(--space-8); }
.news-inner { max-width: var(--container-width); margin: 0 auto; }

.news-grid { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); align-items: start; }
.news-card { display: flex; flex-direction: column; background: var(--card-bg, #fff); border-radius: var(--radius-md); overflow: hidden; box-shadow: var(--shadow-sm); color: inherit; }
.news-card-img { aspect-ratio: 1 / 1; background: var(--color-gray-100, #f0f0f0); overflow: hidden; }
.news-card-img img { width: 100%; height: 100%; object-fit: cover; }
.news-card-body { padding: 1rem; display: flex; flex-direction: column; gap: 0.5rem; }
.news-card-date { font-size: 0.875rem; font-weight: 500; color: var(--color-gray-500, #737373); }
.news-card-title { margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.news-card-cta { display: inline-block; margin-top: 0.5rem; align-self: flex-start; font-size: 0.875rem; font-weight: 600; color: var(--color-primary-600, #1a1a1a); text-decoration: underline; }

.newsletter-inner { max-width: 620px; margin: 0 auto; text-align: center; }
.newsletter-eyebrow { font-family: var(--font-body); font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.12em; color: rgba(255,255,255,0.45); margin: 0 0 1rem; }
.newsletter-title { color: #fff; margin: 0 0 1rem; }
.newsletter-sub { font-family: var(--font-body); font-size: 1.0625rem; color: rgba(255,255,255,0.6); line-height: 1.7; margin: 0 0 2.25rem; }
.newsletter-form { display: flex; gap: 0.5rem; max-width: 460px; margin: 0 auto; }
.newsletter-input { flex: 1; padding: 0.875rem 1.25rem; border-radius: var(--radius-md); border: none; font-family: var(--font-body); font-size: 1rem; background: rgba(255,255,255,0.1); color: #fff; outline: none; }
.newsletter-btn { padding: 0.875rem 1.5rem; background: #fff; color: var(--color-heading); border: none; border-radius: var(--radius-md); font-family: var(--font-body); font-size: 0.9375rem; font-weight: 700; cursor: pointer; white-space: nowrap; }
.newsletter-note { font-family: var(--font-body); font-size: 0.8125rem; color: rgba(255,255,255,0.3); margin: 1.25rem 0 0; }

.post-grid-head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 2.5rem; border-bottom: 1px solid var(--color-gray-200, rgba(0,0,0,0.08)); padding-bottom: 1.25rem; }
.post-grid-heading { margin: 0; }
.post-grid-viewall { font-family: var(--font-body); font-size: 0.875rem; font-weight: 600; color: var(--color-text); opacity: 0.6; }
.post-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 2.5rem; }
.post-card { display: flex; flex-direction: column; }
.post-card-media { display: block; border-radius: var(--radius-md); overflow: hidden; aspect-ratio: 16/9; margin-bottom: 1.25rem; background: var(--color-gray-100, rgba(0,0,0,0.04)); }
.post-card-media img { width: 100%; height: 100%; object-fit: cover; }
.post-card-body { flex: 1; display: flex; flex-direction: column; }
.post-card-cat { font-family: var(--font-body); font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: var(--color-primary-500); margin-bottom: 0.625rem; display: block; }
.post-card-title { margin: 0 0 0.75rem; }
.post-card-title a { color: inherit; }
.post-card-excerpt { font-family: var(--font-body); font-size: 0.9375rem; color: var(--color-text); line-height: 1.65; margin: 0 0 1.25rem; opacity: 0.8; }
.post-card-foot { display: flex; align-items: center; gap: 0.75rem; margin-top: auto; padding-top: 0.75rem; }
.post-card-byline { font-family: var(--font-body); font-size: 0.8125rem; color: var(--color-text); opacity: 0.6; }
.post-card-author { font-weight: 600; color: var(--color-heading); opacity: 0.85; }

.rich-text-title { margin: 0 0 1rem; }

.sale-type { color: var(--color-sale-type, #dc2626); font-weight: 600; text-transform: capitalize; letter-spacing: 0.05em; }
.sale-type-value { text-transform: lowercase; }
.sale-tags { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.sale-tag { border-radius: 0.75rem; background: var(--color-bg); padding: 0.25rem 0.5rem; font-size: 0.75rem; font-weight: 500; color: var(--color-secondary-700); }
.sale-cta { display: inline-block; align-self: start; margin-top: 0.5rem; padding: 0.75rem 1.75rem; background: var(--color-primary-500); color: #fff; border-radius: var(--radius-md); font-size: 0.9375rem; font-weight: 600; }

.sale-hero { display: flex; flex-wrap: wrap; background: var(--card-bg, #fff); border-radius: var(--radius-md); overflow: hidden; box-shadow: var(--shadow-sm); color: inherit; }
.sale-hero-media { flex: 1 1 380px; aspect-ratio: 4 / 3; background: var(--color-gray-100, #f0f0f0); }
.sale-hero-media img { width: 100%; height: 100%; object-fit: cover; }
.sale-hero-body { flex: 1 1 380px; padding: 2.5rem; display: flex; flex-direction: column; gap: 0.875rem; justify-content: center; }
.sale-hero-body .sale-type { font-size: 0.875rem; }
.sale-hero-title { margin: 0; }
.sale-hero-date { margin: 0; font-weight: 500; }
.sale-hero-place { margin: 0; color: var(--color-secondary-700); }

.sale-years { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1.5rem; }
.sale-year { padding: 0.375rem 0.875rem; border-radius: 0.75rem; background: var(--color-bg); font-size: 0.875rem; font-weight: 500; color: var(--color-secondary-700); }
.sale-year.is-active { background: var(--color-primary-500); color: #fff; }

.sale-pagination { display: flex; justify-content: center; margin-top: 2rem; }
.sale-next { display: inline-block; padding: 0.75rem 1.75rem; background: var(--color-primary-500); color: #fff; border-radius: var(--radius-md); font-size: 0.9375rem; font-weight: 600; }

.sale-grid { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); align-items: start; }
.sale-card { display: flex; flex-direction: column; background: var(--card-bg, #fff); border-radius: var(--radius-md); overflow: hidden; box-shadow: var(--shadow-sm); color: inherit; }
.sale-card-media { aspect-ratio: 1 / 1; background: var(--color-gray-100, #f0f0f0); overflow: hidden; }
.sale-card-media img { width: 100%; height: 100%; object-fit: cover; }
.sale-card-body { padding: 1rem; display: flex; flex-direction: column; gap: 0.5rem; }
.sale-card-meta { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; font-size: 0.875rem; }
.sale-card-meta .sale-type { font-weight: 500; }
.sale-card-date { font-weight: 500; }
.sale-card-title { margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.sale-card-place { margin: 0; font-size: 0.875rem; color: var(--color-secondary-700); }
.sale-card-cta { display: inline-block; margin-top: 0.5rem; padding: 0.625rem 1.25rem; background: var(--color-primary-500); color: #fff; text-align: center; border-radius: var(--radius-md); font-size: 0.9375rem; font-weight: 600; }

.sale-list { display: flex; flex-direction: column; gap: 1rem; }
.sale-month-heading { margin: 1.5rem 0 0.25rem; font-family: var(--font-heading); text-transform: capitalize; }
.sale-month-heading:first-child { margin-top: 0; }
.sale-row { display: flex; gap: 1.25rem; align-items: center; background: var(--card-bg, #fff); border-radius: var(--radius-md); overflow: hidden; box-shadow: var(--shadow-sm); color: inherit; padding: 1rem; }
.sale-row-media { flex: 0 0 120px; aspect-ratio: 1 / 1; background: var(--color-gray-100, #f0f0f0); border-radius: var(--radius-md); overflow: hidden; }
.sale-row-media img { width: 100%; height: 100%; object-fit: cover; }
.sale-row-body { flex: 1; display: flex; flex-direction: column; gap: 0.5rem; }
.sale-row-title { margin: 0; }

.section { padding: 4rem 2rem; }
.section-inner { max-width: var(--container-width); margin: 0 auto; }
.section-heading { margin: 0 0 2.5rem; }

.avatar { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.avatar--sm { width: 32px; height: 32px; }

.slider { position: relative; overflow: hidden; width: 100%; height: var(--slider-height, 500px); background: var(--color-gray-200); }
.slider-track { display: flex; height: 100%; transition: transform 0.4s ease; will-change: transform; }
.slide { flex: 0 0 100%; height: 100%; position: relative; overflow: hidden; }
.slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.slide > a { display: block; height: 100%; }
.slide-caption { position: absolute; bottom: 0; left: 0; right: 0; padding: 1rem 1.5rem; background: linear-gradient(transparent, rgba(0,0,0,0.55)); color: #fff; font-family: var(--font-heading); font-size: clamp(1rem, 2vw, 1.5rem); pointer-events: none; }

.slider-btn { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; background: var(--color-gray-100); border: 1px solid var(--color-gray-300); color: var(--color-gray-800); width: 2.75rem; height: 2.75rem; border-radius: 50%; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background 0.2s, border-color 0.2s, color 0.2s; padding: 0; }
.slider-btn:hover { background: var(--color-primary-100); border-color: var(--color-primary-300); color: var(--color-primary-700); }
.slider-btn:disabled { opacity: 0.3; cursor: default; }
.slider-prev { left: 0.75rem; }
.slider-next { right: 0.75rem; }

.slider-dots { position: absolute; bottom: 0.75rem; left: 50%; transform: translateX(-50%); display: flex; gap: 0.4rem; }
.slider-dot { width: 0.5rem; height: 0.5rem; border-radius: 50%; border: none; cursor: pointer; background: rgba(255,255,255,0.5); padding: 0; transition: background 0.2s; }
.slider-dot[aria-current="true"] { background: var(--color-primary-500); }

.slider--vertical .slider-track { flex-direction: column; }
.slider--vertical .slider-btn { top: unset; left: 50%; transform: translateX(-50%); }
.slider--vertical .slider-prev { top: 0.75rem; }
.slider--vertical .slider-next { bottom: 0.75rem; right: unset; }
.slider--vertical .slider-btn svg { transform: rotate(90deg); }
.slider--vertical .slider-dots { bottom: unset; left: unset; transform: translateY(-50%); right: 0.75rem; top: 50%; flex-direction: column; }