/* differentiation — page-specific styles */

/* =========================================================
   DIFFERENTIATION PAGE
   ========================================================= */
.diff-hero{
  padding:40px 0 20px;
  background:
    radial-gradient(circle at 86% 12%, rgba(80,80,80,0.06), transparent 27%),
    radial-gradient(circle at 11% 90%, rgba(80,80,80,0.054), transparent 30%),
    var(--page-bg, #ffffff);
  border-bottom:1px solid var(--line);
}
.diff-hero-grid{
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:48px;
  align-items:center;
}
.diff-eyebrow,
.diff-kicker{
  font-size:12px;
  line-height:1;
  letter-spacing:.12em;
  font-weight:850;
  text-transform:uppercase;
  color:var(--blue);
}
.diff-hero h1{
  margin:13px 0 18px;
  max-width:820px;
  font-size:52px;
  line-height:1.05;
  letter-spacing:-.045em;
  color:var(--text-strong);
}
.diff-hero h1 em{
  display:block;
  margin-top:7px;
  font-style:normal;
  color:var(--purple);
}
.diff-lead{
  margin:0;
  max-width:830px;
  font-size:18px;
  line-height:1.65;
  color:var(--text);
}
.diff-hero-note{
  padding:25px;
  border:1px solid var(--line);
  border-radius:20px;
  background:var(--card-bg,#ffffff);
  box-shadow:0 16px 40px rgba(32,32,32,.07);
}
.diff-hero-note .mark{
  width:48px;height:48px;border-radius:15px;
  display:grid;place-items:center;
  margin-bottom:17px;
  font-size:24px;font-weight:800;
  background:#e0e0e0;color:var(--purple);
}
.diff-hero-note strong{
  display:block;
  margin-bottom:8px;
  font-size:21px;
  line-height:1.2;
  color:var(--text-strong);
}
.diff-hero-note p{margin:0;font-size:14px;line-height:1.6;color:var(--text)}
.diff-section{padding:66px 0}
.diff-section.alt{background:var(--surface-soft,#ffffff);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.diff-head{max-width:900px;margin-bottom:31px}
.diff-head h2{
  margin:9px 0 11px;
  font-size:35px;
  line-height:1.13;
  letter-spacing:-.025em;
  color:var(--text-strong);
}
.diff-head p{margin:0;font-size:16px;line-height:1.65;color:var(--text)}
.value-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
}
.value-card,.expert-card,.pillar-card,.industry-diff-card,.summary-item{
  border:1px solid var(--line);
  border-radius:17px;
  background:var(--card-bg,#ffffff);
}
.value-card{padding:23px}
.value-icon{
  width:43px;height:43px;border-radius:13px;
  display:grid;place-items:center;
  margin-bottom:15px;
  font-size:20px;font-weight:800;
  background:var(--accent-soft);color:var(--accent);
}
.value-card h3,.expert-card h3,.industry-diff-card h3,.summary-item h3{
  margin:0 0 8px;font-size:17px;color:var(--text-strong)
}
.value-card p,.expert-card p,.industry-diff-card p,.summary-item p{
  margin:0;font-size:13px;line-height:1.55;color:var(--text)
}
.scale-banner{
  margin-top:23px;
  padding:22px 25px;
  border-radius:16px;
  background:linear-gradient(105deg,#202020,#505050);
  color:#ffffff;
}
.scale-banner strong{display:block;font-size:23px;margin-bottom:4px;color:#ffffff}
.scale-banner span{font-size:14px;color:#e0e0e0}
.stack-compare{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:25px;
}
.stack-box{
  padding:25px;
  border:1px solid var(--line);
  border-radius:19px;
  background:var(--card-bg,#ffffff);
}
.stack-label{
  display:inline-flex;
  padding:6px 10px;
  margin-bottom:17px;
  border-radius:999px;
  font-size:11px;
  font-weight:850;
  letter-spacing:.08em;
  text-transform:uppercase;
  background:#ffffff;
  color:var(--text-strong);
}
.stack-box.dgct .stack-label{background:#e0e0e0;color:var(--blue)}
.stack-layer{
  position:relative;
  padding:15px 17px;
  margin-top:9px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--surface-soft,#ffffff);
}
.stack-layer b{display:block;color:var(--text-strong);font-size:14px}
.stack-layer span{display:block;margin-top:4px;color:var(--text);font-size:12px;line-height:1.42}
.stack-box.dgct .stack-layer:nth-of-type(2){border-left:4px solid var(--purple)}
.stack-box.dgct .stack-layer:nth-of-type(3){border-left:4px solid var(--green)}
.stack-box.dgct .stack-layer:nth-of-type(4){border-left:4px solid var(--blue)}
.stack-foot{
  margin:17px 0 0;
  font-size:13px;
  line-height:1.5;
  color:var(--text);
}
.stack-box.dgct .stack-foot{font-weight:800;color:var(--text-strong)}
.core-strip{
  display:grid;
  grid-template-columns:230px 1fr;
  gap:20px;
  align-items:stretch;
  margin-bottom:18px;
}
.core-foundation{
  border-radius:18px;
  padding:24px;
  color:white;
  background:linear-gradient(145deg,#202020,#505050);
}
.core-foundation small{
  display:block;font-size:11px;font-weight:850;letter-spacing:.1em;text-transform:uppercase;color:#e0e0e0
}
.core-foundation strong{display:block;margin:8px 0 5px;font-size:26px;color:#ffffff}
.core-foundation span{font-size:13px;line-height:1.45;color:#ffffff}
.industry-diff-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:15px;
}
.industry-diff-card{padding:20px}
.industry-diff-card .mini{
  font-size:11px;font-weight:850;letter-spacing:.08em;text-transform:uppercase;
  color:var(--accent);margin-bottom:8px
}
.deterministic-panel{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:26px;
  align-items:stretch;
}
.det-callout{
  padding:28px;
  border-radius:20px;
  background:var(--brand);
  color:#ffffff;
}
.det-callout .icon{font-size:27px;margin-bottom:16px}
.det-callout h3{margin:0 0 10px;font-size:25px;color:#ffffff}
.det-callout p{margin:0;font-size:14px;line-height:1.6;color:#ffffff}
.det-list{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.det-point{
  padding:20px;
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--card-bg,#ffffff);
}
.det-point b{display:block;margin-bottom:6px;color:var(--text-strong);font-size:14px}
.det-point span{font-size:12.5px;line-height:1.5;color:var(--text)}
.expert-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:14px;
}
.expert-card{padding:20px}
.expert-symbol{
  font-size:21px;font-weight:900;color:var(--blue);margin-bottom:12px
}
.summary-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.summary-item{
  display:grid;
  grid-template-columns:44px 1fr;
  gap:15px;
  align-items:start;
  padding:20px;
}
.summary-item:last-child{grid-column:1 / -1}
.summary-num{
  width:42px;height:42px;border-radius:13px;
  display:grid;place-items:center;
  font-size:16px;font-weight:900;
  color:white;background:#202020;
}
.diff-final{
  padding:55px 0 72px;
  text-align:center;
}
.diff-final h2{
  margin:0 auto 12px;max-width:800px;
  font-size:35px;line-height:1.15;letter-spacing:-.025em;color:var(--text-strong)
}
.diff-final p{
  margin:0 auto 24px;max-width:800px;
  font-size:16px;line-height:1.6;color:var(--text)
}
.diff-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.diff-btn{
  display:inline-flex;align-items:center;gap:9px;
  padding:12px 17px;border-radius:10px;
  border:1px solid var(--line);
  font-size:13px;font-weight:800;text-decoration:none;
  color:var(--text-strong);background:var(--card-bg,#ffffff)
}
.diff-btn.primary{background:#202020;color:#ffffff;border-color:#202020}
html[data-theme="dark"] .diff-section.alt{background:#202020!important}
html[data-theme="dark"] .diff-hero-note,
html[data-theme="dark"] .value-card,
html[data-theme="dark"] .stack-box,
html[data-theme="dark"] .industry-diff-card,
html[data-theme="dark"] .det-point,
html[data-theme="dark"] .expert-card,
html[data-theme="dark"] .summary-item,
html[data-theme="dark"] .diff-btn:not(.primary){
  background:#202020!important;
  border-color:#505050!important;
}
html[data-theme="dark"] .stack-layer{background:#202020!important;border-color:#505050!important}
html[data-theme="dark"] .stack-label{background:#202020!important}
html[data-theme="dark"] .diff-hero{
  background:
    radial-gradient(circle at 86% 12%,rgba(80,80,80,0.072),transparent 27%),
    radial-gradient(circle at 11% 90%,rgba(80,80,80,0.06),transparent 30%),
    #202020!important;
}
@media(max-width:1050px){
  .value-grid,.industry-diff-grid{grid-template-columns:1fr 1fr}
  .expert-grid{grid-template-columns:1fr 1fr}
  .expert-card:last-child{grid-column:1/-1}
}
@media(max-width:800px){
  .diff-hero-grid,.stack-compare,.deterministic-panel,.core-strip{grid-template-columns:1fr}
  .diff-hero h1{font-size:42px}
  .summary-grid{grid-template-columns:1fr}
  .summary-item:last-child{grid-column:auto}
}
@media(max-width:600px){
  .diff-hero{padding:58px 0 46px}
  .diff-section{padding:48px 0}
  .diff-hero h1{font-size:34px}
  .diff-head h2,.diff-final h2{font-size:29px}
  .value-grid,.industry-diff-grid,.expert-grid,.det-list{grid-template-columns:1fr}
  .expert-card:last-child{grid-column:auto}
}
