:root {
  --vrin-ink: #1a1512;
  --vrin-ink-soft: #2c2320;
  --vrin-cream: #f8f2eb;
  --vrin-sand: #ece0d3;
  --vrin-rose: #b8705e;
  --vrin-rose-deep: #8f4f40;
  --vrin-rose-dark: #7a4235;
  --vrin-gold: #b78b45;
  --vrin-white: #ffffff;
  --vrin-line: rgba(26, 21, 18, 0.12);
  --vrin-line-soft: rgba(26, 21, 18, 0.22);
  --vrin-radius: 18px;
  --vrin-radius-lg: 28px;
  --vrin-shadow: 0 24px 60px -28px rgba(26, 21, 18, 0.45);
  --vrin-shadow-soft: 0 14px 34px -22px rgba(26, 21, 18, 0.5);
  --vrin-font-display: "Playfair Display", Georgia, "Times New Roman", serif;
  --vrin-font-body: "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --vrin-container: 1180px;
}

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

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: var(--vrin-font-body);
  font-size: 1.0625rem;
  line-height: 1.7;
  color: var(--vrin-ink);
  background-color: var(--vrin-cream);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1,
h2,
h3,
h4,
h5 {
  font-family: var(--vrin-font-display);
  font-weight: 600;
  line-height: 1.16;
  letter-spacing: -0.012em;
  color: var(--vrin-ink);
  margin: 0 0 0.85rem;
}

h1 {
  font-size: clamp(2.25rem, 4.6vw, 3.6rem);
}

h2 {
  font-size: clamp(1.85rem, 3.4vw, 2.75rem);
}

h3 {
  font-size: clamp(1.3rem, 2vw, 1.6rem);
}

p {
  margin: 0 0 1rem;
}

a {
  color: var(--vrin-rose-deep);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

a:hover {
  color: var(--vrin-rose-dark);
}

img {
  max-width: 100%;
}

.vrin-container {
  width: 100%;
  max-width: var(--vrin-container);
  margin-inline: auto;
  padding-inline: 1.25rem;
}

.vrin-section {
  position: relative;
  padding: 6rem 0;
}

.vrin-section--tight {
  padding: 4rem 0;
}

.vrin-section--cream {
  background-color: var(--vrin-cream);
}

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

.vrin-section--white {
  background-color: var(--vrin-white);
}

.vrin-section--dark {
  background-color: var(--vrin-ink);
  color: #f2e9e0;
}

.vrin-section--dark h1,
.vrin-section--dark h2,
.vrin-section--dark h3,
.vrin-section--dark h4 {
  color: var(--vrin-white);
}

.vrin-section--dark p {
  color: #e3d8cd;
}

.vrin-section--photo {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  color: var(--vrin-white);
}

.vrin-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  margin-bottom: 1rem;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--vrin-rose-deep);
}

.vrin-eyebrow::before {
  content: "";
  width: 34px;
  height: 1px;
  background-color: currentColor;
  opacity: 0.75;
}

.vrin-section--dark .vrin-eyebrow,
.vrin-section--photo .vrin-eyebrow {
  color: #eab9a7;
}

.vrin-lead {
  font-size: 1.125rem;
  line-height: 1.75;
  color: var(--vrin-ink-soft);
  max-width: 46rem;
}

.vrin-section--dark .vrin-lead,
.vrin-section--photo .vrin-lead {
  color: #e3d8cd;
}

.vrin-rule {
  width: 72px;
  height: 2px;
  border: 0;
  margin: 1.5rem 0;
  background-color: var(--vrin-rose);
  opacity: 1;
}

.vrin-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  padding: 1rem 2rem;
  border: 1px solid transparent;
  border-radius: 999px;
  font-family: var(--vrin-font-body);
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  transition: transform 0.25s ease, background-color 0.25s ease, color 0.25s ease, box-shadow 0.25s ease;
}

.vrin-btn--primary {
  background-color: var(--vrin-rose-deep);
  color: var(--vrin-white);
  box-shadow: 0 18px 34px -20px rgba(143, 79, 64, 0.95);
}

.vrin-btn--primary:hover,
.vrin-btn--primary:focus-visible {
  background-color: var(--vrin-rose-dark);
  color: var(--vrin-white);
  transform: translateY(-2px);
}

.vrin-btn--ghost {
  background-color: transparent;
  color: var(--vrin-ink);
  border-color: var(--vrin-line-soft);
}

.vrin-btn--ghost:hover,
.vrin-btn--ghost:focus-visible {
  background-color: var(--vrin-ink);
  color: var(--vrin-white);
  border-color: var(--vrin-ink);
}

.vrin-btn--light {
  background-color: var(--vrin-white);
  color: var(--vrin-ink);
}

.vrin-btn--light:hover,
.vrin-btn--light:focus-visible {
  background-color: var(--vrin-sand);
  color: var(--vrin-ink);
}

.vrin-btn--outline-light {
  background-color: transparent;
  color: var(--vrin-white);
  border-color: rgba(255, 255, 255, 0.65);
}

.vrin-btn--outline-light:hover,
.vrin-btn--outline-light:focus-visible {
  background-color: var(--vrin-white);
  color: var(--vrin-ink);
}

.vrin-btn__icon {
  font-size: 0.85em;
}

.vrin-topbar {
  background-color: var(--vrin-ink);
  color: #e7dcd1;
  font-size: 0.8125rem;
  letter-spacing: 0.04em;
}

.vrin-topbar__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.6rem 0;
}

.vrin-topbar__group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.5rem;
}

.vrin-topbar__item {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #e7dcd1;
  text-decoration: none;
}

.vrin-topbar__item:hover {
  color: var(--vrin-white);
}

.vrin-topbar__item i {
  color: var(--vrin-rose);
}

.vrin-header {
  position: sticky;
  top: 0;
  z-index: 1030;
  background-color: rgba(248, 242, 235, 0.94);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--vrin-line);
  transition: box-shadow 0.25s ease;
}

.vrin-header--stuck {
  box-shadow: 0 16px 36px -28px rgba(26, 21, 18, 0.75);
}

.vrin-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  padding: 1rem 0;
}

.vrin-brand {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  text-decoration: none;
}

.vrin-brand__text {
  display: flex;
  flex-direction: column;
  line-height: 1.1;
}

.vrin-brand__name {
  font-family: var(--vrin-font-display);
  font-size: 1.35rem;
  letter-spacing: 0.06em;
  color: var(--vrin-ink);
}

.vrin-brand__tagline {
  font-size: 0.65rem;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--vrin-rose-deep);
}

.vrin-nav {
  display: flex;
  align-items: center;
  gap: 1.9rem;
}

.vrin-nav__link {
  position: relative;
  padding: 0.35rem 0;
  font-size: 0.9rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  color: var(--vrin-ink);
  text-decoration: none;
}

.vrin-nav__link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 0;
  height: 1.5px;
  background-color: var(--vrin-rose-deep);
  transition: width 0.25s ease;
}

.vrin-nav__link:hover::after,
.vrin-nav__link:focus-visible::after,
.vrin-nav__link.is-active::after {
  width: 100%;
}

.vrin-nav__link:hover {
  color: var(--vrin-rose-deep);
}

.vrin-nav-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: 1px solid var(--vrin-line-soft);
  background-color: transparent;
  color: var(--vrin-ink);
  font-size: 1.05rem;
}

.vrin-offcanvas {
  background-color: var(--vrin-cream);
}

.vrin-offcanvas__link {
  display: block;
  padding: 0.85rem 0;
  border-bottom: 1px solid var(--vrin-line);
  font-family: var(--vrin-font-display);
  font-size: 1.15rem;
  color: var(--vrin-ink);
  text-decoration: none;
}

.vrin-hero {
  position: relative;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  color: var(--vrin-white);
}

.vrin-hero .carousel-item {
  min-height: 86vh;
  align-items: center;
}

.vrin-hero__inner {
  display: flex;
  align-items: center;
  min-height: 86vh;
  padding: 7rem 0 5rem;
}

.vrin-hero__content {
  max-width: 44rem;
}

.vrin-hero__title {
  color: var(--vrin-white);
  font-size: clamp(2.4rem, 5.2vw, 4.2rem);
  margin-bottom: 1.25rem;
}

.vrin-hero__text {
  max-width: 36rem;
  margin-bottom: 2rem;
  font-size: 1.125rem;
  color: #f2e9e0;
}

.vrin-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.9rem;
}

.vrin-hero__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 2.25rem;
  margin-top: 3rem;
  padding-top: 1.75rem;
  border-top: 1px solid rgba(255, 255, 255, 0.25);
}

.vrin-hero__meta-item {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  font-size: 0.85rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #e8ddd2;
}

.vrin-hero__meta-item strong {
  font-family: var(--vrin-font-display);
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: var(--vrin-white);
}

.vrin-hero .carousel-indicators {
  bottom: 2rem;
  gap: 0.6rem;
  margin-inline: auto;
}

.vrin-hero .carousel-indicators [data-bs-target] {
  width: 34px;
  height: 3px;
  border: 0;
  border-radius: 999px;
  background-color: rgba(255, 255, 255, 0.45);
  opacity: 1;
}

.vrin-hero .carousel-indicators .active {
  background-color: var(--vrin-white);
}

.vrin-hero .carousel-control-prev,
.vrin-hero .carousel-control-next {
  width: 4rem;
  opacity: 0.55;
}

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

.vrin-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  background-color: var(--vrin-white);
  border: 1px solid var(--vrin-line);
  border-radius: var(--vrin-radius-lg);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

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

.vrin-card__media {
  overflow: hidden;
  background-color: var(--vrin-sand);
  aspect-ratio: 4 / 3;
}

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

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

.vrin-card__body {
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 0.85rem;
  padding: 1.85rem;
}

.vrin-card__title {
  margin: 0;
  font-size: 1.35rem;
}

.vrin-card__text {
  flex: 1;
  margin: 0;
  font-size: 0.98rem;
  color: var(--vrin-ink-soft);
}

.vrin-card__link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--vrin-rose-deep);
  text-decoration: none;
}

.vrin-card__link:hover {
  color: var(--vrin-rose-dark);
}

.vrin-stat {
  padding: 1.75rem 1rem;
  text-align: center;
  border: 1px solid var(--vrin-line);
  border-radius: var(--vrin-radius);
  background-color: var(--vrin-white);
  height: 100%;
}

.vrin-section--dark .vrin-stat,
.vrin-section--photo .vrin-stat {
  background-color: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.18);
}

.vrin-stat__num {
  display: block;
  font-family: var(--vrin-font-display);
  font-size: clamp(2.2rem, 4vw, 3rem);
  line-height: 1;
  color: var(--vrin-rose-deep);
}

.vrin-section--dark .vrin-stat__num,
.vrin-section--photo .vrin-stat__num {
  color: #f0c3b1;
}

.vrin-stat__label {
  display: block;
  margin-top: 0.6rem;
  font-size: 0.82rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--vrin-ink-soft);
}

.vrin-section--dark .vrin-stat__label,
.vrin-section--photo .vrin-stat__label {
  color: #e3d8cd;
}

.vrin-steps {
  display: grid;
  gap: 1.4rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.vrin-step {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1.25rem;
  padding: 1.5rem;
  border: 1px solid var(--vrin-line);
  border-radius: var(--vrin-radius);
  background-color: var(--vrin-white);
}

.vrin-step__index {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background-color: var(--vrin-rose-deep);
  color: var(--vrin-white);
  font-family: var(--vrin-font-display);
  font-size: 1.15rem;
}

.vrin-step__title {
  margin: 0 0 0.35rem;
  font-size: 1.15rem;
}

.vrin-step__text {
  margin: 0;
  font-size: 0.97rem;
  color: var(--vrin-ink-soft);
}

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

.vrin-gallery__item {
  position: relative;
  overflow: hidden;
  border-radius: var(--vrin-radius);
  background-color: var(--vrin-sand);
}

.vrin-gallery__item img {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  transition: transform 0.65s ease;
}

.vrin-gallery__item:hover img {
  transform: scale(1.06);
}

.vrin-gallery__caption {
  position: absolute;
  inset: auto 0 0 0;
  padding: 1.6rem 1.1rem 1rem;
  background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.78));
  color: var(--vrin-white);
  font-size: 0.88rem;
  letter-spacing: 0.03em;
}

.vrin-price {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  height: 100%;
  padding: 2rem;
  border: 1px solid var(--vrin-line);
  border-radius: var(--vrin-radius-lg);
  background-color: var(--vrin-white);
}

.vrin-price--featured {
  background-color: var(--vrin-ink);
  border-color: var(--vrin-ink);
  color: #ede3d9;
}

.vrin-price--featured h3,
.vrin-price--featured .vrin-price__amount {
  color: var(--vrin-white);
}

.vrin-price__amount {
  font-family: var(--vrin-font-display);
  font-size: 2.4rem;
  line-height: 1;
  color: var(--vrin-ink);
}

.vrin-price__note {
  font-size: 0.85rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--vrin-rose-deep);
}

.vrin-price--featured .vrin-price__note {
  color: #f0c3b1;
}

.vrin-price__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.65rem;
  font-size: 0.96rem;
}

.vrin-price__list li {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.6rem;
}

.vrin-price__list i {
  color: var(--vrin-rose);
  margin-top: 0.35rem;
  font-size: 0.75rem;
}

.vrin-price--featured .vrin-price__list i {
  color: #f0c3b1;
}

.vrin-quotes {
  position: relative;
}

.vrin-quote {
  display: none;
  margin: 0;
  padding: 2.5rem;
  border-radius: var(--vrin-radius-lg);
  background-color: var(--vrin-white);
  border: 1px solid var(--vrin-line);
}

.vrin-quote.is-active {
  display: block;
  animation: vrin-fade 0.45s ease both;
}

.vrin-quote__text {
  font-family: var(--vrin-font-display);
  font-size: clamp(1.2rem, 2vw, 1.45rem);
  line-height: 1.6;
  color: var(--vrin-ink);
}

.vrin-quote__author {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  margin-top: 1.5rem;
}

.vrin-quote__avatar {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  object-fit: cover;
  background-color: var(--vrin-sand);
}

.vrin-quote__name {
  display: block;
  font-weight: 700;
  color: var(--vrin-ink);
}

.vrin-quote__role {
  display: block;
  font-size: 0.85rem;
  color: var(--vrin-ink-soft);
}

.vrin-quote__dots {
  display: flex;
  gap: 0.5rem;
  margin-top: 1.5rem;
}

.vrin-quote__dot {
  width: 34px;
  height: 4px;
  border: 0;
  border-radius: 999px;
  background-color: rgba(26, 21, 18, 0.22);
  transition: background-color 0.25s ease;
}

.vrin-quote__dot.is-active {
  background-color: var(--vrin-rose-deep);
}

.vrin-team {
  text-align: center;
}

.vrin-team__photo {
  overflow: hidden;
  border-radius: var(--vrin-radius-lg);
  background-color: var(--vrin-sand);
  aspect-ratio: 3 / 4;
  margin-bottom: 1.1rem;
}

.vrin-team__photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.vrin-team__name {
  margin: 0;
  font-size: 1.2rem;
}

.vrin-team__role {
  font-size: 0.82rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--vrin-rose-deep);
}

.vrin-faq .accordion-item {
  margin-bottom: 1rem;
  border: 1px solid var(--vrin-line);
  border-radius: var(--vrin-radius);
  background-color: var(--vrin-white);
  overflow: hidden;
}

.vrin-faq .accordion-button {
  padding: 1.35rem 1.5rem;
  font-family: var(--vrin-font-display);
  font-size: 1.1rem;
  color: var(--vrin-ink);
  background-color: var(--vrin-white);
  box-shadow: none;
}

.vrin-faq .accordion-button:not(.collapsed) {
  color: var(--vrin-rose-deep);
  background-color: var(--vrin-sand);
}

.vrin-faq .accordion-button:focus {
  box-shadow: 0 0 0 3px rgba(184, 112, 94, 0.35);
}

.vrin-faq .accordion-body {
  padding: 1.25rem 1.5rem 1.5rem;
  font-size: 0.98rem;
  color: var(--vrin-ink-soft);
}

.vrin-form {
  padding: 2.25rem;
  border: 1px solid var(--vrin-line);
  border-radius: var(--vrin-radius-lg);
  background-color: var(--vrin-white);
  box-shadow: var(--vrin-shadow-soft);
}

.vrin-field {
  display: block;
  margin-bottom: 1.15rem;
}

.vrin-field__label {
  display: block;
  margin-bottom: 0.45rem;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--vrin-ink-soft);
}

.vrin-field input,
.vrin-field select,
.vrin-field textarea {
  width: 100%;
  padding: 0.9rem 1rem;
  border: 1px solid var(--vrin-line-soft);
  border-radius: 12px;
  background-color: #fdfaf6;
  color: var(--vrin-ink);
  font-family: inherit;
  font-size: 1rem;
  line-height: 1.5;
}

.vrin-field textarea {
  min-height: 130px;
  resize: vertical;
}

.vrin-field input:focus,
.vrin-field select:focus,
.vrin-field textarea:focus {
  outline: none;
  border-color: var(--vrin-rose-deep);
  box-shadow: 0 0 0 3px rgba(184, 112, 94, 0.28);
  background-color: var(--vrin-white);
}

.vrin-field input.is-invalid,
.vrin-field select.is-invalid,
.vrin-field textarea.is-invalid {
  border-color: #a3341f;
  background-color: #fdf1ee;
}

.vrin-field__error {
  display: block;
  margin-top: 0.4rem;
  font-size: 0.85rem;
  font-weight: 600;
  color: #8e2c19;
}

.vrin-form__note {
  margin-top: 0.9rem;
  font-size: 0.85rem;
  color: var(--vrin-ink-soft);
}

.vrin-contact-info {
  display: grid;
  gap: 1rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.vrin-contact-info__item {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1rem;
  align-items: start;
  padding: 1.15rem 1.25rem;
  border: 1px solid var(--vrin-line);
  border-radius: var(--vrin-radius);
  background-color: var(--vrin-white);
}

.vrin-contact-info__icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background-color: var(--vrin-sand);
  color: var(--vrin-rose-deep);
}

.vrin-contact-info__label {
  display: block;
  font-size: 0.78rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--vrin-ink-soft);
}

.vrin-contact-info__value {
  display: block;
  font-size: 1rem;
  color: var(--vrin-ink);
}

.vrin-map {
  overflow: hidden;
  border-radius: var(--vrin-radius-lg);
  border: 1px solid var(--vrin-line);
  line-height: 0;
}

.vrin-map iframe {
  display: block;
  width: 100%;
  height: 420px;
  border: 0;
}

.vrin-footer {
  padding: 4.5rem 0 2rem;
  background-color: var(--vrin-ink);
  color: #ddd1c6;
}

.vrin-footer a {
  color: #ddd1c6;
  text-decoration: none;
}

.vrin-footer a:hover {
  color: var(--vrin-white);
}

.vrin-footer__title {
  margin-bottom: 1.1rem;
  font-family: var(--vrin-font-body);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--vrin-white);
}

.vrin-footer__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.6rem;
  font-size: 0.95rem;
}

.vrin-footer__text {
  font-size: 0.95rem;
  color: #cdc0b4;
}

.vrin-footer__social {
  display: flex;
  gap: 0.6rem;
  margin-top: 1.25rem;
}

.vrin-footer__social a {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.24);
  color: #f0e6dc;
}

.vrin-footer__social a:hover {
  background-color: var(--vrin-rose-deep);
  border-color: var(--vrin-rose-deep);
  color: var(--vrin-white);
}

.vrin-footer__bottom {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.5rem;
  align-items: center;
  justify-content: space-between;
  margin-top: 3rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
  font-size: 0.85rem;
  color: #b7aa9f;
}

.vrin-cookie {
  position: fixed;
  left: 1.5rem;
  bottom: 1.5rem;
  z-index: 1080;
  width: min(420px, calc(100vw - 3rem));
  transition: opacity 0.4s ease, transform 0.4s ease;
}

.vrin-cookie--hidden {
  opacity: 0;
  transform: translateY(24px);
  pointer-events: none;
}

.vrin-cookie__panel {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1rem;
  padding: 1.5rem;
  border-radius: 22px;
  background-color: #fffaf4;
  border: 1px solid rgba(26, 21, 18, 0.14);
  box-shadow: 0 30px 70px -30px rgba(26, 21, 18, 0.8);
}

.vrin-cookie__panel::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  border-radius: 22px 0 0 22px;
  background-color: var(--vrin-rose-deep);
}

.vrin-cookie__badge {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background-color: var(--vrin-sand);
  color: var(--vrin-rose-deep);
  font-size: 1.05rem;
}

.vrin-cookie__title {
  margin: 0 0 0.4rem;
  font-family: var(--vrin-font-display);
  font-size: 1.2rem;
  color: var(--vrin-ink);
}

.vrin-cookie__text {
  margin: 0 0 1.1rem;
  font-size: 0.9rem;
  line-height: 1.65;
  color: #40352f;
}

.vrin-cookie__link {
  color: var(--vrin-rose-dark);
  font-weight: 700;
  text-decoration: underline;
}

.vrin-cookie__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}

.vrin-cookie__btn {
  flex: 1 1 auto;
  padding: 0.7rem 1.1rem;
  border-radius: 999px;
  border: 1px solid transparent;
  font-family: var(--vrin-font-body);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background-color 0.22s ease, color 0.22s ease, border-color 0.22s ease;
}

.vrin-cookie__btn--accept {
  background-color: var(--vrin-rose-deep);
  color: var(--vrin-white);
}

.vrin-cookie__btn--accept:hover,
.vrin-cookie__btn--accept:focus-visible {
  background-color: var(--vrin-rose-dark);
}

.vrin-cookie__btn--decline {
  background-color: transparent;
  border-color: rgba(26, 21, 18, 0.3);
  color: var(--vrin-ink);
}

.vrin-cookie__btn--decline:hover,
.vrin-cookie__btn--decline:focus-visible {
  background-color: var(--vrin-ink);
  border-color: var(--vrin-ink);
  color: var(--vrin-white);
}

.vrin-back-top {
  position: fixed;
  right: 1.5rem;
  bottom: 1.5rem;
  z-index: 1040;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border: 0;
  border-radius: 50%;
  background-color: var(--vrin-ink);
  color: var(--vrin-white);
  font-size: 0.95rem;
  opacity: 0;
  visibility: hidden;
  transform: translateY(14px);
  transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s ease;
}

.vrin-back-top.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.vrin-back-top:hover {
  background-color: var(--vrin-rose-deep);
}

.vrin-divider {
  height: 1px;
  border: 0;
  margin: 0;
  background-color: var(--vrin-line);
}

.vrin-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.35rem 0.85rem;
  border-radius: 999px;
  background-color: var(--vrin-sand);
  color: var(--vrin-rose-deep);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

@keyframes vrin-fade {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 991.98px) {
  .vrin-section {
    padding: 4.5rem 0;
  }

  .vrin-hero__inner,
  .vrin-hero .carousel-item {
    min-height: 74vh;
  }

  .vrin-hero__meta {
    gap: 1.5rem;
  }

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

  .vrin-map iframe {
    height: 340px;
  }
}

@media (max-width: 767.98px) {
  body {
    font-size: 1rem;
  }

  .vrin-form {
    padding: 1.5rem;
  }

  .vrin-quote {
    padding: 1.75rem;
  }

  .vrin-cookie {
    left: 1rem;
    right: 1rem;
    bottom: 1rem;
    width: auto;
  }

  .vrin-back-top {
    right: 1rem;
    bottom: 1.25rem;
  }
}

@media (max-width: 575.98px) {
  .vrin-gallery {
    grid-template-columns: 1fr;
  }

  .vrin-hero__actions .vrin-btn {
    width: 100%;
  }

  .vrin-step {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}

/* QA_GRID_COLUMN_FIX .vrin-gallery.row */
.vrin-gallery.row{--bs-gutter-x:0;--bs-gutter-y:0;margin-left:0;margin-right:0}
.vrin-gallery.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_STEP_CARD_GRID_FIX .vrin-steps:has(> .vrin-step) */
@media(min-width:992px){.vrin-steps:has(> .vrin-step){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem}.vrin-steps:has(> .vrin-step)>:not(.vrin-step){grid-column:1/-1}.vrin-steps:has(> .vrin-step)>.vrin-step{width:100%;max-width:100%;min-width:0}}

/* QA_CONTRAST_FIX_HEADER_TOPBAR_EMAIL
   The topbar e-mail link inherits the global link colour (deep rose) on the dark
   ink topbar, which fails contrast. Give it the topbar text colour instead. */
.vrin-topbar a,
.vrin-topbar a:visited {
  color: #e7dcd1;
  text-decoration: none;
}

.vrin-topbar a:hover,
.vrin-topbar a:focus-visible {
  color: #ffffff;
  text-decoration: underline;
}

/* QA_CONTRAST_FIX_FOOTER_BRAND
   The footer re-uses .vrin-brand, whose name/tagline colours are designed for the
   light header. On the dark footer the name was ink-on-ink and the tagline sat at
   ~2.9:1. Re-colour both for the dark background. */
.vrin-footer .vrin-brand__name {
  color: #f8f2eb;
}

.vrin-footer .vrin-brand__tagline {
  color: #eab9a7;
}

/* QA_CONTRAST_FIX_FOOTER_CONTACT_LINKS
   Footer contact cards are white panels, but the footer-wide link colour is light
   cream, so e-mail / Viber / WhatsApp links inside them were near invisible.
   Darken links inside the contact cards and keep a clear hover state. */
.vrin-footer .vrin-contact-info__item a,
.vrin-footer .vrin-contact-info__item a:visited {
  color: #1a1512;
  text-decoration: none;
}

.vrin-footer .vrin-contact-info__item a:hover,
.vrin-footer .vrin-contact-info__item a:focus-visible {
  color: #7a4235;
  text-decoration: underline;
}

.vrin-footer .vrin-contact-info__item a[data-messenger] {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-right: 0.75rem;
  font-weight: 700;
}

.vrin-footer .vrin-contact-info__item a[data-messenger] i {
  color: #8f4f40;
}

/* QA_CONTRAST_FIX_DARK_SECTION_EMAIL_LINKS
   Inline e-mail links inside dark/photo hero sections inherited the global
   deep-rose link colour, which sits at ~3.2:1 on the dark ink background.
   Scope a light link colour to links inside <main> only, so footer and
   white-card links keep their existing treatment. */
main .vrin-section--dark a:not(.vrin-btn),
main .vrin-section--photo a:not(.vrin-btn),
main .vrin-section--dark a:not(.vrin-btn):visited,
main .vrin-section--photo a:not(.vrin-btn):visited {
  color: #f0c3b1;
  text-decoration: underline;
}

main .vrin-section--dark a:not(.vrin-btn):hover,
main .vrin-section--dark a:not(.vrin-btn):focus-visible,
main .vrin-section--photo a:not(.vrin-btn):hover,
main .vrin-section--photo a:not(.vrin-btn):focus-visible {
  color: #ffffff;
}

/* QA_CONTRAST_FIX_OUTLINE_LIGHT_ON_CREAM
   .vrin-btn--outline-light is built for dark backgrounds (white text). On the
   light cream CTA section it rendered white-on-cream at ~1.1:1. Switch it to an
   ink outline/text treatment whenever it sits on a cream or sand surface. */
.vrin-section--cream .vrin-btn--outline-light,
.vrin-section--sand .vrin-btn--outline-light {
  color: #1a1512;
  border-color: rgba(26, 21, 18, 0.55);
}

.vrin-section--cream .vrin-btn--outline-light:hover,
.vrin-section--cream .vrin-btn--outline-light:focus-visible,
.vrin-section--sand .vrin-btn--outline-light:hover,
.vrin-section--sand .vrin-btn--outline-light:focus-visible {
  background-color: #1a1512;
  border-color: #1a1512;
  color: #f8f2eb;
}

/* QA_CONTRAST_FIX_EYEBROW_ON_DARK
   The gold eyebrow on dark hero imagery reached only ~3.2:1. Fall back to the
   lighter warm tone already used for eyebrows on dark surfaces. */
main .vrin-section--dark .vrin-eyebrow,
main .vrin-section--photo .vrin-eyebrow {
  color: #f3d6a8 !important;
}

/* QA_CONTRAST_FIX_HERO_EYEBROW
   The service hero (.vrin-hero) sits on a dark photo overlay, but .vrin-eyebrow keeps
   its light-section deep-rose colour (#8f4f40), which measures ~2:1 there. Use the
   light eyebrow tone already used for .vrin-section--photo / --dark. */
.vrin-hero .vrin-eyebrow {
  color: #f3cbba;
}

.vrin-hero .vrin-eyebrow::before {
  background-color: currentColor;
  opacity: 0.9;
}

/* QA_CONTRAST_FIX_GHOST_BTN_ON_DARK
   .vrin-btn--ghost uses ink text on a transparent background, which is built for
   light cream/sand surfaces. On the dark hero carousel (and other dark/photo
   sections) it renders ink text over a dark photo at ~1.1-2:1. Give the ghost
   button a light treatment whenever it sits on a dark surface. */
.vrin-hero .vrin-btn--ghost,
.vrin-section--dark .vrin-btn--ghost,
.vrin-section--photo .vrin-btn--ghost,
.vrin-btn--ghost.vrin-btn--on-dark {
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.75);
  background-color: rgba(0, 0, 0, 0.35);
}

.vrin-hero .vrin-btn--ghost:hover,
.vrin-hero .vrin-btn--ghost:focus-visible,
.vrin-section--dark .vrin-btn--ghost:hover,
.vrin-section--dark .vrin-btn--ghost:focus-visible,
.vrin-section--photo .vrin-btn--ghost:hover,
.vrin-section--photo .vrin-btn--ghost:focus-visible,
.vrin-btn--ghost.vrin-btn--on-dark:hover,
.vrin-btn--ghost.vrin-btn--on-dark:focus-visible {
  color: #1a1512;
  background-color: #ffffff;
  border-color: #ffffff;
}

/* QA_COOKIE_BANNER_VISIBILITY
   Keep the consent panel above other fixed UI and comfortably tappable on small
   screens now that the markup is present on the homepage. */
.vrin-cookie {
  z-index: 1090;
}

@media (max-width: 767.98px) {
  .vrin-cookie__panel {
    grid-template-columns: 1fr;
    padding: 1.25rem;
  }

  .vrin-cookie__actions .vrin-cookie__btn {
    flex: 1 1 45%;
    min-height: 44px;
  }
}

/* QA_GALLERY_CAPTION_CLIP_FIX
   Gallery captions are absolutely positioned over the square image. On the live
   layout the figure collapses to the image height so the caption's bottom edge
   (and part of the text) is clipped by the image boundary. Place the caption
   fully below the image in normal flow so it is never cut in half. */
.vrin-gallery .vrin-gallery__item {
  display: flex;
  flex-direction: column;
  overflow: visible;
}

.vrin-gallery .vrin-gallery__item img {
  border-radius: var(--vrin-radius) var(--vrin-radius) 0 0;
}

.vrin-gallery .vrin-gallery__caption {
  position: static;
  inset: auto;
  flex: 1 1 auto;
  padding: 0.9rem 1.1rem 1.05rem;
  background-image: none;
  background-color: var(--vrin-white);
  color: var(--vrin-ink);
  font-size: 0.88rem;
  letter-spacing: 0.03em;
  line-height: 1.45;
}

@media (max-width: 767.98px) {
  .vrin-gallery .vrin-gallery__caption {
    font-size: 0.85rem;
    padding: 0.8rem 0.95rem 0.95rem;
  }
}

/* QA_FORM_DISCLAIMER_OVERLAP_FIX
   The submission disclaimer (.vrin-form__note) under the Send request button was
   escaping the white .vrin-form card and colliding with its bottom edge.
   Keep the note in normal flow inside the card with clear spacing from the
   button above and the card padding below, and use a legible ink colour.
   Bootstrap's .mt-3 utility is overridden with a slightly larger top gap. */
.vrin-form > .vrin-form__note {
  position: static;
  display: block;
  clear: both;
  margin: 1.25rem 0 0;
  padding: 0;
  font-size: 0.85rem;
  line-height: 1.6;
  color: var(--vrin-ink-soft);
}

.vrin-form > .vrin-form__note a {
  color: var(--vrin-rose-dark);
  text-decoration: underline;
}

.vrin-form > .vrin-form__note:last-child {
  margin-bottom: 0;
}

/* QA_FOOTER_BLANK_STRIP_FIX
   The footer "Get in touch" column stacked four full .vrin-contact-info cards
   (white panels, 42px icon circles, 1.15rem/1.25rem padding each). That column
   grew far taller than the short brand / Menu / Services columns next to it,
   so the footer row stretched and left a large empty dark strip below the
   link lists. Render the footer contact block as compact inline contact rows
   instead of cards so the row height follows the actual content.
   Scoped to the footer only; the main contact section keeps its cards. */
.vrin-footer .vrin-contact-info {
  gap: 0.9rem;
}

.vrin-footer .vrin-contact-info__item {
  grid-template-columns: auto 1fr;
  gap: 0.75rem;
  padding: 0;
  border: 0;
  border-radius: 0;
  background-color: transparent;
}

.vrin-footer .vrin-contact-info__icon {
  width: 28px;
  height: 28px;
  font-size: 0.8rem;
  background-color: transparent;
  border: 1px solid rgba(234, 185, 167, 0.45);
  color: #eab9a7;
}

.vrin-footer .vrin-contact-info__label {
  font-size: 0.7rem;
  letter-spacing: 0.14em;
  color: #a99b8f;
}

.vrin-footer .vrin-contact-info__value {
  font-size: 0.95rem;
  line-height: 1.55;
  color: #ddd1c6;
}

.vrin-footer .vrin-contact-info__item a,
.vrin-footer .vrin-contact-info__item a:visited {
  color: #ddd1c6;
}

.vrin-footer .vrin-contact-info__item a:hover,
.vrin-footer .vrin-contact-info__item a:focus-visible {
  color: #ffffff;
  text-decoration: underline;
}

/* Keep the footer contact cards' stacked layout intact on small screens,
   where there is no neighbouring column to leave blank. */
@media (min-width: 992px) {
  .vrin-footer > .vrin-container > .row {
    align-items: start;
  }
}

/* QA_CONTACT_FORM_BLANK_PANEL_FIX
   The white booking form card (.vrin-form) was as tall as the whole booking row
   (left details column + map row), so the area under the Send Request button and
   its disclaimer rendered as a large empty rounded white panel with a wide blank
   strip beneath the form fields.
   Keep the form card sized to its own content and let the section row height come
   from the taller column, so no empty filler panel is painted in the section.
   Layout-safe, supports both service pages, and mobile stays stacked. */
.vrin-section .row > [class^="col-"] > .vrin-form,
.vrin-section .row > [class*=" col-"] > .vrin-form {
  align-self: start;
  height: auto;
  max-height: none;
}

.vrin-section .row > [class^="col-"] > .vrin-form > .row:last-child,
.vrin-section .row > [class*=" col-"] > .vrin-form > .row:last-child {
  margin-bottom: 0;
}

.vrin-section .row > [class^="col-"] > .vrin-form > .row:last-child > [class^="col-"]:last-child,
.vrin-section .row > [class*=" col-"] > .vrin-form > .row:last-child > [class*=" col-"]:last-child {
  padding-bottom: 0;
}

/* QA_FOOTER_EMPTY_STRIP_FIX
   The footer's four-column Bootstrap row only shrinks to its tallest column, but the
   brand / Menu / Services columns are much shorter than the "Get in touch" column, so
   the row grid left a tall empty dark band under the short columns and pushed the map
   block, divider and legal text far down the page.
   Let the columns sit at the top of the row and stop the row from reserving the
   leftover vertical space: align the columns to the start and remove the stretch
   gap so the map/divider/legal block follows the content directly.
   Desktop-only (the mobile layout is a single stacked column and already fine). */
@media (min-width: 992px) {
  .vrin-footer > .vrin-container > .row {
    align-content: start;
    align-items: start;
  }

  /* Short columns pack to the top so their content does not leave a void
     between the link lists and the map block. */
  .vrin-footer > .vrin-container > .row > [class^="col-"],
  .vrin-footer > .vrin-container > .row > [class*=" col-"] {
    align-self: start;
  }
}