/* KFFART V7.9 — Life hero typography/layout follows the existing About Me hero.
 * Visual baseline: assets/about-me-v1/about.css + v72/v73 refinements.
 * This is a Life-only style override. The approved 16:9 background and hotspots stay intact. */
#detail-view.life-view .life-scene::after {
 background:
   linear-gradient(90deg,rgba(6,17,23,.89) 0%,rgba(7,18,24,.74) 20%,rgba(9,23,27,.42) 39%,rgba(9,23,27,.06) 68%,transparent 82%),
   linear-gradient(0deg,rgba(4,13,18,.50) 0%,transparent 17%,transparent 88%,rgba(4,11,16,.12))!important;
}
#detail-view.life-view .life-hero {
 position:absolute!important;
 top:clamp(13px,2.1vw,30px)!important;
 bottom:auto!important;
 left:clamp(10px,1.5vw,25px)!important;
 right:auto!important;
 width:min(520px,34%)!important;
 max-width:none!important;
 margin:0!important;
 padding:0!important;
 border:0!important;
 border-radius:0!important;
 background:none!important;
 box-shadow:none!important;
 backdrop-filter:none!important;
 -webkit-backdrop-filter:none!important;
 z-index:15!important;
 color:#f6f2e8;
 text-shadow:0 2px 20px rgba(5,21,30,.60);
 pointer-events:none;
}
#detail-view.life-view .life-hero .life-kicker {
 display:flex;
 align-items:center;
 gap:12px;
 font-size:11px!important;
 font-weight:700;
 letter-spacing:.22em!important;
 color:#e4c8a2!important;
}
#detail-view.life-view .life-hero .life-kicker::before {
 content:"";
 width:26px;height:1px;
 background:#d9a96a;
 box-shadow:0 0 7px #eeac64;
}
#detail-view.life-view .life-hero h1 {
 font-size:clamp(60px,6.7vw,118px)!important;
 font-weight:800!important;
 line-height:1.18!important;
 letter-spacing:-.066em!important;
 color:#faf4e8!important;
 margin:24px 0 10px!important;
 white-space:nowrap;
}
#detail-view.life-view .life-hero h1 span {
 display:block;
 white-space:normal;
 font-family:inherit!important;
 font-size:clamp(34px,4.05vw,67px)!important;
 font-weight:700!important;
 line-height:1.36!important;
 letter-spacing:-.075em!important;
 color:#f2c998!important;
 margin:5px 0 0!important;
}
#detail-view.life-view .life-hero .life-tagline {
 font-size:clamp(16px,1.35vw,21px)!important;
 line-height:1.76!important;
 font-weight:500!important;
 letter-spacing:normal!important;
 margin:19px 0 17px!important;
 color:#f3e6d6!important;
 max-width:450px;
}
#detail-view.life-view .life-hero .life-intro {
 font-size:clamp(11px,.87vw,14px)!important;
 line-height:2.05!important;
 margin:0!important;
 max-width:450px;
 color:#c4cad0!important;
}
#detail-view.life-view .life-hero .life-actions {
 display:flex;align-items:center;flex-wrap:wrap;
 gap:14px!important;
 margin:24px 0 0!important;
}
#detail-view.life-view .life-hero .life-primary,
#detail-view.life-view .life-hero .life-return {
 appearance:none;
 cursor:pointer;
 display:inline-flex;align-items:center;justify-content:center;
 text-decoration:none;
 min-height:44px!important;
 border-radius:100px;
 padding:13px 20px!important;
 font-size:13px!important;
 font-weight:700!important;
 letter-spacing:.015em!important;
 transition:transform .16s,background .16s,border-color .16s;
 pointer-events:auto;
}
#detail-view.life-view .life-hero .life-primary {
 color:#0d1a20!important;
 border:1px solid #eebd7c!important;
 background:linear-gradient(110deg,#f2d4a3,#f3a970)!important;
 box-shadow:0 8px 22px #dc8d4345!important;
}
#detail-view.life-view .life-hero .life-return {
 color:#f5dfc2!important;
 border:1px solid #e2d1b863!important;
 background:rgba(16,33,39,.70)!important;
 box-shadow:none!important;
}
#detail-view.life-view .life-hero .life-primary:hover,
#detail-view.life-view .life-hero .life-return:hover {transform:translateY(-2px);}
#detail-view.life-view .life-hero .life-primary:focus-visible,
#detail-view.life-view .life-hero .life-return:focus-visible {
 outline:2px solid #fee3ac;outline-offset:4px;
}
@media(min-width:731px) and (max-width:1120px) {
 #detail-view.life-view .life-hero {
  width:min(490px,43%)!important;
 }
 #detail-view.life-view .life-hero h1 {
  font-size:clamp(57px,5.9vw,78px)!important;
 }
 #detail-view.life-view .life-hero h1 span {
  font-size:clamp(32px,4.05vw,49px)!important;
 }
}
@media(max-width:730px) {
 #detail-view.life-view .life-scene::after {
  background:
   linear-gradient(180deg,rgba(5,19,27,.83) 0%,rgba(5,19,27,.68) 26%,rgba(5,19,27,.31) 42%,transparent 56%),
   linear-gradient(0deg,rgba(7,25,30,.72),transparent 24%)!important;
 }
 #detail-view.life-view .life-hero {
  top:12px!important;
  left:12px!important;
  right:12px!important;
  bottom:auto!important;
  width:auto!important;
 }
 #detail-view.life-view .life-hero h1 {
  font-size:clamp(52px,12vw,72px)!important;
  line-height:1.13!important;
  margin:12px 0 4px!important;
 }
 #detail-view.life-view .life-hero h1 span {
  font-size:clamp(30px,7vw,43px)!important;
  line-height:1.24!important;
  margin:5px 0 0!important;
 }
 #detail-view.life-view .life-hero .life-tagline {
  font-size:15px!important;
  line-height:1.66!important;
  margin:11px 0 12px!important;
  max-width:370px;
 }
 #detail-view.life-view .life-hero .life-intro {
  max-width:325px;
  font-size:11px!important;
  line-height:1.77!important;
 }
 #detail-view.life-view .life-hero .life-actions {
  margin-top:18px!important;
  gap:9px!important;
 }
 #detail-view.life-view .life-hero .life-primary,
 #detail-view.life-view .life-hero .life-return {
  min-height:39px!important;
  font-size:12px!important;
  padding:10px 13px!important;
 }
}
@media(prefers-reduced-motion:reduce) {
 #detail-view.life-view .life-primary,
 #detail-view.life-view .life-return {transition:none!important;}
}