/* Plantilla: Morning Light (motor Trayectoria) · estilos estáticos del arquetipo, iguales para todos los clientes */
:root{
  color-scheme:light;
  --bg:#F7F1DE; --card:#FCF9EF; --ink:#2F3322; --muted:#5F6448; --line:#E7DFC6;
  --accent:oklch(0.42 0.06 115);   /* #4C5129: 7,4:1 sobre --bg */
  --serif:'Gloock',Georgia,'Times New Roman',serif; --sans:'Hanken Grotesk',system-ui,-apple-system,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 var(--sans)}
a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
a:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:8px}
img{max-width:100%;display:block}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
h1,h2,h3{margin:0;text-wrap:balance;font-family:var(--serif);font-weight:400;overflow-wrap:anywhere}
.wrap{max-width:1120px;margin:0 auto;padding-inline:28px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:16px;top:16px;z-index:30;background:var(--ink);color:var(--bg);padding:12px 18px;min-height:44px;border-radius:999px}
.eyebrow{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);font-weight:600}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;max-width:100%;background:var(--accent);color:var(--bg);padding:12px 24px;border-radius:999px;font-weight:500;white-space:normal;text-align:center;transition:background .2s,transform .16s cubic-bezier(.23,1,.32,1)}
.btn:active{transform:scale(.97)}
@media (hover: hover) { .btn:hover {background:var(--ink)} }
.link{display:inline-flex;align-items:center;min-height:44px;max-width:100%;font-weight:600;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:5px;transition:color .2s}
.link:active{color:var(--accent)}
@media (hover: hover) { .link:hover {color:var(--accent)} }

/* ---------- cabecera ---------- */
header{display:flex;justify-content:space-between;align-items:center;padding-block:12px;gap:8px 20px}
header a.logo{display:inline-flex;align-items:center;min-height:44px;min-width:44px;font-family:var(--serif);font-size:22px;line-height:1.2;overflow-wrap:anywhere}
header nav{display:flex;gap:4px 14px;font-size:14px;color:var(--muted);flex-wrap:wrap;justify-content:flex-end;flex:1}
header nav a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;padding-inline:4px}
header a.lang{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;padding-inline:10px;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
@media (hover: hover) { header nav a:hover,header a.lang:hover {color:var(--ink)} }
header nav a:active,header a.lang:active{color:var(--ink)}
header nav a.book{color:var(--ink);font-weight:600;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:5px}

/* ---------- portada ---------- */
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);gap:48px;align-items:center;padding-block:32px 64px}
.hero .text{display:flex;flex-direction:column;gap:20px}
.hero h1{font-size:clamp(40px,6vw,76px);line-height:1.04;letter-spacing:-.01em;overflow-wrap:anywhere;hyphens:auto}
.hero .tag{font-size:clamp(19px,1.8vw,22px);color:var(--ink);max-width:480px;line-height:1.45}
.hero .roles{font-size:15px;color:var(--muted);max-width:480px}
.hero .ctas{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:6px}
.blob{margin:0;overflow:hidden;border-radius:58% 42% 50% 50% / 45% 50% 50% 55%}
.blob img{width:100%;height:100%;object-fit:cover}
.hero .blob{height:500px}
.hero .blob img{object-position:top center}

/* ---------- paneles ---------- */
.panel{background:var(--card);border-radius:32px;padding:44px;margin-bottom:24px}
.panel-head{display:flex;flex-direction:column;gap:10px;margin-bottom:28px;max-width:760px}
.panel-head h2{font-size:clamp(32px,3.8vw,46px);line-height:1.08}
.panel-head .lede{font-size:17px;color:var(--muted)}
.mini{background:var(--bg);border-radius:20px;padding:22px;min-width:0}

/* sobre mí + cifras (componente "tratamientos") */
.about{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:40px;align-items:start}
.about .text{display:flex;flex-direction:column;gap:16px;font-size:16.5px}
.about aside{display:flex;flex-direction:column;gap:18px}
.about aside blockquote{margin:0;font-family:var(--serif);font-size:clamp(22px,2.2vw,27px);line-height:1.3}
.about aside .personal{font-size:14.5px;color:var(--muted)}
.about aside .blob{height:320px;border-radius:50% 50% 42% 58% / 55% 45% 55% 45%}
.about aside .blob img{object-position:65% 30%}
.treat{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));gap:16px;margin-top:36px}
.treat .mini{container-type:inline-size;min-width:0}
.treat b{font-family:var(--serif);font-weight:400;font-size:min(58px,calc(100cqi / (var(--n,4) * .62)));line-height:1.05;display:block;overflow-wrap:anywhere}
.treat h3{font-family:var(--sans);font-weight:600;font-size:16px;margin-top:6px}
.treat p{font-size:15px;color:var(--muted);margin-top:2px}

/* trayectoria (componente "preguntas": acordeón) */
details{border-bottom:1px solid var(--line)}
details:first-of-type{border-top:1px solid var(--line)}
summary{list-style:none;display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr) auto;gap:20px;align-items:baseline;padding-block:22px;cursor:pointer;min-height:44px;-webkit-tap-highlight-color:transparent}
summary:active h3{color:var(--accent)}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-size:24px;line-height:1;color:var(--accent)}
details[open] summary::after{content:"−"}
summary .when{font-size:14.5px;color:var(--muted);font-weight:500;display:flex;flex-direction:column;gap:8px}
summary .now{align-self:flex-start;background:var(--accent);color:var(--bg);font-size:12px;font-weight:600;padding:2px 10px;border-radius:999px}
summary h3{font-size:clamp(21px,2.1vw,26px);line-height:1.2}
details .body{padding:0 0 24px 240px;display:flex;flex-direction:column;gap:14px;max-width:880px}
details .body p{color:var(--muted)}
.tags{display:flex;flex-wrap:wrap;gap:8px}
.tags li{background:var(--bg);border-radius:999px;padding:6px 14px;font-size:14px;overflow-wrap:anywhere}

/* ponencias */
.talks{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:16px}
.cat{display:flex;flex-direction:column;gap:12px}
.cat .top{display:flex;justify-content:space-between;align-items:center}
.cat .ic{width:46px;height:46px;border-radius:50%;background:var(--card);display:grid;place-items:center;color:var(--accent)}
.cat .ic svg{width:22px;height:22px}
.cat b{font-family:var(--serif);font-weight:400;font-size:56px;line-height:1;color:var(--accent)}
.cat h3{font-size:22px;line-height:1.15;min-height:2.3em}
.cat li{font-size:15px;overflow-wrap:anywhere;line-height:1.5;padding-block:9px;border-top:1px solid var(--line);color:var(--muted)}
.cat li strong{color:var(--ink);font-weight:600}

/* formación */
.edu{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr));gap:36px 40px;align-items:start}
.edu h3{font-size:26px;display:flex;justify-content:space-between;align-items:baseline;padding-bottom:10px}
.edu h3 span{font-family:var(--sans);font-size:13px;color:var(--muted)}
.edu li{display:grid;grid-template-columns:108px minmax(0,1fr);gap:16px;padding-block:13px;border-top:1px solid var(--line)}
.edu .yr{font-size:14px;color:var(--muted);font-variant-numeric:tabular-nums}
.edu strong{display:block;font-weight:600;line-height:1.35}
.edu .where{font-size:14px;color:var(--muted)}

/* artículos */
.articles{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:16px}
.articles .mini{display:flex;flex-direction:column;gap:10px}
.articles h3{font-size:25px;line-height:1.12}
.articles p{font-size:15px;color:var(--muted)}
.more{display:flex;flex-wrap:wrap;gap:14px 26px;margin-top:24px}

/* prensa */
.press{max-width:900px}
.press .quotes{display:flex;flex-direction:column;gap:24px}
.press blockquote{margin:0;font-family:var(--serif);font-size:clamp(23px,2.4vw,30px);line-height:1.25}
.press .source{font-size:14px;color:var(--muted);border-top:1px solid var(--line);padding-top:16px}
.press .blob{height:380px;border-radius:45% 55% 52% 48% / 50% 42% 58% 50%}
.press .blob img{object-position:68% 30%}

/* instituciones */
.orgs{display:flex;flex-wrap:wrap;gap:10px}
.orgs li{background:var(--bg);border-radius:999px;padding:10px 20px;font-size:15.5px;font-weight:500;overflow-wrap:anywhere}

/* contacto */
.contact{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:44px;align-items:center}
.contact.solo{grid-template-columns:minmax(0,1fr)}
.contact .blob{height:440px}
.contact .blob img{object-position:top center}
.contact .body{display:flex;flex-direction:column;gap:22px}
.contact h2{font-size:clamp(34px,4.2vw,52px);line-height:1.05}
.opts{display:grid;grid-template-columns:1fr;gap:10px}
.opts .mini{display:grid;grid-template-columns:minmax(0,210px) minmax(0,1fr) auto;gap:6px 20px;align-items:center;padding:18px 22px;min-height:44px;transition:transform .2s cubic-bezier(.23,1,.32,1)}
.opts a.mini:active{transform:scale(.985)}
.opts h3{font-size:22px;line-height:1.15}
.opts p{font-size:14px;color:var(--muted)}
.opts .go{font-weight:600;color:var(--accent)}
@media (hover: hover) { .opts a:hover h3 {text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px} }
.direct{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px}
.direct a.email{display:inline-flex;align-items:center;min-height:44px;max-width:100%;font-family:var(--serif);font-size:clamp(22px,2.4vw,28px)}
@media (hover: hover) { .direct a.email:hover {color:var(--accent)} }

footer{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px 24px;padding-block:20px 40px;font-size:13px;color:var(--muted)}
@media (hover: hover) { footer a:hover {color:var(--ink)} }
.credit,.trayectoria-credit{display:inline-flex;align-items:center;gap:6px}

/* ---------- responsive ---------- */
@media(max-width:1000px){
  .about,.press{grid-template-columns:minmax(0,1fr)}
  .contact{grid-template-columns:minmax(0,260px) minmax(0,1fr)}
}
@media(max-width:860px){
  .wrap{padding-inline:20px}
  header{flex-wrap:wrap;padding-block:6px 0}
  header a.logo{flex:1 1 0;min-width:calc(100% - 124px)}
  header a.lang{order:2}
  header nav{order:3;flex:1 0 100%;flex-wrap:nowrap;justify-content:flex-start;gap:4px;overflow-x:auto;scrollbar-width:none;margin-inline:-20px;padding-inline:16px;border-top:1px solid var(--line)}
  header nav::-webkit-scrollbar{display:none}
  header nav a{flex:0 0 auto;white-space:nowrap;padding-inline:12px}
  .hero{grid-template-columns:minmax(0,1fr);gap:28px;padding-block:20px 40px}
  .hero .blob{height:min(300px,38svh)}
  .panel{padding:24px;border-radius:24px}
  summary{grid-template-columns:minmax(0,1fr) auto;gap:8px 16px}
  summary .when{grid-column:1 / -1;flex-direction:row;align-items:center;gap:10px}
  details .body{padding:0 0 22px}
  .cat h3{min-height:0}
  .edu{gap:28px}
  .edu li{grid-template-columns:minmax(0,1fr);gap:2px}
  .press .blob,.about aside .blob{height:280px}
  .contact,.contact.solo{grid-template-columns:minmax(0,1fr);gap:24px}
  .contact .blob{height:300px;max-width:320px}
  .opts .mini{grid-template-columns:minmax(0,1fr);gap:6px}
  footer{flex-direction:column;align-items:flex-start}
}

/* Robustez (26/9/2026): un email o una palabra muy larga no debe desbordar
   la página en móvil (detectado con un email de 35 caracteres). */
a[href^="mailto:"], .email { overflow-wrap: anywhere; }
