/* A0019656 — Blog UI/UX safety layer
   Purpose: contrast, containment, responsive layout and interaction hardening for all public blog pages.
   This file must load after the canonical yitm.css bundle. */

:root{
  --yitm-blog-ink:var(--yitm-navy);
  --yitm-blog-muted:var(--yitm-copy);
  --yitm-blog-green:var(--yitm-deep);
  --yitm-blog-line:color-mix(in srgb,var(--yitm-primary) 12%,transparent);
  --yitm-blog-page:#f7f4ee;
  --yitm-blog-card:#fff;
  --yitm-blog-soft:var(--yitm-canvas);
  --yitm-blog-blue:var(--yitm-primary);
}
html:has(meta.yb56.yb56) body{overflow-x:hidden;background:var(--yitm-blog-page);color:var(--yitm-blog-ink)}
html:has(meta.yb56.yb56) body main{min-width:0}
html:has(meta.yb56.yb56) body :is(img,svg,video,iframe){max-width:100%;height:auto}
html:has(meta.yb56.yb56) body :is(h1,h2,h3,h4,p,li,a,strong){overflow-wrap:break-word}

/* Content containment: never allow article layouts to bleed to viewport edges. */
html:has(meta.yb56.yb56) body .yitm-triage-post,
html:has(meta.yb56.yb56) body .leadroom-article,
html:has(meta.yb56.yb56) body .yitm-post{
  width:min(1180px,calc(100% - 28px));
  margin-inline:auto;
  padding-inline:0;
}
html:has(meta.yb56.yb56) body :is(.yitm-content,.yitm-article,.leadroom-content,.yitm-proof-series-content){min-width:0}

/* Shared editorial hero: bind the light surface to dark foreground colours.
   This prevents white-title-on-white-background regressions caused by older theme rules. */
html:has(meta.yb56.yb56) body.blog-page .yitm-proof-series-hero{
  width:100%;
  margin:20px auto 32px;
  padding:clamp(22px,4vw,46px);
  border:1px solid var(--yitm-blog-line);
  border-radius:clamp(22px,3vw,34px);
  background:
    radial-gradient(circle at 88% 12%,rgba(45,108,223,.10),transparent 34%),
    linear-gradient(135deg,#fff 0%,#f8fbff 52%,#f7f4ee 100%)!important;
  color:var(--yitm-blog-ink)!important;
  box-shadow:0 18px 50px color-mix(in srgb,var(--yitm-primary) 8%,transparent);
}
html:has(meta.yb56.yb56) body.blog-page .yitm-proof-series-hero :is(.yitm-title,h1){
  color:var(--yitm-blog-ink)!important;
  -webkit-text-fill-color:var(--yitm-blog-ink)!important;
  text-shadow:none!important;
  opacity:1!important;
}
html:has(meta.yb56.yb56) body.blog-page .yitm-proof-series-hero :is(.yitm-subtitle,p:not(.yitm-badge)){
  color:var(--yitm-blog-muted)!important;
  -webkit-text-fill-color:var(--yitm-blog-muted)!important;
  text-shadow:none!important;
  opacity:1!important;
}
html:has(meta.yb56.yb56) body.blog-page .yitm-proof-series-hero .yitm-title{
  max-width:18ch;
  margin:.55rem 0 .75rem;
  font-size:clamp(2rem,4.2vw,4.35rem);
  line-height:1.02;
  letter-spacing:-.035em;
}
html:has(meta.yb56.yb56) body.blog-page .yitm-proof-series-hero .yitm-subtitle{
  max-width:72ch;
  font-size:clamp(1.02rem,1.5vw,1.2rem);
  line-height:1.62;
}
html:has(meta.yb56.yb56) body.blog-page .yitm-proof-series-hero .yitm-badge{
  display:inline-flex;
  align-items:center;
  min-height:40px;
  padding:.55rem .9rem;
  border-radius:999px;
  background:var(--yitm-blog-blue)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  font-weight:800;
  line-height:1.1;
}
html:has(meta.yb56.yb56) body.blog-page .yitm-proof-series-hero :is(.yitm-meta-row,.yitm-chip-row){
  display:flex;
  flex-wrap:wrap;
  gap:.55rem .7rem;
  margin-top:1rem;
}
html:has(meta.yb56.yb56) body.blog-page .yitm-proof-series-hero .yitm-meta-row{
  color:var(--yitm-navy)!important;
  -webkit-text-fill-color:var(--yitm-navy)!important;
}
html:has(meta.yb56.yb56) body.blog-page .yitm-proof-series-hero .yitm-meta-row span{
  color:var(--yitm-navy)!important;
  -webkit-text-fill-color:var(--yitm-navy)!important;
}
html:has(meta.yb56.yb56) body.blog-page .yitm-proof-series-hero .yitm-chip{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:.35rem .75rem;
  border:1px solid color-mix(in srgb,var(--yitm-primary) 16%,transparent);
  border-radius:999px;
  background:#fff!important;
  color:var(--yitm-navy)!important;
  -webkit-text-fill-color:var(--yitm-navy)!important;
}
html:has(meta.yb56.yb56) body.blog-page .yitm-proof-series-hero .yitm-proof-hero-figure{
  margin:0;
}
html:has(meta.yb56.yb56) body.blog-page .yitm-proof-series-hero .yitm-hero-img{
  display:block;
  width:100%;
  height:auto;
  border-radius:22px;
  border:1px solid color-mix(in srgb,var(--yitm-primary) 10%,transparent);
  background:#fff;
}
html:has(meta.yb56.yb56) body.blog-page .yitm-proof-series-hero figcaption{
  margin:.7rem auto 0;
  max-width:80ch;
  color:var(--yitm-navy)!important;
  -webkit-text-fill-color:var(--yitm-primary)!important;
  font-size:.94rem;
  line-height:1.5;
}

/* Breadcrumbs remain readable and compact above article heroes. */
html:has(meta.yb56.yb56) body.blog-page .yitm-breadcrumbs{
  display:flex;
  flex-wrap:wrap;
  gap:.4rem;
  width:100%;
  margin:18px 0 0;
  color:var(--yitm-navy)!important;
  font-size:.92rem;
}
html:has(meta.yb56.yb56) body.blog-page .yitm-breadcrumbs a{
  color:var(--yitm-navy)!important;
  -webkit-text-fill-color:var(--yitm-navy)!important;
}

/* Light article cards: protect against global white-text rules leaking into white surfaces.
   Includes both legacy .yitm-article and newer .leadroom-article / .yitm-post templates. */
html:has(meta.yb56.yb56) body :is(.yitm-article,.leadroom-article,.yitm-post) .yitm-card:not(.yitm-answer){
  background:#fff!important;
  color:var(--yitm-blog-ink)!important;
  -webkit-text-fill-color:initial!important;
  border-color:var(--yitm-blog-line)!important;
}
html:has(meta.yb56.yb56) body :is(.yitm-article,.leadroom-article,.yitm-post) .yitm-card:not(.yitm-answer) :is(h2,h3,h4,p,li,strong,th,td){
  color:var(--yitm-blog-ink)!important;
  -webkit-text-fill-color:currentColor!important;
  opacity:1!important;
}
html:has(meta.yb56.yb56) body :is(.yitm-article,.leadroom-article,.yitm-post) .yitm-card:not(.yitm-answer) a:not(.yitm-btn):not(.btn){
  color:var(--yitm-blog-green)!important;
  -webkit-text-fill-color:currentColor!important;
  text-decoration-thickness:.08em;
  text-underline-offset:.15em;
}

/* Answer cards are intentionally dark. Background and foreground are bound together. */
html:has(meta.yb56.yb56) body :is(.yitm-article,.leadroom-article,.yitm-post) .yitm-card.yitm-answer{
  background:linear-gradient(135deg,var(--yitm-deep) 0%,var(--yitm-deep) 100%)!important;
  color:#fff!important;
  border-color:var(--yitm-control-border)!important;
  -webkit-text-fill-color:initial!important;
}
html:has(meta.yb56.yb56) body :is(.yitm-article,.leadroom-article,.yitm-post) .yitm-card.yitm-answer :is(h2,h3,h4,p,li,strong,a){
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  opacity:1!important;
  text-shadow:none!important;
}
html:has(meta.yb56.yb56) body :is(.yitm-article,.leadroom-article,.yitm-post) .yitm-card.yitm-answer a:not(.yitm-btn){
  text-decoration:underline;
  text-decoration-thickness:.09em;
  text-underline-offset:.16em;
}
html:has(meta.yb56.yb56) body :is(.yitm-article,.leadroom-article,.yitm-post) .yitm-card.yitm-answer .yitm-btn{
  background:#fff!important;
  color:var(--yitm-deep)!important;
  -webkit-text-fill-color:var(--yitm-deep)!important;
}

/* Article flow, cards and tables. */
html:has(meta.yb56.yb56) body .leadroom-content,
html:has(meta.yb56.yb56) body .yitm-proof-series-content{
  display:grid;
  gap:20px;
  width:min(920px,100%);
  margin-inline:auto;
  padding-bottom:34px;
}
html:has(meta.yb56.yb56) body .yitm-card{
  border:1px solid var(--yitm-blog-line);
  border-radius:24px;
  padding:clamp(20px,3vw,32px);
  box-shadow:0 10px 32px color-mix(in srgb,var(--yitm-primary) 5.5%,transparent);
}
html:has(meta.yb56.yb56) body .yitm-card :is(h2,h3){text-wrap:balance}
html:has(meta.yb56.yb56) body .yitm-table{
  width:100%;
  border-collapse:collapse;
  background:#fff;
}
html:has(meta.yb56.yb56) body .yitm-table :is(th,td){
  padding:.8rem .9rem;
  border:1px solid color-mix(in srgb,var(--yitm-primary) 12%,transparent);
  text-align:left;
  vertical-align:top;
}
html:has(meta.yb56.yb56) body .yitm-table th{background:#edf4f8}

/* Shared article components that commonly sit on light surfaces. */
html:has(meta.yb56.yb56) body :is(.yitm-callout,.yitm-guide-card,.yitm-related-card,.yitm-side-card){
  color:var(--yitm-blog-ink);
}
html:has(meta.yb56.yb56) body :is(.yitm-callout,.yitm-guide-card,.yitm-related-card,.yitm-side-card) :is(h2,h3,h4,p,li,strong){
  -webkit-text-fill-color:currentColor;
}

/* Buttons must remain visibly actionable even when older theme classes collide. */
html:has(meta.yb56.yb56) body.blog-page :is(.btn,.yitm-btn){
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:.72rem 1rem;
  border-radius:999px;
  font-weight:800;
  text-decoration:none!important;
  cursor:pointer;
}
html:has(meta.yb56.yb56) body.blog-page :is(.btn.primary,.btn.btn-primary,.yitm-btn-primary){
  background:var(--yitm-action-bg,var(--yitm-primary))!important;
  border:1px solid var(--yitm-border)!important;
  color:var(--yitm-action-ink,var(--yitm-white))!important;
  -webkit-text-fill-color:#fff!important;
}
html:has(meta.yb56.yb56) body.blog-page :is(.btn.secondary,.btn.btn-secondary){
  background:#fff!important;
  border:1px solid color-mix(in srgb,var(--yitm-primary) 24%,transparent)!important;
  color:var(--yitm-secondary-ink,var(--yitm-navy))!important;
  -webkit-text-fill-color:var(--yitm-navy)!important;
}

/* Readability and tap targets. */
html:has(meta.yb56.yb56) body :is(.yitm-article,.leadroom-article,.yitm-post) :is(p,li){line-height:1.68}
html:has(meta.yb56.yb56) body :is(.yitm-btn,.btn,button,summary){min-height:44px}
html:has(meta.yb56.yb56) body :is(a,button,summary,input,select,textarea):focus-visible{
  outline:3px solid #1f7ae0!important;
  outline-offset:3px!important;
}
html:has(meta.yb56.yb56) body table{max-width:100%}

/* Dedicated stacked-hero pages must stay stacked regardless of older grid declarations. */
html:has(meta.yb56.yb56) body[data-yitm-article-hero="stacked"] .yitm-proof-series-hero .yitm-hero-grid{
  display:block!important;
  max-width:1040px!important;
  margin:0 auto!important;
}
html:has(meta.yb56.yb56) body[data-yitm-article-hero="stacked"] .yitm-proof-series-hero .yitm-hero-copy{
  max-width:900px!important;
  margin:0 auto 28px!important;
}
html:has(meta.yb56.yb56) body[data-yitm-article-hero="stacked"] .yitm-proof-series-hero .yitm-hero-media{
  width:100%!important;
  max-width:1040px!important;
  margin:0 auto!important;
}

@media(max-width:900px){
  html:has(meta.yb56.yb56) body .yitm-content{grid-template-columns:minmax(0,1fr)!important}
  html:has(meta.yb56.yb56) body .yitm-side{position:static!important}
  html:has(meta.yb56.yb56) body .yitm-triage-bar{overflow-x:auto;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}
  html:has(meta.yb56.yb56) body.blog-page .yitm-proof-series-hero .yitm-title{max-width:22ch}
}
@media(max-width:640px){
  html:has(meta.yb56.yb56) body :is(.yitm-triage-post,.leadroom-article,.yitm-post){width:min(100% - 20px,1180px)}
  html:has(meta.yb56.yb56) body .yitm-card{border-radius:20px!important;padding:18px!important}
  html:has(meta.yb56.yb56) body .yitm-triage-hero{padding:20px!important;border-radius:24px!important}
  html:has(meta.yb56.yb56) body.blog-page .yitm-proof-series-hero{padding:20px;border-radius:24px}
  html:has(meta.yb56.yb56) body.blog-page .yitm-proof-series-hero .yitm-title{
    font-size:clamp(2rem,10vw,2.75rem);
    line-height:1.06;
  }
  html:has(meta.yb56.yb56) body.blog-page .yitm-proof-series-hero :is(.yitm-meta-row,.yitm-chip-row){gap:.45rem}
  html:has(meta.yb56.yb56) body .yitm-table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
}
@media(prefers-reduced-motion:reduce){
  html:has(meta.yb56.yb56) body *{
    scroll-behavior:auto!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
}

@layer yitmWarmEditorial {
/* 20261004 — editorial repair, scoped to public articles using this safety layer. */
html:root:has(meta.yb56.yb56) body.blog-page{
 /* Colours inherit the shared public/Laravel palette. */
 background:#FCFAF8!important;color:var(--yitm-navy)!important;
}
html:root:has(meta.yb56.yb56) body.blog-page #main-content .yitm-proof-series-hero{
 display:block!important;
 background:linear-gradient(135deg,#fff,var(--yitm-soft))!important;padding:clamp(22px,4vw,40px)!important;
 border:1px solid var(--yitm-border)!important;border-radius:24px!important;box-shadow:none!important;
}
html:root:has(meta.yb56.yb56) body.blog-page #main-content .yitm-proof-series-hero .yitm-hero-grid{
 all:revert!important;box-sizing:border-box!important;position:static!important;transform:none!important;
 display:flex!important;flex-direction:column!important;align-items:center!important;gap:24px!important;width:100%!important;max-width:1000px!important;margin:auto!important;
}
html:root:has(meta.yb56.yb56) body.blog-page #main-content .yitm-proof-series-hero .yitm-hero-copy{
 all:revert!important;box-sizing:border-box!important;
 width:min(100%,900px)!important;max-width:900px!important;margin:0!important;align-self:center!important;flex:0 1 auto!important;
}
html:root:has(meta.yb56.yb56) body.blog-page #main-content .yitm-proof-series-hero .yitm-title{
 max-width:28ch!important;font-size:clamp(2rem,3.5vw,3.25rem)!important;line-height:1.12!important;
 margin:18px 0!important;color:var(--yitm-navy)!important;-webkit-text-fill-color:currentColor!important;
}
html:root:has(meta.yb56.yb56) body.blog-page #main-content .yitm-proof-series-hero .yitm-badge{
 background:var(--yitm-soft)!important;color:var(--yitm-deep)!important;-webkit-text-fill-color:currentColor!important;
 border:1px solid var(--yitm-border)!important;
}
html:root:has(meta.yb56.yb56) body.blog-page #main-content .yitm-proof-series-hero :is(.yitm-hero-media,.yitm-proof-hero-figure){
 all:revert!important;box-sizing:border-box!important;
 display:block!important;position:static!important;float:none!important;transform:none!important;
 width:min(100%,640px)!important;max-width:640px!important;margin:0!important;padding:0!important;align-self:center!important;flex:0 1 auto!important;
 background:transparent!important;border:0!important;box-shadow:none!important;
}
html:root:has(meta.yb56.yb56) body.blog-page #main-content .yitm-proof-series-hero .yitm-hero-img{
 all:revert!important;aspect-ratio:auto!important;box-sizing:border-box!important;
 display:block!important;width:100%!important;height:auto!important;max-height:none!important;
 object-fit:contain!important;border-radius:16px!important;
}
html:root:has(meta.yb56.yb56) body.blog-page #main-content .yitm-proof-series-hero figcaption{
 color:var(--yitm-copy)!important;-webkit-text-fill-color:currentColor!important;
 background:transparent!important;opacity:1!important;margin:12px auto 0!important;
 font-size:.95rem!important;line-height:1.55!important;text-align:left!important;
}
html:root:has(meta.yb56.yb56) body.blog-page #main-content :is(.leadroom-content,.yitm-proof-series-content){
 width:min(860px,100%)!important;display:grid!important;gap:24px!important;margin-inline:auto!important;
}
html:root:has(meta.yb56.yb56) body.blog-page #main-content .yitm-proof-section{
 background:#fff!important;border:1px solid var(--yitm-border)!important;
 border-radius:18px!important;padding:clamp(20px,3vw,30px)!important;box-shadow:none!important;
}
html:root:has(meta.yb56.yb56) body.blog-page #main-content .yitm-proof-section h2{
 font-size:clamp(1.45rem,2.2vw,1.9rem)!important;line-height:1.25!important;margin:0 0 16px!important;
}
html:root:has(meta.yb56.yb56) body.blog-page #main-content .yitm-proof-section h3{
 font-size:1.2rem!important;line-height:1.35!important;margin:28px 0 10px!important;
}
html:root:has(meta.yb56.yb56) body.blog-page #main-content .yitm-proof-section :is(p,li){
 font-size:1.06rem!important;line-height:1.75!important;color:var(--yitm-navy)!important;
 -webkit-text-fill-color:currentColor!important;
}
html:root:has(meta.yb56.yb56) body.blog-page #main-content .yitm-proof-section :is(ul,ol){
 display:block!important;columns:1!important;padding-left:1.4rem!important;
}
html:root:has(meta.yb56.yb56) body.blog-page #main-content .yitm-proof-section li{margin:8px 0!important}
html:root:has(meta.yb56.yb56) body.blog-page #main-content .yitm-batch5-performance-business-authority{
 width:min(860px,calc(100% - 28px))!important;margin:0 auto 40px!important;
 padding:clamp(20px,3vw,30px)!important;border:1px solid var(--yitm-border)!important;
}
html:root:has(meta.yb56.yb56) body.blog-page #main-content .yitm-table th{background:var(--yitm-soft)!important}
html:root:has(meta.yb56.yb56) body.blog-page #main-content .yitm-table tbody tr:nth-child(even){background:#FCFAF8!important}
html:root:has(meta.yb56.yb56) body.blog-page #main-content :is(a,button,summary,input,select,textarea):focus-visible{
 outline-color:var(--yitm-navy)!important;
}
@media(max-width:640px){
 html:root:has(meta.yb56.yb56) body.blog-page #main-content .yitm-proof-series-hero .yitm-title{font-size:2rem!important}
 html:root:has(meta.yb56.yb56) body.blog-page #main-content .yitm-proof-section .btn{max-width:100%;white-space:normal;text-align:center;margin:4px 0}
}

}