/* TTSL public-site brand treatment: derived from the maroon, gold and slate logo colours. */
:root {
  --ttsl-brand-wine: #7a1216;
  --ttsl-brand-wine-deep: #4a0b0e;
  --ttsl-brand-gold: #f2b705;
  --ttsl-brand-slate: #59636b;
  --ttsl-brand-rose-wash: #fcf4f4;
  --ttsl-brand-gold-wash: #fff9e8;
  --ttsl-brand-slate-wash: #f3f6f7;
  --ttsl-brand-line: rgba(122, 18, 22, .14);
}

/* Only public pages use this treatment; the separate admin area is intentionally unaffected. */
body:has(.ttsl-page) {
  background: linear-gradient(180deg, #fff 0, var(--ttsl-brand-slate-wash) 42%, #fff 100%);
}

.ttsl-page {
  background: linear-gradient(180deg, rgba(122, 18, 22, .025), transparent 420px);
}

.ttsl-page main > .section-pad:not(.cta-full) {
  position: relative;
  background: linear-gradient(135deg, rgba(255, 255, 255, .96), var(--ttsl-brand-rose-wash));
  border-top: 1px solid rgba(122, 18, 22, .07);
  border-bottom: 1px solid rgba(122, 18, 22, .05);
}

.ttsl-page main > .section-pad:nth-of-type(even):not(.cta-full),
.ttsl-page .bg-light-section {
  background: linear-gradient(135deg, var(--ttsl-brand-slate-wash), var(--ttsl-brand-gold-wash)) !important;
}

.ttsl-page .section-title,
.ttsl-page h2:not(.modal-title),
.ttsl-page h3 {
  color: var(--ttsl-brand-wine-deep);
}

.ttsl-page .section-title::after,
.ttsl-page .title-underline,
.ttsl-page .section-kicker::before {
  background: linear-gradient(90deg, var(--ttsl-brand-wine), var(--ttsl-brand-gold));
}

.ttsl-page .ttsl-card,
.ttsl-page .service-card,
.ttsl-page .product-card,
.ttsl-page .img-card,
.ttsl-page .team-card,
.ttsl-page .info-card {
  border-color: var(--ttsl-brand-line);
  box-shadow: 0 12px 30px rgba(74, 11, 14, .08);
}

.ttsl-page .ttsl-card:hover,
.ttsl-page .service-card:hover,
.ttsl-page .product-card:hover,
.ttsl-page .img-card:hover,
.ttsl-page .team-card:hover {
  border-color: rgba(242, 183, 5, .7);
  box-shadow: 0 16px 34px rgba(74, 11, 14, .14);
}

.ttsl-page .btn-primary,
.ttsl-page .btn-brand,
.ttsl-page .btn-ttsl {
  background: linear-gradient(120deg, var(--ttsl-brand-wine-deep), var(--ttsl-brand-wine));
  border-color: var(--ttsl-brand-wine);
}

.ttsl-page .btn-primary:hover,
.ttsl-page .btn-brand:hover,
.ttsl-page .btn-ttsl:hover {
  background: linear-gradient(120deg, var(--ttsl-brand-wine), #a51d22);
  border-color: var(--ttsl-brand-gold);
}

.ttsl-page .icon-circle,
.ttsl-page .feature-icon,
.ttsl-page .card-icon {
  background: var(--ttsl-brand-gold-wash);
  color: var(--ttsl-brand-wine);
  border: 1px solid rgba(242, 183, 5, .28);
}

.ttsl-page .breadcrumb-wrap,
.ttsl-page .breadcrumb-bar {
  background: linear-gradient(90deg, var(--ttsl-brand-rose-wash), var(--ttsl-brand-gold-wash));
  border-bottom-color: var(--ttsl-brand-line);
}

@media (max-width: 767.98px) {
  .ttsl-page main > .section-pad:not(.cta-full) { background: var(--ttsl-brand-rose-wash); }
  .ttsl-page main > .section-pad:nth-of-type(even):not(.cta-full),
  .ttsl-page .bg-light-section { background: var(--ttsl-brand-slate-wash) !important; }
}
