/* 1.1: mockup composition, applied to presentation components only. */
.mc-cardhouse { --mc-gutter: clamp(18px,3vw,56px); }
.mc-cardhouse :is(.tcgv-container,.cs-wrap) { width: calc(100% - 2*var(--mc-gutter)); }
.mc-cardhouse .tcgv-header .tcgv-branding__name,
.mc-cardhouse .tcgv-footer .sd-footer-brand { text-transform: uppercase; }
.mc-cardhouse .tcgv-header .tcgv-branding__name { font-size: clamp(22px,2.35vw,34px) !important; }
.mc-cardhouse .tcgv-header--1 .tcgv-header__inner { padding-top: 16px; }
.mc-cardhouse .tcgv-header--1 .tcgv-nav { margin-top: 14px; }
.mc-cardhouse .tcgv-menu > li > a { font-size: 15px; padding-block: 15px; }
.mc-cardhouse .sd-header-search .tcgv-search { background: var(--tcgv-surface); }

/* Full-scene artwork forms the hero, behind real editable text and links. */
.mc-cardhouse .cs-homepage { display: grid; grid-template-columns: repeat(12,minmax(0,1fr)); }
.mc-cardhouse .cs-homepage > section { grid-column: 1/-1; min-width: 0; }
.mc-cardhouse .cs-homepage > .cs-hero {
  width: 100%; max-width: none; margin: 0; padding: 0 var(--mc-gutter);
  min-height: clamp(400px,39.5vw,760px); display: flex; align-items: center;
  background: var(--tcgv-surface-2);
}
.mc-cardhouse .cs-hero::before { content: none; }
.mc-cardhouse .cs-homepage .cs-hero-columns { display: block; width: 100%; }
.mc-cardhouse .cs-homepage .cs-hero-copy-column {
  position: relative; z-index: 2; width: 47%; padding-block: 40px; max-width: 820px;
}
.mc-cardhouse .cs-homepage .cs-hero-art-column { position: absolute; inset: 0; width: 100%; z-index: 0; }
.mc-cardhouse .cs-homepage .cs-hero-image { width: 100%; height: 100%; aspect-ratio: auto; border-radius: 0; background: none; }
.mc-cardhouse .cs-homepage .cs-hero-image img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.mc-cardhouse .cs-homepage .cs-hero-title {
  font-size: clamp(36px,4.8vw,calc(var(--tcgv-fs-h1)*1.32));
  max-width: none; line-height: 1.02; letter-spacing: -.055em; text-wrap: balance; margin-bottom: 22px;
}
.mc-cardhouse .cs-homepage .cs-eyebrow { font-size: 14px !important; letter-spacing: .045em; }
.mc-cardhouse .cs-homepage .cs-hero-copy { max-width: 550px; font-size: clamp(16px,1.85vw,24px); line-height: 1.4; }
.mc-cardhouse .cs-homepage .wp-block-button__link { font-size: 16px; min-height: 50px; padding: 14px 26px; }
.mc-cardhouse .cs-homepage h2 {
  font-size: clamp(28px,3.65vw,calc(var(--tcgv-fs-h2)*1.3)); line-height: 1.06; margin-bottom: 20px;
}
.mc-cardhouse .cs-homepage > .cs-section { padding-block: calc(var(--tcgv-section-gap)*.5); }
.mc-cardhouse .cs-homepage [data-collector-section="info"] { padding-block: 18px; }
.mc-cardhouse .cs-homepage .cs-info-item h3 { font-size: 15px; }
.mc-cardhouse .cs-homepage .cs-info-item { padding-block: 4px; }

/* The full approved tile framing is retained; HTML labels sit over the artwork. */
.mc-cardhouse .cs-homepage .cs-four-grid { gap: 14px; }
.mc-cardhouse .cs-homepage .cs-category-image { aspect-ratio: 1.4; height: auto; }
.mc-cardhouse .cs-homepage .cs-category-image img { object-fit: cover; object-position: center; }
.mc-cardhouse .cs-homepage .cs-category-link {
  padding: 34px 20px 18px !important; background: linear-gradient(transparent,rgba(3,10,25,.55));
}
.mc-cardhouse .cs-homepage .cs-category-link a {
  font-size: clamp(18px,2.2vw,28px); font-weight: 750; line-height: 1.08; padding-right: 25px; position: relative;
}
.mc-cardhouse .cs-homepage .cs-category-link a::after {
  content: '→'; float: none; position: absolute; right: 0; bottom: 0; font-size: 1.1em;
}
.mc-cardhouse .cs-homepage #mc-formats .cs-category-image { aspect-ratio: 1.6; }

/* Product output is unchanged. The home collection uses an editorial row. */
.mc-cardhouse .cs-homepage .cs-product-grid { gap: 0 !important; }
.mc-cardhouse .cs-homepage .tcgv-card {
  border: 0; border-right: 1px solid var(--tcgv-border); border-radius: 0; overflow: visible; padding-inline: 20px;
}
.mc-cardhouse .cs-homepage .tcgv-card:nth-child(4n) { border-right: 0; }
.mc-cardhouse .cs-homepage .tcgv-card__img { padding: 8px; }
.mc-cardhouse .cs-homepage .tcgv-site .tcgv-card .tcgv-card__body,
.mc-cardhouse .tcgv-site .cs-homepage .tcgv-card .tcgv-card__body { padding: 16px 0; }
.mc-cardhouse .tcgv-site .cs-homepage .tcgv-card .tcgv-card__title { font-size: 16px; line-height: 1.3; }
.mc-cardhouse .cs-homepage .tcgv-card__actions { margin-top: 8px; }
.mc-cardhouse .tcgv-site .cs-homepage .tcgv-card .tcgv-card__actions .button {
  background: transparent; color: var(--tcgv-link); border: 0 !important; justify-content: flex-start;
  padding: 8px 0; font-size: 15px !important; min-height: 44px;
}
.mc-cardhouse .tcgv-site .cs-homepage .tcgv-card .tcgv-card__actions .button:hover {
  color: var(--tcgv-accent-2); background: transparent; text-decoration: underline;
}

/* Wide banner, with the artwork merged into the entire section. */
.mc-cardhouse .cs-homepage > .cs-spotlight {
  width: 100%; max-width: none; border-radius: 0; margin-block: 20px;
  padding: 28px var(--mc-gutter); min-height: clamp(220px,21vw,380px);
  display: flex; align-items: center; overflow: hidden;
}
.mc-cardhouse .cs-spotlight > .wp-block-columns { display: block; width: 100%; }
.mc-cardhouse .cs-spotlight .cs-hero-copy-column { position: relative; z-index: 2; width: 45%; }
.mc-cardhouse .cs-spotlight .cs-hero-art-column { position: absolute; inset: 0; width: 100%; }
.mc-cardhouse .cs-homepage .cs-spotlight-image { width: 100%; max-width: none; height: 100%; aspect-ratio: auto; border-radius: 0; }
.mc-cardhouse .cs-spotlight-image img { width: 100%; height: 100%; object-fit: cover; }
.mc-cardhouse .cs-homepage .cs-spotlight h2 { font-size: clamp(32px,4vw,60px); line-height: 1.02; max-width: 13ch; margin-bottom: 18px; }
.mc-cardhouse .cs-spotlight .wp-block-buttons { margin-top: 18px; }

/* Sports copy on the left, three category images on the right. */
@media (min-width: 901px) {
  .mc-cardhouse .cs-homepage #mc-sports {
    display: grid; grid-template-columns: minmax(0,.95fr) minmax(0,2.05fr); gap: 10px 30px; align-items: start;
  }
  .mc-cardhouse #mc-sports > h2 { grid-column: 1; grid-row: 1; max-width: 11ch; margin: 0; }
  .mc-cardhouse #mc-sports > p { grid-column: 1; grid-row: 2; margin: 0; }
  .mc-cardhouse #mc-sports > .wp-block-buttons { grid-column: 1; grid-row: 3; margin-top: 8px; }
  .mc-cardhouse #mc-sports > .cs-four-grid { grid-column: 2; grid-row: 1/4; }
  .mc-cardhouse #mc-sports .cs-category-image { aspect-ratio: 1.2; }
}

/* Adjacent story + FAQ share a row without changing section-editor markup. */
@media (min-width: 901px) {
  .mc-cardhouse .cs-homepage:has(#mc-story + #mc-faq) > #mc-story {
    grid-column: 1/5; width: auto; max-width: none; margin-left: max(var(--mc-gutter),calc((100vw - var(--tcgv-container))/2));
    margin-right: 30px; text-align: left; padding-block: 26px; align-self: start;
  }
  .mc-cardhouse .cs-homepage:has(#mc-story + #mc-faq) > #mc-faq {
    grid-column: 5/-1; width: auto; max-width: none; margin-left: 0;
    margin-right: max(var(--mc-gutter),calc((100vw - var(--tcgv-container))/2)); padding-block: 26px;
  }
  .mc-cardhouse .cs-homepage:has(#mc-story + #mc-faq) #mc-story h2 { max-width: 12ch; }
  .mc-cardhouse .cs-homepage:has(#mc-story + #mc-faq) .mc-faq { display: block; border-left: 1px solid var(--tcgv-border); padding: 0 0 0 30px; }
  .mc-cardhouse .cs-homepage:has(#mc-story + #mc-faq) .mc-faq > h2 { display: none; }
  .mc-cardhouse .mc-faq details[open] { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.2fr); gap: 22px; }
  .mc-cardhouse .mc-faq details[open] > p { padding: 15px 14px 15px 0; margin: 0; line-height: 1.5; }
  .mc-cardhouse .mc-faq summary { padding-block: 15px; font-size: 14px; }
}
.mc-cardhouse .cs-homepage #mc-story { padding-block: 28px; }
.mc-cardhouse .mc-faq { padding-block: 0; }
.mc-cardhouse .tcgv-footer__cols { padding-block: 30px; }
.mc-cardhouse .tcgv-footer .sd-footer-brand { font-size: clamp(23px,2.6vw,34px); }

@media (min-width: 761px) and (max-width: 1100px) {
  .mc-cardhouse .cs-homepage .cs-hero-title { font-size: clamp(36px,4.8vw,58px); }
  .mc-cardhouse .cs-homepage .cs-product-grid { grid-template-columns: repeat(var(--tcgv-cols),minmax(0,1fr)) !important; }
  .mc-cardhouse .cs-homepage .tcgv-card { padding-inline: 10px; }
  .mc-cardhouse .cs-homepage .cs-category-link a { font-size: 20px; }
}
@media (max-width: 900px) {
  .mc-cardhouse .cs-homepage #mc-story { text-align: left; }
  .mc-cardhouse .cs-homepage .cs-spotlight h2 { font-size: 36px; }
  .mc-cardhouse .cs-homepage .cs-category-link { padding: 28px 14px 14px !important; }
  .mc-cardhouse .cs-homepage .cs-category-link a { font-size: 20px; }
}
@media (max-width: 760px) {
  .mc-cardhouse .tcgv-header .tcgv-branding__name { font-size: 20px !important; }
  .mc-cardhouse .tcgv-header--1 .tcgv-header__inner { padding-block: 14px; }
  .mc-cardhouse .cs-homepage > .cs-hero { display: block; min-height: 0; padding: 28px var(--mc-gutter) 0; }
  .mc-cardhouse .cs-homepage .cs-hero-copy-column { width: 100%; padding: 0; }
  .mc-cardhouse .cs-homepage .cs-hero-title { font-size: var(--tcgv-fs-h1); line-height: 1.03; }
  .mc-cardhouse .cs-homepage .cs-hero-art-column { position: relative; width: calc(100% + 2*var(--mc-gutter)); margin-inline: calc(-1*var(--mc-gutter)); margin-top: 24px; }
  .mc-cardhouse .cs-homepage .cs-hero-image { height: auto; aspect-ratio: 1.66; }
  .mc-cardhouse .cs-homepage .cs-hero-image img { object-position: right center; }
  .mc-cardhouse .cs-homepage .cs-hero-copy { font-size: 17px; }
  .mc-cardhouse .cs-homepage .cs-eyebrow { font-size: 12px !important; }
  .mc-cardhouse .cs-homepage .cs-category-link a { font-size: 17px; padding-right: 18px; }
  .mc-cardhouse .cs-homepage .cs-category-link { padding: 26px 12px 12px !important; }
  .mc-cardhouse .cs-homepage > .cs-spotlight { padding: 28px var(--mc-gutter) 0; display: block; min-height: 0; }
  .mc-cardhouse .cs-spotlight .cs-hero-copy-column { width: 100%; }
  .mc-cardhouse .cs-spotlight .cs-hero-art-column { position: relative; width: calc(100% + 2*var(--mc-gutter)); margin-inline: calc(-1*var(--mc-gutter)); margin-top: 22px; }
  .mc-cardhouse .cs-homepage .cs-spotlight-image { height: auto; aspect-ratio: 2; }
  .mc-cardhouse .cs-spotlight-image img { object-position: right; object-fit: cover; width: 200%; max-width: none; margin-left: -100%; }
  .mc-cardhouse .cs-homepage .tcgv-card { padding-inline: 10px; }
  .mc-cardhouse .cs-homepage .tcgv-card:nth-child(2n) { border-right: 0; }
  .mc-cardhouse .tcgv-site .cs-homepage .tcgv-card .tcgv-card__title { font-size: 14px; }
  .mc-cardhouse .cs-homepage .cs-product-grid { gap: 16px 0 !important; }
  .mc-cardhouse .cs-homepage .mc-faq { display: block; }
  .mc-cardhouse .cs-homepage .mc-faq > h2 { display: none; }
  .mc-cardhouse .cs-homepage .mc-faq details p { font-size: 14px; }
}