
@import url("/assets/public-p3.css");
.detail-hero{padding-top:90px;max-width:1500px;margin:auto}.detail-hero h1{font-size:clamp(54px,7vw,96px)}.detail-hero p{max-width:760px;font-size:18px;line-height:1.75;color:#a1b4ae}
.breadcrumb{font-size:11px;color:#7f938c;margin-bottom:30px}.breadcrumb a{text-decoration:none}
.detail-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:60px}.detail-copy h2{font-size:clamp(38px,5vw,66px);letter-spacing:-.055em;line-height:1.04}.detail-copy p{line-height:1.8;color:#91a49e}.feature-list{border-top:1px solid #294048}.feature-row{display:grid;grid-template-columns:40px 1fr;gap:16px;padding:18px 0;border-bottom:1px solid #294048}.feature-row span{color:var(--mint);font-size:11px}.feature-row b{display:block;font-size:20px;margin-bottom:5px}.feature-row p{font-size:13px;margin:0;color:#8fa29c;line-height:1.55}
.detail-example{background:var(--paper);color:var(--ink)}.detail-example .example-stage{max-width:1000px;margin-top:35px}
.faq{max-width:900px}.faq details{border-top:1px solid #294048;padding:18px 0}.faq summary{cursor:pointer;font-weight:900}.faq p{color:#90a39d;line-height:1.7}
.related-links{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.related-links a{border:1px solid #294048;padding:18px;text-decoration:none}.related-links b{display:block}.related-links small{color:#789087}
@media(max-width:850px){.detail-grid{grid-template-columns:1fr;gap:30px}.related-links{grid-template-columns:1fr}}


/* P3.1 detail navigation — intentionally one action only */
.detail-home-wrap{
  max-width:1500px;
  margin:0 auto;
  padding:22px max(22px,5vw) 0;
}
.detail-home{
  display:inline-flex;
  align-items:center;
  min-height:44px;
  padding:9px 12px;
  border:1px solid #294048;
  border-radius:8px;
  color:#c3d4cf;
  text-decoration:none;
  font-size:12px;
  font-weight:900;
  letter-spacing:-.01em;
}
.detail-home:hover,
.detail-home:focus-visible{
  border-color:#76d9c0;
  color:#95f2d7;
  outline:none;
}
@media(max-width:760px){
  .detail-home-wrap{padding:14px 18px 0}
  .detail-home{min-height:46px;padding:10px 13px;font-size:13px}
}


/* P3.2 detail header navigation */
.detail-nav{
  display:flex!important;
  align-items:center;
  gap:8px!important;
}
.detail-nav .detail-home-btn{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 18px!important;
  border:1px solid #36545c;
  border-radius:12px!important;
  background:transparent;
  color:#dce9e5!important;
  font-size:14px!important;
  font-weight:900;
}
.detail-nav .detail-home-btn:hover,
.detail-nav .detail-home-btn:focus-visible{
  border-color:#77dbc2;
  color:#95f2d7!important;
  background:#0d1b22!important;
  outline:none;
}
.detail-nav .nav-cta{
  min-height:48px;
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  padding:0 18px!important;
  border-radius:12px!important;
  font-size:14px!important;
  font-weight:900;
}
@media(max-width:760px){
  .site-header .detail-nav{
    display:flex!important;
    gap:6px!important;
  }
  .site-header .detail-nav a{
    display:inline-flex!important;
  }
  .detail-nav .detail-home-btn,
  .detail-nav .nav-cta{
    min-height:44px;
    padding:0 13px!important;
    font-size:13px!important;
    border-radius:10px!important;
  }
}


/* P3.2.1 cache-busted hard visibility guard */
@media(max-width:760px){
  header.site-header nav.detail-nav{
    display:flex!important;
    visibility:visible!important;
    opacity:1!important;
  }
  header.site-header nav.detail-nav a.detail-home-btn{
    display:inline-flex!important;
    visibility:visible!important;
    opacity:1!important;
    width:auto!important;
    max-width:none!important;
    position:static!important;
  }
}
