/* PHREVO graphic system v3: dark, aligned, concept-specific diagrams */
.phx-visual,.phx-mini{
  position:relative;
  overflow:hidden;
  border-top:1px solid var(--rule, rgba(255,255,255,.1));
  border-bottom:1px solid var(--rule, rgba(255,255,255,.1));
  background:#071326;
  color:var(--white,#fff);
}
.phx-visual{min-height:390px}
.phx-mini{min-height:300px}
.phx-visual::before,.phx-mini::before{
  content:"";
  position:absolute;
  inset:0;
  opacity:.16;
  background-image:
    linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px);
  background-size:36px 36px;
  pointer-events:none;
}
.phx-visual::after,.phx-mini::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg, rgba(6,16,31,.95), rgba(13,27,62,.48) 50%, rgba(6,16,31,.9)),
    radial-gradient(circle at var(--phx-glow-x,72%) var(--phx-glow-y,35%), var(--phx-glow,rgba(78,205,196,.13)), transparent 37%);
}
.phx-visual.phx--green,.phx-mini.phx--green{--phx-glow:rgba(46,204,113,.14);--phx-glow-x:78%;--phx-glow-y:32%}
.phx-visual.phx--red,.phx-mini.phx--red{--phx-glow:rgba(231,76,60,.15);--phx-glow-x:32%;--phx-glow-y:55%}
.phx-visual.phx--gold,.phx-mini.phx--gold{--phx-glow:rgba(182,122,82,.16);--phx-glow-x:70%;--phx-glow-y:42%}
.phx-inner{
  position:relative;
  z-index:1;
  max-width:1280px;
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(300px,.7fr) minmax(520px,1.3fr);
  gap:3rem;
  align-items:center;
  padding:4.2rem 2.5rem;
}
.phx-mini .phx-inner{
  min-height:300px;
  grid-template-columns:minmax(300px,.82fr) minmax(420px,1.18fr);
  padding:0 2.5rem;
}
.phx--reversed .phx-copy{order:2}
.phx--reversed .phx-stage{order:1}
.phx-copy{max-width:500px}
.phx-mini .phx-copy{max-width:none;padding:3.2rem 0}
.phx-kicker{
  display:block;
  margin-bottom:.9rem;
  font-family:var(--mono, ui-monospace, monospace);
  font-size:.54rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--teal,#4ecdc4);
}
.phx-copy h2{
  font-family:var(--serif, Georgia, serif);
  font-size:clamp(1.9rem,3.7vw,3.55rem);
  font-style:italic;
  font-weight:400;
  line-height:1.04;
  letter-spacing:0;
}
.phx-mini .phx-copy h2{font-size:clamp(1.45rem,2.45vw,2.35rem)}
.phx-copy p{
  margin-top:1rem;
  color:var(--muted,rgba(255,255,255,.58));
  font-size:.86rem;
  line-height:1.82;
}
.phx-stage{
  position:relative;
  min-height:320px;
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(135deg, rgba(255,255,255,.035), transparent);
  box-shadow:inset 0 0 0 1px rgba(78,205,196,.035);
}
.phx-mini .phx-stage{min-height:300px;border-left:1px solid rgba(255,255,255,.1)}
.phx-stage canvas{width:100%;height:320px;display:block}
.phx-mini .phx-stage canvas{height:300px}
.phx-frame{
  position:absolute;
  inset:18px;
  border:1px solid rgba(255,255,255,.14);
  pointer-events:none;
}
.phx-frame::before,.phx-frame::after{
  content:"";
  position:absolute;
  width:46px;
  height:46px;
  border-style:solid;
  border-color:rgba(78,205,196,.62);
}
.phx-frame::before{left:-9px;top:-9px;border-width:1px 0 0 1px}
.phx-frame::after{right:-9px;bottom:-9px;border-width:0 1px 1px 0}
.phx-label{
  position:absolute;
  z-index:2;
  font-family:var(--mono, ui-monospace, monospace);
  font-size:.52rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  line-height:1.55;
  color:rgba(255,255,255,.72);
  pointer-events:none;
}
.phx-label strong{color:var(--teal,#4ecdc4);font-weight:500}
.phx-a{left:30px;top:28px}
.phx-b{right:30px;bottom:28px;text-align:right}
.phx-marks{
  display:flex;
  flex-wrap:wrap;
  gap:.45rem;
  margin-top:1.35rem;
}
.phx-mark{
  border:1px solid rgba(255,255,255,.16);
  padding:.42rem .55rem;
  font-family:var(--mono, ui-monospace, monospace);
  font-size:.51rem;
  letter-spacing:.11em;
  text-transform:uppercase;
  color:rgba(255,255,255,.62);
}
.phx-pulse{
  display:inline-block;
  width:6px;
  height:6px;
  margin-right:.45rem;
  border-radius:50%;
  background:#2ecc71;
  box-shadow:0 0 0 0 rgba(46,204,113,.55);
  animation:phxPulse 1.7s infinite;
}
@keyframes phxPulse{70%{box-shadow:0 0 0 9px rgba(46,204,113,0)}100%{box-shadow:0 0 0 0 rgba(46,204,113,0)}}
@media(max-width:900px){
  .phx-inner,.phx-mini .phx-inner{grid-template-columns:1fr;gap:1.6rem;padding:2.6rem 1.1rem}
  .phx--reversed .phx-copy,.phx--reversed .phx-stage{order:initial}
  .phx-mini .phx-copy{padding:0}
  .phx-stage,.phx-mini .phx-stage{min-height:250px;border-left:1px solid rgba(255,255,255,.12)}
  .phx-stage canvas,.phx-mini .phx-stage canvas{height:250px}
  .phx-label{font-size:.48rem}
}
@media(prefers-reduced-motion:reduce){.phx-pulse{animation:none}}


/* Language guard + strategic model diagrams */
body.en [data-es]{display:none!important}
body.es [data-en]{display:none!important}
body.en [data-en],body.es [data-es]{display:inline!important}
body.en p[data-en],body.es p[data-es],
body.en div[data-en],body.es div[data-es],
body.en section[data-en],body.es section[data-es],
body.en li[data-en],body.es li[data-es]{display:block!important}

.phx-copy h2{
  font-family:var(--sans, Inter, system-ui, sans-serif);
  font-style:normal;
  font-size:clamp(1.45rem,2.6vw,2.45rem);
  line-height:1.16;
  letter-spacing:0;
}
.phx-mini .phx-copy h2{font-size:clamp(1.25rem,2vw,1.85rem)}
.phx-marks{display:none}
.phx-label{font-size:.46rem;letter-spacing:.08em}

.ph-model{
  position:relative;
  padding:5.2rem 2.5rem;
  border-top:1px solid var(--rule,rgba(255,255,255,.1));
  background:
    radial-gradient(circle at 80% 24%, rgba(78,205,196,.10), transparent 32%),
    linear-gradient(180deg, rgba(6,16,31,.98), rgba(8,20,36,.94));
  overflow:hidden;
}
.ph-model:before{
  content:"";
  position:absolute;
  inset:0;
  opacity:.12;
  background-image:
    linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px);
  background-size:38px 38px;
  pointer-events:none;
}
.ph-model-inner{
  position:relative;
  z-index:1;
  max-width:1280px;
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(280px,.76fr) minmax(520px,1.24fr);
  gap:3.2rem;
  align-items:center;
}
.ph-model-copy{max-width:520px}
.ph-model-k{
  display:block;
  margin-bottom:.9rem;
  font-family:var(--mono,ui-monospace,monospace);
  font-size:.54rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--teal,#4ecdc4);
}
.ph-model-h{
  margin:0;
  font-family:var(--sans,Inter,system-ui,sans-serif);
  font-weight:500;
  font-size:clamp(1.8rem,3.1vw,3rem);
  line-height:1.08;
  letter-spacing:0;
}
.ph-model-h em{
  color:var(--teal,#4ecdc4);
  font-style:normal;
}
.ph-model-p{
  margin-top:1.1rem;
  color:var(--muted,rgba(255,255,255,.62));
  font-size:.88rem;
  line-height:1.82;
}
.ph-blueprint{
  position:relative;
  min-height:360px;
  border:1px solid rgba(255,255,255,.14);
  background:linear-gradient(135deg,rgba(255,255,255,.045),rgba(255,255,255,.01));
  box-shadow:inset 0 0 0 1px rgba(78,205,196,.04);
  padding:1.4rem;
}
.ph-blueprint:before{
  content:"";
  position:absolute;
  inset:16px;
  border:1px solid rgba(255,255,255,.12);
  pointer-events:none;
}
.ph-diagram-caption{
  margin-top:1rem;
  padding-top:.9rem;
  border-top:1px solid rgba(255,255,255,.1);
  color:rgba(255,255,255,.68);
  font-family:var(--serif,Georgia,serif);
  font-style:italic;
  font-size:.95rem;
  line-height:1.55;
}
.ph-flow-row,.ph-filter-out,.ph-score-grid,.ph-value-flow,.ph-compare-grid,.ph-fractal-grid{
  position:relative;
  z-index:1;
}
.ph-flow-row,.ph-filter-out{
  display:grid;
  grid-template-columns:1fr 46px 1fr 46px 1fr;
  align-items:center;
  gap:.65rem;
  min-height:108px;
}
.ph-box{
  min-height:72px;
  padding:1rem;
  border:1px solid rgba(78,205,196,.38);
  background:rgba(78,205,196,.055);
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:rgba(255,255,255,.88);
  font-family:var(--mono,ui-monospace,monospace);
  font-size:.66rem;
  letter-spacing:.09em;
  text-transform:uppercase;
  line-height:1.45;
}
.ph-box.hot{border-color:rgba(231,76,60,.5);background:rgba(231,76,60,.065)}
.ph-box.good{border-color:rgba(46,204,113,.55);background:rgba(46,204,113,.065)}
.ph-box.copper{border-color:rgba(182,122,82,.65);background:rgba(182,122,82,.07)}
.ph-arrow{
  height:2px;
  background:linear-gradient(90deg,transparent,var(--teal,#4ecdc4));
  position:relative;
  animation:phArrow 2.3s linear infinite;
}
.ph-arrow:after{
  content:"";
  position:absolute;
  right:-2px;
  top:-4px;
  width:0;
  height:0;
  border-left:8px solid var(--teal,#4ecdc4);
  border-top:5px solid transparent;
  border-bottom:5px solid transparent;
}
.ph-ignored{
  margin-top:1.2rem;
  padding:1rem;
  border:1px dashed rgba(231,76,60,.42);
  color:rgba(255,255,255,.66);
  font-family:var(--mono,ui-monospace,monospace);
  font-size:.6rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  text-align:center;
}
.ph-split{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1rem;
  margin-top:1.2rem;
}
.ph-thresholds{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:.6rem;
  margin-bottom:1.1rem;
}
.ph-chip{
  border:1px solid rgba(255,255,255,.14);
  padding:.72rem .55rem;
  font-family:var(--mono,ui-monospace,monospace);
  font-size:.54rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  text-align:center;
  color:rgba(255,255,255,.72);
}
.ph-score-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr) .85fr;
  gap:.8rem;
  align-items:stretch;
}
.ph-score-card{
  border:1px solid rgba(78,205,196,.32);
  padding:1rem;
  min-height:190px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  background:rgba(78,205,196,.045);
}
.ph-score-card.total{border-color:rgba(46,204,113,.56);background:rgba(46,204,113,.055)}
.ph-score-n{
  font-family:var(--display,var(--mono));
  font-size:2.7rem;
  line-height:1;
  color:var(--teal,#4ecdc4);
}
.ph-score-l{
  font-family:var(--mono,ui-monospace,monospace);
  font-size:.58rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(255,255,255,.75);
}
.ph-gauge{
  height:8px;
  margin-top:1rem;
  background:rgba(255,255,255,.08);
  overflow:hidden;
}
.ph-gauge span{
  display:block;
  height:100%;
  background:linear-gradient(90deg,var(--teal,#4ecdc4),#2ecc71);
  animation:phGauge 2.8s ease-in-out infinite alternate;
}
.ph-value-flow{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:.55rem;
  align-items:center;
}
.ph-flow-node{
  min-height:116px;
  border:1px solid rgba(78,205,196,.3);
  background:rgba(78,205,196,.045);
  padding:.9rem .65rem;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:.45rem;
  text-align:center;
}
.ph-flow-node b{
  color:var(--teal,#4ecdc4);
  font-family:var(--mono,ui-monospace,monospace);
  font-size:.54rem;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.ph-flow-node span{
  color:rgba(255,255,255,.74);
  font-size:.7rem;
  line-height:1.4;
}
.ph-loop{
  margin:1rem auto 0;
  width:76%;
  height:42px;
  border:1px solid rgba(46,204,113,.35);
  border-top:none;
  border-radius:0 0 80px 80px;
  color:#2ecc71;
  font-family:var(--mono,ui-monospace,monospace);
  font-size:.5rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  text-align:center;
  padding-top:.8rem;
}
.ph-compare-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1rem;
}
.ph-compare{
  border:1px solid rgba(255,255,255,.14);
  padding:1.1rem;
}
.ph-compare h3{
  font-family:var(--mono,ui-monospace,monospace);
  font-size:.62rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--teal,#4ecdc4);
  margin-bottom:1rem;
}
.ph-compare.legacy h3{color:#e74c3c}
.ph-compare ul{list-style:none;display:grid;gap:.7rem}
.ph-compare li{
  color:rgba(255,255,255,.72);
  font-size:.78rem;
  line-height:1.45;
  padding-left:1rem;
  position:relative;
}
.ph-compare li:before{
  content:"";
  position:absolute;
  left:0;
  top:.55em;
  width:5px;
  height:5px;
  border-radius:50%;
  background:var(--teal,#4ecdc4);
}
.ph-compare.legacy li:before{background:#e74c3c}
.ph-fractal-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:.8rem;
  align-items:start;
}
.ph-pillar{
  border:1px solid rgba(78,205,196,.32);
  padding:.9rem;
  background:rgba(78,205,196,.035);
}
.ph-pillar b{
  display:block;
  color:var(--teal,#4ecdc4);
  font-family:var(--mono,ui-monospace,monospace);
  font-size:.58rem;
  letter-spacing:.13em;
  text-transform:uppercase;
  margin-bottom:.8rem;
}
.ph-mini-cells{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:.35rem;
}
.ph-mini-cells span{
  aspect-ratio:1;
  border:1px solid rgba(255,255,255,.13);
  background:rgba(255,255,255,.035);
}
.ph-learn{
  background:linear-gradient(180deg,rgba(8,20,36,.98),rgba(6,16,31,.98));
}
.ph-learn .ph-model-inner{
  grid-template-columns:1fr;
  gap:2.4rem;
  max-width:1180px;
}
.ph-learn .ph-model-copy{
  max-width:820px;
}
.ph-learn-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1.35rem;
  max-width:1100px;
  width:100%;
  margin:0 auto;
}
.ph-learn-grid > div{
  min-width:0;
}
.ph-learn .ph-blueprint{
  min-height:auto;
  padding:clamp(1rem,2.2vw,1.8rem);
}
.ph-learn .ph-blueprint:before{
  inset:clamp(10px,1.6vw,18px);
}
.ph-learn .ph-flow-row{
  min-height:96px;
}
.ph-learn .ph-box{
  min-height:68px;
  padding:.85rem;
  font-size:clamp(.56rem,1.1vw,.68rem);
}
.ph-learn .ph-ignored{
  font-size:clamp(.52rem,1vw,.62rem);
  line-height:1.55;
}
.ph-learn .ph-fractal-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
.ph-learn .ph-pillar{
  min-width:0;
}
.ph-learn .ph-pillar b{
  font-size:clamp(.5rem,.95vw,.58rem);
  overflow-wrap:anywhere;
}
.ph-learn .ph-compare-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.ph-learn .ph-compare{
  min-width:0;
}
.ph-learn .ph-compare li{
  font-size:clamp(.72rem,1.15vw,.82rem);
}
@keyframes phArrow{0%{opacity:.35;transform:translateX(-5px)}50%{opacity:1}100%{opacity:.35;transform:translateX(5px)}}
@keyframes phGauge{from{width:52%}to{width:88%}}
@media(max-width:820px){
  .ph-model{padding:3.4rem 1.2rem}
  .ph-model-inner,.ph-learn-grid{grid-template-columns:1fr}
  .ph-blueprint{min-height:auto}
  .ph-flow-row,.ph-filter-out{grid-template-columns:1fr;gap:.45rem}
  .ph-arrow{height:34px;width:2px;margin:0 auto;background:linear-gradient(180deg,transparent,var(--teal,#4ecdc4))}
  .ph-arrow:after{right:-4px;top:auto;bottom:-2px;border-top:8px solid var(--teal,#4ecdc4);border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:0}
  .ph-split,.ph-thresholds,.ph-score-grid,.ph-value-flow,.ph-compare-grid,.ph-fractal-grid{grid-template-columns:1fr}
  .ph-flow-node{min-height:88px}
  .ph-learn .ph-blueprint{padding:1rem}
  .ph-learn .ph-fractal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ph-learn .ph-compare-grid{grid-template-columns:1fr}
  .ph-learn .ph-mini-cells{gap:.25rem}
}
@media(max-width:520px){
  .ph-learn .ph-fractal-grid{grid-template-columns:1fr}
  .ph-learn .ph-pillar{display:grid;grid-template-columns:minmax(96px,.42fr) 1fr;gap:.8rem;align-items:center}
  .ph-learn .ph-pillar b{margin-bottom:0}
}
@media(prefers-reduced-motion:reduce){
  .ph-arrow,.ph-gauge span{animation:none}
}