.detail-hero { position: relative; isolation: isolate; overflow: hidden; padding: 126px 0 68px; background: #faf5f3; }
.detail-hero-wash { position: absolute; z-index: -1; inset: 0; background: radial-gradient(ellipse at 85% 35%, #e6c5c3a8, transparent 55%), radial-gradient(ellipse at 10% 100%, #f1d6d7b3, transparent 55%), linear-gradient(135deg, #fffdfc, #f8f1ee); }
.detail-breadcrumb { display: flex; gap: 14px; font-size: 11px; color: var(--muted); margin-bottom: 44px; }
.detail-breadcrumb a:hover { color: var(--rose-deep); text-decoration: underline; }
.detail-hero-grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 70px; align-items: center; }
.detail-hero h1 { font: 500 clamp(32px, 3.3vw, 48px)/1.65 var(--serif); margin-top: 22px; letter-spacing: .025em; }
.detail-hero h1 em { font-style: normal; color: var(--rose-deep); }
.detail-hero-description { margin-top: 22px; font-size: 14px; line-height: 2.1; color: #615e62; }
.detail-hero-note { font-size: 12px; margin-top: 20px; color: #765e64; }
.detail-menu { padding: 26px 30px; background: #fffdfcd9; border: 1px solid #fffdfc; border-radius: 4px 38px 4px 4px; box-shadow: 0 18px 50px #76515c09; }
.detail-menu>p { font-size: 12px; color: var(--rose-deep); margin-bottom: 12px; }
.detail-menu>a { display: grid; grid-template-columns: 24px 1fr auto; align-items: center; gap: 10px; padding: 15px 0; border-bottom: 1px solid #e6d9d6; font-size: 13px; line-height: 1.7; transition: color .2s; }
.detail-menu>a:last-child { border-bottom: 0; padding-bottom: 4px; }
.detail-menu>a:hover { color: var(--rose-deep); }
.detail-menu-no { font: italic 500 20px var(--roman); color: var(--rose-deep); }
.detail-menu>a>span:last-child { color: var(--rose-deep); }
.detail-section { display: grid; grid-template-columns: .8fr 1.2fr; gap: 64px; padding-block: 74px; border-bottom: 1px solid var(--line); }
.detail-section:last-of-type { border-bottom: 0; }
.detail-category { margin-top: 18px; color: var(--rose-deep); font-size: 13px; font-weight: 500; }
.detail-overview h2 { margin-top: 12px; font: 500 28px/1.75 var(--serif); }
.detail-intro { margin-top: 22px; font-size: 13px; line-height: 2.1; color: var(--muted); }
.detail-proof { display: flex; gap: 14px; align-items: center; justify-content: space-between; padding-top: 18px; margin-top: 26px; border-top: 1px solid #dcc7c6; font-size: 11px; color: var(--rose-deep); line-height: 1.9; }
.detail-proof:hover>span:first-child { text-decoration: underline; text-underline-offset: 4px; }
.detail-situation { padding: 17px 20px; margin-bottom: 20px; border-left: 2px solid var(--rose); background: #f7f0ee; font-size: 13px; line-height: 1.9; }
.detail-tasks { display: grid; grid-template-columns: 1fr 1fr; gap: 22px 24px; list-style: none; }
.detail-tasks h3 { font-size: 13px; font-weight: 500; line-height: 1.8; padding-bottom: 9px; border-bottom: 1px solid #e8dedb; }
.detail-tasks p { margin-top: 10px; font-size: 12px; line-height: 2; color: var(--muted); }
.detail-example { margin-top: 26px; padding: 18px 20px; background: #f9f6f3; }
.detail-example h3 { font-size: 10px; letter-spacing: .06em; font-weight: 500; color: var(--rose-deep); }
.detail-example p { font-size: 12px; line-height: 2; margin-top: 8px; }
.detail-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 20px; margin-top: 24px; }
.detail-consult { display: inline-flex; align-items: center; justify-content: space-between; gap: 24px; padding: 14px 20px; background: var(--rose-deep); color: var(--paper); border-radius: 4px; font-size: 12px; line-height: 1.8; transition: background .2s; }
.detail-consult:hover { background: var(--rose-dark); }
.detail-back { font-size: 10px; color: var(--muted); padding-block: 12px; }
.detail-back:hover { color: var(--rose-deep); text-decoration: underline; }
.detail-next { padding: 76px 0; background: radial-gradient(ellipse at 80% 20%, #e7c6c7a6, transparent 60%), linear-gradient(115deg, #f8f1ed, #f2e3e3); }
.detail-next h2 { font: 500 34px/1.7 var(--serif); margin-top: 22px; }
.detail-next .wrap>p:not(.section-kicker) { font-size: 13px; margin-top: 20px; line-height: 2.1; color: #675a5e; }
.detail-next-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 25px; margin-top: 28px; }
.detail-next .wrap>.detail-next-note { font-size: 11px; margin-top: 24px; }
@media (max-width: 1050px) {
  .detail-hero-grid { gap: 34px; grid-template-columns: 1.2fr 1fr; }
  .detail-menu { padding: 23px; }
  .detail-section { gap: 36px; grid-template-columns: .85fr 1.15fr; }
  .detail-overview h2 { font-size: 25px; }
}
@media (max-width: 760px) {
  .detail-hero { padding-top: 110px; padding-bottom: 46px; }
  .detail-breadcrumb { margin-bottom: 30px; }
  .detail-hero-grid { grid-template-columns: 1fr; gap: 30px; }
  .detail-hero h1 { font-size: 36px; }
  .detail-hero-description { font-size: 13px; }
  .detail-menu { padding: 22px 26px; }
  .detail-menu>a { min-height: 48px; padding-block: 12px; }
  .detail-section { grid-template-columns: 1fr; gap: 28px; padding-block: 50px; }
  .detail-overview h2 { font-size: 28px; }
  .detail-intro { margin-top: 16px; }
  .detail-proof { margin-top: 18px; padding-top: 14px; }
  .detail-next { padding-block: 54px; }
  .detail-next h2 { font-size: 28px; }
}
@media (max-width: 480px) {
  .detail-hero { padding-top: 94px; }
  .detail-hero h1 { font-size: clamp(27px, 7.8vw, 34px); }
  .detail-hero-description br { display: none; }
  .detail-hero-note { font-size: 11px; }
  .detail-menu { padding: 20px; border-radius: 4px 28px 4px 4px; }
  .detail-menu>a { font-size: 12px; gap: 8px; }
  .detail-overview h2 { font-size: 25px; }
  .detail-tasks { grid-template-columns: 1fr; gap: 20px; }
  .detail-tasks h3 { font-size: 14px; }
  .detail-tasks p, .detail-intro, .detail-example p { font-size: 13px; }
  .detail-situation { padding: 15px 16px; }
  .detail-example { padding: 18px 16px; }
  .detail-consult { width: 100%; font-size: 12px; gap: 12px; padding-inline: 17px; }
  .detail-actions { gap: 8px; }
  .detail-next h2 { font-size: 25px; }
  .detail-next .wrap>p br { display: none; }
  .detail-next-actions { align-items: flex-start; flex-direction: column; gap: 20px; }
  .detail-next-actions .text-link { padding-block: 8px; }
}