.detail-hero { position: relative; min-height: 650px; display: grid; align-items: center; color: var(--white); background: var(--ink); overflow: hidden; isolation: isolate; }
.detail-hero::before { content: ""; position: absolute; z-index: -1; inset: 0; opacity: .08; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='38' viewBox='0 0 44 38'%3E%3Cpath d='M11 1h22l10 18-10 18H11L1 19Z' fill='none' stroke='%23ffffff'/%3E%3C/svg%3E"); }
.detail-hero__grid { display: grid; grid-template-columns: minmax(0, .95fr) minmax(360px, .75fr); align-items: center; gap: clamp(44px, 7vw, 100px); padding-block: 74px; }
.detail-hero__copy { position: relative; z-index: 1; }
.breadcrumb { margin-bottom: 25px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; color: var(--chrome); font-size: 12px; font-weight: 700; }
.breadcrumb a { min-height: 44px; display: inline-flex; align-items: center; color: var(--white); text-decoration: none; }
.breadcrumb a:hover { color: var(--red); }
.detail-hero h1 { max-width: 760px; font-size: clamp(42px, 5.4vw, 70px); font-weight: 800; line-height: .96; text-wrap: balance; }
.detail-hero h1 span { color: var(--red); }
.detail-hero__lead { max-width: 720px; margin-top: 25px; color: #f1eeee; font-size: clamp(16px, 1.5vw, 20px); line-height: 1.6; }
.detail-hero__actions { margin-top: 31px; display: flex; flex-wrap: wrap; gap: 12px; }
.detail-hero__facts { margin: 35px 0 0; padding: 20px 0 0; border-top: 1px solid rgba(255,255,255,.2); display: flex; flex-wrap: wrap; gap: 12px 26px; list-style: none; }
.detail-hero__facts li { display: flex; align-items: center; gap: 9px; color: var(--chrome); font-size: 13px; font-weight: 700; }
.detail-hero__facts svg { width: 22px; height: 22px; }
.detail-hero__media { position: relative; min-height: 520px; border: 1px solid rgba(255,255,255,.16); border-radius: 22px; background: var(--ink-2); box-shadow: 0 30px 70px rgba(0,0,0,.38); overflow: hidden; }
.detail-hero__media::after { content: ""; pointer-events: none; position: absolute; inset: 0; box-shadow: inset 0 0 0 1px rgba(255,255,255,.08); }
.detail-hero__media video { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: cover; background: var(--ink-2); }
.detail-hero__badge { position: absolute; z-index: 2; right: 18px; bottom: 18px; left: 18px; padding: 15px 17px; border-radius: 12px; color: var(--white); background: rgba(23,23,23,.82); backdrop-filter: blur(10px); font-size: 13px; font-weight: 700; }

.detail-intro { background: linear-gradient(180deg, var(--paper), var(--paper-2)); }
.detail-intro__grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(45px, 8vw, 110px); align-items: start; }
.detail-intro__heading { position: sticky; top: 140px; }
.detail-intro__heading > p:last-child { max-width: 470px; margin-top: 20px; color: var(--muted); }
.detail-list { margin: 0; padding: 0; display: grid; gap: 14px; list-style: none; }
.detail-list li { position: relative; min-height: 120px; padding: 25px 25px 24px 66px; border: 1px solid #ddd7d7; border-radius: 14px; background: var(--white); box-shadow: 0 8px 24px rgba(23,23,23,.06); }
.detail-list li::before { content: ""; position: absolute; top: 30px; left: 25px; width: 20px; height: 11px; border-left: 3px solid var(--red); border-bottom: 3px solid var(--red); transform: rotate(-45deg); }
.detail-list h3 { color: var(--ink); font-size: 20px; }
.detail-list p { margin-top: 8px; color: var(--muted); font-size: 14px; }

.detail-showcase { overflow: hidden; }
.detail-showcase__head { max-width: 760px; margin-bottom: 38px; }
.detail-showcase__head > p:last-child { margin-top: 18px; color: var(--muted); }
.detail-showcase__grid { display: grid; grid-template-columns: 1.15fr .85fr .85fr; gap: 18px; }
.detail-showcase figure { position: relative; min-height: 420px; margin: 0; border-radius: var(--radius); background: var(--ink); overflow: hidden; box-shadow: var(--shadow); }
.detail-showcase picture { display: block; height: 100%; }
.detail-showcase img { width: 100%; height: 100%; object-fit: cover; }
.detail-showcase figcaption { position: absolute; right: 0; bottom: 0; left: 0; padding: 65px 22px 20px; color: var(--white); background: linear-gradient(transparent, rgba(23,23,23,.92)); font-size: 14px; font-weight: 800; }

.detail-plan { background: var(--ink); color: var(--white); }
.detail-plan h2 { max-width: 680px; color: var(--white); }
.detail-plan__grid { margin-top: 45px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.detail-plan article { padding: 30px; border: 1px solid rgba(255,255,255,.15); border-radius: 14px; background: rgba(255,255,255,.055); }
.detail-plan b { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; color: var(--white); background: var(--red); font-family: Archivo, sans-serif; }
.detail-plan h3 { margin-top: 20px; color: var(--white); font-size: 21px; }
.detail-plan p { margin-top: 10px; color: var(--chrome); font-size: 14px; }

.detail-quote { background: linear-gradient(180deg, var(--paper), var(--paper-2)); }
.detail-quote__grid { display: grid; grid-template-columns: .78fr 1.22fr; gap: clamp(45px, 7vw, 90px); align-items: start; }
.detail-quote__copy { position: sticky; top: 140px; }
.detail-quote__copy > p:not(.eyebrow) { margin-top: 20px; color: var(--muted); }
.detail-quote__contact { margin-top: 30px; display: flex; flex-wrap: wrap; gap: 10px; }
.detail-quote__contact a { text-decoration: none; }
.detail-form-note { margin-top: -5px; color: var(--muted); font-size: 12px; }

.related-service { padding: 34px 0; color: var(--white); background: var(--red-deep); }
.related-service__inner { display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.related-service p { color: var(--chrome); font-size: 13px; font-weight: 700; }
.related-service h2 { margin-top: 4px; color: var(--white); font-size: clamp(24px, 3vw, 34px); }

@media (max-width: 900px) {
  .detail-hero__grid, .detail-intro__grid, .detail-quote__grid { grid-template-columns: 1fr; }
  .detail-hero__media { width: min(100%, 580px); min-height: 640px; }
  .detail-intro__heading, .detail-quote__copy { position: static; }
  .detail-showcase__grid { grid-template-columns: 1fr 1fr; }
  .detail-showcase figure:first-child { grid-column: 1 / -1; }
}

@media (max-width: 767px) {
  .detail-hero { min-height: 0; }
  .detail-hero__grid { gap: 40px; padding-block: 54px 65px; }
  .detail-hero h1 { font-size: clamp(40px, 12vw, 52px); text-wrap: pretty; }
  .detail-hero__actions { align-items: stretch; flex-direction: column; }
  .detail-hero__actions .btn { width: 100%; }
  .detail-hero__facts { align-items: flex-start; flex-direction: column; }
  .detail-hero__media { min-height: 520px; }
  .detail-list li { padding-inline: 61px 20px; }
  .detail-showcase__grid, .detail-plan__grid { grid-template-columns: 1fr; }
  .detail-showcase figure, .detail-showcase figure:first-child { min-height: 380px; grid-column: auto; }
  .related-service__inner { align-items: flex-start; flex-direction: column; }
  .related-service .btn { width: 100%; }
}