:root {
  --bg: #f3efe7;
  --panel: #f8f5ee;
  --panel-2: #ebe4d8;
  --card: #faf8f3;
  --paper: #fffdf8;
  --ink: #181613;
  --muted: #655e56;
  --line: #cfc5b7;
  --accent: #a41034;
  --accent-2: #7b1834;
  --shadow: none;
}

html, body { height: 100%; overflow: hidden; }
body { background: var(--bg); font-family: Arial, Helvetica, sans-serif; }
.app-shell { display: block; min-height: 100dvh; }
.sidebar { position: fixed; z-index: 20; inset: 0 0 auto; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 1.2rem; width: 100%; height: 82px; padding: .7rem 1.5rem; overflow: hidden; color: var(--ink); background: rgba(248,245,238,.97); border: 0; border-bottom: 1px solid var(--line); }
.sidebar .eyebrow { grid-column: 1; margin: 0; color: var(--accent); white-space: nowrap; }
.sidebar h1, .sidebar-copy, .sidebar-note, .series-link { display: none; }
.pill-group { grid-column: 3; grid-row: 1; margin: 0; white-space: nowrap; }
.pill-group span { border-color: var(--line); background: transparent; }
.presenter-toggle { grid-column: 3; grid-row: 1; width: auto; padding: .55rem .75rem; margin-right: 7.5rem; border-color: var(--accent); border-radius: 0; background: transparent; color: var(--accent); }
.slide-nav { grid-column: 2; grid-row: 1; display: flex; gap: .18rem; margin: 0; overflow-x: auto; scrollbar-width: thin; }
.slide-nav button { flex: 0 0 42px; width: 42px; padding: .65rem .15rem; overflow: hidden; border-radius: 0; background: transparent; color: var(--muted); font-size: .75rem; text-align: center; white-space: nowrap; }
.slide-nav button:hover, .slide-nav button:focus-visible, .slide-nav button.is-active { background: var(--accent); color: #fff; }
.slide-nav .practical-nav { flex-basis: 46px; width: 46px; }

.presentation { display: block; width: 100%; max-width: none; height: 100dvh; padding: 82px 0 58px; }
.slide { width: 100%; height: calc(100dvh - 140px); padding: clamp(1.5rem, 4vw, 4rem) clamp(1.5rem, 6vw, 6.5rem); overflow: auto; border: 0; border-radius: 0; background: var(--paper); }
.slide::after { top: clamp(1.5rem, 4vw, 4rem); right: clamp(1.5rem, 6vw, 6.5rem); border-radius: 0; border-color: var(--accent); color: var(--accent); }
.slide h2 { width: 100%; max-width: none; padding-right: 0; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(2.2rem, 4.7vw, 5.2rem); font-weight: 400; letter-spacing: -.045em; }
.opening-title { display: grid; gap: .05em; text-transform: uppercase; }
.hyperproductivity-mark { display: flex; flex-wrap: nowrap; align-items: baseline; color: var(--accent); font-size: .92em; letter-spacing: -.055em; line-height: .92; }
.hyperproductivity-mark > span:first-child { font-weight: 700; }
.hyperproductivity-mark sup { position: relative; top: -.48em; margin: 0 .08em 0 .04em; font-family: Arial, Helvetica, sans-serif; font-size: .42em; font-weight: 900; letter-spacing: 0; line-height: 1; }
.slide-kicker, .section-label { color: var(--accent); }
.lead { font-family: Georgia, 'Times New Roman', serif; font-size: clamp(1rem, 1.5vw, 1.35rem); }
.controls { position: fixed; z-index: 21; inset: auto 0 0; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; height: 58px; margin: 0; padding: 0 1.5rem; border-top: 1px solid var(--line); background: rgba(248,245,238,.98); }
.controls button { width: max-content; border-radius: 0; background: transparent; color: var(--accent); font-weight: 800; }
.controls button:last-child { justify-self: end; }
.controls #counter { font-family: Georgia, 'Times New Roman', serif; }
.key-takeaway, .bridge-question, .judicial-rule { border-radius: 0; background: var(--accent); }
.choice-stage button, .three-step button, .journey button, .work-cycle button, .judicial-flow button, .scenario-grid article, .brake-grid article, .comparison-stage article, .design-canvas label { border-radius: 0; }

.brain-stage { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); grid-template-rows: repeat(2, minmax(86px,auto)); gap: .65rem; margin-top: 1.1rem; }
.brain-stage button { padding: .8rem; border: 1px solid var(--line); border-radius: 0; background: var(--card); color: var(--ink); text-align: left; cursor: pointer; }
.brain-stage button span, .brain-stage button small { display: block; }
.brain-stage button span { color: var(--accent); font-family: Georgia, 'Times New Roman', serif; font-size: 1.15rem; }
.brain-stage button small { margin-top: .25rem; color: var(--muted); }
.brain-stage button:hover, .brain-stage button:focus-visible, .brain-stage button.is-selected { border-color: var(--accent); background: #f8e9ed; }
.brain-core { grid-column: 2; grid-row: 1 / 3; display: grid; place-content: center; min-height: 210px; padding: 1rem; border: 1px solid var(--accent); background: #240b13; color: #fff; text-align: center; }
.brain-core i { width: 18px; height: 18px; margin: 0 auto .8rem; border-radius: 50%; background: #e4385d; box-shadow: 0 0 0 9px rgba(228,56,93,.16); animation: brain-pulse 1.8s ease-in-out infinite; }
.brain-core strong { font-family: Georgia, 'Times New Roman', serif; font-size: clamp(1.6rem, 3vw, 3rem); font-weight: 400; }
.brain-core strong .brain-symbol { display: block; margin-bottom: .35rem; font-family: sans-serif; font-size: .85em; line-height: 1; }
.brain-core span, .brain-core small { margin-top: .35rem; color: rgba(255,255,255,.72); }
.brain-detail { margin-top: .7rem; padding: .7rem 1rem; border-left: 4px solid var(--accent); background: #f8e9ed; font-weight: 700; }
.brain-sources { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .65rem; }
.brain-sources span, .brain-sources a { padding: .35rem .55rem; border: 1px solid var(--line); color: var(--ink); font-size: .72rem; text-decoration: none; }
.brain-sources a { margin-left: auto; border-color: var(--accent); color: var(--accent); font-weight: 800; }
.restricted-note { margin: .5rem 0 0; color: var(--muted); font-size: .72rem; }
.buzz-anatomy { display: grid; grid-template-columns: minmax(0,1.65fr) minmax(260px,.7fr); gap: 1.25rem; min-height: 0; }
.buzz-anatomy-screen { position: relative; min-height: min(50vh,480px); margin: 0; overflow: hidden; border: 1px solid var(--line); background: #18161b; }
.buzz-anatomy-screen img { width: 100%; height: 100%; object-fit: cover; object-position: top left; }
.buzz-tag { position: absolute; display: grid; place-items: center; width: 44px; height: 44px; border: 3px solid #fff; border-radius: 50%; background: #e2a400; color: #17120a; box-shadow: 0 3px 15px rgba(0,0,0,.45); font-size: 1.25rem; font-weight: 900; }
.buzz-tag::after { content: ''; position: absolute; width: 52px; height: 3px; background: #e2a400; transform-origin: left center; }
.buzz-tag--1 { top: 9%; left: 4%; }.buzz-tag--1::after { left: 34px; transform: rotate(12deg); }
.buzz-tag--2 { top: 40%; left: 17%; }.buzz-tag--2::after { left: 34px; transform: rotate(-18deg); }
.buzz-tag--3 { top: 28%; left: 58%; }.buzz-tag--3::after { right: 34px; transform: rotate(165deg); }
.buzz-anatomy-key { display: flex; flex-direction: column; justify-content: center; }
.buzz-anatomy-key ol { display: grid; gap: .75rem; margin: 0; padding: 0; list-style: none; counter-reset: anatomy; }
.buzz-anatomy-key li { display: grid; grid-template-columns: 38px 1fr; padding-bottom: .65rem; border-bottom: 1px solid var(--line); counter-increment: anatomy; }
.buzz-anatomy-key li::before { content: counter(anatomy); grid-row: 1 / 3; display: grid; place-items: center; width: 30px; height: 30px; background: #e2a400; color: #17120a; font-weight: 900; }
.buzz-anatomy-key li b,.buzz-anatomy-key li span { grid-column: 2; }.buzz-anatomy-key li span { margin-top: .18rem; color: var(--muted); font-size: .82rem; }
.buzz-desktop-link { display: block; margin-top: 1rem; padding: .85rem 1rem; background: var(--accent); color: #fff; font-weight: 900; text-align: center; text-decoration: none; }
.buzz-anatomy-key small { margin-top: .45rem; color: var(--muted); }
.slide--fishbone { background: linear-gradient(135deg,#fffdf8 0%,#f5eee4 100%); }
.fishbone { display: grid; grid-template-rows: minmax(95px,1fr) 54px minmax(140px,1.25fr); margin-top: .5rem; }
.fishbone-old,.fishbone-new { display: grid; gap: 1rem; padding-right: min(20vw,250px); }
.fishbone-old { grid-template-columns: repeat(3,1fr); align-items: end; }.fishbone-new { grid-template-columns: repeat(5,1fr); align-items: start; }
.fishbone article { position: relative; padding: .55rem .65rem; border: 1px solid var(--line); background: rgba(255,253,248,.9); }
.fishbone article::after { content: ''; position: absolute; left: 50%; width: 2px; height: 34px; background: var(--accent); }
.fishbone-old article::after { top: 100%; transform: rotate(-32deg); transform-origin: top; }.fishbone-new article::after { bottom: 100%; transform: rotate(32deg); transform-origin: bottom; }
.fishbone article span { display: block; color: var(--accent); font-size: .64rem; font-weight: 900; letter-spacing: .08em; }
.fishbone article b,.fishbone article small { display: block; }.fishbone article b { margin-top: .15rem; font-family: Georgia,'Times New Roman',serif; }.fishbone article small { margin-top: .25rem; color: var(--muted); line-height: 1.25; }
.fishbone-spine { position: relative; align-self: center; height: 5px; margin-right: min(18vw,220px); background: var(--accent); }
.fishbone-spine > span { position: absolute; bottom: .45rem; left: 0; color: var(--accent); font-size: .65rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.fishbone-spine i { position: absolute; right: -18px; top: -8px; width: 0; height: 0; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-left: 18px solid var(--accent); }
.fishbone-head { position: absolute; left: calc(100% + 24px); top: 50%; width: min(18vw,220px); padding: .75rem; background: #240b13; color: #fff; transform: translateY(-50%); font-size: .7rem; letter-spacing: .08em; }
.fishbone-head em { display: block; margin-top: .25rem; font-family: Georgia,'Times New Roman',serif; font-size: clamp(1rem,1.5vw,1.45rem); font-style: normal; letter-spacing: 0; }
.fishbone-rule { margin: .2rem 0 0; padding: .65rem 1rem; border-left: 5px solid var(--accent); background: #f8e9ed; }
.skills-explorer { display: grid; grid-template-columns: minmax(250px,.7fr) minmax(0,1.65fr); gap: 1.1rem; min-height: min(50vh,480px); margin-top: .65rem; }
.skills-buttons { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .38rem; align-content: start; }
.skills-buttons button { display: flex; align-items: center; gap: .45rem; min-height: 48px; padding: .55rem .65rem; border: 1px solid var(--line); border-radius: 0; background: var(--card); color: var(--ink); font-weight: 800; text-align: left; cursor: pointer; }
.skills-buttons button:hover,.skills-buttons button:focus-visible,.skills-buttons button.is-selected { border-color: var(--accent); background: #f8e9ed; color: var(--accent); box-shadow: inset 5px 0 0 var(--accent); }
.skills-buttons button span { line-height: 1.12; }
.skill-detail { display: grid; grid-template-columns: minmax(260px,1fr) minmax(250px,.85fr); min-height: 0; overflow: hidden; border: 1px solid var(--accent); background: var(--paper); }
.skill-detail-visual { min-height: 300px; background-image: url('habilidades-agentes-editorial-v1.png'); background-repeat: no-repeat; background-position: 0% 0%; background-size: 500% 200%; }
.skill-detail-copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(1rem,2vw,1.65rem); border-left: 1px solid var(--line); }
.skill-detail-copy h3 { margin: .2rem 0 .75rem; font-family: Georgia,'Times New Roman',serif; font-size: clamp(1.35rem,2.2vw,2.25rem); font-weight: 400; line-height: 1.05; }
.skill-detail-copy > p { margin: 0; line-height: 1.42; }.skill-detail-copy .section-label { color: var(--accent); font-size: .7rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.skill-detail-example { margin-top: 1rem !important; padding-top: .8rem; border-top: 1px solid var(--line); color: var(--muted); font-size: .86rem; }
.skills-prompt { margin: .6rem 0 0; color: var(--accent); }
.buzz-evidence-gallery figure { border-radius: 0; }
.buzz-evidence-main { min-height: min(48vh, 460px); }
.funnel-inputs button,.multiplexer-terminal,.funnel-neck,.concept-buttons button,.concept-layers > div,.concept-detail { border-radius: 0; }
.funnel-neck { background: var(--accent); }
.concept-layers > div.is-active { background: var(--accent); }
.interaction-system { min-height: 330px; }
.terminal-grid { grid-template-rows: repeat(4,minmax(50px,1fr)); }
.terminal-proof,.multiplexer-terminal { border-radius: 0; }
.opening-figures figure { border-radius: 0; }
.opening-stage .choice-stage button { border-radius: 0; }
@keyframes brain-pulse { 50% { transform: scale(1.25); opacity: .72; } }

@media (max-width: 900px) {
  html, body { overflow: auto; }
  .sidebar { grid-template-columns: auto 1fr; height: 72px; padding: .55rem .8rem; }
  .slide-nav { grid-column: 2; }
  .pill-group, .presenter-toggle { display: none; }
  .presentation { height: auto; padding-top: 72px; }
  .slide { min-height: calc(100dvh - 130px); height: calc(100dvh - 130px); padding: 1.35rem 1rem; }
  .slide h2 { font-size: clamp(2rem, 10vw, 3.3rem); }
  .hyperproductivity-mark { font-size: clamp(.68em, 8.6vw, .9em); }
  .brain-stage { grid-template-columns: 1fr 1fr; }
  .brain-core { grid-column: 1 / -1; grid-row: auto; min-height: 150px; }
  .brain-sources a { margin-left: 0; }
  .buzz-evidence-gallery { grid-template-columns: 1fr; }
  .buzz-evidence-main { min-height: 250px; }
  .buzz-evidence-stack { grid-template-columns: repeat(2, minmax(0,1fr)); grid-template-rows: none; }
  .buzz-anatomy { grid-template-columns: 1fr; }.buzz-anatomy-screen { min-height: 280px; }.buzz-anatomy-key ol { grid-template-columns: repeat(3,1fr); }.buzz-anatomy-key li { display: block; }
  .fishbone { display: block; }.fishbone-old,.fishbone-new { grid-template-columns: 1fr; padding: 0; }.fishbone article::after,.fishbone-spine { display: none; }.fishbone-new { margin-top: .75rem; }
  .skills-explorer { grid-template-columns: 1fr; }.skills-buttons { grid-template-columns: repeat(2,minmax(0,1fr)); }.skill-detail { grid-template-columns: 1fr 1fr; }.skill-detail-visual { min-height: 230px; }
}

@media (max-width: 620px) {
  .skills-buttons,.skill-detail { grid-template-columns: 1fr; }.skill-detail-visual { min-height: 240px; }.skill-detail-copy { border-left: 0; border-top: 1px solid var(--line); }
}

@media (prefers-reduced-motion: reduce) { .brain-core i { animation: none; } }

/* Iteración v1.3: estrategias para aterrizar IA en la última milla */
.slide--landing { background: linear-gradient(135deg,#fffdf8 0%,#f4eee5 100%); }
.landing-stage { display: grid; grid-template-columns: minmax(260px,.72fr) minmax(250px,.62fr) minmax(320px,1fr); gap: 1rem; min-height: min(46vh,440px); margin-top: 1rem; }
.landing-visual { position: relative; min-height: 330px; margin: 0; overflow: hidden; background: #06162d; }
.landing-visual img { display: block; width: 100%; height: 100%; object-fit: cover; }
.landing-visual figcaption { position: absolute; inset: auto 0 0; padding: 2.6rem 1rem 1rem; color: #fff; background: linear-gradient(transparent,rgba(2,10,25,.94)); }
.landing-visual figcaption b,.landing-visual figcaption span { display: block; }.landing-visual figcaption b { font-family: Georgia,'Times New Roman',serif; font-size: 1.35rem; }.landing-visual figcaption span { margin-top: .25rem; font-size: .76rem; line-height: 1.35; }
.landing-paths { display: grid; grid-template-rows: repeat(4,1fr); gap: .45rem; }
.landing-paths button { display: grid; grid-template-columns: 34px 1fr; align-content: center; padding: .65rem .75rem; border: 1px solid var(--line); background: var(--card); color: var(--ink); text-align: left; cursor: pointer; }
.landing-paths button b { grid-row: 1 / 3; color: var(--accent); font-size: .7rem; }.landing-paths button span { font-family: Georgia,'Times New Roman',serif; font-size: 1.05rem; }.landing-paths button small { margin-top: .15rem; color: var(--muted); }
.landing-paths button:hover,.landing-paths button:focus-visible,.landing-paths button.is-selected { border-color: var(--accent); background: #f8e9ed; box-shadow: inset 5px 0 0 var(--accent); }
.landing-detail { display: flex; flex-direction: column; justify-content: center; padding: clamp(1rem,2vw,1.5rem); border: 1px solid var(--accent); background: var(--paper); }
.landing-detail h3 { margin: .15rem 0 .65rem; font-family: Georgia,'Times New Roman',serif; font-size: clamp(1.7rem,2.5vw,2.7rem); font-weight: 400; }.landing-detail > p { margin: 0; line-height: 1.45; }
.landing-detail dl { display: grid; gap: .55rem; margin: 1rem 0 0; }.landing-detail dl div { padding-top: .55rem; border-top: 1px solid var(--line); }.landing-detail dt { color: var(--accent); font-size: .66rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }.landing-detail dd { margin: .2rem 0 0; font-size: .8rem; line-height: 1.35; }
.landing-rule { margin: .7rem 0 0; padding: .65rem 1rem; border-left: 5px solid var(--accent); background: #f8e9ed; }
@media (max-width: 900px) { .landing-stage { grid-template-columns: 1fr 1fr; }.landing-visual { min-height: 250px; }.landing-detail { grid-column: 1 / -1; } }
@media (max-width: 620px) { .landing-stage { grid-template-columns: 1fr; }.landing-detail { grid-column: 1; }.landing-visual { min-height: 230px; } }

/* Iteración v1.4: legibilidad de proyección, escalada por componente */
@media (min-width: 901px) {
  .slide { padding: clamp(1.25rem, 2.4vw, 2.7rem) clamp(1.5rem, 4vw, 4.5rem); }
  .slide h2 { font-size: clamp(3rem, 4.35vw, 5rem); line-height: .98; }
  .slide-kicker, .section-label { font-size: .9rem; }
  .lead { font-size: clamp(1.2rem, 1.45vw, 1.4rem); line-height: 1.35; }

  .slide button, .slide a { font-size: 1rem; }
  .controls button, .controls #counter, .presenter-toggle { font-size: 1rem; }
  .slide-nav button { flex-basis: 46px; width: 46px; font-size: 1rem; }

  .vision-selector button { min-height: 112px; padding: .8rem .9rem; }
  .vision-selector button b, .vision-selector button small, .vision-caption b,
  .vision-caption span, .vision-tech-grid figcaption, .vision-hito-core small,
  .twin-node small, .twin-partners b, .vision-feedback { font-size: .9rem; }
  .vision-selector button span, .vision-caption strong { font-size: 1.12rem; }

  .disclaimer-thesis p, .disclaimer-thesis small, .disclaimer-orbit article p,
  .disclaimer-parking, .disclaimer-close { font-size: .95rem; line-height: 1.35; }
  .disclaimer-thesis h3 { font-size: clamp(1.5rem, 2vw, 2.1rem); }

  .bpm-lane button { margin-inline: .25rem; }

  .brain-stage button { min-height: 100px; }
  .brain-stage button span { font-size: 1.25rem; }
  .brain-stage button small, .brain-core span, .brain-core small, .brain-detail,
  .brain-sources span, .brain-sources a, .restricted-note { font-size: .9rem; line-height: 1.3; }

  .buzz-anatomy-key li span, .buzz-anatomy-key small, .buzz-desktop-link { font-size: 1rem; line-height: 1.35; }
  .fishbone article span, .fishbone article small, .fishbone-spine > span,
  .fishbone-head, .fishbone-rule { font-size: .9rem; }
  .fishbone article b { font-size: 1.08rem; }

  .concept-table { font-size: clamp(.9rem, 1vw, 1rem); }
  .concept-buttons button, .concept-layers span, .concept-layers small,
  .concept-detail p, .concept-area h3 { font-size: .9rem; }
  .concept-buttons button { min-height: 54px; }
  .concept-dialog-heading, .concept-dialog-example > span, .concept-dialog-signal > span,
  .concept-dialog-example p, .concept-dialog-signal p, .concept-dialog-graphic div { font-size: .9rem; }

  .skills-buttons button { min-height: 58px; font-size: 1rem; }
  .skill-detail-copy .section-label, .skill-detail-example, .skills-prompt { font-size: .9rem; }
  .skill-detail-copy > p { font-size: 1.05rem; }
  .recap-gallery span, .recap-dialog footer a, .recap-dialog footer span { font-size: .9rem; }

  .roadmap-orgs button { min-height: 44px; font-size: 1rem; }
  .roadmap-track { grid-template-columns: 1fr 16px 1fr 16px 1fr 16px 1fr 16px 1fr; }
  .roadmap-track button { grid-template-columns: 22px 28px 1fr; min-height: 92px; padding: .55rem; }
  .roadmap-track button b, .roadmap-track button small { font-size: .8rem; }
  .roadmap-track button strong { font-size: .9rem; line-height: 1.1; }
  .roadmap-detail h3 { font-size: 1.3rem; }
  .roadmap-detail p, .roadmap-detail dt, .roadmap-detail dd, .roadmap-note { font-size: .9rem; line-height: 1.3; }
  .roadmap-dialog-content h3 { font-size: 2rem; }
  .roadmap-dialog-content > p:not(.section-label), .roadmap-dialog-facts b,
  .roadmap-dialog-facts span, .roadmap-dialog-content li { font-size: .95rem; }
  .roadmap-dialog-content li { min-height: 52px; padding: .7rem .7rem .7rem 3rem; }

  .landing-paths button { min-height: 82px; padding: .7rem .8rem; }
  .landing-paths button b, .landing-paths button small, .landing-visual figcaption span,
  .landing-detail dt, .landing-detail dd, .landing-rule { font-size: .9rem; line-height: 1.35; }
  .landing-paths button span { font-size: 1.18rem; }
  .landing-detail > p { font-size: 1.05rem; }
}

@media (max-width: 900px) {
  .slide button, .slide a, .controls button { font-size: 1rem; }
  .lead { font-size: 1.15rem; }
  .vision-selector button small, .roadmap-track button small,
  .landing-paths button small, .restricted-note { font-size: .875rem; }
  .roadmap-track button, .landing-paths button, .skills-buttons button { min-height: 52px; font-size: 1rem; }
  .roadmap-detail p, .roadmap-detail dt, .roadmap-detail dd, .roadmap-note,
  .landing-detail dt, .landing-detail dd, .landing-rule { font-size: .9rem; }
}