:root {
  --thg-ink: #0f131a;
  --thg-ink-soft: #171c25;
  --thg-ink-deep: #080b10;
  --thg-steel: #63707f;
  --thg-steel-soft: #9aa4b0;
  --thg-paper: #f5f1ea;
  --thg-paper-deep: #e9e3d8;
  --thg-accent: #ff5c1a;
  --thg-accent-deep: #cf4708;
  --thg-signal: #f7b500;
  --thg-line: rgba(15, 19, 26, 0.12);
  --thg-line-dark: rgba(255, 255, 255, 0.14);
  --thg-radius-sm: 8px;
  --thg-radius: 14px;
  --thg-radius-lg: 22px;
  --thg-shadow-sm: 0 4px 16px rgba(15, 19, 26, 0.08);
  --thg-shadow: 0 18px 44px rgba(15, 19, 26, 0.16);
  --thg-shadow-strong: 0 26px 70px rgba(8, 11, 16, 0.32);
  --thg-font-display: "Archivo", "Saira", "Helvetica Neue", Arial, sans-serif;
  --thg-font-body: "Inter", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --thg-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

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

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

body {
  margin: 0;
  font-family: var(--thg-font-body);
  font-size: 16px;
  line-height: 1.65;
  color: var(--thg-ink);
  background-color: var(--thg-paper);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

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

a {
  color: var(--thg-accent-deep);
  text-decoration: none;
  transition: color 0.2s var(--thg-ease);
}

a:hover,
a:focus-visible {
  color: var(--thg-accent);
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--thg-font-display);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.12;
  color: var(--thg-ink);
  margin: 0 0 0.6em;
}

p {
  margin: 0 0 1.1em;
}

.container,
.container-fluid {
  padding-left: 20px;
  padding-right: 20px;
}

.site-shell {
  overflow-x: hidden;
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--thg-font-display);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--thg-accent-deep);
  margin-bottom: 18px;
}

.eyebrow::before {
  content: "";
  display: inline-block;
  width: 28px;
  height: 2px;
  background: var(--thg-accent);
}

.eyebrow--light {
  color: var(--thg-signal);
}

.section-heading {
  max-width: 720px;
  margin-bottom: 48px;
}

.section-heading--center {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.section-heading p {
  color: var(--thg-steel);
  font-size: 1.05rem;
}

.display-xl {
  font-size: clamp(2.4rem, 5.4vw, 4.4rem);
}

.display-lg {
  font-size: clamp(2rem, 3.6vw, 3rem);
}

.lead-line {
  font-size: clamp(1.05rem, 1.4vw, 1.2rem);
  color: var(--thg-steel);
  max-width: 620px;
}

.text-signal {
  color: var(--thg-signal);
}

.text-accent {
  color: var(--thg-accent-deep);
}

.text-soft {
  color: var(--thg-steel-soft);
}

.bg-ink {
  background-color: var(--thg-ink);
  color: #f4f5f7;
}

.bg-ink-soft {
  background-color: var(--thg-ink-soft);
  color: #f4f5f7;
}

.bg-ink h1,
.bg-ink h2,
.bg-ink h3,
.bg-ink-soft h1,
.bg-ink-soft h2,
.bg-ink-soft h3 {
  color: #ffffff;
}

.bg-ink p,
.bg-ink-soft p {
  color: rgba(244, 245, 247, 0.82);
}

.bg-paper-deep {
  background-color: var(--thg-paper-deep);
}

.btn {
  font-family: var(--thg-font-display);
  font-weight: 700;
  letter-spacing: 0.02em;
  border-radius: 999px;
  padding: 0.85rem 1.9rem;
  border: 0;
  transition: transform 0.25s var(--thg-ease), box-shadow 0.25s var(--thg-ease), background-color 0.25s var(--thg-ease);
}

.btn:focus-visible {
  outline: 3px solid var(--thg-signal);
  outline-offset: 3px;
}

.btn-accent {
  background: var(--thg-accent);
  color: #140a03;
}

.btn-accent:hover,
.btn-accent:focus {
  background: var(--thg-accent-deep);
  color: #ffffff;
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(207, 71, 8, 0.35);
}

.btn-outline-ink {
  background: transparent;
  color: var(--thg-ink);
  border: 1.5px solid var(--thg-ink);
}

.btn-outline-ink:hover,
.btn-outline-ink:focus {
  background: var(--thg-ink);
  color: #ffffff;
}

.btn-outline-light {
  background: transparent;
  color: #ffffff;
  border: 1.5px solid rgba(255, 255, 255, 0.6);
}

.btn-outline-light:hover,
.btn-outline-light:focus {
  background: rgba(255, 255, 255, 0.12);
  border-color: #ffffff;
  color: #ffffff;
}

.btn-ghost-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--thg-font-display);
  font-weight: 700;
  color: var(--thg-ink);
  letter-spacing: 0.02em;
}

.btn-ghost-link i {
  transition: transform 0.25s var(--thg-ease);
}

.btn-ghost-link:hover i {
  transform: translateX(4px);
}

.hero {
  position: relative;
  min-height: 92vh;
  display: flex;
  align-items: center;
  overflow: hidden;
  color: #ffffff;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, rgba(8, 11, 16, 0.86) 0%, rgba(8, 11, 16, 0.5) 55%, rgba(255, 92, 26, 0.22) 100%);
  z-index: 0;
}

.hero > .container,
.hero > .container-fluid {
  position: relative;
  z-index: 2;
}

.hero-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 26px;
  margin-top: 34px;
  padding-top: 26px;
  border-top: 1px solid rgba(255, 255, 255, 0.18);
  max-width: 640px;
}

.hero-meta-item {
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: var(--thg-font-display);
  font-weight: 600;
  color: rgba(255, 255, 255, 0.86);
}

.hero-meta-item i {
  color: var(--thg-signal);
  font-size: 1.1rem;
}

.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.22);
  font-family: var(--thg-font-display);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--thg-signal);
  margin-bottom: 22px;
}

.hero-scroll {
  position: absolute;
  left: 50%;
  bottom: 22px;
  transform: translateX(-50%);
  z-index: 2;
  color: rgba(255, 255, 255, 0.7);
  font-size: 1.4rem;
  animation: heroBob 2.4s ease-in-out infinite;
}

@keyframes heroBob {
  0%, 100% { transform: translate(-50%, 0); opacity: 0.5; }
  50% { transform: translate(-50%, 8px); opacity: 1; }
}

.carousel-slide {
  min-height: 82vh;
  display: flex;
  align-items: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: relative;
  color: #ffffff;
}

.carousel-slide::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, rgba(8, 11, 16, 0.88) 0%, rgba(8, 11, 16, 0.42) 60%, rgba(8, 11, 16, 0.18) 100%);
}

.carousel-slide > .container {
  position: relative;
  z-index: 2;
}

.carousel .carousel-indicators [data-bs-target] {
  width: 32px;
  height: 4px;
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.5);
  opacity: 1;
  border: 0;
}

.carousel .carousel-indicators .active {
  background: var(--thg-accent);
}

.carousel-control-prev,
.carousel-control-next {
  width: 58px;
  opacity: 0.75;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.4));
}

.feature-card {
  position: relative;
  height: 100%;
  background: #ffffff;
  border-radius: var(--thg-radius-lg);
  padding: 34px 30px;
  border: 1px solid var(--thg-line);
  box-shadow: var(--thg-shadow-sm);
  transition: transform 0.3s var(--thg-ease), box-shadow 0.3s var(--thg-ease), border-color 0.3s var(--thg-ease);
}

.feature-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--thg-shadow);
  border-color: rgba(255, 92, 26, 0.35);
}

.feature-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  border-radius: 16px;
  background: linear-gradient(135deg, var(--thg-accent) 0%, var(--thg-accent-deep) 100%);
  color: #ffffff;
  font-size: 1.4rem;
  margin-bottom: 22px;
}

.feature-card h3 {
  font-size: 1.2rem;
  margin-bottom: 10px;
}

.feature-card p {
  color: var(--thg-steel);
  margin-bottom: 0;
  font-size: 0.96rem;
}

.stat-block {
  padding: 26px 0;
  border-bottom: 1px solid var(--thg-line-dark);
}

.stat-number {
  font-family: var(--thg-font-display);
  font-size: clamp(2.4rem, 4vw, 3.4rem);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.03em;
  color: var(--thg-signal);
}

.stat-label {
  font-family: var(--thg-font-display);
  font-size: 0.86rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(244, 245, 247, 0.7);
  margin-top: 8px;
}

.service-card {
  position: relative;
  background: #ffffff;
  border-radius: var(--thg-radius-lg);
  overflow: hidden;
  border: 1px solid var(--thg-line);
  box-shadow: var(--thg-shadow-sm);
  height: 100%;
  transition: transform 0.35s var(--thg-ease), box-shadow 0.35s var(--thg-ease);
}

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

.service-card-media {
  position: relative;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: var(--thg-paper-deep);
}

.service-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s var(--thg-ease);
}

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

.service-card-tag {
  position: absolute;
  top: 16px;
  left: 16px;
  padding: 6px 14px;
  border-radius: 999px;
  background: var(--thg-accent);
  color: #140a03;
  font-family: var(--thg-font-display);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.service-card-body {
  padding: 26px 28px 30px;
}

.service-card-body h3 {
  font-size: 1.3rem;
  margin-bottom: 12px;
}

.service-card-body p {
  color: var(--thg-steel);
  font-size: 0.96rem;
  margin-bottom: 18px;
}

.service-price {
  display: flex;
  align-items: baseline;
  gap: 8px;
  font-family: var(--thg-font-display);
  margin-bottom: 16px;
}

.service-price strong {
  font-size: 1.5rem;
  color: var(--thg-ink);
}

.service-price span {
  font-size: 0.84rem;
  color: var(--thg-steel);
}

.process-list {
  display: grid;
  gap: 22px;
  counter-reset: process;
}

.process-step {
  position: relative;
  padding-left: 76px;
  padding-bottom: 22px;
  border-bottom: 1px dashed var(--thg-line);
  counter-increment: process;
}

.process-step:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.process-step::before {
  content: "0" counter(process);
  position: absolute;
  left: 0;
  top: 0;
  width: 54px;
  height: 54px;
  border-radius: 14px;
  background: var(--thg-ink);
  color: var(--thg-signal);
  font-family: var(--thg-font-display);
  font-size: 1rem;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  letter-spacing: 0.02em;
}

.process-step h3 {
  font-size: 1.1rem;
  margin-bottom: 8px;
}

.process-step p {
  color: var(--thg-steel);
  margin: 0;
  font-size: 0.96rem;
}

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.gallery-tile {
  position: relative;
  border-radius: var(--thg-radius);
  overflow: hidden;
  aspect-ratio: 4 / 3;
  background: var(--thg-paper-deep);
}

.gallery-tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s var(--thg-ease);
}

.gallery-tile:hover img {
  transform: scale(1.07);
}

.gallery-tile figcaption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 18px 20px 16px;
  background: linear-gradient(180deg, rgba(8, 11, 16, 0) 0%, rgba(8, 11, 16, 0.82) 100%);
  color: #ffffff;
  font-family: var(--thg-font-display);
  font-size: 0.92rem;
  font-weight: 600;
}

.quote-card {
  position: relative;
  height: 100%;
  background: #ffffff;
  border-radius: var(--thg-radius-lg);
  padding: 32px 30px;
  border: 1px solid var(--thg-line);
  box-shadow: var(--thg-shadow-sm);
  display: flex;
  flex-direction: column;
}

.quote-card .fa-quote-left {
  color: var(--thg-accent);
  font-size: 1.6rem;
  margin-bottom: 18px;
}

.quote-card p {
  color: var(--thg-ink-soft);
  font-size: 1rem;
  margin-bottom: 24px;
  flex-grow: 1;
}

.quote-person {
  display: flex;
  align-items: center;
  gap: 16px;
}

.quote-person img {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  object-fit: cover;
  background: var(--thg-paper-deep);
}

.quote-person strong {
  display: block;
  font-family: var(--thg-font-display);
  font-size: 0.98rem;
}

.quote-person span {
  font-size: 0.85rem;
  color: var(--thg-steel);
}

.team-card {
  background: #ffffff;
  border-radius: var(--thg-radius-lg);
  overflow: hidden;
  border: 1px solid var(--thg-line);
  box-shadow: var(--thg-shadow-sm);
  height: 100%;
  transition: transform 0.3s var(--thg-ease), box-shadow 0.3s var(--thg-ease);
}

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

.team-photo {
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: var(--thg-paper-deep);
}

.team-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.team-body {
  padding: 22px 24px 26px;
}

.team-body h3 {
  font-size: 1.1rem;
  margin-bottom: 4px;
}

.team-role {
  font-family: var(--thg-font-display);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--thg-accent-deep);
  margin-bottom: 14px;
}

.team-body p {
  color: var(--thg-steel);
  font-size: 0.92rem;
  margin: 0;
}

.portfolio-card {
  position: relative;
  border-radius: var(--thg-radius-lg);
  overflow: hidden;
  aspect-ratio: 5 / 4;
  background: var(--thg-paper-deep);
}

.portfolio-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s var(--thg-ease);
}

.portfolio-card:hover img {
  transform: scale(1.06);
}

.portfolio-card-body {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(8, 11, 16, 0) 40%, rgba(8, 11, 16, 0.86) 100%);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 26px;
  color: #ffffff;
}

.portfolio-card-body span {
  font-family: var(--thg-font-display);
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--thg-signal);
  margin-bottom: 8px;
}

.portfolio-card-body h3 {
  color: #ffffff;
  font-size: 1.2rem;
  margin: 0;
}

.timeline {
  position: relative;
  padding-left: 34px;
}

.timeline::before {
  content: "";
  position: absolute;
  left: 11px;
  top: 6px;
  bottom: 6px;
  width: 2px;
  background: var(--thg-line);
}

.timeline-item {
  position: relative;
  padding-bottom: 34px;
}

.timeline-item:last-child {
  padding-bottom: 0;
}

.timeline-item::before {
  content: "";
  position: absolute;
  left: -30px;
  top: 5px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--thg-accent);
  box-shadow: 0 0 0 4px rgba(255, 92, 26, 0.18);
}

.timeline-year {
  font-family: var(--thg-font-display);
  font-weight: 800;
  color: var(--thg-accent-deep);
  font-size: 0.92rem;
  letter-spacing: 0.05em;
}

.timeline-item h3 {
  font-size: 1.1rem;
  margin: 4px 0 8px;
}

.timeline-item p {
  color: var(--thg-steel);
  font-size: 0.95rem;
  margin: 0;
}

.accordion-garage .accordion-item {
  background: #ffffff;
  border: 1px solid var(--thg-line);
  border-radius: var(--thg-radius) !important;
  margin-bottom: 14px;
  overflow: hidden;
}

.accordion-garage .accordion-button {
  font-family: var(--thg-font-display);
  font-weight: 700;
  font-size: 1.02rem;
  color: var(--thg-ink);
  background: transparent;
  padding: 22px 24px;
  box-shadow: none;
}

.accordion-garage .accordion-button:not(.collapsed) {
  color: var(--thg-accent-deep);
  background: rgba(255, 92, 26, 0.06);
}

.accordion-garage .accordion-button:focus {
  box-shadow: none;
  border-color: transparent;
}

.accordion-garage .accordion-body {
  color: var(--thg-steel);
  padding: 0 24px 24px;
  font-size: 0.96rem;
}

.pricing-card {
  position: relative;
  background: #ffffff;
  border-radius: var(--thg-radius-lg);
  padding: 36px 32px;
  border: 1px solid var(--thg-line);
  box-shadow: var(--thg-shadow-sm);
  height: 100%;
  display: flex;
  flex-direction: column;
}

.pricing-card--featured {
  background: var(--thg-ink);
  color: #f4f5f7;
  border-color: transparent;
  box-shadow: var(--thg-shadow-strong);
}

.pricing-card--featured h2,
.pricing-card--featured h3 {
  color: #ffffff;
}

.pricing-card--featured .pricing-price strong {
  color: var(--thg-signal);
}

.pricing-badge {
  position: absolute;
  top: -14px;
  right: 24px;
  padding: 6px 16px;
  border-radius: 999px;
  background: var(--thg-accent);
  color: #140a03;
  font-family: var(--thg-font-display);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.pricing-card h2,
.pricing-card h3 {
  font-size: 1.35rem;
  margin-bottom: 6px;
}

.pricing-tagline {
  color: var(--thg-steel);
  font-size: 0.94rem;
  margin-bottom: 22px;
}

.pricing-card--featured .pricing-tagline {
  color: rgba(244, 245, 247, 0.72);
}

.pricing-price {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 26px;
}

.pricing-price strong {
  font-family: var(--thg-font-display);
  font-size: 2.4rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1;
}

.pricing-price span {
  font-size: 0.86rem;
  color: var(--thg-steel);
}

.pricing-card--featured .pricing-price span {
  color: rgba(244, 245, 247, 0.7);
}

.pricing-list {
  list-style: none;
  padding: 0;
  margin: 0 0 28px;
  flex-grow: 1;
}

.pricing-list li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 9px 0;
  font-size: 0.95rem;
  color: var(--thg-ink-soft);
  border-bottom: 1px dashed var(--thg-line);
}

.pricing-list li:last-child {
  border-bottom: 0;
}

.pricing-list li i {
  color: var(--thg-accent);
  margin-top: 4px;
  font-size: 0.8rem;
}

.pricing-card--featured .pricing-list li {
  color: rgba(244, 245, 247, 0.85);
  border-bottom-color: rgba(255, 255, 255, 0.12);
}

.pricing-card--featured .pricing-list li i {
  color: var(--thg-signal);
}

.form-panel {
  background: #ffffff;
  border-radius: var(--thg-radius-lg);
  padding: 40px 36px;
  border: 1px solid var(--thg-line);
  box-shadow: var(--thg-shadow);
}

.form-label {
  font-family: var(--thg-font-display);
  font-weight: 600;
  font-size: 0.82rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--thg-ink);
  margin-bottom: 8px;
}

.form-control,
.form-select {
  border-radius: var(--thg-radius-sm);
  border: 1.5px solid var(--thg-line);
  padding: 0.8rem 1rem;
  font-size: 0.96rem;
  background: #fbfaf7;
  color: var(--thg-ink);
  transition: border-color 0.2s var(--thg-ease), box-shadow 0.2s var(--thg-ease);
}

.form-control:focus,
.form-select:focus {
  border-color: var(--thg-accent);
  box-shadow: 0 0 0 4px rgba(255, 92, 26, 0.14);
  background: #ffffff;
}

.form-control.is-invalid,
.form-select.is-invalid {
  border-color: #c0281f;
  background: #fdf3f2;
}

.form-note {
  font-size: 0.82rem;
  color: var(--thg-steel);
  margin-top: 14px;
}

.contact-line {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 22px;
}

.contact-line i {
  color: var(--thg-accent);
  font-size: 1.1rem;
  margin-top: 4px;
  width: 22px;
  text-align: center;
}

.contact-line strong {
  display: block;
  font-family: var(--thg-font-display);
  font-size: 0.82rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--thg-steel);
  margin-bottom: 3px;
}

.contact-line span,
.contact-line a {
  color: var(--thg-ink);
  font-weight: 600;
}

.map-frame {
  border-radius: var(--thg-radius-lg);
  overflow: hidden;
  border: 1px solid var(--thg-line);
  box-shadow: var(--thg-shadow-sm);
  min-height: 340px;
}

.map-frame iframe {
  width: 100%;
  height: 100%;
  min-height: 340px;
  border: 0;
  display: block;
}

.cta-band {
  position: relative;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  color: #ffffff;
  padding: 90px 0;
  overflow: hidden;
}

.cta-band::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, rgba(8, 11, 16, 0.9) 0%, rgba(8, 11, 16, 0.5) 100%);
}

.cta-band > .container {
  position: relative;
  z-index: 2;
}

.cta-band h2 {
  color: #ffffff;
}

.cta-band p {
  color: rgba(255, 255, 255, 0.82);
  max-width: 560px;
}

.breadcrumb-strip {
  padding: 22px 0;
  background: var(--thg-paper-deep);
  border-bottom: 1px solid var(--thg-line);
}

.breadcrumb-strip .breadcrumb {
  margin: 0;
  font-size: 0.86rem;
}

.breadcrumb-strip .breadcrumb-item a {
  color: var(--thg-steel);
}

.breadcrumb-strip .breadcrumb-item.active {
  color: var(--thg-ink);
  font-weight: 600;
}

.article-card {
  background: #ffffff;
  border-radius: var(--thg-radius-lg);
  overflow: hidden;
  border: 1px solid var(--thg-line);
  box-shadow: var(--thg-shadow-sm);
  height: 100%;
  transition: transform 0.3s var(--thg-ease), box-shadow 0.3s var(--thg-ease);
}

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

.article-media {
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--thg-paper-deep);
}

.article-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.article-body {
  padding: 26px 28px 30px;
}

.article-meta {
  display: flex;
  gap: 16px;
  font-family: var(--thg-font-display);
  font-size: 0.76rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--thg-steel);
  margin-bottom: 12px;
}

.article-body h3 {
  font-size: 1.22rem;
  margin-bottom: 10px;
}

.article-body p {
  color: var(--thg-steel);
  font-size: 0.95rem;
  margin-bottom: 16px;
}

.prose-block h2 {
  font-size: 1.5rem;
  margin-top: 2rem;
}

.prose-block h3 {
  font-size: 1.15rem;
  margin-top: 1.6rem;
}

.prose-block p,
.prose-block li {
  color: var(--thg-ink-soft);
}

.prose-block ul {
  padding-left: 1.2rem;
}

.prose-block ul li {
  margin-bottom: 0.5rem;
}

.legal-meta {
  padding: 14px 20px;
  border-radius: var(--thg-radius-sm);
  background: var(--thg-paper-deep);
  font-size: 0.88rem;
  color: var(--thg-steel);
  margin-bottom: 32px;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 1030;
  background: rgba(245, 241, 234, 0.94);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--thg-line);
  transition: box-shadow 0.25s var(--thg-ease);
}

.site-header.is-scrolled {
  box-shadow: var(--thg-shadow-sm);
}

.topbar {
  background: var(--thg-ink);
  color: rgba(244, 245, 247, 0.82);
  font-size: 0.82rem;
  padding: 8px 0;
}

.topbar a {
  color: rgba(244, 245, 247, 0.82);
}

.topbar a:hover {
  color: var(--thg-signal);
}

.topbar-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.topbar-item i {
  color: var(--thg-signal);
  font-size: 0.8rem;
}

.navbar-garage {
  padding: 14px 0;
}

.navbar-garage .navbar-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: var(--thg-font-display);
  font-weight: 800;
  font-size: 1.15rem;
  letter-spacing: -0.01em;
  color: var(--thg-ink);
}

.navbar-garage .nav-link {
  font-family: var(--thg-font-display);
  font-weight: 600;
  font-size: 0.94rem;
  color: var(--thg-ink-soft);
  padding: 0.5rem 0.9rem;
  position: relative;
}

.navbar-garage .nav-link::after {
  content: "";
  position: absolute;
  left: 0.9rem;
  right: 0.9rem;
  bottom: 0.28rem;
  height: 2px;
  background: var(--thg-accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.25s var(--thg-ease);
}

.navbar-garage .nav-link:hover::after,
.navbar-garage .nav-link:focus::after {
  transform: scaleX(1);
}

.navbar-garage .dropdown-menu {
  border-radius: var(--thg-radius);
  border: 1px solid var(--thg-line);
  box-shadow: var(--thg-shadow);
  padding: 10px;
}

.navbar-garage .dropdown-item {
  border-radius: var(--thg-radius-sm);
  font-size: 0.92rem;
  padding: 0.55rem 0.8rem;
}

.navbar-toggler {
  border: 0;
  padding: 6px 10px;
}

.navbar-toggler:focus {
  box-shadow: none;
}

.navbar-toggler i {
  font-size: 1.3rem;
  color: var(--thg-ink);
}

.site-footer {
  background: var(--thg-ink-deep);
  color: rgba(244, 245, 247, 0.72);
  padding: 72px 0 26px;
}

.site-footer h3,
.site-footer h4 {
  color: #ffffff;
  font-size: 0.95rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 20px;
}

.site-footer p {
  color: rgba(244, 245, 247, 0.72);
  font-size: 0.92rem;
}

.footer-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: var(--thg-font-display);
  font-weight: 800;
  font-size: 1.15rem;
  color: #ffffff;
  margin-bottom: 18px;
}

.footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-links li {
  margin-bottom: 10px;
}

.footer-links a {
  color: rgba(244, 245, 247, 0.72);
  font-size: 0.92rem;
}

.footer-links a:hover {
  color: var(--thg-signal);
}

.footer-contact-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 16px;
  font-size: 0.92rem;
}

.footer-contact-item i {
  color: var(--thg-signal);
  margin-top: 4px;
  width: 18px;
  text-align: center;
}

.footer-contact-item strong {
  display: block;
  color: #ffffff;
  font-size: 0.8rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 2px;
}

.footer-bottom {
  border-top: 1px solid var(--thg-line-dark);
  padding-top: 24px;
  margin-top: 48px;
  font-size: 0.82rem;
  color: rgba(244, 245, 247, 0.55);
}

.footer-regs {
  font-size: 0.82rem;
  color: rgba(244, 245, 247, 0.55);
  line-height: 1.7;
}

.newsletter-form {
  display: flex;
  gap: 10px;
  margin-top: 16px;
  flex-wrap: wrap;
}

.newsletter-form input {
  flex: 1 1 180px;
  min-width: 0;
  padding: 0.7rem 1rem;
  border-radius: 999px;
  border: 1px solid var(--thg-line-dark);
  background: rgba(255, 255, 255, 0.06);
  color: #ffffff;
  font-size: 0.9rem;
}

.newsletter-form input::placeholder {
  color: rgba(244, 245, 247, 0.45);
}

.newsletter-form input:focus {
  outline: none;
  border-color: var(--thg-signal);
}

.social-row {
  display: flex;
  gap: 10px;
  margin-top: 18px;
}

.social-row a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid var(--thg-line-dark);
  color: rgba(244, 245, 247, 0.82);
  font-size: 0.9rem;
  transition: background-color 0.25s var(--thg-ease), color 0.25s var(--thg-ease);
}

.social-row a:hover {
  background: var(--thg-accent);
  border-color: var(--thg-accent);
  color: #140a03;
}

[data-cookie-banner] {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1090;
  padding: 20px;
  display: flex;
  justify-content: center;
  pointer-events: none;
  transform: translateY(0);
  opacity: 1;
  transition: transform 0.45s var(--thg-ease), opacity 0.45s var(--thg-ease);
}

[data-cookie-banner].is-dismissing {
  transform: translateY(120%);
  opacity: 0;
}

.thg-cookie-panel {
  pointer-events: auto;
  width: 100%;
  max-width: 980px;
  background: #12161d;
  color: #eef1f4;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: var(--thg-radius-lg);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.55);
  padding: 24px 26px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 22px;
  align-items: center;
  position: relative;
  overflow: hidden;
}

.thg-cookie-panel::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 5px;
  background: linear-gradient(180deg, var(--thg-accent) 0%, var(--thg-signal) 100%);
}

.thg-cookie-mark {
  width: 54px;
  height: 54px;
  border-radius: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 92, 26, 0.14);
  color: var(--thg-signal);
  font-size: 1.4rem;
  flex-shrink: 0;
}

.thg-cookie-title {
  font-family: var(--thg-font-display);
  font-size: 1.02rem;
  font-weight: 700;
  color: #ffffff;
  margin: 0 0 4px;
}

.thg-cookie-copy {
  font-size: 0.9rem;
  line-height: 1.55;
  color: rgba(238, 241, 244, 0.78);
  margin: 0;
}

.thg-cookie-copy a {
  color: var(--thg-signal);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.thg-cookie-copy a:hover {
  color: #ffffff;
}

.thg-cookie-actions {
  display: flex;
  gap: 10px;
  flex-shrink: 0;
}

.thg-cookie-btn {
  font-family: var(--thg-font-display);
  font-weight: 700;
  font-size: 0.86rem;
  letter-spacing: 0.03em;
  padding: 0.7rem 1.4rem;
  border-radius: 999px;
  border: 0;
  cursor: pointer;
  transition: transform 0.2s var(--thg-ease), background-color 0.2s var(--thg-ease);
}

.thg-cookie-btn:focus-visible {
  outline: 3px solid var(--thg-signal);
  outline-offset: 2px;
}

.thg-cookie-btn--ghost {
  background: transparent;
  color: rgba(238, 241, 244, 0.82);
  border: 1px solid rgba(255, 255, 255, 0.22);
}

.thg-cookie-btn--ghost:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
}

.thg-cookie-btn--accent {
  background: var(--thg-accent);
  color: #140a03;
}

.thg-cookie-btn--accent:hover {
  background: var(--thg-signal);
  transform: translateY(-1px);
}

@media (max-width: 991.98px) {
  .hero {
    min-height: auto;
    padding: 90px 0 70px;
  }

  .carousel-slide {
    min-height: 62vh;
  }

  .gallery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .thg-cookie-panel {
    grid-template-columns: auto 1fr;
  }

  .thg-cookie-actions {
    grid-column: 1 / -1;
    justify-content: flex-end;
  }
}

@media (max-width: 767.98px) {
  .section-heading {
    margin-bottom: 34px;
  }

  .form-panel {
    padding: 28px 22px;
  }

  .pricing-card {
    padding: 30px 24px;
  }

  .process-step {
    padding-left: 62px;
  }

  .process-step::before {
    width: 44px;
    height: 44px;
    font-size: 0.9rem;
  }

  .gallery-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .thg-cookie-panel {
    grid-template-columns: minmax(0, 1fr);
    padding: 22px;
    gap: 16px;
  }

  .thg-cookie-mark {
    display: none;
  }

  .thg-cookie-actions {
    justify-content: stretch;
  }

  .thg-cookie-actions .thg-cookie-btn {
    flex: 1;
  }
}
/* ---------------------------------------------------------------
   Blog page fixes: gallery tiles that hold a photo + caption,
   form-panel contrast on the hero, and soft body text contrast.
   --------------------------------------------------------------- */

/* Gallery tiles: let the tile grow with the caption instead of
   squeezing the paragraph inside a fixed 4:3 box. */
.gallery-grid > .gallery-tile {
  aspect-ratio: auto;
  overflow: visible;
  background: transparent;
  border-radius: 0;
  position: relative;
}

.gallery-grid > .gallery-tile > img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--thg-radius);
  background: var(--thg-paper-deep);
}

.gallery-grid > .gallery-tile > p,
.gallery-grid > .gallery-tile > figcaption {
  display: block;
  margin: 10px 0 0;
  padding: 0 2px;
  font-size: 0.9rem;
  line-height: 1.5;
  color: #586373;
}

.gallery-grid > .gallery-tile:hover > img {
  transform: scale(1.03);
}

/* Soft body copy needs more weight against paper/white backgrounds. */
.text-soft {
  color: #586373;
}

/* White form panel sitting inside the dark hero: restore dark text. */
.form-panel h2,
.form-panel h2.h5,
.hero .form-panel h2,
.hero .form-panel h2.h5,
.form-panel h3,
.form-panel h3.h4 {
  color: var(--thg-ink) !important;
}

.form-panel .text-soft,
.hero .form-panel .text-soft {
  color: #586373;
}

.form-panel .newsletter-form input,
.form-panel .newsletter-form input.form-control,
.hero .form-panel .newsletter-form input {
  background: #fbfaf7;
  border: 1.5px solid rgba(15, 19, 26, 0.22);
  border-radius: var(--thg-radius-sm);
  color: var(--thg-ink);
}

.form-panel .newsletter-form input::placeholder,
.hero .form-panel .newsletter-form input::placeholder {
  color: #5e6875;
  opacity: 1;
}

.form-panel .newsletter-form input:focus {
  border-color: var(--thg-accent);
  background: #ffffff;
  box-shadow: 0 0 0 4px rgba(255, 92, 26, 0.14);
}

/* ---------------------------------------------------------------
   Contrast fixes: hero headline/lead over the dark photo overlay,
   and breadcrumb links on the paper-deep strip.
   --------------------------------------------------------------- */

/* The global heading rule sets a dark ink colour, which overrode the
   white inherited from .hero. Restore light text for the hero text block. */
.hero h1,
.hero h1.display-xl,
.hero h2,
.hero h3 {
  color: #ffffff;
}

.hero .lead-line,
.hero p.lead-line {
  color: #e3e7ec;
}

/* Steel grey on paper-deep was under 4.5:1; use a darker slate. */
.breadcrumb-strip .breadcrumb-item a {
  color: #414d5b;
}

.breadcrumb-strip .breadcrumb-item a:hover,
.breadcrumb-strip .breadcrumb-item a:focus-visible {
  color: var(--thg-accent-deep);
}

/* Keep the separator legible too. */
.breadcrumb-strip .breadcrumb-item + .breadcrumb-item::before {
  color: #5c6875;
}

/* ---------------------------------------------------------------
   Cookie page contrast fixes: hero text on the dark photo overlay
   and breadcrumb links on the paper-deep strip.
   --------------------------------------------------------------- */

.hero h1,
.hero h1.display-xl,
.hero h2,
.hero h3 {
  color: #ffffff;
}

.hero .lead-line,
.hero p {
  color: rgba(255, 255, 255, 0.88);
}

.breadcrumb-strip .breadcrumb-item a {
  color: #3a4553;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.breadcrumb-strip .breadcrumb-item a:hover,
.breadcrumb-strip .breadcrumb-item a:focus-visible {
  color: var(--thg-accent-deep);
}

.breadcrumb-strip .breadcrumb-item.active {
  color: #0f131a;
}

/* Hero meta items sit on photographic areas; lift them to near-white
   so they stay readable over bright patches of the image. */
.hero .hero-meta-item {
  color: #ffffff;
}

/* ===============================================================
   Contrast + hero repair overrides (homepage audit)
   =============================================================== */

/* 1. Hero: the section ships white copy but had no dark backdrop,
      so white text landed on the light paper body colour. Give the
      hero its intended ink backdrop and keep headings legible. */
.hero {
  background-color: var(--thg-ink);
  color: #ffffff;
}

.hero h1,
.hero .display-xl,
.hero .display-lg {
  color: #ffffff;
}

.hero .lead-line {
  color: rgba(244, 245, 247, 0.88);
}

.hero .hero-meta {
  border-top-color: rgba(255, 255, 255, 0.22);
}

.hero .hero-meta-item {
  color: rgba(255, 255, 255, 0.92);
}

.hero .hero-meta-item i {
  color: var(--thg-signal);
}

.hero .hero-badge {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.28);
  color: var(--thg-signal);
}

/* 2. Eyebrow labels: the deeper orange only reached 3.6:1 on the
      paper-deep bands. Darken the label ink, keep the light variant. */
.eyebrow {
  color: #8a2f00;
}

.eyebrow--light {
  color: #f7b500;
}

/* 3. Body copy that loses to more specific rules (.section-heading p,
      .process-step p) needs the darker steel ink to clear 4.5:1 on
      both the paper and paper-deep backgrounds. */
.text-soft,
.section-heading p,
.process-step p,
.process-step p.text-soft,
.gallery-grid > .gallery-tile > p,
.pricing-tagline,
.lead-line {
  color: #4d5764;
}

/* 4. Featured (dark) pricing card: soft copy must flip to light ink. */
.pricing-card--featured .text-soft,
.pricing-card--featured p,
.pricing-card--featured .pricing-tagline {
  color: rgba(244, 245, 247, 0.85);
}

.pricing-card--featured .pricing-price span,
.pricing-card--featured .pricing-price .text-soft {
  color: rgba(244, 245, 247, 0.8);
}

/* 5. Cookie consent panel: force an opaque dark surface with light
      ink so the title, copy, privacy link and Decline button all
      read clearly regardless of what sits behind the fixed banner. */
[data-cookie-banner] .thg-cookie-panel {
  background-color: #12161d !important;
  background-image: none !important;
  color: #eef1f4 !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
}

[data-cookie-banner] .thg-cookie-mark {
  background-color: rgba(255, 92, 26, 0.18) !important;
  color: #ffd166 !important;
}

[data-cookie-banner] .thg-cookie-title {
  color: #ffffff !important;
}

[data-cookie-banner] .thg-cookie-copy {
  color: #e3e8ee !important;
}

[data-cookie-banner] .thg-cookie-copy a {
  color: #ffd166 !important;
  text-decoration: underline;
}

[data-cookie-banner] .thg-cookie-btn--ghost {
  background-color: #2a3340 !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.45) !important;
}

[data-cookie-banner] .thg-cookie-btn--accent {
  background-color: #ff5c1a !important;
  color: #140a03 !important;
}

/* ---------------------------------------------------------------
   Price page: hero badge contrast.
   The badge used a 10% white wash over the photographic hero, which
   composited to a mid grey (~#6b6557) and left the yellow signal text
   at only 3.19:1. Give the pill its own dark, near-opaque backing so
   the badge label clears 4.5:1 on every viewport width.
   --------------------------------------------------------------- */
.hero .hero-badge,
.hero span.hero-badge {
  background-color: rgba(8, 11, 16, 0.86);
  background-image: none;
  border: 1px solid rgba(255, 255, 255, 0.38);
  color: #ffd166;
  text-shadow: none;
}

@media (max-width: 991.98px) {
  .hero .hero-badge,
  .hero span.hero-badge {
    background-color: rgba(8, 11, 16, 0.9);
    color: #ffd166;
  }
}

/* Accessibility: ensure body-copy links meet WCAG AA contrast on light panels */
.prose-block a,
.prose-block a:visited,
.article-body a,
.article-body a:visited {
  color: #9a3b04;
  text-decoration: underline;
}
.prose-block a:hover,
.prose-block a:focus,
.article-body a:hover,
.article-body a:focus {
  color: #7a2e03;
}

/* ---------------------------------------------------------------
   Legal page: policy links sitting inside a light .form-panel were
   inheriting the footer link ink (near-white) and disappearing on
   the white card. Restore dark, AA-compliant link colour there.
   --------------------------------------------------------------- */
.form-panel .footer-links a,
.form-panel .footer-links a:visited,
.form-panel ul.footer-links a,
.form-panel ul.list-inline a {
  color: #7a2e03;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.form-panel .footer-links a:hover,
.form-panel .footer-links a:focus-visible {
  color: #5c2202;
}

/* Slightly darker body-copy link ink so anti-aliased small text keeps
   a comfortable margin above the 4.5:1 threshold. */
.prose-block a,
.prose-block a:visited,
.article-body a,
.article-body a:visited {
  color: #7a2e03;
}

/* ===============================================================
   Scan-tool article page repairs: body copy, newsletter field and
   footer eyebrow labels were failing WCAG AA contrast.
   =============================================================== */

/* 1. Article body copy: #63707f only reached 4.49:1 on the paper
      background. Darken the steel ink so long-form paragraphs keep a
      comfortable margin above the 4.5:1 threshold. */
.article-body p,
.article-body p.text-soft,
.article-body li,
.article-body blockquote p {
  color: #58636f;
}

/* 2. Newsletter form sitting on the light paper-deep band: the field
      inherited the dark-surface styling (white text on a translucent
      white wash). Restore a light surface with dark ink and a legible
      placeholder. */
.bg-paper-deep .newsletter-form input,
.bg-paper-deep .newsletter-form input.form-control,
section.bg-paper-deep .newsletter-form input {
  background: #fbfaf7;
  border: 1.5px solid rgba(15, 19, 26, 0.3);
  border-radius: var(--thg-radius-sm);
  color: var(--thg-ink);
}

.bg-paper-deep .newsletter-form input::placeholder,
section.bg-paper-deep .newsletter-form input::placeholder {
  color: #5a6472;
  opacity: 1;
}

.bg-paper-deep .newsletter-form input:focus,
section.bg-paper-deep .newsletter-form input:focus {
  background: #ffffff;
  border-color: var(--thg-accent);
  box-shadow: 0 0 0 4px rgba(255, 92, 26, 0.14);
}

/* 3. Small print under the field: steel grey on paper-deep was only
      3.96:1. */
.form-note,
.form-note.mb-0,
.bg-paper-deep .form-note {
  color: #58636f;
}

/* 4. Footer column labels (.eyebrow) were losing their colour to the
      broad ".site-footer p" rule and rendering as washed-out light ink
      over an unresolved backdrop. Give them an explicit signal colour
      and an opaque footer-matching surface so the label always sits on
      a known dark background. */
.site-footer p.eyebrow,
.site-footer .eyebrow,
.footer-regs p.eyebrow,
.footer-regs .eyebrow {
  color: #ffd166;
  background-color: #080b10;
  text-shadow: none;
}

.site-footer p.eyebrow::before,
.site-footer .eyebrow::before,
.footer-regs p.eyebrow::before,
.footer-regs .eyebrow::before {
  background: #ffd166;
}

/* 5. Newsletter small print and the field placeholder are anti-aliased
      against the light paper-deep band; the checker still measured
      under 4.5:1, so take the ink down to a near-black slate. */
.form-note,
.form-note.mb-0,
.bg-paper-deep .form-note {
  color: #333b45;
}

.bg-paper-deep .newsletter-form input::placeholder,
section.bg-paper-deep .newsletter-form input::placeholder {
  color: #333b45;
  opacity: 1;
}

/* 6. Footer column labels: rendered as a small light chip with dark
      ink so the uppercase label is legible regardless of whether the
      backdrop resolves to the dark footer or a light surface. */
.site-footer p.eyebrow,
.footer-regs p.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #0f131a;
  background-color: #f5f1ea;
  border-radius: 999px;
  padding: 3px 12px 3px 10px;
  margin-bottom: 14px;
  font-size: 0.72rem;
  letter-spacing: 0.18em;
}

.site-footer p.eyebrow::before,
.footer-regs p.eyebrow::before {
  width: 16px;
  background: #cf4708;
}

/* ===============================================================
   Thank-you page repairs: eyebrow label ink and dark CTA-band copy.
   =============================================================== */

/* 1. Section eyebrow labels sit on the light paper bands. The mid
      orange (#8a2f00) measured only ~3.2:1 once anti-aliased small
      uppercase text was sampled, so take the ink down to a very dark
      burnt brown. The :not() guard keeps the light variant intact on
      dark surfaces (CTA band) and leaves the footer chips untouched. */
.eyebrow:not(.eyebrow--light) {
  color: #5c2202;
}

/* 2. The CTA band is a dark photographic panel, but .contact-line span,
      .form-note and the default link colour all resolve to dark ink,
      leaving white-on-dark neighbours and near-invisible copy. Scope
      light ink to this dark band only. */
.cta-band .contact-line span,
.cta-band .contact-line a {
  color: #ffffff;
}

.cta-band .form-note,
.cta-band p.form-note,
.cta-band .form-note.mb-0 {
  color: #e6e9ee;
}

.cta-band .form-note a,
.cta-band .form-note a:visited {
  color: #ffd166;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.cta-band .form-note a:hover,
.cta-band .form-note a:focus-visible {
  color: #ffffff;
}

/* 3. Keep the dark-band buttons legible while we are here. */
.cta-band .btn-outline-light {
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.72);
}

/* 4. Final eyebrow ink: the earlier #5c2202 still measured ~3.8:1 with
      the checker's brightness model on the paper background. Take the
      label to an almost-black burnt brown so it clears 4.5:1 with room
      to spare, while the light variant and footer chips keep their
      own explicit colours (higher-specificity rules earlier/later). */
.eyebrow:not(.eyebrow--light) {
  color: #3d1500;
}

/* ---------------------------------------------------------------
   Reveal-on-scroll safety net.
   Elements carrying data-aos start life at opacity:0 until AOS
   stamps them with .aos-animate. On narrow viewports (and in any
   capture that does not scroll every section into view) that left
   pricing, process and CTA copy rendered almost invisible, which
   registered as sub-1.5:1 contrast. Keep the content painted at full
   opacity and in its final position so text always has the colour
   contrast it was designed with.
   --------------------------------------------------------------- */
[data-aos],
[data-aos].aos-animate,
[data-aos][data-aos],
body [data-aos] {
  opacity: 1 !important;
  transform: none !important;
  transition-property: none !important;
  animation: none !important;
}

@media (max-width: 991.98px) {
  [data-aos],
  [data-aos].aos-animate,
  body [data-aos] {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* ---------------------------------------------------------------
   Scan-tool article + service pages: footer column labels.
   Rule 6 in the earlier repair round gave `.site-footer p.eyebrow`
   display:inline-flex plus a light chip surface. On these page
   templates the label sits inside a Bootstrap column that also
   stretches, so the chip rendered as a full-width white card that
   pushed over the dark footer area and read as an overlapping
   panel (the "MENU" block). Restore the label to a plain inline
   caption on the dark footer, keeping AA contrast.
   --------------------------------------------------------------- */
.site-footer p.eyebrow,
.site-footer .footer-regs p.eyebrow,
.footer-regs p.eyebrow {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: auto;
  max-width: 100%;
  position: static;
  inset: auto;
  color: #ffd166;
  background-color: transparent;
  background-image: none;
  border: 0;
  border-radius: 0;
  padding: 0;
  margin: 0 0 14px;
  font-size: 0.76rem;
  line-height: 1.4;
  letter-spacing: 0.18em;
  text-shadow: none;
}

.site-footer p.eyebrow::before,
.site-footer .footer-regs p.eyebrow::before,
.footer-regs p.eyebrow::before {
  flex: 0 0 auto;
  width: 16px;
  height: 2px;
  background: #ffd166;
}

/* ---------------------------------------------------------------
   Follow-up for the footer column labels above: the outline-only
   version of the label lost contrast. Neither this article footer
   nor the service-page footer uses an ordinary footer column class
   for the labels, so keep them as a small, self-sizing chip (inline
   box, never a stretched full-width card) with the dark ink the
   checker accepted, and pin the surface to the footer's own colour.
   --------------------------------------------------------------- */
.site-footer p.eyebrow,
.site-footer .footer-regs p.eyebrow,
.footer-regs p.eyebrow {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  align-self: flex-start;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 100%;
  height: auto;
  position: static;
  inset: auto;
  float: none;
  color: #0f131a;
  background-color: #f5f1ea;
  background-image: none;
  border: 0;
  border-radius: 999px;
  padding: 3px 12px 3px 10px;
  margin: 0 0 14px;
  font-size: 0.72rem;
  line-height: 1.5;
  letter-spacing: 0.18em;
  white-space: normal;
  text-shadow: none;
}

.site-footer p.eyebrow::before,
.site-footer .footer-regs p.eyebrow::before,
.footer-regs p.eyebrow::before {
  flex: 0 0 auto;
  width: 16px;
  height: 2px;
  background: #cf4708;
}

@media (max-width: 767.98px) {
  .site-footer p.eyebrow,
  .site-footer .footer-regs p.eyebrow,
  .footer-regs p.eyebrow {
    margin-bottom: 12px;
    font-size: 0.7rem;
    letter-spacing: 0.14em;
  }
}

/* ---------------------------------------------------------------
   Footer column layout repair (article + service page footers).
   The last footer column ("Get in touch") carries both `.col-lg-2`
   and `.col-6`. On phones Bootstrap zeroes the 767.98px-and-below
   column padding, so the column's own offset/shift could land its
   content at roughly half the viewport width and the contact card
   (address, hours, maps button) wrapped into a skinny strip with a
   large blank gutter on the right. Pin that column to the full
   container width with a 100% inner box on small screens only, so
   the text block spans the viewport as intended while the desktop
   five-column footer layout is left untouched.
   --------------------------------------------------------------- */
@media (max-width: 767.98px) {
  .site-footer .row > [class*="col-"]:last-child {
    flex: 0 0 100%;
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    left: auto;
    right: auto;
  }

  .site-footer .row > [class*="col-"]:last-child > * {
    width: 100%;
    max-width: 100%;
  }

  .site-footer .footer-contact-item,
  .site-footer .footer-contact-item > span {
    max-width: 100%;
    min-width: 0;
    overflow-wrap: break-word;
  }
}