:root {
  --studio-ink: #161a17;
  --studio-ink-soft: #3b423c;
  --studio-ink-mist: #6b746c;
  --studio-sand: #f7f2ea;
  --studio-sand-deep: #ece3d6;
  --studio-sage: #4f7261;
  --studio-sage-deep: #2c4239;
  --studio-clay: #b8613c;
  --studio-clay-soft: #d98a63;
  --studio-line: rgba(22, 26, 23, 0.12);
  --studio-line-strong: rgba(22, 26, 23, 0.24);
  --studio-radius: 22px;
  --studio-radius-sm: 12px;
  --studio-shadow: 0 26px 64px -34px rgba(20, 26, 22, 0.5);
  --studio-shadow-soft: 0 14px 36px -24px rgba(20, 26, 22, 0.4);
  --studio-font-display: "Cormorant Garamond", "Playfair Display", Georgia, serif;
  --studio-font-body: "Inter", "Helvetica Neue", Arial, sans-serif;
  --studio-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--studio-font-body);
  color: var(--studio-ink);
  background-color: var(--studio-sand);
  font-size: 1rem;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, .studio-display {
  font-family: var(--studio-font-display);
  font-weight: 600;
  letter-spacing: -0.01em;
  line-height: 1.12;
  color: var(--studio-ink);
}

h1 { font-size: clamp(2.4rem, 5.2vw, 4.4rem); }
h2 { font-size: clamp(1.9rem, 3.6vw, 3rem); }
h3 { font-size: clamp(1.3rem, 2.1vw, 1.75rem); }

a {
  color: var(--studio-sage-deep);
  text-decoration-color: rgba(44, 66, 57, 0.35);
  text-underline-offset: 4px;
  transition: color 0.25s var(--studio-ease), text-decoration-color 0.25s var(--studio-ease);
}

a:hover {
  color: var(--studio-clay);
  text-decoration-color: var(--studio-clay);
}

p {
  color: var(--studio-ink-soft);
}

::selection {
  background: var(--studio-sage);
  color: #fff;
}

.studio-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  font-family: var(--studio-font-body);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--studio-sage);
}

.studio-eyebrow::before {
  content: "";
  width: 34px;
  height: 1px;
  background: var(--studio-clay);
}

.studio-eyebrow--light {
  color: var(--studio-sand-deep);
}

.studio-lead {
  font-size: clamp(1.02rem, 1.35vw, 1.18rem);
  color: var(--studio-ink-soft);
  max-width: 62ch;
}

.studio-section {
  position: relative;
  padding: clamp(4rem, 9vw, 8rem) 0;
}

.studio-section--sand { background-color: var(--studio-sand); }
.studio-section--deep { background-color: var(--studio-sand-deep); }
.studio-section--ink {
  background-color: var(--studio-sage-deep);
  color: #f3efe7;
}

.studio-section--ink h1,
.studio-section--ink h2,
.studio-section--ink h3,
.studio-section--ink p,
.studio-section--ink .studio-lead {
  color: #f3efe7;
}

.studio-section--photo {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  color: #f6f2ea;
}

.studio-section--photo h2,
.studio-section--photo h3,
.studio-section--photo p,
.studio-section--photo .studio-lead {
  color: #f6f2ea;
}

.studio-divider {
  height: 1px;
  border: 0;
  background: var(--studio-line);
  opacity: 1;
}

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

.studio-btn:hover { transform: translateY(-2px); text-decoration: none; }

.studio-btn--solid {
  background-color: var(--studio-sage);
  color: #ffffff;
  box-shadow: var(--studio-shadow-soft);
}

.studio-btn--solid:hover {
  background-color: var(--studio-sage-deep);
  color: #ffffff;
}

.studio-btn--clay {
  background-color: var(--studio-clay);
  color: #ffffff;
}

.studio-btn--clay:hover {
  background-color: #9c4f2f;
  color: #ffffff;
}

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

.studio-btn--ghost:hover {
  border-color: var(--studio-clay);
  color: var(--studio-clay);
}

.studio-btn--light {
  background-color: #f6f2ea;
  color: var(--studio-sage-deep);
}

.studio-btn--light:hover {
  background-color: #ffffff;
  color: var(--studio-sage-deep);
}

.studio-topbar {
  background-color: var(--studio-sage-deep);
  color: #ddd6c9;
  font-size: 0.84rem;
  padding: 0.5rem 0;
}

.studio-topbar a { color: #ddd6c9; text-decoration: none; }
.studio-topbar a:hover { color: #ffffff; text-decoration: underline; }

.studio-header {
  background-color: rgba(247, 242, 234, 0.92);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--studio-line);
  transition: padding 0.35s var(--studio-ease), box-shadow 0.35s var(--studio-ease);
  padding: 0.9rem 0;
}

.studio-header--condensed {
  padding: 0.35rem 0;
  box-shadow: var(--studio-shadow-soft);
}

.studio-header .navbar-brand {
  font-family: var(--studio-font-display);
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--studio-sage-deep);
}

.studio-header .nav-link {
  font-size: 0.88rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--studio-ink);
  padding: 0.6rem 0.9rem;
}

.studio-header .nav-link:hover,
.studio-header .nav-link.active { color: var(--studio-clay); }

.studio-header__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.9rem;
  font-size: 0.82rem;
  color: var(--studio-ink-soft);
}

.studio-header__meta i { color: var(--studio-sage); }

.studio-footer {
  background-color: var(--studio-sage-deep);
  color: #d9d2c5;
  padding: clamp(3rem, 6vw, 5rem) 0 1.5rem;
  font-size: 0.92rem;
}

.studio-footer h4 {
  font-family: var(--studio-font-body);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #f3efe7;
  margin-bottom: 1.2rem;
}

.studio-footer a { color: #d9d2c5; text-decoration: none; }
.studio-footer a:hover { color: #ffffff; text-decoration: underline; }

.studio-footer__list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.studio-footer__list li { margin-bottom: 0.55rem; }

.studio-footer__bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.16);
  margin-top: 3rem;
  padding-top: 1.5rem;
  font-size: 0.82rem;
  color: #bdb5a6;
}

.studio-hero {
  position: relative;
  min-height: clamp(560px, 88vh, 900px);
  display: flex;
  align-items: center;
  background-size: cover;
  background-position: center;
  color: #f7f4ee;
  overflow: hidden;
}

.studio-hero__inner { position: relative; z-index: 2; }

.studio-hero h1 { color: #ffffff; }

.studio-hero p { color: #eae4d9; font-size: 1.1rem; max-width: 56ch; }

.studio-hero__marker {
  position: absolute;
  right: -140px;
  bottom: -140px;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.22);
  z-index: 1;
}

.studio-hero__marker--two {
  right: -60px;
  bottom: -220px;
  width: 560px;
  height: 560px;
  border-color: rgba(184, 97, 60, 0.45);
}

.studio-page-hero {
  position: relative;
  padding: clamp(5rem, 12vw, 9rem) 0 clamp(3rem, 7vw, 5rem);
  background-size: cover;
  background-position: center;
  color: #f7f4ee;
}

.studio-page-hero h1 { color: #ffffff; }
.studio-page-hero p { color: #ece6dc; }

.studio-breadcrumb {
  font-size: 0.8rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #ddd5c7;
  margin-bottom: 1rem;
}

.studio-breadcrumb a { color: #ddd5c7; text-decoration: none; }
.studio-breadcrumb a:hover { color: #ffffff; }

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

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

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

.studio-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.7s var(--studio-ease);
}

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

.studio-card__body {
  padding: 1.6rem 1.5rem 1.8rem;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.studio-card__title { margin-bottom: 0.6rem; }

.studio-card__text { flex: 1; margin-bottom: 1.2rem; font-size: 0.95rem; }

.studio-card__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.82rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--studio-ink-mist);
}

.studio-card--dark {
  background-color: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.18);
  color: #f0ece2;
}

.studio-card--dark .studio-card__text,
.studio-card--dark .studio-card__meta { color: #d6cfc1; }

.studio-service-line {
  display: flex;
  gap: 1.4rem;
  padding: 1.7rem 0;
  border-bottom: 1px solid var(--studio-line);
}

.studio-service-line__index {
  font-family: var(--studio-font-display);
  font-size: 1.5rem;
  color: var(--studio-clay);
  min-width: 3ch;
}

.studio-service-line__body { flex: 1; }

.studio-service-line__price {
  font-family: var(--studio-font-display);
  font-size: 1.4rem;
  color: var(--studio-sage-deep);
  white-space: nowrap;
}

.studio-tier {
  border: 1px solid var(--studio-line);
  border-radius: var(--studio-radius);
  background-color: #ffffff;
  padding: 2.2rem 1.9rem;
  height: 100%;
  display: flex;
  flex-direction: column;
  transition: border-color 0.35s var(--studio-ease), transform 0.35s var(--studio-ease);
}

.studio-tier:hover { border-color: var(--studio-sage); transform: translateY(-5px); }

.studio-tier--featured {
  background-color: var(--studio-sage-deep);
  border-color: var(--studio-sage-deep);
  color: #f2eee6;
}

.studio-tier--featured h3,
.studio-tier--featured .studio-tier__price { color: #ffffff; }

.studio-tier--featured .studio-tier__label { color: var(--studio-clay-soft); }

.studio-tier__label {
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--studio-clay);
}

.studio-tier__price {
  font-family: var(--studio-font-display);
  font-size: 3rem;
  line-height: 1;
  margin: 1rem 0 1.4rem;
}

.studio-tier__price small {
  font-family: var(--studio-font-body);
  font-size: 0.85rem;
  color: inherit;
  opacity: 0.7;
}

.studio-tier__list {
  list-style: none;
  padding: 0;
  margin: 0 0 1.8rem;
  flex: 1;
}

.studio-tier__list li {
  position: relative;
  padding-left: 1.7rem;
  margin-bottom: 0.7rem;
  font-size: 0.94rem;
}

.studio-tier__list li i {
  position: absolute;
  left: 0;
  top: 0.4rem;
  color: var(--studio-clay);
  font-size: 0.8rem;
}

.studio-tier--featured .studio-tier__list li i { color: var(--studio-clay-soft); }

.studio-testimonial {
  background-color: #ffffff;
  border-radius: var(--studio-radius);
  border: 1px solid var(--studio-line);
  padding: 2.4rem 2rem;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.studio-testimonial__quote {
  font-family: var(--studio-font-display);
  font-size: 1.2rem;
  line-height: 1.6;
  color: var(--studio-ink);
  flex: 1;
}

.studio-testimonial__person {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  margin-top: 1.5rem;
  padding-top: 1.4rem;
  border-top: 1px solid var(--studio-line);
}

.studio-testimonial__person img {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  object-fit: cover;
  background-color: var(--studio-sand-deep);
}

.studio-testimonial__name { font-weight: 600; font-size: 0.95rem; }

.studio-testimonial__role { font-size: 0.82rem; color: var(--studio-ink-mist); }

.studio-stars { color: var(--studio-clay); font-size: 0.85rem; letter-spacing: 0.15em; }

.studio-person {
  text-align: center;
}

.studio-person__photo {
  aspect-ratio: 1 / 1;
  border-radius: var(--studio-radius);
  overflow: hidden;
  background-color: var(--studio-sand-deep);
  margin-bottom: 1.2rem;
}

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

.studio-person__name { margin-bottom: 0.2rem; font-size: 1.2rem; }

.studio-person__role {
  font-size: 0.78rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--studio-clay);
}

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

.studio-gallery__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.7s var(--studio-ease);
}

.studio-gallery__item:hover img { transform: scale(1.07); }

.studio-gallery__caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 1.6rem 1.1rem 0.9rem;
  background: linear-gradient(rgba(22, 26, 23, 0), rgba(22, 26, 23, 0.82));
  color: #f6f2ea;
  font-size: 0.9rem;
}

.studio-gallery__tall { aspect-ratio: 3 / 4; }
.studio-gallery__wide { aspect-ratio: 16 / 10; }
.studio-gallery__square { aspect-ratio: 1 / 1; }

.studio-stat {
  text-align: center;
  padding: 1.5rem 1rem;
  border-right: 1px solid var(--studio-line);
}

.studio-stat:last-child { border-right: 0; }

.studio-stat__value {
  font-family: var(--studio-font-display);
  font-size: clamp(2.2rem, 4vw, 3.2rem);
  line-height: 1;
  color: var(--studio-sage-deep);
}

.studio-section--ink .studio-stat__value { color: #f6f2ea; }

.studio-stat__label {
  font-size: 0.8rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--studio-ink-mist);
  margin-top: 0.6rem;
}

.studio-section--ink .studio-stat__label { color: #c9c2b4; }

.studio-timeline {
  position: relative;
  padding-left: 2.2rem;
  border-left: 1px solid var(--studio-line);
}

.studio-timeline__item { position: relative; padding-bottom: 2.4rem; }

.studio-timeline__item:last-child { padding-bottom: 0; }

.studio-timeline__item::before {
  content: "";
  position: absolute;
  left: -2.62rem;
  top: 0.55rem;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background-color: var(--studio-clay);
  border: 2px solid var(--studio-sand);
}

.studio-timeline__year {
  font-family: var(--studio-font-display);
  font-size: 1.3rem;
  color: var(--studio-sage);
}

.studio-step {
  display: flex;
  gap: 1.2rem;
  align-items: flex-start;
  height: 100%;
}

.studio-step__num {
  flex: 0 0 auto;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 1px solid var(--studio-line-strong);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--studio-font-display);
  font-size: 1.15rem;
  color: var(--studio-clay);
}

.studio-step__title { font-size: 1.1rem; margin-bottom: 0.35rem; }

.studio-step__text { font-size: 0.93rem; margin: 0; }

.studio-accordion .accordion-item {
  background-color: transparent;
  border: 0;
  border-bottom: 1px solid var(--studio-line);
}

.studio-accordion .accordion-button {
  background-color: transparent;
  font-family: var(--studio-font-display);
  font-size: 1.18rem;
  color: var(--studio-ink);
  padding: 1.35rem 0;
  box-shadow: none;
}

.studio-accordion .accordion-button:not(.collapsed) { color: var(--studio-clay); }

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

.studio-accordion .accordion-body {
  padding: 0 0 1.5rem;
  color: var(--studio-ink-soft);
  font-size: 0.96rem;
}

.studio-form-card {
  background-color: #ffffff;
  border: 1px solid var(--studio-line);
  border-radius: var(--studio-radius);
  padding: clamp(1.8rem, 4vw, 3rem);
  box-shadow: var(--studio-shadow-soft);
}

.studio-field .form-label {
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--studio-ink-soft);
  margin-bottom: 0.45rem;
}

.studio-field .form-control,
.studio-field .form-select {
  border-radius: var(--studio-radius-sm);
  border: 1px solid var(--studio-line-strong);
  background-color: var(--studio-sand);
  padding: 0.85rem 1rem;
  font-size: 0.95rem;
  color: var(--studio-ink);
}

.studio-field .form-control:focus,
.studio-field .form-select:focus {
  border-color: var(--studio-sage);
  box-shadow: 0 0 0 3px rgba(79, 114, 97, 0.18);
  background-color: #ffffff;
}

.studio-form--checked .form-control:invalid,
.studio-form--checked .form-select:invalid {
  border-color: #b3452c;
  box-shadow: 0 0 0 3px rgba(179, 69, 44, 0.12);
}

.studio-field__note { font-size: 0.8rem; color: var(--studio-ink-mist); }

.studio-newsletter {
  background-color: var(--studio-sage-deep);
  border-radius: var(--studio-radius);
  padding: clamp(1.8rem, 4vw, 3rem);
  color: #f2eee6;
}

.studio-newsletter h3,
.studio-newsletter p { color: #f2eee6; }

.studio-newsletter .form-control {
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  background-color: rgba(255, 255, 255, 0.1);
  color: #ffffff;
  padding: 0.85rem 1.3rem;
}

.studio-newsletter .form-control::placeholder { color: rgba(255, 255, 255, 0.65); }

.studio-newsletter .form-control:focus {
  background-color: rgba(255, 255, 255, 0.18);
  border-color: #ffffff;
  box-shadow: none;
}

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

.studio-map iframe {
  width: 100%;
  height: clamp(320px, 45vh, 480px);
  border: 0;
  display: block;
  filter: grayscale(0.25) contrast(1.05);
}

.studio-contact-item {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  padding: 1.2rem 0;
  border-bottom: 1px solid var(--studio-line);
}

.studio-contact-item:last-child { border-bottom: 0; }

.studio-contact-item__icon {
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background-color: rgba(79, 114, 97, 0.12);
  color: var(--studio-sage-deep);
  display: flex;
  align-items: center;
  justify-content: center;
}

.studio-contact-item__label {
  font-size: 0.76rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--studio-ink-mist);
}

.studio-marquee {
  overflow: hidden;
  border-top: 1px solid var(--studio-line);
  border-bottom: 1px solid var(--studio-line);
  padding: 1.4rem 0;
}

.studio-marquee__track {
  display: flex;
  gap: 3.5rem;
  width: max-content;
  animation: studio-scroll 38s linear infinite;
}

.studio-marquee__item {
  font-family: var(--studio-font-display);
  font-size: 1.35rem;
  color: var(--studio-ink-mist);
  white-space: nowrap;
}

@keyframes studio-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

.studio-slider .carousel-item {
  padding: 0 0.5rem;
}

.studio-slider .carousel-indicators {
  position: static;
  margin: 2rem 0 0;
}

.studio-slider .carousel-indicators [data-bs-target] {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: var(--studio-line-strong);
  border: 0;
  opacity: 1;
}

.studio-slider .carousel-indicators .active { background-color: var(--studio-clay); }

.studio-quote-block {
  font-family: var(--studio-font-display);
  font-size: clamp(1.4rem, 2.6vw, 2.1rem);
  line-height: 1.45;
  color: var(--studio-ink);
  max-width: 30ch;
}

.studio-badge-soft {
  display: inline-block;
  padding: 0.4rem 0.9rem;
  border-radius: 999px;
  background-color: rgba(79, 114, 97, 0.12);
  color: var(--studio-sage-deep);
  font-size: 0.76rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.studio-link-arrow {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 600;
  font-size: 0.9rem;
  text-decoration: none;
}

.studio-link-arrow i { transition: transform 0.3s var(--studio-ease); }

.studio-link-arrow:hover i { transform: translateX(5px); }

.studio-back-to-top {
  position: fixed;
  right: 1.4rem;
  bottom: 1.4rem;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: 0;
  background-color: var(--studio-sage-deep);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px);
  transition: opacity 0.3s var(--studio-ease), transform 0.3s var(--studio-ease), visibility 0.3s;
  z-index: 1040;
}

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

.studio-social-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  color: #ece6db;
  font-size: 0.84rem;
  text-decoration: none;
}

.studio-social-pill:hover {
  background-color: rgba(255, 255, 255, 0.12);
  color: #ffffff;
  text-decoration: none;
}

.studio-legal-body h2 {
  font-size: clamp(1.4rem, 2.4vw, 1.9rem);
  margin-top: 2.6rem;
  margin-bottom: 1rem;
}

.studio-legal-body h2:first-child { margin-top: 0; }

.studio-legal-body ul { color: var(--studio-ink-soft); }

.studio-cookie {
  position: fixed;
  left: 1.2rem;
  bottom: 1.2rem;
  width: min(420px, calc(100vw - 2.4rem));
  z-index: 1080;
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 0.45s var(--studio-ease), transform 0.45s var(--studio-ease);
  pointer-events: none;
}

.studio-cookie--visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.studio-cookie--leaving {
  opacity: 0;
  transform: translateY(18px);
  pointer-events: none;
}

.studio-cookie__panel {
  position: relative;
  background-color: var(--studio-sage-deep);
  color: #f0ece3;
  border-radius: var(--studio-radius);
  padding: 1.6rem 1.5rem 1.5rem;
  box-shadow: 0 30px 70px -30px rgba(10, 16, 12, 0.75);
  border: 1px solid rgba(255, 255, 255, 0.14);
  overflow: hidden;
}

.studio-cookie__badge {
  position: absolute;
  top: -28px;
  right: -28px;
  width: 92px;
  height: 92px;
  border-radius: 50%;
  background-color: rgba(184, 97, 60, 0.32);
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  padding: 0 0 1.1rem 1.1rem;
  color: #f4e3d8;
  font-size: 0.95rem;
}

.studio-cookie__title {
  font-family: var(--studio-font-display);
  font-size: 1.35rem;
  color: #ffffff;
  margin: 0 0 0.6rem;
  padding-right: 2.4rem;
}

.studio-cookie__text {
  font-size: 0.88rem;
  line-height: 1.65;
  color: #d5cec1;
  margin: 0 0 1.25rem;
}

.studio-cookie__link {
  color: #f0b699;
  text-decoration: underline;
}

.studio-cookie__link:hover { color: #ffffff; }

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

.studio-cookie__btn {
  flex: 1 1 auto;
  min-width: 130px;
  padding: 0.7rem 1.1rem;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
  border: 1px solid transparent;
  transition: background-color 0.25s var(--studio-ease), color 0.25s var(--studio-ease),
    border-color 0.25s var(--studio-ease);
}

.studio-cookie__btn--ghost {
  background-color: transparent;
  border-color: rgba(255, 255, 255, 0.35);
  color: #ece6db;
}

.studio-cookie__btn--ghost:hover {
  background-color: rgba(255, 255, 255, 0.12);
  color: #ffffff;
}

.studio-cookie__btn--solid {
  background-color: var(--studio-clay);
  color: #ffffff;
}

.studio-cookie__btn--solid:hover { background-color: #9c4f2f; }

.studio-ratio-photo {
  border-radius: var(--studio-radius);
  overflow: hidden;
  background-color: var(--studio-sand-deep);
}

.studio-ratio-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.studio-floating-card {
  background-color: #ffffff;
  border-radius: var(--studio-radius);
  padding: 1.6rem 1.5rem;
  box-shadow: var(--studio-shadow);
  border: 1px solid var(--studio-line);
}

@media (max-width: 991.98px) {
  .studio-header__meta { display: none; }
  .studio-stat { border-right: 0; border-bottom: 1px solid var(--studio-line); }
  .studio-stat:last-child { border-bottom: 0; }
  .studio-cookie { left: 0.8rem; right: 0.8rem; width: auto; bottom: 0.8rem; }
}

@media (max-width: 575.98px) {
  .studio-service-line { flex-wrap: wrap; gap: 0.6rem; }
  .studio-cookie__actions { flex-direction: column; }
  .studio-cookie__btn { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .studio-marquee__track { animation: none; }
  .studio-cookie { transition: none; }
}
/* --- Contrast fixes --- */
.studio-topbar .studio-header__meta { color: #ddd6c9; }
.studio-topbar .studio-header__meta i { color: #f0e6d8; }

.studio-footer .studio-contact-item__label { color: #cdc5b4; }

.studio-page-hero .studio-btn--ghost,
.studio-section--ink .studio-btn--ghost,
.studio-section--photo .studio-btn--ghost {
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.55);
}

.studio-page-hero .studio-btn--ghost:hover,
.studio-section--ink .studio-btn--ghost:hover,
.studio-section--photo .studio-btn--ghost:hover {
  background-color: rgba(255, 255, 255, 0.14);
  color: #ffffff;
  border-color: #ffffff;
}

/* --- About page contrast fixes --- */
.studio-topbar .studio-header__meta,
.studio-topbar .studio-header__meta a { color: #e6dfd2; }
.studio-topbar .studio-header__meta i { color: #b9cfc3; }

.studio-footer .studio-contact-item__label { color: #cdc5b6; }

.studio-page-hero .studio-btn--ghost {
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.72);
}
.studio-page-hero .studio-btn--ghost:hover {
  color: #ffffff;
  background-color: rgba(255, 255, 255, 0.16);
  border-color: #ffffff;
}

.studio-page-hero .studio-hero__marker {
  color: #f7f4ee;
  background-color: #2c4239;
  border-color: rgba(255, 255, 255, 0.45);
}

/* ============================================================
   Contrast + decorative fixes (about page)
   Appended overrides — does not alter existing rules.
   ============================================================ */

/* Topbar contact metadata inherits .studio-header__meta dark ink;
   restore the light topbar colour so it is readable on the
   dark sage topbar background. Scoped to the topbar only. */
.studio-topbar .studio-header__meta,
.studio-topbar .studio-header__meta a {
  color: #ddd6c9;
}

.studio-topbar .studio-header__meta i {
  color: #c9c2b4;
}

/* Footer contact labels use the mist ink, which is far too faint on
   the dark footer panel. Lighten them for the dark footer context. */
.studio-footer .studio-contact-item__label {
  color: #c9c2b4;
}

/* Ghost buttons placed on the dark photographic hero need light text
   and borders instead of the default dark ink. */
.studio-page-hero .studio-btn--ghost,
.studio-hero .studio-btn--ghost {
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.55);
}

.studio-page-hero .studio-btn--ghost:hover,
.studio-hero .studio-btn--ghost:hover {
  color: #ffffff;
  border-color: #ffffff;
  background-color: rgba(255, 255, 255, 0.14);
}

/* The hero markers are purely decorative outline rings. Suppress the
   stray label text they carry so it can never render as invisible
   white-on-white type over the floating card content. The ring
   border itself is unaffected. */
.studio-hero__marker {
  color: transparent;
  font-size: 0;
  overflow: hidden;
  pointer-events: none;
}

/* ============================================================
   Cookie policy contrast fix
   The .studio-card--dark variant is designed to sit on a dark
   section, but on this page it is placed inside a light
   .studio-section. Its translucent background let the pale sand
   show through, leaving the light card text almost invisible.
   Give the card a solid dark panel and lighten the inner labels
   so all text meets contrast on the light section.
   ============================================================ */
main .studio-section:not(.studio-section--ink) .studio-card--dark {
  background-color: var(--studio-sage-deep);
  border-color: rgba(255, 255, 255, 0.2);
  color: #f0ece2;
}

main .studio-section:not(.studio-section--ink) .studio-card--dark .studio-card__title {
  color: #ffffff;
}

main .studio-section:not(.studio-section--ink) .studio-card--dark .studio-card__text,
main .studio-section:not(.studio-section--ink) .studio-card--dark .studio-card__meta {
  color: #e3ddd1;
}

main .studio-section:not(.studio-section--ink) .studio-card--dark .studio-contact-item__label {
  color: #d3ccbd;
}

main .studio-section:not(.studio-section--ink) .studio-card--dark .studio-contact-item {
  border-bottom-color: rgba(255, 255, 255, 0.2);
}

main .studio-section:not(.studio-section--ink) .studio-card--dark .studio-contact-item__icon {
  background-color: rgba(255, 255, 255, 0.14);
  color: #f0ece2;
}

main .studio-section:not(.studio-section--ink) .studio-card--dark a {
  color: #f0b699;
}

main .studio-section:not(.studio-section--ink) .studio-card--dark .studio-badge-soft {
  background-color: rgba(255, 255, 255, 0.16);
  color: #f0ece2;
}

/* ============================================================
   Privacy policy page — contrast fixes (appended overrides)
   The "dark" card variant used a translucent white surface, so on
   light sections it rendered as a light panel while its text stayed
   light. Give the variant a genuinely dark surface and lighten the
   muted children that otherwise inherit light-section colours.
   ============================================================ */
.studio-card--dark {
  background-color: var(--studio-sage-deep);
  border-color: rgba(255, 255, 255, 0.2);
  color: #f4f0e7;
}

.studio-card--dark .studio-card__title { color: #ffffff; }

.studio-card--dark .studio-card__text,
.studio-card--dark .studio-card__meta { color: #ddd6c8; }

.studio-card--dark .studio-contact-item { border-bottom-color: rgba(255, 255, 255, 0.2); }

.studio-card--dark .studio-contact-item__label { color: #d9d2c4; }

.studio-card--dark .studio-contact-item__icon {
  background-color: rgba(255, 255, 255, 0.16);
  color: #f4f0e7;
}

.studio-card--dark .studio-badge-soft {
  background-color: rgba(255, 255, 255, 0.16);
  color: #f4f0e7;
}

.studio-card--dark a { color: #f4f0e7; text-decoration-color: rgba(255, 255, 255, 0.45); }
.studio-card--dark a:hover { color: #ffffff; text-decoration-color: #ffffff; }

.studio-card--dark .studio-btn--solid {
  background-color: var(--studio-clay);
  color: #ffffff;
}

.studio-card--dark .studio-btn--solid:hover { background-color: #9c4f2f; }

/* ============================================================
   Contrast + interaction fixes (homepage)
   Appended overrides — does not modify existing rules.
   ============================================================ */

/* Marquee labels were rendered in the faint mist ink on the sand
   background (4.34:1). Darken to the soft ink for readability. */
.studio-marquee__item {
  color: #3b423c;
}

/* Cookie "Accept all" button: white text on the clay tone only
   reached 4.36:1. Use the darker clay for a compliant ratio. */
.studio-cookie__btn--solid {
  background-color: #9c4f2f;
  color: #ffffff;
}

.studio-cookie__btn--solid:hover {
  background-color: #8a4527;
  color: #ffffff;
}

/* The floating hero card sits inside the hero (which applies
   .text-white). It has a white panel, so any inherited white text
   became invisible. Re-apply the studio ink palette inside the card
   (inherited values always lose to a directly targeted rule). */
.studio-floating-card h2,
.studio-floating-card h3,
.studio-floating-card h4,
.studio-floating-card p,
.studio-floating-card span,
.studio-floating-card strong,
.studio-floating-card li {
  color: var(--studio-ink);
}

.studio-floating-card p,
.studio-floating-card span {
  color: var(--studio-ink-soft);
}

/* Keep the fixed cookie panel from swallowing clicks meant for
   page content (e.g. form submit buttons on small screens) while
   keeping its own controls fully interactive. */
.studio-cookie--visible {
  pointer-events: none;
}

.studio-cookie--visible .studio-cookie__btn,
.studio-cookie--visible .studio-cookie__link {
  pointer-events: auto;
}

/* Inline confirmation shown after a form is successfully handled. */
.studio-form-success {
  margin: 0 0 1rem;
  padding: 0.85rem 1rem;
  border-radius: var(--studio-radius-sm);
  background-color: rgba(79, 114, 97, 0.14);
  border: 1px solid rgba(79, 114, 97, 0.32);
  color: var(--studio-sage-deep);
  font-size: 0.92rem;
}

/* ============================================================
   Terms & Conditions page — CTA contrast fix (appended override)
   Inside the dark side card the generic link colour rule
   (main .studio-section:not(.studio-section--ink) .studio-card--dark a)
   has higher specificity than .studio-card--dark .studio-btn--solid,
   so the solid CTA inherited the soft clay link tone and dropped to
   ~2.5:1 against the clay button background. Re-assert white text on
   the darker clay surface for a compliant ratio.
   ============================================================ */
main .studio-section:not(.studio-section--ink) .studio-card--dark .studio-btn--solid {
  background-color: #9c4f2f;
  color: #ffffff;
}

main .studio-section:not(.studio-section--ink) .studio-card--dark .studio-btn--solid:hover,
main .studio-section:not(.studio-section--ink) .studio-card--dark .studio-btn--solid:focus {
  background-color: #8a4527;
  color: #ffffff;
}

/* Contrast fix: numbered step markers on light sections */
.studio-step__num {
  color: #8a4a24;
}

/* ============================================================
   Service page contrast fix (Vinyasa Flow)
   The floating hero card sits inside .studio-page-hero, which
   applies white text. The card has a white panel, so its bold
   heading div (fw-bold fs-5) inherited white-on-white. Re-apply
   the ink colour inside the card panel.
   ============================================================ */
.studio-floating-card .fw-bold {
  color: var(--studio-ink);
}

.studio-floating-card .fw-bold.fs-5 {
  color: var(--studio-ink);
}

/* ============================================================
   Layout, image size, and contrast fixes
   ============================================================ */

html,
body {
  max-width: 100%;
  overflow-x: clip;
}

img,
.studio-card,
.studio-person,
.studio-gallery__item,
.studio-floating-card,
.studio-tier,
.studio-testimonial {
  max-width: 100%;
}

/* Portrait photos are the <img> itself. Keep every portrait the same
   square crop so a tall source file cannot spill into the next card. */
img.studio-person__photo,
.studio-person__photo img {
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: center top;
  display: block;
}

/* Gallery tiles share one frame, regardless of square/tall/wide classes. */
.studio-gallery__item {
  aspect-ratio: 4 / 3;
}

.studio-gallery__item img,
img.studio-gallery__square,
img.studio-gallery__tall,
img.studio-gallery__wide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  object-fit: cover;
  object-position: center;
  display: block;
}

.studio-slider .carousel-item img {
  width: 100%;
  height: clamp(260px, 42vw, 520px);
  object-fit: cover;
  object-position: center;
  border-radius: var(--studio-radius-sm);
}

.studio-slider .carousel-caption {
  left: 0.75rem;
  right: 0.75rem;
  bottom: 0.75rem;
  padding: 2.4rem 1.2rem 1rem;
  border-radius: var(--studio-radius-sm);
  background: linear-gradient(rgba(22, 26, 23, 0), rgba(22, 26, 23, 0.88));
  text-align: left;
}

.studio-slider .carousel-caption h3,
.studio-slider .carousel-caption p {
  color: #f7f4ee;
}

/* Decorative rings stay in the corner instead of covering the hero card. */
.studio-hero__marker,
.studio-page-hero .studio-hero__marker {
  background-color: transparent;
  color: transparent;
  z-index: 0;
  right: -220px;
  bottom: -180px;
  width: 280px;
  height: 280px;
}

.studio-hero__marker--two,
.studio-page-hero .studio-hero__marker--two {
  right: -280px;
  bottom: -260px;
  width: 380px;
  height: 380px;
}

.studio-service-line {
  align-items: flex-start;
  flex-wrap: wrap;
}

.studio-service-line__body {
  min-width: 0;
}

.studio-service-line__price {
  white-space: normal;
  margin-left: auto;
}

/* White quote cards sit inside a dark section that paints every
   paragraph and inherited span light. Restore ink on the card. */
.studio-section--ink .studio-testimonial,
.studio-section--ink .studio-testimonial p,
.studio-section--ink .studio-testimonial .studio-testimonial__quote,
.studio-section--ink .studio-testimonial .studio-testimonial__name {
  color: #161a17;
}

.studio-section--ink .studio-testimonial .studio-testimonial__role {
  color: #4e564f;
}

/* Featured pass copy is written with the light-section ink colour,
   which disappears on the dark card. */
.studio-tier--featured p,
.studio-tier--featured li,
.studio-tier--featured .studio-tier__list span {
  color: #f4f0e7 !important;
}

.studio-tier--featured .studio-badge-soft {
  align-self: flex-start;
  background-color: rgba(255, 255, 255, 0.16);
  color: #f6f2ea !important;
}

.studio-newsletter h1,
.studio-newsletter h2,
.studio-newsletter h3,
.studio-newsletter p,
.studio-newsletter a,
.studio-newsletter .form-label,
.studio-newsletter .studio-field__note,
.studio-newsletter .studio-eyebrow {
  color: #f6f2ea !important;
}

.studio-newsletter a {
  text-decoration-color: rgba(246, 242, 234, 0.55);
}

.studio-newsletter .studio-eyebrow::before {
  background: #f0b699;
}

.studio-header .studio-social-pill {
  color: var(--studio-sage-deep);
  border-color: var(--studio-line-strong);
}

.studio-header .studio-social-pill:hover {
  color: var(--studio-clay);
  background-color: rgba(79, 114, 97, 0.08);
}

.studio-footer .messenger-links {
  flex-wrap: wrap;
  padding: 0 1.25rem 1.75rem;
}

.studio-footer .messenger-links a {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.45rem 0.95rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.32);
  color: #f4f0e7;
  text-decoration: none;
}

.studio-footer .messenger-links a:hover {
  color: #ffffff;
  background-color: rgba(255, 255, 255, 0.1);
}
