:root { --accent:#E6007E; --text:#111; --muted:#3B4048; --line:#e6e6e6; --hf:'Familjen Grotesk',sans-serif; --bf:'Inter',system-ui,sans-serif; }
  * { box-sizing:border-box; }
  body { margin:0; background:#fff; color:var(--text); font-family:var(--bf); font-size:17px; line-height:1.6; }
  .wrap { max-width:728px; margin:0 auto; padding:0 24px; }
  .label { background:#111; color:#fff; font-size:12px; letter-spacing:.1em; text-transform:uppercase; padding:10px 24px; margin:0; }
  nav { display:flex; justify-content:space-between; align-items:center; height:60px; font-size:15px; }
  nav .name { font-family:var(--hf); font-weight:600; font-size:19px; }
  nav .links { display:flex; gap:22px; align-items:center; }
  nav .cv, nav .lang { display:inline-flex; align-items:center; gap:3px; }
  nav .ico { width:20px; height:20px; stroke:#111; fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
  nav .lang .ico { width:17px; height:17px; }
  nav .links.mobile { display:none; }
  @media (max-width:700px) {
    nav { height:56px; }
    nav .links.desktop { display:none; }
    nav .links.mobile { display:flex; }
    nav .name { font-size:17px; }
    nav .links.mobile { gap:18px; font-size:15px; }
    nav .burger { font-size:22px; line-height:1; }
    nav .cv, nav .lang { display:inline-flex; align-items:center; gap:2px; }
    nav .ico { width:22px; height:22px; stroke:#111; fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
    nav .lang .ico { width:19px; height:19px; }
    .wrap { padding:0 16px; }
    h1 { font-size:34px; }
    .lead { font-size:16px; margin-bottom:32px; }
    .index h2 { font-size:24px; }
    .index a { padding:18px 0; gap:14px; }
    h1.area { font-size:28px; }
    summary h3 { font-size:21px; }
    summary .plus { font-size:30px; }
    .body { padding-left:0; }
    .body .desc { font-size:17px; }
    .body .role, .body .note { font-size:15px; }
    .body h4 { font-size:20px; }
    .body .data { grid-template-columns:1fr 1fr; gap:14px; }
    .body .data b { font-size:26px; }
    figure.wide, figure.shots2, figure.pair { max-width:100% !important; }
    figure.pair { grid-template-columns:1fr 1fr; gap:12px; }
    figure.pair .phone img { max-width:100%; }
    figure.shots2 .shots { grid-template-columns:1fr 1fr; gap:12px; }
    figure.shots2 .shots img { max-width:100%; }
    .flow { grid-template-columns:1fr; gap:0; }
    .flow .arr { transform:rotate(90deg); justify-self:center; font-size:18px; line-height:1; height:18px; margin:-4px 0; }
    .diagram-result { align-items:flex-start; }
  }

  /* rotulador */
  .mark { position:relative; display:inline-block; z-index:0; }
  .mark::after { content:""; position:absolute; left:-.06em; right:-.06em; bottom:.06em; height:.22em; background:var(--accent); opacity:.85; z-index:-1; transform:skewY(-.8deg); border-radius:1px; }

  h1 { font-family:var(--hf); font-weight:550; font-size:clamp(32px,4.6vw,48px); line-height:1.06; letter-spacing:-0.015em; margin:48px 0 12px; }
  .eyebrow-home + h1 { margin-top:0; margin-bottom:24px; }
  .page h1, .hero h1, main > h1 { max-width:680px; }
  .lead { color:var(--muted); font-size:18px; max-width:none; margin:0 0 48px; }

  /* índice: lista gigante numerada */
  .index { list-style:none; margin:0; padding:0; counter-reset:area; }
  .index li { counter-increment:area; border-top:1.5px solid var(--text); }
  .index li:last-child { border-bottom:1.5px solid var(--text); }
  .index a { display:grid; grid-template-columns:3.2ch 1fr; align-items:baseline; gap:20px; padding:22px 0; text-decoration:none; color:inherit; }
  .index a::before { content:"0" counter(area); font-family:var(--hf); font-weight:500; font-size:26px; color:var(--accent); font-variant-numeric:tabular-nums; }
  .index h2 { font-family:var(--hf); font-weight:500; font-size:clamp(26px,4.2vw,44px); line-height:1.02; letter-spacing:-0.015em; margin:0; position:relative; display:inline; z-index:0; }
  .index a:hover h2 { text-decoration:underline; text-decoration-thickness:1.5px; text-underline-offset:.14em; }
  .index .n { font-family:var(--hf); font-size:15px; color:var(--muted); white-space:nowrap; }
  .index .n b { font-weight:600; color:var(--text); }
  @media (max-width:600px) { .index a { grid-template-columns:3ch 1fr; } .index .n { grid-column:2; } }

  /* interior */
  .back { font-family:var(--hf); font-weight:550; font-size:19px; color:var(--text); text-decoration:none; display:inline-flex; align-items:center; min-height:44px; margin-top:28px; }
  .back:hover { text-decoration:underline; text-decoration-thickness:1.5px; text-underline-offset:.18em; }
  @media (max-width:700px) { .back { font-size:18px; } }
  .back::before { content:"←"; margin-right:8px; }
  .eyebrow { font-family:var(--hf); font-size:14px; color:var(--muted); margin:36px 0 4px; }
  h1.area { margin-top:0; font-size:clamp(30px,4.6vw,48px); }
  .cases { list-style:none; margin:40px 0 0; padding:0; counter-reset:c; }
  details { border-top:1.5px solid var(--text); counter-increment:c; }
  details:last-child { border-bottom:1.5px solid var(--text); }
  summary { list-style:none; cursor:pointer; padding:24px 0; display:grid; grid-template-columns:3.6ch 1fr auto; gap:20px; align-items:baseline; }
  summary h3 .brand { font-weight:inherit; color:inherit; white-space:nowrap; }
  summary::-webkit-details-marker { display:none; }
  summary::before { content:"0" counter(c); font-family:var(--hf); font-weight:500; font-size:26px; color:var(--accent); font-variant-numeric:tabular-nums; }
  summary h3 { font-family:var(--hf); font-weight:500; font-size:clamp(24px,3.6vw,36px); line-height:1.04; letter-spacing:-0.015em; margin:0; display:inline; position:relative; z-index:0; }
  summary .meta { font-family:var(--hf); font-size:15px; color:var(--muted); white-space:nowrap; }
  summary .plus { font-family:var(--hf); font-weight:500; font-size:40px; line-height:1; color:var(--text); transition:transform .25s; }
  details[open] summary .plus { transform:rotate(45deg); }
  .body { padding:4px 0 40px 3.6ch; max-width:66ch; }
  .body .desc { font-size:17px; line-height:1.6; color:var(--text); margin:0 0 8px; font-weight:600; }
  .body .role { font-size:16px; color:var(--muted); margin:0 0 22px; }
  .body .data { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin:0 0 22px; }
  .body .data b { display:block; font-family:var(--hf); font-weight:500; font-size:clamp(24px,3vw,34px); line-height:1.05; letter-spacing:-0.02em; white-space:nowrap; }
  .body .data span { font-size:13px; color:var(--muted); line-height:1.3; display:block; margin-top:4px; }
  .body .note { font-size:16px; color:var(--muted); margin:0 0 8px; }
  .body .list { margin:0 0 12px; padding-left:1.2em; }
  .body .list li { margin-bottom:6px; }
  @media (max-width:700px) { .body .data { grid-template-columns:repeat(2,1fr); } }
  .body h4 { font-family:var(--hf); font-weight:550; font-size:22px; margin:20px 0 8px; }
  .body p { margin:0 0 12px; color:var(--text); }
  .body strong { font-weight:600; }
  .ph { border:1.5px dashed #ccc; border-radius:4px; padding:36px 20px; color:var(--muted); font-size:14px; text-align:center; margin:16px 0 28px; }
  @media (max-width:600px) { summary { grid-template-columns:3ch 1fr auto; } summary .meta { grid-column:2; } .body { padding-left:0; } }

  .next { margin-top:56px; padding:32px 0 64px; border-top:1.5px solid var(--text); }
  .next span { font-family:var(--hf); font-size:15px; color:var(--accent); display:block; margin-bottom:6px; }
  .next a { font-family:var(--hf); font-weight:500; font-size:clamp(28px,5vw,48px); line-height:1.05; color:inherit; text-decoration:none; }
  .next a:hover { text-decoration:underline; text-decoration-color:var(--accent); text-decoration-thickness:.12em; text-underline-offset:.12em; }
  .more { margin-top:56px; padding:8px 0 48px; border-top:1.5px solid var(--text); }
  .more-title { font-family:var(--hf); font-size:14px; color:var(--muted); margin:0 0 14px; }
  .more-list { list-style:none; margin:0 0 24px; padding:0; }
  .more-list li { border-top:1px solid var(--line); }
  .more-list li:last-child { border-bottom:1px solid var(--line); }
  .more-list a { display:flex; gap:18px; align-items:baseline; padding:14px 0; text-decoration:none; color:inherit; font-family:var(--hf); font-weight:500; font-size:clamp(20px,2.6vw,26px); }
  .more-list a:hover { color:var(--accent); }
  .more-list .k { font-size:14px; color:var(--muted); font-variant-numeric:tabular-nums; }
  .more .back { margin-top:0; }
  .cases + .more { border-top:0; margin-top:24px; }
  figure { margin:20px 0 28px; }
  figure img { width:100%; height:auto; display:block; background:#f6f6f6; border:1px solid var(--line); border-radius:4px; }
  figure.wide { max-width:560px; }
  figure.pair { display:grid; grid-template-columns:1fr 1fr; gap:24px; max-width:640px; align-items:start; }
  figure.pair .phone img { max-width:210px; }
  figure.shots2 { max-width:440px; }
  figure.shots2 .shots { display:grid; grid-template-columns:1fr 1fr; gap:16px; align-items:start; }
  figure.shots2.n4 { max-width:440px; }
  figure.shots2.n4 .shots { grid-template-columns:1fr 1fr; }
  @media (max-width:700px) { figure.shots2.n4 .shots { grid-template-columns:1fr 1fr; } }
  figure.shots2 .shots img { max-width:210px; }
  figure.trio { display:grid; grid-template-columns:2fr 1fr; gap:28px; max-width:680px; align-items:start; }
  figure.trio .shots img { max-width:210px; }
  figure.trio .shots { display:grid; grid-template-columns:1fr 1fr; gap:12px; align-items:start; }
  figure.trio > div:last-child .shots { grid-template-columns:1fr; }
  @media (max-width:700px) { figure.trio { grid-template-columns:1fr; } }
  figure.pair .phone { display:flex; flex-direction:column; align-items:flex-start; }
  .tag { display:inline-block; font-family:var(--hf); font-weight:550; font-size:15px; letter-spacing:.06em; text-transform:uppercase; color:var(--text); border-bottom:3px solid var(--accent); padding-bottom:3px; margin-bottom:12px; }
  .diagram-box { border:1.5px solid var(--text); border-radius:6px; padding:18px 20px 0; }
  .diagram-label { display:inline-block; font-family:var(--hf); font-weight:550; font-size:15px; letter-spacing:.06em; text-transform:uppercase; color:var(--text); border-bottom:3px solid var(--accent); padding-bottom:2px; margin-bottom:18px; }
  .flow { display:grid; grid-template-columns:1fr auto 1fr auto 1fr; gap:10px; align-items:stretch; }
  .flow .step { border:1.5px solid var(--text); border-radius:4px; padding:14px; display:flex; flex-direction:column; justify-content:center; }
  .flow .arr { align-self:center; }
  .diagram-result { display:flex; gap:14px; align-items:center; border-top:1.5px solid var(--text); margin:18px -20px 0; padding:14px 20px 16px; background:#fafafa; border-radius:0 0 6px 6px; }
  .diagram-result b { font-family:var(--hf); font-weight:550; font-size:15px; letter-spacing:.06em; text-transform:uppercase; color:var(--text); white-space:nowrap; }
  .diagram-result span { font-size:15px; color:var(--text); line-height:1.4; }
  .flow .step b { display:block; font-family:var(--hf); font-weight:550; font-size:17px; line-height:1.15; }
  .flow .step span { display:block; font-size:13px; color:var(--muted); margin-top:4px; }
  .flow .arr { font-family:var(--hf); font-size:24px; color:var(--accent); }
  @media (max-width:700px) { .flow { grid-template-columns:1fr; } .flow .arr { transform:rotate(90deg); justify-self:center; } .diagram-result { flex-direction:column; gap:4px; } }
  .divider { height:48px; background:#f3f3f3; }
  footer { border-top:1px solid var(--line); padding:24px 0 56px; font-size:13px; color:var(--muted); }

  nav .name { display:inline-block; position:relative; padding-bottom:2px; }
  nav i.u { display:block; height:4px; background:#E6007E; opacity:.85; border-radius:1px; transform:skewY(-1.2deg); margin-top:-3px; }

  summary h3 { position:relative; z-index:0; }
  /* C: titulares de sección con marca corta fucsia */
  .body h4 { display:inline-block; padding-bottom:4px; border-bottom:4px solid var(--accent); }
  .body figure + h4 { margin-top:4px; }
  .eyebrow-home { font-family:var(--hf); font-weight:500; font-size:22px; color:var(--text); margin:48px 0 12px; display:inline-block; }
  @media (max-width:700px) { .eyebrow-home { font-size:17px; font-weight:600; margin:32px 0 12px; } }
  .eyebrow-home i.u { display:block; height:4px; background:#E6007E; opacity:.85; border-radius:1px; transform:skewY(-1.2deg); margin-top:-2px; }
  .cap { display:block; font-size:14px; font-weight:600; line-height:1.3; color:var(--text); margin:0 0 8px; }
  figure.shots2 .shots .shot { display:flex; flex-direction:column; align-items:flex-start; }
  figure.shots2 .shots .shot img { max-width:210px; }
  @media (max-width:700px) { figure.shots2 .shots .shot img { max-width:100%; } }
  .fig-intro { font-size:16px; line-height:1.6; margin:0 0 16px; color:var(--text); }
  ul.fig-intro { margin:0 0 18px; }


  nav { position:sticky; top:0; z-index:20; background:rgba(255,255,255,.94); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border-bottom:1px solid var(--line); margin:0 -24px; padding:0 24px; }
  @media (max-width:700px) { nav { margin:0 -16px; padding:0 16px; } }


  .ph { text-align:left; }
  .ph .tag { display:block; width:max-content; max-width:100%; margin-bottom:10px; }
  .body strong { font-weight:600; color:var(--text); }


  .flow6 { grid-template-columns:repeat(3, minmax(0,1fr)); gap:14px 22px; }
  .flow6 .arr { display:none; }
  .diagram-box.no-result { padding-bottom:20px; }
  .flow6 .step { padding:12px 10px; position:relative; justify-content:flex-start; }
  .flow6 .step:not(:last-child)::after { content:"→"; position:absolute; right:-19px; top:50%; transform:translateY(-50%); color:var(--accent); font-family:var(--hf); font-size:16px; background:#fff; line-height:1; }
  .flow6 .step b { font-size:15px; }
  .flow6 .step span { font-size:12px; }
  .flow6 .arr { font-size:18px; }
  @media (max-width:700px) { .flow6 { grid-template-columns:1fr; gap:14px; } .flow6 .step:not(:last-child)::after { content:"↓"; right:auto; left:50%; top:auto; bottom:-15px; transform:translateX(-50%); } .only-desktop { display:none; } }
  figure.ba { display:grid; grid-template-columns:1fr; gap:22px; max-width:680px; align-items:start; }
  figure.ba > .tag { justify-self:start; margin-bottom:0; }
  figure.ba .col { display:flex; flex-direction:column; align-items:flex-start; }
  figure.ba .col img { max-width:100%; }
  figure.ba .col.tall img { max-width:460px; }
  @media (max-width:700px) { figure.ba .col.tall img { max-width:100%; } }
  figure.video { max-width:640px; }
  figure.video video { width:100%; height:auto; display:block; border:1px solid var(--line); border-radius:4px; background:#000; }
  @media (max-width:700px) { figure.ba { gap:14px; } figure.video { max-width:100%; } }
  figure.gov { max-width:680px; }
  table.auto { width:100%; border-collapse:collapse; font-size:15px; line-height:1.45; border:1px solid var(--line); border-radius:6px; }
  table.auto th, table.auto td { text-align:left; vertical-align:top; padding:10px 12px; border-bottom:1px solid var(--line); }
  table.auto thead th { font-family:var(--hf); font-weight:600; font-size:15px; border-bottom:2px solid #111; }
  table.auto tbody th { font-weight:600; }
  table.auto td.mode { font-weight:600; color:var(--text); }
  table.auto td:last-child { color:var(--muted); }
  .gcards { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
  .gcard { border:1px solid var(--line); border-radius:6px; }
  .gtitle { font-family:var(--hf); font-weight:600; font-size:17px; margin:0; padding:12px 14px; border-bottom:2px solid #111; }
  .gitem { padding:10px 14px; border-bottom:1px solid var(--line); font-size:15px; line-height:1.4; }
  .gitem:last-child { border-bottom:0; }
  .gitem b { display:block; font-weight:600; }
  .gitem span { color:var(--muted); }
  .gitem i { font-style:normal; color:var(--accent); }
  @media (max-width:700px) {
    table.auto thead { display:none; }
    table.auto tr { display:block; padding:10px 12px; border-bottom:1px solid var(--line); }
    table.auto th, table.auto td { display:block; padding:0; border:0; }
    table.auto td.mode { margin:2px 0; }
    .gcards { grid-template-columns:1fr; }
  }
  figure.ccard-fig { max-width:360px; }
  .ccard { border:1.5px solid var(--text); border-radius:6px; padding:14px; display:flex; flex-direction:column; }
  .cgroup { border-radius:4px; padding:12px 14px 4px; }
  .cgroup.why { background:#E2F1F3; border-left:5px solid #6BB8C2; }
  .cgroup.how { background:#FBF0D6; border-left:5px solid #E2B65A; }
  .cg-label { font-family:var(--hf); font-weight:550; font-size:13px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); margin:0 0 6px !important; }
  .crow { padding:8px 0; border-top:1px solid rgba(17,17,17,.12); }
  .crow b { display:block; font-family:var(--hf); font-weight:600; font-size:17px; line-height:1.2; }
  .crow span { display:block; font-size:14px; line-height:1.4; color:var(--muted); margin-top:2px; }
  .cjoin { align-self:center; font-family:var(--hf); font-size:22px; line-height:1; color:var(--accent); margin:6px 0; }
  @media (max-width:700px) { figure.ccard-fig { max-width:100%; } }
  .zoom { display:block; position:relative; width:100%; padding:0; border:0; background:none; cursor:zoom-in; text-align:left; font:inherit; color:inherit; }
  .zoom .zi { display:none; }
  @media (max-width:700px) {
    .zoom .zi { display:inline-flex; align-items:center; gap:6px; position:absolute; left:50%; bottom:12px; transform:translateX(-50%); z-index:2; background:#111; color:#fff; font-size:14px; font-weight:600; padding:9px 14px; border-radius:999px; }
    .zoom .zi { left:auto; right:8px; bottom:8px; transform:none; font-size:13px; padding:7px 11px; }
  }
  dialog.lightbox { padding:0; border:0; margin:0; width:100vw; height:100vh; max-width:100vw; max-height:100vh; background:rgba(17,17,17,.94); }
  dialog.lightbox::backdrop { background:rgba(17,17,17,.94); }
  .lightbox .lb-scroll { height:100%; overflow:auto; padding:64px 16px 32px; box-sizing:border-box; }
  .lightbox img { display:block; width:100%; max-width:640px; height:auto; margin:0 auto; border-radius:4px; background:#fff; }
  .lightbox.wide img { width:max(min(100%,1200px),1000px); max-width:none; }
  .lightbox .lb-close { position:fixed; top:14px; right:14px; width:40px; height:40px; border-radius:50%; border:0; background:#fff; color:#111; font-size:22px; line-height:1; cursor:pointer; }

  /* Formación */
  table.pairs { width:100%; border-collapse:collapse; font-size:15px; line-height:1.45; }
  table.pairs th, table.pairs td { text-align:left; vertical-align:top; padding:10px 12px; border-bottom:1px solid var(--line); width:50%; }
  table.pairs thead th { font-family:var(--hf); font-weight:600; border-bottom:2px solid #111; }
  table.pairs td:first-child { color:var(--muted); }
  table.pairs td:last-child { font-weight:600; }
  @media (max-width:700px) {
    table.pairs thead { display:none; }
    table.pairs tr { display:block; padding:10px 0; border-bottom:1px solid var(--line); }
    table.pairs td { display:block; width:auto; padding:0; border:0; }
    table.pairs td:first-child::before { content:"Original: "; font-weight:600; }
    table.pairs td:last-child { margin-top:4px; }
    table.pairs td:last-child::before { content:"Conversacional: "; color:var(--accent); }
  }
  figure.dossier .dcard { display:flex; align-items:center; gap:20px; max-width:440px; text-decoration:none; color:var(--text); border:1px solid var(--line); border-radius:6px; padding:12px; }
  figure.dossier .dcard img { width:120px; border-radius:3px; flex:none; }
  figure.dossier .dlink { font-weight:600; font-size:16px; border-bottom:2px solid var(--accent); padding-bottom:2px; }
  figure.dossier .dcard:hover .dlink { color:var(--accent); }
  .quotes { display:grid; gap:14px; }
  .qcard { margin:0; padding:16px 18px; border-left:4px solid var(--accent); background:#F6F6F7; border-radius:0 6px 6px 0; }
  .qcard p { margin:0 0 10px; font-size:16px; line-height:1.55; }
  .qcard footer { font-size:14px; line-height:1.35; color:var(--muted); margin:0; padding:0; border:0; text-align:left; }
  .qcard footer strong { display:block; color:var(--text); }

  /* Datos: columnas al ancho del contenido, sin huecos excesivos */
  @media (min-width:701px) {
    .body .data { grid-template-columns:repeat(4,112px); justify-content:start; column-gap:40px; }
  }

  /* Subtítulos de figura: mismo tamaño y color que «Mi rol» */
  .body .fig-sub { font-size:16px; color:var(--muted); margin:0 0 16px; }

  /* Territorios creativos (naming Aqua) */
  .terrs { display:grid; grid-template-columns:repeat(5,1fr); gap:8px; }
  .terr { position:relative; border:1px solid var(--line); border-radius:6px; padding:14px 10px 12px; background:#fff; }
  .terr li { white-space:nowrap; }
  .terr .tname { font-family:var(--hf); font-weight:600; font-size:16px; margin:0 0 8px; color:var(--text); }
  .terr ul { list-style:none; margin:0; padding:0; font-size:14px; line-height:1.35; color:var(--muted); }
  .terr li { margin:0 0 4px; }
  .terr.sel { border:2px solid var(--accent); }
  .terr li.pick { color:var(--text); font-weight:700; }
  .terr .tsel { position:absolute; top:-10px; left:10px; background:var(--accent); color:#fff; font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:2px 7px; border-radius:3px; }
  .terr-cap { font-weight:400; color:var(--muted); margin:10px 0 0; }
  @media (max-width:700px) {
    .terrs { grid-template-columns:1fr; gap:10px; }
    .terr { padding:10px 12px; }
    .terr .tname { margin:0 0 2px; }
    .terr ul { display:flex; flex-wrap:wrap; gap:0 14px; }
    .terr li { margin:0; }
    .terr.sel { padding-top:14px; }
  }

  .body .facts-line { font-size:16px; font-weight:700; line-height:1.5; color:var(--text); margin:0 0 22px; }


  /* titulares de sección (eyebrow) un poco más grandes */
  .eyebrow-home { font-size:24px; }
  @media (max-width:700px) { .eyebrow-home { font-size:20px; } }
  /* Diagramas en móvil: columna estrecha y centrada */
  @media (max-width:700px) { .diagram-box { text-align:center; } .flow, .flow6 { max-width:250px; margin:0 auto; } .flow .step, .flow6 .step { align-items:center; text-align:center; } .diagram-result { align-items:center; text-align:center; } }