/* v166 — minimal owner-approved marble Hero with a progressively enhanced video prism.
   The complete artwork is always the fast, stable fallback. */
.hero-art > .welcome,
.hero-art > .hero-flourish,
.hero-art > .hero-caption,
.hero-art > .autumn-leaves,
.hero-art > .parchment-veil,
.hero-art > .se-hero-clean-layer,
.se-opening-curtain {
  display: none !important;
}

  .hero-art {
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding-top: var(--se-header-h) !important;
    overflow: hidden !important;
    background: #d2bea0 !important;
  }

  .hero-art .hero-collage {
    position: relative !important;
    z-index: 1 !important;
    top: auto !important;
    left: auto !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1672 / 941 !important;
    min-height: 0 !important;
    max-width: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    filter: none !important;
  }

  .se-hero-prism {
    --se-prism-copper: #a86c44;
    --se-prism-dark-purple: #2f122d;
    position: absolute;
    z-index: 2;
    top: calc(var(--se-header-h) + 40.85dvw);
    left: 50%;
    width: clamp(116px, 14.8vw, 248px);
    aspect-ratio: 1;
    box-sizing: border-box;
    overflow: hidden;
    border: 1px solid var(--se-prism-dark-purple);
    border-radius: 50%;
    pointer-events: none;
    transform: translate(-50%, -50%);
    isolation: isolate;
    background: rgba(238, 224, 201, .24);
    box-shadow:
      0 18px 28px rgba(67, 35, 29, .24),
      0 3px 8px rgba(67, 35, 29, .2),
      inset 0 0 0 2px rgba(255, 250, 235, .36),
      inset 0 -18px 32px rgba(72, 32, 54, .2);
  }

  .se-hero-prism::after {
    content: "";
    position: absolute;
    z-index: 5;
    inset: 1px;
    border: 1px solid var(--se-prism-copper);
    border-radius: inherit;
    pointer-events: none;
  }

  .se-hero-prism video,
  .se-hero-prism > i {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border-radius: inherit;
  }

  .se-hero-prism video {
    display: block;
    inset: -8%;
    width: 116%;
    height: 116%;
    max-width: none;
    max-height: none;
    border-radius: 0;
    opacity: 0;
    object-fit: cover;
    object-position: center;
    clip-path: none;
    transform: none;
    filter: saturate(1.08) contrast(1.035) brightness(1.025);
    transition: opacity 720ms ease;
  }

  .se-hero-prism.se-has-video video { opacity: 1; }

  .se-hero-prism-refraction {
    z-index: 2;
    background:
      radial-gradient(circle at 50% 48%, transparent 0 54%, rgba(255,255,255,.05) 60%, rgba(255,230,184,.2) 68%, rgba(111,65,129,.18) 74%, rgba(21,9,24,.24) 82%, transparent 89%),
      conic-gradient(from 215deg, rgba(255,206,146,.17), rgba(162,203,255,.12) 16%, transparent 31% 68%, rgba(232,175,255,.16) 82%, rgba(255,206,146,.17));
    box-shadow:
      inset 12px 0 18px rgba(255, 239, 204, .12),
      inset -13px -5px 19px rgba(62, 27, 62, .2);
    mix-blend-mode: screen;
  }

  .se-hero-prism-glass {
    z-index: 3;
    background:
      radial-gradient(ellipse at 31% 20%, rgba(255,255,255,.5) 0 5%, rgba(255,255,255,.14) 14%, transparent 31%),
      radial-gradient(ellipse at 70% 80%, transparent 53%, rgba(255,218,178,.16) 72%, transparent 90%),
      linear-gradient(113deg, transparent 13%, rgba(255,245,222,.24) 31%, rgba(176,146,255,.15) 43%, transparent 58%);
    box-shadow: inset 0 0 28px rgba(255,255,255,.3), inset 0 0 5px rgba(93,42,76,.44);
    mix-blend-mode: screen;
  }

  .se-hero-prism-light {
    z-index: 4;
    inset: -55% !important;
    width: 210% !important;
    height: 210% !important;
    background: conic-gradient(from calc(185deg + var(--se-prism-scroll, 0) * 70deg), transparent 0 34%, rgba(255,226,150,.2) 39%, rgba(165,205,255,.24) 43%, rgba(233,169,255,.22) 47%, transparent 53% 100%);
    filter: blur(9px);
    transform: translateX(calc((var(--se-prism-scroll, 0) - .5) * 12%)) rotate(calc(var(--se-prism-scroll, 0) * 25deg));
    opacity: .88;
  }

@media (max-width: 800px) {
  .hero-art {
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding-top: var(--se-header-h) !important;
    overflow: hidden !important;
    background: #d2bea0 !important;
  }

  .hero-art .hero-collage {
    position: relative !important;
    inset: auto !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 1672 / 941 !important;
    object-fit: contain !important;
    object-position: center !important;
    transform: none !important;
  }

  .se-hero-prism {
    display: none;
  }
}

@media (max-width: 800px) and (hover: hover) and (pointer: fine) {
  .se-hero-prism {
    display: block;
    width: max(52px, 14.8vw);
    min-width: 0;
    max-width: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .se-hero-prism-light { display: none; }
  .se-hero-prism video { opacity: 0 !important; transition: none; }
}

/* Lift only the lettering area; the original painted prism remains aligned. */
.se-hero-raised-lettering{display:none}
@media(min-width:801px){html body .hero-art>.se-hero-raised-lettering{position:absolute;z-index:1;top:var(--se-header-h);left:0;display:block;width:100%;height:auto;max-width:100%;transform:translateY(-4vw);clip-path:inset(0 0 45% 0);pointer-events:none}}

/* Stretch only the original empty marble band between lettering and prism.
   Its boundary rows match the untouched artwork, so no erased-text patch is needed. */
.se-hero-lettering-clear{display:none}
@media(min-width:801px){html body .hero-art>.se-hero-lettering-clear{display:block;position:absolute;z-index:1;top:calc(var(--se-header-h) + 26.95394737vw);left:0;width:100%;height:5.68839713vw;background:url('/v25/assets/desktop-hero-colourland-marble-prism-clean-v3.png') center -104.28728070vw/100% 189.61323764vw no-repeat;pointer-events:none}}
