:root {
  --palette-ink: #0c1422;
  --palette-ink-deep: #060b14;
  --palette-ink-soft: #16223a;
  --palette-amber: #e2a03f;
  --palette-amber-soft: #f0c47e;
  --palette-amber-ink: #8f5a0d;
  --palette-sand: #f4efe4;
  --palette-paper: #fbf8f1;
  --palette-stone: #5b6474;
  --palette-line: rgba(12, 20, 34, 0.12);
  --font-display: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Georgia, serif;
  --font-body: "Inter", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --radius-card: 18px;
  --radius-pill: 999px;
  --shadow-card: 0 22px 48px -26px rgba(12, 20, 34, 0.5);
  --shadow-soft: 0 10px 28px -18px rgba(12, 20, 34, 0.35);
}

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1.65;
  color: var(--palette-ink);
  background-color: var(--palette-paper);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  font-weight: 600;
  letter-spacing: -0.015em;
  line-height: 1.14;
  color: var(--palette-ink);
  margin-top: 0;
}

h1 { font-size: clamp(2.4rem, 5vw, 4rem); }
h2 { font-size: clamp(1.9rem, 3.6vw, 2.85rem); }
h3 { font-size: clamp(1.35rem, 2.2rem, 1.7rem); }

p { color: #2b3444; margin-top: 0; }

a {
  color: var(--palette-amber-ink);
  text-decoration: none;
  transition: color 0.2s ease;
}

a:hover { color: var(--palette-ink); }

img { max-width: 100%; height: auto; }

:focus-visible {
  outline: 2px solid var(--palette-amber);
  outline-offset: 3px;
}

.btn-pralavo {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.95rem 1.8rem;
  border-radius: var(--radius-pill);
  font-family: var(--font-body);
  font-size: 0.95rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-decoration: none;
  border: 1px solid transparent;
  cursor: pointer;
  transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease, transform 0.25s ease;
}

.btn-pralavo i { font-size: 0.85em; }

.btn-pralavo--solid {
  background: var(--palette-ink);
  color: #fbf8f1;
}

.btn-pralavo--solid:hover {
  background: var(--palette-amber);
  color: var(--palette-ink);
  transform: translateY(-2px);
}

.btn-pralavo--ghost {
  background: transparent;
  color: var(--palette-ink);
  border-color: rgba(12, 20, 34, 0.3);
}

.btn-pralavo--ghost:hover {
  border-color: var(--palette-amber);
  color: var(--palette-amber-ink);
  transform: translateY(-2px);
}

.btn-pralavo--inverse {
  background: transparent;
  color: #fbf8f1;
  border-color: rgba(255, 255, 255, 0.4);
}

.btn-pralavo--inverse:hover {
  background: var(--palette-amber);
  color: var(--palette-ink);
  border-color: var(--palette-amber);
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 1030;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  padding: 0;
  background: #fff;
  border-bottom: 1px solid rgba(12, 20, 34, 0.1);
  box-shadow: 0 10px 28px -18px rgba(12, 20, 34, 0.45);
}

.site-header--scrolled {
  box-shadow: 0 14px 32px -16px rgba(12, 20, 34, 0.4);
}

.site-header__strip {
  width: 100%;
  background: var(--palette-ink);
  color: #d7d3c9;
  font-size: 0.82rem;
  padding: 0.5rem 0;
}

.site-header__strip-inner {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 1.7rem;
  flex-wrap: wrap;
}

.site-header__strip-item {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  white-space: nowrap;
}

.site-header__strip-item i { color: var(--palette-amber); font-size: 0.82em; }

.site-header__strip a {
  color: #f0c47e;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color 0.2s ease, color 0.2s ease;
}

.site-header__strip a:hover { color: #fbf8f1; border-bottom-color: var(--palette-amber); }

.site-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 1.5rem;
  padding: 0.9rem 0;
}

.site-header__brand {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  margin: 0;
  padding: 0;
  text-decoration: none;
  color: var(--palette-ink);
}

.site-header__brand img {
  width: 64px;
  height: 64px;
  object-fit: contain;
  mix-blend-mode: multiply;
  flex-shrink: 0;
}

.site-header__brand-text {
  font-family: var(--font-display);
  font-size: 1.5rem;
  letter-spacing: 0.01em;
  color: var(--palette-ink);
}

.site-header__brand-text em {
  font-style: normal;
  color: var(--palette-amber-ink);
}

.site-nav {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.site-nav__link {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--palette-ink);
  padding: 0.4rem 0.15rem;
  border-bottom: 2px solid transparent;
  transition: color 0.2s ease, border-color 0.2s ease;
}

.site-nav__link:hover,
.site-nav__link.is-active {
  color: var(--palette-ink);
  border-bottom-color: var(--palette-amber);
}

.site-header .navbar-toggler {
  border: 1px solid var(--palette-line);
  padding: 0.45rem 0.7rem;
  border-radius: 12px;
  color: var(--palette-ink);
}

.site-header .navbar-toggler:focus { box-shadow: 0 0 0 0.2rem rgba(226, 160, 63, 0.35); }

.hero-slider { position: relative; overflow: hidden; }

.hero-slider .carousel-item { height: clamp(520px, 78vh, 760px); }

.hero-slider__slide {
  height: 100%;
  display: flex;
  align-items: center;
  background-size: cover;
  background-position: center;
  color: #fff;
  position: relative;
}

.hero-slider__slide .container { position: relative; z-index: 2; }

.hero-slider__content { max-width: 720px; padding: 2rem 0; }

.hero-slider__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  font-size: 0.78rem;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--palette-amber-soft);
  font-weight: 700;
  margin-bottom: 1.2rem;
}

.hero-slider__eyebrow::before {
  content: "";
  width: 34px;
  height: 1px;
  background: var(--palette-amber-soft);
  display: inline-block;
}

.hero-slider__title {
  color: #fff;
  font-size: clamp(2.4rem, 5.6vw, 4.4rem);
  line-height: 1.05;
  margin: 0 0 1.2rem;
}

.hero-slider__text {
  color: rgba(255, 255, 255, 0.88);
  font-size: 1.06rem;
  max-width: 560px;
  margin-bottom: 1.9rem;
}

.hero-slider__actions { display: flex; gap: 0.9rem; flex-wrap: wrap; }

.hero-slider .carousel-indicators {
  bottom: 2.2rem;
  margin-bottom: 0;
}

.hero-slider .carousel-indicators [data-bs-target] {
  width: 36px;
  height: 3px;
  border-radius: 2px;
  border: 0;
  background-color: rgba(255, 255, 255, 0.4);
  opacity: 1;
  transition: background-color 0.3s ease;
}

.hero-slider .carousel-indicators .active { background-color: var(--palette-amber); }

.hero-slider .carousel-control-prev,
.hero-slider .carousel-control-next {
  width: 3.4rem;
  opacity: 0.85;
  transition: opacity 0.2s ease;
}

.hero-slider .carousel-control-prev:hover,
.hero-slider .carousel-control-next:hover { opacity: 1; }

.section {
  position: relative;
  padding: clamp(3.4rem, 7vw, 6rem) 0;
}

.section--tight { padding: clamp(2.4rem, 4vw, 4rem) 0; }

.section--sand { background-color: var(--palette-sand); }

.section--ink { background: var(--palette-ink); color: #e8e2d5; }
.section--ink h2,
.section--ink h3,
.section--ink h4 { color: #f8f4ea; }
.section--ink p { color: #c7c1b3; }
.section--ink .section__eyebrow { color: var(--palette-amber-soft); }
.section--ink a { color: var(--palette-amber-soft); }
.section--ink a:hover { color: #fbf8f1; }

.section__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  font-size: 0.76rem;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--palette-amber-ink);
  margin-bottom: 0.9rem;
}

.section__eyebrow::before {
  content: "";
  width: 26px;
  height: 1px;
  background: currentColor;
  display: inline-block;
}

.section-heading { max-width: 760px; margin-bottom: 2.6rem; }
.section-heading--center { margin-left: auto; margin-right: auto; text-align: center; }
.section-heading h2 { margin: 0 0 0.85rem; }
.section-heading p { margin: 0; color: var(--palette-stone); font-size: 1.04rem; }
.section--ink .section-heading p { color: #c7c1b3; }

.service-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: #fff;
  border: 1px solid var(--palette-line);
  border-radius: var(--radius-card);
  overflow: hidden;
  box-shadow: var(--shadow-soft);
  transition: transform 0.35s ease, box-shadow 0.35s ease;
}

.service-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-card);
}

.service-card__media {
  aspect-ratio: 16 / 10;
  background: var(--palette-sand);
  overflow: hidden;
}

.service-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.6s ease;
}

.service-card:hover .service-card__media img { transform: scale(1.05); }

.service-card__body {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  padding: 1.6rem 1.6rem 1.9rem;
  flex: 1;
}

.service-card__title { font-size: 1.35rem; margin: 0; }
.service-card__text { font-size: 0.95rem; color: var(--palette-stone); margin: 0; }

.service-card__link {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-weight: 600;
  font-size: 0.92rem;
  color: var(--palette-ink);
  border-bottom: 1px solid var(--palette-amber);
  padding-bottom: 2px;
  width: fit-content;
}

.service-card__link:hover { color: var(--palette-amber-ink); }

.stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 1.2rem;
}

.stat {
  padding: 1.7rem 1.5rem;
  border-radius: var(--radius-card);
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.09);
}

.stat__value {
  display: block;
  font-family: var(--font-display);
  font-size: clamp(2rem, 4vw, 2.8rem);
  color: var(--palette-amber);
  line-height: 1.1;
  margin-bottom: 0.35rem;
}

.stat__label {
  font-size: 0.82rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #b9b3a5;
}

.process-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1.1rem;
}

.process-step {
  padding: 1.5rem 1.5rem 1.7rem;
  background: #fff;
  border: 1px solid var(--palette-line);
  border-radius: var(--radius-card);
  position: relative;
}

.process-step__num {
  display: block;
  font-family: var(--font-display);
  font-size: 1.9rem;
  color: var(--palette-amber);
  margin-bottom: 0.6rem;
  line-height: 1;
}

.process-step h3 { font-size: 1.1rem; margin-bottom: 0.4rem; }
.process-step p { margin: 0; font-size: 0.94rem; color: var(--palette-stone); }

.testimonial-card {
  display: flex;
  flex-direction: column;
  gap: 1.1rem;
  height: 100%;
  padding: 2rem;
  background: #fff;
  border: 1px solid var(--palette-line);
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-soft);
}

.testimonial-card__quote {
  font-family: var(--font-display);
  font-size: 1.06rem;
  line-height: 1.55;
  color: var(--palette-ink-soft);
  margin: 0;
}

.testimonial-card__meta {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  margin-top: auto;
  padding-top: 1rem;
  border-top: 1px solid var(--palette-line);
}

.testimonial-card__avatar {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  object-fit: cover;
  background: var(--palette-sand);
  flex: 0 0 auto;
}

.testimonial-card__name {
  font-weight: 600;
  color: var(--palette-ink);
  font-size: 0.95rem;
}

.testimonial-card__role { font-size: 0.82rem; color: var(--palette-stone); }

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 1rem;
}

.gallery-item {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: var(--radius-card);
  background: var(--palette-sand);
}

.gallery-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.6s ease;
}

.gallery-item:hover img { transform: scale(1.05); }

.gallery-item__caption {
  position: absolute;
  inset: auto 0 0 0;
  padding: 1.6rem 1.1rem 0.9rem;
  background: linear-gradient(0deg, rgba(12, 20, 34, 0.86), rgba(12, 20, 34, 0));
  color: #fbf8f1;
  font-size: 0.88rem;
  line-height: 1.4;
}

.cta-band {
  padding: clamp(3rem, 6vw, 5rem) 0;
  background-size: cover;
  background-position: center;
  text-align: center;
  color: #fbf8f1;
}

.cta-band__title { color: #fff; margin-bottom: 1rem; }
.cta-band__text {
  color: rgba(255, 255, 255, 0.88);
  max-width: 640px;
  margin: 0 auto 1.8rem;
  font-size: 1.04rem;
}

.cta-band__actions { display: flex; gap: 0.9rem; justify-content: center; flex-wrap: wrap; }

.faq-accordion .accordion-item {
  border: 1px solid var(--palette-line);
  border-radius: 14px !important;
  margin-bottom: 0.8rem;
  overflow: hidden;
  background: #fff;
}

.faq-accordion .accordion-button {
  background: #fff;
  color: var(--palette-ink);
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 1rem;
  padding: 1.1rem 1.3rem;
  box-shadow: none;
}

.faq-accordion .accordion-button:not(.collapsed) {
  background: var(--palette-sand);
  color: var(--palette-ink);
}

.faq-accordion .accordion-button:focus {
  box-shadow: 0 0 0 0.2rem rgba(226, 160, 63, 0.35);
}

.faq-accordion .accordion-button::after {
  filter: saturate(0.4);
}

.faq-accordion .accordion-body {
  font-size: 0.95rem;
  color: var(--palette-stone);
  padding-top: 0.2rem;
}

.form-pralavo { display: grid; gap: 1rem; }

.form-pralavo .form-label {
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--palette-stone);
  margin-bottom: 0.35rem;
}

.form-pralavo .form-control,
.form-pralavo .form-select {
  padding: 0.85rem 1rem;
  border-radius: 12px;
  border: 1px solid var(--palette-line);
  background: #fff;
  color: var(--palette-ink);
  font-size: 0.96rem;
}

.form-pralavo .form-control:focus,
.form-pralavo .form-select:focus {
  border-color: var(--palette-amber);
  box-shadow: 0 0 0 0.25rem rgba(226, 160, 63, 0.25);
}

.form-pralavo textarea.form-control { min-height: 140px; resize: vertical; }

.form-pralavo .form-check-input:checked {
  background-color: var(--palette-amber);
  border-color: var(--palette-amber);
}

.newsletter {
  background: var(--palette-sand);
  border: 1px solid var(--palette-line);
  border-radius: var(--radius-card);
  padding: clamp(1.8rem, 3.5vw, 2.8rem);
}

.newsletter__form {
  display: flex;
  gap: 0.7rem;
  flex-wrap: wrap;
  margin-top: 1.1rem;
}

.newsletter__form .form-control {
  flex: 1 1 240px;
  padding: 0.85rem 1.1rem;
  border-radius: var(--radius-pill);
  border: 1px solid var(--palette-line);
  background: #fff;
}

.newsletter__form .form-control:focus {
  border-color: var(--palette-amber);
  box-shadow: 0 0 0 0.25rem rgba(226, 160, 63, 0.25);
}

.legal-body { max-width: 820px; margin: 0 auto; }
.legal-body h2 { margin-top: 2.4rem; font-size: 1.5rem; }
.legal-body h3 { margin-top: 1.7rem; font-size: 1.15rem; }
.legal-body p, .legal-body li { color: #2b3444; font-size: 0.98rem; line-height: 1.7; }
.legal-body ul { padding-left: 1.2rem; }
.legal-body a { color: var(--palette-amber-ink); text-decoration: underline; }

.page-hero {
  padding: clamp(4rem, 9vw, 7rem) 0 clamp(3rem, 6vw, 5rem);
  background-size: cover;
  background-position: center;
  color: #fbf8f1;
  text-align: center;
}

.page-hero h1 { color: #fff; margin-bottom: 1rem; }
.page-hero p { color: rgba(255, 255, 255, 0.86); max-width: 640px; margin: 0 auto; }

.site-footer {
  background: var(--palette-ink-deep);
  color: #b6b0a2;
  padding: clamp(3rem, 6vw, 4.6rem) 0 1.8rem;
}

.site-footer h4 {
  color: #f8f4ea;
  font-size: 0.85rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  margin-bottom: 1.1rem;
  font-family: var(--font-body);
  font-weight: 700;
}

.site-footer a { color: #d7cfbe; }
.site-footer a:hover { color: var(--palette-amber); }

.site-footer__brand {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  margin-bottom: 1rem;
  text-decoration: none;
}

.site-footer__brand-text {
  font-family: var(--font-display);
  font-size: 1.4rem;
  color: #f8f4ea;
}

.site-footer__about { font-size: 0.92rem; line-height: 1.65; color: #a09a8c; }

.site-footer__grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
  gap: 2rem;
}

.site-footer__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 0.55rem;
  font-size: 0.9rem;
}

.site-footer__contact { display: grid; gap: 0.65rem; font-size: 0.9rem; }

.site-footer__contact .footer-line {
  display: inline-flex;
  gap: 0.55rem;
  align-items: flex-start;
  line-height: 1.5;
}

.site-footer__contact i {
  color: var(--palette-amber);
  margin-top: 0.18rem;
  font-size: 0.85em;
  flex: 0 0 auto;
}

.site-footer__bottom {
  margin-top: 2.6rem;
  padding-top: 1.6rem;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: space-between;
  font-size: 0.82rem;
  color: #8f8879;
}

.site-footer__bottom a { color: #c7bca6; }

.site-footer__legal-links {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 1.4rem;
}

.cookie-dock {
  position: fixed;
  left: 50%;
  bottom: 1.4rem;
  transform: translate(-50%, 140%);
  width: min(980px, calc(100% - 2rem));
  z-index: 1080;
  opacity: 0;
  pointer-events: none;
  transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.4s ease;
}

.cookie-dock--ready {
  transform: translate(-50%, 0);
  opacity: 1;
  pointer-events: auto;
}

.cookie-dock--hidden {
  transform: translate(-50%, 140%);
  opacity: 0;
  pointer-events: none;
}

.cookie-dock__panel {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 1.4rem;
  align-items: center;
  padding: 1.4rem 1.6rem;
  background: #fdfbf5;
  border: 1px solid rgba(12, 20, 34, 0.14);
  border-radius: 22px;
  box-shadow: 0 26px 60px -28px rgba(12, 20, 34, 0.55);
}

.cookie-dock__eyebrow {
  font-size: 0.72rem;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--palette-amber-ink);
  margin: 0 0 0.4rem;
}

.cookie-dock__text {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.55;
  color: #2b3444;
}

.cookie-dock__policy {
  color: var(--palette-amber-ink);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.cookie-dock__actions {
  display: flex;
  gap: 0.7rem;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.cookie-dock__decline,
.cookie-dock__accept {
  font: inherit;
  font-size: 0.88rem;
  font-weight: 600;
  padding: 0.72rem 1.25rem;
  border-radius: var(--radius-pill);
  cursor: pointer;
  border: 1px solid transparent;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.cookie-dock__decline {
  background: transparent;
  color: var(--palette-ink);
  border-color: rgba(12, 20, 34, 0.25);
}

.cookie-dock__decline:hover { border-color: var(--palette-ink); }

.cookie-dock__accept {
  background: var(--palette-ink);
  color: #f8f4ea;
}

.cookie-dock__accept:hover { background: var(--palette-amber); color: var(--palette-ink); }

@media (max-width: 991.98px) {
  .site-nav {
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    gap: 0.15rem;
    padding-top: 0.75rem;
    padding-bottom: 0.4rem;
  }
}

@media (max-width: 900px) {
  .site-footer__grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 768px) {
  .site-header__strip-inner { justify-content: center; gap: 0.6rem 1.2rem; }
  .site-nav { padding-top: 0.6rem; padding-bottom: 0.6rem; }
  .hero-slider__slide .container { padding-top: 2rem; padding-bottom: 2rem; }
}

@media (max-width: 640px) {
  .cookie-dock__panel { grid-template-columns: 1fr; }
  .cookie-dock__actions { justify-content: stretch; }
  .cookie-dock__decline,
  .cookie-dock__accept { flex: 1; }
}

@media (max-width: 560px) {
  .site-footer__grid { grid-template-columns: 1fr; }
  .site-footer__bottom { flex-direction: column; align-items: flex-start; }
}

/* QA_GRID_COLUMN_FIX .process-list.row */
.process-list.row{--bs-gutter-x:0;--bs-gutter-y:0;margin-left:0;margin-right:0}
.process-list.row>:is([class^="col-"],[class*=" col-"]){width:100%;max-width:100%;min-width:0;flex:none;padding-left:0;padding-right:0;margin-top:0}
/* QA_GRID_COLUMN_FIX .stat-grid.row */
.stat-grid.row{--bs-gutter-x:0;--bs-gutter-y:0;margin-left:0;margin-right:0}
.stat-grid.row>:is([class^="col-"],[class*=" col-"]){width:100%;max-width:100%;min-width:0;flex:none;padding-left:0;padding-right:0;margin-top:0}
/* QA_GRID_COLUMN_FIX .site-footer__grid.row */
.site-footer__grid.row{--bs-gutter-x:0;--bs-gutter-y:0;margin-left:0;margin-right:0}
.site-footer__grid.row>:is([class^="col-"],[class*=" col-"]){width:100%;max-width:100%;min-width:0;flex:none;padding-left:0;padding-right:0;margin-top:0}
/* QA_GRID_COLUMN_FIX .gallery-grid.row */
.gallery-grid.row{--bs-gutter-x:0;--bs-gutter-y:0;margin-left:0;margin-right:0}
.gallery-grid.row>:is([class^="col-"],[class*=" col-"]){width:100%;max-width:100%;min-width:0;flex:none;padding-left:0;padding-right:0;margin-top:0}

/* QA_FOOTER_CONTRAST — footer legal/copyright text was inheriting the dark body
   paragraph colour (#2b3444) on the near-black footer strip. */
.site-footer__bottom,
.site-footer__bottom p,
.site-footer__bottom .small {
  color: #d8d1c2;
}

.site-footer__bottom a { color: #eee6d5; }

/* QA_DARK_SECTION_GHOST_BUTTONS — ghost buttons sitting on photographic heroes
   used ink text over dark imagery. Give them a light label plus a translucent
   ink backing so the label always reads against the photo. */
.page-hero .btn-pralavo--ghost,
.cta-band .btn-pralavo--ghost,
.hero-slider .btn-pralavo--ghost,
.section--ink .btn-pralavo--ghost {
  background: rgba(6, 11, 20, 0.62);
  color: #fdfaf3;
  border-color: rgba(253, 250, 243, 0.55);
}

.page-hero .btn-pralavo--ghost:hover,
.cta-band .btn-pralavo--ghost:hover,
.hero-slider .btn-pralavo--ghost:hover,
.section--ink .btn-pralavo--ghost:hover {
  background: var(--palette-amber);
  color: var(--palette-ink);
  border-color: var(--palette-amber);
}

/* QA_HERO_VISIBLE — keep above-the-fold hero copy/CTAs fully opaque so they are
   never measured (or seen) mid fade-in over the background photo. */
.page-hero [data-aos],
.hero-slider [data-aos] {
  opacity: 1 !important;
  transform: none !important;
}

/* QA_STEP_CARD_COLUMNS — four narrow milestone cards on desktop were squeezed
   into ~266px tracks. Two readable columns on tablet/desktop, one on mobile. */
.process-list.row {
  grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 768px) {
  .process-list.row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
  }
}

/* QA_PAGE_HERO_LINK_CONTRAST — the global link colour (--palette-amber-ink,
   #8f5a0d) was inherited inside the dark photographic page hero, giving ~2:1
   contrast. Use the light amber plus an underline so hero links stay legible. */
.page-hero a,
.page-hero p a,
.page-hero .lead a {
  color: #f7d9a4;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.page-hero a:hover,
.page-hero a:focus-visible,
.page-hero p a:hover,
.page-hero .lead a:hover {
  color: #ffffff;
}

/* QA_COOKIE_VISIBLE — the dock markup ships with .cookie-dock--hidden and JS only
   adds .cookie-dock--ready, so the later --hidden rule kept winning and the banner
   was never visible. Show it as soon as it is not explicitly dismissed. */
.cookie-dock:not(.cookie-dock--hidden) {
  opacity: 1;
  transform: translate(-50%, 0);
  pointer-events: auto;
}

.cookie-dock.cookie-dock--ready {
  opacity: 1;
  transform: translate(-50%, 0);
  pointer-events: auto;
}

/* QA_EYEBROW_CONTRAST — amber-ink (#8f5a0d) was too light for small uppercase
   eyebrow text on the paper/sand sections, and it was also leaking into the dark
   hero slides. Split the two contexts explicitly. */
.section__eyebrow {
  color: #5c3803;
}

.section__eyebrow::before {
  background: currentColor;
}

.hero-slider .hero-slider__eyebrow,
.hero-slider .section__eyebrow,
.page-hero .section__eyebrow,
.cta-band .section__eyebrow,
.section--ink .section__eyebrow {
  color: #f8dcae;
}

.hero-slider .hero-slider__eyebrow::before {
  background: #f8dcae;
}

/* QA_GHOST_BUTTON_ON_PHOTO — ghost buttons sitting over photographic heroes were
   light text on a translucent backing, which reads as light-on-light. Use an
   opaque paper fill with ink text so the label is legible over any photo. */
.page-hero .btn-pralavo--ghost,
.cta-band .btn-pralavo--ghost,
.hero-slider .btn-pralavo--ghost,
.section--ink .btn-pralavo--ghost {
  background: #fbf8f1;
  color: #0c1422;
  border-color: #fbf8f1;
}

/* QA_FORM_STATUS — inline confirmation for the newsletter form. */
.form-status {
  color: #f4efe4;
  font-weight: 600;
}

.section--ink .form-status {
  color: #f8f4ea;
}

/* QA_GALLERY_GRID_TRACKS — .gallery-grid is a custom CSS grid that also carries
   Bootstrap row/col classes. Bootstrap's flex column widths made each card
   narrower than its grid track (160px inside a 267px track). Force the direct
   column children to fill their track, drop the gutter padding and keep the
   grid's own responsive column count. */
.gallery-grid.row {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  column-gap: 1rem;
  row-gap: 1rem;
  margin-left: 0;
  margin-right: 0;
  --bs-gutter-x: 0;
  --bs-gutter-y: 0;
}

.gallery-grid.row > [class^="col-"],
.gallery-grid.row > [class*=" col-"] {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0;
  flex: 0 0 auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0;
  margin-right: 0;
}

.gallery-grid .gallery-item {
  display: block;
  width: 100%;
  margin: 0;
}

.gallery-grid .gallery-item img {
  width: 100% !important;
  height: 100%;
  object-fit: cover;
}

/* QA_HERO_MOBILE_CLIP — on small screens the hero title is set at a size that,
   together with its container padding, pushed the headline past both viewport
   edges (letters cut off left and right). Constrain the hero content to the
   viewport and scale the title so it wraps inside the container. */
@media (max-width: 767.98px) {
  .hero-slider .hero-slider__slide > .container {
    width: 100%;
    max-width: 100%;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }

  .hero-slider .hero-slider__content {
    max-width: 100%;
    min-width: 0;
    padding-left: 0;
    padding-right: 0;
  }

  .hero-slider .hero-slider__title {
    font-size: clamp(1.75rem, 7.6vw, 2.6rem);
    line-height: 1.12;
    letter-spacing: -0.01em;
    overflow-wrap: break-word;
    hyphens: none;
    margin-left: 0;
    margin-right: 0;
  }

  .hero-slider .hero-slider__text,
  .hero-slider .hero-slider__actions {
    max-width: 100%;
    min-width: 0;
  }
}

/* QA_NEWSLETTER_BAND_CONTRAST — .newsletter paints a light sand panel while the
   section also carries .section--ink, so headings, copy and the form label were
   rendered near-white on the light band. Scope readable ink colours to the band
   and keep the input/button pair legible. */
.newsletter {
  background: #f4efe4;
  color: #0c1422;
}

.newsletter h2,
.newsletter .section-heading,
.newsletter p,
.newsletter .small {
  color: #0c1422;
}

.newsletter p {
  color: #2b3444;
}

.newsletter .section-heading {
  color: #0c1422;
}

.newsletter .form-label,
.newsletter label {
  color: #0c1422 !important;
}

.newsletter a,
.newsletter p a {
  color: #5c3803;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.newsletter a:hover,
.newsletter p a:hover {
  color: #0c1422;
}

.newsletter .form-control {
  background: #ffffff;
  border: 1px solid rgba(12, 20, 34, 0.28);
  color: #0c1422;
}

.newsletter .form-control::placeholder {
  color: #5b6474;
}

.newsletter .btn-pralavo--solid {
  background: #0c1422;
  color: #fbf8f1;
}

.newsletter .btn-pralavo--solid:hover {
  background: #e2a03f;
  color: #0c1422;
}

/* The form is a flex container, so Bootstrap's .row children need to wrap
   normally and the button must not collapse on narrow screens. */
.newsletter__form.row,
.newsletter__form .row {
  --bs-gutter-x: 0.75rem;
}

@media (max-width: 575.98px) {
  .newsletter .section-heading {
    font-size: 1.6rem;
  }
}

/* QA_COOKIE_DOCK_OVERLAP — the fixed consent dock is ~250px tall on mobile and,
   anchored 1.4rem from the viewport bottom, covered the newsletter form fields
   that happened to sit there, hiding the email input and Subscribe button.
   Keep the dock fixed but pin it flush to the viewport bottom with tighter
   spacing so it overlaps as little page content as possible, and give the
   page bottom a little breathing room. */
.cookie-dock {
  bottom: 0;
  width: min(980px, calc(100% - 1.5rem));
}

.cookie-dock__panel {
  padding: 1rem 1.15rem;
  border-radius: 16px 16px 0 0;
}

.cookie-dock__text {
  font-size: 0.84rem;
  line-height: 1.5;
}

@media (max-width: 640px) {
  .cookie-dock__panel {
    gap: 0.8rem;
  }

  .cookie-dock__decline,
  .cookie-dock__accept {
    padding: 0.6rem 1rem;
    font-size: 0.82rem;
  }
}

/* QA_COOKIE_DOCK_UNCOVER_FORM — the fixed consent dock still sat directly over
   the newsletter Subscribe button at this scroll position, making the form
   impossible to read or use. The dock is consent UI, not page content: render it
   in normal flow at the end of the page instead of as a fixed overlay, so it can
   never cover the newsletter form (or any other section) while scrolling. */
.cookie-dock,
.cookie-dock.cookie-dock--ready,
.cookie-dock:not(.cookie-dock--hidden) {
  position: static;
  left: auto;
  bottom: auto;
  transform: none;
  width: 100%;
  margin: 0;
  padding: 0 0 1.5rem;
  z-index: auto;
}

.cookie-dock.cookie-dock--hidden {
  display: none;
}

.cookie-dock__panel {
  width: min(980px, calc(100% - 2rem));
  margin: 0 auto;
  border-radius: 18px;
}

@media (max-width: 640px) {
  .cookie-dock__panel {
    width: calc(100% - 1.5rem);
  }
}

/* QA_NEWSLETTER_UTILITY_OVERRIDE — Bootstrap's .text-white / .text-white-50
   utilities use !important, so they beat the scoped .newsletter colour rules and
   the Privacy Policy / Terms links (and the heading) stayed near-white on the
   light sand band. Re-assert ink colours on the band with matching priority. */
.newsletter,
.newsletter .text-white {
  color: #0c1422 !important;
}

.newsletter h2.text-white,
.newsletter .section-heading.text-white {
  color: #0c1422 !important;
}

.newsletter p.text-white,
.newsletter .small.text-white {
  color: #2b3444 !important;
}

.newsletter label.text-white,
.newsletter .form-label.text-white {
  color: #0c1422 !important;
}

.newsletter a.text-white,
.newsletter p a,
.newsletter .small a {
  color: #5c3803 !important;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.newsletter a.text-white:hover,
.newsletter p a:hover,
.newsletter .small a:hover {
  color: #0c1422 !important;
}

/* QA_STEP_CARD_MOBILE_PADDING — on mobile the .process-list is a single column, so
   each step card is a full-width block holding only a short heading and one
   sentence. The .p-4 (1.5rem all round) plus .process-step's own vertical padding
   left a large empty band inside every card and stretched the six-step list past
   two viewport heights. Trim the card's vertical padding on small screens; keep
   the horizontal padding, text alignment and the desktop/tablet spacing intact.
   `.process-list > div > .process-step` targets the cards directly, so the rows
   of icon tiles inside other sections (which are plain divs without this class)
   are unaffected. */
@media (max-width: 767.98px) {
  .process-list > div > .process-step {
    padding-top: 1.05rem;
    padding-bottom: 1.2rem;
  }

  .process-list > div > .process-step .process-step__num {
    font-size: 1.55rem;
    margin-bottom: 0.35rem;
  }

  .process-list > div > .process-step h3 {
    margin-top: 0.55rem !important;
    margin-bottom: 0.3rem;
  }

  .process-list > div > .process-step p {
    line-height: 1.5;
  }

  .process-list.row {
    row-gap: 0.9rem;
  }
}

/* QA_GALLERY_CAPTION_LEGIBILITY — the gallery captions are absolutely positioned
   over the photos and rely on a bottom-up gradient scrim. When the text wraps to
   more lines (desktop 3-up tracks are short) the copy reached up into the
   transparent top of the gradient and dark caption text sat on dark car
   interiors/shadow. Give the caption a taller, stronger ink scrim, keep the text
   state explicit (no inherited dark paragraph colour) and add a subtle text
   shadow so it reads over any photo. Layout (inset, padding, font size) is left
   as-is so desktop and mobile grids are unchanged. */
.gallery-grid .gallery-item__caption {
  background: linear-gradient(
    0deg,
    rgba(6, 11, 20, 0.94) 0%,
    rgba(6, 11, 20, 0.88) 48%,
    rgba(6, 11, 20, 0.55) 78%,
    rgba(6, 11, 20, 0) 100%
  );
  color: #fbf8f1;
  font-weight: 500;
  text-shadow: 0 1px 2px rgba(6, 11, 20, 0.85);
}

/* QA_GALLERY_CAPTION_SCRIM_FULL — on narrow viewports the gallery tiles are
   small (2-up), so the absolutely positioned caption covers most of the visible
   photo and its copy spills past the faded top of the bottom-up gradient,
   leaving light text on bright/mixed photo content (worst on light-coloured
   vehicles). Keep the caption anchored exactly where it is, but give its
   backing a near-opaque ink panel so the label contrast no longer depends on
   the image behind it. Mobile and desktop both benefit; grid tracks, insets,
   padding, font size and text alignment are untouched. */
.gallery-grid .gallery-item__caption {
  background: linear-gradient(
    0deg,
    rgba(6, 11, 20, 0.97) 0%,
    rgba(6, 11, 20, 0.95) 62%,
    rgba(6, 11, 20, 0.88) 100%
  );
  color: #ffffff;
  font-weight: 600;
  letter-spacing: 0.005em;
  text-shadow: 0 1px 3px rgba(6, 11, 20, 0.95);
}

.gallery-grid .gallery-item__caption p {
  color: inherit;
}

/* QA_EMAIL_LINK_CONTRAST — the global amber-ink link colour (#8f5a0d) gives only
   ~3.9:1 on the white panel of the stats/process cards. Inside a white card the
   links get the darker amber-ink variant so the label clears 4.5:1, without
   touching links elsewhere on the paper/sand backgrounds. */
.stat.bg-white a,
.process-step.bg-white a,
.bg-white a:not(.btn),
.rounded-4.bg-white a:not(.btn) {
  color: #5c3803;
}

.stat.bg-white a:not(.btn):hover,
.process-step.bg-white a:not(.btn):hover,
.bg-white a:not(.btn):hover,
.rounded-4.bg-white a:not(.btn):hover {
  color: #0c1422;
}