@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&display=swap');

:root{
  --paper:#f4f0ea;
  --ink:#232521;
  --muted:#777a74;
  --line:#d8d3ca;
  --accent:#667163;
  --card:#f9f6f1;
  --soft:#ece7df;
  --max:1120px;
  --reading:760px;
}
html[data-theme="dark"]{
  --paper:#171816;
  --ink:#f0eee8;
  --muted:#a6aaa2;
  --line:#343630;
  --accent:#a9b9a4;
  --card:#20221f;
  --soft:#252824;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:110px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',Arial,sans-serif;transition:background .2s ease,color .2s ease}
img{max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
a:hover{color:var(--accent)}

.site-header{
  position:sticky;
  top:0;
  z-index:30;
  border-bottom:1px solid var(--line);
  background:color-mix(in srgb,var(--paper) 92%,transparent);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px)
}
.header-grid{
  max-width:var(--max);
  margin:auto;
  min-height:112px;
  padding:12px 32px;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:24px;
}
.header-nav{display:flex;align-items:center;gap:22px;font-size:14px;font-weight:600;color:var(--muted)}
.header-nav--left{justify-self:start}
.home-link{
  width:34px;height:34px;border:1px solid var(--line);border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
}
.home-link svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.brand-center{justify-self:center;display:flex;flex-direction:column;align-items:center;gap:7px;text-align:center}
.brand-crop{width:104px;height:104px;display:block;position:relative}
.brand-mark{position:absolute;inset:0;width:100%;height:100%;display:block}
.brand-mark--dark{display:none}
html[data-theme="dark"] .brand-mark--light{display:none}
html[data-theme="dark"] .brand-mark--dark{display:block}
.brand-collection{
  max-width:260px;
  font-family:'Libre Baskerville',Georgia,serif;
  font-size:18px;
  line-height:1.2;
  font-weight:700;
  color:var(--ink);
}
.header-actions{justify-self:end;display:flex;align-items:center;gap:16px}
.language-link{font-size:14px;font-weight:600;color:var(--muted)}
.theme-switch{display:flex;align-items:center;gap:5px}
.theme-switch button{
  width:34px;height:34px;padding:0;border:1px solid var(--line);border-radius:50%;
  background:transparent;color:var(--muted);display:grid;place-items:center;cursor:pointer
}
.theme-switch button[aria-pressed="true"]{color:var(--ink);background:var(--soft)}
.theme-switch svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

.home-intro{
  max-width:var(--max);
  margin:auto;
  padding:18px 32px 22px;
  border-bottom:1px solid var(--line)
}
.eyebrow{text-transform:uppercase;letter-spacing:.18em;color:var(--accent);font-weight:700;font-size:12px}
.home-intro p{
  margin:0;
  max-width:820px;
  font:400 15px/1.58 Georgia,'Times New Roman',serif;
  color:var(--muted)
}
.home-intro p strong{color:var(--ink);font-weight:700}

.featured-wrap{max-width:var(--max);margin:auto;padding:0 32px 60px}
.featured-story{
  display:grid;grid-template-columns:minmax(0,1.4fr) minmax(280px,.8fr);
  min-height:390px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
}
.featured-story__media{min-height:360px;overflow:hidden;background:var(--soft)}
.featured-story__media img{width:100%;height:100%;object-fit:cover;display:block}
.featured-story__copy{display:flex;flex-direction:column;justify-content:center;padding:42px 0 42px 42px}
.featured-story__copy h2{
  margin:12px 0 18px;font:400 clamp(31px,4vw,48px)/1.2 'Libre Baskerville',Georgia,serif;letter-spacing:-.04em
}
.featured-story__copy p{margin:0;color:var(--muted);font-size:14px}

.recent-section,.archive-page{max-width:var(--max);margin:auto;padding:0 32px 90px}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:18px}
.section-heading h2,.section-heading--page h1{
  margin:0;font:400 28px/1.25 'Libre Baskerville',Georgia,serif
}
.section-heading--page{padding-top:66px;margin-bottom:28px}
.section-heading--page h1{font-size:clamp(36px,5vw,54px);margin-top:10px}
.section-heading span{font-size:14px;color:var(--muted)}
.recent-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  border-top:1px solid var(--line);column-gap:34px
}
.story-card{
  display:grid;grid-template-columns:124px minmax(0,1fr);gap:18px;
  padding:20px 0;border-bottom:1px solid var(--line);min-width:0
}
.story-card img,.story-card__placeholder{
  width:124px;height:92px;object-fit:cover;background:var(--soft);display:block
}
.story-card__copy{min-width:0}
.kind{color:var(--accent);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.12em}
.story-card h3{margin:5px 0 9px;font:400 21px/1.38 'Libre Baskerville',Georgia,serif;letter-spacing:-.02em}
.story-card time{font-size:13px;color:var(--muted)}
.section-more{padding-top:26px}
.section-more a{font-size:14px;font-weight:700;border-bottom:1px solid currentColor;padding-bottom:3px}

.archive-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:34px;border-top:1px solid var(--line)}

.article{max-width:var(--reading);margin:0 auto;padding:70px 26px 110px}
.article-header{padding-bottom:36px;border-bottom:1px solid var(--line);margin-bottom:38px}
.article-header h1{
  margin:17px 0 22px;
  font:400 clamp(38px,6vw,62px)/1.16 'Libre Baskerville',Georgia,serif;
  letter-spacing:-.05em;
}
.article-deck{
  margin:-6px 0 20px;
  max-width:680px;
  color:var(--muted);
  font:italic 18px/1.55 Georgia,'Times New Roman',serif;
  text-align:left
}
.meta{display:flex;flex-wrap:wrap;gap:8px;color:var(--muted);font-size:14px;line-height:1.6}
.translation{
  display:inline-block;margin-top:18px;padding-bottom:3px;border-bottom:1px solid var(--accent);
  color:var(--accent);font-size:14px;font-weight:600
}

.prose{font:400 21px/1.9 Georgia,'Times New Roman',serif;overflow-wrap:anywhere;text-align:left}
.prose .section,.prose .section-content,.prose .section-inner{display:contents}
.prose p{margin:0 0 1.35em;text-align:left}
.prose strong{font-weight:700}
.prose h2,.prose h3,.prose h4{margin:2em 0 .8em;font-family:'Libre Baskerville',Georgia,serif;line-height:1.35;font-weight:400}
.article-component--media{
  width:min(1040px,calc(100vw - 32px));
  margin:40px 0 48px;
  margin-left:50%;
  transform:translateX(-50%);
}
.article-component--media .article-media{
  margin:0;
  padding:8px 8px 12px;
  border:1px solid color-mix(in srgb,var(--accent) 26%,var(--line));
  border-radius:16px;
  background:var(--card);
  box-shadow:0 10px 28px color-mix(in srgb,var(--accent) 9%,transparent);
  overflow:hidden
}
.prose figure.article-media{
  width:min(960px,calc(100vw - 48px));
  margin:42px 0 48px;
  margin-left:50%;
  transform:translateX(-50%);
}
.prose img,.article-component--media img{
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
  margin:0 auto;
  border-radius:11px
}
.prose figcaption,.prose .imageCaption,
.article-component--media figcaption,.article-component--media .imageCaption{
  max-width:760px;
  margin:12px auto 0;
  padding:0 10px 2px;
  color:var(--muted);
  font:14px/1.6 'DM Sans',sans-serif;
  text-align:left
}
.prose a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.prose hr{border:0;border-top:1px solid var(--line);margin:42px 0}

.opening-quote{
  position:relative;
  margin:0;
  padding:5px 0 5px 20px;
  border:0;
  border-left:3px solid var(--accent);
  border-radius:0;
  background:transparent;
  box-shadow:none;
  font-family:Georgia,'Times New Roman',serif;
  color:var(--ink)
}
.opening-quote::before{content:none}
.opening-quote p{
  margin:0;
  font-size:27px;
  line-height:1.48;
  font-style:italic
}
.opening-quote cite{
  display:block;
  margin-top:12px;
  padding:0;
  border:0;
  color:var(--muted);
  font:14px/1.5 'DM Sans',sans-serif;
  font-style:normal
}

.support-card{
  margin:0;
  padding:20px 22px;
  border:1px solid var(--line);
  border-left:4px solid var(--accent);
  border-radius:12px;
  background:color-mix(in srgb,var(--accent) 7%,var(--card));
  color:var(--ink);
  font:17px/1.62 'DM Sans',sans-serif;
  text-align:left;
  box-shadow:none
}
.support-card a{
  color:var(--accent);
  font-weight:700;
  text-decoration:none;
  border-bottom:1px solid currentColor
}

.footnote-ref{font:700 10px/1 'DM Sans',sans-serif;vertical-align:super;margin-left:1px}
.footnote-ref a{text-decoration:none;color:var(--accent)}
.references{margin-top:54px;padding-top:26px;border-top:1px solid var(--line)}
.references h2{margin:0 0 20px;font:400 23px/1.3 'Libre Baskerville',Georgia,serif}
.reference-entry{position:relative;margin:0!important;padding:14px 15px;border-radius:8px;font:16px/1.65 'DM Sans',sans-serif;transition:background .2s ease}
.reference-entry:has(.footnote-anchor:target){background:var(--soft)}
.footnote-anchor{position:relative;top:-110px;visibility:hidden}
.footnote-backs{white-space:nowrap;margin-left:6px}
.footnote-back{text-decoration:none!important;color:var(--accent);font-weight:700}

.sitefooter{
  max-width:var(--max);margin:auto;padding:28px 32px 48px;border-top:1px solid var(--line);
  color:var(--muted);font-size:14px;text-align:center
}
.sitefooter a{text-decoration:none}
.sitefooter a:hover{text-decoration:underline;text-underline-offset:3px}

@media(max-width:850px){
  .header-grid{min-height:94px;padding:10px 20px;gap:12px}
  .brand-crop{width:82px;height:82px}
  .brand-collection{font-size:17px;max-width:220px}
  .header-nav{gap:12px;font-size:13px}
  .header-actions{gap:10px}
  .language-link{font-size:13px}
  .theme-switch button{width:31px;height:31px}

  .home-intro{padding:14px 20px 18px}
  .home-intro p{font-size:13.5px;line-height:1.55}

  .featured-wrap{padding:0 20px 46px}
  .featured-story{grid-template-columns:1fr}
  .featured-story__media{min-height:0;aspect-ratio:16/9}
  .featured-story__copy{padding:24px 2px 30px}
  .featured-story__copy h2{font-size:31px}

  .recent-section,.archive-page{padding-left:20px;padding-right:20px}
  .recent-grid,.archive-list{grid-template-columns:1fr}
  .story-card{grid-template-columns:106px minmax(0,1fr);gap:15px;padding:18px 0}
  .story-card img,.story-card__placeholder{width:106px;height:82px}
  .story-card h3{font-size:20px;margin-top:4px}
  .section-heading--page{padding-top:50px}

  .article{padding:50px 20px 80px}
  .article-header{padding-bottom:28px;margin-bottom:30px}
  .article-header h1{font-size:clamp(35px,10vw,48px)}
  .article-deck{font-size:17px;margin-bottom:18px}
  .prose{font-size:20px;line-height:1.86}
  .opening-quote{padding:4px 0 4px 16px;margin:0}
  .opening-quote p{font-size:24px;line-height:1.5}
  .opening-quote cite{font-size:12.5px}
  .support-card{margin:0;padding:20px 18px;font-size:17px}
  .prose figure.article-media{width:calc(100vw - 24px);margin-top:34px;margin-bottom:40px}
}
@media(max-width:560px){
  .header-grid{grid-template-columns:1fr auto 1fr;padding-left:12px;padding-right:12px;gap:7px}
  .header-nav{gap:7px;font-size:10.5px}
  .home-link{width:30px;height:30px}
  .home-link svg{width:15px;height:15px}
  .brand-crop{width:76px;height:76px}
  .brand-collection{font-size:16px;max-width:205px}
  .header-actions{gap:5px}
  .language-link{font-size:10.5px}
  .theme-switch{gap:2px}
  .theme-switch button{width:27px;height:27px}
  .theme-switch svg{width:14px;height:14px}
}

.translation-note{
  margin:38px 0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:none!important;
  box-shadow:none!important;
  color:var(--accent)!important;
  font:italic 15.5px/1.7 'Libre Baskerville',Georgia,serif!important;
  text-align:left!important
}
.translation-note a{
  color:var(--accent)!important;
  font-weight:700;
  font-style:italic;
  text-decoration:underline!important;
  text-decoration-thickness:1px!important;
  text-underline-offset:4px!important
}

.hh-lightbox-trigger{
  position:relative;
  display:block;
  margin:0 auto;
  padding:0;
  border:0;
  background:none;
  cursor:zoom-in;
  max-width:100%
}
.hh-lightbox-trigger img{
  transition:transform .18s ease,box-shadow .18s ease;
  box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 18%,transparent),0 12px 34px color-mix(in srgb,var(--accent) 14%,transparent)
}
.hh-lightbox-trigger:hover img{
  transform:translateY(-1px);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 28%,transparent),0 14px 38px color-mix(in srgb,var(--accent) 20%,transparent)
}
.hh-lightbox-overlay{
  position:fixed;
  inset:0;
  z-index:9999;
  display:none;
  place-items:center;
  padding:28px;
  background:rgba(9,11,9,.86);
  backdrop-filter:blur(10px)
}
.hh-lightbox-overlay.is-open{display:grid}
.hh-lightbox-open{overflow:hidden}
.hh-lightbox-dialog{
  position:relative;
  width:min(1200px,96vw);
  max-height:92vh;
  display:grid;
  place-items:center
}
.hh-lightbox-glow{
  max-width:100%;
  max-height:82vh;
  padding:2px;
  border-radius:16px;
  background:linear-gradient(135deg,var(--accent),transparent 70%);
  box-shadow:0 0 34px color-mix(in srgb,var(--accent) 36%,transparent)
}
.hh-lightbox-image{
  display:block;
  max-width:100%;
  max-height:80vh;
  object-fit:contain;
  border-radius:14px;
  background:#111
}
.hh-lightbox-caption{
  margin-top:12px;
  max-width:900px;
  color:#ddd;
  font:14px/1.55 'DM Sans',sans-serif;
  text-align:center
}
.hh-lightbox-caption a{color:#fff;text-decoration:underline}
.hh-lightbox-close,.hh-lightbox-nav{
  position:absolute;
  z-index:2;
  border:1px solid rgba(255,255,255,.22);
  background:rgba(20,22,20,.72);
  color:#fff;
  cursor:pointer
}
.hh-lightbox-close{
  top:-16px;right:-8px;
  width:42px;height:42px;border-radius:50%;
  font-size:28px;line-height:1
}
.hh-lightbox-nav{
  top:50%;transform:translateY(-50%);
  width:44px;height:58px;border-radius:999px;
  font-size:34px;line-height:1
}
.hh-lightbox-prev{left:-18px}
.hh-lightbox-next{right:-18px}

@media(max-width:700px){
  .hh-lightbox-overlay{padding:14px}
  .hh-lightbox-close{top:-10px;right:-2px}
  .hh-lightbox-prev{left:2px}
  .hh-lightbox-next{right:2px}
  .hh-lightbox-nav{width:38px;height:50px;font-size:28px}
}

.article-component{display:block;clear:both}
.article-component--quote{margin:0 0 38px}
.article-component--support{margin:64px 0 34px}
.article-component--quote .opening-quote{margin:0}
.article-component--support .support-card{margin:0}
.article-body{margin-top:0}

.hh-lightbox-hint{
  position:absolute;
  top:12px;
  right:12px;
  width:36px;
  height:36px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#fff;
  background:rgba(20,24,20,.72);
  border:1px solid rgba(255,255,255,.34);
  backdrop-filter:blur(6px);
  box-shadow:0 4px 14px rgba(0,0,0,.18);
  pointer-events:none
}
.hh-lightbox-hint svg{
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round
}

@media(max-width:850px){
  .article-component--media{
    width:calc(100vw - 12px);
    margin-top:34px;
    margin-bottom:40px
  }
  .article-component--media .article-media{padding:6px 6px 9px;border-radius:15px}
  .article-component--media img{border-radius:10px}
  .article-component--media figcaption,
  .article-component--media .imageCaption{padding:0 8px 1px;font-size:13px}
  .hh-lightbox-hint{top:10px;right:10px;width:34px;height:34px}
}

/* Normalización final del cuerpo editorial: independiente del HTML heredado de Medium. */
.article-body{
  font-family:'Libre Baskerville',Georgia,'Times New Roman',serif;
  font-size:20px;
  line-height:2.02;
  text-align:left
}
.article-body > p{
  display:block;
  margin:0 0 1.5em;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:none!important;
  box-shadow:none!important;
  font:inherit;
  line-height:inherit;
  text-align:left
}
.article-body > p > strong,
.article-body strong{
  padding:0!important;
  border:0!important;
  background:none!important;
  box-shadow:none!important;
  font-weight:700
}
.article-body em{font-style:italic}
.article-body > p:last-child{margin-bottom:0}
@media(max-width:850px){
  .article-body{font-size:19.5px;line-height:2.04}
  .article-body > p{margin-bottom:1.48em}
}

.translation-note em{
  color:inherit!important;
  font-style:inherit
}


/* Atribución indivisible: autor, título de obra y año comparten una sola línea tipográfica.
   Los enlaces/énfasis de Medium no deben imponer un tamaño ni un bloque nuevo. */
.opening-quote .quote-attribution{
  display:block;
  margin-top:12px;
  font:normal 14px/1.55 'DM Sans',Arial,sans-serif;
  color:var(--muted);
  text-align:left;
  white-space:normal;
}
.opening-quote .quote-attribution a,
.opening-quote .quote-attribution em,
.opening-quote .quote-attribution strong,
.opening-quote .quote-attribution span{
  display:inline;
  font-size:inherit!important;
  line-height:inherit!important;
  font-family:inherit!important;
  color:inherit;
  vertical-align:baseline;
}
.opening-quote .quote-attribution a{
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:3px;
  font-style:italic;
}
@media(max-width:850px){
  .opening-quote .quote-attribution{font-size:13px}
}

.editorial-note{
  margin:38px 0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:none!important;
  box-shadow:none!important;
  color:var(--accent)!important;
  font:italic 15.5px/1.7 'Libre Baskerville',Georgia,serif!important;
  text-align:left!important
}
.editorial-note em{
  color:inherit!important;
  font-style:inherit
}
