/*
 * Studio Dolci V24 — service evidence and corrected image orientation.
 * Each offer is paired with one approved Studio Dolci asset: proof before claim.
 */

/* Service cards become compact visual caseboards instead of text-only panels. */
.v24-home .v10-service-card,
.v24-home .v10-service-card:nth-child(n) {
  width: clamp(480px, 44vw, 640px);
  min-height: clamp(700px, 60vw, 780px);
}

.v24-home .v10-service-face {
  padding: clamp(30px, 3vw, 46px);
}

.v24-home .v24-service-visual {
  position: relative;
  display: block;
  width: 100%;
  height: clamp(175px, 17vw, 225px);
  min-height: 0 !important;
  margin-top: clamp(20px, 2vw, 30px);
  overflow: hidden;
  border: 1px solid color-mix(in srgb, currentColor 30%, transparent);
  border-radius: 4px 70px 4px 4px;
  background: color-mix(in srgb, var(--v22-paper) 78%, var(--v22-blue));
  isolation: isolate;
}

.v24-home .v10-service-card:nth-child(even) .v24-service-visual {
  border-radius: 70px 4px 4px 4px;
}

.v24-home .v10-service-card:nth-child(3n) .v24-service-visual {
  border-radius: 4px 4px 70px 4px;
}

.v24-home .v24-service-visual::after {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(135deg, transparent 48%, rgba(255, 241, 156, .3) 48% 52%, transparent 52%),
    linear-gradient(180deg, transparent 55%, rgba(21, 18, 18, .28));
  content: "";
  pointer-events: none;
}

.v24-home .v24-service-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.88) contrast(.98);
  transform: scale(1.01);
  transition: filter 520ms ease, transform 820ms cubic-bezier(.22, 1, .36, 1);
}

.v24-home .v10-service-card:nth-child(3) .v24-service-visual img {
  padding: 12px;
  background: #efe9d7;
  object-fit: contain;
}

.v24-home .v24-service-visual > i {
  position: absolute;
  z-index: 2;
  right: 16px;
  bottom: 14px;
  width: 34px;
  height: 7px;
  border-radius: 999px;
  background: var(--v22-yellow);
  box-shadow: 42px 0 0 var(--v22-blue);
}

.v24-home .v10-service-card button:is(:hover, :focus-visible) .v24-service-visual img {
  filter: saturate(1.06) contrast(1.03);
  transform: scale(1.055);
}

.v24-home .v10-service-front .v23-service-icon {
  z-index: 4;
  top: clamp(60px, 6vw, 82px);
  right: clamp(44px, 4.5vw, 66px);
  width: clamp(66px, 5.6vw, 88px);
  background: color-mix(in srgb, var(--v22-cream) 88%, transparent);
  box-shadow: 0 12px 34px rgba(21, 18, 18, .14);
}

.v24-home .v10-service-front .v23-service-icon::after {
  transform: translate(29px, -23px);
}

.v24-home .v10-service-front > b {
  max-width: none;
  margin: clamp(18px, 1.7vw, 26px) 0 12px;
  font-size: clamp(34px, 3.05vw, 48px);
  line-height: .93;
  hyphens: none;
  overflow-wrap: normal;
  text-wrap: balance;
  word-break: normal;
}

.v24-home .v10-service-front > span:not(.v10-service-points, .v20-service-signal, .v21-service-demo, .v21-service-back-intro, .v23-service-icon, .v24-service-visual) {
  max-width: 48ch;
  font-size: clamp(14px, 1vw, 17px);
  line-height: 1.5;
}

.v24-home .v10-service-front .v21-service-demo {
  margin-top: 18px;
}

.v24-home .v10-service-front .v20-service-signal {
  margin-top: 16px;
}

.v24-home .v10-service-front .v20-service-signal > span {
  min-height: 68px;
  padding-block: 11px;
}

.v24-home .v10-service-front > em {
  margin-top: 16px;
}

.v24-home .v10-service-back > b {
  max-width: 12ch;
  margin-top: auto;
  overflow-wrap: normal;
  word-break: normal;
}

/* Preserve the photo-led night chapter in both modes. */
html[data-color-mode="dark"] .v24-home .v24-service-visual {
  border-color: rgba(255, 243, 183, .32);
}

@media (max-width: 820px) {
  .v24-home .v10-service-card,
  .v24-home .v10-service-card:nth-child(n) {
    width: min(91vw, 590px);
    min-height: 740px;
  }

  .v24-home .v24-service-visual { height: clamp(180px, 43vw, 230px); }
  .v24-home .v10-service-front .v23-service-icon { top: 68px; right: 42px; }
  .v24-home .v10-service-front > b { font-size: clamp(34px, 9.2vw, 48px); }
}

@media (max-width: 520px) {
  .v24-home .v10-service-card,
  .v24-home .v10-service-card:nth-child(n) { min-height: 720px; }

  .v24-home .v10-service-face { padding: 26px 24px; }
  .v24-home .v24-service-visual { height: 180px; margin-top: 20px; border-radius: 4px 46px 4px 4px; }
  .v24-home .v10-service-card:nth-child(even) .v24-service-visual { border-radius: 46px 4px 4px 4px; }
  .v24-home .v10-service-card:nth-child(3n) .v24-service-visual { border-radius: 4px 4px 46px 4px; }
  .v24-home .v10-service-front .v23-service-icon { top: 61px; right: 34px; width: 64px; }
  .v24-home .v10-service-front .v23-service-icon::after { transform: translate(24px, -19px); }
  .v24-home .v10-service-front > b { font-size: clamp(32px, 9vw, 42px); }
  .v24-home .v10-service-front .v20-service-signal > span { min-height: 62px; }
}

@media (prefers-reduced-motion: reduce) {
  .v24-home .v24-service-visual img { transition: none !important; }
}