/* about-profile.css — perfil del fundador: cifras, línea de tiempo, ilustración HOME y
   bloque «por qué». Clases .pf-* para no chocar con about.css. */

.pf-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  margin: 1.6rem 0 2rem;
  border: 1px solid var(--border-mid);
  border-radius: var(--r-lg);
  overflow: hidden;
  background: var(--border-mid);
}
.pf-stat { padding: 1.1rem 1.25rem; background: var(--bg-card); }
.pf-stat b {
  display: block;
  font-family: var(--font-serif);
  font-size: clamp(2rem, 4.2vw, 2.9rem);
  font-weight: 400;
  line-height: 1;
  color: var(--hme84-champagne-bright);
}
.pf-stat span { display: block; margin-top: 0.45rem; font-size: 0.86rem; line-height: 1.4; color: var(--text-secondary); }

.pf-timeline { position: relative; margin: 0; padding: 0 0 0 1.75rem; list-style: none; }
.pf-timeline::before {
  content: "";
  position: absolute;
  left: 5px;
  top: 0.6rem;
  bottom: 0.6rem;
  width: 1px;
  background: linear-gradient(to bottom, var(--hme84-champagne-bright), var(--accent-border) 45%, transparent);
}
.pf-step { position: relative; padding: 0 0 1.75rem; }
.pf-step:last-child { padding-bottom: 0; }
.pf-step::before {
  content: "";
  position: absolute;
  left: -1.75rem;
  top: 0.45rem;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  border: 1px solid var(--hme84-champagne);
  background: var(--bg);
}
.pf-step--now::before { background: var(--hme84-champagne-bright); box-shadow: 0 0 0 5px rgba(230, 194, 122, 0.16); }
.pf-years { font-family: var(--font-mono); font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--hme84-champagne); }
.pf-org { margin: 0.3rem 0 0; font-family: var(--font-serif); font-size: clamp(1.35rem, 2.6vw, 1.7rem); font-weight: 500; line-height: 1.15; color: var(--text-primary); }
.pf-role { margin: 0.25rem 0 0; font-size: 0.86rem; color: var(--text-secondary); }
.pf-what { margin: 0.55rem 0 0; font-size: 0.97rem; line-height: 1.6; color: var(--hme84-muted); max-width: 44rem; }

.pf-extras { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 2rem; }
.pf-extra { padding: 1.1rem 1.25rem; border: 1px solid var(--border-mid); border-radius: var(--r-lg); background: var(--bg-card); }
.pf-extra h3 { margin: 0 0 0.5rem; font-family: var(--font-mono); font-size: 0.72rem; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: var(--hme84-champagne); }
.pf-extra p { margin: 0; font-size: 0.93rem; line-height: 1.55; color: var(--text-secondary); }
.pf-note { margin: 1.5rem 0 0; font-size: 0.82rem; color: var(--text-muted); }

.pf-why {
  margin: 2.25rem 0 0;
  padding: clamp(1.25rem, 3vw, 1.9rem);
  border-left: 2px solid var(--hme84-champagne-bright);
  border-radius: 0 var(--r-lg) var(--r-lg) 0;
  background: linear-gradient(90deg, rgba(230, 194, 122, 0.07), transparent);
}
.pf-why h3 { margin: 0 0 0.6rem; font-family: var(--font-serif); font-size: clamp(1.4rem, 2.8vw, 1.8rem); font-weight: 500; color: var(--text-primary); }
.pf-why p { margin: 0; font-size: 1.02rem; line-height: 1.7; color: var(--hme84-muted); }

@media (max-width: 640px) {
  .pf-stats { grid-template-columns: 1fr; }
  .pf-extras { grid-template-columns: 1fr; }
}

/* ---- Composición editorial (propuesta Codex 2026-10-01): fondo continuo, siluetas originales como decorado ---- */

body.page-about{background:#101722;color:#eae7df;--bg:#101722;--bg-card:#101722;--text-secondary:#abb1bc;--hme84-muted:#abb1bc;--accent:#d4bb8b;--hme84-champagne-bright:#d4bb8b;--accent-border:rgba(212,187,139,.2);--shell:min(1180px,calc(100% - 72px));}
body.page-about::before,body.page-about::after{display:none}
body.page-about main{padding-top:110px}
body.page-about .hero{min-height:0;padding:56px 0 52px;border-bottom:1px solid rgba(212,187,139,.25);overflow:visible}
body.page-about .hero::before{display:none}
body.page-about .hero-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:42px;align-items:stretch}
body.page-about .hero-kicker{font-size:10px;letter-spacing:.15em;color:#abb1bc;margin-bottom:26px}
body.page-about .about-editorial-title{font-family:var(--font-sans);font-size:12px;letter-spacing:.05em;color:#d4bb8b;margin-bottom:18px}
body.page-about .hero h1{font-size:clamp(50px,5.6vw,78px);line-height:1.02;letter-spacing:-.035em;max-width:650px;font-weight:300}
body.page-about .hero h1 em{color:#d4bb8b}
body.page-about .hero-copy{margin-top:28px;gap:18px;max-width:560px}
body.page-about .hero-copy p{font-size:14px;line-height:1.85;color:#abb1bc}
body.page-about .hero-copy p:first-child{color:#d9dce0;font-size:16px}
body.page-about .hero-offer{border:0;padding:0;background:none}
body.page-about .hero-copy>p:last-child{font-size:12px;margin-top:8px}
body.page-about .signal-strip{margin-top:30px;background:none;border:0;border-top:1px solid #ffffff12;border-radius:0;padding-top:22px;gap:20px}
body.page-about .signal-item{padding:0;border:0;background:none}
body.page-about .signal-item span{font-size:11px;color:#d4bb8b}
body.page-about .signal-item p{font-size:11px;line-height:1.6;color:#abb1bc}
.profile-presence{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-width:0;padding-top:130px}
.portrait-signature{position:absolute;top:4px;right:0;display:flex;gap:14px;align-items:center}
.portrait-signature img{width:70px;height:70px;object-fit:cover;border-radius:50%;object-position:50% 35%;filter:grayscale(.65)}
.portrait-signature span{font-family:var(--font-serif);font-size:23px;line-height:1.2}
.portrait-signature small{display:block;font-family:var(--font-sans);font-size:10px;color:#abb1bc;letter-spacing:.04em;margin-top:5px}
.home-trace{display:block;width:calc(100% + 35px);max-width:none;height:auto;opacity:.67;pointer-events:none;margin-left:-15px}
.home-signature{display:flex;justify-content:space-between;align-items:baseline;margin-top:20px;padding:0 6px;gap:12px}
.home-signature span{font-family:var(--font-serif);font-size:22px;color:#d4bb8b}
.home-signature small{font-size:10px;color:#abb1bc;letter-spacing:.08em}
body.page-about .section{padding:90px 0;border-bottom:1px solid #ffffff12}
body.page-about .section-grid{grid-template-columns:250px 1fr;gap:60px}
body.page-about .section-title{font-size:40px;line-height:1.08;letter-spacing:-.02em;font-weight:300}
body.page-about .section-lead{font-size:15px;line-height:1.85;max-width:680px;color:#abb1bc}
body.page-about .section-eyebrow{font-size:11px;letter-spacing:.15em;color:#d4bb8b;margin-bottom:20px}
body.page-about .principles{gap:25px;margin-top:32px}
body.page-about .principle-card{background:none;border:0;border-top:1px solid #d4bb8b45;border-radius:0;padding:20px 0;box-shadow:none}
body.page-about .principle-card:hover{transform:none;background:none;border-color:#d4bb8b}
body.page-about .principle-card h3{font-size:25px;font-weight:400;line-height:1.15;margin:16px 0 12px}
body.page-about .principle-card p{font-size:13px;color:#abb1bc;line-height:1.8}
body.page-about .pf-stats{background:none;border:0;border-radius:0;gap:28px;margin:34px 0 42px}
body.page-about .pf-stat{padding:0;background:none}
body.page-about .pf-stat b{font-size:52px}
body.page-about .pf-stat span{font-size:11px;line-height:1.6;color:#abb1bc}
body.page-about .pf-step{padding-bottom:34px}
body.page-about .pf-org{font-size:28px}
body.page-about .pf-what{font-size:14px;color:#abb1bc;line-height:1.8}
body.page-about .pf-extra{border:0;border-top:1px solid #ffffff20;border-radius:0;padding:20px 0;background:none}
body.page-about .pf-why{background:none;padding-left:24px;border-radius:0}
body.page-about .manifesto-line{font-size:clamp(24px,3vw,36px);font-weight:300;border:0;padding:10px 0}
body.page-about .closing-panel{border:0;background:none;border-radius:0;padding:20px 0 70px;grid-template-columns:1fr}
body.page-about .closing-panel h2{font-size:48px;max-width:680px;font-weight:300}
body.page-about .closing-panel p{max-width:680px;line-height:1.85}
body.page-about .closing-actions{justify-content:flex-start}
body.page-about .node{display:none}
@media(max-width:900px){body.page-about .hero-grid{grid-template-columns:1fr}.profile-presence{padding-top:90px;max-width:580px;width:100%;margin:18px auto 0}.portrait-signature{top:0;left:0;right:auto}.home-trace{width:100%;margin:0}body.page-about .section-grid{grid-template-columns:1fr;gap:26px}body.page-about .hero{padding-top:25px}body.page-about .principles{grid-template-columns:1fr}body.page-about .signal-strip{grid-template-columns:repeat(3,1fr)}body.page-about .section{padding:60px 0}}
@media(max-width:600px){body.page-about{--shell:calc(100% - 40px)}body.page-about main{padding-top:96px}body.page-about .hero h1{font-size:54px}body.page-about .hero-kicker{font-size:11px;line-height:1.8}body.page-about .hero-copy p:first-child{font-size:15px}.profile-presence{padding-top:100px;margin-top:6px}.portrait-signature img{width:52px;height:52px}.home-signature span{font-size:20px}.home-signature small{font-size:11px}body.page-about .signal-strip{gap:12px}body.page-about .pf-stats{grid-template-columns:repeat(3,1fr);gap:15px}body.page-about .pf-stat b{font-size:40px}body.page-about .section-title{font-size:35px}body.page-about .closing-panel h2{font-size:38px}}

body.page-about main,body.page-about main section,body.page-about .hero-grid,body.page-about .section-grid{opacity:1!important;transform:none!important}
body.page-about .hero h1{font-size:clamp(48px,5.3vw,74px)}
.work-title{font:300 clamp(34px,4.5vw,58px)/1.05 var(--font-serif);letter-spacing:-.025em;max-width:850px}
.work-intro{color:#abb1bc;max-width:670px;margin-top:24px;font-size:15px;line-height:1.85}
.career-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:48px}
.career-cases article{min-width:0}.career-cases small{display:block;font:11px/1.6 var(--font-mono);color:#d4bb8b;letter-spacing:.07em;margin:24px 0 15px}
.career-cases h3{font:400 30px/1.12 var(--font-serif);margin-bottom:15px}.career-cases p{font-size:13px;line-height:1.85;color:#abb1bc}
.case-diagram{height:200px;position:relative;border-top:1px solid #d4bb8b45;border-bottom:1px solid #d4bb8b45;display:flex;flex-direction:column;justify-content:center;gap:38px;padding-left:26px;background:linear-gradient(120deg,#d4bb8b05,transparent)}
.case-diagram span{font:11px var(--font-mono);letter-spacing:.08em;color:#abb1bc;z-index:1}.case-diagram i{height:70px;position:absolute;left:12px;top:65px;border-left:1px solid #d4bb8b88}.case-diagram i:before,.case-diagram i:after{content:'';position:absolute;left:-3px;width:5px;height:5px;border-radius:50%;background:#d4bb8b}.case-diagram i:after{bottom:0}.case-diagram b{position:absolute;right:14px;bottom:10px;font:300 75px var(--font-serif);color:#d4bb8b26}
.case-source{margin-top:25px;font-size:11px;color:#abb1bc}
.own-work{display:grid;grid-template-columns:1fr 1.25fr;gap:90px;margin-top:85px;padding-top:55px;border-top:1px solid #ffffff18}.own-work h3{font:300 40px/1.08 var(--font-serif);margin-bottom:22px}.own-work p{color:#abb1bc;font-size:14px;line-height:1.85}.own-work .own-note{font-size:11px;margin-top:20px}
.app-list article{display:grid;grid-template-columns:50px 1fr auto;gap:16px;align-items:center;padding:22px 0;border-bottom:1px solid #ffffff18}.app-symbol{font-size:35px;color:#d4bb8b;font-weight:300}.app-list h4{font:400 25px var(--font-serif);margin-bottom:5px}.app-list p{font-size:12px}.app-list small{font:11px var(--font-mono);color:#d4bb8b}
.human-section{background:linear-gradient(100deg,#d4bb8b06,transparent)}.human-grid{display:grid;grid-template-columns:250px 1fr;gap:60px}.human-grid p{max-width:690px;font-size:15px;line-height:1.9;color:#abb1bc;margin-bottom:22px}.human-grid .human-lead{font:300 29px/1.45 var(--font-serif);color:#eae7df}.human-sign{display:block;font:italic 30px var(--font-serif);color:#d4bb8b;margin-top:30px}
@media(max-width:900px){.career-cases{grid-template-columns:1fr;gap:45px}.career-cases article{display:grid;grid-template-columns:190px 1fr;column-gap:28px}.case-diagram{grid-row:1/4;height:100%}.career-cases small{margin-top:0}.own-work{grid-template-columns:1fr;gap:30px}.human-grid{grid-template-columns:1fr;gap:28px}}
@media(max-width:600px){.career-cases article{grid-template-columns:1fr}.case-diagram{grid-row:auto;height:160px}.career-cases small{margin-top:20px}.case-diagram i{height:60px;top:48px}.own-work{margin-top:55px}.app-list article{grid-template-columns:36px 1fr}.app-list small{display:none}.human-grid .human-lead{font-size:27px}body.page-about .hero h1{font-size:49px}}

.app-list article{grid-template-columns:76px minmax(0,1fr) auto;gap:24px;min-height:120px}
.app-brand{width:76px;height:76px;display:flex;align-items:center;justify-content:center}
.app-brand img{width:72px;height:72px;object-fit:contain;max-width:none}
.app-brand--health img{width:65px;height:76px}
.app-brand--xerebro img{width:92px;height:92px}
.app-brand--boite img{width:66px;height:66px}
.app-list h4{font-size:26px;margin-bottom:7px}.app-list p{font-size:13px}
#apps{scroll-margin-top:120px}
@media(max-width:600px){.app-list article{grid-template-columns:60px minmax(0,1fr);gap:20px;min-height:105px}.app-brand{width:60px;height:60px}.app-brand img{width:56px;height:56px}.app-brand--health img{width:50px;height:60px}.app-brand--xerebro img{width:74px;height:74px}.app-brand--boite img{width:54px;height:54px}.app-list h4{font-size:25px}}
/* En dos columnas estrechas (tablet) la marca de agua del diagrama chocaba con sus etiquetas. */
@media(min-width:601px) and (max-width:900px){.case-diagram b{display:none}}
