/* Marca personal: complementa el tema existente sin cambiar sus servicios. */
:root { --signal:#00FF88; }
html { scroll-padding-top:100px; }
#navbar { position:fixed; top:0; left:0; right:0; z-index:100; }
.skip-link { position:fixed; top:-80px; left:16px; z-index:200; padding:12px 20px; background:#FF6B2C; color:#000; border-radius:8px; }
.skip-link:focus { top:12px; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline:2px solid var(--signal); outline-offset:5px; }
.nav-inner { gap:18px; }
.nav-links { gap:22px; }
.nav-actions { display:flex; gap:12px; align-items:center; }
.lang-toggle { margin:0; }
.menu-toggle { display:none; font:inherit; color:#F5F5F7; background:#111; border:1px solid #333; border-radius:100px; padding:9px 14px; cursor:pointer; }
.perfil-hero { padding:166px 0 70px; }
.perfil-layout { display:grid; grid-template-columns:minmax(0,1fr) 290px; gap:52px; align-items:center; }
.perfil-inner { max-width:none; min-width:0; }
.perfil-hero h1 { font-size:clamp(42px,5.3vw,66px); line-height:1.06; letter-spacing:-.045em; }
.perfil-role { color:#F5F5F7; font-size:18px; margin-bottom:22px; }
.perfil-sub { color:#a5a5ab; font-size:18px; }
.portrait { margin:0; position:relative; }
.portrait img { width:100%; height:auto; aspect-ratio:4/5; object-fit:cover; object-position:top; border-radius:22px; filter:grayscale(.4); }
.portrait figcaption { color:#a5a5ab; font-size:12px; margin-top:14px; }
.portrait-mark { position:absolute; top:16px; right:16px; width:10px; height:10px; background:var(--signal); border-radius:50%; box-shadow:0 0 16px #00ff8855; }
.paths-section { padding:0 0 92px; }
.path-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.path-card { display:flex; flex-direction:column; padding:28px; border:1px solid #242426; border-radius:20px; background:linear-gradient(135deg,#ffffff08,#ffffff02); transition:border-color .2s,transform .2s; }
.path-card:hover { border-color:#FF6B2C; transform:translateY(-3px); }
.path-number { color:#FF6B2C; font-size:12px; letter-spacing:.12em; margin-bottom:20px; }
.path-card h3 { font-size:23px; margin-bottom:12px; }
.path-card p { color:#a5a5ab; font-size:15px; line-height:1.65; }
.path-card .path-link { margin-top:auto; padding-top:26px; font-size:14px; color:#F5F5F7; }
.path-card.commercial .path-number, .status-tag { color:var(--signal); }
.editorial-section { padding:84px 0; border-top:1px solid #1B1B1E; }
.editorial-head { display:flex; justify-content:space-between; gap:28px; align-items:end; margin-bottom:36px; }
.editorial-head h2 { margin-bottom:12px; max-width:650px; }
.editorial-head p { color:#a5a5ab; max-width:580px; font-size:17px; }
.text-link { color:#FF6B2C; font-size:14px; white-space:nowrap; text-underline-offset:5px; }
.text-link:hover { text-decoration:underline; }
.project-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
.project-card { border:1px solid #242426; background:#ffffff04; border-radius:22px; overflow:hidden; }
.project-copy { padding:30px; }
.project-copy h3 { font-size:27px; margin:16px 0; }
.project-copy p { font-size:16px; color:#a5a5ab; line-height:1.7; margin-bottom:16px; }
.project-copy .project-limit { padding-top:16px; border-top:1px solid #252528; font-size:13px; }
.project-actions { display:flex; flex-wrap:wrap; gap:12px 24px; margin-top:22px; }
.project-actions a { font-size:14px; color:#F5F5F7; border-bottom:1px solid #59595d; padding-bottom:3px; }
.status-tag { font-size:11px; letter-spacing:.08em; text-transform:uppercase; }
.retro-art { height:180px; display:grid; place-items:center; padding:24px; background:radial-gradient(ellipse at 50% 50%,#FF6B2C12,transparent 70%),#050505; border-bottom:1px solid #252528; }
.retro-window { width:270px; max-width:100%; padding:9px; background:#262730; border:2px solid #797c90; box-shadow:6px 6px 0 #000; font:11px/1.5 ui-monospace,monospace; color:#ddd; }
.retro-title { color:#d2d3dc; border-bottom:1px solid #85869c; padding:0 0 5px; margin-bottom:9px; font-size:10px; letter-spacing:.12em; }
.retro-screen { background:#07130d; color:#00FF88; padding:14px 10px; font-size:16px; letter-spacing:.05em; }
.retro-controls { padding:9px 4px 0; display:flex; justify-content:space-between; color:#c5c6d6; }
.messenger .retro-window { background:#e9eef4; color:#263343; border-color:#6484bc; }
.messenger .retro-title { color:#fff; background:#2c5dab; margin:-7px -7px 10px; padding:5px 9px; }
.messenger .retro-screen { background:#fff; color:#263343; font:12px/1.8 ui-monospace,monospace; padding:10px; }
.visual-note { display:block; color:#a5a5ab; font-size:11px; padding:10px 30px 0; }
.editorial-note { color:#a5a5ab; font-size:13px; margin-top:24px; }
.page-hero { padding:170px 0 76px; }
.page-hero h1 { font-size:clamp(42px,6vw,72px); line-height:1.07; max-width:850px; }
.page-hero .lead { max-width:710px; margin-top:24px; }
.page-hero .tag { margin-bottom:22px; }
.page-hero .perfil-actions { margin-top:32px; }
.page-title-accent { color:#FF6B2C; }
.split-copy { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:start; }
.split-copy p { color:#a5a5ab; line-height:1.75; margin-bottom:18px; }
.plain-list { padding-left:20px; color:#a5a5ab; line-height:1.8; }
.plain-list li { margin-bottom:12px; }
.format-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.format-card { border-top:2px solid #FF6B2C; padding:26px 0; }
.format-card h3 { font-size:24px; }
.format-card p { color:#a5a5ab; font-size:16px; margin-top:14px; }
.format-card .status-tag { color:#FF6B2C; }
.inquiry { padding:40px; border:1px solid #28282b; border-radius:24px; background:#ffffff04; }
.inquiry p { color:#a5a5ab; margin:20px 0; max-width:700px; }
.topic-list { display:grid; gap:0; }
.topic-list article { display:grid; grid-template-columns:60px 1fr; gap:22px; padding:30px 0; border-bottom:1px solid #252528; }
.topic-list .topic-index { color:#00FF88; font:13px ui-monospace,monospace; padding-top:5px; }
.topic-list h3 { font-size:26px; }
.topic-list p { color:#a5a5ab; max-width:720px; }
.reading { max-width:780px; }
.reading h2 { font-size:clamp(27px,4vw,38px); }
.reading p { color:#b2b2b8; font-size:18px; line-height:1.8; margin:18px 0; }
.reading strong { color:#F5F5F7; }
.claim-label { display:inline-block; color:#00FF88; font-size:11px; letter-spacing:.12em; text-transform:uppercase; margin-bottom:12px; }
.claim-box { border-left:2px solid #00FF88; padding:8px 0 8px 24px; margin:26px 0; }
.reading .source { font-size:13px; }
.reading .source a { color:#FF6B2C; text-decoration:underline; }
.reading nav { position:static; margin-top:40px; border-top:1px solid #252528; }
.demo-disclosure { display:block; color:#00FF88; background:#00ff8808; font-size:12px; line-height:1.6; padding:12px 16px; border:1px solid #00ff8826; border-radius:10px; margin:14px 0; }
.commercial-focus { grid-template-columns:repeat(2,minmax(0,1fr)); }
.mini-footer { padding:36px 0; border-top:1px solid #252528; color:#a5a5ab; font-size:13px; }
.mini-footer .container { display:flex; justify-content:space-between; flex-wrap:wrap; gap:20px; }
.mini-footer a { color:#F5F5F7; }
/* La lectura y la navegación funcionan también sin JavaScript. */
.fade-in { opacity:1; transform:none; }
@media (max-width:1050px) { .nav-links { gap:16px; font-size:13px; } .perfil-layout { gap:32px; grid-template-columns:minmax(0,1fr) 250px; } }
@media (max-width:900px) {
  .nav-inner { flex-wrap:wrap; }
  .nav-links { display:flex; flex-wrap:wrap; width:100%; order:3; gap:12px 24px; }
  .nav-ready .menu-toggle { display:inline-block; }
  .nav-ready .nav-links { display:none; }
  .nav-ready .nav-links.menu-open { display:flex; }
  nav { background:rgba(0,0,0,.95); }
  .perfil-layout { grid-template-columns:minmax(0,1fr) 220px; gap:24px; }
  .path-grid, .format-grid { grid-template-columns:1fr; }
  .path-card { padding:26px; }
  .path-card .path-link { padding-top:20px; }
  .path-number { margin-bottom:12px; }
  .editorial-head { display:block; }
  .editorial-head .text-link { display:inline-block; margin-top:20px; }
}
@media (max-width:640px) {
  .container { padding:0 22px; }
  .nav-actions { gap:8px; }
  .nav-cta { display:none; }
  .logo { font-size:16px; }
  .perfil-hero { padding:124px 0 52px; }
  .perfil-layout { grid-template-columns:1fr; }
  .portrait { display:flex; gap:16px; align-items:center; grid-row:1; margin:0 0 8px; }
  .portrait img { width:96px; border-radius:12px; }
  .portrait figcaption { max-width:220px; }
  .portrait-mark { top:8px; left:78px; }
  .perfil-hero h1 { font-size:42px; }
  .perfil-actions { gap:12px; }
  .perfil-actions a { font-size:14px; padding:13px 22px; }
  .paths-section { padding-bottom:60px; }
  .editorial-section { padding:64px 0; }
  .project-grid, .split-copy, .commercial-focus { grid-template-columns:1fr; }
  .project-copy { padding:24px; }
  .project-copy h3 { font-size:25px; }
  .page-hero { padding:130px 0 54px; }
  .page-hero h1 { font-size:42px; }
  .inquiry { padding:26px; }
  .topic-list article { grid-template-columns:26px 1fr; gap:12px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation:none !important; transition:none !important; }
}

/* Los encuentros son centrales; los experimentos quedan como una nota breve. */
.encounter-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.encounter-card { padding:30px; border:1px solid #28282b; border-radius:20px; background:#ffffff04; }
.encounter-card h3 { margin:18px 0 14px; font-size:28px; }
.encounter-card p { color:#a5a5ab; margin-bottom:20px; font-size:17px; line-height:1.75; }
.curiosity-section h2 { font-size:clamp(28px,4vw,38px); }
.curiosity-intro { color:#a5a5ab; max-width:740px; margin-bottom:26px; }
.curiosity-links { font-size:15px; color:#a5a5ab; }
.curiosity-links p { margin-bottom:16px; }
.curiosity-links strong { color:#f5f5f7; font-weight:500; }
.curiosity-links a { color:#FF6B2C; text-decoration:underline; text-underline-offset:4px; }
.legacy-anchor { display:block; height:0; }
@media (max-width:640px) { .encounter-grid { grid-template-columns:1fr; } .encounter-card { padding:24px; } .text-link { white-space:normal; } }

.media-card { grid-column:1/-1; }
.media-card p { max-width:750px; }
