/* Detail-specific layer. Gate B common-gate-b.css is copied unchanged. */
.tf-detail-hero { position:relative; height:500px; overflow:hidden; background:#f7f7ed; isolation:isolate; }
.tf-detail-hero-image { position:absolute; inset:0 0 0 auto; width:58%; height:100%; object-fit:contain; padding:48px 7% 80px; background:#f0f5e9; }
.tf-detail-hero-image.tf-detail-noimage { object-fit:contain; padding:80px 12%; }
.tf-detail-hero::before { content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(90deg,#fffdf7 0%,#fffdf7 31%,rgba(255,253,247,.95) 42%,rgba(255,253,247,.2) 64%,transparent 78%); pointer-events:none; }
.tf-detail-hero-inner { position:relative; z-index:2; height:100%; width:min(100% - 128px,1360px); margin:auto; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; }
.tf-detail-copy { width:46%; min-width:0; }
.tf-detail-pill { display:inline-block; width:auto; white-space:nowrap; min-height:38px; padding:5px 18px; border-radius:999px; background:var(--tf-orange); color:#fff; font-size:16px; font-weight:700; }
.tf-detail-title { color:#073b40; font-size:50px; line-height:1.1; letter-spacing:-.025em; font-weight:800; margin:14px 0 0; overflow-wrap:anywhere; }
.tf-detail-summary { font-size:21px; line-height:1.5; font-weight:600; margin:20px 0 0; }
.tf-detail-chips { display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
.tf-detail-chips span { display:inline-flex; align-items:center; min-height:40px; padding:5px 17px; border-radius:999px; background:#f7efdc; color:#184044; font-size:15px; font-weight:700; }
.tf-detail-actions { display:flex; gap:15px; margin-top:22px; width:min(720px,100%); }
.tf-detail-button { display:flex; justify-content:center; align-items:center; gap:9px; min-height:62px; padding:8px 20px; border:2px solid var(--tf-green); border-radius:18px; font-size:21px; line-height:1.2; font-weight:700; text-align:center; text-decoration:none; cursor:pointer; }
.tf-detail-primary { background:var(--tf-green); color:white; flex:1.45; }
.tf-detail-secondary { background:#fff; color:#087f2e; flex:1; }
.tf-detail-secondary input { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.tf-detail-plus { display:inline-block; width:22px; height:22px; border:2px solid var(--tf-green); border-radius:50%; color:var(--tf-green); font-size:18px; line-height:17px; font-weight:700; text-align:center; flex:none; }
.tf-detail-button:focus-within, .tf-detail-button:focus-visible { outline:3px solid var(--tf-orange); outline-offset:2px; }
.tf-detail-mascot { position:absolute; right:2%; bottom:4%; width:220px; max-height:82%; object-fit:contain; pointer-events:none; }
.tf-detail-overview { width:min(100% - 32px,1360px); margin:8px auto 0; display:grid; grid-template-columns: minmax(0,1.9fr) minmax(0,1fr); gap:16px; align-items:start; }
.tf-detail-overview:has(> :only-child) { grid-template-columns:1fr; }
.tf-detail-panel { border-radius:16px; padding:22px; min-width:0; }
.tf-detail-features { background:#eff8e9; }
.tf-detail-audience { background:#fcf8ed; }
.tf-detail-heading { margin:0 0 15px; color:#073b40; font-size:27px; line-height:1.3; }
.tf-detail-panel-note { margin:-6px 0 15px; color:#41575b; font-size:14px; }
.tf-detail-feature-grid { display:grid; grid-template-columns:repeat(var(--tf-feature-count),minmax(0,1fr)); gap:12px; }
.tf-detail-feature { min-width:0; overflow:hidden; border-radius:14px; background:white; }
.tf-detail-feature img { width:100%; aspect-ratio:3/2; object-fit:contain; display:block; background:#f7f8ef; }
.tf-detail-feature-body { padding:13px; }
.tf-detail-feature h3 { margin:0; color:#073b40; font-size:18px; line-height:1.35; overflow-wrap:anywhere; }
.tf-detail-feature p { margin:7px 0 0; font-size:14px; line-height:1.6; }
.tf-detail-audience-list { display:grid; gap:11px; }
.tf-detail-audience-item { display:flex; align-items:center; min-height:92px; border-radius:15px; padding:13px; background:#fff; color:#173d44; font-size:17px; font-weight:700; line-height:1.4; }
.tf-detail-about { background:#fff; padding:32px max(calc((100vw - 1232px)/2),48px) 30px; }
.tf-detail-about .tf-detail-heading { font-size:29px; }
.tf-detail-about-grid { display:grid; grid-template-columns:38% minmax(0,1fr) 18%; gap:20px; align-items:center; }
.tf-detail-about-image { width:100%; aspect-ratio:1.6; object-fit:cover; border-radius:11px; background:#f6f8ef; }
.tf-detail-about-image.tf-detail-noimage { object-fit:contain; }
.tf-detail-about-text { font-size:16px; line-height:1.8; overflow-wrap:anywhere; }
.tf-detail-about-text p { margin:0 0 12px; }
.tf-detail-about-mascot { width:100%; max-width:220px; justify-self:end; }
.tf-detail-final { min-height:218px; display:flex; justify-content:center; align-items:center; text-align:center; background:url('footer-meadow-pc.png') center bottom/cover no-repeat; }
.tf-detail-final-inner { padding:12px 16px 18px; }
.tf-detail-final p { margin:0 0 15px; color:#073b40; font-size:23px; font-weight:700; line-height:1.35; }
.tf-detail-final .tf-detail-button { width:440px; max-width:100%; flex:none; margin:auto; }
@media(max-width:767px) {
  .tf-detail-hero { height:auto; min-height:310px; }
  .tf-detail-hero-image { width:100%; object-position:75% center; padding:36px 1% 80px 53%; }
  .tf-detail-hero-image.tf-detail-noimage { padding:20px 0 20px 48%; }
  .tf-detail-hero::before { background:linear-gradient(90deg,#fffdf7 0%,rgba(255,253,247,.96) 37%,rgba(255,253,247,.57) 63%,transparent 100%); }
  .tf-detail-hero-inner { width:calc(100% - 32px); height:auto; min-height:310px; justify-content:flex-start; padding-top:20px; padding-bottom:126px; box-sizing:border-box; }
  .tf-detail-copy { width:64%; }
  .tf-detail-pill { min-height:30px; padding:3px 13px; font-size:12px; }
  .tf-detail-title { font-size:28px; line-height:1.12; margin-top:10px; }
  .tf-detail-summary { font-size:16px; line-height:1.48; margin-top:11px; }
  .tf-detail-chips { gap:7px; margin-top:9px; }
  .tf-detail-chips span { min-height:29px; padding:4px 10px; font-size:12px; }
  .tf-detail-mascot { width:118px; height:auto; bottom:105px; right:1%; }
  .tf-detail-actions { position:absolute; left:0; right:0; bottom:13px; margin:0; width:100%; flex-direction:column; gap:8px; }
  .tf-detail-button { min-height:48px; padding:5px 12px; border-radius:15px; font-size:17px; }
  .tf-detail-plus { width:20px; height:20px; font-size:17px; line-height:15px; }
  .tf-detail-overview { display:block; width:100%; margin:0; }
  .tf-detail-panel { padding:12px; border-radius:14px; }
  .tf-detail-heading { font-size:21px; margin-bottom:10px; }
  .tf-detail-panel-note { font-size:12px; margin:-3px 0 9px; }
  .tf-detail-feature-grid { gap:7px; }
  .tf-detail-feature { border-radius:10px; }
  .tf-detail-feature-body { padding:7px; }
  .tf-detail-feature h3 { font-size:13px; line-height:1.35; }
  .tf-detail-feature p { font-size:11px; line-height:1.5; }
  .tf-detail-audience-list { gap:8px; }
  .tf-detail-audience-item { min-height:58px; padding:10px 12px; font-size:15px; }
  .tf-detail-about { padding:17px 14px; }
  .tf-detail-about .tf-detail-heading { font-size:21px; }
  .tf-detail-about-grid { grid-template-columns:42% 58%; gap:10px; }
  .tf-detail-about-text { font-size:13px; line-height:1.62; }
  .tf-detail-about-mascot { display:none; }
  .tf-detail-final { min-height:112px; background-image:url('footer-meadow-sp.png'); }
  .tf-detail-final-inner { padding:3px 8px; }
  .tf-detail-final p { font-size:16px; line-height:1.3; margin-bottom:7px; }
  .tf-detail-final .tf-detail-button { min-height:44px; width:300px; max-width:calc(100vw - 88px); font-size:16px; }
}

/* P1 external CTA label / baseline contract. */
.tf-detail-action-stack{display:flex;min-width:0;flex-direction:column;align-items:stretch}
.tf-detail-action-stack--official{flex:1.45}.tf-detail-action-stack--compare{flex:1}
.tf-detail-action-stack .tf-detail-button{width:100%;flex:none}
.tf-detail-final-inner>.tf-ad-label{margin-bottom:4px}
@media(max-width:767px){
 .tf-detail-actions{align-items:stretch}
 .tf-detail-action-stack{flex:none;width:100%}
 .tf-detail-action-stack--compare>.tf-ad-label--spacer{display:none}
}