/**
 * Runtime theme features loaded after every other public stylesheet.
 * Palette values are injected from the MC Promo settings page.
 */

body.mcp-color-scheme-official {
  --nav-muted: #202020;
  --surface-soft: #fafafa;
  color-scheme: light;
  background: #fff !important;
}

body.mcp-color-scheme-official .topbar {
  background: rgb(255 255 255 / 96%);
  border-bottom-color: color-mix(in srgb, var(--brand-red) 34%, #d1d1d1);
  box-shadow: 0 10px 34px rgb(17 17 17 / 7%);
}

@media (max-width: 920px) {
  body.mcp-color-scheme-official .topbar .nav-toggle {
    border-color: color-mix(in srgb, var(--brand-red) 42%, transparent);
    color: var(--brand-red);
  }

  body.mcp-color-scheme-official .topbar .nav-toggle > span {
    color: var(--brand-red);
  }
}

body.mcp-color-scheme-official .brand-lockup {
  position: relative;
}

body.mcp-color-scheme-official .brand-lockup::before {
  position: absolute;
  inset: 0;
  content: "";
  background: linear-gradient(90deg, var(--brand-red) 0 23%, #111 23% 100%);
  -webkit-mask: url("../assets/logo-mc-promo-eventi-meeting-gold-black.png") center / contain no-repeat;
  mask: url("../assets/logo-mc-promo-eventi-meeting-gold-black.png") center / contain no-repeat;
  pointer-events: none;
}

body.mcp-color-scheme-official .brand {
  opacity: 0;
}

body.mcp-color-scheme-official .btn-primary,
body.mcp-color-scheme-official .pagination .current,
body.mcp-color-scheme-official .mcp-pdf-control:hover {
  border-color: var(--brand-red);
  background: var(--brand-red);
  color: #fff;
}

.mcp-color-scheme-official .btn-primary,
.mcp-color-scheme-official .pagination .current,
.mcp-color-scheme-official .mcp-pdf-control:hover {
  box-shadow: 0 14px 34px color-mix(in srgb, var(--brand-red) 28%, transparent);
}

.mcp-color-scheme-official .eyebrow,
.mcp-color-scheme-official .accent-line,
.mcp-color-scheme-official .format-code {
  color: var(--brand-red);
}

body.mcp-color-scheme-official .btn-secondary {
  border-color: color-mix(in srgb, var(--brand-red) 62%, #d1d1d1);
  color: var(--brand-red);
}

body.mcp-color-scheme-official .hero-visual::after {
  background:
    linear-gradient(180deg, transparent 38%, rgb(255 255 255 / 28%) 62%, rgb(255 255 255 / 94%) 100%),
    linear-gradient(90deg, rgb(255 255 255 / 18%) 0%, transparent 52%);
}

body.mcp-color-scheme-official .mcp-block-hero--split .hero-visual img {
  filter: saturate(.9) contrast(1.02) brightness(.98);
}

body.mcp-color-scheme-official .visual-caption {
  border-color: color-mix(in srgb, var(--brand-red) 24%, #d1d1d1);
  color: #111;
  background: rgb(255 255 255 / 88%);
  box-shadow: 0 18px 46px rgb(17 17 17 / 12%);
  backdrop-filter: blur(16px);
}

body.mcp-color-scheme-official .visual-caption span {
  color: #505050;
}

body.mcp-color-scheme-official .mcp-block-hero--cover .meta-cell strong {
  color: #111;
}

/*
 * The official palette treats full-background heroes as a light editorial
 * composition. The photo remains full bleed, but it blends into the white
 * page instead of keeping the black overlays used by the gold/black theme.
 */
body.mcp-color-scheme-official .mcp-block-hero--cover {
  background: #fff !important;
}

body.mcp-color-scheme-official .mcp-block-hero--cover::before {
  background:
    linear-gradient(
      90deg,
      rgb(255 255 255 / 99%) 0%,
      rgb(255 255 255 / 96%) 28%,
      rgb(255 255 255 / 84%) 46%,
      rgb(255 255 255 / 34%) 68%,
      rgb(255 255 255 / 8%) 88%,
      transparent 100%
    ),
    linear-gradient(
      0deg,
      rgb(255 255 255 / 96%) 0%,
      rgb(255 255 255 / 38%) 24%,
      transparent 54%,
      rgb(255 255 255 / 10%) 100%
    ) !important;
}

body.mcp-color-scheme-official .mcp-block-hero--cover::after {
  background: none !important;
  box-shadow:
    inset 0 -1px 0 color-mix(in srgb, var(--brand-red) 26%, #d1d1d1),
    inset 0 -110px 150px rgb(255 255 255 / 34%) !important;
}

body.mcp-color-scheme-official .mcp-block-hero--cover > .mcp-hero-cover-image {
  opacity: .92;
  filter: saturate(.9) contrast(1.01) brightness(1.04) !important;
}

body.mcp-color-scheme-official .mcp-block-hero--cover .hero-copy {
  text-shadow: none !important;
}

body.mcp-color-scheme-official .mcp-block-hero--cover .hero-title {
  color: #111 !important;
}

body.mcp-color-scheme-official .mcp-block-hero--cover .hero-copy .lead {
  color: #303030 !important;
  text-shadow: none !important;
}

body.mcp-color-scheme-official .mcp-block-hero--cover .hero-actions .btn-secondary {
  border-color: color-mix(in srgb, var(--brand-red) 58%, #d1d1d1) !important;
  color: var(--brand-red) !important;
  background: rgb(255 255 255 / 82%) !important;
  box-shadow: 0 12px 32px rgb(17 17 17 / 8%);
  backdrop-filter: blur(14px);
}

body.mcp-color-scheme-official .mcp-block-hero--cover .hero-meta {
  border-color: color-mix(in srgb, var(--brand-red) 22%, #d1d1d1) !important;
  background: rgb(255 255 255 / 82%) !important;
  box-shadow: 0 22px 60px rgb(17 17 17 / 12%) !important;
  backdrop-filter: blur(20px);
}

body.mcp-color-scheme-official .mcp-block-hero--cover .meta-cell {
  color: #111;
  background: rgb(255 255 255 / 44%) !important;
}

body.mcp-color-scheme-official .mcp-block-hero--cover .meta-cell + .meta-cell {
  border-left: 1px solid color-mix(in srgb, var(--brand-red) 14%, #d1d1d1);
}

body.mcp-color-scheme-official .mcp-block-hero--cover .meta-cell span {
  color: #505050 !important;
}

body.mcp-color-scheme-official .mcp-block-hero--cover > .mcp-ai-image-disclosure {
  border-color: rgb(17 17 17 / 12%);
  color: rgb(17 17 17 / 56%);
  background: rgb(255 255 255 / 76%);
  box-shadow: 0 8px 24px rgb(17 17 17 / 8%);
  backdrop-filter: blur(12px);
}

@media (max-width: 1020px) {
  body.mcp-color-scheme-official .mcp-block-hero--cover::before {
    background:
      linear-gradient(90deg, rgb(255 255 255 / 98%) 0%, rgb(255 255 255 / 88%) 54%, rgb(255 255 255 / 38%) 100%),
      linear-gradient(0deg, rgb(255 255 255 / 94%) 0%, rgb(255 255 255 / 38%) 54%, transparent 100%) !important;
  }
}

@media (max-width: 640px) {
  body.mcp-color-scheme-official .mcp-block-hero--cover::before {
    background:
      linear-gradient(
        0deg,
        rgb(255 255 255 / 99%) 0%,
        rgb(255 255 255 / 96%) 54%,
        rgb(255 255 255 / 72%) 78%,
        rgb(255 255 255 / 42%) 100%
      ) !important;
  }

  body.mcp-color-scheme-official .mcp-block-hero--cover > .mcp-hero-cover-image {
    opacity: .68;
    filter: saturate(.82) contrast(.96) brightness(1.08) !important;
  }

  body.mcp-color-scheme-official .mcp-block-hero--cover .hero-meta {
    background: rgb(255 255 255 / 88%) !important;
  }
}

body.mcp-color-scheme-official .legal-document,
body.mcp-color-scheme-official .contact-card,
body.mcp-color-scheme-official .mcp-document-card,
body.mcp-color-scheme-official .cta-box,
body.mcp-color-scheme-official .format-panel,
body.mcp-color-scheme-official .format-item,
body.mcp-color-scheme-official .project-facts,
body.mcp-color-scheme-official .project-cover {
  box-shadow: 0 20px 55px rgb(17 17 17 / 8%);
}

body.mcp-color-scheme-official .legal-document {
  background: #fff;
}

body.mcp-color-scheme-official .footer {
  background: #fafafa;
}

.mcp-client-logos {
  overflow: hidden;
}

.mcp-logo-marquee {
  position: relative;
  width: 100%;
  margin-top: 34px;
  overflow: hidden;
  border-block: 1px solid color-mix(in srgb, var(--border) 78%, transparent);
  background:
    linear-gradient(90deg, var(--bg), transparent 7%, transparent 93%, var(--bg)),
    color-mix(in srgb, var(--surface) 88%, var(--bg));
}

.mcp-logo-marquee::before,
.mcp-logo-marquee::after {
  position: absolute;
  z-index: 2;
  top: 0;
  bottom: 0;
  width: min(10vw, 140px);
  content: "";
  pointer-events: none;
}

.mcp-logo-marquee::before {
  left: 0;
  background: linear-gradient(90deg, var(--bg), transparent);
}

.mcp-logo-marquee::after {
  right: 0;
  background: linear-gradient(-90deg, var(--bg), transparent);
}

.mcp-logo-marquee__track {
  display: flex;
  width: max-content;
  animation: mcp-logo-scroll 58s linear infinite;
  will-change: transform;
}

.mcp-logo-marquee:hover .mcp-logo-marquee__track,
.mcp-logo-marquee:focus-within .mcp-logo-marquee__track {
  animation-play-state: paused;
}

.mcp-logo-marquee__sequence {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 22px 18px 22px 0;
}

.mcp-client-logo {
  display: grid;
  width: 172px;
  height: 112px;
  flex: 0 0 auto;
  margin: 0;
  place-items: center;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 44px rgb(0 0 0 / 14%);
}

.mcp-client-logo img {
  display: block;
  width: auto;
  height: auto;
  max-width: 84%;
  max-height: 78%;
  margin: auto;
  object-fit: contain;
  object-position: 50% 50%;
}

@keyframes mcp-logo-scroll {
  to {
    transform: translateX(-50%);
  }
}

.mcp-about-gallery .mcp-gallery-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-flow: row;
  gap: clamp(14px, 2vw, 22px);
}

.mcp-about-gallery .photo-card {
  position: relative;
  min-height: 0;
  aspect-ratio: 1 / 1;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}

.mcp-about-gallery .photo-card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 360ms var(--ease), filter 360ms var(--ease);
}

.mcp-about-gallery .photo-card:hover img {
  transform: scale(1.035);
  filter: saturate(1.06) contrast(1.02);
}

@media (max-width: 800px) {
  .mcp-client-logo {
    width: 148px;
    height: 98px;
    border-radius: 15px;
  }

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

@media (max-width: 520px) {
  .mcp-about-gallery .mcp-gallery-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }

  .mcp-about-gallery .photo-card {
    border-radius: 18px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mcp-logo-marquee {
    overflow-x: auto;
  }

  .mcp-logo-marquee::before,
  .mcp-logo-marquee::after,
  .mcp-logo-marquee__sequence[aria-hidden="true"] {
    display: none;
  }

  .mcp-logo-marquee__track {
    animation: none;
  }

  .mcp-about-gallery .photo-card img {
    transition: none;
  }
}

/* Social profiles: plain links, no embedded third-party widgets. */
.mcp-social-links {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin: 6px 0;
}

.mcp-social-links a {
  display: inline-flex;
  min-height: 38px;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: 1px solid color-mix(in srgb, var(--accent) 48%, var(--border));
  border-radius: 999px;
  color: var(--fg);
  font-size: 13px;
  font-weight: 750;
  text-decoration: none;
  transition: transform 180ms ease, border-color 180ms ease, background-color 180ms ease;
}

.mcp-social-links a:hover,
.mcp-social-links a:focus-visible {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  color: var(--accent);
  transform: translateY(-1px);
}

.mcp-social-links svg {
  width: 17px;
  height: 17px;
  flex: 0 0 auto;
  fill: currentColor;
}

.mcp-social-links--contact {
  margin: 4px 0 2px;
}

/*
 * Extra visual energy belongs only to the official red/white palette.
 * The black/gold version is intentionally untouched.
 */
body.mcp-color-scheme-official .mcp-block-intro {
  background:
    radial-gradient(circle at 88% 18%, rgb(201 56 50 / 16%), transparent 30%),
    linear-gradient(135deg, #fff 0%, #fff8f7 48%, #fde9e7 100%);
}

body.mcp-color-scheme-official .mcp-block-portfolio {
  background:
    radial-gradient(circle at 8% 92%, rgb(201 56 50 / 13%), transparent 28%),
    linear-gradient(180deg, #fff 0%, #fff4f3 100%);
}

body.mcp-color-scheme-official .mcp-block-services {
  background:
    linear-gradient(112deg, rgb(201 56 50 / 7%) 0 22%, transparent 22% 72%, rgb(201 56 50 / 10%) 72% 100%),
    #fff;
}

body.mcp-color-scheme-official .mcp-block-services .method-card:nth-child(2) {
  border-color: rgb(201 56 50 / 32%);
  background: linear-gradient(145deg, #fff 12%, #fff0ef 100%);
}

body.mcp-color-scheme-official .mcp-block-services .method-card:nth-child(3) {
  border-color: rgb(201 56 50 / 46%);
  background: linear-gradient(145deg, #fff5f4 0%, #fbdcda 100%);
}

body.mcp-color-scheme-official .mcp-block-formats {
  background:
    radial-gradient(circle at 4% 14%, rgb(201 56 50 / 15%), transparent 27%),
    linear-gradient(180deg, #fff 0%, #fff7f6 54%, #fff 100%);
}

body.mcp-color-scheme-official .mcp-block-formats .format-panel {
  border-color: rgb(201 56 50 / 42%);
  background: linear-gradient(155deg, #fff 0%, #fee8e6 100%);
}

body.mcp-color-scheme-official .mcp-block-formats .format-item:hover,
body.mcp-color-scheme-official .mcp-block-formats .format-item:focus-within {
  border-color: var(--brand-red);
  background: #fff1f0;
  box-shadow: 0 18px 48px rgb(201 56 50 / 13%);
}

body.mcp-color-scheme-official .mcp-client-logos {
  background: linear-gradient(180deg, #fff 0%, #fff1f0 48%, #fff 100%);
}

body.mcp-color-scheme-official .mcp-block-cta .cta-box {
  border-color: rgb(201 56 50 / 60%);
  background:
    radial-gradient(circle at 86% 18%, rgb(201 56 50 / 20%), transparent 32%),
    linear-gradient(135deg, #fff 0%, #ffe9e7 100%);
  box-shadow: 0 24px 70px rgb(201 56 50 / 14%);
}

body.mcp-color-scheme-official .mcp-block-contact {
  background:
    radial-gradient(circle at 94% 12%, rgb(201 56 50 / 14%), transparent 26%),
    #fff;
}

body.mcp-color-scheme-official .mcp-social-links a {
  border-color: rgb(201 56 50 / 42%);
  color: #8f211d;
  background: #fff5f4;
}

@media (prefers-reduced-motion: reduce) {
  .mcp-social-links a {
    transition: none;
  }
}
